@pointcloud/pcloud-components 1.0.9 → 1.0.11
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/esm/CRUD/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type ModalFuncProps, type ButtonProps } from 'antd';
|
|
2
|
+
import { type ModalFuncProps, type ButtonProps, type PopoverProps } from 'antd';
|
|
3
3
|
import { type DFormProps } from '../DForm';
|
|
4
4
|
import { type DTableSourceProps, type DTableProps } from '../DTable';
|
|
5
5
|
import type { DModalProps } from '../DModal/interface';
|
|
@@ -24,6 +24,16 @@ export type CRUDRefProps = {
|
|
|
24
24
|
openDetailModal: (_record?: any) => void;
|
|
25
25
|
};
|
|
26
26
|
export type MoreActionColumnRender<T = Record<string, any>> = (_text: any, _record: T) => React.ReactNode;
|
|
27
|
+
export type MoreActionProps<T = Record<string, any>> = MoreActionColumnRender<T> | {
|
|
28
|
+
/** 内容渲染函数 */
|
|
29
|
+
render: MoreActionColumnRender<T>;
|
|
30
|
+
/** Popover 属性 */
|
|
31
|
+
popoverProps?: PopoverProps;
|
|
32
|
+
/** 更多按钮文字,默认为"更多" */
|
|
33
|
+
label?: string;
|
|
34
|
+
/** 更多按钮配置 */
|
|
35
|
+
buttonProps?: ButtonProps;
|
|
36
|
+
};
|
|
27
37
|
export type CRUDProps = {
|
|
28
38
|
className?: string;
|
|
29
39
|
style?: React.CSSProperties;
|
|
@@ -33,7 +43,7 @@ export type CRUDProps = {
|
|
|
33
43
|
};
|
|
34
44
|
/** 表格配置 */
|
|
35
45
|
tableProps: DTableProps & {
|
|
36
|
-
moreActionColumn?:
|
|
46
|
+
moreActionColumn?: MoreActionProps;
|
|
37
47
|
};
|
|
38
48
|
/** 新增/编辑表单配置 */
|
|
39
49
|
modalFormProps?: {
|
|
@@ -57,18 +67,24 @@ export type CRUDProps = {
|
|
|
57
67
|
batchDeleteButtonProps?: ButtonProps;
|
|
58
68
|
/** 显示行编辑 */
|
|
59
69
|
showEdit?: boolean;
|
|
70
|
+
/** 根据行数据动态控制编辑按钮显隐 */
|
|
71
|
+
showEditPerRow?: (_record: any) => boolean;
|
|
60
72
|
/** 行编辑按钮文本 */
|
|
61
73
|
editButtonText?: string;
|
|
62
74
|
/** 编辑按钮配置 */
|
|
63
75
|
editButtonProps?: ButtonProps;
|
|
64
76
|
/** 显示行删除 */
|
|
65
77
|
showDelete?: boolean;
|
|
78
|
+
/** 根据行数据动态控制删除按钮显隐 */
|
|
79
|
+
showDeletePerRow?: (_record: any) => boolean;
|
|
66
80
|
/** 删除按钮文本 */
|
|
67
81
|
deleteButtonText?: string;
|
|
68
82
|
/** 删除按钮配置 */
|
|
69
83
|
deleteButtonProps?: ButtonProps;
|
|
70
84
|
/** 显示行查看 */
|
|
71
85
|
showView?: boolean;
|
|
86
|
+
/** 根据行数据动态控制查看按钮显隐 */
|
|
87
|
+
showViewPerRow?: (_record: any) => boolean;
|
|
72
88
|
/** 行查看按钮文本 */
|
|
73
89
|
viewButtonText?: string;
|
|
74
90
|
/** 行查看按钮配置 */
|
|
@@ -80,13 +96,13 @@ export type CRUDProps = {
|
|
|
80
96
|
crudApi: {
|
|
81
97
|
list: (_params: any) => Promise<DTableSourceProps>;
|
|
82
98
|
/** 删除数据接口 */
|
|
83
|
-
delete?: (
|
|
99
|
+
delete?: (_currentRecord: any) => Promise<any>;
|
|
84
100
|
/** 新增数据接口 */
|
|
85
101
|
add?: (_params: any) => Promise<any>;
|
|
86
102
|
/** 编辑数据接口 */
|
|
87
|
-
edit?: (_params: any) => Promise<any>;
|
|
103
|
+
edit?: (_params: any, _currentRecord: any) => Promise<any>;
|
|
88
104
|
/** 详情数据接口 */
|
|
89
|
-
detail?: (
|
|
105
|
+
detail?: (_currentRecord: any) => Promise<any>;
|
|
90
106
|
};
|
|
91
107
|
/** 全局刷新策略 */
|
|
92
108
|
refreshStrategy?: RefreshStrategy;
|
package/dist/esm/CRUD/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
|
6
6
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
7
7
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
8
8
|
var _excluded = ["immediate"],
|
|
9
|
-
_excluded2 = ["columns"
|
|
9
|
+
_excluded2 = ["columns"];
|
|
10
10
|
import React, { useMemo, useState, useContext, useCallback, useRef, forwardRef, useImperativeHandle, useEffect } from 'react';
|
|
11
11
|
import classNames from 'classnames';
|
|
12
12
|
import { Button, Popover } from 'antd';
|
|
@@ -25,7 +25,7 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
25
25
|
var defaultStrategies = {
|
|
26
26
|
add: {
|
|
27
27
|
keepSearchValues: true,
|
|
28
|
-
keepPage:
|
|
28
|
+
keepPage: true
|
|
29
29
|
},
|
|
30
30
|
edit: {
|
|
31
31
|
keepSearchValues: true,
|
|
@@ -54,10 +54,13 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
54
54
|
batchDeleteButtonProps = props.batchDeleteButtonProps,
|
|
55
55
|
_props$showEdit = props.showEdit,
|
|
56
56
|
showEdit = _props$showEdit === void 0 ? true : _props$showEdit,
|
|
57
|
+
showEditPerRow = props.showEditPerRow,
|
|
57
58
|
_props$showDelete = props.showDelete,
|
|
58
59
|
showDelete = _props$showDelete === void 0 ? true : _props$showDelete,
|
|
60
|
+
showDeletePerRow = props.showDeletePerRow,
|
|
59
61
|
_props$showView = props.showView,
|
|
60
62
|
showView = _props$showView === void 0 ? true : _props$showView,
|
|
63
|
+
showViewPerRow = props.showViewPerRow,
|
|
61
64
|
_props$editButtonProp = props.editButtonProps,
|
|
62
65
|
editButtonProps = _props$editButtonProp === void 0 ? {} : _props$editButtonProp,
|
|
63
66
|
_props$deleteButtonPr = props.deleteButtonProps,
|
|
@@ -365,9 +368,10 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
365
368
|
return _regeneratorRuntime().wrap(function _callee6$(_context6) {
|
|
366
369
|
while (1) switch (_context6.prev = _context6.next) {
|
|
367
370
|
case 0:
|
|
368
|
-
_context6.
|
|
371
|
+
_context6.prev = 0;
|
|
372
|
+
_context6.next = 3;
|
|
369
373
|
return deleteApi(_objectSpread({}, selectedData));
|
|
370
|
-
case
|
|
374
|
+
case 3:
|
|
371
375
|
_isNeedRefreshToPage = isNeedRefreshToPage(selectedData.selectedRows.length), needRefreshToPage = _isNeedRefreshToPage.needRefreshToPage, targetPage = _isNeedRefreshToPage.targetPage;
|
|
372
376
|
handleRefresh(memoizedDeleteRefreshStrategy, {
|
|
373
377
|
needRefreshToPage: needRefreshToPage,
|
|
@@ -377,11 +381,17 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
377
381
|
selectedRowKeys: [],
|
|
378
382
|
selectedRows: []
|
|
379
383
|
});
|
|
380
|
-
|
|
384
|
+
_context6.next = 11;
|
|
385
|
+
break;
|
|
386
|
+
case 8:
|
|
387
|
+
_context6.prev = 8;
|
|
388
|
+
_context6.t0 = _context6["catch"](0);
|
|
389
|
+
return _context6.abrupt("return", Promise.reject(_context6.t0));
|
|
390
|
+
case 11:
|
|
381
391
|
case "end":
|
|
382
392
|
return _context6.stop();
|
|
383
393
|
}
|
|
384
|
-
}, _callee6);
|
|
394
|
+
}, _callee6, null, [[0, 8]]);
|
|
385
395
|
}));
|
|
386
396
|
function onOk() {
|
|
387
397
|
return _onOk.apply(this, arguments);
|
|
@@ -403,19 +413,26 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
403
413
|
return _regeneratorRuntime().wrap(function _callee7$(_context7) {
|
|
404
414
|
while (1) switch (_context7.prev = _context7.next) {
|
|
405
415
|
case 0:
|
|
406
|
-
_context7.
|
|
416
|
+
_context7.prev = 0;
|
|
417
|
+
_context7.next = 3;
|
|
407
418
|
return deleteApi(record);
|
|
408
|
-
case
|
|
419
|
+
case 3:
|
|
409
420
|
_isNeedRefreshToPage2 = isNeedRefreshToPage(), needRefreshToPage = _isNeedRefreshToPage2.needRefreshToPage, targetPage = _isNeedRefreshToPage2.targetPage;
|
|
410
421
|
handleRefresh(memoizedDeleteRefreshStrategy, {
|
|
411
422
|
needRefreshToPage: needRefreshToPage,
|
|
412
423
|
targetPage: targetPage
|
|
413
424
|
});
|
|
414
|
-
|
|
425
|
+
_context7.next = 10;
|
|
426
|
+
break;
|
|
427
|
+
case 7:
|
|
428
|
+
_context7.prev = 7;
|
|
429
|
+
_context7.t0 = _context7["catch"](0);
|
|
430
|
+
return _context7.abrupt("return", Promise.reject(_context7.t0));
|
|
431
|
+
case 10:
|
|
415
432
|
case "end":
|
|
416
433
|
return _context7.stop();
|
|
417
434
|
}
|
|
418
|
-
}, _callee7);
|
|
435
|
+
}, _callee7, null, [[0, 7]]);
|
|
419
436
|
}));
|
|
420
437
|
function onOk() {
|
|
421
438
|
return _onOk2.apply(this, arguments);
|
|
@@ -444,7 +461,7 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
444
461
|
break;
|
|
445
462
|
}
|
|
446
463
|
_context9.next = 4;
|
|
447
|
-
return editApi(_objectSpread(_objectSpread({}, currentRecordRef.current || {}), values));
|
|
464
|
+
return editApi(_objectSpread(_objectSpread({}, currentRecordRef.current || {}), values), currentRecordRef.current);
|
|
448
465
|
case 4:
|
|
449
466
|
handleRefresh(memoizedEditRefreshStrategy);
|
|
450
467
|
_context9.next = 11;
|
|
@@ -529,10 +546,15 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
529
546
|
var currentHandleEdit = handleEdit;
|
|
530
547
|
var currentHandleDelete = handleDelete;
|
|
531
548
|
var currentHandleView = handleView;
|
|
549
|
+
var moreActionConfig = tableProps !== null && tableProps !== void 0 && tableProps.moreActionColumn ? typeof tableProps.moreActionColumn === 'function' ? {
|
|
550
|
+
render: tableProps.moreActionColumn
|
|
551
|
+
} : tableProps.moreActionColumn : null;
|
|
532
552
|
return function (_text, record) {
|
|
553
|
+
var moreContent = moreActionConfig === null || moreActionConfig === void 0 ? void 0 : moreActionConfig.render(_text, record);
|
|
554
|
+
var showContent = !!moreContent;
|
|
533
555
|
return /*#__PURE__*/_jsxs("div", {
|
|
534
556
|
className: actionColumnClass,
|
|
535
|
-
children: [showEdit && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
557
|
+
children: [showEdit && (!showEditPerRow || showEditPerRow(record)) && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
536
558
|
type: "link",
|
|
537
559
|
icon: /*#__PURE__*/_jsx(EditOutlined, {}),
|
|
538
560
|
onClick: function onClick() {
|
|
@@ -541,7 +563,7 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
541
563
|
size: "small"
|
|
542
564
|
}, editButtonProps), {}, {
|
|
543
565
|
children: editButtonText
|
|
544
|
-
})), showDelete && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
566
|
+
})), showDelete && (!showDeletePerRow || showDeletePerRow(record)) && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
545
567
|
type: "link",
|
|
546
568
|
danger: true,
|
|
547
569
|
icon: /*#__PURE__*/_jsx(DeleteOutlined, {}),
|
|
@@ -551,7 +573,7 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
551
573
|
size: "small"
|
|
552
574
|
}, deleteButtonProps), {}, {
|
|
553
575
|
children: deleteButtonText
|
|
554
|
-
})), showView && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
576
|
+
})), showView && (!showViewPerRow || showViewPerRow(record)) && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
555
577
|
type: "link",
|
|
556
578
|
icon: /*#__PURE__*/_jsx(EyeOutlined, {}),
|
|
557
579
|
onClick: function onClick() {
|
|
@@ -560,34 +582,38 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
560
582
|
size: "small"
|
|
561
583
|
}, viewButtonProps), {}, {
|
|
562
584
|
children: viewButtonText
|
|
563
|
-
})),
|
|
585
|
+
})), moreActionConfig && showContent && /*#__PURE__*/_jsx(Popover, _objectSpread(_objectSpread({
|
|
564
586
|
trigger: "click",
|
|
565
587
|
placement: "bottomRight",
|
|
566
|
-
content:
|
|
588
|
+
content: moreContent,
|
|
567
589
|
zIndex: 5,
|
|
568
590
|
getPopupContainer: function getPopupContainer(e) {
|
|
569
591
|
return e.parentElement || document.body;
|
|
570
|
-
}
|
|
571
|
-
|
|
592
|
+
}
|
|
593
|
+
}, moreActionConfig.popoverProps), {}, {
|
|
594
|
+
children: /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
|
|
572
595
|
type: "link",
|
|
573
596
|
icon: /*#__PURE__*/_jsx(MoreOutlined, {}),
|
|
574
|
-
size: "small"
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
597
|
+
size: "small"
|
|
598
|
+
}, moreActionConfig.buttonProps), {}, {
|
|
599
|
+
children: moreActionConfig.label || '更多'
|
|
600
|
+
}))
|
|
601
|
+
}))]
|
|
578
602
|
});
|
|
579
603
|
};
|
|
580
|
-
}, [handleEdit, handleDelete, handleView, showEdit, showDelete, showView, editButtonText, deleteButtonText, viewButtonText, tableProps === null || tableProps === void 0 ? void 0 : tableProps.moreActionColumn]);
|
|
604
|
+
}, [handleEdit, handleDelete, handleView, showEdit, showEditPerRow, showDelete, showDeletePerRow, showView, showViewPerRow, editButtonText, deleteButtonText, viewButtonText, tableProps === null || tableProps === void 0 ? void 0 : tableProps.moreActionColumn]);
|
|
605
|
+
// 缓存搜索参数
|
|
606
|
+
var tableExtraParams = useMemo(function () {
|
|
607
|
+
return _objectSpread(_objectSpread({}, (tableProps === null || tableProps === void 0 ? void 0 : tableProps.extraParams) || {}), searchValues);
|
|
608
|
+
}, [JSON.stringify(tableProps === null || tableProps === void 0 ? void 0 : tableProps.extraParams), JSON.stringify(searchValues)]);
|
|
581
609
|
var tablePropsWithSearch = useMemo(function () {
|
|
582
610
|
var _ref9 = tableProps || {},
|
|
583
611
|
_ref9$columns = _ref9.columns,
|
|
584
612
|
columns = _ref9$columns === void 0 ? [] : _ref9$columns,
|
|
585
|
-
tableExtraParams = _ref9.extraParams,
|
|
586
613
|
otherTableProps = _objectWithoutProperties(_ref9, _excluded2);
|
|
587
|
-
return _objectSpread({
|
|
614
|
+
return _objectSpread(_objectSpread({
|
|
588
615
|
actionColumn: actionColumn,
|
|
589
616
|
columns: tablePropsState.columns || columns,
|
|
590
|
-
extraParams: _objectSpread(_objectSpread({}, tableExtraParams || {}), searchValues),
|
|
591
617
|
rowSelection: {
|
|
592
618
|
fixed: true,
|
|
593
619
|
onChange: function onChange(selectedRowKeys, selectedRows) {
|
|
@@ -598,13 +624,23 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
598
624
|
}
|
|
599
625
|
},
|
|
600
626
|
loadMore: listApi
|
|
601
|
-
}, otherTableProps)
|
|
602
|
-
|
|
627
|
+
}, otherTableProps), {}, {
|
|
628
|
+
extraParams: tableExtraParams
|
|
629
|
+
});
|
|
630
|
+
}, [tableProps, tablePropsState.columns, tableExtraParams, actionColumn, listApi]);
|
|
603
631
|
var mergedModalFormProps = useMemo(function () {
|
|
604
|
-
var _modalFormProps$modal;
|
|
632
|
+
var _modalFormProps$modal, _modalFormProps$formP;
|
|
605
633
|
if (!(modalFormProps !== null && modalFormProps !== void 0 && modalFormProps.formProps)) return null;
|
|
606
634
|
var isViewMode = modalConfig.mode === 'view';
|
|
607
635
|
var modalTitle = (modalFormProps === null || modalFormProps === void 0 || (_modalFormProps$modal = modalFormProps.modalProps) === null || _modalFormProps$modal === void 0 ? void 0 : _modalFormProps$modal.title) || '';
|
|
636
|
+
|
|
637
|
+
// 详情模式下,显式禁用每个表单项(避免依赖 Ant Design Form 的 disabled 级联)
|
|
638
|
+
var baseItems = (_modalFormProps$formP = modalFormProps.formProps) === null || _modalFormProps$formP === void 0 ? void 0 : _modalFormProps$formP.items;
|
|
639
|
+
var items = isViewMode && baseItems !== null && baseItems !== void 0 && baseItems.length ? baseItems.map(function (item) {
|
|
640
|
+
return _objectSpread(_objectSpread({}, item), {}, {
|
|
641
|
+
disabled: true
|
|
642
|
+
});
|
|
643
|
+
}) : baseItems;
|
|
608
644
|
return {
|
|
609
645
|
modalProps: _objectSpread(_objectSpread({
|
|
610
646
|
open: modalConfig.visible,
|
|
@@ -613,12 +649,13 @@ var forwardCRUD = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
613
649
|
}, modalFormProps === null || modalFormProps === void 0 ? void 0 : modalFormProps.modalProps), {}, {
|
|
614
650
|
title: isViewMode ? "".concat(modalTitle, "\u8BE6\u60C5") : modalConfig.mode === 'edit' ? "\u7F16\u8F91".concat(modalTitle) : "\u65B0\u589E".concat(modalTitle)
|
|
615
651
|
}),
|
|
616
|
-
formProps: _objectSpread({
|
|
652
|
+
formProps: _objectSpread(_objectSpread({
|
|
617
653
|
values: detailData || currentRecordRef.current || {},
|
|
618
654
|
disabled: isViewMode,
|
|
619
|
-
// 详情模式下禁用表单编辑
|
|
620
655
|
className: "".concat(classname, "-modalform-").concat(modalConfig.mode)
|
|
621
|
-
}, modalFormProps === null || modalFormProps === void 0 ? void 0 : modalFormProps.formProps)
|
|
656
|
+
}, modalFormProps === null || modalFormProps === void 0 ? void 0 : modalFormProps.formProps), {}, {
|
|
657
|
+
items: items
|
|
658
|
+
})
|
|
622
659
|
};
|
|
623
660
|
}, [modalConfig, detailData, handleCancel, handleModalOk, modalFormProps, classname]);
|
|
624
661
|
var onActions = useMemo(function () {
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -65,6 +65,6 @@ export type { AnimatedScrollListProps } from './AnimatedScrollList/interface';
|
|
|
65
65
|
export { default as DRangePicker } from './DRangePicker';
|
|
66
66
|
export type { DRangePickerProps } from './DRangePicker/interface';
|
|
67
67
|
export { default as CRUD } from './CRUD';
|
|
68
|
-
export { type CRUDProps, type CRUDRefProps, type MoreActionColumnRender } from './CRUD';
|
|
68
|
+
export { type CRUDProps, type CRUDRefProps, type MoreActionProps, type MoreActionColumnRender } from './CRUD';
|
|
69
69
|
export { default as DynamicFormItem } from './DynamicFormItem';
|
|
70
70
|
export type { DynamicFormItemProps } from './DynamicFormItem';
|