This commit is contained in:
xingyu4j
2025-09-24 14:30:35 +08:00
4 changed files with 29 additions and 70 deletions

View File

@@ -473,6 +473,8 @@ export interface FormSchema<
fieldName: string; fieldName: string;
/** 帮助信息 */ /** 帮助信息 */
help?: CustomRenderType; help?: CustomRenderType;
/** 是否隐藏表单项 */
hide?: boolean;
/** 表单的标签如果是一个string会用于默认必选规则的消息提示 */ /** 表单的标签如果是一个string会用于默认必选规则的消息提示 */
label?: CustomRenderType; label?: CustomRenderType;
/** 自定义组件内部渲染 */ /** 自定义组件内部渲染 */

View File

@@ -360,7 +360,6 @@ export class FormApi {
return true; return true;
}); });
const filteredFields = fieldMergeFn(fields, form.values); const filteredFields = fieldMergeFn(fields, form.values);
this.handleStringToArrayFields(filteredFields);
form.setValues(filteredFields, shouldValidate); form.setValues(filteredFields, shouldValidate);
} }
@@ -370,7 +369,6 @@ export class FormApi {
const form = await this.getForm(); const form = await this.getForm();
await form.submitForm(); await form.submitForm();
const rawValues = toRaw(await this.getValues()); const rawValues = toRaw(await this.getValues());
this.handleArrayToStringFields(rawValues);
await this.state?.handleSubmit?.(rawValues); await this.state?.handleSubmit?.(rawValues);
return rawValues; return rawValues;
@@ -470,16 +468,31 @@ export class FormApi {
return this.form; return this.form;
} }
private handleArrayToStringFields = (originValues: Record<string, any>) => { private handleMultiFields = (originValues: Record<string, any>) => {
const arrayToStringFields = this.state?.arrayToStringFields; const arrayToStringFields = this.state?.arrayToStringFields;
if (!arrayToStringFields || !Array.isArray(arrayToStringFields)) { if (!arrayToStringFields || !Array.isArray(arrayToStringFields)) {
return; return;
} }
const processFields = (fields: string[], separator: string = ',') => { const processFields = (fields: string[], separator: string = ',') => {
this.processFields(fields, separator, originValues, (value, sep) => this.processFields(fields, separator, originValues, (value, sep) => {
Array.isArray(value) ? value.join(sep) : value, if (Array.isArray(value)) {
); return value.join(sep);
} else if (typeof value === 'string') {
// 处理空字符串的情况
if (value === '') {
return [];
}
// 处理复杂分隔符的情况
const escapedSeparator = sep.replaceAll(
/[.*+?^${}()|[\]\\]/g,
String.raw`\$&`,
);
return value.split(new RegExp(escapedSeparator));
} else {
return value;
}
});
}; };
// 处理简单数组格式 ['field1', 'field2', ';'] 或 ['field1', 'field2'] // 处理简单数组格式 ['field1', 'field2', ';'] 或 ['field1', 'field2']
@@ -515,8 +528,7 @@ export class FormApi {
const values = { ...originValues }; const values = { ...originValues };
const fieldMappingTime = this.state?.fieldMappingTime; const fieldMappingTime = this.state?.fieldMappingTime;
this.handleStringToArrayFields(values); this.handleMultiFields(values);
if (!fieldMappingTime || !Array.isArray(fieldMappingTime)) { if (!fieldMappingTime || !Array.isArray(fieldMappingTime)) {
return values; return values;
} }
@@ -562,65 +574,6 @@ export class FormApi {
return values; return values;
}; };
private handleStringToArrayFields = (originValues: Record<string, any>) => {
const arrayToStringFields = this.state?.arrayToStringFields;
if (!arrayToStringFields || !Array.isArray(arrayToStringFields)) {
return;
}
const processFields = (fields: string[], separator: string = ',') => {
this.processFields(fields, separator, originValues, (value, sep) => {
if (typeof value !== 'string') {
return value;
}
// 处理空字符串的情况
if (value === '') {
return [];
}
// 处理复杂分隔符的情况
const escapedSeparator = sep.replaceAll(
/[.*+?^${}()|[\]\\]/g,
String.raw`\$&`,
);
return value.split(new RegExp(escapedSeparator));
});
};
// 处理简单数组格式 ['field1', 'field2', ';'] 或 ['field1', 'field2']
if (arrayToStringFields.every((item) => typeof item === 'string')) {
const lastItem =
arrayToStringFields[arrayToStringFields.length - 1] || '';
const fields =
lastItem.length === 1
? arrayToStringFields.slice(0, -1)
: arrayToStringFields;
const separator = lastItem.length === 1 ? lastItem : ',';
processFields(fields, separator);
return;
}
// 处理嵌套数组格式 [['field1'], ';']
arrayToStringFields.forEach((fieldConfig) => {
if (Array.isArray(fieldConfig)) {
const [fields, separator = ','] = fieldConfig;
if (Array.isArray(fields)) {
processFields(fields, separator);
} else if (typeof originValues[fields] === 'string') {
const value = originValues[fields];
if (value === '') {
originValues[fields] = [];
} else {
const escapedSeparator = separator.replaceAll(
/[.*+?^${}()|[\]\\]/g,
String.raw`\$&`,
);
originValues[fields] = value.split(new RegExp(escapedSeparator));
}
}
}
});
};
private processFields = ( private processFields = (
fields: string[], fields: string[],
separator: string, separator: string,

View File

@@ -41,6 +41,7 @@ const {
emptyStateValue, emptyStateValue,
fieldName, fieldName,
formFieldProps, formFieldProps,
hide,
label, label,
labelClass, labelClass,
labelWidth, labelWidth,
@@ -95,7 +96,7 @@ const currentRules = computed(() => {
}); });
const visible = computed(() => { const visible = computed(() => {
return isIf.value && isShow.value; return !hide && isIf.value && isShow.value;
}); });
const shouldRequired = computed(() => { const shouldRequired = computed(() => {
@@ -285,7 +286,7 @@ onUnmounted(() => {
<template> <template>
<FormField <FormField
v-if="isIf" v-if="!hide && isIf"
v-bind="fieldProps" v-bind="fieldProps"
v-slot="slotProps" v-slot="slotProps"
:name="fieldName" :name="fieldName"

View File

@@ -257,6 +257,8 @@ export interface FormSchema<
fieldName: string; fieldName: string;
/** 帮助信息 */ /** 帮助信息 */
help?: CustomRenderType; help?: CustomRenderType;
/** 是否隐藏表单项 */
hide?: boolean;
/** 表单项 */ /** 表单项 */
label?: CustomRenderType; label?: CustomRenderType;
// 自定义组件内部渲染 // 自定义组件内部渲染
@@ -279,7 +281,8 @@ export interface FormRenderProps<
*/ */
arrayToStringFields?: ArrayToStringFields; arrayToStringFields?: ArrayToStringFields;
/** /**
* 是否展开在showCollapseButton=true下生效 * 是否折叠在showCollapseButton=true下生效
* true:折叠 false:展开
*/ */
collapsed?: boolean; collapsed?: boolean;
/** /**