@zat-design/sisyphus-react 3.13.21 → 3.13.22-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/ProForm/components/combination/FormList/components/ActionButton.d.ts +1 -0
- package/es/ProForm/components/combination/FormList/components/ActionButton.js +84 -3
- package/es/ProForm/components/combination/FormList/components/BlockFields.d.ts +2 -0
- package/es/ProForm/components/combination/FormList/components/BlockFields.js +63 -6
- package/es/ProForm/components/combination/FormList/components/Empty.js +2 -1
- package/es/ProForm/components/combination/FormList/components/LineFields.d.ts +1 -0
- package/es/ProForm/components/combination/FormList/components/LineFields.js +4 -2
- package/es/ProForm/components/combination/FormList/components/ToolbarButton.js +38 -9
- package/es/ProForm/components/combination/FormList/index.js +64 -55
- package/es/ProForm/components/combination/FormList/propsType.d.ts +7 -2
- package/es/ProForm/components/combination/FormList/style/index.less +41 -0
- package/es/ProLayout/components/ProHeader/index.js +19 -15
- package/lib/ProForm/components/combination/FormList/components/ActionButton.d.ts +1 -0
- package/lib/ProForm/components/combination/FormList/components/ActionButton.js +84 -3
- package/lib/ProForm/components/combination/FormList/components/BlockFields.d.ts +2 -0
- package/lib/ProForm/components/combination/FormList/components/BlockFields.js +62 -6
- package/lib/ProForm/components/combination/FormList/components/Empty.js +2 -1
- package/lib/ProForm/components/combination/FormList/components/LineFields.d.ts +1 -0
- package/lib/ProForm/components/combination/FormList/components/LineFields.js +4 -2
- package/lib/ProForm/components/combination/FormList/components/ToolbarButton.js +38 -9
- package/lib/ProForm/components/combination/FormList/index.js +64 -55
- package/lib/ProForm/components/combination/FormList/propsType.d.ts +7 -2
- package/lib/ProForm/components/combination/FormList/style/index.less +41 -0
- package/lib/ProLayout/components/ProHeader/index.js +19 -15
- package/package.json +5 -2
|
@@ -117,7 +117,8 @@ var ActionButton = props => {
|
|
|
117
117
|
min = props.min,
|
|
118
118
|
max = props.max,
|
|
119
119
|
mode = props.mode,
|
|
120
|
-
isView = props.isView
|
|
120
|
+
isView = props.isView,
|
|
121
|
+
hideStartEndActionProps = props.hideStartEndActionProps;
|
|
121
122
|
|
|
122
123
|
// 默认显示一个delete
|
|
123
124
|
var actionProps = useMemo(() => {
|
|
@@ -185,6 +186,10 @@ var ActionButton = props => {
|
|
|
185
186
|
});
|
|
186
187
|
};
|
|
187
188
|
var defaultActions = useMemo(() => getDefaultActions(mode), [mode]);
|
|
189
|
+
|
|
190
|
+
// 整体隐藏首尾 ActionButton
|
|
191
|
+
if (hideStartEndActionProps !== null && hideStartEndActionProps !== void 0 && hideStartEndActionProps[0] && index === 0) return null;
|
|
192
|
+
if (hideStartEndActionProps !== null && hideStartEndActionProps !== void 0 && hideStartEndActionProps[1] && index === fields.length - 1) return null;
|
|
188
193
|
return /*#__PURE__*/_jsx(_Space, {
|
|
189
194
|
align: "start",
|
|
190
195
|
className: "pro-form-list-action",
|
|
@@ -233,11 +238,83 @@ var ActionButton = props => {
|
|
|
233
238
|
if (index + 1 === fields.length && type === 'moveDown') {
|
|
234
239
|
return false;
|
|
235
240
|
}
|
|
241
|
+
|
|
242
|
+
// 移动限制:防止将项移动到隐藏的首尾位置
|
|
243
|
+
if (hideStartEndActionProps !== null && hideStartEndActionProps !== void 0 && hideStartEndActionProps[0] && index === 1 && ['moveUp'].includes(type)) {
|
|
244
|
+
return false;
|
|
245
|
+
}
|
|
246
|
+
if (hideStartEndActionProps !== null && hideStartEndActionProps !== void 0 && hideStartEndActionProps[1] && index === fields.length - 2 && type === 'moveDown') {
|
|
247
|
+
return false;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
// 处理 add 操作的插入位置
|
|
251
|
+
var handleAddClick = /*#__PURE__*/function () {
|
|
252
|
+
var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
|
|
253
|
+
var value, data, insertIndex, _insertIndex;
|
|
254
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
255
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
256
|
+
case 0:
|
|
257
|
+
value = form.getFieldValue(namePath);
|
|
258
|
+
_context2.next = 3;
|
|
259
|
+
return _onClick === null || _onClick === void 0 ? void 0 : _onClick(value, {
|
|
260
|
+
namePath,
|
|
261
|
+
index,
|
|
262
|
+
operation,
|
|
263
|
+
form
|
|
264
|
+
});
|
|
265
|
+
case 3:
|
|
266
|
+
data = _context2.sent;
|
|
267
|
+
if (!(!_onClick || data === true)) {
|
|
268
|
+
_context2.next = 7;
|
|
269
|
+
break;
|
|
270
|
+
}
|
|
271
|
+
// 如果有 addIndex 配置,使用它计算插入位置
|
|
272
|
+
if (item.addIndex) {
|
|
273
|
+
insertIndex = typeof item.addIndex === 'function' ? item.addIndex(value, {
|
|
274
|
+
index,
|
|
275
|
+
namePath,
|
|
276
|
+
form,
|
|
277
|
+
operation
|
|
278
|
+
}) : item.addIndex;
|
|
279
|
+
operation.add(data, insertIndex);
|
|
280
|
+
} else {
|
|
281
|
+
operation.add(data, index + 1); // 默认插入到下一位置
|
|
282
|
+
}
|
|
283
|
+
return _context2.abrupt("return");
|
|
284
|
+
case 7:
|
|
285
|
+
if ((item === null || item === void 0 ? void 0 : item.type) === 'add') {
|
|
286
|
+
// 如果有 addIndex 配置,使用它计算插入位置
|
|
287
|
+
if (item.addIndex) {
|
|
288
|
+
_insertIndex = typeof item.addIndex === 'function' ? item.addIndex(value, {
|
|
289
|
+
index,
|
|
290
|
+
namePath,
|
|
291
|
+
form,
|
|
292
|
+
operation
|
|
293
|
+
}) : item.addIndex;
|
|
294
|
+
operation.add(data, _insertIndex);
|
|
295
|
+
} else {
|
|
296
|
+
operation.add(data, index + 1); // 默认插入到下一位置
|
|
297
|
+
}
|
|
298
|
+
}
|
|
299
|
+
case 8:
|
|
300
|
+
case "end":
|
|
301
|
+
return _context2.stop();
|
|
302
|
+
}
|
|
303
|
+
}, _callee2);
|
|
304
|
+
}));
|
|
305
|
+
return function handleAddClick() {
|
|
306
|
+
return _ref7.apply(this, arguments);
|
|
307
|
+
};
|
|
308
|
+
}();
|
|
236
309
|
return _needConfirm ? /*#__PURE__*/_jsx(_Popconfirm, _objectSpread(_objectSpread({
|
|
237
310
|
title: title !== null && title !== void 0 ? title : `${locale.ProForm.formListConfirmMessage}`,
|
|
238
311
|
onCancel: e => e.stopPropagation(),
|
|
239
312
|
onConfirm: e => {
|
|
240
|
-
|
|
313
|
+
if (type === 'add') {
|
|
314
|
+
handleAddClick();
|
|
315
|
+
} else {
|
|
316
|
+
handleClick(internalOnClick, _onClick, index, item);
|
|
317
|
+
}
|
|
241
318
|
}
|
|
242
319
|
}, _confirmProps), {}, {
|
|
243
320
|
children: /*#__PURE__*/_jsx(_Button, _objectSpread(_objectSpread(_objectSpread({}, defaultRest), omit(rest, filterKeys)), {}, {
|
|
@@ -249,7 +326,11 @@ var ActionButton = props => {
|
|
|
249
326
|
type: "text",
|
|
250
327
|
onClick: e => {
|
|
251
328
|
e.stopPropagation();
|
|
252
|
-
|
|
329
|
+
if (type === 'add') {
|
|
330
|
+
handleAddClick();
|
|
331
|
+
} else {
|
|
332
|
+
handleClick(internalOnClick, _onClick, index, item);
|
|
333
|
+
}
|
|
253
334
|
},
|
|
254
335
|
children: label || defaultLabel
|
|
255
336
|
}), `${item === null || item === void 0 ? void 0 : item.type}${index}`);
|
|
@@ -16,6 +16,8 @@ interface Props extends Omit<FormListType, 'toolbarProps'> {
|
|
|
16
16
|
level?: levelType;
|
|
17
17
|
towCollapse?: boolean;
|
|
18
18
|
diffConfig?: DiffConfigType;
|
|
19
|
+
hideStartEndActionProps?: [boolean, boolean];
|
|
20
|
+
titlePosition?: 'top' | 'left';
|
|
19
21
|
}
|
|
20
22
|
declare const BlockFields: React.FC<Props>;
|
|
21
23
|
export default BlockFields;
|
|
@@ -10,6 +10,7 @@ import RenderFields from "../../../render/RenderFields";
|
|
|
10
10
|
import ProCollapse from "../../../../../ProLayout/components/ProCollapse";
|
|
11
11
|
import { memoWith } from "../utils";
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
14
|
var MemoRenderFields = /*#__PURE__*/React.memo(RenderFields, memoWith);
|
|
14
15
|
var BlockFields = props => {
|
|
15
16
|
var title = props.title,
|
|
@@ -31,7 +32,9 @@ var BlockFields = props => {
|
|
|
31
32
|
level = _props$level === void 0 ? '2' : _props$level,
|
|
32
33
|
towCollapse = props.towCollapse,
|
|
33
34
|
id = props.id,
|
|
34
|
-
diffConfig = props.diffConfig
|
|
35
|
+
diffConfig = props.diffConfig,
|
|
36
|
+
hideStartEndActionProps = props.hideStartEndActionProps,
|
|
37
|
+
titlePosition = props.titlePosition;
|
|
35
38
|
var _title = useMemo(() => {
|
|
36
39
|
if (isFunction(title)) {
|
|
37
40
|
var record = form.getFieldValue(namePath);
|
|
@@ -40,8 +43,63 @@ var BlockFields = props => {
|
|
|
40
43
|
return title;
|
|
41
44
|
}, [title, index]);
|
|
42
45
|
var cls = classNames({
|
|
43
|
-
[`pro-form-list-mode-${mode}`]: mode === 'block' || mode === 'line' || mode === 'less'
|
|
46
|
+
[`pro-form-list-mode-${mode}`]: mode === 'block' || mode === 'line' || mode === 'less',
|
|
47
|
+
'pro-form-list-title-left': titlePosition === 'left'
|
|
44
48
|
});
|
|
49
|
+
|
|
50
|
+
// 左侧标题布局
|
|
51
|
+
if (titlePosition === 'left') {
|
|
52
|
+
return /*#__PURE__*/_jsx(_Space, {
|
|
53
|
+
direction: "vertical",
|
|
54
|
+
className: cls,
|
|
55
|
+
id: id,
|
|
56
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
57
|
+
className: "pro-form-list-left-title-wrapper",
|
|
58
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
59
|
+
className: "pro-form-list-left-title",
|
|
60
|
+
children: _title
|
|
61
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
62
|
+
className: "pro-form-list-left-content",
|
|
63
|
+
children: /*#__PURE__*/_jsx(ProCollapse, {
|
|
64
|
+
title: _title,
|
|
65
|
+
index: index,
|
|
66
|
+
form: form,
|
|
67
|
+
level: level,
|
|
68
|
+
towCollapse: towCollapse,
|
|
69
|
+
extra: actionProps !== false && /*#__PURE__*/_jsx(ActionButton, {
|
|
70
|
+
min: min,
|
|
71
|
+
max: max,
|
|
72
|
+
index: index,
|
|
73
|
+
length: fields.length,
|
|
74
|
+
operation: operation,
|
|
75
|
+
namePath: namePath,
|
|
76
|
+
form: form,
|
|
77
|
+
field: field,
|
|
78
|
+
fields: fields,
|
|
79
|
+
actionProps: actionProps,
|
|
80
|
+
mode: mode,
|
|
81
|
+
disabled: disabled,
|
|
82
|
+
isView: isView,
|
|
83
|
+
hideStartEndActionProps: hideStartEndActionProps
|
|
84
|
+
}),
|
|
85
|
+
children: /*#__PURE__*/_jsx(_Row, {
|
|
86
|
+
gutter: 24,
|
|
87
|
+
children: /*#__PURE__*/_jsx(MemoRenderFields, {
|
|
88
|
+
columns: columns,
|
|
89
|
+
form: form,
|
|
90
|
+
colProps: colProps,
|
|
91
|
+
disabled: disabled,
|
|
92
|
+
isView: isView,
|
|
93
|
+
diffConfig: diffConfig
|
|
94
|
+
})
|
|
95
|
+
}, field.key)
|
|
96
|
+
})
|
|
97
|
+
})]
|
|
98
|
+
})
|
|
99
|
+
});
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
// 默认顶部标题布局
|
|
45
103
|
return /*#__PURE__*/_jsx(_Space, {
|
|
46
104
|
direction: "vertical",
|
|
47
105
|
className: cls,
|
|
@@ -49,9 +107,7 @@ var BlockFields = props => {
|
|
|
49
107
|
children: /*#__PURE__*/_jsx(ProCollapse, {
|
|
50
108
|
title: _title,
|
|
51
109
|
index: index,
|
|
52
|
-
form: form
|
|
53
|
-
// namePath={namePath}
|
|
54
|
-
,
|
|
110
|
+
form: form,
|
|
55
111
|
level: level,
|
|
56
112
|
towCollapse: towCollapse,
|
|
57
113
|
extra: actionProps !== false && /*#__PURE__*/_jsx(ActionButton, {
|
|
@@ -67,7 +123,8 @@ var BlockFields = props => {
|
|
|
67
123
|
actionProps: actionProps,
|
|
68
124
|
mode: mode,
|
|
69
125
|
disabled: disabled,
|
|
70
|
-
isView: isView
|
|
126
|
+
isView: isView,
|
|
127
|
+
hideStartEndActionProps: hideStartEndActionProps
|
|
71
128
|
}),
|
|
72
129
|
children: /*#__PURE__*/_jsx(_Row, {
|
|
73
130
|
gutter: 24,
|
|
@@ -35,7 +35,8 @@ var Empty = _ref => {
|
|
|
35
35
|
return addConfig === null || addConfig === void 0 || (_addConfig$onClick = addConfig.onClick) === null || _addConfig$onClick === void 0 ? void 0 : _addConfig$onClick.call(addConfig, value, {
|
|
36
36
|
operation,
|
|
37
37
|
form,
|
|
38
|
-
namePath
|
|
38
|
+
namePath,
|
|
39
|
+
index: 0
|
|
39
40
|
});
|
|
40
41
|
case 5:
|
|
41
42
|
data = _context.sent;
|
|
@@ -30,7 +30,8 @@ var LineFields = props => {
|
|
|
30
30
|
draggable = props.draggable,
|
|
31
31
|
className = props.className,
|
|
32
32
|
id = props.id,
|
|
33
|
-
diffConfig = props.diffConfig
|
|
33
|
+
diffConfig = props.diffConfig,
|
|
34
|
+
hideStartEndActionProps = props.hideStartEndActionProps;
|
|
34
35
|
var isLess = mode === 'less';
|
|
35
36
|
var _useSortable = useSortable({
|
|
36
37
|
id: field.key,
|
|
@@ -88,7 +89,8 @@ var LineFields = props => {
|
|
|
88
89
|
fields: fields,
|
|
89
90
|
actionProps: actionProps,
|
|
90
91
|
mode: mode,
|
|
91
|
-
disabled: disabled
|
|
92
|
+
disabled: disabled,
|
|
93
|
+
hideStartEndActionProps: hideStartEndActionProps
|
|
92
94
|
})]
|
|
93
95
|
});
|
|
94
96
|
};
|
|
@@ -58,7 +58,7 @@ var ToolbarButton = props => {
|
|
|
58
58
|
}, [props.toolbarProps]);
|
|
59
59
|
var handleClick = /*#__PURE__*/function () {
|
|
60
60
|
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(defaultCallback, callback, item) {
|
|
61
|
-
var value, data;
|
|
61
|
+
var value, data, insertIndex, _insertIndex;
|
|
62
62
|
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
63
63
|
while (1) switch (_context.prev = _context.next) {
|
|
64
64
|
case 0:
|
|
@@ -67,7 +67,8 @@ var ToolbarButton = props => {
|
|
|
67
67
|
return callback === null || callback === void 0 ? void 0 : callback(value, {
|
|
68
68
|
operation,
|
|
69
69
|
form,
|
|
70
|
-
namePath
|
|
70
|
+
namePath,
|
|
71
|
+
index: (value === null || value === void 0 ? void 0 : value.length) || 0
|
|
71
72
|
});
|
|
72
73
|
case 3:
|
|
73
74
|
data = _context.sent;
|
|
@@ -75,15 +76,42 @@ var ToolbarButton = props => {
|
|
|
75
76
|
_context.next = 7;
|
|
76
77
|
break;
|
|
77
78
|
}
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
79
|
+
if ((item === null || item === void 0 ? void 0 : item.type) === 'add') {
|
|
80
|
+
// 如果有 addIndex 配置,使用它计算插入位置
|
|
81
|
+
if (item.addIndex) {
|
|
82
|
+
insertIndex = typeof item.addIndex === 'function' ? item.addIndex(value, {
|
|
83
|
+
namePath,
|
|
84
|
+
form,
|
|
85
|
+
operation,
|
|
86
|
+
index: (value === null || value === void 0 ? void 0 : value.length) || 0
|
|
87
|
+
}) : item.addIndex;
|
|
88
|
+
operation.add(data, insertIndex);
|
|
89
|
+
} else {
|
|
90
|
+
operation.add(data); // 默认插入到末尾
|
|
91
|
+
}
|
|
92
|
+
} else {
|
|
93
|
+
defaultCallback === null || defaultCallback === void 0 || defaultCallback(value, {
|
|
94
|
+
operation,
|
|
95
|
+
form,
|
|
96
|
+
namePath,
|
|
97
|
+
index: (value === null || value === void 0 ? void 0 : value.length) || 0
|
|
98
|
+
});
|
|
99
|
+
}
|
|
83
100
|
return _context.abrupt("return");
|
|
84
101
|
case 7:
|
|
85
102
|
if ((item === null || item === void 0 ? void 0 : item.type) === 'add' && data) {
|
|
86
|
-
|
|
103
|
+
// 如果有 addIndex 配置,使用它计算插入位置
|
|
104
|
+
if (item.addIndex) {
|
|
105
|
+
_insertIndex = typeof item.addIndex === 'function' ? item.addIndex(value, {
|
|
106
|
+
namePath,
|
|
107
|
+
form,
|
|
108
|
+
operation,
|
|
109
|
+
index: (value === null || value === void 0 ? void 0 : value.length) || 0
|
|
110
|
+
}) : item.addIndex;
|
|
111
|
+
operation.add(data, _insertIndex);
|
|
112
|
+
} else {
|
|
113
|
+
operation.add(data); // 默认插入到末尾
|
|
114
|
+
}
|
|
87
115
|
}
|
|
88
116
|
case 8:
|
|
89
117
|
case "end":
|
|
@@ -100,7 +128,8 @@ var ToolbarButton = props => {
|
|
|
100
128
|
callback === null || callback === void 0 || callback(value, {
|
|
101
129
|
operation,
|
|
102
130
|
form,
|
|
103
|
-
namePath
|
|
131
|
+
namePath,
|
|
132
|
+
index: 0
|
|
104
133
|
});
|
|
105
134
|
};
|
|
106
135
|
return /*#__PURE__*/_jsx(_Space, {
|
|
@@ -28,7 +28,10 @@ var FormList = (props, ref) => {
|
|
|
28
28
|
_props$span = props.span,
|
|
29
29
|
span = _props$span === void 0 ? 8 : _props$span,
|
|
30
30
|
disabled = props.disabled,
|
|
31
|
-
emptyBtnText = props.emptyBtnText
|
|
31
|
+
emptyBtnText = props.emptyBtnText,
|
|
32
|
+
hideStartEndActionProps = props.hideStartEndActionProps,
|
|
33
|
+
titlePosition = props.titlePosition,
|
|
34
|
+
className = props.className;
|
|
32
35
|
var _fields = fields.map(item => _objectSpread(_objectSpread({}, item), {}, {
|
|
33
36
|
key: String(item.key)
|
|
34
37
|
}));
|
|
@@ -81,65 +84,71 @@ var FormList = (props, ref) => {
|
|
|
81
84
|
props.operation.move(activeIndex, overIndex);
|
|
82
85
|
}
|
|
83
86
|
};
|
|
84
|
-
return /*#__PURE__*/_jsx(
|
|
85
|
-
|
|
86
|
-
children: /*#__PURE__*/
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
87
|
+
return /*#__PURE__*/_jsx("div", {
|
|
88
|
+
className: className,
|
|
89
|
+
children: /*#__PURE__*/_jsx(DndContext, {
|
|
90
|
+
onDragEnd: handleDragEnd,
|
|
91
|
+
children: /*#__PURE__*/_jsxs(SortableContext, {
|
|
92
|
+
items: _fields.map(item => ({
|
|
93
|
+
id: item.key
|
|
94
|
+
})),
|
|
95
|
+
strategy: verticalListSortingStrategy,
|
|
96
|
+
children: [_fields.map((field, index) => {
|
|
97
|
+
var namePath = [..._namePath, field.name];
|
|
98
|
+
var _columns = processColumns(index, namePath);
|
|
99
|
+
return mode === 'block' ? /*#__PURE__*/_jsx(BlockFields, _objectSpread(_objectSpread({}, props), {}, {
|
|
100
|
+
columns: _columns,
|
|
101
|
+
disabled: disabled,
|
|
102
|
+
isView: isView,
|
|
103
|
+
namePath: namePath,
|
|
104
|
+
index: index,
|
|
105
|
+
field: field,
|
|
106
|
+
colProps: {
|
|
107
|
+
span
|
|
108
|
+
},
|
|
109
|
+
form: form,
|
|
110
|
+
diffConfig: _diffConfig,
|
|
111
|
+
hideStartEndActionProps: hideStartEndActionProps,
|
|
112
|
+
titlePosition: titlePosition
|
|
113
|
+
}), field.key) : /*#__PURE__*/_jsx(LineFields, _objectSpread(_objectSpread({
|
|
114
|
+
className: _fields.length === index + 1 ? 'pro-form-list-last' : ''
|
|
115
|
+
}, props), {}, {
|
|
116
|
+
mode: mode,
|
|
117
|
+
columns: _columns,
|
|
118
|
+
disabled: disabled,
|
|
119
|
+
isView: isView,
|
|
120
|
+
namePath: namePath,
|
|
121
|
+
index: index,
|
|
122
|
+
field: field,
|
|
123
|
+
colProps: {
|
|
124
|
+
span: mode === 'less' ? 24 : span
|
|
125
|
+
},
|
|
126
|
+
form: form,
|
|
127
|
+
diffConfig: _diffConfig,
|
|
128
|
+
hideStartEndActionProps: hideStartEndActionProps
|
|
129
|
+
}), field.key);
|
|
130
|
+
}), _fields.length === 0 && /*#__PURE__*/_jsx(Empty, {
|
|
96
131
|
disabled: disabled,
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
index: index,
|
|
100
|
-
field: field,
|
|
101
|
-
colProps: {
|
|
102
|
-
span
|
|
103
|
-
},
|
|
132
|
+
toolbarProps: toolbarProps,
|
|
133
|
+
operation: operation,
|
|
104
134
|
form: form,
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
columns: _columns,
|
|
135
|
+
namePath: _namePath,
|
|
136
|
+
emptyBtnText: emptyBtnText
|
|
137
|
+
}), /*#__PURE__*/_jsx(_Form.ErrorList, {
|
|
138
|
+
errors: errors
|
|
139
|
+
}), toolbarProps !== false && _fields.length > 0 && /*#__PURE__*/_jsx(ToolbarButton, {
|
|
111
140
|
disabled: disabled,
|
|
112
141
|
isView: isView,
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
},
|
|
142
|
+
min: min,
|
|
143
|
+
max: max,
|
|
144
|
+
length: fields.length,
|
|
145
|
+
operation: operation,
|
|
146
|
+
namePath: _namePath,
|
|
119
147
|
form: form,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
toolbarProps: toolbarProps,
|
|
125
|
-
operation: operation,
|
|
126
|
-
form: form,
|
|
127
|
-
namePath: _namePath,
|
|
128
|
-
emptyBtnText: emptyBtnText
|
|
129
|
-
}), /*#__PURE__*/_jsx(_Form.ErrorList, {
|
|
130
|
-
errors: errors
|
|
131
|
-
}), toolbarProps !== false && _fields.length > 0 && /*#__PURE__*/_jsx(ToolbarButton, {
|
|
132
|
-
disabled: disabled,
|
|
133
|
-
isView: isView,
|
|
134
|
-
min: min,
|
|
135
|
-
max: max,
|
|
136
|
-
length: fields.length,
|
|
137
|
-
operation: operation,
|
|
138
|
-
namePath: _namePath,
|
|
139
|
-
form: form,
|
|
140
|
-
fields: fields,
|
|
141
|
-
toolbarProps: toolbarProps
|
|
142
|
-
})]
|
|
148
|
+
fields: fields,
|
|
149
|
+
toolbarProps: toolbarProps
|
|
150
|
+
})]
|
|
151
|
+
})
|
|
143
152
|
})
|
|
144
153
|
});
|
|
145
154
|
};
|
|
@@ -7,9 +7,9 @@ import type { ProFormColumnType, ProFormOtherType } from '../../../propsType';
|
|
|
7
7
|
export type TitleRender = (record: Record<string, any>, index: number, form: FormInstance) => any;
|
|
8
8
|
export type TitleType = string | React.ReactNode | TitleRender;
|
|
9
9
|
type Callback = (record: any, option: Pick<Option, 'namePath' | 'index' | 'operation' | 'form'>) => any | void;
|
|
10
|
-
export type ToolbarCallback = (record: any, option: Pick<Option, 'namePath' | 'form' | 'operation'>) => any | void;
|
|
10
|
+
export type ToolbarCallback = (record: any, option: Pick<Option, 'index' | 'namePath' | 'form' | 'operation'>) => any | void;
|
|
11
11
|
export interface Option {
|
|
12
|
-
index: number;
|
|
12
|
+
index: number | undefined;
|
|
13
13
|
namePath: InternalNamePath;
|
|
14
14
|
form: FormInstance;
|
|
15
15
|
operation: FormListOperation;
|
|
@@ -23,12 +23,14 @@ export interface ActionType extends Omit<ButtonProps, 'onClick' | 'type'> {
|
|
|
23
23
|
confirmProps?: boolean | PopconfirmProps;
|
|
24
24
|
title?: string;
|
|
25
25
|
show?: boolean | ((record: any, option: Pick<Option, 'index' | 'form' | 'namePath'>) => boolean);
|
|
26
|
+
addIndex?: number | ((record: any, option: Pick<Option, 'index' | 'form' | 'namePath' | 'operation'>) => number);
|
|
26
27
|
}
|
|
27
28
|
export interface ToolbarActionType extends Omit<ActionType, 'actionType' | 'onHandle' | 'onClick' | 'show' | 'type'> {
|
|
28
29
|
type?: 'add';
|
|
29
30
|
onHandle?: ToolbarCallback;
|
|
30
31
|
onClick?: ToolbarCallback;
|
|
31
32
|
show?: boolean | ((record: any, option: Pick<Option, 'form' | 'namePath'>) => boolean);
|
|
33
|
+
addIndex?: number | ((record: any, option: Pick<Option, 'index' | 'form' | 'namePath' | 'operation'>) => number);
|
|
32
34
|
}
|
|
33
35
|
export type FormListMode = 'block' | 'line' | 'less';
|
|
34
36
|
export interface FormListType {
|
|
@@ -56,6 +58,9 @@ export interface FormListType {
|
|
|
56
58
|
draggable?: boolean;
|
|
57
59
|
id?: string;
|
|
58
60
|
emptyBtnText?: string;
|
|
61
|
+
hideStartEndActionProps?: [boolean, boolean];
|
|
62
|
+
titlePosition?: 'top' | 'left';
|
|
63
|
+
className?: string;
|
|
59
64
|
}
|
|
60
65
|
export type TypeWithRef = FormListType & React.RefAttributes<FormListRefType>;
|
|
61
66
|
export interface FormListRefType {
|
|
@@ -93,3 +93,44 @@
|
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
|
+
|
|
97
|
+
// 左侧标题布局样式
|
|
98
|
+
.pro-form-list-mode-block.pro-form-list-title-left {
|
|
99
|
+
.@{ant-prefix}-collapse-header-text{
|
|
100
|
+
display: none;
|
|
101
|
+
}
|
|
102
|
+
.pro-form-list-left-title-wrapper {
|
|
103
|
+
display: flex;
|
|
104
|
+
gap: 16px;
|
|
105
|
+
align-items: flex-start;
|
|
106
|
+
|
|
107
|
+
.pro-form-list-left-title {
|
|
108
|
+
flex: 0 0 80px;
|
|
109
|
+
font-weight: 600;
|
|
110
|
+
font-size: 14px;
|
|
111
|
+
line-height: 1.4;
|
|
112
|
+
color: @zaui-text;
|
|
113
|
+
padding-top: 8px;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.pro-form-list-left-content {
|
|
117
|
+
flex: 1;
|
|
118
|
+
min-width: 0;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
// 移动端响应式
|
|
123
|
+
@media (max-width: 768px) {
|
|
124
|
+
.pro-form-list-left-title-wrapper {
|
|
125
|
+
flex-direction: column;
|
|
126
|
+
gap: 8px;
|
|
127
|
+
|
|
128
|
+
.pro-form-list-left-title {
|
|
129
|
+
flex: none;
|
|
130
|
+
width: 100%;
|
|
131
|
+
padding-top: 0;
|
|
132
|
+
margin-bottom: 8px;
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
}
|
|
@@ -121,11 +121,11 @@ var ProHeader = props => {
|
|
|
121
121
|
return null;
|
|
122
122
|
}
|
|
123
123
|
var onlyTag = tag && !label && !value;
|
|
124
|
-
var tagRender =
|
|
125
|
-
if (Array.isArray(
|
|
124
|
+
var tagRender = params => {
|
|
125
|
+
if (Array.isArray(params === null || params === void 0 ? void 0 : params.tag) && params !== null && params !== void 0 && params.tag.length) {
|
|
126
126
|
return /*#__PURE__*/_jsx(_Space, {
|
|
127
127
|
size: 4,
|
|
128
|
-
children:
|
|
128
|
+
children: params.tag.map((tagItem, index) => {
|
|
129
129
|
return /*#__PURE__*/_jsx("div", {
|
|
130
130
|
className: "pro-header-tag",
|
|
131
131
|
children: tagItem
|
|
@@ -133,26 +133,30 @@ var ProHeader = props => {
|
|
|
133
133
|
})
|
|
134
134
|
});
|
|
135
135
|
}
|
|
136
|
-
return
|
|
136
|
+
return params !== null && params !== void 0 && params.tag ? /*#__PURE__*/_jsx("div", {
|
|
137
137
|
className: "pro-header-tag",
|
|
138
|
-
children:
|
|
138
|
+
children: params === null || params === void 0 ? void 0 : params.tag
|
|
139
139
|
}) : null;
|
|
140
140
|
};
|
|
141
141
|
|
|
142
142
|
/** 单行渲染 */
|
|
143
|
-
var valueRender =
|
|
143
|
+
var valueRender = params => {
|
|
144
144
|
return /*#__PURE__*/_jsxs(_Space, {
|
|
145
145
|
size: 4,
|
|
146
|
-
align:
|
|
147
|
-
children: [
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
146
|
+
align: params !== null && params !== void 0 && params.tag ? 'baseline' : 'center',
|
|
147
|
+
children: [params !== null && params !== void 0 && params.link ?
|
|
148
|
+
/*#__PURE__*/
|
|
149
|
+
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
|
150
|
+
_jsx("a", {
|
|
151
|
+
onClick: () => {
|
|
152
|
+
var newWindow = window.open(params.link);
|
|
153
|
+
newWindow.opener = null;
|
|
154
|
+
},
|
|
155
|
+
children: params === null || params === void 0 ? void 0 : params.value
|
|
156
|
+
}) : params === null || params === void 0 ? void 0 : params.value, params !== null && params !== void 0 && params.copyable && isString(params === null || params === void 0 ? void 0 : params.value) ? /*#__PURE__*/_jsx(Copy, {
|
|
157
|
+
text: params.value
|
|
154
158
|
}) : null, tagRender({
|
|
155
|
-
tag:
|
|
159
|
+
tag: params === null || params === void 0 ? void 0 : params.tag
|
|
156
160
|
})]
|
|
157
161
|
});
|
|
158
162
|
};
|