feat(node): add getRGL api

alibaba · Aug 28, 2023 · e82144a · e82144a
1 parent e3842b0
commit e82144a
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 25 deletions.
diff --git a/docs/docs/api/model/node.md b/docs/docs/api/model/node.md
@@ -657,4 +657,22 @@ setConditionalVisible(): void;
  */
 getDOMNode(): HTMLElement;
 
+```
+
+### getRGL
+
+获取磁贴相关信息
+
+```typescript
+/**
+ * 获取磁贴相关信息
+ */
+getRGL(): {
+  isContainerNode: boolean;
+  isEmptyNode: boolean;
+  isRGLContainerNode: boolean;
+  isRGLNode: boolean;
+  isRGL: boolean;
+  rglNode: Node | null;
+}
 ```
diff --git a/packages/designer/src/component-actions.ts b/packages/designer/src/component-actions.ts
@@ -1,4 +1,4 @@
-import { IPublicTypeComponentAction, IPublicTypeMetadataTransducer } from '@alilc/lowcode-types';
+import { IPublicModelNode, IPublicTypeComponentAction, IPublicTypeMetadataTransducer } from '@alilc/lowcode-types';
 import { engineConfig } from '@alilc/lowcode-editor-core';
 import { intlNode } from './locale';
 import {
@@ -8,18 +8,19 @@ import {
   IconClone,
   IconHidden,
 } from './icons';
-import { Node } from './document';
 import { componentDefaults, legacyIssues } from './transducers';
 
 export class ComponentActions {
+  private metadataTransducers: IPublicTypeMetadataTransducer[] = [];
+
   actions: IPublicTypeComponentAction[] = [
     {
       name: 'remove',
       content: {
         icon: IconRemove,
         title: intlNode('remove'),
         /* istanbul ignore next */
-        action(node: Node) {
+        action(node: IPublicModelNode) {
           node.remove();
         },
       },
@@ -31,13 +32,13 @@ export class ComponentActions {
         icon: IconHidden,
         title: intlNode('hide'),
         /* istanbul ignore next */
-        action(node: Node) {
-          node.setVisible(false);
+        action(node: IPublicModelNode) {
+          node.visible = false;
         },
       },
       /* istanbul ignore next */
-      condition: (node: Node) => {
-        return node.componentMeta.isModal;
+      condition: (node: IPublicModelNode) => {
+        return node.componentMeta?.isModal;
       },
       important: true,
     },
@@ -47,25 +48,25 @@ export class ComponentActions {
         icon: IconClone,
         title: intlNode('copy'),
         /* istanbul ignore next */
-        action(node: Node) {
+        action(node: IPublicModelNode) {
           // node.remove();
           const { document: doc, parent, index } = node;
           if (parent) {
-            const newNode = doc.insertNode(parent, node, index + 1, true);
-            newNode.select();
-            const { isRGL, rglNode } = node.getRGL();
+            const newNode = doc?.insertNode(parent, node, (index ?? 0) + 1, true);
+            newNode?.select();
+            const { isRGL, rglNode } = node?.getRGL();
             if (isRGL) {
               // 复制 layout 信息
-              const layout = rglNode.getPropValue('layout') || [];
-              const curLayout = layout.filter((item) => item.i === node.getPropValue('fieldId'));
+              const layout: any = rglNode?.getPropValue('layout') || [];
+              const curLayout = layout.filter((item: any) => item.i === node.getPropValue('fieldId'));
               if (curLayout && curLayout[0]) {
                 layout.push({
                   ...curLayout[0],
-                  i: newNode.getPropValue('fieldId'),
+                  i: newNode?.getPropValue('fieldId'),
                 });
-                rglNode.setPropValue('layout', layout);
+                rglNode?.setPropValue('layout', layout);
                 // 如果是磁贴块复制，则需要滚动到影响位置
-                setTimeout(() => newNode.document.simulator?.scrollToNode(newNode), 10);
+                setTimeout(() => newNode?.document?.project?.simulatorHost?.scrollToNode(newNode), 10);
               }
             }
           }
@@ -79,13 +80,13 @@ export class ComponentActions {
         icon: IconLock, // 锁定 icon
         title: intlNode('lock'),
         /* istanbul ignore next */
-        action(node: Node) {
+        action(node: IPublicModelNode) {
           node.lock();
         },
       },
       /* istanbul ignore next */
-      condition: (node: Node) => {
-        return engineConfig.get('enableCanvasLock', false) && node.isContainer() && !node.isLocked;
+      condition: (node: IPublicModelNode) => {
+        return engineConfig.get('enableCanvasLock', false) && node.isContainerNode && !node.isLocked;
       },
       important: true,
     },
@@ -95,13 +96,13 @@ export class ComponentActions {
         icon: IconUnlock, // 解锁 icon
         title: intlNode('unlock'),
         /* istanbul ignore next */
-        action(node: Node) {
+        action(node: IPublicModelNode) {
           node.lock(false);
         },
       },
       /* istanbul ignore next */
-      condition: (node: Node) => {
-        return engineConfig.get('enableCanvasLock', false) && node.isContainer() && node.isLocked;
+      condition: (node: IPublicModelNode) => {
+        return engineConfig.get('enableCanvasLock', false) && node.isContainerNode && node.isLocked;
       },
       important: true,
     },
@@ -132,8 +133,6 @@ export class ComponentActions {
     }
   }
 
-  private metadataTransducers: IPublicTypeMetadataTransducer[] = [];
-
   registerMetadataTransducer(
     transducer: IPublicTypeMetadataTransducer,
     level = 100,

diff --git a/packages/designer/src/document/node/node.ts b/packages/designer/src/document/node/node.ts
@@ -1225,7 +1225,7 @@ export class Node<Schema extends IPublicTypeNodeSchema = IPublicTypeNodeSchema>
     const isRGLContainerNode = this.isRGLContainer;
     const isRGLNode = this.getParent()?.isRGLContainer;
     const isRGL = isRGLContainerNode || (isRGLNode && (!isContainerNode || !isEmptyNode));
-    let rglNode = isRGLContainerNode ? this : isRGL ? this?.getParent() : {};
+    let rglNode = isRGLContainerNode ? this : isRGL ? this?.getParent() : null;
     return { isContainerNode, isEmptyNode, isRGLContainerNode, isRGLNode, isRGL, rglNode };
   }
 

diff --git a/packages/shell/src/model/node.ts b/packages/shell/src/model/node.ts
@@ -655,4 +655,24 @@ export class Node implements IPublicModelNode {
   setConditionalVisible(): void {
     this[nodeSymbol].setConditionalVisible();
   }
+
+  getRGL() {
+    const {
+      isContainerNode,
+      isEmptyNode,
+      isRGLContainerNode,
+      isRGLNode,
+      isRGL,
+      rglNode,
+    } = this[nodeSymbol].getRGL();
+
+    return {
+      isContainerNode,
+      isEmptyNode,
+      isRGLContainerNode,
+      isRGLNode,
+      isRGL,
+      rglNode: Node.create(rglNode),
+    };
+  }
 }
diff --git a/packages/types/src/shell/model/node.ts b/packages/types/src/shell/model/node.ts
@@ -490,6 +490,18 @@ export interface IBaseModelNode<
    * 获取节点实例对应的 dom 节点
    */
   getDOMNode(): HTMLElement;
+
+  /**
+   * 获取磁贴相关信息
+   */
+  getRGL(): {
+    isContainerNode: boolean;
+    isEmptyNode: boolean;
+    isRGLContainerNode: boolean;
+    isRGLNode: boolean;
+    isRGL: boolean;
+    rglNode: Node | null;
+  };
 }
 
 export interface IPublicModelNode extends IBaseModelNode<IPublicModelDocumentModel, IPublicModelNode> {}