优化FormBuilder和Table

master
LiuJiaNan 2025-10-29 09:38:36 +08:00
parent 24a9b10d79
commit 4b7bb143ab
6 changed files with 31 additions and 7 deletions

View File

@ -47,6 +47,7 @@ const FormBuilder = (props) => {
labelCol={labelCol}
span={span}
useAutoGenerateRequired={useAutoGenerateRequired}
initialValues={values}
/>
</Row>
{showActionButtons && (

View File

@ -91,6 +91,8 @@ export interface FormItemsRendererProps {
collapse?: boolean;
/** 自动生成必填规则,默认 true */
useAutoGenerateRequired?: boolean;
/** 初始值,用于在表单未初始化时提供默认值 */
initialValues?: FormValues;
}
/**

View File

@ -26,20 +26,31 @@ const FormItemsRenderer = ({
span = 12,
collapse = false,
useAutoGenerateRequired = true,
initialValues,
}) => {
const form = Form.useFormInstance();
// 获取表单值,优先使用 initialValues
const getFormValues = () => {
const formValues = form.getFieldsValue();
// 如果表单值为空但有 initialValues则使用 initialValues
if (Object.keys(formValues).length === 0 && initialValues) {
return initialValues;
}
return formValues;
};
// 获取传给组件的属性
const getComponentProps = (option) => {
return typeof option.componentProps === "function"
? option.componentProps(form.getFieldsValue())
? option.componentProps(getFormValues())
: (option.componentProps || {});
};
// 获取传给formItem的属性
const getFormItemProps = (option) => {
const formItemProps = typeof option.formItemProps === "function"
? option.formItemProps(form.getFieldsValue())
? option.formItemProps(getFormValues())
: (option.formItemProps || {});
// 为日期组件添加特殊处理
@ -90,7 +101,7 @@ const FormItemsRenderer = ({
// 支持动态计算 required
const required = typeof option.required === "function"
? option.required(form.getFieldsValue())
? option.required(getFormValues())
: (option.required ?? true);
if (required) {
@ -290,10 +301,10 @@ const FormItemsRenderer = ({
shouldUpdate={option.shouldUpdate ?? option?.componentProps?.shouldUpdate}
dependencies={option.dependencies || option?.componentProps?.dependencies}
>
{(form) => {
{() => {
// 支持动态计算 hidden
const hidden = typeof option.hidden === "function"
? option.hidden(form.getFieldsValue())
? option.hidden(getFormValues())
: (option.hidden ?? false);
if (hidden)
@ -319,7 +330,12 @@ const FormItemsRenderer = ({
}
// 普通表单项(静态配置)
if (option.hidden)
// 支持动态计算 hidden
const hidden = typeof option.hidden === "function"
? option.hidden(getFormValues())
: (option.hidden ?? false);
if (hidden)
return null;
return (

View File

@ -84,6 +84,7 @@ const Search = (props) => {
span={6}
collapse={collapse}
useAutoGenerateRequired={false}
initialValues={values}
/>
<Col span={showCollapseButton ? (collapse ? 6 : span) : span}>
<Form.Item label=" " colon={false} style={{ textAlign: "right" }}>

View File

@ -1,12 +1,13 @@
import Table from "@cqsjjb/jjb-react-admin-component/Table";
import { getIndexColumn } from "../../utils/index";
import "./index.less";
function TablePro(props) {
const {
columns = [],
showIndex = true,
useAlignCenter = true,
rowKey = 'id',
rowKey = "id",
...restProps
} = props;

View File

@ -0,0 +1,3 @@
.@{ant-prefix}-table-cell-scrollbar {
width: 15px;
}