feat(form): add valueFormat for schema (#3873)

vbenjs · May 31, 2024 · 0bc01d8 · 0bc01d8
1 parent 5d36b1a
commit 0bc01d8
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 2 deletions.
diff --git a/src/components/Form/src/BasicForm.vue b/src/components/Form/src/BasicForm.vue
@@ -64,6 +64,7 @@
   import { useDesign } from '@/hooks/web/useDesign';
   import { cloneDeep } from 'lodash-es';
   import { TableActionType } from '@/components/Table';
+  import { isFunction } from '@/utils/is';
 
   defineOptions({ name: 'BasicForm' });
 
@@ -130,6 +131,9 @@
         component,
         componentProps = {},
         isHandleDateDefaultValue = true,
+        field,
+        isHandleDefaultValue = true,
+        valueFormat,
       } = schema;
       // handle date type
       if (
@@ -161,6 +165,21 @@
           schema.defaultValue = def;
         }
       }
+
+      // handle schema.valueFormat
+      if (
+        isHandleDefaultValue &&
+        defaultValue &&
+        component &&
+        isFunction(valueFormat)
+      ) {
+        schema.defaultValue = valueFormat({
+          value: defaultValue,
+          schema,
+          model: formModel,
+          field,
+        });
+      }
     }
     if (unref(getProps).showAdvancedButton) {
       return schemas.filter(

diff --git a/src/components/Form/src/components/FormItem.vue b/src/components/Form/src/components/FormItem.vue
@@ -277,6 +277,7 @@
           field,
           changeEvent = 'change',
           valueField,
+          valueFormat,
         } = props.schema;
 
         const isCheck = component && ['Switch', 'Checkbox'].includes(component);
@@ -286,9 +287,12 @@
         const on = {
           [eventKey]: (...args: Nullable<Recordable<any>>[]) => {
             const [e] = args;
-
+            
             const target = e ? e.target : null;
-            const value = target ? (isCheck ? target.checked : target.value) : e;
+            let value = target ? (isCheck ? target.checked : target.value) : e;
+            if(isFunction(valueFormat)){
+              value = valueFormat({...unref(getValues),value});
+            }
             props.setFormModel(field, value, props.schema);
 
             if (propsData[eventKey]) {

diff --git a/src/components/Form/src/types/form.ts b/src/components/Form/src/types/form.ts
@@ -197,6 +197,9 @@ interface BaseFormSchema<T extends ComponentType = any> {
   // 是否自动处理与时间相关组件的默认值
   isHandleDateDefaultValue?: boolean;
 
+  // 是否使用valueFormat自动处理默认值
+  isHandleDefaultValue?: boolean;
+
   isAdvanced?: boolean;
 
   // Matching details components
@@ -232,6 +235,8 @@ interface BaseFormSchema<T extends ComponentType = any> {
   dynamicReadonly?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
 
   dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[];
+
+  valueFormat?: (arg: Partial<RenderCallbackParams> & { value: any }) => any;
 }
 export interface ComponentFormSchema<T extends ComponentType = any> extends BaseFormSchema<T> {
   // render component