github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2025-12-14 13:03:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(outline-pane): tree does not change when doc.importSchema call

Browse Source
This commit is contained in:
liujuping 2023-06-07 17:58:54 +08:00 committed by 林熠
parent 6015c5d1d1
commit 7eed0966e9
7 changed files with 26 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/plugin-outline-pane/src/controllers/pane-controller.ts
View File

@ -593,7 +593,7 @@ export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTy
// at this moment, it is possible that pane is not ready yet, so
// put ui related operations to the next loop
setTimeout(() => {
tree.setNodeSelected(treeNode.id);
tree.setNodeSelected(treeNode.nodeId);
this.scrollToNode(treeNode, null, 4);
}, 0);
}
@ -615,21 +615,21 @@ export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTy
if (!this._shell) {
return undefined;
}
return this._shell.querySelector(`.tree-node[data-id="${treeNode.id}"]`)?.getBoundingClientRect();
return this._shell.querySelector(`.tree-node[data-id="${treeNode.nodeId}"]`)?.getBoundingClientRect();
}
private getTreeTitleRect(treeNode: TreeNode): DOMRect | undefined {
if (!this._shell) {
return undefined;
}
return this._shell.querySelector(`.tree-node-title[data-id="${treeNode.id}"]`)?.getBoundingClientRect();
return this._shell.querySelector(`.tree-node-title[data-id="${treeNode.nodeId}"]`)?.getBoundingClientRect();
}
private getTreeSlotsRect(treeNode: TreeNode): DOMRect | undefined {
if (!this._shell) {
return undefined;
}
return this._shell.querySelector(`.tree-node-slots[data-id="${treeNode.id}"]`)?.getBoundingClientRect();
return this._shell.querySelector(`.tree-node-slots[data-id="${treeNode.nodeId}"]`)?.getBoundingClientRect();
}
}

10
packages/plugin-outline-pane/src/controllers/tree-node.ts
View File

@ -4,7 +4,7 @@ import {
IPublicModelNode,
IPublicTypeDisposable,
} from '@alilc/lowcode-types';
import { isI18nData, isLocationChildrenDetail } from '@alilc/lowcode-utils';
import { isI18nData, isLocationChildrenDetail, uniqueId } from '@alilc/lowcode-utils';
import EventEmitter from 'events';
import { Tree } from './tree';
import { IOutlinePanelPluginContext } from './tree-master';
@ -60,7 +60,9 @@ export default class TreeNode {
*/
private _expanded = false;
get id(): string {
id = uniqueId('treeNode');
get nodeId(): string {
return this.node.id;
}
@ -256,7 +258,7 @@ export default class TreeNode {
return false;
}
return (
isLocationChildrenDetail(loc.detail) && loc.detail.focus?.type === 'node' && loc.detail?.focus?.node.id === this.id
isLocationChildrenDetail(loc.detail) && loc.detail.focus?.type === 'node' && loc.detail?.focus?.node.id === this.nodeId
);
}
@ -278,7 +280,7 @@ export default class TreeNode {
if (!loc) {
return false;
}
return loc.target?.id === this.id;
return loc.target?.id === this.nodeId;
}
setTitleLabel(label: string) {

4
packages/plugin-outline-pane/src/controllers/tree.ts
View File

@ -45,6 +45,10 @@ export class Tree {
const treeNode = this.getTreeNodeById(node.id);
treeNode?.setHidden(!visible);
});
doc?.onImportSchema(() => {
this.treeNodesMap = new Map<string, TreeNode>();
});
}
setNodeSelected(nodeId: string): void {

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

@ -169,12 +169,12 @@ class TreeNodeChildren extends PureComponent<{
children.push(insertion);
}
}
groupContents.push(<TreeNodeView key={child.id} treeNode={child} isModal={isModal} />);
groupContents.push(<TreeNodeView key={child.nodeId} treeNode={child} isModal={isModal} />);
} else {
if (index === dropIndex) {
children.push(insertion);
}
children.push(<TreeNodeView key={child.id} treeNode={child} isModal={isModal} />);
children.push(<TreeNodeView key={child.nodeId} treeNode={child} isModal={isModal} />);
}
});
endGroup();
@ -201,14 +201,14 @@ class TreeNodeSlots extends PureComponent<{
className={classNames('tree-node-slots', {
'insertion-at-slots': treeNode.dropDetail?.focus?.type === 'slots',
})}
data-id={treeNode.id}
data-id={treeNode.nodeId}
>
<div className="tree-node-slots-title">
{/* @ts-ignore */}
<Title title={{ type: 'i18n', intl: this.props.treeNode.pluginContext.intlNode('Slots') }} />
</div>
{treeNode.slots.map(tnode => (
<TreeNodeView key={tnode.id} treeNode={tnode} />
<TreeNodeView key={tnode.nodeId} treeNode={tnode} />
))}
</div>
);

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

@ -225,7 +225,7 @@ export default class TreeNodeView extends PureComponent<{
return (
<div
className={className}
data-id={treeNode.id}
data-id={treeNode.nodeId}
>
<TreeTitle
treeNode={treeNode}

2
packages/plugin-outline-pane/src/views/tree-title.tsx
View File

@ -135,7 +135,7 @@ export default class TreeTitle extends PureComponent<{
<div
className={classNames('tree-node-title', { editing })}
style={style}
data-id={treeNode.id}
data-id={treeNode.nodeId}
onClick={() => {
if (isModal) {
if (this.state.visible) {

7
packages/plugin-outline-pane/src/views/tree.tsx
View File

@ -91,7 +91,7 @@ export default class TreeView extends PureComponent<{
private onDoubleClick = (e: ReactMouseEvent) => {
e.preventDefault();
const treeNode = this.getTreeNodeFromEvent(e);
if (treeNode?.id === this.state.root?.id) {
if (treeNode?.nodeId === this.state.root?.nodeId) {
return;
}
if (!treeNode?.expanded) {
@ -188,6 +188,11 @@ export default class TreeView extends PureComponent<{
root: tree.root,
});
});
doc?.onImportSchema(() => {
this.setState({
root: tree.root,
});
});
}
render() {