From 3709e36238a084a62e53be51a242554eed05e62f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E8=B1=AA=E7=8F=A3?= <519367854@qq.com> Date: Wed, 6 Mar 2024 22:11:06 +0800 Subject: [PATCH] =?UTF-8?q?perf:=20=E6=9B=B4=E6=96=B0node=E8=8A=82?= =?UTF-8?q?=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../core/events/mutation/AppendNodeEvent.ts | 6 + .../core/events/mutation/CloneNodeEvent.ts | 6 + src/app/core/events/mutation/FromNodeEvent.ts | 19 + .../core/events/mutation/InsertAfterEvent.ts | 6 + .../core/events/mutation/InsertBeforeEvent.ts | 6 + .../events/mutation/InsertChildrenEvent.ts | 6 + .../core/events/mutation/PrependNodeEvent.ts | 6 + .../core/events/mutation/RemoveNodeEvent.ts | 6 + .../events/mutation/UpdateChildrenEvent.ts | 6 + .../events/mutation/UpdateNodePropsEvent.ts | 6 + src/app/core/events/mutation/WrapNodeEvent.ts | 6 + src/app/core/events/mutation/index.ts | 11 + src/app/core/models/tree-node.ts | 731 ++++++++++-------- 13 files changed, 490 insertions(+), 331 deletions(-) create mode 100644 src/app/core/events/mutation/AppendNodeEvent.ts create mode 100644 src/app/core/events/mutation/CloneNodeEvent.ts create mode 100644 src/app/core/events/mutation/FromNodeEvent.ts create mode 100644 src/app/core/events/mutation/InsertAfterEvent.ts create mode 100644 src/app/core/events/mutation/InsertBeforeEvent.ts create mode 100644 src/app/core/events/mutation/InsertChildrenEvent.ts create mode 100644 src/app/core/events/mutation/PrependNodeEvent.ts create mode 100644 src/app/core/events/mutation/RemoveNodeEvent.ts create mode 100644 src/app/core/events/mutation/UpdateChildrenEvent.ts create mode 100644 src/app/core/events/mutation/UpdateNodePropsEvent.ts create mode 100644 src/app/core/events/mutation/WrapNodeEvent.ts diff --git a/src/app/core/events/mutation/AppendNodeEvent.ts b/src/app/core/events/mutation/AppendNodeEvent.ts new file mode 100644 index 0000000..c1fd290 --- /dev/null +++ b/src/app/core/events/mutation/AppendNodeEvent.ts @@ -0,0 +1,6 @@ +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; +import { ICustomEvent } from '@/app/shared/event'; + +export class AppendNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'append:node'; +} diff --git a/src/app/core/events/mutation/CloneNodeEvent.ts b/src/app/core/events/mutation/CloneNodeEvent.ts new file mode 100644 index 0000000..2a67f0a --- /dev/null +++ b/src/app/core/events/mutation/CloneNodeEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class CloneNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'clone:node'; +} diff --git a/src/app/core/events/mutation/FromNodeEvent.ts b/src/app/core/events/mutation/FromNodeEvent.ts new file mode 100644 index 0000000..51b8bd8 --- /dev/null +++ b/src/app/core/events/mutation/FromNodeEvent.ts @@ -0,0 +1,19 @@ +import { ITreeNode, TreeNode } from '../../models'; +import { IEngineContext } from '../../types'; +import { ICustomEvent } from '@/app/shared/event'; + +export interface IFromNodeEventData { + //事件发生的数据源 + source: ITreeNode; + //事件发生的目标对象 + target: TreeNode; +} + +export class FromNodeEvent implements ICustomEvent { + type = 'from:node'; + data: IFromNodeEventData; + context: IEngineContext; + constructor(data: IFromNodeEventData) { + this.data = data; + } +} diff --git a/src/app/core/events/mutation/InsertAfterEvent.ts b/src/app/core/events/mutation/InsertAfterEvent.ts new file mode 100644 index 0000000..539fe86 --- /dev/null +++ b/src/app/core/events/mutation/InsertAfterEvent.ts @@ -0,0 +1,6 @@ +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; +import { ICustomEvent } from '@/app/shared/event'; + +export class InsertAfterEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'insert:after'; +} diff --git a/src/app/core/events/mutation/InsertBeforeEvent.ts b/src/app/core/events/mutation/InsertBeforeEvent.ts new file mode 100644 index 0000000..3a4e723 --- /dev/null +++ b/src/app/core/events/mutation/InsertBeforeEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class InsertBeforeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'insert:before'; +} diff --git a/src/app/core/events/mutation/InsertChildrenEvent.ts b/src/app/core/events/mutation/InsertChildrenEvent.ts new file mode 100644 index 0000000..0397751 --- /dev/null +++ b/src/app/core/events/mutation/InsertChildrenEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class InsertChildrenEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'insert:children'; +} diff --git a/src/app/core/events/mutation/PrependNodeEvent.ts b/src/app/core/events/mutation/PrependNodeEvent.ts new file mode 100644 index 0000000..04d8726 --- /dev/null +++ b/src/app/core/events/mutation/PrependNodeEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class PrependNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'prepend:node'; +} diff --git a/src/app/core/events/mutation/RemoveNodeEvent.ts b/src/app/core/events/mutation/RemoveNodeEvent.ts new file mode 100644 index 0000000..1e9893e --- /dev/null +++ b/src/app/core/events/mutation/RemoveNodeEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class RemoveNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'remove:node'; +} diff --git a/src/app/core/events/mutation/UpdateChildrenEvent.ts b/src/app/core/events/mutation/UpdateChildrenEvent.ts new file mode 100644 index 0000000..5680585 --- /dev/null +++ b/src/app/core/events/mutation/UpdateChildrenEvent.ts @@ -0,0 +1,6 @@ +import { ICustomEvent } from '@/app/shared/event'; +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; + +export class UpdateChildrenEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'update:children'; +} diff --git a/src/app/core/events/mutation/UpdateNodePropsEvent.ts b/src/app/core/events/mutation/UpdateNodePropsEvent.ts new file mode 100644 index 0000000..6bcbd4c --- /dev/null +++ b/src/app/core/events/mutation/UpdateNodePropsEvent.ts @@ -0,0 +1,6 @@ +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; +import { ICustomEvent } from '@/app/shared/event'; + +export class UpdateNodePropsEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'update:node:props'; +} diff --git a/src/app/core/events/mutation/WrapNodeEvent.ts b/src/app/core/events/mutation/WrapNodeEvent.ts new file mode 100644 index 0000000..07a0c96 --- /dev/null +++ b/src/app/core/events/mutation/WrapNodeEvent.ts @@ -0,0 +1,6 @@ +import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent'; +import { ICustomEvent } from '@/app/shared/event'; + +export class WrapNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent { + type = 'wrap:node'; +} diff --git a/src/app/core/events/mutation/index.ts b/src/app/core/events/mutation/index.ts index 13c4078..79b169f 100644 --- a/src/app/core/events/mutation/index.ts +++ b/src/app/core/events/mutation/index.ts @@ -1 +1,12 @@ export * from './DragNodeEvent'; +export * from './UpdateNodePropsEvent'; +export * from './PrependNodeEvent'; +export * from './AppendNodeEvent'; +export * from './WrapNodeEvent'; +export * from './InsertAfterEvent'; +export * from './InsertBeforeEvent'; +export * from './InsertChildrenEvent'; +export * from './UpdateChildrenEvent'; +export * from './RemoveNodeEvent'; +export * from './CloneNodeEvent'; +export * from './FromNodeEvent'; diff --git a/src/app/core/models/tree-node.ts b/src/app/core/models/tree-node.ts index c950bae..3f9f62f 100644 --- a/src/app/core/models/tree-node.ts +++ b/src/app/core/models/tree-node.ts @@ -1,9 +1,23 @@ import { uid } from '@/app/shared/uid'; import { IDesignerControllerProps, IDesignerLocales, IDesignerProps } from '@/app/core/types'; import { GlobalRegistry } from '@/app/core/registry'; -import { action, define, observable } from '@formily/reactive'; +import { action, define, observable, toJS } from '@formily/reactive'; import { isFn } from '@/app/shared/types'; import { mergeLocales } from '@/app/core/internals'; +import { + AppendNodeEvent, + CloneNodeEvent, + FromNodeEvent, + InsertAfterEvent, + InsertBeforeEvent, + InsertChildrenEvent, + PrependNodeEvent, + RemoveNodeEvent, + UpdateChildrenEvent, + UpdateNodePropsEvent, + WrapNodeEvent +} from '@/app/core/events'; +import _ from 'lodash'; export interface ITreeNode { componentName?: string; @@ -22,6 +36,59 @@ export interface INodeFinder { const TreeNodes = new Map(); +const CommonDesignerPropsMap = new Map(); + +const removeNode = (node: TreeNode) => { + if (node.parent) { + node.parent.children = node.parent.children.filter(child => child !== node); + } +}; + +const resetNodesParent = (nodes: TreeNode[], parent: TreeNode) => { + const resetDepth = (node: TreeNode) => { + node.depth = node.parent ? node.parent.depth + 1 : 0; + node.children.forEach(resetDepth); + }; + + const shallowReset = (node: TreeNode) => { + node.parent = parent; + node.root = parent.root; + resetDepth(node); + }; + + const deepReset = (node: TreeNode) => { + shallowReset(node); + resetNodesParent(node.children, node); + }; + + return nodes.map(node => { + if (node === parent) return node; + if (!parent.isSourceNode) { + if (node.isSourceNode) { + node = node.clone(parent); + resetDepth(node); + } else if (!node.isRoot && node.isInOperation) { + node.operation?.selection.remove(node); + removeNode(node); + shallowReset(node); + } else { + deepReset(node); + } + } else { + deepReset(node); + } + if (!TreeNodes.has(node.id)) { + TreeNodes.set(node.id, node); + CommonDesignerPropsMap.set(node.componentName, node.designerProps); + } + return node; + }); +}; + +const resetParent = (node: TreeNode, parent: TreeNode) => { + return resetNodesParent([node], parent)[0]; +}; + const resolveDesignerProps = (node: TreeNode, props: IDesignerControllerProps) => { if (isFn(props)) return props(node); return props; @@ -67,7 +134,9 @@ export class TreeNode { TreeNodes.set(this.id, this); } if (node) { + this.from(node); } + this.makeObservable(); } makeObservable() { @@ -77,16 +146,16 @@ export class TreeNode { hidden: observable.ref, children: observable.shallow, designerProps: observable.computed, - designerLocales: observable.computed - // wrap: action, - // prepend: action, - // append: action, - // insertAfter: action, - // insertBefore: action, - // remove: action, - // setProps: action, - // setChildren: action, - // setComponentName: action + designerLocales: observable.computed, + wrap: action, + prepend: action, + append: action, + insertAfter: action, + insertBefore: action, + remove: action, + setProps: action, + setChildren: action, + setComponentName: action }); } @@ -403,262 +472,262 @@ export class TreeNode { } } - // resetNodesParent(nodes: TreeNode[], parent: TreeNode) { - // return resetNodesParent( - // nodes.filter(node => node !== this), - // parent - // ); - // } - - // setProps(props?: any) { - // return this.triggerMutation( - // new UpdateNodePropsEvent({ - // target: this, - // source: null - // }), - // () => { - // Object.assign(this.props, props); - // } - // ); - // } + resetNodesParent(nodes: TreeNode[], parent: TreeNode) { + return resetNodesParent( + nodes.filter(node => node !== this), + parent + ); + } + + setProps(props?: any) { + return this.triggerMutation( + new UpdateNodePropsEvent({ + target: this, + source: null + }), + () => { + Object.assign(this.props, props); + } + ); + } setComponentName(componentName: string) { this.componentName = componentName; } - // prepend(...nodes: TreeNode[]) { - // if (nodes.some(node => node.contains(this))) return []; - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, this); - // if (!newNodes.length) return []; - // return this.triggerMutation( - // new PrependNodeEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // this.children = newNodes.concat(this.children); - // return newNodes; - // }, - // [] - // ); - // } - - // append(...nodes: TreeNode[]) { - // if (nodes.some(node => node.contains(this))) return []; - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, this); - // if (!newNodes.length) return []; - // return this.triggerMutation( - // new AppendNodeEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // this.children = this.children.concat(newNodes); - // return newNodes; - // }, - // [] - // ); - // } - - // wrap(wrapper: TreeNode) { - // if (wrapper === this) return; - // const parent = this.parent; - // return this.triggerMutation( - // new WrapNodeEvent({ - // target: this, - // source: wrapper - // }), - // () => { - // resetParent(this, wrapper); - // resetParent(wrapper, parent); - // return wrapper; - // } - // ); - // } - - // insertAfter(...nodes: TreeNode[]) { - // const parent = this.parent; - // if (nodes.some(node => node.contains(this))) return []; - // if (parent?.children?.length) { - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, parent); - // if (!newNodes.length) return []; - // - // return this.triggerMutation( - // new InsertAfterEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // parent.children = parent.children.reduce((buf, node) => { - // if (node === this) { - // return buf.concat([node]).concat(newNodes); - // } else { - // return buf.concat([node]); - // } - // }, []); - // return newNodes; - // }, - // [] - // ); - // } - // return []; - // } - - // insertBefore(...nodes: TreeNode[]) { - // const parent = this.parent; - // if (nodes.some(node => node.contains(this))) return []; - // if (parent?.children?.length) { - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, parent); - // if (!newNodes.length) return []; - // return this.triggerMutation( - // new InsertBeforeEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // parent.children = parent.children.reduce((buf, node) => { - // if (node === this) { - // return buf.concat(newNodes).concat([node]); - // } else { - // return buf.concat([node]); - // } - // }, []); - // return newNodes; - // }, - // [] - // ); - // } - // return []; - // } - - // insertChildren(start: number, ...nodes: TreeNode[]) { - // if (nodes.some(node => node.contains(this))) return []; - // if (this.children?.length) { - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, this); - // if (!newNodes.length) return []; - // return this.triggerMutation( - // new InsertChildrenEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // this.children = this.children.reduce((buf, node, index) => { - // if (index === start) { - // return buf.concat(newNodes).concat([node]); - // } - // return buf.concat([node]); - // }, []); - // return newNodes; - // }, - // [] - // ); - // } - // return []; - // } - - // setChildren(...nodes: TreeNode[]) { - // const originSourceParents = nodes.map(node => node.parent); - // const newNodes = this.resetNodesParent(nodes, this); - // return this.triggerMutation( - // new UpdateChildrenEvent({ - // originSourceParents, - // target: this, - // source: newNodes - // }), - // () => { - // this.children = newNodes; - // return newNodes; - // }, - // [] - // ); - // } + prepend(...nodes: TreeNode[]) { + if (nodes.some(node => node.contains(this))) return []; + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, this); + if (!newNodes.length) return []; + return this.triggerMutation( + new PrependNodeEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + this.children = newNodes.concat(this.children); + return newNodes; + }, + [] + ); + } + + append(...nodes: TreeNode[]) { + if (nodes.some(node => node.contains(this))) return []; + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, this); + if (!newNodes.length) return []; + return this.triggerMutation( + new AppendNodeEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + this.children = this.children.concat(newNodes); + return newNodes; + }, + [] + ); + } + + wrap(wrapper: TreeNode) { + if (wrapper === this) return null; + const parent = this.parent; + return this.triggerMutation( + new WrapNodeEvent({ + target: this, + source: wrapper + }), + () => { + resetParent(this, wrapper); + resetParent(wrapper, parent); + return wrapper; + } + ); + } + + insertAfter(...nodes: TreeNode[]) { + const parent = this.parent; + if (nodes.some(node => node.contains(this))) return []; + if (parent?.children?.length) { + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, parent); + if (!newNodes.length) return []; + + return this.triggerMutation( + new InsertAfterEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + parent.children = parent.children.reduce((buf, node) => { + if (node === this) { + return buf.concat([node]).concat(newNodes); + } else { + return buf.concat([node]); + } + }, []); + return newNodes; + }, + [] + ); + } + return []; + } + + insertBefore(...nodes: TreeNode[]) { + const parent = this.parent; + if (nodes.some(node => node.contains(this))) return []; + if (parent?.children?.length) { + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, parent); + if (!newNodes.length) return []; + return this.triggerMutation( + new InsertBeforeEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + parent.children = parent.children.reduce((buf, node) => { + if (node === this) { + return buf.concat(newNodes).concat([node]); + } else { + return buf.concat([node]); + } + }, []); + return newNodes; + }, + [] + ); + } + return []; + } + + insertChildren(start: number, ...nodes: TreeNode[]) { + if (nodes.some(node => node.contains(this))) return []; + if (this.children?.length) { + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, this); + if (!newNodes.length) return []; + return this.triggerMutation( + new InsertChildrenEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + this.children = this.children.reduce((buf, node, index) => { + if (index === start) { + return buf.concat(newNodes).concat([node]); + } + return buf.concat([node]); + }, []); + return newNodes; + }, + [] + ); + } + return []; + } + + setChildren(...nodes: TreeNode[]) { + const originSourceParents = nodes.map(node => node.parent); + const newNodes = this.resetNodesParent(nodes, this); + return this.triggerMutation( + new UpdateChildrenEvent({ + originSourceParents, + target: this, + source: newNodes + }), + () => { + this.children = newNodes; + return newNodes; + }, + [] + ); + } /** * @deprecated * please use `setChildren` */ - // setNodeChildren(...nodes: TreeNode[]) { - // return this.setChildren(...nodes); - // } - - // remove() { - // return this.triggerMutation( - // new RemoveNodeEvent({ - // target: this, - // source: null - // }), - // () => { - // removeNode(this); - // TreeNodes.delete(this.id); - // } - // ); - // } - // - // clone(parent?: TreeNode) { - // const newNode = new TreeNode( - // { - // id: uid(), - // componentName: this.componentName, - // sourceName: this.sourceName, - // props: toJS(this.props), - // children: [] - // }, - // parent ? parent : this.parent - // ); - // newNode.children = resetNodesParent( - // this.children.map(child => { - // return child.clone(newNode); - // }), - // newNode - // ); - // return this.triggerMutation( - // new CloneNodeEvent({ - // target: this, - // source: newNode - // }), - // () => newNode - // ); - // } - // - // from(node?: ITreeNode) { - // if (!node) return; - // return this.triggerMutation( - // new FromNodeEvent({ - // target: this, - // source: node - // }), - // () => { - // if (node.id && node.id !== this.id) { - // TreeNodes.delete(this.id); - // TreeNodes.set(node.id, this); - // this.id = node.id; - // } - // if (node.componentName) { - // this.componentName = node.componentName; - // } - // this.props = node.props ?? {}; - // if (node.hidden) { - // this.hidden = node.hidden; - // } - // if (node.children) { - // this.children = - // node.children?.map?.(node => { - // return new TreeNode(node, this); - // }) || []; - // } - // } - // ); - // } + setNodeChildren(...nodes: TreeNode[]) { + return this.setChildren(...nodes); + } + + remove() { + return this.triggerMutation( + new RemoveNodeEvent({ + target: this, + source: null + }), + () => { + removeNode(this); + TreeNodes.delete(this.id); + } + ); + } + + clone(parent?: TreeNode) { + const newNode = new TreeNode( + { + id: uid(), + componentName: this.componentName, + sourceName: this.sourceName, + props: toJS(this.props), + children: [] + }, + parent ? parent : this.parent + ); + newNode.children = resetNodesParent( + this.children.map(child => { + return child.clone(newNode); + }), + newNode + ); + return this.triggerMutation( + new CloneNodeEvent({ + target: this, + source: newNode + }), + () => newNode + ); + } + + from(node?: ITreeNode) { + if (!node) return; + return this.triggerMutation( + new FromNodeEvent({ + target: this, + source: node + }), + () => { + if (node.id && node.id !== this.id) { + TreeNodes.delete(this.id); + TreeNodes.set(node.id, this); + this.id = node.id; + } + if (node.componentName) { + this.componentName = node.componentName; + } + this.props = node.props ?? {}; + if (node.hidden) { + this.hidden = node.hidden; + } + if (node.children) { + this.children = + node.children?.map?.(node => { + return new TreeNode(node, this); + }) || []; + } + } + ); + } serialize(): ITreeNode { return { @@ -681,18 +750,18 @@ export class TreeNode { return TreeNodes.get(id); } - // static remove(nodes: TreeNode[] = []) { - // for (let i = nodes.length - 1; i >= 0; i--) { - // const node = nodes[i]; - // if (node.allowDelete()) { - // const previous = node.previous; - // const next = node.next; - // node.remove(); - // node.operation?.selection.select(previous ? previous : next ? next : node.parent); - // node.operation?.hover.clear(); - // } - // } - // } + static remove(nodes: TreeNode[] = []) { + for (let i = nodes.length - 1; i >= 0; i--) { + const node = nodes[i]; + if (node.allowDelete()) { + const previous = node.previous; + const next = node.next; + node.remove(); + node.operation?.selection.select(previous ? previous : next ? next : node.parent); + node.operation?.hover.clear(); + } + } + } static sort(nodes: TreeNode[] = []) { return nodes.sort((before, after) => { @@ -701,56 +770,56 @@ export class TreeNode { }); } - // static clone(nodes: TreeNode[] = []) { - // const groups: { [parentId: string]: TreeNode[] } = {}; - // const lastGroupNode: { [parentId: string]: TreeNode } = {}; - // const filterNestedNode = TreeNode.sort(nodes).filter(node => { - // return !nodes.some(parent => { - // return node.isMyParents(parent); - // }); - // }); - // _.each(filterNestedNode, node => { - // if (node === node.root) return; - // if (!node.allowClone()) return; - // if (!node?.operation) return; - // groups[node?.parent?.id] = groups[node?.parent?.id] || []; - // groups[node?.parent?.id].push(node); - // if (lastGroupNode[node?.parent?.id]) { - // if (node.index > lastGroupNode[node?.parent?.id].index) { - // lastGroupNode[node?.parent?.id] = node; - // } - // } else { - // lastGroupNode[node?.parent?.id] = node; - // } - // }); - // const parents = new Map(); - // _.each(groups, (nodes, parentId) => { - // const lastNode = lastGroupNode[parentId]; - // let insertPoint = lastNode; - // _.each(nodes, node => { - // const cloned = node.clone(); - // if (!cloned) return; - // if (node.operation?.selection.has(node) && insertPoint.parent.allowAppend([cloned])) { - // insertPoint.insertAfter(cloned); - // insertPoint = insertPoint.next; - // } else if (node.operation.selection.length === 1) { - // const targetNode = node.operation?.tree.findById(node.operation.selection.first); - // let cloneNodes = parents.get(targetNode); - // if (!cloneNodes) { - // cloneNodes = []; - // parents.set(targetNode, cloneNodes); - // } - // if (targetNode && targetNode.allowAppend([cloned])) { - // cloneNodes.push(cloned); - // } - // } - // }); - // }); - // parents.forEach((nodes, target) => { - // if (!nodes.length) return; - // target.append(...nodes); - // }); - // } + static clone(nodes: TreeNode[] = []) { + const groups: { [parentId: string]: TreeNode[] } = {}; + const lastGroupNode: { [parentId: string]: TreeNode } = {}; + const filterNestedNode = TreeNode.sort(nodes).filter(node => { + return !nodes.some(parent => { + return node.isMyParents(parent); + }); + }); + _.each(filterNestedNode, node => { + if (node === node.root) return; + if (!node.allowClone()) return; + if (!node?.operation) return; + groups[node?.parent?.id] = groups[node?.parent?.id] || []; + groups[node?.parent?.id].push(node); + if (lastGroupNode[node?.parent?.id]) { + if (node.index > lastGroupNode[node?.parent?.id].index) { + lastGroupNode[node?.parent?.id] = node; + } + } else { + lastGroupNode[node?.parent?.id] = node; + } + }); + const parents = new Map(); + _.each(groups, (nodes, parentId) => { + const lastNode = lastGroupNode[parentId]; + let insertPoint = lastNode; + _.each(nodes, node => { + const cloned = node.clone(); + if (!cloned) return; + if (node.operation?.selection.has(node) && insertPoint.parent.allowAppend([cloned])) { + insertPoint.insertAfter(cloned); + insertPoint = insertPoint.next; + } else if (node.operation.selection.length === 1) { + const targetNode = node.operation?.tree.findById(node.operation.selection.first); + let cloneNodes = parents.get(targetNode); + if (!cloneNodes) { + cloneNodes = []; + parents.set(targetNode, cloneNodes); + } + if (targetNode && targetNode.allowAppend([cloned])) { + cloneNodes.push(cloned); + } + } + }); + }); + parents.forEach((nodes, target) => { + if (!nodes.length) return; + target.append(...nodes); + }); + } static filterResizable(nodes: TreeNode[] = []) { return nodes.filter(node => node.allowResize()); @@ -784,16 +853,16 @@ export class TreeNode { }, []); } - // static filterDroppable(nodes: TreeNode[] = [], parent: TreeNode) { - // return nodes.reduce((buf, node) => { - // if (!node.allowDrop(parent)) return buf; - // if (isFn(node.designerProps?.getDropNodes)) { - // const cloned = node.isSourceNode ? node.clone(node.parent) : node; - // const transformed = node.designerProps.getDropNodes(cloned, parent); - // return transformed ? buf.concat(transformed) : buf; - // } - // if (node.componentName === '$$ResourceNode$$') return buf.concat(node.children); - // return buf.concat([node]); - // }, []); - // } + static filterDroppable(nodes: TreeNode[] = [], parent: TreeNode) { + return nodes.reduce((buf, node) => { + if (!node.allowDrop(parent)) return buf; + if (isFn(node.designerProps?.getDropNodes)) { + const cloned = node.isSourceNode ? node.clone(node.parent) : node; + const transformed = node.designerProps.getDropNodes(cloned, parent); + return transformed ? buf.concat(transformed) : buf; + } + if (node.componentName === '$$ResourceNode$$') return buf.concat(node.children); + return buf.concat([node]); + }, []); + } }