@zat-design/sisyphus-react 3.6.10 → 3.7.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 +52 -54
- package/dist/less.esm.css +52 -54
- package/es/ProEditTable/components/RenderField/ListChanged.d.ts +16 -0
- package/es/ProEditTable/components/RenderField/ListChanged.js +124 -0
- package/es/ProEditTable/components/RenderField/index.js +27 -46
- package/es/ProEditTable/style/index.less +2 -1
- package/es/ProEditTable/utils/index.d.ts +1 -1
- package/es/ProEditTable/utils/index.js +19 -13
- package/es/ProEditTable/utils/tools.d.ts +6 -0
- package/es/ProEditTable/utils/tools.js +15 -2
- package/es/ProEnum/hooks/useEnumRequest.js +3 -0
- package/es/ProEnum/utils/index.js +1 -1
- package/es/ProForm/components/combination/FormList/components/BlockFields.js +4 -2
- package/es/ProForm/components/combination/FormList/components/LineFields.js +4 -1
- package/es/ProForm/components/combination/FormList/utils.d.ts +1 -0
- package/es/ProForm/components/combination/FormList/utils.js +13 -0
- package/es/ProForm/components/combination/ProCascader/index.js +8 -14
- package/es/ProForm/components/render/Changed.d.ts +14 -0
- package/es/ProForm/components/render/Changed.js +64 -0
- package/es/ProForm/components/render/Render.js +17 -37
- package/es/ProForm/style/index.less +52 -52
- package/es/ProForm/utils/diffOriginal.d.ts +0 -1
- package/es/ProForm/utils/diffOriginal.js +4 -27
- package/es/ProForm/utils/useChanged.js +1 -2
- package/es/ProForm/utils/useListChanged.js +3 -3
- package/es/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.d.ts +3 -1
- package/es/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.js +108 -41
- package/es/ProTable/components/RcTable/components/DraggableTable/index.js +14 -1
- package/es/ProTable/index.js +6 -2
- package/es/ProTable/propsType.d.ts +22 -0
- package/es/ProTable/style/index.less +27 -32
- package/es/ProThemeTools/component/{PrdTools → ProTools}/index.d.ts +2 -2
- package/es/ProThemeTools/component/{PrdTools → ProTools}/index.js +2 -2
- package/es/ProThemeTools/component/index.d.ts +1 -2
- package/es/ProThemeTools/component/index.js +1 -2
- package/es/ProThemeTools/index.js +2 -2
- package/es/ProThemeTools/style/index.less +1 -1
- package/es/ProTreeModal/components/List.js +30 -4
- package/lib/ProEditTable/components/RenderField/ListChanged.d.ts +16 -0
- package/lib/ProEditTable/components/RenderField/ListChanged.js +129 -0
- package/lib/ProEditTable/components/RenderField/index.js +26 -41
- package/lib/ProEditTable/style/index.less +2 -1
- package/lib/ProEditTable/utils/index.d.ts +1 -1
- package/lib/ProEditTable/utils/index.js +17 -11
- package/lib/ProEditTable/utils/tools.d.ts +6 -0
- package/lib/ProEditTable/utils/tools.js +15 -1
- package/lib/ProEnum/hooks/useEnumRequest.js +3 -0
- package/lib/ProEnum/utils/index.js +1 -1
- package/lib/ProForm/components/combination/FormList/components/BlockFields.js +5 -2
- package/lib/ProForm/components/combination/FormList/components/LineFields.js +4 -1
- package/lib/ProForm/components/combination/FormList/utils.d.ts +1 -0
- package/lib/ProForm/components/combination/FormList/utils.js +15 -1
- package/lib/ProForm/components/combination/ProCascader/index.js +6 -12
- package/lib/ProForm/components/render/Changed.d.ts +14 -0
- package/lib/ProForm/components/render/Changed.js +69 -0
- package/lib/ProForm/components/render/Render.js +17 -35
- package/lib/ProForm/style/index.less +52 -52
- package/lib/ProForm/utils/diffOriginal.d.ts +0 -1
- package/lib/ProForm/utils/diffOriginal.js +3 -27
- package/lib/ProForm/utils/useChanged.js +1 -2
- package/lib/ProForm/utils/useListChanged.js +2 -2
- package/lib/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.d.ts +3 -1
- package/lib/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.js +108 -41
- package/lib/ProTable/components/RcTable/components/DraggableTable/index.js +13 -1
- package/lib/ProTable/index.js +6 -2
- package/lib/ProTable/propsType.d.ts +22 -0
- package/lib/ProTable/style/index.less +27 -32
- package/lib/ProThemeTools/component/{PrdTools → ProTools}/index.d.ts +2 -2
- package/lib/ProThemeTools/component/{PrdTools → ProTools}/index.js +2 -2
- package/lib/ProThemeTools/component/index.d.ts +1 -2
- package/lib/ProThemeTools/component/index.js +3 -3
- package/lib/ProThemeTools/index.js +1 -1
- package/lib/ProThemeTools/style/index.less +1 -1
- package/lib/ProTreeModal/components/List.js +30 -4
- package/package.json +1 -1
- /package/es/ProThemeTools/component/{PrdTools → ProTools}/style/index.less +0 -0
- /package/lib/ProThemeTools/component/{PrdTools → ProTools}/style/index.less +0 -0
|
@@ -11,7 +11,6 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
|
|
|
11
11
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
12
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
13
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
14
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
14
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
16
15
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
16
|
var _antd = require("antd");
|
|
@@ -24,10 +23,10 @@ var _index = require("../../utils/index");
|
|
|
24
23
|
var _ProConfigProvider = require("../../../ProConfigProvider");
|
|
25
24
|
var _transformNames = _interopRequireDefault(require("../../utils/transformNames"));
|
|
26
25
|
var _valueType = _interopRequireDefault(require("../../utils/valueType"));
|
|
27
|
-
var _useChanged3 = require("../../utils/useChanged");
|
|
28
26
|
var _tip = _interopRequireDefault(require("../../../assets/tip.svg"));
|
|
29
27
|
var _useRules = _interopRequireDefault(require("../../utils/useRules"));
|
|
30
28
|
var _ConfirmWrapper = _interopRequireDefault(require("./ConfirmWrapper"));
|
|
29
|
+
var _Changed = _interopRequireDefault(require("./Changed"));
|
|
31
30
|
var _excluded = ["labelWidth", "hiddenNames", "trim", "upperCase", "className", "rules", "required", "labelRequired", "tooltip"];
|
|
32
31
|
/* eslint-disable prefer-destructuring */
|
|
33
32
|
// 这个组件只管渲染, 参数的整理在外部处理
|
|
@@ -99,18 +98,6 @@ var Render = function Render(props) {
|
|
|
99
98
|
return Array.isArray(name) ? name.join('_') : name;
|
|
100
99
|
}).join('-');
|
|
101
100
|
}, [otherProps === null || otherProps === void 0 ? void 0 : otherProps.names]);
|
|
102
|
-
// 判断当前字段是否变更
|
|
103
|
-
var _useChanged = (0, _useChanged3.useChanged)({
|
|
104
|
-
name: formItemProps.name,
|
|
105
|
-
names: otherProps.names,
|
|
106
|
-
namesStr: namesStr,
|
|
107
|
-
originalValues: originalValues,
|
|
108
|
-
form: form,
|
|
109
|
-
equalWith: equalWith
|
|
110
|
-
}),
|
|
111
|
-
_useChanged2 = (0, _slicedToArray2.default)(_useChanged, 2),
|
|
112
|
-
changed = _useChanged2[0],
|
|
113
|
-
originalValue = _useChanged2[1];
|
|
114
101
|
var internalRule = (0, _useRules.default)({
|
|
115
102
|
names: otherProps.names,
|
|
116
103
|
label: otherFormItemProps.label,
|
|
@@ -182,7 +169,7 @@ var Render = function Render(props) {
|
|
|
182
169
|
var lastComponentProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, componentProps), _fieldProps), {}, {
|
|
183
170
|
disabled: lastDisabled
|
|
184
171
|
});
|
|
185
|
-
var _className = (0, _classnames.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(
|
|
172
|
+
var _className = (0, _classnames.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, className, className), 'pro-form-item-width-auto', ['Switch'].includes(type)));
|
|
186
173
|
if (formItemProps.hidden === true || _show === false) {
|
|
187
174
|
// 为了监听shouldUpdate 必须存在一个FormItem, 空Input解决 【[antd: Form.Item] `name` is only used for validate React element】
|
|
188
175
|
return (0, _jsxRuntime.jsx)(_antd.Form.Item, {
|
|
@@ -440,6 +427,20 @@ var Render = function Render(props) {
|
|
|
440
427
|
span: 24 // 默认占一行
|
|
441
428
|
});
|
|
442
429
|
}
|
|
430
|
+
if (originalValues) {
|
|
431
|
+
child = (0, _jsxRuntime.jsx)(_Changed.default, {
|
|
432
|
+
name: formItemProps.name,
|
|
433
|
+
names: otherProps.names,
|
|
434
|
+
namesStr: namesStr,
|
|
435
|
+
originalValues: originalValues,
|
|
436
|
+
form: form,
|
|
437
|
+
equalWith: equalWith,
|
|
438
|
+
originalDiffTip: originalDiffTip,
|
|
439
|
+
type: type,
|
|
440
|
+
onChange: handleChange,
|
|
441
|
+
children: child
|
|
442
|
+
});
|
|
443
|
+
}
|
|
443
444
|
var orgFormItem = (0, _jsxRuntime.jsx)(_antd.Form.Item, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, (0, _lodash.omit)(_otherFormItemProps, filterFormItemKey)), {}, {
|
|
444
445
|
// @ts-ignore
|
|
445
446
|
_internalItemRender: internalItemRender,
|
|
@@ -466,26 +467,7 @@ var Render = function Render(props) {
|
|
|
466
467
|
})
|
|
467
468
|
});
|
|
468
469
|
}
|
|
469
|
-
|
|
470
|
-
if (!originalDiffTip || ['FormList', 'ProEditTable'].includes(type)) {
|
|
471
|
-
return formItem;
|
|
472
|
-
}
|
|
473
|
-
var title = (0, _jsxRuntime.jsxs)(_antd.Space, {
|
|
474
|
-
children: ["\u521D\u59CB\u503C\uFF1A", /*#__PURE__*/_react.default.cloneElement(child, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, child), {}, {
|
|
475
|
-
isView: true,
|
|
476
|
-
value: originalValue,
|
|
477
|
-
checked: type === 'Switch' ? originalValue : undefined
|
|
478
|
-
}))]
|
|
479
|
-
});
|
|
480
|
-
return (0, _jsxRuntime.jsx)(_antd.Tooltip, {
|
|
481
|
-
title: title,
|
|
482
|
-
open: changed ? undefined : false,
|
|
483
|
-
// open={true}
|
|
484
|
-
getPopupContainer: function getPopupContainer(target) {
|
|
485
|
-
return target.parentElement;
|
|
486
|
-
},
|
|
487
|
-
children: formItem
|
|
488
|
-
});
|
|
470
|
+
return formItem;
|
|
489
471
|
};
|
|
490
472
|
var FormItem = (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
491
473
|
children: [renderItem(), (otherProps === null || otherProps === void 0 ? void 0 : (_otherProps$names2 = otherProps.names) === null || _otherProps$names2 === void 0 ? void 0 : _otherProps$names2.length) ? otherProps.names.map(function (name) {
|
|
@@ -116,58 +116,6 @@
|
|
|
116
116
|
}
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
-
// 比较原始值场景下 不同时的样式
|
|
120
|
-
&.pro-form-item-changed {
|
|
121
|
-
span.@{ant-prefix}-input-affix-wrapper,
|
|
122
|
-
.@{ant-prefix}-select .@{ant-prefix}-select-selector,
|
|
123
|
-
.@{ant-prefix}-picker,
|
|
124
|
-
.@{ant-prefix}-input-number {
|
|
125
|
-
background: @zaui-contract-bg !important;
|
|
126
|
-
|
|
127
|
-
input {
|
|
128
|
-
background: transparent;
|
|
129
|
-
}
|
|
130
|
-
.@{ant-prefix}-select-selection-placeholder {
|
|
131
|
-
z-index: 9;
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
.@{ant-prefix}-form-item-control:has(.@{ant-prefix}-switch-handle),
|
|
136
|
-
.@{ant-prefix}-form-item-control:has(.@{ant-prefix}-checkbox-wrapper-in-form-item) {
|
|
137
|
-
background: @zaui-contract-bg;
|
|
138
|
-
border-radius: 4px;
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
// 地址组件
|
|
142
|
-
.@{ant-prefix}-form-item-control-input-content {
|
|
143
|
-
// 查看模式
|
|
144
|
-
& > span {
|
|
145
|
-
border-radius: 4px;
|
|
146
|
-
padding: 5px 8px;
|
|
147
|
-
background: @zaui-contract-bg;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
& > .pro-address {
|
|
151
|
-
.@{ant-prefix}-select-selector,
|
|
152
|
-
.@{ant-prefix}-input-affix-wrapper,
|
|
153
|
-
.@{ant-prefix}-input-disabled {
|
|
154
|
-
background: @zaui-contract-bg;
|
|
155
|
-
}
|
|
156
|
-
}
|
|
157
|
-
& > .@{ant-prefix}-input-group {
|
|
158
|
-
.forever-checkbox {
|
|
159
|
-
background: @zaui-contract-bg;
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
.pro-form-view-container {
|
|
165
|
-
padding: 4px 8px;
|
|
166
|
-
background: @zaui-contract-bg;
|
|
167
|
-
border-radius: 4px;
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
|
|
171
119
|
.@{ant-prefix}-row {
|
|
172
120
|
width: 100%;
|
|
173
121
|
}
|
|
@@ -373,4 +321,56 @@
|
|
|
373
321
|
}
|
|
374
322
|
}
|
|
375
323
|
}
|
|
324
|
+
|
|
325
|
+
// 比较原始值场景下 不同时的样式
|
|
326
|
+
.pro-form-item-changed {
|
|
327
|
+
span.@{ant-prefix}-input-affix-wrapper,
|
|
328
|
+
.@{ant-prefix}-select .@{ant-prefix}-select-selector,
|
|
329
|
+
.@{ant-prefix}-picker,
|
|
330
|
+
.@{ant-prefix}-input-number {
|
|
331
|
+
background: @zaui-contract-bg !important;
|
|
332
|
+
|
|
333
|
+
input {
|
|
334
|
+
background: transparent !important;
|
|
335
|
+
}
|
|
336
|
+
.@{ant-prefix}-select-selection-placeholder {
|
|
337
|
+
z-index: 9;
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
|
|
341
|
+
.@{ant-prefix}-form-item-control:has(.@{ant-prefix}-switch-handle),
|
|
342
|
+
.@{ant-prefix}-form-item-control:has(.@{ant-prefix}-checkbox-wrapper-in-form-item) {
|
|
343
|
+
background: @zaui-contract-bg;
|
|
344
|
+
border-radius: 4px;
|
|
345
|
+
}
|
|
346
|
+
|
|
347
|
+
// 地址组件
|
|
348
|
+
.@{ant-prefix}-form-item-control-input-content {
|
|
349
|
+
// 查看模式
|
|
350
|
+
& > span {
|
|
351
|
+
border-radius: 4px;
|
|
352
|
+
padding: 5px 8px;
|
|
353
|
+
background: @zaui-contract-bg;
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
& > .pro-address {
|
|
357
|
+
.@{ant-prefix}-select-selector,
|
|
358
|
+
.@{ant-prefix}-input-affix-wrapper,
|
|
359
|
+
.@{ant-prefix}-input-disabled {
|
|
360
|
+
background: @zaui-contract-bg;
|
|
361
|
+
}
|
|
362
|
+
}
|
|
363
|
+
& > .@{ant-prefix}-input-group {
|
|
364
|
+
.forever-checkbox {
|
|
365
|
+
background: @zaui-contract-bg;
|
|
366
|
+
}
|
|
367
|
+
}
|
|
368
|
+
}
|
|
369
|
+
|
|
370
|
+
.pro-form-view-container {
|
|
371
|
+
padding: 4px 8px;
|
|
372
|
+
background: @zaui-contract-bg;
|
|
373
|
+
border-radius: 4px;
|
|
374
|
+
}
|
|
375
|
+
}
|
|
376
376
|
}
|
|
@@ -1,38 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.diffOriginal = void 0;
|
|
8
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
9
7
|
var _lodash = require("lodash");
|
|
10
8
|
var nullValue = [null, undefined, '']; // 输入框空值时可能存在的三种值 视为相等
|
|
11
|
-
/** 将解构后的name值,反向转回names,例如 formData {a:1, b:2} names ['a', 'b'] 返回 [1,2] */
|
|
12
|
-
var extractValues = function extractValues(form, pathString) {
|
|
13
|
-
var _pathString;
|
|
14
|
-
var result = [];
|
|
15
|
-
var PrefixesName = (0, _lodash.isString)(pathString) ? [] : pathString.slice(0, -1);
|
|
16
|
-
if ((0, _lodash.isString)(pathString)) {
|
|
17
|
-
pathString.split('-').forEach(function (item) {
|
|
18
|
-
result.push(form.getFieldValue([].concat((0, _toConsumableArray2.default)(PrefixesName), [item])));
|
|
19
|
-
});
|
|
20
|
-
return result;
|
|
21
|
-
}
|
|
22
|
-
(_pathString = pathString[pathString.length - 1]) === null || _pathString === void 0 ? void 0 : _pathString.split('-').forEach(function (item) {
|
|
23
|
-
result.push(form.getFieldValue([].concat((0, _toConsumableArray2.default)(PrefixesName), [item])));
|
|
24
|
-
});
|
|
25
|
-
return result;
|
|
26
|
-
};
|
|
27
9
|
var diffOriginal = exports.diffOriginal = function diffOriginal(params) {
|
|
28
|
-
var _name$join;
|
|
29
10
|
var originalValue = params.originalValue,
|
|
30
|
-
|
|
31
|
-
equalWith = params.equalWith
|
|
32
|
-
form = params.form,
|
|
33
|
-
name = params.name;
|
|
34
|
-
var isNames = Array.isArray(name) && ((_name$join = name.join(',')) === null || _name$join === void 0 ? void 0 : _name$join.includes('-')) || (name === null || name === void 0 ? void 0 : name.includes('-'));
|
|
35
|
-
var value = !isNames ? _value : extractValues(form, name);
|
|
11
|
+
value = params.value,
|
|
12
|
+
equalWith = params.equalWith;
|
|
36
13
|
// 支持传入自定义比较事件
|
|
37
14
|
if ((0, _lodash.isFunction)(equalWith)) {
|
|
38
15
|
return !equalWith(originalValue, value);
|
|
@@ -47,8 +24,7 @@ var diffOriginal = exports.diffOriginal = function diffOriginal(params) {
|
|
|
47
24
|
});
|
|
48
25
|
}
|
|
49
26
|
if (!nullValue.includes(value) || !nullValue.includes(originalValue)) {
|
|
50
|
-
|
|
51
|
-
return res;
|
|
27
|
+
return !(0, _lodash.isEqual)(value, originalValue);
|
|
52
28
|
}
|
|
53
29
|
return false;
|
|
54
30
|
};
|
|
@@ -91,8 +91,8 @@ var useListChanged = exports.useListChanged = function useListChanged(params) {
|
|
|
91
91
|
value: value,
|
|
92
92
|
originalValue: originalValue,
|
|
93
93
|
form: form,
|
|
94
|
-
equalWith: equalWith
|
|
95
|
-
name:
|
|
94
|
+
equalWith: equalWith
|
|
95
|
+
// name: isString(namesStr) ? namesStr : originalName || name,
|
|
96
96
|
});
|
|
97
97
|
return [changed, originalValue];
|
|
98
98
|
};
|
package/lib/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.d.ts
CHANGED
|
@@ -5,12 +5,14 @@ interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
|
|
|
5
5
|
disabled?: boolean;
|
|
6
6
|
}
|
|
7
7
|
export declare const Row: FC<RowProps>;
|
|
8
|
-
declare const DndWrapper: ({ draggable, value, onChange, disabled, children, rowKey }: {
|
|
8
|
+
declare const DndWrapper: ({ draggable, value, onChange, disabled, children, rowKey, onDragStartGuard, onDragEndGuard, }: {
|
|
9
9
|
draggable: any;
|
|
10
10
|
value: any;
|
|
11
11
|
onChange: any;
|
|
12
12
|
disabled: any;
|
|
13
13
|
children: any;
|
|
14
14
|
rowKey: any;
|
|
15
|
+
onDragStartGuard: any;
|
|
16
|
+
onDragEndGuard: any;
|
|
15
17
|
}) => any;
|
|
16
18
|
export default DndWrapper;
|
package/lib/ProTable/components/RcTable/components/DraggableTable/components/DndWrapper/index.js
CHANGED
|
@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = exports.Row = void 0;
|
|
8
|
+
var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
|
|
9
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
8
10
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
9
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
12
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
@@ -12,6 +14,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
12
14
|
var _core = require("@dnd-kit/core");
|
|
13
15
|
var _sortable = require("@dnd-kit/sortable");
|
|
14
16
|
var _utilities = require("@dnd-kit/utilities");
|
|
17
|
+
var _lodash = require("lodash");
|
|
15
18
|
var _index = require("./utils/index");
|
|
16
19
|
var _ProIcon = _interopRequireDefault(require("../../../../../../../ProIcon"));
|
|
17
20
|
var _excluded = ["disabled", "children"];
|
|
@@ -74,55 +77,119 @@ var DndWrapper = function DndWrapper(_ref2) {
|
|
|
74
77
|
onChange = _ref2.onChange,
|
|
75
78
|
disabled = _ref2.disabled,
|
|
76
79
|
children = _ref2.children,
|
|
77
|
-
rowKey = _ref2.rowKey
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
overParentId = overObject.parentId;
|
|
96
|
-
if (activeLevel === overLevel && activeParentId === overParentId) {
|
|
97
|
-
// 将树平铺
|
|
98
|
-
var _flatTree = (0, _index.transformTreeToArray)(transformedValue).map(function (item) {
|
|
99
|
-
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
|
|
100
|
-
children: undefined
|
|
80
|
+
rowKey = _ref2.rowKey,
|
|
81
|
+
onDragStartGuard = _ref2.onDragStartGuard,
|
|
82
|
+
onDragEndGuard = _ref2.onDragEndGuard;
|
|
83
|
+
var onDragStart = /*#__PURE__*/function () {
|
|
84
|
+
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(_ref3) {
|
|
85
|
+
var active, _transformedValue, activeObject;
|
|
86
|
+
return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
|
|
87
|
+
while (1) switch (_context.prev = _context.next) {
|
|
88
|
+
case 0:
|
|
89
|
+
active = _ref3.active;
|
|
90
|
+
if (!(onDragStartGuard && (0, _lodash.isFunction)(onDragStartGuard))) {
|
|
91
|
+
_context.next = 6;
|
|
92
|
+
break;
|
|
93
|
+
}
|
|
94
|
+
// 为数据源划分层级及parentId
|
|
95
|
+
_transformedValue = (0, _index.addLevelAndParentId)(value, rowKey);
|
|
96
|
+
activeObject = (0, _index.treeNodeFind)(_transformedValue, function (t) {
|
|
97
|
+
return t.rowKey === active.id;
|
|
101
98
|
});
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
onChange((0, _index.createTreeFromArray)(nextValue, {
|
|
111
|
-
itemKey: 'rowKey',
|
|
112
|
-
parentKey: 'parentId',
|
|
113
|
-
childrenKey: 'children'
|
|
114
|
-
}));
|
|
99
|
+
_context.next = 6;
|
|
100
|
+
return onDragStartGuard({
|
|
101
|
+
activeObject: activeObject,
|
|
102
|
+
currentDataSource: value
|
|
103
|
+
});
|
|
104
|
+
case 6:
|
|
105
|
+
case "end":
|
|
106
|
+
return _context.stop();
|
|
115
107
|
}
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
|
|
108
|
+
}, _callee);
|
|
109
|
+
}));
|
|
110
|
+
return function onDragStart(_x) {
|
|
111
|
+
return _ref4.apply(this, arguments);
|
|
112
|
+
};
|
|
113
|
+
}();
|
|
114
|
+
var onDragEnd = /*#__PURE__*/function () {
|
|
115
|
+
var _ref6 = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(_ref5) {
|
|
116
|
+
var active, over, transformedValue, activeObject, overObject, activeLevel, activeParentId, overLevel, overParentId, nextDataSource, _flatTree, activeIndex, overIndex, nextValue;
|
|
117
|
+
return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
|
|
118
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
119
|
+
case 0:
|
|
120
|
+
active = _ref5.active, over = _ref5.over;
|
|
121
|
+
// 为数据源划分层级及parentId
|
|
122
|
+
transformedValue = (0, _index.addLevelAndParentId)(value, rowKey); // 同一level层级的且parentId相同的,可以互相之间拖拽替换
|
|
123
|
+
if (!(active.id !== (over === null || over === void 0 ? void 0 : over.id))) {
|
|
124
|
+
_context2.next = 15;
|
|
125
|
+
break;
|
|
126
|
+
}
|
|
127
|
+
activeObject = (0, _index.treeNodeFind)(transformedValue, function (t) {
|
|
128
|
+
return t.rowKey === active.id;
|
|
129
|
+
});
|
|
130
|
+
overObject = (0, _index.treeNodeFind)(transformedValue, function (t) {
|
|
131
|
+
return t.rowKey === (over === null || over === void 0 ? void 0 : over.id);
|
|
132
|
+
});
|
|
133
|
+
if (!(activeObject && overObject)) {
|
|
134
|
+
_context2.next = 15;
|
|
135
|
+
break;
|
|
136
|
+
}
|
|
137
|
+
activeLevel = activeObject.level, activeParentId = activeObject.parentId;
|
|
138
|
+
overLevel = overObject.level, overParentId = overObject.parentId; // 如果传了onDragEndGuard 则视为外部业务逻辑自处理
|
|
139
|
+
if (!(onDragEndGuard && (0, _lodash.isFunction)(onDragEndGuard))) {
|
|
140
|
+
_context2.next = 14;
|
|
141
|
+
break;
|
|
142
|
+
}
|
|
143
|
+
_context2.next = 11;
|
|
144
|
+
return onDragEndGuard({
|
|
145
|
+
activeObject: activeObject,
|
|
146
|
+
overObject: overObject,
|
|
147
|
+
currentDataSource: value
|
|
148
|
+
});
|
|
149
|
+
case 11:
|
|
150
|
+
nextDataSource = _context2.sent;
|
|
151
|
+
onChange(nextDataSource !== null && nextDataSource !== void 0 ? nextDataSource : []);
|
|
152
|
+
return _context2.abrupt("return");
|
|
153
|
+
case 14:
|
|
154
|
+
if (activeLevel === overLevel && activeParentId === overParentId) {
|
|
155
|
+
// 将树平铺
|
|
156
|
+
_flatTree = (0, _index.transformTreeToArray)(transformedValue).map(function (item) {
|
|
157
|
+
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
|
|
158
|
+
children: undefined
|
|
159
|
+
});
|
|
160
|
+
});
|
|
161
|
+
activeIndex = _flatTree.findIndex(function (i) {
|
|
162
|
+
return i.rowKey === active.id;
|
|
163
|
+
});
|
|
164
|
+
overIndex = _flatTree.findIndex(function (i) {
|
|
165
|
+
return i.rowKey === (over === null || over === void 0 ? void 0 : over.id);
|
|
166
|
+
});
|
|
167
|
+
nextValue = (0, _sortable.arrayMove)(_flatTree, activeIndex, overIndex);
|
|
168
|
+
onChange((0, _index.createTreeFromArray)(nextValue, {
|
|
169
|
+
itemKey: 'rowKey',
|
|
170
|
+
parentKey: 'parentId',
|
|
171
|
+
childrenKey: 'children'
|
|
172
|
+
}));
|
|
173
|
+
}
|
|
174
|
+
case 15:
|
|
175
|
+
case "end":
|
|
176
|
+
return _context2.stop();
|
|
177
|
+
}
|
|
178
|
+
}, _callee2);
|
|
179
|
+
}));
|
|
180
|
+
return function onDragEnd(_x2) {
|
|
181
|
+
return _ref6.apply(this, arguments);
|
|
182
|
+
};
|
|
183
|
+
}();
|
|
184
|
+
var transformedValue = (0, _index.addLevelAndParentId)(value, rowKey);
|
|
119
185
|
// 将树平铺
|
|
120
|
-
var flatTree = (0, _index.transformTreeToArray)(
|
|
186
|
+
var flatTree = (0, _index.transformTreeToArray)(transformedValue).map(function (item) {
|
|
121
187
|
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
|
|
122
188
|
children: undefined
|
|
123
189
|
});
|
|
124
190
|
});
|
|
125
191
|
return draggable && !disabled ? (0, _jsxRuntime.jsx)(_core.DndContext, {
|
|
192
|
+
onDragStart: onDragStart,
|
|
126
193
|
onDragEnd: onDragEnd,
|
|
127
194
|
collisionDetection: _core.closestCorners,
|
|
128
195
|
children: (0, _jsxRuntime.jsx)(_sortable.SortableContext, {
|
|
@@ -15,6 +15,14 @@ var _DndWrapper = _interopRequireWildcard(require("./components/DndWrapper"));
|
|
|
15
15
|
var _index = require("../../../index");
|
|
16
16
|
require("../../../../style/index.less");
|
|
17
17
|
var _excluded = ["dataSource", "tableProps", "draggableProps", "summaryProps", "emptyTextProps"];
|
|
18
|
+
/*
|
|
19
|
+
* @Author: za-xuwenli xuwenli@zhongan.io
|
|
20
|
+
* @Date: 2024-08-09 13:48:59
|
|
21
|
+
* @LastEditors: za-xuwenli xuwenli@zhongan.io
|
|
22
|
+
* @LastEditTime: 2024-08-20 19:31:24
|
|
23
|
+
* @FilePath: /za-material-warehouse/src/ProTable/components/RcTable/components/DraggableTable/index.tsx
|
|
24
|
+
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
25
|
+
*/
|
|
18
26
|
var DraggableTable = function DraggableTable(_ref) {
|
|
19
27
|
var dataSource = _ref.dataSource,
|
|
20
28
|
tableProps = _ref.tableProps,
|
|
@@ -28,13 +36,17 @@ var DraggableTable = function DraggableTable(_ref) {
|
|
|
28
36
|
disabled = tableProps.disabled;
|
|
29
37
|
var onChange = draggableProps.onChange,
|
|
30
38
|
draggable = draggableProps.draggable,
|
|
31
|
-
rowKey = draggableProps.rowKey
|
|
39
|
+
rowKey = draggableProps.rowKey,
|
|
40
|
+
onDragStartGuard = draggableProps.onDragStartGuard,
|
|
41
|
+
onDragEndGuard = draggableProps.onDragEndGuard;
|
|
32
42
|
return (0, _jsxRuntime.jsx)(_DndWrapper.default, {
|
|
33
43
|
value: dataSource !== null && dataSource !== void 0 ? dataSource : [],
|
|
34
44
|
onChange: onChange,
|
|
35
45
|
disabled: disabled,
|
|
36
46
|
draggable: draggable,
|
|
37
47
|
rowKey: rowKey,
|
|
48
|
+
onDragStartGuard: onDragStartGuard,
|
|
49
|
+
onDragEndGuard: onDragEndGuard,
|
|
38
50
|
children: (0, _jsxRuntime.jsx)(_antd.Table, (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
39
51
|
className: "pro-edit-table-drag",
|
|
40
52
|
components: {
|
package/lib/ProTable/index.js
CHANGED
|
@@ -27,7 +27,7 @@ var _reset = _interopRequireDefault(require("../assets/reset.svg"));
|
|
|
27
27
|
var _customColumn = _interopRequireDefault(require("../assets/customColumn.svg"));
|
|
28
28
|
var _utils = require("./utils");
|
|
29
29
|
var _locale = _interopRequireDefault(require("../locale"));
|
|
30
|
-
var _excluded = ["tableId", "headerRender", "footerRender", "quickConfig", "stripe", "columns", "className", "draggable", "disabled", "isView", "rowDisabled", "summary", "emptyText", "originalDataSource"],
|
|
30
|
+
var _excluded = ["tableId", "headerRender", "footerRender", "quickConfig", "stripe", "columns", "className", "draggable", "disabled", "isView", "rowDisabled", "summary", "emptyText", "originalDataSource", "onDragStart", "onDragEnd"],
|
|
31
31
|
_excluded2 = ["resizeColumn", "columnConfig", "cacheTime", "storage"];
|
|
32
32
|
var defaultCacheTime = 1; // columns 配置保存时间为一天
|
|
33
33
|
// 全局上下文
|
|
@@ -60,6 +60,8 @@ function ProTable(props) {
|
|
|
60
60
|
_props$emptyText = props.emptyText,
|
|
61
61
|
emptyText = _props$emptyText === void 0 ? _locale.default === null || _locale.default === void 0 ? void 0 : (_locale$ProTable = _locale.default.ProTable) === null || _locale$ProTable === void 0 ? void 0 : _locale$ProTable.noData : _props$emptyText,
|
|
62
62
|
originalDataSource = props.originalDataSource,
|
|
63
|
+
onDragStartGuard = props.onDragStart,
|
|
64
|
+
onDragEndGuard = props.onDragEnd,
|
|
63
65
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
64
66
|
var quickTableConfig = quickConfig ? (0, _objectSpread4.default)({
|
|
65
67
|
columnConfig: true,
|
|
@@ -359,7 +361,9 @@ function ProTable(props) {
|
|
|
359
361
|
draggableProps: {
|
|
360
362
|
onChange: onDataSourceChange,
|
|
361
363
|
draggable: draggable,
|
|
362
|
-
rowKey: rowKey
|
|
364
|
+
rowKey: rowKey,
|
|
365
|
+
onDragStartGuard: onDragStartGuard,
|
|
366
|
+
onDragEndGuard: onDragEndGuard
|
|
363
367
|
},
|
|
364
368
|
tableProps: {
|
|
365
369
|
value: _dataSource,
|
|
@@ -41,6 +41,23 @@ export interface ProTableColumn extends Omit<ColumnType<any>, 'dataIndex'> {
|
|
|
41
41
|
toolTipProps?: TooltipProps & React.RefAttributes<unknown>;
|
|
42
42
|
transform?: (value: any, record?: any) => string[];
|
|
43
43
|
}
|
|
44
|
+
export interface CreateTreeFromArrayOptions {
|
|
45
|
+
itemKey?: string;
|
|
46
|
+
parentKey?: string;
|
|
47
|
+
childrenKey?: string;
|
|
48
|
+
}
|
|
49
|
+
export interface DragCommonGuardProps<T> {
|
|
50
|
+
event: T;
|
|
51
|
+
}
|
|
52
|
+
export interface DragEndGuardProps {
|
|
53
|
+
activeObject: any;
|
|
54
|
+
overObject?: any;
|
|
55
|
+
currentDataSource: any[];
|
|
56
|
+
}
|
|
57
|
+
export interface DragStartGuardProps {
|
|
58
|
+
activeObject: any;
|
|
59
|
+
currentDataSource: any[];
|
|
60
|
+
}
|
|
44
61
|
export interface ProTableProps<T = any> extends Omit<TableProps<any>, 'summary' | 'columns'> {
|
|
45
62
|
tableId?: string;
|
|
46
63
|
rowKey?: string | GetRowKey<any>;
|
|
@@ -67,6 +84,11 @@ export interface ProTableProps<T = any> extends Omit<TableProps<any>, 'summary'
|
|
|
67
84
|
stripe?: boolean;
|
|
68
85
|
columns: ProTableColumn[];
|
|
69
86
|
originalDataSource?: any[];
|
|
87
|
+
/**
|
|
88
|
+
* 拖拽额外配置
|
|
89
|
+
*/
|
|
90
|
+
onDragStart?: DragStartGuardProps;
|
|
91
|
+
onDragEnd?: DragEndGuardProps;
|
|
70
92
|
}
|
|
71
93
|
export type ProTableValueType = 'percentage' | 'permillage' | 'thousandth' | 'datePicker' | 'enumName' | 'enumCodeName' | 'address' | 'thousandthCNY' | 'date' | 'dateTime' | 'dateStartTime' | 'dateEndTime' | 'dateStartEndTime';
|
|
72
94
|
export interface Response<T = any> {
|