fan-standard-comp 3.2.7 → 3.2.9
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/fan-standard-comp.umd.js +2 -2
- package/es/ButtonGroup/index.d.ts +3 -0
- package/es/ButtonGroup/index.js +112 -40
- package/es/ButtonGroup/index3.d.ts +39 -0
- package/es/ButtonGroup/index3.js +449 -0
- package/es/components/IconNode/index.d.ts +1 -0
- package/es/components/IconNode/index.js +6 -3
- package/lib/ButtonGroup/index.d.ts +3 -0
- package/lib/ButtonGroup/index.js +111 -39
- package/lib/ButtonGroup/index3.d.ts +39 -0
- package/lib/ButtonGroup/index3.js +459 -0
- package/lib/components/IconNode/index.d.ts +1 -0
- package/lib/components/IconNode/index.js +6 -3
- package/package.json +2 -5
package/lib/ButtonGroup/index.js
CHANGED
|
@@ -21,6 +21,7 @@ var _PopConfirmTitle = _interopRequireDefault(require("./PopConfirmTitle"));
|
|
|
21
21
|
var _index3 = require("../data/index");
|
|
22
22
|
var _icons = require("@ant-design/icons");
|
|
23
23
|
var _filterPermission = require("../utils/filterPermission.js");
|
|
24
|
+
var _index4 = require("../utils/index");
|
|
24
25
|
var _lodash = _interopRequireDefault(require("lodash"));
|
|
25
26
|
require("./style/index.less");
|
|
26
27
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
@@ -52,6 +53,8 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
52
53
|
_props$moreText = props.moreText,
|
|
53
54
|
moreText = _props$moreText === void 0 ? '更多' : _props$moreText,
|
|
54
55
|
moreIcon = props.moreIcon,
|
|
56
|
+
_props$showTextIcon = props.showTextIcon,
|
|
57
|
+
showTextIcon = _props$showTextIcon === void 0 ? false : _props$showTextIcon,
|
|
55
58
|
className = props.className,
|
|
56
59
|
style = props.style;
|
|
57
60
|
var _props$options = props.options,
|
|
@@ -67,10 +70,18 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
67
70
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
68
71
|
popRow = _useState4[0],
|
|
69
72
|
setPopRow = _useState4[1];
|
|
70
|
-
var _useState5 = (0, _react.useState)(
|
|
73
|
+
var _useState5 = (0, _react.useState)(-1),
|
|
71
74
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
72
|
-
|
|
73
|
-
|
|
75
|
+
popSubVisibleIndex = _useState6[0],
|
|
76
|
+
setPopSubVisibleIndex = _useState6[1];
|
|
77
|
+
var _useState7 = (0, _react.useState)({}),
|
|
78
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
79
|
+
popSubRow = _useState8[0],
|
|
80
|
+
setPopSubRow = _useState8[1];
|
|
81
|
+
var _useState9 = (0, _react.useState)([]),
|
|
82
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
83
|
+
resetList = _useState10[0],
|
|
84
|
+
setResetList = _useState10[1];
|
|
74
85
|
(0, _react.useEffect)(function () {
|
|
75
86
|
// codes在方法内,再合并默认的权限配置
|
|
76
87
|
// 合并本地的codes
|
|
@@ -83,6 +94,7 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
83
94
|
}, [options, codes, permissionCodes]);
|
|
84
95
|
(0, _react.useEffect)(function () {
|
|
85
96
|
setPopVisibleIndex(-1);
|
|
97
|
+
setPopSubVisibleIndex(-1);
|
|
86
98
|
}, [rowParams]);
|
|
87
99
|
// 渲染按钮多层级形式 (用于筛选)
|
|
88
100
|
var buttonMenu = function buttonMenu(group) {
|
|
@@ -184,8 +196,41 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
184
196
|
}
|
|
185
197
|
})
|
|
186
198
|
}*/
|
|
199
|
+
// 自定义渲染显示的文本
|
|
200
|
+
var renderCustomLabel = function renderCustomLabel(gItem, hideIcon) {
|
|
201
|
+
return gItem.render ? gItem.render.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
202
|
+
return rowParams[pItem];
|
|
203
|
+
}))) : (/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !hideIcon && gItem.icon && showTextIcon ? /*#__PURE__*/_react.default.createElement(_index.IconNode, {
|
|
204
|
+
icon: gItem.icon
|
|
205
|
+
}) : '', " ", gItem.exName || gItem.name));
|
|
206
|
+
};
|
|
187
207
|
// 渲染文本形式多级菜单列表(用于表格)
|
|
188
|
-
var textMenu = function textMenu(group) {
|
|
208
|
+
var textMenu = function textMenu(group, source) {
|
|
209
|
+
var menuTitle = function menuTitle(gItem, displayClass) {
|
|
210
|
+
return gItem.hasOwnProperty('confirmText') || gItem.hasOwnProperty('confirmConfig') ?
|
|
211
|
+
/*#__PURE__*/
|
|
212
|
+
// @ts-ignore
|
|
213
|
+
_react.default.createElement("a", {
|
|
214
|
+
disabled: (0, _filterPermission.btnIsDisabled)(gItem.disabled, rowParams),
|
|
215
|
+
onClick: gItem.fn ? function () {
|
|
216
|
+
// console.log('带二次确认节点点击区分处理更多里面还是直接展示里面的按钮')
|
|
217
|
+
setPopVisibleIndex(source === 'isMoreChild' ? rowParams.rowIndex : -1);
|
|
218
|
+
setPopRow(source === 'isMoreChild' ? gItem : {});
|
|
219
|
+
setPopSubVisibleIndex(source === 'isMoreChild' ? -1 : rowParams.rowIndex);
|
|
220
|
+
setPopSubRow(source === 'isMoreChild' ? {} : gItem);
|
|
221
|
+
} : null
|
|
222
|
+
}, renderCustomLabel(gItem)) : /*#__PURE__*/_react.default.createElement("a", {
|
|
223
|
+
className: displayClass,
|
|
224
|
+
// className={"spec-button-group-text" }
|
|
225
|
+
onClick: gItem.fn ? function () {
|
|
226
|
+
return gItem.fn.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
227
|
+
return rowParams[pItem];
|
|
228
|
+
})));
|
|
229
|
+
} : null,
|
|
230
|
+
// @ts-ignore
|
|
231
|
+
disabled: (0, _filterPermission.btnIsDisabled)(gItem.disabled, rowParams)
|
|
232
|
+
}, renderCustomLabel(gItem));
|
|
233
|
+
};
|
|
189
234
|
return /*#__PURE__*/_react.default.createElement(_menu.default, {
|
|
190
235
|
className: "spec-button-text-dropdown"
|
|
191
236
|
}, group.map(function (gItem, gIndex) {
|
|
@@ -196,48 +241,71 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
196
241
|
}, gItem.children.map(function (child, childIndex) {
|
|
197
242
|
return /*#__PURE__*/_react.default.createElement(_menu.default.Item, {
|
|
198
243
|
key: child.name + childIndex
|
|
199
|
-
},
|
|
200
|
-
onClick: child.fn ? function () {
|
|
201
|
-
return child.fn.apply(child, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
202
|
-
return rowParams[pItem];
|
|
203
|
-
})));
|
|
204
|
-
} : null
|
|
205
|
-
}, child.render ? child.render.apply(child, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
206
|
-
return rowParams[pItem];
|
|
207
|
-
}))) : child.exName || child.name));
|
|
244
|
+
}, menuTitle(child));
|
|
208
245
|
}));
|
|
209
246
|
}
|
|
210
247
|
return /*#__PURE__*/_react.default.createElement(_menu.default.Item, {
|
|
211
248
|
key: gIndex,
|
|
212
249
|
disabled: (0, _filterPermission.btnIsDisabled)(gItem.disabled, rowParams)
|
|
213
|
-
}, gItem
|
|
214
|
-
/*#__PURE__*/
|
|
215
|
-
// @ts-ignore
|
|
216
|
-
_react.default.createElement("a", {
|
|
217
|
-
disabled: (0, _filterPermission.btnIsDisabled)(gItem.disabled, rowParams),
|
|
218
|
-
onClick: gItem.fn ? function () {
|
|
219
|
-
setPopVisibleIndex(rowParams.rowIndex);
|
|
220
|
-
setPopRow(gItem);
|
|
221
|
-
} : null
|
|
222
|
-
}, gItem.render ? gItem.render.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
223
|
-
return rowParams[pItem];
|
|
224
|
-
}))) : gItem.exName || gItem.name) : /*#__PURE__*/_react.default.createElement("a", {
|
|
225
|
-
className: "spec-button-group-text",
|
|
226
|
-
onClick: gItem.fn ? function () {
|
|
227
|
-
return gItem.fn.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
228
|
-
return rowParams[pItem];
|
|
229
|
-
})));
|
|
230
|
-
} : null,
|
|
231
|
-
// @ts-ignore
|
|
232
|
-
disabled: (0, _filterPermission.btnIsDisabled)(gItem.disabled, rowParams)
|
|
233
|
-
}, gItem.render ? gItem.render.apply(gItem, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
234
|
-
return rowParams[pItem];
|
|
235
|
-
}))) : gItem.exName || gItem.name));
|
|
250
|
+
}, menuTitle(gItem, "spec-button-group-text"));
|
|
236
251
|
}));
|
|
237
252
|
};
|
|
238
253
|
// 渲染文本形式 列表(用于表格)
|
|
239
254
|
var RenderTextList = function RenderTextList(item) {
|
|
240
255
|
if (Array.isArray(item.children) && item.children.length > 0) {
|
|
256
|
+
var hasConfirmText = [];
|
|
257
|
+
item.children.forEach(function (child) {
|
|
258
|
+
hasConfirmText = hasConfirmText.concat((0, _index4.convertToArray)([child]));
|
|
259
|
+
});
|
|
260
|
+
if (hasConfirmText.filter(function (hcItem) {
|
|
261
|
+
return hcItem.hasOwnProperty('confirmText') || hcItem.hasOwnProperty('confirmConfig');
|
|
262
|
+
}).length) {
|
|
263
|
+
// 子项有二次确认文本,需要显示浮层
|
|
264
|
+
return /*#__PURE__*/_react.default.createElement(_popconfirm.default, Object.assign({
|
|
265
|
+
key: (item === null || item === void 0 ? void 0 : item.index) || JSON.stringify(item),
|
|
266
|
+
placement: "topRight",
|
|
267
|
+
open: popSubVisibleIndex === rowParams.rowIndex,
|
|
268
|
+
icon: /*#__PURE__*/_react.default.createElement(_icons.QuestionCircleOutlined, null),
|
|
269
|
+
trigger: "click"
|
|
270
|
+
}, popSubRow.hasOwnProperty('confirmConfig') ? popSubRow.confirmConfig : {}, {
|
|
271
|
+
title: /*#__PURE__*/_react.default.createElement(_PopConfirmTitle.default, Object.assign({}, popSubRow, {
|
|
272
|
+
extraRow: rowParams
|
|
273
|
+
})),
|
|
274
|
+
onCancel: function onCancel() {
|
|
275
|
+
setPopSubVisibleIndex(-1);
|
|
276
|
+
// 优先调用其 confirmConfig 配置的 onCancel 事件
|
|
277
|
+
if (popSubRow.hasOwnProperty('confirmConfig') && popSubRow.confirmConfig.onCancel) {
|
|
278
|
+
var _popSubRow$confirmCon;
|
|
279
|
+
(_popSubRow$confirmCon = popSubRow.confirmConfig).onCancel.apply(_popSubRow$confirmCon, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
280
|
+
return rowParams[pItem];
|
|
281
|
+
})));
|
|
282
|
+
}
|
|
283
|
+
},
|
|
284
|
+
onConfirm: function onConfirm() {
|
|
285
|
+
setPopSubVisibleIndex(-1);
|
|
286
|
+
// 优先调用其 confirmConfig 配置的 onConfirm 事件
|
|
287
|
+
if (popSubRow.hasOwnProperty('confirmConfig') && popSubRow.confirmConfig.onConfirm) {
|
|
288
|
+
var _popSubRow$confirmCon2;
|
|
289
|
+
(_popSubRow$confirmCon2 = popSubRow.confirmConfig).onConfirm.apply(_popSubRow$confirmCon2, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
290
|
+
return rowParams[pItem];
|
|
291
|
+
})));
|
|
292
|
+
} else if (popSubRow.fn) {
|
|
293
|
+
popSubRow.fn.apply(popSubRow, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
294
|
+
return rowParams[pItem];
|
|
295
|
+
})));
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
}), /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
|
|
299
|
+
overlay: textMenu(item.children),
|
|
300
|
+
placement: "bottomRight"
|
|
301
|
+
}, (item === null || item === void 0 ? void 0 : item.dropdownConfig) || dropdownConfig || {}), /*#__PURE__*/_react.default.createElement("a", {
|
|
302
|
+
className: "spec-button-group-text"
|
|
303
|
+
}, item.render ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
304
|
+
return rowParams[pItem];
|
|
305
|
+
}))) : item.exName || item.name, " ", /*#__PURE__*/_react.default.createElement(_index2.default, {
|
|
306
|
+
name: "down"
|
|
307
|
+
}))));
|
|
308
|
+
}
|
|
241
309
|
return /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
|
|
242
310
|
overlay: textMenu(item.children),
|
|
243
311
|
placement: "bottomRight"
|
|
@@ -303,7 +371,9 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
303
371
|
var renderDisplayButton = function renderDisplayButton(item, index) {
|
|
304
372
|
/*渲染自定义*/
|
|
305
373
|
if (item.render) {
|
|
306
|
-
return /*#__PURE__*/_react.default.createElement(_react.
|
|
374
|
+
return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
|
|
375
|
+
key: index
|
|
376
|
+
}, typeof item.render === 'function' ? item.render.apply(item, _toConsumableArray(Object.keys(rowParams).map(function (pItem) {
|
|
307
377
|
return rowParams[pItem];
|
|
308
378
|
}))) : item.render);
|
|
309
379
|
}
|
|
@@ -339,7 +409,7 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
339
409
|
type: "primary"
|
|
340
410
|
}, moreText || '更多', moreIcon || /*#__PURE__*/_react.default.createElement(_icons.DownOutlined, null))) : /*#__PURE__*/_react.default.createElement(_popconfirm.default, Object.assign({
|
|
341
411
|
placement: "topRight",
|
|
342
|
-
|
|
412
|
+
open: popVisibleIndex === rowParams.rowIndex,
|
|
343
413
|
icon: /*#__PURE__*/_react.default.createElement(_icons.QuestionCircleOutlined, null),
|
|
344
414
|
trigger: "click"
|
|
345
415
|
}, popRow.hasOwnProperty('confirmConfig') ? popRow.confirmConfig : {}, {
|
|
@@ -348,6 +418,7 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
348
418
|
})),
|
|
349
419
|
onCancel: function onCancel() {
|
|
350
420
|
setPopVisibleIndex(-1);
|
|
421
|
+
setPopSubVisibleIndex(-1);
|
|
351
422
|
// 优先调用其 confirmConfig 配置的 onCancel 事件
|
|
352
423
|
if (popRow.hasOwnProperty('confirmConfig') && popRow.confirmConfig.onCancel) {
|
|
353
424
|
var _popRow$confirmConfig;
|
|
@@ -358,6 +429,7 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
358
429
|
},
|
|
359
430
|
onConfirm: function onConfirm() {
|
|
360
431
|
setPopVisibleIndex(-1);
|
|
432
|
+
setPopSubVisibleIndex(-1);
|
|
361
433
|
// 优先调用其 confirmConfig 配置的 onConfirm 事件
|
|
362
434
|
if (popRow.hasOwnProperty('confirmConfig') && popRow.confirmConfig.onConfirm) {
|
|
363
435
|
var _popRow$confirmConfig2;
|
|
@@ -371,7 +443,7 @@ var ButtonGroup = function ButtonGroup(props) {
|
|
|
371
443
|
}
|
|
372
444
|
}
|
|
373
445
|
}), /*#__PURE__*/_react.default.createElement(_dropdown.default, Object.assign({
|
|
374
|
-
overlay: textMenu(forDrop),
|
|
446
|
+
overlay: textMenu(forDrop, 'isMoreChild'),
|
|
375
447
|
placement: "bottomRight"
|
|
376
448
|
}, dropdownConfig), /*#__PURE__*/_react.default.createElement("a", {
|
|
377
449
|
className: "spec-button-group-text"
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import './style/index.less';
|
|
3
|
+
interface ButtonGroupRowParamsProps {
|
|
4
|
+
text?: any;
|
|
5
|
+
record?: object;
|
|
6
|
+
rowIndex?: number;
|
|
7
|
+
}
|
|
8
|
+
export interface ButtonGroupOptionsProps {
|
|
9
|
+
name?: string;
|
|
10
|
+
code?: string;
|
|
11
|
+
exName?: string;
|
|
12
|
+
isHide?: boolean;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
icon?: React.ReactNode | string | string[];
|
|
15
|
+
fn?: any;
|
|
16
|
+
children?: ButtonGroupOptionsProps[];
|
|
17
|
+
render?: (() => React.ReactNode) | React.ReactNode;
|
|
18
|
+
confirmText?: any;
|
|
19
|
+
confirmConfig?: any;
|
|
20
|
+
dropdownConfig?: any;
|
|
21
|
+
}
|
|
22
|
+
interface ButtonGroupProps {
|
|
23
|
+
type?: 'button' | 'text';
|
|
24
|
+
rowParams?: ButtonGroupRowParamsProps;
|
|
25
|
+
codes?: object[];
|
|
26
|
+
permissionCodes?: string[];
|
|
27
|
+
options?: ButtonGroupOptionsProps[];
|
|
28
|
+
min?: number;
|
|
29
|
+
dropdownConfig?: Object;
|
|
30
|
+
moreText?: string;
|
|
31
|
+
moreIcon?: React.ReactNode | string | number;
|
|
32
|
+
size?: any;
|
|
33
|
+
showTextIcon?: boolean;
|
|
34
|
+
className?: string;
|
|
35
|
+
style?: object;
|
|
36
|
+
[k: string]: any;
|
|
37
|
+
}
|
|
38
|
+
declare const ButtonGroup: (props: ButtonGroupProps) => React.JSX.Element;
|
|
39
|
+
export default ButtonGroup;
|