feat(@vben/web-antd): vxe-table)新增表单验证功能

- 在 vxe-table.ts 中添加 createRequiredValidation函数
- 在 data.ts 中使用 createRequiredValidation 替代原有的 className 函数
- 在 vxe-table 插件中添加 validation 相关的工具函数
- 优化表格列的验证逻辑,提高代码复用性和可维护性
This commit is contained in:
nehc
2025-08-02 23:28:59 +08:00
parent 5f56b14733
commit c64be886b4
4 changed files with 69 additions and 17 deletions

View File

@@ -1,8 +1,9 @@
export { AsyncComponents, setupVbenVxeTable } from './init';
export type { VxeTableGridOptions } from './types';
export * from './use-vxe-grid';
export { default as VbenVxeGrid } from './use-vxe-grid.vue';
export * from './validation';
export type {
VxeGridListeners,
VxeGridProps,

View File

@@ -0,0 +1,61 @@
/**
* 创建验证类名的工具函数
* @param isValidating 验证状态
* @param fieldName 字段名
* @param validationRules 验证规则,可以是字符串或自定义函数
* @returns 返回 className 函数
*/
function createValidationClassName(
isValidating: any,
fieldName: string,
validationRules: ((row: any) => boolean) | string,
) {
return ({ row }: { row: any }) => {
if (!isValidating?.value) return '';
let isValid = true;
if (typeof validationRules === 'string') {
// 处理简单的验证规则
if (validationRules === 'required') {
isValid =
fieldName === 'count'
? row[fieldName] && row[fieldName] > 0
: !!row[fieldName];
}
} else if (typeof validationRules === 'function') {
// 处理自定义验证函数
isValid = validationRules(row);
}
return isValid ? '' : 'required-field-error';
};
}
/**
* 创建必填字段验证
* @param isValidating 验证状态
* @param fieldName 字段名
* @returns 返回 className 函数
*/
function createRequiredValidation(isValidating: any, fieldName: string) {
return createValidationClassName(isValidating, fieldName, 'required');
}
/**
* 创建自定义验证
* @param isValidating 验证状态
* @param validationFn 自定义验证函数
* @returns 返回 className 函数
*/
function createCustomValidation(
isValidating: any,
validationFn: (row: any) => boolean,
) {
return createValidationClassName(isValidating, '', validationFn);
}
export {
createCustomValidation,
createRequiredValidation,
createValidationClassName,
};