@zat-design/sisyphus-react 4.4.2 → 4.4.3-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.css +1 -1
- package/dist/less.esm.css +1 -1
- package/es/FormsProvider/index.d.ts +1 -1
- package/es/ProEditTable/components/RenderField/index.js +8 -8
- package/es/ProEditTable/utils/config.js +5 -2
- package/es/ProEditTable/utils/index.js +11 -6
- package/es/ProEditTable/utils/tools.js +3 -2
- package/es/ProEnum/index.js +1 -1
- package/es/ProForm/components/FormFooter/propsType.d.ts +1 -1
- package/es/ProForm/components/base/DatePicker/index.js +3 -2
- package/es/ProForm/components/combination/Group/component/ComRender.js +1 -1
- package/es/ProForm/components/combination/Group/component/FlexibleGroup.js +4 -11
- package/es/ProForm/components/combination/Group/hooks/index.js +1 -2
- package/es/ProForm/components/combination/Group/utils/index.d.ts +20 -20
- package/es/ProForm/components/render/Render.js +149 -180
- package/es/ProForm/components/render/RenderFields.js +13 -38
- package/es/ProForm/components/render/propsType.d.ts +1 -18
- package/es/ProForm/components/render/propsType.js +0 -26
- package/es/ProForm/hooks/useControlled.d.ts +1 -0
- package/es/ProForm/hooks/useControlled.js +14 -0
- package/es/ProForm/hooks/useForm.d.ts +8 -0
- package/es/ProForm/{utils → hooks}/useForm.js +1 -1
- package/es/ProForm/{utils → hooks}/useRules.js +2 -2
- package/es/ProForm/{utils → hooks}/useShouldUpdate.d.ts +5 -1
- package/es/ProForm/{utils → hooks}/useShouldUpdate.js +30 -77
- package/es/ProForm/{utils → hooks}/useWatch.js +1 -1
- package/es/ProForm/index.js +5 -4
- package/es/ProForm/propsType.d.ts +13 -1
- package/es/ProForm/utils/buildFormItemProps.d.ts +25 -0
- package/es/ProForm/utils/buildFormItemProps.js +90 -0
- package/es/ProForm/utils/index.d.ts +2 -6
- package/es/ProForm/utils/index.js +3 -30
- package/es/ProForm/utils/reactiveValues.d.ts +34 -0
- package/es/ProForm/utils/reactiveValues.js +45 -0
- package/es/ProSelect/index.js +8 -7
- package/es/ProTreeModal/components/Trigger.js +13 -12
- package/es/ProTreeModal/style/index.less +12 -1
- package/package.json +1 -1
- package/es/ProForm/utils/useForm.d.ts +0 -22
- /package/es/ProForm/{utils → hooks}/useDeepCompareMemo.d.ts +0 -0
- /package/es/ProForm/{utils → hooks}/useDeepCompareMemo.js +0 -0
- /package/es/ProForm/{utils → hooks}/useFieldProps.d.ts +0 -0
- /package/es/ProForm/{utils → hooks}/useFieldProps.js +0 -0
- /package/es/ProForm/{utils → hooks}/useRules.d.ts +0 -0
- /package/es/ProForm/{utils → hooks}/useWatch.d.ts +0 -0
|
@@ -7,7 +7,7 @@ import Render from "./Render";
|
|
|
7
7
|
import { getDefaultProps } from "../../utils/getDefaultProps";
|
|
8
8
|
import * as componentMap from "../index";
|
|
9
9
|
import { isSelect } from "../../utils";
|
|
10
|
-
import { FieldProvider } from "../../
|
|
10
|
+
import { FieldProvider } from "../../hooks/useFieldProps";
|
|
11
11
|
import locale from "../../../locale";
|
|
12
12
|
import processDependencies from "../../utils/processDependencies";
|
|
13
13
|
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
@@ -31,25 +31,13 @@ const RenderFields = props => {
|
|
|
31
31
|
shouldUpdateDebounce
|
|
32
32
|
} = props;
|
|
33
33
|
|
|
34
|
-
//
|
|
35
|
-
const
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
let hiddenArray = [];
|
|
42
|
-
hiddenData.forEach(item => {
|
|
43
|
-
hiddenArray = hiddenArray.concat(item.hiddenNames);
|
|
44
|
-
});
|
|
45
|
-
hiddenArray.forEach(item => {
|
|
46
|
-
columns.push({
|
|
47
|
-
name: Array.isArray(item) ? item : `${item}`,
|
|
48
|
-
hidden: true
|
|
49
|
-
});
|
|
50
|
-
});
|
|
51
|
-
}
|
|
52
|
-
const comList = columns.flatMap((column, index) => {
|
|
34
|
+
// 根据 hiddenNames 生成隐藏字段供表单收集(不可变:不修改入参 columns,避免稳定引用下跨渲染累积)
|
|
35
|
+
const hiddenColumns = columns.filter(item => Array.isArray(item.hiddenNames)).flatMap(item => item.hiddenNames).map(nameItem => ({
|
|
36
|
+
name: Array.isArray(nameItem) ? nameItem : `${nameItem}`,
|
|
37
|
+
hidden: true
|
|
38
|
+
}));
|
|
39
|
+
const renderColumns = hiddenColumns.length ? [...columns, ...hiddenColumns] : columns;
|
|
40
|
+
const comList = renderColumns.flatMap((column, index) => {
|
|
53
41
|
if (!!expand && !openState) {
|
|
54
42
|
// expand为Number时 过滤掉大于expand 且 非fixed的column
|
|
55
43
|
if (typeof expand === 'number') {
|
|
@@ -65,9 +53,8 @@ const RenderFields = props => {
|
|
|
65
53
|
viewRender,
|
|
66
54
|
viewType,
|
|
67
55
|
valueType,
|
|
68
|
-
formItemProps = {},
|
|
69
56
|
colProps = {},
|
|
70
|
-
// @ts-ignore
|
|
57
|
+
// @ts-ignore formItemChildProps 为运行时透传给 FormItem 子节点的属性,未声明在 ProFormColumnType 公开类型中
|
|
71
58
|
formItemChildProps = {},
|
|
72
59
|
fieldProps = {},
|
|
73
60
|
onDiff,
|
|
@@ -86,10 +73,9 @@ const RenderFields = props => {
|
|
|
86
73
|
// 处理dependencies,支持namesPaths格式
|
|
87
74
|
const processedDeps = processDependencies(column.dependencies);
|
|
88
75
|
|
|
89
|
-
//
|
|
76
|
+
// formItem 的属性平铺在 column 最外层
|
|
90
77
|
const _formItemProps = {
|
|
91
78
|
...defaultProps,
|
|
92
|
-
...formItemProps,
|
|
93
79
|
...otherFormItemProps,
|
|
94
80
|
required: columnRequired ?? required,
|
|
95
81
|
clearNotShow,
|
|
@@ -110,7 +96,6 @@ const RenderFields = props => {
|
|
|
110
96
|
let index;
|
|
111
97
|
// FormList场景
|
|
112
98
|
if (Array.isArray(column?.namePath) && column?.namePath?.length) {
|
|
113
|
-
// @ts-ignore
|
|
114
99
|
value = form.getFieldValue(_union(column.namePath, column?.name || []));
|
|
115
100
|
record = form.getFieldValue(column.namePath);
|
|
116
101
|
index = column?.index;
|
|
@@ -226,32 +211,22 @@ const RenderFields = props => {
|
|
|
226
211
|
value: otherProps,
|
|
227
212
|
children: /*#__PURE__*/_jsx(Render, {
|
|
228
213
|
show: show,
|
|
229
|
-
|
|
230
|
-
disabled: column.disabled // 外层配置disabled
|
|
214
|
+
disabled: column.disabled // 外层配置disabled(与 otherProps.disabled 语义不同,单独传递)
|
|
231
215
|
,
|
|
232
|
-
formDisabled: formDisabled // 表单全局disabled
|
|
233
|
-
,
|
|
234
|
-
type: _type,
|
|
235
216
|
originComponent: component // 原始自定义component,用于动态函数场景,TargetComponent已经默认赋值Input被污染
|
|
236
217
|
,
|
|
237
|
-
component: TargetComponent
|
|
238
|
-
// @ts-ignore
|
|
239
|
-
,
|
|
218
|
+
component: TargetComponent,
|
|
240
219
|
formItemProps: _formItemProps,
|
|
241
220
|
confirm: confirm,
|
|
242
|
-
colProps: _colProps,
|
|
243
221
|
componentProps: componentProps,
|
|
244
222
|
otherProps: otherProps,
|
|
245
223
|
fieldProps: _isFunction(fieldProps) ? fieldProps : null // 透传fieldProps函数
|
|
246
224
|
,
|
|
247
225
|
isSelect: _isSelect,
|
|
248
|
-
diffConfig: diffConfig,
|
|
249
226
|
onDiff: onDiff,
|
|
250
227
|
requiredOnView: requiredOnView,
|
|
251
|
-
globalControl: globalControl,
|
|
252
228
|
viewRender: viewRender,
|
|
253
|
-
desensitization: desensitization
|
|
254
|
-
shouldUpdateDebounce: shouldUpdateDebounce
|
|
229
|
+
desensitization: desensitization
|
|
255
230
|
})
|
|
256
231
|
}, `${_formItemProps.name || _formItemProps.label}${index}`);
|
|
257
232
|
});
|
|
@@ -28,7 +28,7 @@ import type { ProUploadType } from '../../../ProUpload/propsType';
|
|
|
28
28
|
import type { ProTreeType } from '../../../ProTree/propsType';
|
|
29
29
|
import type { GroupType as GroupCopyProps } from '../combination/Group/propsType';
|
|
30
30
|
import type { ProCollapseType } from '../../../ProLayout/components/ProCollapse/PropTypes';
|
|
31
|
-
import type { DistributiveOmit
|
|
31
|
+
import type { DistributiveOmit } from '../../propsType';
|
|
32
32
|
import type { DiffOriginalParams } from '../../utils/diffOriginal';
|
|
33
33
|
import { NamePathsDependencyType } from '../../utils/processDependencies';
|
|
34
34
|
type ValidateKey = keyof typeof validate;
|
|
@@ -180,17 +180,6 @@ export interface ProFormColumn<Values = any> extends Omit<FormItemProps<Values>,
|
|
|
180
180
|
span?: number;
|
|
181
181
|
/** 依赖刷新字段列表 */
|
|
182
182
|
dependNames?: NamePath[];
|
|
183
|
-
/**
|
|
184
|
-
* @description 表单item的props属性
|
|
185
|
-
* @deprecated 将于下个版本 4.0.0 被弃用
|
|
186
|
-
* @default -
|
|
187
|
-
*/
|
|
188
|
-
formItemProps?: FormItemProps<Values> & {
|
|
189
|
-
index?: number;
|
|
190
|
-
namePath?: NamePath;
|
|
191
|
-
/** 依赖刷新字段列表 */
|
|
192
|
-
dependNames?: NamePath[];
|
|
193
|
-
};
|
|
194
183
|
/**
|
|
195
184
|
* @description 表单props属性
|
|
196
185
|
* @deprecated 将于下个版本 4.0.0 被弃用, 请使用fieldProps进行替换
|
|
@@ -236,7 +225,6 @@ export type ProFormColumnType<T = any> = ProFormColumnWithExtendedDeps<T> & Colu
|
|
|
236
225
|
* 表单渲染类型
|
|
237
226
|
*/
|
|
238
227
|
export interface RenderType<Values = any> {
|
|
239
|
-
formDisabled?: boolean;
|
|
240
228
|
component: any;
|
|
241
229
|
formItemProps: FormItemProps<Values> & {
|
|
242
230
|
labelWidth?: string | number;
|
|
@@ -260,7 +248,6 @@ export interface RenderType<Values = any> {
|
|
|
260
248
|
parentNames?: string;
|
|
261
249
|
names?: NamePath[];
|
|
262
250
|
};
|
|
263
|
-
colProps: ColProps;
|
|
264
251
|
componentProps: {
|
|
265
252
|
disabledStrictly?: boolean;
|
|
266
253
|
[name: string]: any;
|
|
@@ -273,14 +260,10 @@ export interface RenderType<Values = any> {
|
|
|
273
260
|
namePath?: NamePath;
|
|
274
261
|
[key: string]: any;
|
|
275
262
|
}) => boolean);
|
|
276
|
-
form: FormInstance<Values>;
|
|
277
263
|
fieldProps?: ReactiveFunction<Values, React.ReactNode>;
|
|
278
264
|
isSelect: boolean;
|
|
279
|
-
diffConfig: DiffConfigType;
|
|
280
265
|
requiredOnView?: boolean;
|
|
281
266
|
confirm?: ProFormColumnType['confirm'];
|
|
282
|
-
globalControl?: boolean;
|
|
283
|
-
shouldUpdateDebounce?: number;
|
|
284
267
|
[name: string]: any;
|
|
285
268
|
}
|
|
286
269
|
/**
|
|
@@ -1,27 +1 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* percent 百分比 permillage 千分比 amount 金额
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* 扩展函数的参数
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
// ProForm场景 转换value为可选, onChange参数修改
|
|
10
|
-
|
|
11
|
-
const a = {};
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* 值转换
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
// 扩展依赖类型的ProFormColumn接口
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* 表单渲染类型
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* 兼容旧命名导出
|
|
25
|
-
*/
|
|
26
|
-
// 类型别名
|
|
27
1
|
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useControlled: (props: any) => any[];
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
|
|
3
|
+
// 受控状态
|
|
4
|
+
export const useControlled = props => {
|
|
5
|
+
const {
|
|
6
|
+
value,
|
|
7
|
+
onChange
|
|
8
|
+
} = props;
|
|
9
|
+
const [state, setState] = useState(value || false);
|
|
10
|
+
if (value !== undefined) {
|
|
11
|
+
return [value, onChange];
|
|
12
|
+
}
|
|
13
|
+
return [state, setState];
|
|
14
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ModifiedFormInstanceType } from '../propsType';
|
|
2
|
+
export interface FormInstanceOption {
|
|
3
|
+
scrollToError?: boolean;
|
|
4
|
+
optimize?: boolean;
|
|
5
|
+
formKey?: string;
|
|
6
|
+
source?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const useForm: <T>(originForm?: ModifiedFormInstanceType<T> | FormInstanceOption, options?: FormInstanceOption) => [ModifiedFormInstanceType<T>];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Form } from 'antd';
|
|
2
2
|
import { useContext } from 'react';
|
|
3
|
-
import { filterInternalFields, getFormFieldPaths, mergeNames, isListForm } from "
|
|
3
|
+
import { filterInternalFields, getFormFieldPaths, mergeNames, isListForm } from "../utils";
|
|
4
4
|
import { handleScrollToError as handleScrollToErrorProEditTable } from "../../ProEditTable/utils/tools";
|
|
5
5
|
import { FormsContext } from "../../FormsProvider";
|
|
6
6
|
export const useForm = function (originForm, options) {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import _isString from "lodash/isString";
|
|
2
2
|
import _isBoolean from "lodash/isBoolean";
|
|
3
3
|
import { useEffect, useMemo } from 'react';
|
|
4
|
-
import { rulesCreator } from "
|
|
5
|
-
import { isNotFullArray, isNullArray } from "
|
|
4
|
+
import { rulesCreator } from "../utils/rulesCreator";
|
|
5
|
+
import { isNotFullArray, isNullArray } from "../utils";
|
|
6
6
|
import locale from "../../locale";
|
|
7
7
|
const useRules = props => {
|
|
8
8
|
const {
|
|
@@ -10,9 +10,13 @@ interface Result<Values> {
|
|
|
10
10
|
}
|
|
11
11
|
interface UseShouldUpdateProps<Values> {
|
|
12
12
|
show?: ProFormColumnType['show'];
|
|
13
|
-
formItemProps?:
|
|
13
|
+
formItemProps?: FormItemProps<Values> & {
|
|
14
14
|
clearNotShow?: boolean;
|
|
15
15
|
names?: any[];
|
|
16
|
+
index?: number;
|
|
17
|
+
namePath?: any;
|
|
18
|
+
dependNames?: any[];
|
|
19
|
+
parentNames?: any;
|
|
16
20
|
};
|
|
17
21
|
form?: FormInstance<Values>;
|
|
18
22
|
disabled?: boolean;
|
|
@@ -4,6 +4,7 @@ import _isEqualWith from "lodash/isEqualWith";
|
|
|
4
4
|
import _isFunction from "lodash/isFunction";
|
|
5
5
|
import { useRef, useState, useEffect } from 'react';
|
|
6
6
|
import { customEqualForFunction } from "../../utils";
|
|
7
|
+
import { resolveReactiveValues, hasReactiveDiff, commitReactiveValues } from "../utils/reactiveValues";
|
|
7
8
|
/** FormList中被删除的行也会再触发一次响应式函数 排除这种场景 */
|
|
8
9
|
const isDeleteLine = (form, namePath) => {
|
|
9
10
|
if (namePath) {
|
|
@@ -102,19 +103,33 @@ const useShouldUpdate = props => {
|
|
|
102
103
|
const [, reRender] = useState({});
|
|
103
104
|
let values = {};
|
|
104
105
|
|
|
106
|
+
// 响应式配置与 ref 集合,供纯函数复用
|
|
107
|
+
const reactiveProps = {
|
|
108
|
+
show,
|
|
109
|
+
disabled,
|
|
110
|
+
required,
|
|
111
|
+
rules,
|
|
112
|
+
fieldProps,
|
|
113
|
+
desensitization
|
|
114
|
+
};
|
|
115
|
+
const reactiveRefs = {
|
|
116
|
+
showRef,
|
|
117
|
+
disabledRef,
|
|
118
|
+
requiredRef,
|
|
119
|
+
rulesRef,
|
|
120
|
+
fieldPropsRef,
|
|
121
|
+
desensitizationRef
|
|
122
|
+
};
|
|
123
|
+
|
|
105
124
|
// 处理表单值更新的函数
|
|
106
125
|
const processValuesUpdate = currentValues => {
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
_currentValues = form.getFieldValue(namePath) || {};
|
|
110
|
-
} else {
|
|
111
|
-
_currentValues = currentValues;
|
|
112
|
-
}
|
|
113
|
-
const _show = _isFunction(show) ? Boolean(show(_currentValues, {
|
|
126
|
+
const _currentValues = namePath ? form.getFieldValue(namePath) || {} : currentValues;
|
|
127
|
+
const ctx = {
|
|
114
128
|
form,
|
|
115
129
|
index,
|
|
116
130
|
namePath
|
|
117
|
-
}
|
|
131
|
+
};
|
|
132
|
+
const next = resolveReactiveValues(reactiveProps, _currentValues, ctx);
|
|
118
133
|
|
|
119
134
|
// 在防抖函数中也执行清值逻辑,确保清值功能在防抖场景下也能正常工作
|
|
120
135
|
executeClearValue({
|
|
@@ -124,46 +139,13 @@ const useShouldUpdate = props => {
|
|
|
124
139
|
namePath,
|
|
125
140
|
formItemProps,
|
|
126
141
|
clearNotShow,
|
|
127
|
-
currentShow:
|
|
142
|
+
currentShow: next.show,
|
|
128
143
|
previousShow: showRef.current,
|
|
129
144
|
needClear,
|
|
130
145
|
timerRef
|
|
131
146
|
});
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
index,
|
|
135
|
-
namePath
|
|
136
|
-
}) : disabled;
|
|
137
|
-
const _required = _isFunction(required) ? required(_currentValues, {
|
|
138
|
-
form,
|
|
139
|
-
index,
|
|
140
|
-
namePath
|
|
141
|
-
}) : required;
|
|
142
|
-
const _rules = _isFunction(rules) ? rules(_currentValues, {
|
|
143
|
-
form,
|
|
144
|
-
index,
|
|
145
|
-
namePath
|
|
146
|
-
}) : rules;
|
|
147
|
-
const _fieldProps = _isFunction(fieldProps) ? fieldProps(_currentValues, {
|
|
148
|
-
form,
|
|
149
|
-
index,
|
|
150
|
-
namePath
|
|
151
|
-
}) : fieldProps;
|
|
152
|
-
const _desensitization = _isFunction(desensitization) ? desensitization(_currentValues, {
|
|
153
|
-
form,
|
|
154
|
-
index,
|
|
155
|
-
namePath
|
|
156
|
-
}) : desensitization;
|
|
157
|
-
const equalRes = _isEqualWith(rulesRef.current, _rules, customEqualForFunction);
|
|
158
|
-
const proEqualRes = _isEqualWith(fieldPropsRef.current, _fieldProps, customEqualForFunction);
|
|
159
|
-
const desensitizationRes = _isEqualWith(desensitizationRef.current, _desensitization);
|
|
160
|
-
if (_show !== showRef.current || !_isEqualWith(disabledRef.current, _disabled, customEqualForFunction) || _required !== requiredRef.current || !equalRes || !proEqualRes || !desensitizationRes || _fieldProps?.transformResponse) {
|
|
161
|
-
showRef.current = _show;
|
|
162
|
-
disabledRef.current = _disabled;
|
|
163
|
-
requiredRef.current = _required;
|
|
164
|
-
rulesRef.current = _rules;
|
|
165
|
-
fieldPropsRef.current = _fieldProps;
|
|
166
|
-
desensitizationRef.current = _desensitization;
|
|
147
|
+
if (hasReactiveDiff(reactiveRefs, next)) {
|
|
148
|
+
commitReactiveValues(reactiveRefs, next);
|
|
167
149
|
reRender({});
|
|
168
150
|
}
|
|
169
151
|
};
|
|
@@ -334,42 +316,13 @@ const useShouldUpdate = props => {
|
|
|
334
316
|
}
|
|
335
317
|
|
|
336
318
|
// 原有的非防抖逻辑
|
|
337
|
-
const
|
|
319
|
+
const next = resolveReactiveValues(reactiveProps, _currentValues, {
|
|
338
320
|
form,
|
|
339
321
|
index,
|
|
340
322
|
namePath
|
|
341
|
-
})
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
index,
|
|
345
|
-
namePath
|
|
346
|
-
}) : required;
|
|
347
|
-
const _rules = _isFunction(rules) ? rules(_currentValues, {
|
|
348
|
-
form,
|
|
349
|
-
index,
|
|
350
|
-
namePath
|
|
351
|
-
}) : rules;
|
|
352
|
-
const _fieldProps = _isFunction(fieldProps) ? fieldProps(_currentValues, {
|
|
353
|
-
form,
|
|
354
|
-
index,
|
|
355
|
-
namePath
|
|
356
|
-
}) : fieldProps;
|
|
357
|
-
const _desensitization = _isFunction(desensitization) ? desensitization(_currentValues, {
|
|
358
|
-
form,
|
|
359
|
-
index,
|
|
360
|
-
namePath
|
|
361
|
-
}) : desensitization;
|
|
362
|
-
const equalRes = _isEqualWith(rulesRef.current, _rules, customEqualForFunction);
|
|
363
|
-
const proEqualRes = _isEqualWith(fieldPropsRef.current, _fieldProps, customEqualForFunction);
|
|
364
|
-
const desensitizationRes = _isEqualWith(desensitizationRef.current, _desensitization);
|
|
365
|
-
if (_show !== showRef.current || _disabled !== disabledRef.current || _required !== requiredRef.current || !equalRes || !proEqualRes || !desensitizationRes || _fieldProps?.transformResponse // 防止fieldProps变更时,transformResponse根据fieldProps新值无法触发更新
|
|
366
|
-
) {
|
|
367
|
-
showRef.current = _show;
|
|
368
|
-
disabledRef.current = _disabled;
|
|
369
|
-
requiredRef.current = _required;
|
|
370
|
-
rulesRef.current = _rules;
|
|
371
|
-
fieldPropsRef.current = _fieldProps;
|
|
372
|
-
desensitizationRef.current = _desensitization;
|
|
323
|
+
});
|
|
324
|
+
if (hasReactiveDiff(reactiveRefs, next)) {
|
|
325
|
+
commitReactiveValues(reactiveRefs, next);
|
|
373
326
|
reRender({});
|
|
374
327
|
return false;
|
|
375
328
|
}
|
|
@@ -3,7 +3,7 @@ import warning from 'rc-util/lib/warning';
|
|
|
3
3
|
import { useState, useEffect, useRef, useMemo } from 'react';
|
|
4
4
|
import isEqual from 'lodash/isEqual';
|
|
5
5
|
import cloneDeep from 'lodash/cloneDeep';
|
|
6
|
-
import { toArray } from "
|
|
6
|
+
import { toArray } from "../utils";
|
|
7
7
|
|
|
8
8
|
// 从一个对象或Form值中获取特定路径的值
|
|
9
9
|
function get(source, path) {
|
package/es/ProForm/index.js
CHANGED
|
@@ -9,11 +9,12 @@ import { FormFooter } from "./components";
|
|
|
9
9
|
import RenderFields from "./components/render/RenderFields";
|
|
10
10
|
import { useProConfig } from "../ProConfigProvider";
|
|
11
11
|
import { useProDrawerFormContext } from "../ProDrawerForm";
|
|
12
|
-
import { getLayout, splitNameStr,
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
12
|
+
import { getLayout, splitNameStr, initialValuesToNames, filterInternalFields, getFormFieldPaths } from "./utils/index";
|
|
13
|
+
import { useControlled } from "./hooks/useControlled";
|
|
14
|
+
import { useForm } from "./hooks/useForm";
|
|
15
|
+
import { useFieldProps } from "./hooks/useFieldProps";
|
|
15
16
|
import locale from "../locale";
|
|
16
|
-
import useWatch from "./
|
|
17
|
+
import useWatch from "./hooks/useWatch";
|
|
17
18
|
import FormsProvider, { useContextForms, useForms } from "../FormsProvider";
|
|
18
19
|
import { useStep } from "../ProStep";
|
|
19
20
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -2,10 +2,22 @@ import React, { ReactNode } from 'react';
|
|
|
2
2
|
import { ButtonProps, ColProps, RowProps } from 'antd';
|
|
3
3
|
import { FormProps, FormInstance } from 'antd/es/form/Form';
|
|
4
4
|
import { NamePath } from 'antd/es/form/interface';
|
|
5
|
-
import type { StoreValue, Store } from '@rc-component/form/es/interface';
|
|
5
|
+
import type { StoreValue, Store, ValuedNotifyInfo } from '@rc-component/form/es/interface';
|
|
6
6
|
import type { ShouldUpdate } from '@rc-component/form/es/Field';
|
|
7
7
|
import type { ProFormColumnType, ViewType } from './components/render/propsType';
|
|
8
8
|
import type { ProFormComponentType } from './components';
|
|
9
|
+
export type ModifiedFormInstanceType<T> = FormInstance<T> & {
|
|
10
|
+
isModified?: boolean;
|
|
11
|
+
/** 默认清空设置值的报错状态 */
|
|
12
|
+
setFieldValue: (name: NamePath, value: any, info?: ValuedNotifyInfo) => void;
|
|
13
|
+
formKey?: string;
|
|
14
|
+
_init?: boolean;
|
|
15
|
+
__INTERNAL_CONFIG__?: {
|
|
16
|
+
fields?: any[];
|
|
17
|
+
stopOnFirstError?: boolean;
|
|
18
|
+
[key: string]: any;
|
|
19
|
+
};
|
|
20
|
+
};
|
|
9
21
|
export interface ButtonType extends ButtonProps {
|
|
10
22
|
children?: any;
|
|
11
23
|
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { FormItemProps } from 'antd';
|
|
2
|
+
interface BuildFormItemPropsParams {
|
|
3
|
+
baseFormItemProps: any;
|
|
4
|
+
otherProps: any;
|
|
5
|
+
form: any;
|
|
6
|
+
namesStr: any;
|
|
7
|
+
internalRule: any;
|
|
8
|
+
resolvedRequired: any;
|
|
9
|
+
rules: any;
|
|
10
|
+
labelRequired: any;
|
|
11
|
+
requiredOnView?: boolean;
|
|
12
|
+
type: string;
|
|
13
|
+
trim?: boolean;
|
|
14
|
+
upperCase?: boolean;
|
|
15
|
+
proConfig: any;
|
|
16
|
+
validateFirst: any;
|
|
17
|
+
lastDisabled: any;
|
|
18
|
+
labelWidth?: string | number;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* 将列配置整理为最终透传给 Form.Item 的 props(纯函数)
|
|
22
|
+
* 聚合 valueType transform / transformNames / 校验规则 / disabled 优先级 / omit
|
|
23
|
+
*/
|
|
24
|
+
export declare const buildFormItemProps: (params: BuildFormItemPropsParams) => FormItemProps & Record<string, any>;
|
|
25
|
+
export {};
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import _omit from "lodash/omit";
|
|
2
|
+
import _isFunction from "lodash/isFunction";
|
|
3
|
+
import { isTrim, isUpperCase } from "./index";
|
|
4
|
+
import transformNames from "./transformNames";
|
|
5
|
+
import valueTypeMap from "./valueType";
|
|
6
|
+
|
|
7
|
+
/** 整理 lastFormItemProps 时需要剔除、防止透传给 Form.Item 报错的 key */
|
|
8
|
+
const OMIT_FORM_ITEM_KEYS = ['component', 'names', 'format', 'toISOString', 'toCSTString', 'switchValue', 'precision', 'clearNotShow', 'dependNames'];
|
|
9
|
+
/**
|
|
10
|
+
* 将列配置整理为最终透传给 Form.Item 的 props(纯函数)
|
|
11
|
+
* 聚合 valueType transform / transformNames / 校验规则 / disabled 优先级 / omit
|
|
12
|
+
*/
|
|
13
|
+
export const buildFormItemProps = params => {
|
|
14
|
+
const {
|
|
15
|
+
baseFormItemProps,
|
|
16
|
+
otherProps,
|
|
17
|
+
form,
|
|
18
|
+
namesStr,
|
|
19
|
+
internalRule,
|
|
20
|
+
resolvedRequired,
|
|
21
|
+
rules,
|
|
22
|
+
labelRequired,
|
|
23
|
+
requiredOnView,
|
|
24
|
+
type,
|
|
25
|
+
trim,
|
|
26
|
+
upperCase,
|
|
27
|
+
proConfig,
|
|
28
|
+
validateFirst,
|
|
29
|
+
lastDisabled,
|
|
30
|
+
labelWidth
|
|
31
|
+
} = params;
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* 基于formItem的normalize与getValueProps进行值类型转换
|
|
35
|
+
*/
|
|
36
|
+
const valueTypeTransform = () => {
|
|
37
|
+
let {
|
|
38
|
+
valueType
|
|
39
|
+
} = otherProps || {};
|
|
40
|
+
// SwitchCheckbox默认YN, 兼容已有组件
|
|
41
|
+
if (type === 'SwitchCheckbox') {
|
|
42
|
+
valueType = 'switch';
|
|
43
|
+
}
|
|
44
|
+
if (type === 'Input') {
|
|
45
|
+
valueType = valueType || 'trim';
|
|
46
|
+
}
|
|
47
|
+
// 不存在valueType返回空
|
|
48
|
+
if (!valueType) {
|
|
49
|
+
return {};
|
|
50
|
+
}
|
|
51
|
+
const valueTypeParams = {
|
|
52
|
+
...otherProps,
|
|
53
|
+
...baseFormItemProps
|
|
54
|
+
};
|
|
55
|
+
return _isFunction(valueTypeMap[valueType]) ? valueTypeMap[valueType](valueTypeParams) : {};
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* transform对象
|
|
60
|
+
* 存在names通过transformNames转换平铺处理, 没有默认走valueType的处理
|
|
61
|
+
*/
|
|
62
|
+
const transforms = Array.isArray(otherProps?.names) ? transformNames({
|
|
63
|
+
...baseFormItemProps,
|
|
64
|
+
...valueTypeTransform()
|
|
65
|
+
},
|
|
66
|
+
// 合并valueType的transform
|
|
67
|
+
form, otherProps.names, namesStr, otherProps.type) : valueTypeTransform();
|
|
68
|
+
return _omit({
|
|
69
|
+
...baseFormItemProps,
|
|
70
|
+
...transforms,
|
|
71
|
+
names: otherProps.names,
|
|
72
|
+
...internalRule,
|
|
73
|
+
required: resolvedRequired || Array.isArray(rules) && rules?.some(item => item?.required) || (typeof labelRequired === 'boolean' ? labelRequired : false),
|
|
74
|
+
...(otherProps.isView && !requiredOnView ? {
|
|
75
|
+
required: false
|
|
76
|
+
} : null),
|
|
77
|
+
...isTrim(type, trim, proConfig),
|
|
78
|
+
// 优先取传进来的,其次取ProConfigProvider配置的
|
|
79
|
+
...isUpperCase(type, upperCase),
|
|
80
|
+
validateFirst,
|
|
81
|
+
// 当某一规则校验不通过时,是否停止剩下的规则的校验
|
|
82
|
+
disabled: lastDisabled,
|
|
83
|
+
// 添加label宽度
|
|
84
|
+
...(labelWidth ? {
|
|
85
|
+
labelCol: {
|
|
86
|
+
flex: `${labelWidth}px`
|
|
87
|
+
}
|
|
88
|
+
} : null)
|
|
89
|
+
}, OMIT_FORM_ITEM_KEYS);
|
|
90
|
+
};
|
|
@@ -9,7 +9,6 @@ interface AnyObject {
|
|
|
9
9
|
[key: string]: any;
|
|
10
10
|
}
|
|
11
11
|
export declare const getLayout: (params: any) => transProps;
|
|
12
|
-
export declare const useControlled: (props: any) => any[];
|
|
13
12
|
export declare const isSelect: (props: any) => any;
|
|
14
13
|
/**
|
|
15
14
|
* Input TextArea 移除前后空格
|
|
@@ -64,10 +63,6 @@ export declare function getArrayBeforeNumber(arr: (string | number)[]): (string
|
|
|
64
63
|
* 查询数据中是否包含rowKey
|
|
65
64
|
*/
|
|
66
65
|
export declare const hasRowKey: (obj: any) => boolean;
|
|
67
|
-
/**
|
|
68
|
-
* 查询数据中是否包含rowKey
|
|
69
|
-
*/
|
|
70
|
-
export declare const view: (obj: any) => boolean;
|
|
71
66
|
/**
|
|
72
67
|
* 获取小数点后的位数
|
|
73
68
|
* @param num 数字
|
|
@@ -110,4 +105,5 @@ export declare const mergeNames: (data1: DataItem[], data2: DataItem[]) => DataI
|
|
|
110
105
|
* @returns {boolean} - 如果匹配成功,返回 true;否则返回 false。
|
|
111
106
|
*/
|
|
112
107
|
export declare const isListForm: (str: string) => boolean;
|
|
113
|
-
export
|
|
108
|
+
export * from './buildFormItemProps';
|
|
109
|
+
export * from './reactiveValues';
|
|
@@ -5,7 +5,6 @@ import _get from "lodash/get";
|
|
|
5
5
|
import _isObject from "lodash/isObject";
|
|
6
6
|
/* eslint-disable no-restricted-syntax */
|
|
7
7
|
import dayjs from 'dayjs';
|
|
8
|
-
import { useState } from 'react';
|
|
9
8
|
export const getLayout = params => {
|
|
10
9
|
const {
|
|
11
10
|
span = 8,
|
|
@@ -28,19 +27,6 @@ export const getLayout = params => {
|
|
|
28
27
|
}
|
|
29
28
|
};
|
|
30
29
|
};
|
|
31
|
-
|
|
32
|
-
// 受控状态
|
|
33
|
-
export const useControlled = props => {
|
|
34
|
-
const {
|
|
35
|
-
value,
|
|
36
|
-
onChange
|
|
37
|
-
} = props;
|
|
38
|
-
const [state, setState] = useState(value || false);
|
|
39
|
-
if (value !== undefined) {
|
|
40
|
-
return [value, onChange];
|
|
41
|
-
}
|
|
42
|
-
return [state, setState];
|
|
43
|
-
};
|
|
44
30
|
export const isSelect = props => {
|
|
45
31
|
const {
|
|
46
32
|
dataSource,
|
|
@@ -292,21 +278,6 @@ export const hasRowKey = obj => {
|
|
|
292
278
|
return keys.some(key => hasRowKey(obj[key]));
|
|
293
279
|
};
|
|
294
280
|
|
|
295
|
-
/**
|
|
296
|
-
* 查询数据中是否包含rowKey
|
|
297
|
-
*/
|
|
298
|
-
export const view = obj => {
|
|
299
|
-
if (typeof obj !== 'object' || obj === null) {
|
|
300
|
-
return false;
|
|
301
|
-
}
|
|
302
|
-
const keys = Object.keys(obj);
|
|
303
|
-
const rowKeyExists = keys.includes('rowKey');
|
|
304
|
-
if (rowKeyExists) {
|
|
305
|
-
return true;
|
|
306
|
-
}
|
|
307
|
-
return keys.some(key => hasRowKey(obj[key]));
|
|
308
|
-
};
|
|
309
|
-
|
|
310
281
|
/**
|
|
311
282
|
* 获取小数点后的位数
|
|
312
283
|
* @param num 数字
|
|
@@ -439,4 +410,6 @@ export const isListForm = str => {
|
|
|
439
410
|
// 正则表达式:查找被逗号或字符串边界包围的数字
|
|
440
411
|
const regex = /(?:^|,)\s*\d+\s*(?:,|$)/;
|
|
441
412
|
return regex.test(str);
|
|
442
|
-
};
|
|
413
|
+
};
|
|
414
|
+
export * from "./buildFormItemProps";
|
|
415
|
+
export * from "./reactiveValues";
|