@tmagic/editor 1.5.13 → 1.5.15

package/dist/tmagic-editor.js

@@ -471,13 +471,11 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
                 { value: HookCodeType.DATA_SOURCE_METHOD, text: "数据源方法" }
               ],
               defaultValue: "code",
-              onChange: (mForm, v, { model, prop, changeRecords }) => {
+              onChange: (_mForm, v, { setModel }) => {
                 if (v === HookCodeType.DATA_SOURCE_METHOD) {
-                  model.codeId = [];
-                  changeRecords.push({ propPath: prop.replace("codeType", "codeId"), value: [] });
+                  setModel("codeId", []);
                 } else {
-                  model.codeId = "";
-                  changeRecords.push({ propPath: prop.replace("codeType", "codeId"), value: "" });
+                  setModel("codeId", "");
                 }
                 return v;
               }
@@ -487,7 +485,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
               name: "codeId",
               span: 18,
               labelWidth: 0,
-              display: (mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
+              display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
               notEditable: () => !codeBlockService.getEditStatus()
             },
             {
@@ -495,7 +493,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent({
               name: "codeId",
               span: 18,
               labelWidth: 0,
-              display: (mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
+              display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
               notEditable: () => !dataSourceService.get("editable")
             }
           ]
@@ -693,13 +691,12 @@ const fillConfig$1 = (config = [], labelWidth = "80px") => [
             append: {
               type: "button",
               text: "复制",
-              handler: async (vm, { model }) => {
-                try {
-                  await navigator.clipboard.writeText(`${model.id}`);
+              handler: (vm, { model }) => {
+                navigator.clipboard.writeText(`${model.id}`).then(() => {
                   tMagicMessage.success("已复制");
-                } catch (err) {
+                }).catch(() => {
                   tMagicMessage.error("复制失败");
-                }
+                });
               }
             }
           },
@@ -2437,10 +2434,11 @@ class Editor extends BaseService {
     this.isHistoryStateChange = true;
     await this.update(value.data);
     this.set("modifiedNodeIds", value.modifiedNodeIds);
-    setTimeout(async () => {
+    setTimeout(() => {
       if (!value.nodeId) return;
-      await this.select(value.nodeId);
-      this.get("stage")?.select(value.nodeId);
+      this.select(value.nodeId).then(() => {
+        this.get("stage")?.select(value.nodeId);
+      });
     }, 0);
     this.emit("history-change", value.data);
   }
@@ -3212,20 +3210,23 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
         }
         return [];
       },
-      onChange: (formState, codeId, { model }) => {
+      onChange: (formState, codeId, { setModel, model }) => {
         paramsConfig.value = getParamItemsConfig(codeId);
         if (paramsConfig.value.length) {
-          model.params = createValues(formState, paramsConfig.value, {}, model.params);
+          setModel("params", createValues(formState, paramsConfig.value, {}, model.params));
         } else {
-          model.params = {};
+          setModel("params", {});
         }
         return codeId;
       }
     };
-    const onCodeIdChangeHandler = (value) => {
+    const onCodeIdChangeHandler = (value, eventData) => {
       props.model.params = value.params;
       emit("change", props.model, {
-        changeRecords: [
+        changeRecords: eventData.changeRecords?.map((item) => ({
+          prop: `${props.prop.replace(props.name, "")}${item.propPath}`,
+          value: item.value
+        })) || [
           {
             propPath: props.prop,
             value: value[props.name]
@@ -3590,9 +3591,7 @@ const useCodeBlockEdit = (codeBlockService) => {
   const createCodeBlock = async () => {
     codeConfig.value = {
       name: "",
-      content: `({app, params, flowState}) => {
-  // place your code here
-}`,
+      content: "({app, params, flowState}) => {\n  // place your code here\n}",
       params: []
     };
     codeId.value = await codeBlockService.getUniqueId();
@@ -4164,6 +4163,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
           try {
             return JSON.stringify(row.defaultValue);
           } catch (e) {
+            error(e);
             return row.defaultValue;
           }
         }
@@ -4212,9 +4212,9 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
           { text: "null", value: "null" },
           { text: "any", value: "any" }
         ],
-        onChange: (formState, v, { model }) => {
+        onChange: (_formState, v, { setModel }) => {
           if (!["any", "array", "object"].includes(v)) {
-            model.fields = [];
+            setModel("fields", []);
           }
           return v;
         }
@@ -5433,9 +5433,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
           {
             text: "编辑",
             handler: (method, index) => {
-              let codeContent = method.content || `({ params, dataSource, app }) => {
-  // place your code here
-}`;
+              let codeContent = method.content || "({ params, dataSource, app }) => {\n  // place your code here\n}";
               if (typeof codeContent !== "string") {
                 codeContent = codeContent.toString();
               }
@@ -5464,9 +5462,7 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
     const createCodeHandler = () => {
       codeConfig.value = {
         name: "",
-        content: `({ params, dataSource, app, flowState }) => {
-  // place your code here
-}`,
+        content: "({ params, dataSource, app, flowState }) => {\n  // place your code here\n}",
         params: []
       };
       editIndex = -1;
@@ -5585,12 +5581,12 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
       }));
     };
     const paramsConfig = ref(getParamItemsConfig(props.model[props.name || "dataSourceMethod"]));
-    const setParamsConfig = (dataSourceMethod, formState = {}) => {
+    const setParamsConfig = (dataSourceMethod, formState = {}, setModel) => {
       paramsConfig.value = dataSourceMethod ? getParamItemsConfig(dataSourceMethod) : [];
       if (paramsConfig.value.length) {
-        props.model.params = createValues(formState, paramsConfig.value, {}, props.model.params);
+        setModel("params", createValues(formState, paramsConfig.value, {}, props.model.params));
       } else {
-        props.model.params = {};
+        setModel("params", {});
       }
     };
     const methodsOptions = computed(
@@ -5611,8 +5607,8 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
       name: props.name,
       options: methodsOptions.value,
       disable: props.disabled,
-      onChange: (formState, dataSourceMethod) => {
-        setParamsConfig(dataSourceMethod, formState);
+      onChange: (formState, dataSourceMethod, { setModel }) => {
+        setParamsConfig(dataSourceMethod, formState, setModel);
         return dataSourceMethod;
       }
     }));
@@ -6280,8 +6276,8 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
         text: "联动组件",
         type: "ui-select",
         display: (mForm, { model }) => model.actionType === ActionType.COMP,
-        onChange: (MForm, v, { model }) => {
-          model.method = "";
+        onChange: (MForm, v, { setModel }) => {
+          setModel("method", "");
           return v;
         }
       };
@@ -9372,7 +9368,7 @@ const _sfc_main$r = /* @__PURE__ */ defineComponent({
             type: "button",
             className: "delete",
             icon: markRaw(Delete),
-            tooltip: `刪除(Delete)`,
+            tooltip: "刪除(Delete)",
             disabled: () => editorService.get("node")?.type === NodeType.PAGE,
             handler: () => {
               const node = editorService.get("node");
@@ -10607,13 +10603,13 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     eventBus?.on("edit-code", (id) => {
       editCode(id);
     });
-    const editDialogOpenHandler = () => {
+    watch(codeId, () => {
       if (codeBlockListRef.value) {
         for (const [statusId, status] of codeBlockListRef.value.nodeStatusMap.entries()) {
           status.selected = statusId === codeId.value;
         }
       }
-    };
+    });
     const editDialogCloseHandler = () => {
       if (codeBlockListRef.value) {
         for (const [, status] of codeBlockListRef.value.nodeStatusMap.entries()) {
@@ -10685,8 +10681,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
             disabled: !editable.value,
             content: unref(codeConfig),
             onSubmit: unref(submitCodeBlockHandler),
-            onClose: editDialogCloseHandler,
-            onOpen: editDialogOpenHandler
+            onClose: editDialogCloseHandler
           }, null, 8, ["disabled", "content", "onSubmit"])) : createCommentVNode("v-if", true),
           (openBlock(), createBlock(Teleport, { to: "body" }, [
             menuData.value.length ? (openBlock(), createBlock(_sfc_main$o, {
@@ -11073,20 +11068,20 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
     const eventBus = inject("eventBus");
     const { dataSourceService } = useServices();
     const { editDialog, dataSourceValues, dialogTitle, editable, editHandler, submitDataSourceHandler } = useDataSourceEdit(dataSourceService);
-    const editDialogOpenHandler = (id) => {
-      if (dataSourceList.value) {
-        for (const [statusId, status] of dataSourceList.value.nodeStatusMap.entries()) {
-          status.selected = statusId === id;
-        }
-      }
-    };
     const editDialogCloseHandler = () => {
-      if (dataSourceList.value) {
-        for (const [, status] of dataSourceList.value.nodeStatusMap.entries()) {
+      if (dataSourceListRef.value) {
+        for (const [, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
           status.selected = false;
         }
       }
     };
+    watch(dataSourceValues, (dataSourceValues2) => {
+      if (dataSourceListRef.value && dataSourceValues2.id) {
+        for (const [statusId, status] of dataSourceListRef.value.nodeStatusMap.entries()) {
+          status.selected = statusId === dataSourceValues2.id;
+        }
+      }
+    });
     const datasourceTypeList = computed(
       () => [
         { text: "基础", type: "base" },
@@ -11116,9 +11111,9 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       });
       dataSourceService.remove(id);
     };
-    const dataSourceList = ref();
+    const dataSourceListRef = useTemplateRef("dataSourceList");
     const filterTextChangeHandler = (val) => {
-      dataSourceList.value?.filter(val);
+      dataSourceListRef.value?.filter(val);
     };
     eventBus?.on("edit-data-source", (id) => {
       editHandler(id);
@@ -11185,8 +11180,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
               ]),
               createCommentVNode(" 数据源列表 "),
               createVNode(_sfc_main$h, {
-                ref_key: "dataSourceList",
-                ref: dataSourceList,
+                ref: "dataSourceList",
                 indent: _ctx.indent,
                 "next-level-indent-increment": _ctx.nextLevelIndentIncrement,
                 onEdit: unref(editHandler),
@@ -11204,8 +11198,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
             values: unref(dataSourceValues),
             title: unref(dialogTitle),
             onSubmit: unref(submitDataSourceHandler),
-            onClose: editDialogCloseHandler,
-            onOpen: editDialogOpenHandler
+            onClose: editDialogCloseHandler
           }, null, 8, ["disabled", "values", "title", "onSubmit"]),
           (openBlock(), createBlock(Teleport, { to: "body" }, [
             menuData.value.length ? (openBlock(), createBlock(_sfc_main$o, {
@@ -14658,10 +14651,10 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
   const getTMagicApp = () => {
     const renderer = editorService.get("stage")?.renderer;
     if (!renderer) {
-      return void 0;
+      return Promise.resolve(void 0);
     }
     if (renderer.runtime) {
-      return renderer.runtime.getApp?.();
+      return Promise.resolve(renderer.runtime.getApp?.());
     }
     return new Promise((resolve) => {
       const timeout = globalThis.setTimeout(() => {
@@ -14699,12 +14692,13 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       app.dsl.dataSources = root.dataSources;
     }
   };
-  const dsDepCollectedHandler = async () => {
+  const dsDepCollectedHandler = () => {
     const root = editorService.get("root");
-    const app = await getTMagicApp();
-    if (root && app?.dsl) {
-      app.dsl.dataSourceDeps = root.dataSourceDeps;
-    }
+    getTMagicApp()?.then((app) => {
+      if (root && app?.dsl) {
+        app.dsl.dataSourceDeps = root.dataSourceDeps;
+      }
+    });
   };
   const collectIdle = (nodes, deep, type) => Promise.all(
     nodes.map((node) => {
@@ -14737,7 +14731,7 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
     depService.addTarget(createDataSourceMethodTarget(ds, reactive({})));
     depService.addTarget(createDataSourceCondTarget(ds, reactive({})));
   };
-  const rootChangeHandler = async (value, preValue) => {
+  const rootChangeHandler = (value, preValue) => {
     if (!value) return;
     value.codeBlocks = value.codeBlocks || {};
     value.dataSources = value.dataSources || [];
@@ -14760,29 +14754,33 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       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 (toRaw(value) !== toRaw(preValue)) {
-      emit("update:modelValue", value);
-    }
+    const handler = async () => {
+      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 (toRaw(value) !== toRaw(preValue)) {
+        emit("update:modelValue", value);
+      }
+    };
+    handler();
   };
-  const nodeAddHandler = async (nodes) => {
-    await collectIdle(nodes, true);
-    updateStageNodes(nodes);
+  const nodeAddHandler = (nodes) => {
+    collectIdle(nodes, true).then(() => {
+      updateStageNodes(nodes);
+    });
   };
-  const nodeUpdateHandler = async (data) => {
+  const nodeUpdateHandler = (data) => {
     const needRecollectNodes = [];
     const normalNodes = [];
     for (const { newNode, oldNode, changeRecords } of data) {
@@ -14814,9 +14812,12 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
       }
     }
     if (needRecollectNodes.length) {
-      await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE);
-      await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE_COND);
-      updateStageNodes(needRecollectNodes);
+      const handler = async () => {
+        await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE);
+        await collectIdle(needRecollectNodes, true, DepTargetType.DATA_SOURCE_COND);
+        updateStageNodes(needRecollectNodes);
+      };
+      handler();
     } else {
       updateStageNodes(normalNodes);
       Promise.all([
@@ -14828,28 +14829,32 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
   const nodeRemoveHandler = (nodes) => {
     depService.clear(nodes);
   };
-  const historyChangeHandler = async (page) => {
-    await collectIdle([page], true);
-    updateStageNode(page);
+  const historyChangeHandler = (page) => {
+    collectIdle([page], true).then(() => {
+      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 dataSourceAddHandler = async (config) => {
-    initDataSourceDepTarget(config);
-    const app = await getTMagicApp();
-    if (!app?.dataSourceManager) {
-      return;
-    }
-    app.dataSourceManager.addDataSource(config);
-    const newDs = app.dataSourceManager.get(config.id);
-    if (newDs) {
-      app.dataSourceManager.init(newDs);
-    }
+  const dataSourceAddHandler = (config) => {
+    const handler = async () => {
+      initDataSourceDepTarget(config);
+      const app = await getTMagicApp();
+      if (!app?.dataSourceManager) {
+        return;
+      }
+      app.dataSourceManager.addDataSource(config);
+      const newDs = app.dataSourceManager.get(config.id);
+      if (newDs) {
+        app.dataSourceManager.init(newDs);
+      }
+    };
+    handler();
   };
-  const dataSourceUpdateHandler = async (config, { changeRecords }) => {
+  const dataSourceUpdateHandler = (config, { changeRecords }) => {
     const updateDsData = async () => {
       const app = await getTMagicApp();
       if (!app?.dataSourceManager) {
@@ -14910,23 +14915,26 @@ const initServiceEvents = (props, emit, { editorService, codeBlockService, dataS
     depService.removeTarget(id, DepTargetType.DATA_SOURCE_COND);
     depService.removeTarget(id, DepTargetType.DATA_SOURCE_METHOD);
   };
-  const dataSourceRemoveHandler = async (id) => {
+  const dataSourceRemoveHandler = (id) => {
     const root = editorService.get("root");
     if (!root) {
       return;
     }
-    const nodeIds = Object.keys(root.dataSourceDeps?.[id] || {});
-    const nodes = getNodes(nodeIds, root.items);
-    await Promise.all([
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE),
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE_COND),
-      collectIdle(nodes, false, DepTargetType.DATA_SOURCE_METHOD)
-    ]);
-    updateDataSourceSchema();
-    const app = await getTMagicApp();
-    app?.dataSourceManager?.removeDataSource(id);
-    updateStageNodes(nodes);
-    removeDataSourceTarget(id);
+    const handler = async () => {
+      const nodeIds = Object.keys(root.dataSourceDeps?.[id] || {});
+      const nodes = getNodes(nodeIds, root.items);
+      await Promise.all([
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE),
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE_COND),
+        collectIdle(nodes, false, DepTargetType.DATA_SOURCE_METHOD)
+      ]);
+      updateDataSourceSchema();
+      const app = await getTMagicApp();
+      app?.dataSourceManager?.removeDataSource(id);
+      updateStageNodes(nodes);
+      removeDataSourceTarget(id);
+    };
+    handler();
   };
   dataSourceService.on("add", dataSourceAddHandler);
   dataSourceService.on("update", dataSourceUpdateHandler);