feat: 添加TreeNode节点

angular.json

@@ -32,7 +32,10 @@
             "styles": [
               "src/styles.less"
             ],
-            "scripts": []
+            "scripts": [],
+            "allowedCommonJsDependencies": [
+              "lodash"
+            ]
           },
           "configurations": {
             "production": {

src/app/core/events/index.ts

@@ -0,0 +1 @@
+export * from './mutation';

src/app/core/events/mutation/AbstractMutationNodeEvent.ts

@@ -0,0 +1,21 @@
+import { TreeNode } from '../../models'
+import { IEngineContext } from '../../types'
+
+export interface IMutationNodeEventData {
+  //事件发生的数据源
+  source: TreeNode | TreeNode[]
+  //事件发生的目标对象
+  target: TreeNode | TreeNode[]
+  // 事件发生的来源对象
+  originSourceParents?: TreeNode | TreeNode[]
+  //扩展数据
+  extra?: any
+}
+
+export class AbstractMutationNodeEvent {
+  data: IMutationNodeEventData
+  context: IEngineContext
+  constructor(data: IMutationNodeEventData) {
+    this.data = data
+  }
+}

src/app/core/events/mutation/DragNodeEvent.ts

@@ -0,0 +1,6 @@
+import { AbstractMutationNodeEvent } from './AbstractMutationNodeEvent';
+import { ICustomEvent } from '@/app/shared/event';
+
+export class DragNodeEvent extends AbstractMutationNodeEvent implements ICustomEvent {
+  type = 'drag:node';
+}

src/app/core/events/mutation/index.ts

@@ -0,0 +1 @@
+export * from './DragNodeEvent';

src/app/core/models/index.ts

@@ -0,0 +1,2 @@
+export * from './engine';
+export * from './tree-node';

src/app/core/models/tree-node.ts

@@ -0,0 +1,80 @@
+import { uid } from '@/app/shared/uid';
+
+export interface ITreeNode {
+  componentName?: string;
+  sourceName?: string;
+  operation?: any;
+  hidden?: boolean;
+  isSourceNode?: boolean;
+  id?: string;
+  props?: Record<string | number | symbol, any>;
+  children?: ITreeNode[];
+}
+
+const TreeNodes = new Map<string, TreeNode>();
+
+export class TreeNode {
+  parent: TreeNode;
+
+  root: TreeNode;
+
+  rootOperation: any;
+
+  id: string;
+
+  depth = 0;
+
+  hidden = false;
+
+  componentName = 'NO_NAME_COMPONENT';
+
+  sourceName = '';
+
+  props: ITreeNode['props'] = {};
+
+  children: TreeNode[] = [];
+
+  isSelfSourceNode: boolean;
+
+  constructor(node?: ITreeNode, parent?: TreeNode) {
+    if (node instanceof TreeNode) {
+      return node;
+    }
+    this.id = node.id || uid();
+    if (parent) {
+      this.parent = parent;
+      this.depth = parent.depth + 1;
+      this.root = parent.root;
+      TreeNodes.set(this.id, this);
+    } else {
+      this.root = this;
+      this.rootOperation = node.operation;
+      this.isSelfSourceNode = node.isSourceNode || false;
+      TreeNodes.set(this.id, this);
+    }
+    if (node) {
+    }
+  }
+
+  get previous() {
+    if (this.parent === this || !this.parent) return null;
+    return this.parent.children[this.index - 1];
+  }
+
+  get next() {
+    if (this.parent === this || !this.parent) return null;
+    return this.parent.children[this.index + 1];
+  }
+
+  get siblings() {
+    if (this.parent) {
+      return this.parent.children.filter(node => node !== this);
+    }
+    return [];
+  }
+
+  get index() {
+    if (this.parent === this || !this.parent) return 0;
+    return this.parent.children.indexOf(this);
+  }
+}

src/app/core/types.ts

@@ -1,3 +1,12 @@
+import { Engine } from '@/app/core/models';
+
+export type IEngineContext = {
+  workspace: any;
+  workbench: any;
+  engine: Engine;
+  viewport: any;
+};
+
 export interface IDesignerLocales {
   [ISOCode: string]: {
     [key: string]: any;

src/app/shared/event.ts

@@ -0,0 +1,5 @@
+export interface ICustomEvent<EventData = any, EventContext = any> {
+  type: string;
+  data?: EventData;
+  context?: EventContext;
+}

src/app/shared/uid.ts

@@ -0,0 +1,10 @@
+let IDX = 36,
+  HEX = ''
+while (IDX--) HEX += IDX.toString(36)
+
+export function uid(len?: number) {
+  let str = '',
+    num = len || 11
+  while (num--) str += HEX[(Math.random() * 36) | 0]
+  return str
+}