Skip to content

Commit 06aaef7

Browse files
liujupingJackLian
authored andcommitted
fix: fixed an issue where the outline tree was not displayed correctly when deleting a node
1 parent ebe21c4 commit 06aaef7

6 files changed

Lines changed: 44 additions & 34 deletions

File tree

packages/designer/src/document/document-model.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -342,18 +342,18 @@ export class DocumentModel implements IDocumentModel {
342342
}
343343

344344
onChangeNodeVisible(fn: (node: INode, visible: boolean) => void): IPublicTypeDisposable {
345-
this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
345+
this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
346346

347347
return () => {
348-
this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
348+
this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
349349
};
350350
}
351351

352352
onChangeNodeChildren(fn: (info: IPublicTypeOnChangeOptions<INode>) => void): IPublicTypeDisposable {
353-
this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
353+
this.designer.editor?.eventBus.on(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
354354

355355
return () => {
356-
this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_VISIBLE_CHANGE, fn);
356+
this.designer.editor?.eventBus.off(EDITOR_EVENT.NODE_CHILDREN_CHANGE, fn);
357357
};
358358
}
359359

packages/designer/src/document/node/node.ts

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -98,11 +98,11 @@ export interface IBaseNode<Schema extends IPublicTypeNodeSchema = IPublicTypeNod
9898
/**
9999
* 导出 schema
100100
*/
101-
export<T = IPublicTypeNodeSchema>(stage: IPublicEnumTransformStage, options?: any): T;
101+
export<T = Schema>(stage: IPublicEnumTransformStage, options?: any): T;
102102

103103
emitPropChange(val: IPublicTypePropChangeOptions): void;
104104

105-
import(data: IPublicTypeNodeSchema, checkId?: boolean): void;
105+
import(data: Schema, checkId?: boolean): void;
106106

107107
internalSetSlotFor(slotFor: Prop | null | undefined): void;
108108

@@ -394,7 +394,10 @@ export class Node<Schema extends IPublicTypeNodeSchema = IPublicTypeNodeSchema>
394394
editor?.eventBus.emit(EDITOR_EVENT.NODE_VISIBLE_CHANGE, this, visible);
395395
});
396396
this.onChildrenChange((info?: { type: string; node: INode }) => {
397-
editor?.eventBus.emit(EDITOR_EVENT.NODE_VISIBLE_CHANGE, info);
397+
editor?.eventBus.emit(EDITOR_EVENT.NODE_CHILDREN_CHANGE, {
398+
type: info?.type,
399+
node: this,
400+
});
398401
});
399402
}
400403

packages/plugin-outline-pane/src/controllers/tree.ts

Lines changed: 4 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -20,23 +20,10 @@ export class Tree {
2020
const doc = this.pluginContext.project.currentDocument;
2121
this.id = doc?.id;
2222

23-
doc?.onMountNode((payload: {node: IPublicModelNode }) => {
24-
const { node } = payload;
25-
const parentNode = node.parent;
26-
if (!parentNode) {
27-
return;
28-
}
29-
const parentTreeNode = this.getTreeNodeById(parentNode.id);
30-
parentTreeNode?.notifyExpandableChanged();
31-
});
32-
33-
doc?.onRemoveNode((node: IPublicModelNode) => {
34-
const parentNode = node.parent;
35-
if (!parentNode) {
36-
return;
37-
}
38-
const parentTreeNode = this.getTreeNodeById(parentNode.id);
39-
parentTreeNode?.notifyExpandableChanged();
23+
doc?.onChangeNodeChildren((info: {node: IPublicModelNode }) => {
24+
const { node } = info;
25+
const treeNode = this.getTreeNodeById(node.id);
26+
treeNode?.notifyExpandableChanged();
4027
});
4128
}
4229

packages/plugin-outline-pane/src/views/tree-branches.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export default class TreeBranches extends PureComponent<{
99
isModal?: boolean;
1010
pluginContext: IPublicModelPluginContext;
1111
expanded: boolean;
12+
treeChildren: TreeNode[] | null;
1213
}> {
1314
state = {
1415
filterWorking: false,
@@ -56,13 +57,13 @@ export default class TreeBranches extends PureComponent<{
5657
treeNode={treeNode}
5758
isModal={isModal || false}
5859
pluginContext={this.props.pluginContext}
60+
treeChildren={this.props.treeChildren}
5961
/>
6062
</div>
6163
);
6264
}
6365
}
6466

65-
6667
interface ITreeNodeChildrenState {
6768
filterWorking: boolean;
6869
matchSelf: boolean;
@@ -73,6 +74,7 @@ class TreeNodeChildren extends PureComponent<{
7374
treeNode: TreeNode;
7475
isModal?: boolean;
7576
pluginContext: IPublicModelPluginContext;
77+
treeChildren: TreeNode[] | null;
7678
}, ITreeNodeChildrenState> {
7779
state: ITreeNodeChildrenState = {
7880
filterWorking: false,
@@ -115,7 +117,7 @@ class TreeNodeChildren extends PureComponent<{
115117
}
116118

117119
render() {
118-
const { treeNode, isModal } = this.props;
120+
const { isModal } = this.props;
119121
const children: any = [];
120122
let groupContents: any[] = [];
121123
let currentGrp: IPublicModelExclusiveGroup;
@@ -150,7 +152,7 @@ class TreeNodeChildren extends PureComponent<{
150152
})}
151153
/>
152154
);
153-
treeNode.children?.forEach((child, index) => {
155+
this.props.treeChildren?.forEach((child, index) => {
154156
const childIsModal = child.node.componentMeta?.isModal || false;
155157
if (isModal != childIsModal) {
156158
return;
@@ -178,7 +180,7 @@ class TreeNodeChildren extends PureComponent<{
178180
}
179181
});
180182
endGroup();
181-
const length = treeNode.children?.length || 0;
183+
const length = this.props.treeChildren?.length || 0;
182184
if (dropIndex != null && dropIndex >= length) {
183185
children.push(insertion);
184186
}

packages/plugin-outline-pane/src/views/tree-node.tsx

Lines changed: 23 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import TreeNode from '../controllers/tree-node';
44
import TreeTitle from './tree-title';
55
import TreeBranches from './tree-branches';
66
import { IconEyeClose } from '../icons/eye-close';
7-
import { IPublicModelPluginContext, IPublicModelModalNodesManager, IPublicModelDocumentModel, IPublicTypeDisposable } from '@alilc/lowcode-types';
7+
import { IPublicModelPluginContext, IPublicModelModalNodesManager, IPublicTypeDisposable } from '@alilc/lowcode-types';
88

99
class ModalTreeNodeView extends PureComponent<{
1010
treeNode: TreeNode;
@@ -49,6 +49,7 @@ class ModalTreeNodeView extends PureComponent<{
4949
<div className="tree-pane-modal-content">
5050
<TreeBranches
5151
treeNode={rootTreeNode}
52+
treeChildren={rootTreeNode.children}
5253
expanded={expanded}
5354
isModal
5455
pluginContext={this.pluginContext}
@@ -65,7 +66,19 @@ export default class TreeNodeView extends PureComponent<{
6566
pluginContext: IPublicModelPluginContext;
6667
isRootNode?: boolean;
6768
}> {
68-
state = {
69+
state: {
70+
expanded: boolean;
71+
selected: boolean;
72+
hidden: boolean;
73+
locked: boolean;
74+
detecting: boolean;
75+
isRoot: boolean;
76+
highlight: boolean;
77+
dropping: boolean;
78+
conditionFlow: boolean;
79+
expandable: boolean;
80+
treeChildren: TreeNode[] | null;
81+
} = {
6982
expanded: false,
7083
selected: false,
7184
hidden: false,
@@ -76,6 +89,7 @@ export default class TreeNodeView extends PureComponent<{
7689
dropping: false,
7790
conditionFlow: false,
7891
expandable: false,
92+
treeChildren: [],
7993
};
8094

8195
eventOffCallbacks: Array<IPublicTypeDisposable | undefined> = [];
@@ -95,6 +109,7 @@ export default class TreeNodeView extends PureComponent<{
95109
conditionFlow: treeNode.node.conditionGroup != null,
96110
highlight: treeNode.isFocusingNode(),
97111
expandable: treeNode.expandable,
112+
treeChildren: treeNode.children,
98113
};
99114
}
100115

@@ -114,11 +129,13 @@ export default class TreeNodeView extends PureComponent<{
114129
this.setState({ locked });
115130
});
116131
treeNode.onExpandableChanged((expandable: boolean) => {
117-
this.setState({ expandable });
132+
this.setState({
133+
expandable,
134+
treeChildren: treeNode.children,
135+
});
118136
});
119-
120137
this.eventOffCallbacks.push(
121-
doc?.onDropLocationChanged((document: IPublicModelDocumentModel) => {
138+
doc?.onDropLocationChanged(() => {
122139
this.setState({
123140
dropping: treeNode.dropDetail?.index != null,
124141
});
@@ -210,6 +227,7 @@ export default class TreeNodeView extends PureComponent<{
210227
isModal={false}
211228
expanded={this.state.expanded}
212229
pluginContext={this.props.pluginContext}
230+
treeChildren={this.state.treeChildren}
213231
/>
214232
</div>
215233
);

packages/shell/src/model/document-model.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -300,7 +300,7 @@ export class DocumentModel implements IPublicModelDocumentModel {
300300
* @param fn
301301
*/
302302
onChangeNodeChildren(fn: (info: IPublicTypeOnChangeOptions) => void): IPublicTypeDisposable {
303-
return this[documentSymbol].onChangeNodeChildren((info?: IPublicTypeOnChangeOptions) => {
303+
return this[documentSymbol].onChangeNodeChildren((info?: IPublicTypeOnChangeOptions<InnerNode>) => {
304304
if (!info) {
305305
return;
306306
}

0 commit comments

Comments
 (0)