create.vue
1.49 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<script lang="ts" setup>
  import type { CreateModalDefineExposeType } from '../../../types';
  import { BasicForm, useForm } from '/@/components/Form';
  import { NodeConfigValue, FormFieldsValue, formSchemas } from './create.config';
  import { NodeData } from '../../../types/node';
  defineProps<{
    config: NodeData;
  }>();
  const [register, { validate, getFieldsValue, setFieldsValue, resetFields }] = useForm({
    schemas: formSchemas,
    showActionButtonGroup: false,
  });
  const getValue: CreateModalDefineExposeType['getFieldsValue'] = async () => {
    await validate();
    const value = (getFieldsValue() || {}) as FormFieldsValue;
    const { alarmDetailsBuildJs, ...restParams } = value;
    const { scriptLang, jsScript, tbelScript } = alarmDetailsBuildJs || {};
    return {
      ...restParams,
      scriptLang,
      alarmDetailsBuildJs: jsScript,
      alarmDetailsBuildTbel: tbelScript,
    };
  };
  const setValue: CreateModalDefineExposeType['setFieldsValue'] = (value: NodeConfigValue) => {
    resetFields();
    const { alarmDetailsBuildJs, alarmDetailsBuildTbel, scriptLang } = value || {};
    setFieldsValue({
      ...value,
      alarmDetailsBuildJs: {
        jsScript: alarmDetailsBuildJs,
        tbelScript: alarmDetailsBuildTbel,
        scriptLang,
      },
    } as FormFieldsValue);
  };
  defineExpose({
    setFieldsValue: setValue,
    getFieldsValue: getValue,
  } as CreateModalDefineExposeType);
</script>
<template>
  <BasicForm @register="register" />
</template>