feat(editor,util): 完善数据源配置

packages/editor/src/components/CodeBlockEditor.vue

@@ -50,7 +50,7 @@
 import { computed, inject, onUnmounted, ref } from 'vue';
 
 import { TMagicButton, TMagicDialog, tMagicMessage, tMagicMessageBox, TMagicTag } from '@tmagic/design';
-import { ColumnConfig, FormState, MFormDrawer } from '@tmagic/form';
+import { ColumnConfig, FormConfig, FormState, MFormDrawer } from '@tmagic/form';
 import type { CodeBlockContent } from '@tmagic/schema';
 
 import CodeEditor from '@editor/layouts/CodeEditor.vue';
@@ -65,6 +65,7 @@ const props = defineProps<{
   content: CodeBlockContent;
   disabled?: boolean;
   isDataSource?: boolean;
+  dataSourceType?: string;
 }>();
 
 const emit = defineEmits<{
@@ -135,10 +136,11 @@ const defaultParamColConfig: ColumnConfig = {
   ],
 };
 
-const functionConfig = computed(() => [
+const functionConfig = computed<FormConfig>(() => [
   {
     text: '名称',
     name: 'name',
+    rules: [{ required: true, message: '请输入名称', trigger: 'blur' }],
   },
   {
     text: '描述',
@@ -148,10 +150,17 @@ const functionConfig = computed(() => [
     text: '执行时机',
     name: 'timing',
     type: 'select',
-    options: [
+    options: () => {
-      { text: '初始化前', value: 'beforeInit' },
+      const options = [
-      { text: '初始化后', value: 'afterInit' },
+        { text: '初始化前', value: 'beforeInit' },
-    ],
+        { text: '初始化后', value: 'afterInit' },
+      ];
+      if (props.dataSourceType !== 'base') {
+        options.push({ text: '请求前', value: 'beforeRequest' });
+        options.push({ text: '请求后', value: 'afterRequest' });
+      }
+      return options;
+    },
     display: () => props.isDataSource,
   },
   {

packages/editor/src/fields/DataSourceFields.vue

@@ -171,6 +171,16 @@ const dataSourceFieldsConfig: FormConfig = [
   {
     name: 'defaultValue',
     text: '默认值',
+    type: (mForm: FormState | undefined, { model }: any) => {
+      if (model.type === 'number') return 'number';
+      if (model.type === 'boolean') return 'select';
+
+      return 'string';
+    },
+    options: [
+      { text: 'true', value: true },
+      { text: 'false', value: false },
+    ],
   },
   {
     name: 'enable',

packages/editor/src/fields/DataSourceMethods.vue

@@ -14,6 +14,7 @@
       :disabled="disabled"
       :content="codeConfig"
       :is-data-source="true"
+      :data-source-type="model.type"
       @submit="submitCodeHandler"
     ></CodeBlockEditor>
   </div>

packages/editor/src/utils/data-source/formConfigs/http.ts

@@ -7,6 +7,15 @@ export default [
     type: 'switch',
     defaultValue: true,
   },
+  {
+    name: 'responseOptions',
+    items: [
+      {
+        name: 'dataPath',
+        text: '数据路径',
+      },
+    ],
+  },
   {
     type: 'fieldset',
     name: 'options',

packages/editor/src/utils/props.ts

@@ -248,7 +248,7 @@ export const displayTabConfig: TabPaneConfig = {
             },
             {
               type: 'select',
-              options: (mForm: FormState | undefined, { model }: any) => {
+              options: (mForm, { model }) => {
                 const [id, field] = model.field;
 
                 const ds = dataSourceService.getDataSourceById(id);
@@ -284,23 +284,33 @@ export const displayTabConfig: TabPaneConfig = {
               items: [
                 {
                   name: 'value',
-                  display: (vm: FormState, { model }: any) =>
+                  type: (mForm, { model }) => {
-                    !['between', 'not_between', 'is', 'not'].includes(model.op),
+                    const [id, field] = model.field;
-                },
+
-                {
+                    const ds = dataSourceService.getDataSourceById(id);
-                  name: 'value',
+
-                  type: 'select',
+                    const type = ds?.fields.find((f) => f.name === field)?.type;
+
+                    if (type === 'number') {
+                      return 'number';
+                    }
+
+                    if (type === 'boolean') {
+                      return 'select';
+                    }
+
+                    return 'text';
+                  },
                   options: [
                     { text: 'true', value: true },
                     { text: 'false', value: false },
                   ],
-                  display: (vm: FormState, { model }: any) => ['is', 'not'].includes(model.op),
+                  display: (vm, { model }) => !['between', 'not_between'].includes(model.op),
                 },
                 {
                   name: 'range',
                   type: 'number-range',
-                  display: (vm: FormState, { model }: any) =>
+                  display: (vm, { model }) => ['between', 'not_between'].includes(model.op),
-                    ['between', 'not_between'].includes(model.op) && !['is', 'not'].includes(model.op),
                 },
               ],
             },