@zat-design/sisyphus-react 3.5.5-beta.9 → 3.6.0-beta.1
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 +3 -0
- package/dist/less.esm.css +3 -0
- package/es/ProEditTable/index.js +35 -20
- package/es/ProEditTable/propsType.d.ts +6 -1
- package/es/ProEditTable/style/index.less +1 -0
- package/es/ProEditTable/utils/index.js +1 -0
- package/es/ProForm/index.js +7 -4
- package/es/ProForm/propsType.d.ts +4 -0
- package/es/ProForm/utils/index.d.ts +1 -1
- package/es/ProForm/utils/index.js +9 -13
- package/es/ProForm/utils/useForm.d.ts +1 -0
- package/es/ProForm/utils/useForm.js +4 -3
- package/lib/ProEditTable/index.js +31 -18
- package/lib/ProEditTable/propsType.d.ts +6 -1
- package/lib/ProEditTable/style/index.less +1 -0
- package/lib/ProEditTable/utils/index.js +1 -0
- package/lib/ProForm/index.js +7 -4
- package/lib/ProForm/propsType.d.ts +4 -0
- package/lib/ProForm/utils/index.d.ts +1 -1
- package/lib/ProForm/utils/index.js +8 -12
- package/lib/ProForm/utils/useForm.d.ts +1 -0
- package/lib/ProForm/utils/useForm.js +4 -3
- package/package.json +1 -1
package/dist/index.esm.css
CHANGED
|
@@ -4481,6 +4481,9 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
|
|
|
4481
4481
|
position: absolute;
|
|
4482
4482
|
bottom: var(--zaui-space-size-md, 16px);
|
|
4483
4483
|
}
|
|
4484
|
+
.pro-edit-table-toolbar {
|
|
4485
|
+
background-color: #fff;
|
|
4486
|
+
}
|
|
4484
4487
|
.pro-edit-table-toolbar .ant-space {
|
|
4485
4488
|
gap: var(--zaui-space-size-sm, 8px);
|
|
4486
4489
|
}
|
package/dist/less.esm.css
CHANGED
|
@@ -4481,6 +4481,9 @@ span.ant-input-group-compact.pro-range-limit .forever-checkbox {
|
|
|
4481
4481
|
position: absolute;
|
|
4482
4482
|
bottom: var(--zaui-space-size-md, 16px);
|
|
4483
4483
|
}
|
|
4484
|
+
.pro-edit-table-toolbar {
|
|
4485
|
+
background-color: #fff;
|
|
4486
|
+
}
|
|
4484
4487
|
.pro-edit-table-toolbar .ant-space {
|
|
4485
4488
|
gap: var(--zaui-space-size-sm, 8px);
|
|
4486
4489
|
}
|
package/es/ProEditTable/index.js
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import "antd/es/affix/style";
|
|
2
|
+
import _Affix from "antd/es/affix";
|
|
1
3
|
import "antd/es/table/style";
|
|
2
4
|
import _Table from "antd/es/table";
|
|
3
5
|
import _typeof from "@babel/runtime/helpers/esm/typeof";
|
|
@@ -9,11 +11,11 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
|
9
11
|
import "antd/es/form/style";
|
|
10
12
|
import _Form from "antd/es/form";
|
|
11
13
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
12
|
-
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "originalDiffTip", "rowKey", "rowDisabled", "rowDraggable", "footerRender", "scroll", "actionDirection"];
|
|
14
|
+
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "toolbarSticky", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "originalDiffTip", "rowKey", "rowDisabled", "rowDraggable", "footerRender", "scroll", "actionDirection"];
|
|
13
15
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
16
|
import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
|
|
15
|
-
import { get, isArray } from 'lodash';
|
|
16
|
-
import { useLocalStorageState, useSetState } from 'ahooks';
|
|
17
|
+
import { get, isArray, isBoolean } from 'lodash';
|
|
18
|
+
import { useDeepCompareEffect, useLocalStorageState, useSetState } from 'ahooks';
|
|
17
19
|
import classnames from 'classnames';
|
|
18
20
|
import { transformColumns } from './utils';
|
|
19
21
|
import { getRandom, getNamePath } from './utils/tools';
|
|
@@ -38,6 +40,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
38
40
|
actionWidth = _ref.actionWidth,
|
|
39
41
|
actionProps = _ref.actionProps,
|
|
40
42
|
toolbarProps = _ref.toolbarProps,
|
|
43
|
+
toolbarSticky = _ref.toolbarSticky,
|
|
41
44
|
rowSelection = _ref.rowSelection,
|
|
42
45
|
onlyOneLineMsg = _ref.onlyOneLineMsg,
|
|
43
46
|
deletePoConfirmMsg = _ref.deletePoConfirmMsg,
|
|
@@ -59,6 +62,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
59
62
|
// 上下文form
|
|
60
63
|
var contentForm = _Form.useFormInstance();
|
|
61
64
|
var formFieldProps = ProForm.useFieldProps() || {};
|
|
65
|
+
var affixRef = useRef(null);
|
|
62
66
|
var form = contentForm || (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.form) || (resetProps === null || resetProps === void 0 ? void 0 : resetProps.form);
|
|
63
67
|
var name = (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.name) || (resetProps === null || resetProps === void 0 ? void 0 : resetProps.name) || (resetProps === null || resetProps === void 0 ? void 0 : (_resetProps$id = resetProps.id) === null || _resetProps$id === void 0 ? void 0 : (_resetProps$id$split = _resetProps$id.split) === null || _resetProps$id$split === void 0 ? void 0 : _resetProps$id$split.call(_resetProps$id, '_'));
|
|
64
68
|
var _formFieldProps$isVie = formFieldProps.isView,
|
|
@@ -72,6 +76,8 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
72
76
|
disabled = (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.disabled) || disabled; // formFieldProps?.disabled可能是函数??
|
|
73
77
|
}
|
|
74
78
|
var tableRef = useRef(null);
|
|
79
|
+
var valueChangeRef = useRef(null);
|
|
80
|
+
valueChangeRef.current = 0;
|
|
75
81
|
var _React$useContext = React.useContext(_ConfigProvider.ConfigContext),
|
|
76
82
|
getPrefixCls = _React$useContext.getPrefixCls;
|
|
77
83
|
var prefixCls = getPrefixCls();
|
|
@@ -262,24 +268,13 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
262
268
|
}
|
|
263
269
|
return null;
|
|
264
270
|
};
|
|
271
|
+
useDeepCompareEffect(function () {
|
|
272
|
+
valueChangeRef.current += 1;
|
|
273
|
+
// 在这里根据需要计算新的数组
|
|
274
|
+
}, [value, config.name]);
|
|
265
275
|
var _columns = useMemo(function () {
|
|
266
276
|
return transformColumns(columns, config);
|
|
267
|
-
}, [
|
|
268
|
-
// const setColumns = async () => {
|
|
269
|
-
// const nextColumns = transformColumns(columns, config);
|
|
270
|
-
// setState({
|
|
271
|
-
// _columns: nextColumns,
|
|
272
|
-
// });
|
|
273
|
-
// };
|
|
274
|
-
// useDebounceEffect(
|
|
275
|
-
// () => {
|
|
276
|
-
// setColumns();
|
|
277
|
-
// },
|
|
278
|
-
// [value, cellNamePath, forceUpdate, editingKeys, disabled, actionProps, columns, page], // columns更新修复外部表单无法控制内部表单的问题
|
|
279
|
-
// {
|
|
280
|
-
// wait: 60,
|
|
281
|
-
// },
|
|
282
|
-
// );
|
|
277
|
+
}, [valueChangeRef.current, disabled, forceUpdate, columns, page, actionProps, editingKeys, cellNamePath]);
|
|
283
278
|
useEffect(function () {
|
|
284
279
|
var isAllHasKey = value.every(function (item) {
|
|
285
280
|
return item.rowKey;
|
|
@@ -310,6 +305,19 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
310
305
|
setInternalState: setState
|
|
311
306
|
};
|
|
312
307
|
});
|
|
308
|
+
useEffect(function () {
|
|
309
|
+
if (toolbarSticky) {
|
|
310
|
+
var updatePos = function updatePos() {
|
|
311
|
+
var _affixRef$current;
|
|
312
|
+
affixRef === null || affixRef === void 0 ? void 0 : (_affixRef$current = affixRef.current) === null || _affixRef$current === void 0 ? void 0 : _affixRef$current.updatePosition();
|
|
313
|
+
};
|
|
314
|
+
window.addEventListener('scroll', updatePos, true);
|
|
315
|
+
return function () {
|
|
316
|
+
window.removeEventListener('scroll', updatePos, true);
|
|
317
|
+
};
|
|
318
|
+
}
|
|
319
|
+
}, [toolbarSticky]);
|
|
320
|
+
var _toolbarSticky = isBoolean(toolbarSticky) ? {} : toolbarSticky;
|
|
313
321
|
var _summary = _typeof(summary) === 'object' ? function (data) {
|
|
314
322
|
return _jsx(Summary, {
|
|
315
323
|
data: data,
|
|
@@ -372,7 +380,14 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
372
380
|
},
|
|
373
381
|
summary: _summary
|
|
374
382
|
}))]
|
|
375
|
-
}), !isView && (value === null || value === void 0 ? void 0 : value.length) ? _jsx(
|
|
383
|
+
}), !isView && (value === null || value === void 0 ? void 0 : value.length) ? toolbarSticky ? _jsx(_Affix, _objectSpread(_objectSpread({
|
|
384
|
+
ref: affixRef
|
|
385
|
+
}, _toolbarSticky), {}, {
|
|
386
|
+
children: _jsx("div", {
|
|
387
|
+
className: "pro-edit-table-toolbar".concat(pagination ? ' pro-edit-table-toolbar-fixed' : ''),
|
|
388
|
+
children: _jsx(RenderToolbar, _objectSpread({}, config))
|
|
389
|
+
})
|
|
390
|
+
})) : _jsx("div", {
|
|
376
391
|
className: "pro-edit-table-toolbar".concat(pagination ? ' pro-edit-table-toolbar-fixed' : ''),
|
|
377
392
|
children: _jsx(RenderToolbar, _objectSpread({}, config))
|
|
378
393
|
}) : null, footerRender ? _jsx("div", {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ModalFuncProps } from 'antd';
|
|
1
|
+
import { AffixProps, ModalFuncProps } from 'antd';
|
|
2
2
|
import { Key, ReactNode } from 'react';
|
|
3
3
|
import { DragEndEvent } from '@dnd-kit/core';
|
|
4
4
|
import type { ButtonProps } from 'antd/es/button';
|
|
@@ -231,6 +231,11 @@ export interface ProEditTableProps<T = any> extends Omit<TableProps<T>, 'onChang
|
|
|
231
231
|
* @default -
|
|
232
232
|
*/
|
|
233
233
|
toolbarProps?: BaseActionProps<T>[] | boolean;
|
|
234
|
+
/**
|
|
235
|
+
* @description 自定义底部操作栏跟随页面滚动
|
|
236
|
+
* @default -
|
|
237
|
+
*/
|
|
238
|
+
toolbarSticky?: boolean | Omit<AffixProps, 'children'>;
|
|
234
239
|
/**
|
|
235
240
|
* @description 最大可添加数量
|
|
236
241
|
* @default -
|
|
@@ -256,6 +256,7 @@ export var transformColumns = function transformColumns() {
|
|
|
256
256
|
var columnName = (item === null || item === void 0 ? void 0 : item.name) || dataIndex || key;
|
|
257
257
|
item.dataIndex = columnName;
|
|
258
258
|
item.key = columnName;
|
|
259
|
+
// item.shouldCellUpdate = item.shouldCellUpdate || ((record, perRecord) => !isEqual(record, perRecord));
|
|
259
260
|
var required = isBoolean(item.required) ? item.required : false;
|
|
260
261
|
if (typeof item.required === 'function') {
|
|
261
262
|
var namePath = getNamePath(name, virtualKey);
|
package/es/ProForm/index.js
CHANGED
|
@@ -11,7 +11,7 @@ import _Space from "antd/es/space";
|
|
|
11
11
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
12
12
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
13
13
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
14
|
-
var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalDiffTip", "formKey", "globalControl", "scrollToError"];
|
|
14
|
+
var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalDiffTip", "formKey", "globalControl", "scrollToError", "optimize"];
|
|
15
15
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
16
|
import { DoubleLeftOutlined } from '@ant-design/icons';
|
|
17
17
|
import classnames from 'classnames';
|
|
@@ -67,6 +67,8 @@ var ProForm = function ProForm(props, ref) {
|
|
|
67
67
|
globalControl = props.globalControl,
|
|
68
68
|
_props$scrollToError = props.scrollToError,
|
|
69
69
|
scrollToError = _props$scrollToError === void 0 ? true : _props$scrollToError,
|
|
70
|
+
_props$optimize = props.optimize,
|
|
71
|
+
optimize = _props$optimize === void 0 ? false : _props$optimize,
|
|
70
72
|
otherProps = _objectWithoutProperties(props, _excluded);
|
|
71
73
|
var _useProConfig = useProConfig(),
|
|
72
74
|
state = _useProConfig.state,
|
|
@@ -74,7 +76,8 @@ var ProForm = function ProForm(props, ref) {
|
|
|
74
76
|
var config = state.ProForm,
|
|
75
77
|
forms = state.forms;
|
|
76
78
|
var _useForm = useForm((_forms$formKey = forms[formKey]) !== null && _forms$formKey !== void 0 ? _forms$formKey : originForm, {
|
|
77
|
-
scrollToError: scrollToError
|
|
79
|
+
scrollToError: scrollToError,
|
|
80
|
+
optimize: optimize
|
|
78
81
|
}),
|
|
79
82
|
_useForm2 = _slicedToArray(_useForm, 1),
|
|
80
83
|
form = _useForm2[0];
|
|
@@ -167,7 +170,7 @@ var ProForm = function ProForm(props, ref) {
|
|
|
167
170
|
// 暂时通过'-'区分组合组件字段和普通字段
|
|
168
171
|
var keys = Object.keys(changedValue);
|
|
169
172
|
if (!keys.length) {
|
|
170
|
-
onValuesChange(filterInternalFields(changedValue), form.getFieldsValue());
|
|
173
|
+
onValuesChange(filterInternalFields(changedValue, optimize), form.getFieldsValue());
|
|
171
174
|
} else {
|
|
172
175
|
var values = keys.map(function (key) {
|
|
173
176
|
if (key.includes('-')) {
|
|
@@ -179,7 +182,7 @@ var ProForm = function ProForm(props, ref) {
|
|
|
179
182
|
}
|
|
180
183
|
return {};
|
|
181
184
|
});
|
|
182
|
-
onValuesChange(filterInternalFields(merge.apply(void 0, [changedValue].concat(_toConsumableArray(values)))), form.getFieldsValue());
|
|
185
|
+
onValuesChange(filterInternalFields(merge.apply(void 0, [changedValue].concat(_toConsumableArray(values))), optimize), form.getFieldsValue());
|
|
183
186
|
}
|
|
184
187
|
};
|
|
185
188
|
// 包装一层兼容 names 改变
|
|
@@ -76,6 +76,10 @@ export interface ProFormProps<Values = any> extends FormProps<Values> {
|
|
|
76
76
|
required?: boolean | boolean[];
|
|
77
77
|
originalDiffTip?: boolean;
|
|
78
78
|
scrollToError?: boolean;
|
|
79
|
+
/** 性能模式,谨慎使用,默认不开启
|
|
80
|
+
* 1. 开启不过滤names的中间态值
|
|
81
|
+
*/
|
|
82
|
+
optimize?: boolean;
|
|
79
83
|
}
|
|
80
84
|
export interface Transform<T = any> {
|
|
81
85
|
normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue;
|
|
@@ -28,7 +28,7 @@ export declare const isUpperCase: (type: string, upperCase: boolean) => any;
|
|
|
28
28
|
export declare const weedOutProps: (data: Record<string, any>, keys: string[]) => {}[];
|
|
29
29
|
export declare const diffField: (prevValues: any, curValues: any, names: NamePath[]) => boolean;
|
|
30
30
|
export declare const splitNameStr: (name: string) => string[][];
|
|
31
|
-
export declare const filterInternalFields: (values: any) => any;
|
|
31
|
+
export declare const filterInternalFields: (values: any, optimize?: boolean) => any;
|
|
32
32
|
export declare const getAllNamePath: (object: Record<string, any>, currentPath?: InternalNamePath) => InternalNamePath[];
|
|
33
33
|
export declare const isNullValue: (value: any) => boolean;
|
|
34
34
|
/**
|
|
@@ -4,8 +4,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
|
4
4
|
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
5
5
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
6
6
|
import React, { useState } from 'react';
|
|
7
|
-
import _, { isObject, isFunction, cloneDeep, get, set, omit, isNaN } from 'lodash';
|
|
8
|
-
import moment from 'moment';
|
|
7
|
+
import _, { isObject, isFunction, cloneDeep, get, set, omit, isNaN, isPlainObject } from 'lodash';
|
|
9
8
|
export var getLayout = function getLayout(params) {
|
|
10
9
|
var _params$span = params.span,
|
|
11
10
|
span = _params$span === void 0 ? 8 : _params$span,
|
|
@@ -121,26 +120,23 @@ export var splitNameStr = function splitNameStr(name) {
|
|
|
121
120
|
});
|
|
122
121
|
};
|
|
123
122
|
// 过滤掉字段名中包含 '-' 的字段
|
|
124
|
-
export var filterInternalFields = function filterInternalFields(values) {
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
if ((values === null || values === void 0 ? void 0 : values._immutable) || moment.isMoment(values)) {
|
|
128
|
-
return nextValues;
|
|
129
|
-
}
|
|
130
|
-
if (values instanceof File) {
|
|
131
|
-
return nextValues;
|
|
123
|
+
export var filterInternalFields = function filterInternalFields(values, optimize) {
|
|
124
|
+
if (optimize) {
|
|
125
|
+
return values;
|
|
132
126
|
}
|
|
127
|
+
var nextValues = values;
|
|
133
128
|
if (Array.isArray(nextValues)) {
|
|
134
129
|
return nextValues.map(function (item) {
|
|
135
130
|
return filterInternalFields(item);
|
|
136
131
|
});
|
|
137
132
|
}
|
|
138
|
-
if (
|
|
133
|
+
if (isPlainObject(nextValues)) {
|
|
139
134
|
var result = {};
|
|
140
|
-
|
|
135
|
+
// eslint-disable-next-line guard-for-in
|
|
136
|
+
for (var key in nextValues) {
|
|
141
137
|
if (key.includes('-')) return;
|
|
142
138
|
result[key] = filterInternalFields(nextValues[key]);
|
|
143
|
-
}
|
|
139
|
+
}
|
|
144
140
|
return result;
|
|
145
141
|
}
|
|
146
142
|
return nextValues;
|
|
@@ -4,6 +4,7 @@ type ModifiedFormInstance<T> = FormInstance<T> & {
|
|
|
4
4
|
};
|
|
5
5
|
interface FormInstanceOption {
|
|
6
6
|
scrollToError?: boolean;
|
|
7
|
+
optimize?: boolean;
|
|
7
8
|
}
|
|
8
9
|
export declare const useForm: <T>(originForm: ModifiedFormInstance<T>, options?: FormInstanceOption) => [ModifiedFormInstance<T>];
|
|
9
10
|
export {};
|
|
@@ -9,7 +9,8 @@ import { handleScrollToError } from '../../ProEditTable/utils/tools';
|
|
|
9
9
|
export var useForm = function useForm(originForm, options) {
|
|
10
10
|
var _ref = options || {},
|
|
11
11
|
_ref$scrollToError = _ref.scrollToError,
|
|
12
|
-
scrollToError = _ref$scrollToError === void 0 ? true : _ref$scrollToError
|
|
12
|
+
scrollToError = _ref$scrollToError === void 0 ? true : _ref$scrollToError,
|
|
13
|
+
optimize = _ref.optimize;
|
|
13
14
|
var _Form$useForm = _Form.useForm(originForm),
|
|
14
15
|
_Form$useForm2 = _slicedToArray(_Form$useForm, 1),
|
|
15
16
|
form = _Form$useForm2[0];
|
|
@@ -22,7 +23,7 @@ export var useForm = function useForm(originForm, options) {
|
|
|
22
23
|
// 全部查询
|
|
23
24
|
if (nameList !== true) {
|
|
24
25
|
var values = getFieldsValue(nameList || true, filterFunc);
|
|
25
|
-
return filterInternalFields(values);
|
|
26
|
+
return filterInternalFields(values, optimize);
|
|
26
27
|
}
|
|
27
28
|
return getFieldsValue(nameList, filterFunc);
|
|
28
29
|
};
|
|
@@ -70,7 +71,7 @@ export var useForm = function useForm(originForm, options) {
|
|
|
70
71
|
// delete rest[0].recursive;
|
|
71
72
|
_context.next = 11;
|
|
72
73
|
return validateFields.apply(void 0, [validateNames].concat(rest)).then(function (values) {
|
|
73
|
-
return filterInternalFields(values);
|
|
74
|
+
return filterInternalFields(values, optimize);
|
|
74
75
|
});
|
|
75
76
|
case 11:
|
|
76
77
|
return _context.abrupt("return", _context.sent);
|
|
@@ -23,7 +23,7 @@ var _components = require("./components");
|
|
|
23
23
|
var _ProForm = _interopRequireDefault(require("../ProForm"));
|
|
24
24
|
var _empty = _interopRequireDefault(require("../assets/empty.png"));
|
|
25
25
|
var _locale = _interopRequireWildcard(require("../locale"));
|
|
26
|
-
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "originalDiffTip", "rowKey", "rowDisabled", "rowDraggable", "footerRender", "scroll", "actionDirection"];
|
|
26
|
+
var _excluded = ["value", "onChange", "onDrag", "className", "columns", "type", "mode", "stripe", "draggable", "disabled", "insertType", "emptyBtnText", "actionWidth", "actionProps", "toolbarProps", "toolbarSticky", "rowSelection", "onlyOneLineMsg", "deletePoConfirmMsg", "mulDeletePoConfirmMsg", "requiredAlign", "summary", "max", "headerRender", "pagination", "originalValues", "originalDiffTip", "rowKey", "rowDisabled", "rowDraggable", "footerRender", "scroll", "actionDirection"];
|
|
27
27
|
var ProEditTable = function ProEditTable(_ref, ref) {
|
|
28
28
|
var _resetProps$id, _resetProps$id$split, _themeConfig$data2, _value$;
|
|
29
29
|
var value = _ref.value,
|
|
@@ -41,6 +41,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
41
41
|
actionWidth = _ref.actionWidth,
|
|
42
42
|
actionProps = _ref.actionProps,
|
|
43
43
|
toolbarProps = _ref.toolbarProps,
|
|
44
|
+
toolbarSticky = _ref.toolbarSticky,
|
|
44
45
|
rowSelection = _ref.rowSelection,
|
|
45
46
|
onlyOneLineMsg = _ref.onlyOneLineMsg,
|
|
46
47
|
deletePoConfirmMsg = _ref.deletePoConfirmMsg,
|
|
@@ -62,6 +63,7 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
62
63
|
// 上下文form
|
|
63
64
|
var contentForm = _antd.Form.useFormInstance();
|
|
64
65
|
var formFieldProps = _ProForm.default.useFieldProps() || {};
|
|
66
|
+
var affixRef = (0, _react.useRef)(null);
|
|
65
67
|
var form = contentForm || (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.form) || (resetProps === null || resetProps === void 0 ? void 0 : resetProps.form);
|
|
66
68
|
var name = (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.name) || (resetProps === null || resetProps === void 0 ? void 0 : resetProps.name) || (resetProps === null || resetProps === void 0 ? void 0 : (_resetProps$id = resetProps.id) === null || _resetProps$id === void 0 ? void 0 : (_resetProps$id$split = _resetProps$id.split) === null || _resetProps$id$split === void 0 ? void 0 : _resetProps$id$split.call(_resetProps$id, '_'));
|
|
67
69
|
var _formFieldProps$isVie = formFieldProps.isView,
|
|
@@ -75,6 +77,8 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
75
77
|
disabled = (formFieldProps === null || formFieldProps === void 0 ? void 0 : formFieldProps.disabled) || disabled; // formFieldProps?.disabled可能是函数??
|
|
76
78
|
}
|
|
77
79
|
var tableRef = (0, _react.useRef)(null);
|
|
80
|
+
var valueChangeRef = (0, _react.useRef)(null);
|
|
81
|
+
valueChangeRef.current = 0;
|
|
78
82
|
var _React$useContext = _react.default.useContext(_antd.ConfigProvider.ConfigContext),
|
|
79
83
|
getPrefixCls = _React$useContext.getPrefixCls;
|
|
80
84
|
var prefixCls = getPrefixCls();
|
|
@@ -265,24 +269,13 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
265
269
|
}
|
|
266
270
|
return null;
|
|
267
271
|
};
|
|
272
|
+
(0, _ahooks.useDeepCompareEffect)(function () {
|
|
273
|
+
valueChangeRef.current += 1;
|
|
274
|
+
// 在这里根据需要计算新的数组
|
|
275
|
+
}, [value, config.name]);
|
|
268
276
|
var _columns = (0, _react.useMemo)(function () {
|
|
269
277
|
return (0, _utils.transformColumns)(columns, config);
|
|
270
|
-
}, [
|
|
271
|
-
// const setColumns = async () => {
|
|
272
|
-
// const nextColumns = transformColumns(columns, config);
|
|
273
|
-
// setState({
|
|
274
|
-
// _columns: nextColumns,
|
|
275
|
-
// });
|
|
276
|
-
// };
|
|
277
|
-
// useDebounceEffect(
|
|
278
|
-
// () => {
|
|
279
|
-
// setColumns();
|
|
280
|
-
// },
|
|
281
|
-
// [value, cellNamePath, forceUpdate, editingKeys, disabled, actionProps, columns, page], // columns更新修复外部表单无法控制内部表单的问题
|
|
282
|
-
// {
|
|
283
|
-
// wait: 60,
|
|
284
|
-
// },
|
|
285
|
-
// );
|
|
278
|
+
}, [valueChangeRef.current, disabled, forceUpdate, columns, page, actionProps, editingKeys, cellNamePath]);
|
|
286
279
|
(0, _react.useEffect)(function () {
|
|
287
280
|
var isAllHasKey = value.every(function (item) {
|
|
288
281
|
return item.rowKey;
|
|
@@ -313,6 +306,19 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
313
306
|
setInternalState: setState
|
|
314
307
|
};
|
|
315
308
|
});
|
|
309
|
+
(0, _react.useEffect)(function () {
|
|
310
|
+
if (toolbarSticky) {
|
|
311
|
+
var updatePos = function updatePos() {
|
|
312
|
+
var _affixRef$current;
|
|
313
|
+
affixRef === null || affixRef === void 0 ? void 0 : (_affixRef$current = affixRef.current) === null || _affixRef$current === void 0 ? void 0 : _affixRef$current.updatePosition();
|
|
314
|
+
};
|
|
315
|
+
window.addEventListener('scroll', updatePos, true);
|
|
316
|
+
return function () {
|
|
317
|
+
window.removeEventListener('scroll', updatePos, true);
|
|
318
|
+
};
|
|
319
|
+
}
|
|
320
|
+
}, [toolbarSticky]);
|
|
321
|
+
var _toolbarSticky = (0, _lodash.isBoolean)(toolbarSticky) ? {} : toolbarSticky;
|
|
316
322
|
var _summary = (0, _typeof2.default)(summary) === 'object' ? function (data) {
|
|
317
323
|
return (0, _jsxRuntime.jsx)(_components.Summary, {
|
|
318
324
|
data: data,
|
|
@@ -375,7 +381,14 @@ var ProEditTable = function ProEditTable(_ref, ref) {
|
|
|
375
381
|
},
|
|
376
382
|
summary: _summary
|
|
377
383
|
}))]
|
|
378
|
-
}), !isView && (value === null || value === void 0 ? void 0 : value.length) ? (0, _jsxRuntime.jsx)(
|
|
384
|
+
}), !isView && (value === null || value === void 0 ? void 0 : value.length) ? toolbarSticky ? (0, _jsxRuntime.jsx)(_antd.Affix, (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
385
|
+
ref: affixRef
|
|
386
|
+
}, _toolbarSticky), {}, {
|
|
387
|
+
children: (0, _jsxRuntime.jsx)("div", {
|
|
388
|
+
className: "pro-edit-table-toolbar".concat(pagination ? ' pro-edit-table-toolbar-fixed' : ''),
|
|
389
|
+
children: (0, _jsxRuntime.jsx)(_components.RenderToolbar, (0, _objectSpread2.default)({}, config))
|
|
390
|
+
})
|
|
391
|
+
})) : (0, _jsxRuntime.jsx)("div", {
|
|
379
392
|
className: "pro-edit-table-toolbar".concat(pagination ? ' pro-edit-table-toolbar-fixed' : ''),
|
|
380
393
|
children: (0, _jsxRuntime.jsx)(_components.RenderToolbar, (0, _objectSpread2.default)({}, config))
|
|
381
394
|
}) : null, footerRender ? (0, _jsxRuntime.jsx)("div", {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ModalFuncProps } from 'antd';
|
|
1
|
+
import { AffixProps, ModalFuncProps } from 'antd';
|
|
2
2
|
import { Key, ReactNode } from 'react';
|
|
3
3
|
import { DragEndEvent } from '@dnd-kit/core';
|
|
4
4
|
import type { ButtonProps } from 'antd/es/button';
|
|
@@ -231,6 +231,11 @@ export interface ProEditTableProps<T = any> extends Omit<TableProps<T>, 'onChang
|
|
|
231
231
|
* @default -
|
|
232
232
|
*/
|
|
233
233
|
toolbarProps?: BaseActionProps<T>[] | boolean;
|
|
234
|
+
/**
|
|
235
|
+
* @description 自定义底部操作栏跟随页面滚动
|
|
236
|
+
* @default -
|
|
237
|
+
*/
|
|
238
|
+
toolbarSticky?: boolean | Omit<AffixProps, 'children'>;
|
|
234
239
|
/**
|
|
235
240
|
* @description 最大可添加数量
|
|
236
241
|
* @default -
|
|
@@ -260,6 +260,7 @@ var transformColumns = exports.transformColumns = function transformColumns() {
|
|
|
260
260
|
var columnName = (item === null || item === void 0 ? void 0 : item.name) || dataIndex || key;
|
|
261
261
|
item.dataIndex = columnName;
|
|
262
262
|
item.key = columnName;
|
|
263
|
+
// item.shouldCellUpdate = item.shouldCellUpdate || ((record, perRecord) => !isEqual(record, perRecord));
|
|
263
264
|
var required = (0, _lodash.isBoolean)(item.required) ? item.required : false;
|
|
264
265
|
if (typeof item.required === 'function') {
|
|
265
266
|
var namePath = (0, _tools.getNamePath)(name, virtualKey);
|
package/lib/ProForm/index.js
CHANGED
|
@@ -24,7 +24,7 @@ var _index = require("./utils/index");
|
|
|
24
24
|
var _useForm3 = require("./utils/useForm");
|
|
25
25
|
var _useFieldProps = require("./utils/useFieldProps");
|
|
26
26
|
var _locale = _interopRequireDefault(require("../locale"));
|
|
27
|
-
var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalDiffTip", "formKey", "globalControl", "scrollToError"];
|
|
27
|
+
var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "originalValues", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "originalDiffTip", "formKey", "globalControl", "scrollToError", "optimize"];
|
|
28
28
|
var ProForm = function ProForm(props, ref) {
|
|
29
29
|
var _forms$formKey, _localStorage, _ref;
|
|
30
30
|
var _props$mode = props.mode,
|
|
@@ -68,6 +68,8 @@ var ProForm = function ProForm(props, ref) {
|
|
|
68
68
|
globalControl = props.globalControl,
|
|
69
69
|
_props$scrollToError = props.scrollToError,
|
|
70
70
|
scrollToError = _props$scrollToError === void 0 ? true : _props$scrollToError,
|
|
71
|
+
_props$optimize = props.optimize,
|
|
72
|
+
optimize = _props$optimize === void 0 ? false : _props$optimize,
|
|
71
73
|
otherProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
72
74
|
var _useProConfig = (0, _ProConfigProvider.useProConfig)(),
|
|
73
75
|
state = _useProConfig.state,
|
|
@@ -75,7 +77,8 @@ var ProForm = function ProForm(props, ref) {
|
|
|
75
77
|
var config = state.ProForm,
|
|
76
78
|
forms = state.forms;
|
|
77
79
|
var _useForm = (0, _useForm3.useForm)((_forms$formKey = forms[formKey]) !== null && _forms$formKey !== void 0 ? _forms$formKey : originForm, {
|
|
78
|
-
scrollToError: scrollToError
|
|
80
|
+
scrollToError: scrollToError,
|
|
81
|
+
optimize: optimize
|
|
79
82
|
}),
|
|
80
83
|
_useForm2 = (0, _slicedToArray2.default)(_useForm, 1),
|
|
81
84
|
form = _useForm2[0];
|
|
@@ -168,7 +171,7 @@ var ProForm = function ProForm(props, ref) {
|
|
|
168
171
|
// 暂时通过'-'区分组合组件字段和普通字段
|
|
169
172
|
var keys = Object.keys(changedValue);
|
|
170
173
|
if (!keys.length) {
|
|
171
|
-
onValuesChange((0, _index.filterInternalFields)(changedValue), form.getFieldsValue());
|
|
174
|
+
onValuesChange((0, _index.filterInternalFields)(changedValue, optimize), form.getFieldsValue());
|
|
172
175
|
} else {
|
|
173
176
|
var values = keys.map(function (key) {
|
|
174
177
|
if (key.includes('-')) {
|
|
@@ -180,7 +183,7 @@ var ProForm = function ProForm(props, ref) {
|
|
|
180
183
|
}
|
|
181
184
|
return {};
|
|
182
185
|
});
|
|
183
|
-
onValuesChange((0, _index.filterInternalFields)(_lodash.merge.apply(void 0, [changedValue].concat((0, _toConsumableArray2.default)(values)))), form.getFieldsValue());
|
|
186
|
+
onValuesChange((0, _index.filterInternalFields)(_lodash.merge.apply(void 0, [changedValue].concat((0, _toConsumableArray2.default)(values))), optimize), form.getFieldsValue());
|
|
184
187
|
}
|
|
185
188
|
};
|
|
186
189
|
// 包装一层兼容 names 改变
|
|
@@ -76,6 +76,10 @@ export interface ProFormProps<Values = any> extends FormProps<Values> {
|
|
|
76
76
|
required?: boolean | boolean[];
|
|
77
77
|
originalDiffTip?: boolean;
|
|
78
78
|
scrollToError?: boolean;
|
|
79
|
+
/** 性能模式,谨慎使用,默认不开启
|
|
80
|
+
* 1. 开启不过滤names的中间态值
|
|
81
|
+
*/
|
|
82
|
+
optimize?: boolean;
|
|
79
83
|
}
|
|
80
84
|
export interface Transform<T = any> {
|
|
81
85
|
normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue;
|
|
@@ -28,7 +28,7 @@ export declare const isUpperCase: (type: string, upperCase: boolean) => any;
|
|
|
28
28
|
export declare const weedOutProps: (data: Record<string, any>, keys: string[]) => {}[];
|
|
29
29
|
export declare const diffField: (prevValues: any, curValues: any, names: NamePath[]) => boolean;
|
|
30
30
|
export declare const splitNameStr: (name: string) => string[][];
|
|
31
|
-
export declare const filterInternalFields: (values: any) => any;
|
|
31
|
+
export declare const filterInternalFields: (values: any, optimize?: boolean) => any;
|
|
32
32
|
export declare const getAllNamePath: (object: Record<string, any>, currentPath?: InternalNamePath) => InternalNamePath[];
|
|
33
33
|
export declare const isNullValue: (value: any) => boolean;
|
|
34
34
|
/**
|
|
@@ -23,7 +23,6 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
|
|
|
23
23
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
24
24
|
var _react = _interopRequireWildcard(require("react"));
|
|
25
25
|
var _lodash = _interopRequireWildcard(require("lodash"));
|
|
26
|
-
var _moment = _interopRequireDefault(require("moment"));
|
|
27
26
|
var getLayout = exports.getLayout = function getLayout(params) {
|
|
28
27
|
var _params$span = params.span,
|
|
29
28
|
span = _params$span === void 0 ? 8 : _params$span,
|
|
@@ -139,26 +138,23 @@ var splitNameStr = exports.splitNameStr = function splitNameStr(name) {
|
|
|
139
138
|
});
|
|
140
139
|
};
|
|
141
140
|
// 过滤掉字段名中包含 '-' 的字段
|
|
142
|
-
var filterInternalFields = exports.filterInternalFields = function filterInternalFields(values) {
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
if ((values === null || values === void 0 ? void 0 : values._immutable) || _moment.default.isMoment(values)) {
|
|
146
|
-
return nextValues;
|
|
147
|
-
}
|
|
148
|
-
if (values instanceof File) {
|
|
149
|
-
return nextValues;
|
|
141
|
+
var filterInternalFields = exports.filterInternalFields = function filterInternalFields(values, optimize) {
|
|
142
|
+
if (optimize) {
|
|
143
|
+
return values;
|
|
150
144
|
}
|
|
145
|
+
var nextValues = values;
|
|
151
146
|
if (Array.isArray(nextValues)) {
|
|
152
147
|
return nextValues.map(function (item) {
|
|
153
148
|
return filterInternalFields(item);
|
|
154
149
|
});
|
|
155
150
|
}
|
|
156
|
-
if ((0, _lodash.
|
|
151
|
+
if ((0, _lodash.isPlainObject)(nextValues)) {
|
|
157
152
|
var result = {};
|
|
158
|
-
|
|
153
|
+
// eslint-disable-next-line guard-for-in
|
|
154
|
+
for (var key in nextValues) {
|
|
159
155
|
if (key.includes('-')) return;
|
|
160
156
|
result[key] = filterInternalFields(nextValues[key]);
|
|
161
|
-
}
|
|
157
|
+
}
|
|
162
158
|
return result;
|
|
163
159
|
}
|
|
164
160
|
return nextValues;
|
|
@@ -4,6 +4,7 @@ type ModifiedFormInstance<T> = FormInstance<T> & {
|
|
|
4
4
|
};
|
|
5
5
|
interface FormInstanceOption {
|
|
6
6
|
scrollToError?: boolean;
|
|
7
|
+
optimize?: boolean;
|
|
7
8
|
}
|
|
8
9
|
export declare const useForm: <T>(originForm: ModifiedFormInstance<T>, options?: FormInstanceOption) => [ModifiedFormInstance<T>];
|
|
9
10
|
export {};
|
|
@@ -15,7 +15,8 @@ var _tools = require("../../ProEditTable/utils/tools");
|
|
|
15
15
|
var useForm = exports.useForm = function useForm(originForm, options) {
|
|
16
16
|
var _ref = options || {},
|
|
17
17
|
_ref$scrollToError = _ref.scrollToError,
|
|
18
|
-
scrollToError = _ref$scrollToError === void 0 ? true : _ref$scrollToError
|
|
18
|
+
scrollToError = _ref$scrollToError === void 0 ? true : _ref$scrollToError,
|
|
19
|
+
optimize = _ref.optimize;
|
|
19
20
|
var _Form$useForm = _antd.Form.useForm(originForm),
|
|
20
21
|
_Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
|
|
21
22
|
form = _Form$useForm2[0];
|
|
@@ -28,7 +29,7 @@ var useForm = exports.useForm = function useForm(originForm, options) {
|
|
|
28
29
|
// 全部查询
|
|
29
30
|
if (nameList !== true) {
|
|
30
31
|
var values = getFieldsValue(nameList || true, filterFunc);
|
|
31
|
-
return (0, _index.filterInternalFields)(values);
|
|
32
|
+
return (0, _index.filterInternalFields)(values, optimize);
|
|
32
33
|
}
|
|
33
34
|
return getFieldsValue(nameList, filterFunc);
|
|
34
35
|
};
|
|
@@ -76,7 +77,7 @@ var useForm = exports.useForm = function useForm(originForm, options) {
|
|
|
76
77
|
// delete rest[0].recursive;
|
|
77
78
|
_context.next = 11;
|
|
78
79
|
return validateFields.apply(void 0, [validateNames].concat(rest)).then(function (values) {
|
|
79
|
-
return (0, _index.filterInternalFields)(values);
|
|
80
|
+
return (0, _index.filterInternalFields)(values, optimize);
|
|
80
81
|
});
|
|
81
82
|
case 11:
|
|
82
83
|
return _context.abrupt("return", _context.sent);
|