@tmagic/editor 1.5.4 → 1.5.5

package/dist/tmagic-editor.umd.cjs

@@ -2863,7 +2863,7 @@
     }
     runTaskQueue(deadline) {
       const { hightLevelTaskList, taskList } = this;
-      while (deadline.timeRemaining() > 0 && taskList.length) {
+      while (deadline.timeRemaining() > 0 && (taskList.length || hightLevelTaskList.length)) {
         const timeRemaining = deadline.timeRemaining();
         let times = 0;
         if (timeRemaining <= 5) {
@@ -13130,20 +13130,20 @@
         idleTask.once("finish", () => {
           this.emit("collected", nodes, deep);
           this.set("collecting", false);
-          resolve();
         });
         idleTask.once("hight-level-finish", () => {
           this.emit("ds-collected", nodes, deep);
+          resolve();
         });
       });
     }
     collectNode(node, target, depExtendedData = {}, deep = false) {
       if (utils.isPage(node)) {
-        Object.entries(target.deps).forEach(([depKey, dep]) => {
+        for (const [depKey, dep] of Object.entries(target.deps)) {
           if (dep.data?.pageId && dep.data.pageId === depExtendedData.pageId) {
             delete target.deps[depKey];
           }
-        });
+        }
       } else {
         this.watcher.removeTargetDep(target, node);
       }
@@ -13673,10 +13673,12 @@
       (eventMethodList) => {
         const eventsList = {};
         const methodsList = {};
-        eventMethodList && Object.keys(eventMethodList).forEach((type) => {
-          eventsList[type] = eventMethodList[type].events;
-          methodsList[type] = eventMethodList[type].methods;
-        });
+        if (eventMethodList) {
+          for (const type of Object.keys(eventMethodList)) {
+            eventsList[type] = eventMethodList[type].events;
+            methodsList[type] = eventMethodList[type].methods;
+          }
+        }
         eventsService.setEvents(eventsList);
         eventsService.setMethods(methodsList);
       },
@@ -13687,9 +13689,12 @@
     vue.watch(
       () => props.datasourceConfigs,
       (configs) => {
-        configs && Object.entries(configs).forEach(([key, value]) => {
+        if (!configs) {
+          return;
+        }
+        for (const [key, value] of Object.entries(configs)) {
           dataSourceService.setFormConfig(key, value);
-        });
+        }
       },
       {
         immediate: true
@@ -13698,9 +13703,12 @@
     vue.watch(
       () => props.datasourceValues,
       (values) => {
-        values && Object.entries(values).forEach(([key, value]) => {
+        if (!values) {
+          return;
+        }
+        for (const [key, value] of Object.entries(values)) {
           dataSourceService.setFormValue(key, value);
-        });
+        }
       },
       {
         immediate: true
@@ -13711,16 +13719,18 @@
       (eventMethodList) => {
         const eventsList = {};
         const methodsList = {};
-        eventMethodList && Object.keys(eventMethodList).forEach((type) => {
-          eventsList[type] = eventMethodList[type].events;
-          methodsList[type] = eventMethodList[type].methods;
-        });
-        Object.entries(eventsList).forEach(([key, value]) => {
+        if (eventMethodList) {
+          for (const type of Object.keys(eventMethodList)) {
+            eventsList[type] = eventMethodList[type].events;
+            methodsList[type] = eventMethodList[type].methods;
+          }
+        }
+        for (const [key, value] of Object.entries(eventsList)) {
           dataSourceService.setFormEvent(key, value);
-        });
-        Object.entries(methodsList).forEach(([key, value]) => {
+        }
+        for (const [key, value] of Object.entries(methodsList)) {
           dataSourceService.setFormMethod(key, value);
-        });
+        }
       },
       {
         immediate: true
@@ -13751,59 +13761,8 @@
     });
   };
   const initServiceEvents = (props, emit, { editorService, codeBlockService, dataSourceService, depService }) => {
-    const rootChangeHandler = async (value, preValue) => {
-      if (!value) return;
-      value.codeBlocks = value.codeBlocks || {};
-      value.dataSources = value.dataSources || [];
-      codeBlockService.setCodeDsl(value.codeBlocks);
-      dataSourceService.set("dataSources", value.dataSources);
-      depService.removeTargets(core.DepTargetType.CODE_BLOCK);
-      Object.entries(value.codeBlocks).forEach(([id, code]) => {
-        depService.addTarget(core.createCodeBlockTarget(id, code));
-      });
-      dataSourceService.get("dataSources").forEach((ds) => {
-        initDataSourceDepTarget(ds);
-      });
-      if (Array.isArray(value.items)) {
-        depService.clearIdleTasks();
-        collectIdle(value.items, true);
-      } else {
-        depService.clear();
-        delete value.dataSourceDeps;
-        delete value.dataSourceCondDeps;
-      }
-      const nodeId = editorService.get("node")?.id || props.defaultSelected;
-      let node;
-      if (nodeId) {
-        node = editorService.getNodeById(nodeId);
-      }
-      if (node && node !== value) {
-        await editorService.select(node.id);
-      } else if (value.items?.length) {
-        await editorService.select(value.items[0]);
-      } else if (value.id) {
-        editorService.set("nodes", [value]);
-        editorService.set("parent", null);
-        editorService.set("page", null);
-      }
-      if (vue.toRaw(value) !== vue.toRaw(preValue)) {
-        emit("update:modelValue", value);
-      }
-    };
-    const stage = vue.computed(() => editorService.get("stage"));
-    vue.watch(stage, (stage2) => {
-      if (!stage2) {
-        return;
-      }
-      stage2.on("rerender", () => {
-        const node = editorService.get("node");
-        if (!node) return;
-        collectIdle([node], true);
-        updateStage([node]);
-      });
-    });
-    const getApp = () => {
-      const renderer = stage.value?.renderer;
+    const getTMagicApp = () => {
+      const renderer = editorService.get("stage")?.renderer;
       if (!renderer) {
         return void 0;
       }
@@ -13822,101 +13781,41 @@
         });
       });
     };
-    const updateDataSourceSchema = async () => {
-      const root = editorService.get("root");
-      const app = await getApp();
-      if (root && app?.dsl) {
-        app.dsl.dataSourceDeps = root.dataSourceDeps;
-        app.dsl.dataSources = root.dataSources;
-      }
-      if (root?.dataSources) {
-        app?.dataSourceManager?.updateSchema(root.dataSources);
-      }
-    };
-    const targetAddHandler = (target) => {
-      const root = editorService.get("root");
-      if (!root) return;
-      if (target.type === core.DepTargetType.DATA_SOURCE) {
-        if (!root.dataSourceDeps) {
-          root.dataSourceDeps = {};
-        }
-        root.dataSourceDeps[target.id] = target.deps;
-      }
-      if (target.type === core.DepTargetType.DATA_SOURCE_COND) {
-        if (!root.dataSourceCondDeps) {
-          root.dataSourceCondDeps = {};
-        }
-        root.dataSourceCondDeps[target.id] = target.deps;
-      }
-    };
-    const targetRemoveHandler = (id) => {
-      const root = editorService.get("root");
-      if (!root) return;
-      if (root.dataSourceDeps) {
-        delete root.dataSourceDeps[id];
-      }
-      if (root.dataSourceCondDeps) {
-        delete root.dataSourceCondDeps[id];
+    const updateStageNodes = (nodes) => {
+      for (const node of nodes) {
+        updateStageNode(node);
       }
     };
-    const updateStage = (nodes, inDeps = false) => {
+    const updateStageNode = (node) => {
       const root = editorService.get("root");
       if (!root) return;
-      const update = (node) => stage.value?.update({
+      return editorService.get("stage")?.update({
         config: lodashEs.cloneDeep(node),
         parentId: editorService.getParentById(node.id)?.id,
         root: lodashEs.cloneDeep(root)
       });
-      nodes.forEach((node) => {
-        const inDepsNodeId = [];
-        const deps = Object.values(root.dataSourceDeps || {});
-        deps.forEach((dep) => {
-          Object.keys(dep).forEach((id) => {
-            inDepsNodeId.push(id);
-          });
-        });
-        if (inDeps) {
-          if (inDepsNodeId.includes(node.id)) {
-            update(node);
-          }
-        } else {
-          if (!inDepsNodeId.includes(node.id)) {
-            update(node);
-          }
-        }
-      });
     };
-    const dsDepCollectedHandler = async (nodes, deep) => {
+    const updateDataSourceSchema = async () => {
       const root = editorService.get("root");
-      if (!root) return;
-      const app = await getApp();
-      if (app?.dsl) {
-        app.dsl.dataSourceDeps = root.dataSourceDeps;
+      const app = await getTMagicApp();
+      if (!app || !root) {
+        return;
       }
-      if (deep) {
-        nodes.forEach((node) => {
-          utils.traverseNode(
-            node,
-            (node2) => {
-              updateStage([node2], true);
-            },
-            [],
-            true
-          );
-        });
-      } else {
-        updateStage(nodes, true);
+      if (app.dsl) {
+        app.dsl.dataSources = root.dataSources;
+      }
+      if (root.dataSources) {
+        app.dataSourceManager?.updateSchema(root.dataSources);
       }
     };
-    depService.on("add-target", targetAddHandler);
-    depService.on("remove-target", targetRemoveHandler);
-    depService.on("ds-collected", dsDepCollectedHandler);
-    const initDataSourceDepTarget = (ds) => {
-      depService.addTarget(core.createDataSourceTarget(ds, vue.reactive({})));
-      depService.addTarget(core.createDataSourceMethodTarget(ds, vue.reactive({})));
-      depService.addTarget(core.createDataSourceCondTarget(ds, vue.reactive({})));
+    const dsDepCollectedHandler = async () => {
+      const root = editorService.get("root");
+      const app = await getTMagicApp();
+      if (root && app?.dsl) {
+        app.dsl.dataSourceDeps = root.dataSourceDeps;
+      }
     };
-    const collectIdle = (nodes, deep) => Promise.all(
+    const collectIdle = (nodes, deep, type) => Promise.all(
       nodes.map((node) => {
         let pageId;
         if (utils.isPage(node)) {
@@ -13925,75 +13824,146 @@
           const info = editorService.getNodeInfo(node.id);
           pageId = info.page?.id;
         }
-        return depService.collectIdle([node], { pageId }, deep);
+        return depService.collectIdle([node], { pageId }, deep, type);
       })
     );
-    const nodeAddHandler = (nodes) => {
-      collectIdle(nodes, true);
-      updateStage(nodes);
+    vue.watch(
+      () => editorService.get("stage"),
+      (stage) => {
+        if (!stage) {
+          return;
+        }
+        stage.on("rerender", async () => {
+          const node = editorService.get("node");
+          if (!node) return;
+          await collectIdle([node], true, core.DepTargetType.DATA_SOURCE);
+          updateStageNode(node);
+        });
+      }
+    );
+    const initDataSourceDepTarget = (ds) => {
+      depService.addTarget(core.createDataSourceTarget(ds, vue.reactive({})));
+      depService.addTarget(core.createDataSourceMethodTarget(ds, vue.reactive({})));
+      depService.addTarget(core.createDataSourceCondTarget(ds, vue.reactive({})));
     };
-    const nodeUpdateHandler = (data) => {
+    const rootChangeHandler = async (value, preValue) => {
+      if (!value) return;
+      value.codeBlocks = value.codeBlocks || {};
+      value.dataSources = value.dataSources || [];
+      codeBlockService.setCodeDsl(value.codeBlocks);
+      dataSourceService.set("dataSources", value.dataSources);
+      depService.removeTargets(core.DepTargetType.CODE_BLOCK);
+      for (const [id, code] of Object.entries(value.codeBlocks)) {
+        depService.addTarget(core.createCodeBlockTarget(id, code));
+      }
+      for (const ds of dataSourceService.get("dataSources")) {
+        initDataSourceDepTarget(ds);
+      }
+      if (Array.isArray(value.items)) {
+        depService.clearIdleTasks();
+        collectIdle(value.items, true).then(() => {
+          updateStageNodes(value.items);
+        });
+      } else {
+        depService.clear();
+        delete value.dataSourceDeps;
+        delete value.dataSourceCondDeps;
+      }
+      const nodeId = editorService.get("node")?.id || props.defaultSelected;
+      let node;
+      if (nodeId) {
+        node = editorService.getNodeById(nodeId);
+      }
+      if (node && node !== value) {
+        await editorService.select(node.id);
+      } else if (value.items?.length) {
+        await editorService.select(value.items[0]);
+      } else if (value.id) {
+        editorService.set("nodes", [value]);
+        editorService.set("parent", null);
+        editorService.set("page", null);
+      }
+      if (vue.toRaw(value) !== vue.toRaw(preValue)) {
+        emit("update:modelValue", value);
+      }
+    };
+    const nodeAddHandler = async (nodes) => {
+      await collectIdle(nodes, true);
+      updateStageNodes(nodes);
+    };
+    const nodeUpdateHandler = async (data) => {
       const needRecollectNodes = [];
       const normalNodes = [];
-      data.forEach(({ newNode, oldNode, changeRecords }) => {
+      for (const { newNode, oldNode, changeRecords } of data) {
         if (changeRecords?.length) {
-          for (const record of changeRecords) {
-            if (!record.propPath || new RegExp(`${core.NODE_CONDS_KEY}.(\\d)+.cond`).test(record.propPath) || new RegExp(`${core.NODE_CONDS_KEY}.(\\d)+.cond.(\\d)+.value`).test(record.propPath) || record.propPath === core.NODE_CONDS_KEY || utils.isValueIncludeDataSource(record.value)) {
+          forChangeRecords: for (const record of changeRecords) {
+            if (!record.propPath) {
               needRecollectNodes.push(newNode);
-            } else {
-              normalNodes.push(newNode);
+              break forChangeRecords;
+            }
+            if (new RegExp(`${core.NODE_CONDS_KEY}.(\\d)+.cond`).test(record.propPath) || new RegExp(`${core.NODE_CONDS_KEY}.(\\d)+.cond.(\\d)+.value`).test(record.propPath) || record.propPath === core.NODE_CONDS_KEY || utils.isValueIncludeDataSource(record.value)) {
+              needRecollectNodes.push(newNode);
+              break forChangeRecords;
             }
+            for (const target of Object.values(depService.getTargets(core.DepTargetType.DATA_SOURCE))) {
+              if (!target.deps[newNode.id]) {
+                continue;
+              }
+              if (target.deps[newNode.id].keys.includes(record.propPath)) {
+                needRecollectNodes.push(newNode);
+                break forChangeRecords;
+              }
+            }
+            normalNodes.push(newNode);
           }
         } else if (isIncludeDataSource(newNode, oldNode)) {
           needRecollectNodes.push(newNode);
         } else {
           normalNodes.push(newNode);
         }
-      });
+      }
       if (needRecollectNodes.length) {
-        collectIdle(needRecollectNodes, true);
-        updateStage(needRecollectNodes);
-      } else if (normalNodes.length) {
-        updateStage(normalNodes);
+        await collectIdle(needRecollectNodes, true, core.DepTargetType.DATA_SOURCE);
+        await collectIdle(needRecollectNodes, true, core.DepTargetType.DATA_SOURCE_COND);
+        updateStageNodes(needRecollectNodes);
+      } else {
+        updateStageNodes(normalNodes);
+        Promise.all([
+          collectIdle(normalNodes, true, core.DepTargetType.CODE_BLOCK),
+          collectIdle(normalNodes, true, core.DepTargetType.DATA_SOURCE_METHOD)
+        ]);
       }
     };
     const nodeRemoveHandler = (nodes) => {
       depService.clear(nodes);
     };
-    const historyChangeHandler = (page) => {
-      collectIdle([page], true).then(() => {
-        updateDataSourceSchema();
-      });
+    const historyChangeHandler = async (page) => {
+      await collectIdle([page], true);
+      updateStageNode(page);
     };
     editorService.on("history-change", historyChangeHandler);
     editorService.on("root-change", rootChangeHandler);
     editorService.on("add", nodeAddHandler);
     editorService.on("remove", nodeRemoveHandler);
     editorService.on("update", nodeUpdateHandler);
-    const codeBlockAddOrUpdateHandler = (id, codeBlock) => {
-      if (depService.hasTarget(id, core.DepTargetType.CODE_BLOCK)) {
-        depService.getTarget(id, core.DepTargetType.CODE_BLOCK).name = codeBlock.name;
-        return;
-      }
-      depService.addTarget(core.createCodeBlockTarget(id, codeBlock));
-    };
-    const codeBlockRemoveHandler = (id) => {
-      depService.removeTarget(id, core.DepTargetType.CODE_BLOCK);
-    };
-    codeBlockService.on("addOrUpdate", codeBlockAddOrUpdateHandler);
-    codeBlockService.on("remove", codeBlockRemoveHandler);
     const dataSourceAddHandler = async (config) => {
       initDataSourceDepTarget(config);
-      const app = await getApp();
+      const app = await getTMagicApp();
       app?.dataSourceManager?.addDataSource(config);
     };
     const dataSourceUpdateHandler = async (config, { changeRecords }) => {
       let needRecollectDep = false;
+      let isModifyField = false;
+      let isModifyMock = false;
+      let isModifyMethod = false;
       for (const changeRecord of changeRecords) {
         if (!changeRecord.propPath) {
           continue;
         }
-        needRecollectDep = changeRecord.propPath === "fields" || changeRecord.propPath === "methods" || /fields.(\d)+.name/.test(changeRecord.propPath) || /fields.(\d)+$/.test(changeRecord.propPath) || /methods.(\d)+.name/.test(changeRecord.propPath) || /methods.(\d)+$/.test(changeRecord.propPath);
+        isModifyField = changeRecord.propPath === "fields" || /fields.(\d)+.name/.test(changeRecord.propPath) || /fields.(\d)+$/.test(changeRecord.propPath);
+        isModifyMock = changeRecord.propPath === "mocks";
+        isModifyMethod = changeRecord.propPath === "methods" || /methods.(\d)+.name/.test(changeRecord.propPath) || /methods.(\d)+$/.test(changeRecord.propPath);
+        needRecollectDep = isModifyField || isModifyMock || isModifyMethod;
         if (needRecollectDep) {
           break;
         }
@@ -14004,12 +13974,24 @@
           depService.clearIdleTasks();
           removeDataSourceTarget(config.id);
           initDataSourceDepTarget(config);
-          collectIdle(root.items, true).then(() => {
+          let collectIdlePromises = [];
+          if (isModifyField) {
+            collectIdlePromises = [
+              collectIdle(root.items, true, core.DepTargetType.DATA_SOURCE),
+              collectIdle(root.items, true, core.DepTargetType.DATA_SOURCE_COND)
+            ];
+          } else if (isModifyMock) {
+            collectIdlePromises = [collectIdle(root.items, true, core.DepTargetType.DATA_SOURCE)];
+          } else if (isModifyMethod) {
+            collectIdlePromises = [collectIdle(root.items, true, core.DepTargetType.DATA_SOURCE_METHOD)];
+          }
+          Promise.all(collectIdlePromises).then(() => {
             updateDataSourceSchema();
+            updateStageNodes(root.items);
           });
         }
       } else if (root?.dataSources) {
-        const app = await getApp();
+        const app = await getTMagicApp();
         app?.dataSourceManager?.updateSchema(root.dataSources);
       }
     };
@@ -14022,14 +14004,60 @@
       const root = editorService.get("root");
       const nodeIds = Object.keys(root?.dataSourceDeps?.[id] || {});
       const nodes = utils.getNodes(nodeIds, root?.items);
-      collectIdle(nodes, false).then(() => {
+      Promise.all([
+        collectIdle(nodes, false, core.DepTargetType.DATA_SOURCE),
+        collectIdle(nodes, false, core.DepTargetType.DATA_SOURCE_COND),
+        collectIdle(nodes, false, core.DepTargetType.DATA_SOURCE_METHOD)
+      ]).then(() => {
         updateDataSourceSchema();
+        updateStageNodes(nodes);
       });
       removeDataSourceTarget(id);
     };
     dataSourceService.on("add", dataSourceAddHandler);
     dataSourceService.on("update", dataSourceUpdateHandler);
     dataSourceService.on("remove", dataSourceRemoveHandler);
+    const codeBlockAddOrUpdateHandler = (id, codeBlock) => {
+      if (depService.hasTarget(id, core.DepTargetType.CODE_BLOCK)) {
+        depService.getTarget(id, core.DepTargetType.CODE_BLOCK).name = codeBlock.name;
+        return;
+      }
+      depService.addTarget(core.createCodeBlockTarget(id, codeBlock));
+    };
+    const codeBlockRemoveHandler = (id) => {
+      depService.removeTarget(id, core.DepTargetType.CODE_BLOCK);
+    };
+    codeBlockService.on("addOrUpdate", codeBlockAddOrUpdateHandler);
+    codeBlockService.on("remove", codeBlockRemoveHandler);
+    const targetAddHandler = (target) => {
+      const root = editorService.get("root");
+      if (!root) return;
+      if (target.type === core.DepTargetType.DATA_SOURCE) {
+        if (!root.dataSourceDeps) {
+          root.dataSourceDeps = {};
+        }
+        root.dataSourceDeps[target.id] = target.deps;
+      }
+      if (target.type === core.DepTargetType.DATA_SOURCE_COND) {
+        if (!root.dataSourceCondDeps) {
+          root.dataSourceCondDeps = {};
+        }
+        root.dataSourceCondDeps[target.id] = target.deps;
+      }
+    };
+    const targetRemoveHandler = (id) => {
+      const root = editorService.get("root");
+      if (!root) return;
+      if (root.dataSourceDeps) {
+        delete root.dataSourceDeps[id];
+      }
+      if (root.dataSourceCondDeps) {
+        delete root.dataSourceCondDeps[id];
+      }
+    };
+    depService.on("add-target", targetAddHandler);
+    depService.on("remove-target", targetRemoveHandler);
+    depService.on("ds-collected", dsDepCollectedHandler);
     vue.onBeforeUnmount(() => {
       depService.off("add-target", targetAddHandler);
       depService.off("remove-target", targetRemoveHandler);

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.4",
+  "version": "1.5.5",
   "name": "@tmagic/editor",
   "type": "module",
   "sideEffects": [
@@ -58,11 +58,11 @@
     "moveable": "^0.53.0",
     "serialize-javascript": "^6.0.0",
     "sortablejs": "^1.15.2",
-    "@tmagic/design": "1.5.4",
-    "@tmagic/stage": "1.5.4",
-    "@tmagic/form": "1.5.4",
-    "@tmagic/table": "1.5.4",
-    "@tmagic/utils": "1.5.4"
+    "@tmagic/design": "1.5.5",
+    "@tmagic/utils": "1.5.5",
+    "@tmagic/stage": "1.5.5",
+    "@tmagic/form": "1.5.5",
+    "@tmagic/table": "1.5.5"
   },
   "devDependencies": {
     "@types/events": "^3.0.0",
@@ -83,7 +83,7 @@
     "monaco-editor": "^0.48.0",
     "typescript": "*",
     "vue": ">=3.5.0",
-    "@tmagic/core": "1.5.4"
+    "@tmagic/core": "1.5.5"
   },
   "peerDependenciesMeta": {
     "typescript": {