@tmagic/editor 1.4.10 → 1.4.11

package/dist/tmagic-editor.js

@@ -3003,7 +3003,17 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
         name: props.name
       }
     ];
-    const codeParamsConfig = computed(() => getFormConfig(props.paramsConfig));
+    const codeParamsConfig = computed(
+      () => getFormConfig(
+        props.paramsConfig.map(({ name, text, extra, ...config }) => ({
+          type: "data-source-field-select",
+          name,
+          text,
+          extra,
+          fieldConfig: config
+        }))
+      )
+    );
     const onParamsChangeHandler = async () => {
       try {
         const value = await form.value?.submitForm(true);
@@ -3487,7 +3497,9 @@ const useDataSourceMethod = () => {
         tMagicMessage.error("获取数据源方法失败");
         return;
       }
-      let codeContent = method.content;
+      let codeContent = method.content || `({ params, dataSource, app }) => {
+  // place your code here
+}`;
       if (typeof codeContent !== "string") {
         codeContent = codeContent.toString();
       }
@@ -4236,6 +4248,14 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
       if (!ds) return [];
       return getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType);
     });
+    const cascaderOptions = computed(() => {
+      const options = dataSources.value?.map((ds) => ({
+        label: ds.title || ds.id,
+        value: valueIsKey.value ? ds.id : `${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}${ds.id}`,
+        children: getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType)
+      })) || [];
+      return options.filter((option) => option.children.length);
+    });
     const dsChangeHandler = (v) => {
       modelValue.value = [v];
       emit("change", modelValue.value);
@@ -4244,6 +4264,10 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
       modelValue.value = [selectDataSourceId.value, ...v];
       emit("change", modelValue.value);
     };
+    const onChangeHandler = (v = []) => {
+      modelValue.value = v;
+      emit("change", v);
+    };
     const hasDataSourceSidePanel = computed(
       () => (services?.uiService.get("sideBarItems") || []).find((item) => item.$key === SideItemKey.DATA_SOURCE)
     );
@@ -4252,50 +4276,64 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$s, [
-        createVNode(unref(TMagicSelect), {
-          "model-value": selectDataSourceId.value,
+        _ctx.checkStrictly ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+          createVNode(unref(TMagicSelect), {
+            "model-value": selectDataSourceId.value,
+            clearable: "",
+            filterable: "",
+            size: _ctx.size,
+            disabled: _ctx.disabled,
+            onChange: dsChangeHandler
+          }, {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(dataSourcesOptions.value, (option) => {
+                return openBlock(), createBlock(resolveDynamicComponent(unref(optionComponent)?.component || "el-option"), mergeProps(
+                  {
+                    class: "tmagic-design-option",
+                    key: option.value,
+                    ref_for: true
+                  },
+                  unref(optionComponent)?.props({
+                    label: option.text,
+                    value: option.value,
+                    disabled: option.disabled
+                  }) || {
+                    label: option.text,
+                    value: option.value,
+                    disabled: option.disabled
+                  }
+                ), null, 16);
+              }), 128))
+            ]),
+            _: 1
+          }, 8, ["model-value", "size", "disabled"]),
+          createVNode(unref(TMagicCascader), {
+            "model-value": selectFieldsId.value,
+            clearable: "",
+            filterable: "",
+            size: _ctx.size,
+            disabled: _ctx.disabled,
+            options: fieldsOptions.value,
+            props: {
+              checkStrictly: _ctx.checkStrictly
+            },
+            onChange: fieldChangeHandler
+          }, null, 8, ["model-value", "size", "disabled", "options", "props"])
+        ], 64)) : (openBlock(), createBlock(unref(TMagicCascader), {
+          key: 1,
           clearable: "",
           filterable: "",
-          size: _ctx.size,
+          "model-value": modelValue.value,
           disabled: _ctx.disabled,
-          onChange: dsChangeHandler
-        }, {
-          default: withCtx(() => [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(dataSourcesOptions.value, (option) => {
-              return openBlock(), createBlock(resolveDynamicComponent(unref(optionComponent)?.component || "el-option"), mergeProps(
-                {
-                  class: "tmagic-design-option",
-                  key: option.value,
-                  ref_for: true
-                },
-                unref(optionComponent)?.props({
-                  label: option.text,
-                  value: option.value,
-                  disabled: option.disabled
-                }) || {
-                  label: option.text,
-                  value: option.value,
-                  disabled: option.disabled
-                }
-              ), null, 16);
-            }), 128))
-          ]),
-          _: 1
-        }, 8, ["model-value", "size", "disabled"]),
-        createVNode(unref(TMagicCascader), {
-          "model-value": selectFieldsId.value,
-          clearable: "",
-          filterable: "",
           size: _ctx.size,
-          disabled: _ctx.disabled,
-          options: fieldsOptions.value,
+          options: cascaderOptions.value,
           props: {
             checkStrictly: _ctx.checkStrictly
           },
-          onChange: fieldChangeHandler
-        }, null, 8, ["model-value", "size", "disabled", "options", "props"]),
+          onChange: onChangeHandler
+        }, null, 8, ["model-value", "disabled", "size", "options", "props"])),
         selectDataSourceId.value && hasDataSourceSidePanel.value ? (openBlock(), createBlock(unref(TMagicButton), {
-          key: 0,
+          key: 2,
           class: "m-fields-select-action-button",
           size: _ctx.size,
           onClick: _cache[0] || (_cache[0] = ($event) => editHandler(selectDataSourceId.value))
@@ -5644,7 +5682,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
                 {
                   name: "value",
                   type: (mForm2, { model }) => {
-                    const [id, ...fieldNames] = model.field;
+                    const [id, ...fieldNames] = [...parentFields.value, ...model.field];
                     const ds = dataSourceService?.getDataSourceById(id);
                     let fields = ds?.fields || [];
                     let type = "";

package/dist/tmagic-editor.umd.cjs

@@ -3007,7 +3007,17 @@
           name: props.name
         }
       ];
-      const codeParamsConfig = vue.computed(() => getFormConfig(props.paramsConfig));
+      const codeParamsConfig = vue.computed(
+        () => getFormConfig(
+          props.paramsConfig.map(({ name, text, extra, ...config }) => ({
+            type: "data-source-field-select",
+            name,
+            text,
+            extra,
+            fieldConfig: config
+          }))
+        )
+      );
       const onParamsChangeHandler = async () => {
         try {
           const value = await form$1.value?.submitForm(true);
@@ -3491,7 +3501,9 @@
           design.tMagicMessage.error("获取数据源方法失败");
           return;
         }
-        let codeContent = method.content;
+        let codeContent = method.content || `({ params, dataSource, app }) => {
+  // place your code here
+}`;
         if (typeof codeContent !== "string") {
           codeContent = codeContent.toString();
         }
@@ -4240,6 +4252,14 @@
         if (!ds) return [];
         return getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType);
       });
+      const cascaderOptions = vue.computed(() => {
+        const options = dataSources.value?.map((ds) => ({
+          label: ds.title || ds.id,
+          value: valueIsKey.value ? ds.id : `${utils.DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}${ds.id}`,
+          children: getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType)
+        })) || [];
+        return options.filter((option) => option.children.length);
+      });
       const dsChangeHandler = (v) => {
         modelValue.value = [v];
         emit("change", modelValue.value);
@@ -4248,6 +4268,10 @@
         modelValue.value = [selectDataSourceId.value, ...v];
         emit("change", modelValue.value);
       };
+      const onChangeHandler = (v = []) => {
+        modelValue.value = v;
+        emit("change", v);
+      };
       const hasDataSourceSidePanel = vue.computed(
         () => (services?.uiService.get("sideBarItems") || []).find((item) => item.$key === SideItemKey.DATA_SOURCE)
       );
@@ -4256,50 +4280,64 @@
       };
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$s, [
-          vue.createVNode(vue.unref(design.TMagicSelect), {
-            "model-value": selectDataSourceId.value,
+          _ctx.checkStrictly ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+            vue.createVNode(vue.unref(design.TMagicSelect), {
+              "model-value": selectDataSourceId.value,
+              clearable: "",
+              filterable: "",
+              size: _ctx.size,
+              disabled: _ctx.disabled,
+              onChange: dsChangeHandler
+            }, {
+              default: vue.withCtx(() => [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(dataSourcesOptions.value, (option) => {
+                  return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(optionComponent)?.component || "el-option"), vue.mergeProps(
+                    {
+                      class: "tmagic-design-option",
+                      key: option.value,
+                      ref_for: true
+                    },
+                    vue.unref(optionComponent)?.props({
+                      label: option.text,
+                      value: option.value,
+                      disabled: option.disabled
+                    }) || {
+                      label: option.text,
+                      value: option.value,
+                      disabled: option.disabled
+                    }
+                  ), null, 16);
+                }), 128))
+              ]),
+              _: 1
+            }, 8, ["model-value", "size", "disabled"]),
+            vue.createVNode(vue.unref(design.TMagicCascader), {
+              "model-value": selectFieldsId.value,
+              clearable: "",
+              filterable: "",
+              size: _ctx.size,
+              disabled: _ctx.disabled,
+              options: fieldsOptions.value,
+              props: {
+                checkStrictly: _ctx.checkStrictly
+              },
+              onChange: fieldChangeHandler
+            }, null, 8, ["model-value", "size", "disabled", "options", "props"])
+          ], 64)) : (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicCascader), {
+            key: 1,
             clearable: "",
             filterable: "",
-            size: _ctx.size,
+            "model-value": modelValue.value,
             disabled: _ctx.disabled,
-            onChange: dsChangeHandler
-          }, {
-            default: vue.withCtx(() => [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(dataSourcesOptions.value, (option) => {
-                return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(optionComponent)?.component || "el-option"), vue.mergeProps(
-                  {
-                    class: "tmagic-design-option",
-                    key: option.value,
-                    ref_for: true
-                  },
-                  vue.unref(optionComponent)?.props({
-                    label: option.text,
-                    value: option.value,
-                    disabled: option.disabled
-                  }) || {
-                    label: option.text,
-                    value: option.value,
-                    disabled: option.disabled
-                  }
-                ), null, 16);
-              }), 128))
-            ]),
-            _: 1
-          }, 8, ["model-value", "size", "disabled"]),
-          vue.createVNode(vue.unref(design.TMagicCascader), {
-            "model-value": selectFieldsId.value,
-            clearable: "",
-            filterable: "",
             size: _ctx.size,
-            disabled: _ctx.disabled,
-            options: fieldsOptions.value,
+            options: cascaderOptions.value,
             props: {
               checkStrictly: _ctx.checkStrictly
             },
-            onChange: fieldChangeHandler
-          }, null, 8, ["model-value", "size", "disabled", "options", "props"]),
+            onChange: onChangeHandler
+          }, null, 8, ["model-value", "disabled", "size", "options", "props"])),
           selectDataSourceId.value && hasDataSourceSidePanel.value ? (vue.openBlock(), vue.createBlock(vue.unref(design.TMagicButton), {
-            key: 0,
+            key: 2,
             class: "m-fields-select-action-button",
             size: _ctx.size,
             onClick: _cache[0] || (_cache[0] = ($event) => editHandler(selectDataSourceId.value))
@@ -5648,7 +5686,7 @@
                   {
                     name: "value",
                     type: (mForm2, { model }) => {
-                      const [id, ...fieldNames] = model.field;
+                      const [id, ...fieldNames] = [...parentFields.value, ...model.field];
                       const ds = dataSourceService?.getDataSourceById(id);
                       let fields = ds?.fields || [];
                       let type = "";

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.4.10",
+  "version": "1.4.11",
   "name": "@tmagic/editor",
   "type": "module",
   "sideEffects": [
@@ -55,8 +55,8 @@
     "moveable": "^0.53.0",
     "serialize-javascript": "^6.0.0",
     "sortablejs": "^1.15.2",
-    "@tmagic/dep": "1.4.10",
-    "@tmagic/table": "1.4.10"
+    "@tmagic/dep": "1.4.11",
+    "@tmagic/table": "1.4.11"
   },
   "devDependencies": {
     "@types/events": "^3.0.0",
@@ -78,12 +78,12 @@
     "monaco-editor": "^0.48.0",
     "typescript": "*",
     "vue": "^3.4.27",
-    "@tmagic/core": "1.4.10",
-    "@tmagic/design": "1.4.10",
-    "@tmagic/schema": "1.4.10",
-    "@tmagic/form": "1.4.10",
-    "@tmagic/stage": "1.4.10",
-    "@tmagic/utils": "1.4.10"
+    "@tmagic/form": "1.4.11",
+    "@tmagic/schema": "1.4.11",
+    "@tmagic/core": "1.4.11",
+    "@tmagic/stage": "1.4.11",
+    "@tmagic/design": "1.4.11",
+    "@tmagic/utils": "1.4.11"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/components/CodeParams.vue

@@ -44,7 +44,17 @@ const getFormConfig = (items: FormConfig = []) => [
   },
 ];
 
-const codeParamsConfig = computed(() => getFormConfig(props.paramsConfig));
+const codeParamsConfig = computed(() =>
+  getFormConfig(
+    props.paramsConfig.map(({ name, text, extra, ...config }) => ({
+      type: 'data-source-field-select',
+      name,
+      text,
+      extra,
+      fieldConfig: config,
+    })),
+  ),
+);
 
 /**
  * 参数值修改更新

package/src/fields/DataSourceFieldSelect/FieldSelect.vue

@@ -1,44 +1,60 @@
 <template>
   <div class="m-editor-data-source-field-select">
-    <TMagicSelect
-      :model-value="selectDataSourceId"
-      clearable
-      filterable
-      :size="size"
-      :disabled="disabled"
-      @change="dsChangeHandler"
-    >
-      <component
-        v-for="option in dataSourcesOptions"
-        class="tmagic-design-option"
-        :key="option.value"
-        :is="optionComponent?.component || 'el-option'"
-        v-bind="
-          optionComponent?.props({
-            label: option.text,
-            value: option.value,
-            disabled: option.disabled,
-          }) || {
-            label: option.text,
-            value: option.value,
-            disabled: option.disabled,
-          }
-        "
+    <template v-if="checkStrictly">
+      <TMagicSelect
+        :model-value="selectDataSourceId"
+        clearable
+        filterable
+        :size="size"
+        :disabled="disabled"
+        @change="dsChangeHandler"
       >
-      </component>
-    </TMagicSelect>
+        <component
+          v-for="option in dataSourcesOptions"
+          class="tmagic-design-option"
+          :key="option.value"
+          :is="optionComponent?.component || 'el-option'"
+          v-bind="
+            optionComponent?.props({
+              label: option.text,
+              value: option.value,
+              disabled: option.disabled,
+            }) || {
+              label: option.text,
+              value: option.value,
+              disabled: option.disabled,
+            }
+          "
+        >
+        </component>
+      </TMagicSelect>
+
+      <TMagicCascader
+        :model-value="selectFieldsId"
+        clearable
+        filterable
+        :size="size"
+        :disabled="disabled"
+        :options="fieldsOptions"
+        :props="{
+          checkStrictly,
+        }"
+        @change="fieldChangeHandler"
+      ></TMagicCascader>
+    </template>
 
     <TMagicCascader
-      :model-value="selectFieldsId"
+      v-else
       clearable
       filterable
-      :size="size"
+      :model-value="modelValue"
       :disabled="disabled"
-      :options="fieldsOptions"
+      :size="size"
+      :options="cascaderOptions"
       :props="{
         checkStrictly,
       }"
-      @change="fieldChangeHandler"
+      @change="onChangeHandler"
     ></TMagicCascader>
 
     <TMagicButton
@@ -132,6 +148,16 @@ const fieldsOptions = computed(() => {
   return getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType);
 });
 
+const cascaderOptions = computed(() => {
+  const options =
+    dataSources.value?.map((ds) => ({
+      label: ds.title || ds.id,
+      value: valueIsKey.value ? ds.id : `${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}${ds.id}`,
+      children: getCascaderOptionsFromFields(ds.fields, props.dataSourceFieldType),
+    })) || [];
+  return options.filter((option) => option.children.length);
+});
+
 const dsChangeHandler = (v: string) => {
   modelValue.value = [v];
   emit('change', modelValue.value);
@@ -142,6 +168,11 @@ const fieldChangeHandler = (v: string[] = []) => {
   emit('change', modelValue.value);
 };
 
+const onChangeHandler = (v: string[] = []) => {
+  modelValue.value = v;
+  emit('change', v);
+};
+
 const hasDataSourceSidePanel = computed(() =>
   (services?.uiService.get('sideBarItems') || []).find((item) => item.$key === SideItemKey.DATA_SOURCE),
 );

package/src/fields/DisplayConds.vue

@@ -103,7 +103,7 @@ const config = computed<GroupListConfig>(() => ({
             {
               name: 'value',
               type: (mForm, { model }) => {
-                const [id, ...fieldNames] = model.field;
+                const [id, ...fieldNames] = [...parentFields.value, ...model.field];
 
                 const ds = dataSourceService?.getDataSourceById(id);
 

package/src/hooks/use-data-source-method.ts

@@ -41,7 +41,7 @@ export const useDataSourceMethod = () => {
         return;
       }
 
-      let codeContent = method.content;
+      let codeContent = method.content || `({ params, dataSource, app }) => {\n  // place your code here\n}`;
 
       if (typeof codeContent !== 'string') {
         codeContent = codeContent.toString();

package/src/type.ts

@@ -774,7 +774,7 @@ export type PropsFormValueFunction = (data: { editorService: EditorService }) =>
 export type PartSortableOptions = Omit<Options, 'onStart' | 'onUpdate'>;
 export interface PageBarSortOptions extends PartSortableOptions {
   /** 在onUpdate之后调用 */
-  afterUpdate: (event: SortableEvent, sortable: Sortable) => void;
+  afterUpdate?: (event: SortableEvent, sortable: Sortable) => void;
   /** 在onStart之前调用 */
-  beforeStart: (event: SortableEvent, sortable: Sortable) => void;
+  beforeStart?: (event: SortableEvent, sortable: Sortable) => void;
 }

package/types/type.d.ts

@@ -645,7 +645,7 @@ export type PropsFormValueFunction = (data: {
 export type PartSortableOptions = Omit<Options, 'onStart' | 'onUpdate'>;
 export interface PageBarSortOptions extends PartSortableOptions {
     /** 在onUpdate之后调用 */
-    afterUpdate: (event: SortableEvent, sortable: Sortable) => void;
+    afterUpdate?: (event: SortableEvent, sortable: Sortable) => void;
     /** 在onStart之前调用 */
-    beforeStart: (event: SortableEvent, sortable: Sortable) => void;
+    beforeStart?: (event: SortableEvent, sortable: Sortable) => void;
 }