diff --git a/src/components/Form/src/helper.ts b/src/components/Form/src/helper.ts index cf580e5b..63370474 100644 --- a/src/components/Form/src/helper.ts +++ b/src/components/Form/src/helper.ts @@ -32,7 +32,7 @@ export function createPlaceholderMessage(component: ComponentType) { const DATE_TYPE = ['DatePicker', 'MonthPicker', 'WeekPicker', 'TimePicker']; function genType() { - return [...DATE_TYPE, 'RangePicker']; + return [...DATE_TYPE, 'RangePicker',"TimeRangePicker"]; } export function setComponentRuleType( diff --git a/src/components/Form/src/hooks/useFormEvents.ts b/src/components/Form/src/hooks/useFormEvents.ts index ba5c5193..8afb70c9 100644 --- a/src/components/Form/src/hooks/useFormEvents.ts +++ b/src/components/Form/src/hooks/useFormEvents.ts @@ -6,7 +6,7 @@ import { isArray, isFunction, isObject, isString, isNil } from '@/utils/is'; import { deepMerge } from '@/utils'; import { dateItemType, defaultValueComponents, isIncludeSimpleComponents } from '../helper'; import { dateUtil } from '@/utils/dateUtil'; -import { cloneDeep, has, uniqBy, get } from 'lodash-es'; +import { cloneDeep, has, uniqBy, get, set } from 'lodash-es'; import { error } from '@/utils/log'; interface UseFormActionContext { @@ -20,6 +20,23 @@ interface UseFormActionContext { handleFormValues: Fn; } +function tryConstructArray(field: string, values: Recordable = {}): any[] | undefined { + const pattern = /^\[(.+)\]$/; + if (pattern.test(field)) { + const match = field.match(pattern); + if (match && match[1]) { + const keys = match[1].split(','); + if (!keys.length) { + return undefined; + } + const result = []; + keys.forEach((k, index) => { + set(result, index, values[k.trim()]); + }); + return result.filter(Boolean).length ? result : undefined; + } + } +} export function useFormEvents({ emit, getProps, @@ -83,28 +100,36 @@ export function useFormEvents({ }); } - const constructValue = get(value, key); + let constructValue const setDateFieldValue = (v) => { return v ? (_props?.valueFormat ? v : dateUtil(v)) : null; }; - // 0| '' is allow - if (hasKey || !!constructValue) { - const fieldValue = constructValue || value; - // time type - if (itemIsDateType(key)) { + + // Adapt date component + if(itemIsDateComponent(schema?.component)){ + constructValue = tryConstructArray(key, values) ; + if(!!constructValue){ + const fieldValue = constructValue || value; if (Array.isArray(fieldValue)) { const arr: any[] = []; for (const ele of fieldValue) { arr.push(setDateFieldValue(ele)); } unref(formModel)[key] = arr; + validKeys.push(key); } else { unref(formModel)[key] = setDateFieldValue(fieldValue); + validKeys.push(key); } - } else { - unref(formModel)[key] = fieldValue; } + } + + // Adapt common component + if (hasKey) { + constructValue = get(value, key); + const fieldValue = constructValue || value; + unref(formModel)[key] = fieldValue; if (_props?.onChange) { _props?.onChange(fieldValue); } @@ -295,10 +320,8 @@ export function useFormEvents({ /** * @description: Is it time */ - function itemIsDateType(key: string) { - return unref(getSchema).some((item) => { - return item.field === key && item.component ? dateItemType.includes(item.component) : false; - }); + function itemIsDateComponent(key: string) { + return dateItemType.includes(key); } async function validateFields(nameList?: NamePath[] | undefined) {