Merge branch 'perf/things-model-form' into 'main_dev'

perf: 优化物模型表单暴露方法

See merge request yunteng/thingskit-front!1176

@@ -128,6 +128,7 @@ export const getFormSchemas = ({
       label: functionName!,
       component: 'Input',
       changeEvent: 'update:value',
+      rules: [{ required: required, validator: () => Promise.resolve() }],
       componentProps: () => {
         return {
           inputData: dataType?.specs || [],

 <script setup lang="ts">
+  import {
+    ComponentPublicInstance,
+    computed,
+    nextTick,
+    reactive,
+    ref,
+    toRaw,
+    unref,
+    watch,
+  } from 'vue';
   import { Card } from 'ant-design-vue';
-  import { ComponentPublicInstance, computed, nextTick, reactive, unref, watch } from 'vue';
   import { getFormSchemas } from './config';
   import { ThingsModelForm } from '.';
-  import { DefineComponentsBasicExpose } from '/#/utils';
   import { StructJSON } from '/@/api/device/model/modelOfMatterModel';
   import { useForm } from '../../hooks/useForm';
   import { DataTypeEnum } from '/@/enums/objectModelEnum';
-  import { BasicForm } from '/@/components/Form';
-
-  const props = withDefaults(
-    defineProps<{
-      value?: Recordable;
-      inputData?: StructJSON[];
-      required?: boolean;
-      title?: string;
-      transportType?: string;
-      disabled?: boolean;
-      identifier?: string;
-    }>(),
-    {
-      inputData: () => [],
-      required: true,
-    }
-  );
+  import { BasicForm, FormProps } from '/@/components/Form';
+  import { deepMerge } from '/@/utils';
+
+  interface ThingsModelFormPropsType {
+    value?: Recordable;
+    inputData?: StructJSON[];
+    required?: boolean;
+    title?: string;
+    transportType?: string;
+    disabled?: boolean;
+    identifier?: string;
+    formProps?: FormProps;
+  }
+
+  const props = withDefaults(defineProps<ThingsModelFormPropsType>(), {
+    inputData: () => [],
+    required: true,
+    formProps: () => ({}),
+  });
 
   const thingsModelFormListElMap = reactive<
     Record<string, { el: InstanceType<typeof ThingsModelForm>; structJSON: StructJSON }>
   >({});
 
+  const propsRef = ref<Partial<ThingsModelFormPropsType>>({});
+
+  const getProps = computed<ThingsModelFormPropsType>(
+    () => ({ ...props, ...unref(propsRef) } as ThingsModelFormPropsType)
+  );
+
   const [register, formActionType] = useForm({
-    schemas: getFormSchemas({
-      structJSON: props.inputData || [],
-      required: props.required,
-      transportType: props.transportType,
-    }),
-    showActionButtonGroup: false,
     layout: 'inline',
     labelWidth: 100,
+    ...toRaw(unref(getProps)),
+    schemas: getFormSchemasByProps(),
+    showActionButtonGroup: false,
   });
 
   const getStructFormItem = computed(() => {
-    const { inputData } = props;
-    return inputData.filter((item) => item.dataType?.type === DataTypeEnum.STRUCT);
+    const { inputData } = unref(getProps);
+    return (inputData || []).filter((item) => item.dataType?.type === DataTypeEnum.STRUCT);
   });
 
   const setFormElRef = (
@@ -87,7 +100,7 @@
   };
 
   watch(
-    () => props.value,
+    () => unref(getProps).value,
     async (value) => {
       await nextTick();
       formActionType.resetFields();
@@ -97,30 +110,36 @@
   );
 
   watch(
-    () => [props.inputData, props.identifier],
+    () => [unref(getProps).inputData, unref(getProps).identifier],
     (value) => {
-      if (value && value.length) {
-        const schemas = getFormSchemas({
-          structJSON: props.inputData || [],
-          required: props.required,
-          transportType: props.transportType,
-        });
-        formActionType.setProps({ schemas });
-      }
+      if (value && value.length) formActionType.setProps({ schemas: getFormSchemasByProps() });
     }
   );
 
   watch(
-    () => props.disabled,
+    () => unref(getProps).disabled,
     (value) => {
       formActionType.setProps({ disabled: value });
     }
   );
 
-  defineExpose<DefineComponentsBasicExpose>({
+  function getFormSchemasByProps() {
+    return getFormSchemas({
+      structJSON: unref(getProps).inputData || [],
+      required: unref(getProps).required,
+      transportType: unref(getProps).transportType,
+    });
+  }
+
+  function setProps(props: Partial<ThingsModelFormPropsType>) {
+    propsRef.value = deepMerge(unref(propsRef) || {}, props);
+  }
+
+  defineExpose({
     getFieldsValue,
     setFieldsValue,
     validate,
+    setProps,
   });
 </script>
 
@@ -155,6 +174,10 @@
       width: 100%;
     }
 
+    :deep(.ant-col.ant-form-item-control) {
+      min-height: auto;
+    }
+
     :deep(.ant-input-number) {
       width: 100%;
     }