diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md index 1dbb6ce36dd97f306cd12bb118917af4a99e764f..2f588cadad786db95ddf551c37981a4637a5af30 100644 --- a/CHANGELOG.zh_CN.md +++ b/CHANGELOG.zh_CN.md @@ -23,6 +23,7 @@ - 修复 tree 文本超出挡住操作按钮问题 - 修复通过 useRedo 刷新页面参数丢失问题 +- 修复表单校验先设置在校验及控制台错误信息问题 ### 🎫 Chores diff --git a/src/components/Form/src/BasicForm.vue b/src/components/Form/src/BasicForm.vue index 7b71ef9c18f1cef2fb673a43c3319ed4f4155f3f..5987f9df09fd33cb5f218abd254650896950bff5 100644 --- a/src/components/Form/src/BasicForm.vue +++ b/src/components/Form/src/BasicForm.vue @@ -71,17 +71,17 @@ const schemaRef = ref>(null); const formElRef = ref>(null); - const getRowWrapStyleRef = computed((): any => { - const { baseRowStyle } = unref(getProps); - return baseRowStyle || {}; - }); - const getMergePropsRef = computed( (): FormProps => { return deepMerge(cloneDeep(props), unref(propsRef)); } ); + const getRowWrapStyleRef = computed((): any => { + const { baseRowStyle } = unref(getMergePropsRef); + return baseRowStyle || {}; + }); + // 获取表单基本配置 const getProps = computed( (): FormProps => { @@ -103,7 +103,7 @@ const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any); for (const schema of schemas) { const { defaultValue, component } = schema; - if (defaultValue && dateItemType.includes(component!)) { + if (defaultValue && dateItemType.includes(component)) { if (!Array.isArray(defaultValue)) { schema.defaultValue = moment(defaultValue); } else { diff --git a/src/components/Form/src/FormItem.tsx b/src/components/Form/src/FormItem.tsx index fa0160e04d1efc5b91ee77128a3d8bef5d85dc3e..a5a43ee30ac7960dcf602057114186eaeb89856d 100644 --- a/src/components/Form/src/FormItem.tsx +++ b/src/components/Form/src/FormItem.tsx @@ -17,6 +17,7 @@ import { upperFirst, cloneDeep } from 'lodash-es'; import { useItemLabelWidth } from './hooks/useLabelWidth'; import { ComponentType } from './types'; import { isNumber } from '/@/utils/is'; +import { useI18n } from '/@/hooks/web/useI18n'; export default defineComponent({ name: 'BasicFormItem', @@ -46,6 +47,8 @@ export default defineComponent({ }, }, setup(props, { slots }) { + const { t } = useI18n('component.form'); + // @ts-ignore const itemLabelWidthRef = useItemLabelWidth(toRef(props, 'schema'), toRef(props, 'formProps')); const getValuesRef = computed(() => { @@ -132,7 +135,7 @@ export default defineComponent({ let rules: ValidationRule[] = cloneDeep(defRules) as ValidationRule[]; if ((!rules || rules.length === 0) && required) { - rules = [{ required }]; + rules = [{ required, type: 'string' }]; } const requiredRuleIndex: number = rules.findIndex( @@ -142,6 +145,9 @@ export default defineComponent({ if (requiredRuleIndex !== -1) { const rule = rules[requiredRuleIndex]; if (rule.required && component) { + if (!Reflect.has(rule, 'type')) { + rule.type = 'string'; + } const joinLabel = Reflect.has(props.schema, 'rulesMessageJoinLabel') ? rulesMessageJoinLabel : globalRulesMessageJoinLabel; @@ -157,11 +163,9 @@ export default defineComponent({ component.includes('TimePicker') ) { rule.type = 'object'; - } - if (component.includes('RangePicker') || component.includes('Upload')) { + } else if (component.includes('RangePicker') || component.includes('Upload')) { rule.type = 'array'; - } - if (component.includes('InputNumber')) { + } else if (component.includes('InputNumber')) { rule.type = 'number'; } } @@ -171,7 +175,7 @@ export default defineComponent({ const characterInx = rules.findIndex((val) => val.max); if (characterInx !== -1 && !rules[characterInx].validator) { rules[characterInx].message = - rules[characterInx].message || `字符数应小于${rules[characterInx].max}位`; + rules[characterInx].message || t('maxTip', [rules[characterInx].max]); } return rules; } @@ -237,6 +241,7 @@ export default defineComponent({ const bindValue = { [valueField || (isCheck ? 'checked' : 'value')]: handleValue(component, field), }; + if (!renderComponentContent) { return ; } diff --git a/src/components/Form/src/hooks/useFormAction.ts b/src/components/Form/src/hooks/useFormAction.ts index ae5e03908353257732b262738d0928573790ce92..1a156c46059b20df577c2f600b38649d68c25aa3 100644 --- a/src/components/Form/src/hooks/useFormAction.ts +++ b/src/components/Form/src/hooks/useFormAction.ts @@ -79,9 +79,7 @@ export function useFormAction({ validKeys.push(key); } }); - // if (formEl) { - // formEl.validateFields(validKeys); - // } + validateFields(validKeys); } /** * @description: Delete based on field name diff --git a/src/components/Form/src/hooks/useFormValues.ts b/src/components/Form/src/hooks/useFormValues.ts index 7721f7a9a2366f44dcfc0adcb8743f262e49a015..428f83d9c855e3e4e8ffb47bb4e5804ce005324c 100644 --- a/src/components/Form/src/hooks/useFormValues.ts +++ b/src/components/Form/src/hooks/useFormValues.ts @@ -19,11 +19,11 @@ export function useFormValues({ formModel, }: UseFormValuesContext) { // Processing form values - function handleFormValues(values: any) { + function handleFormValues(values: Record) { if (!isObject(values)) { return {}; } - const resMap: any = {}; + const resMap: Record = {}; for (const item of Object.entries(values)) { let [, value] = item; const [key] = item; @@ -49,7 +49,7 @@ export function useFormValues({ /** * @description: Processing time interval parameters */ - function handleRangeTimeValue(values: any) { + function handleRangeTimeValue(values: Record) { const fieldMapToTime = unref(fieldMapToTimeRef); if (!fieldMapToTime || !Array.isArray(fieldMapToTime)) { @@ -72,7 +72,7 @@ export function useFormValues({ function initDefault() { const schemas = unref(getSchema); - const obj: any = {}; + const obj: Record = {}; schemas.forEach((item) => { if (item.defaultValue) { obj[item.field] = item.defaultValue; diff --git a/src/locales/lang/en/component/form.ts b/src/locales/lang/en/component/form.ts index b66bf32b7acf10c283b3e54b32f628e556cca4cd..ffc8da60ad5e7033428aabea49bbd305f99dcdce 100644 --- a/src/locales/lang/en/component/form.ts +++ b/src/locales/lang/en/component/form.ts @@ -6,4 +6,6 @@ export default { input: 'Please Input', choose: 'Please Choose', + + maxTip: 'The number of characters should be less than {0}', }; diff --git a/src/locales/lang/zh_CN/component/form.ts b/src/locales/lang/zh_CN/component/form.ts index 3a6185ccf17d954f025ec046733fd9fb0791fbf2..ac8e59b2cc94193211c1191602f77ded18b32d0a 100644 --- a/src/locales/lang/zh_CN/component/form.ts +++ b/src/locales/lang/zh_CN/component/form.ts @@ -6,4 +6,6 @@ export default { input: '请输入', choose: '请选择', + + maxTip: '字符数应小于{0}位', };