优化FormBuilder和Table
parent
24a9b10d79
commit
4b7bb143ab
|
|
@ -47,6 +47,7 @@ const FormBuilder = (props) => {
|
|||
labelCol={labelCol}
|
||||
span={span}
|
||||
useAutoGenerateRequired={useAutoGenerateRequired}
|
||||
initialValues={values}
|
||||
/>
|
||||
</Row>
|
||||
{showActionButtons && (
|
||||
|
|
|
|||
|
|
@ -91,6 +91,8 @@ export interface FormItemsRendererProps {
|
|||
collapse?: boolean;
|
||||
/** 自动生成必填规则,默认 true */
|
||||
useAutoGenerateRequired?: boolean;
|
||||
/** 初始值,用于在表单未初始化时提供默认值 */
|
||||
initialValues?: FormValues;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -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 (
|
||||
|
|
|
|||
|
|
@ -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" }}>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
.@{ant-prefix}-table-cell-scrollbar {
|
||||
width: 15px;
|
||||
}
|
||||
Loading…
Reference in New Issue