mirror of
				https://github.com/Tencent/tmagic-editor.git
				synced 2025-11-04 02:28:04 +08:00 
			
		
		
		
	feat(editor,util): 完善数据源配置
This commit is contained in:
		
							parent
							
								
									28b3d2e4b3
								
							
						
					
					
						commit
						5840ee537f
					
				@ -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: [
 | 
			
		||||
      { text: '初始化前', value: 'beforeInit' },
 | 
			
		||||
      { text: '初始化后', value: 'afterInit' },
 | 
			
		||||
    ],
 | 
			
		||||
    options: () => {
 | 
			
		||||
      const options = [
 | 
			
		||||
        { 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,
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
 | 
			
		||||
@ -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',
 | 
			
		||||
 | 
			
		||||
@ -14,6 +14,7 @@
 | 
			
		||||
      :disabled="disabled"
 | 
			
		||||
      :content="codeConfig"
 | 
			
		||||
      :is-data-source="true"
 | 
			
		||||
      :data-source-type="model.type"
 | 
			
		||||
      @submit="submitCodeHandler"
 | 
			
		||||
    ></CodeBlockEditor>
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
@ -7,6 +7,15 @@ export default [
 | 
			
		||||
    type: 'switch',
 | 
			
		||||
    defaultValue: true,
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    name: 'responseOptions',
 | 
			
		||||
    items: [
 | 
			
		||||
      {
 | 
			
		||||
        name: 'dataPath',
 | 
			
		||||
        text: '数据路径',
 | 
			
		||||
      },
 | 
			
		||||
    ],
 | 
			
		||||
  },
 | 
			
		||||
  {
 | 
			
		||||
    type: 'fieldset',
 | 
			
		||||
    name: 'options',
 | 
			
		||||
 | 
			
		||||
@ -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) =>
 | 
			
		||||
                    !['between', 'not_between', 'is', 'not'].includes(model.op),
 | 
			
		||||
                },
 | 
			
		||||
                {
 | 
			
		||||
                  name: 'value',
 | 
			
		||||
                  type: 'select',
 | 
			
		||||
                  type: (mForm, { model }) => {
 | 
			
		||||
                    const [id, field] = model.field;
 | 
			
		||||
 | 
			
		||||
                    const ds = dataSourceService.getDataSourceById(id);
 | 
			
		||||
 | 
			
		||||
                    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) =>
 | 
			
		||||
                    ['between', 'not_between'].includes(model.op) && !['is', 'not'].includes(model.op),
 | 
			
		||||
                  display: (vm, { model }) => ['between', 'not_between'].includes(model.op),
 | 
			
		||||
                },
 | 
			
		||||
              ],
 | 
			
		||||
            },
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user