@teamix/pro 1.5.33 → 1.5.34
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/pro.all.min.css +1 -1
- package/dist/pro.css +1 -1
- package/dist/pro.js +755 -208
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/dist/pro.xconsole.min.css +1 -1
- package/es/form/Components/FormItem2/index.js +0 -1
- package/es/form/Components/SelectTable2/index.d.ts +97 -0
- package/es/form/Components/SelectTable2/index.js +39 -0
- package/es/form/ProForm/index.js +3 -1
- package/es/form/SchemaForm/adapterDecorator.js +1 -1
- package/es/form/SchemaForm/adapterType.js +2 -1
- package/es/global.scss +9 -0
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/table/components/Cell/index.d.ts +17 -0
- package/es/table/components/Cell/index.js +219 -0
- package/es/table/components/Layout/index.js +9 -7
- package/es/table/components/Pagination/index.d.ts +5 -4
- package/es/table/components/Pagination/index.js +5 -3
- package/es/table/components/TableContent/index.d.ts +7 -0
- package/es/table/components/TableContent/index.js +23 -0
- package/es/table/index.js +118 -126
- package/es/table/index.scss +1 -1
- package/es/table/typing.d.ts +9 -2
- package/es/table/utils/genAutoWidthColumns.d.ts +2 -2
- package/es/table/utils/genAutoWidthColumns.js +65 -16
- package/es/table/utils/genProColumnToColumn.js +39 -4
- package/es/table/utils/processColumns.d.ts +8 -0
- package/es/table/utils/processColumns.js +39 -0
- package/es/table/utils/useTableSelection.js +54 -5
- package/es/xconsole.scss +4 -4
- package/lib/form/Components/FormItem2/index.js +0 -1
- package/lib/form/Components/SelectTable2/index.d.ts +97 -0
- package/lib/form/Components/SelectTable2/index.js +47 -0
- package/lib/form/ProForm/index.js +3 -1
- package/lib/form/SchemaForm/adapterDecorator.js +1 -1
- package/lib/form/SchemaForm/adapterType.js +2 -1
- package/lib/global.scss +9 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/table/components/Cell/index.d.ts +17 -0
- package/lib/table/components/Cell/index.js +224 -0
- package/lib/table/components/Layout/index.js +8 -6
- package/lib/table/components/Pagination/index.d.ts +5 -4
- package/lib/table/components/Pagination/index.js +4 -2
- package/lib/table/components/TableContent/index.d.ts +7 -0
- package/lib/table/components/TableContent/index.js +34 -0
- package/lib/table/index.js +120 -128
- package/lib/table/index.scss +1 -1
- package/lib/table/typing.d.ts +9 -2
- package/lib/table/utils/genAutoWidthColumns.d.ts +2 -2
- package/lib/table/utils/genAutoWidthColumns.js +64 -15
- package/lib/table/utils/genProColumnToColumn.js +38 -3
- package/lib/table/utils/processColumns.d.ts +8 -0
- package/lib/table/utils/processColumns.js +46 -0
- package/lib/table/utils/useTableSelection.js +57 -5
- package/lib/xconsole.scss +4 -4
- package/package.json +1 -1
package/lib/table/index.js
CHANGED
@@ -8,17 +8,15 @@ exports.default = void 0;
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
9
9
|
var _components = require("@alicloudfe/components");
|
10
10
|
var _Pagination = _interopRequireDefault(require("./components/Pagination"));
|
11
|
+
var _TableContent = _interopRequireDefault(require("./components/TableContent"));
|
11
12
|
var _genProColumnToColumn = _interopRequireDefault(require("./utils/genProColumnToColumn"));
|
12
13
|
var _utils = require("@teamix/utils");
|
13
|
-
var _skeleton = require("../skeleton");
|
14
14
|
require("./index.scss");
|
15
15
|
var _Layout = _interopRequireDefault(require("./components/Layout"));
|
16
16
|
var _utils2 = require("./utils");
|
17
17
|
var _getTableProps = _interopRequireDefault(require("./utils/getTableProps"));
|
18
|
-
var _getTableSortIcons = _interopRequireDefault(require("./utils/getTableSortIcons"));
|
19
18
|
var _useTableSelection = _interopRequireDefault(require("./utils/useTableSelection"));
|
20
19
|
var _Fullscreen = _interopRequireDefault(require("./components/ToolBar/Fullscreen"));
|
21
|
-
var _proField = require("@teamix/pro-field");
|
22
20
|
var _actions = require("../actions");
|
23
21
|
var _classnames = _interopRequireDefault(require("classnames"));
|
24
22
|
var _pageContainer = _interopRequireDefault(require("../page-container"));
|
@@ -27,6 +25,7 @@ var _lodash = _interopRequireDefault(require("lodash.debounce"));
|
|
27
25
|
var _CardView = _interopRequireDefault(require("./components/CardView"));
|
28
26
|
var _hooks = require("@teamix/hooks");
|
29
27
|
var _util = require("./utils/util");
|
28
|
+
var _processColumns = _interopRequireDefault(require("./utils/processColumns"));
|
30
29
|
var _typing = require("./typing");
|
31
30
|
Object.keys(_typing).forEach(function (key) {
|
32
31
|
if (key === "default" || key === "__esModule") return;
|
@@ -49,6 +48,9 @@ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableTo
|
|
49
48
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
50
49
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
51
50
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
51
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
52
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
53
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
52
54
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
53
55
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
54
56
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
@@ -57,44 +59,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
57
59
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
58
60
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
59
61
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
60
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
61
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
62
|
-
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
63
62
|
var cls = (0, _utils.usePrefixCls)('teamix-pro-table');
|
64
|
-
/**
|
65
|
-
* 处理原生传入的 columns 以便于 选择列 方便处理
|
66
|
-
* @param columns 原生传入的 columns
|
67
|
-
* @returns
|
68
|
-
*/
|
69
|
-
var processColumns = function processColumns(columns, initialColumns) {
|
70
|
-
var _getGlobalConfig;
|
71
|
-
var globalFilterColumns = (_getGlobalConfig = (0, _utils.getGlobalConfig)('ProTable')) === null || _getGlobalConfig === void 0 ? void 0 : _getGlobalConfig.filterColumns;
|
72
|
-
var filterColumns = columns.filter(function (item) {
|
73
|
-
return item.columnFilters !== false && (item === null || item === void 0 ? void 0 : item.hidden) !== true && (!globalFilterColumns || globalFilterColumns(_objectSpread({}, item)));
|
74
|
-
});
|
75
|
-
// 处理只剩一列批量选择的情况下宽度错乱问题
|
76
|
-
if (filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) {
|
77
|
-
var _initialColumns$;
|
78
|
-
if ((filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) === 1) {
|
79
|
-
var _filterColumns$, _filterColumns$2;
|
80
|
-
if ((_filterColumns$ = filterColumns[0]) === null || _filterColumns$ === void 0 ? void 0 : _filterColumns$.width) {
|
81
|
-
delete filterColumns[0].width;
|
82
|
-
}
|
83
|
-
if ((_filterColumns$2 = filterColumns[0]) === null || _filterColumns$2 === void 0 ? void 0 : _filterColumns$2.lock) {
|
84
|
-
filterColumns[0].lock = false;
|
85
|
-
}
|
86
|
-
} else if (((_initialColumns$ = initialColumns[0]) === null || _initialColumns$ === void 0 ? void 0 : _initialColumns$.columnFilters) !== false) {
|
87
|
-
var _initialColumns$2, _initialColumns$3;
|
88
|
-
if ((_initialColumns$2 = initialColumns[0]) === null || _initialColumns$2 === void 0 ? void 0 : _initialColumns$2.width) {
|
89
|
-
filterColumns[0].width = initialColumns[0].width;
|
90
|
-
}
|
91
|
-
if ((_initialColumns$3 = initialColumns[0]) === null || _initialColumns$3 === void 0 ? void 0 : _initialColumns$3.lock) {
|
92
|
-
filterColumns[0].lock = initialColumns[0].lock;
|
93
|
-
}
|
94
|
-
}
|
95
|
-
}
|
96
|
-
return filterColumns;
|
97
|
-
};
|
98
63
|
/** 默认请求翻页参数 */
|
99
64
|
var globalPageKey = 'currentPage';
|
100
65
|
var globalPageSizeKey = 'pageSize';
|
@@ -219,7 +184,9 @@ var ProTable = function ProTable(props) {
|
|
219
184
|
_useState12 = _slicedToArray(_useState11, 2),
|
220
185
|
showSkeleton = _useState12[0],
|
221
186
|
setShowSkeleton = _useState12[1]; // 首次加载,渲染骨架屏
|
222
|
-
var skeletonDataSource =
|
187
|
+
var skeletonDataSource = (0, _react.useMemo)(function () {
|
188
|
+
return new Array(skeletonSize).fill({});
|
189
|
+
}, [skeletonSize]);
|
223
190
|
var requestDataKey = method.toLowerCase() === 'get' ? 'params' : 'data';
|
224
191
|
// 如果使用 customRequest 的话,内置 loading
|
225
192
|
var _useState13 = (0, _react.useState)(requestWhenMount),
|
@@ -229,14 +196,14 @@ var ProTable = function ProTable(props) {
|
|
229
196
|
var tableRef = (0, _react.useRef)(null);
|
230
197
|
var actionRef = (0, _react.useRef)();
|
231
198
|
// 传给 table 的过滤后的 columns
|
232
|
-
var _useState15 = (0, _react.useState)(
|
199
|
+
var _useState15 = (0, _react.useState)((0, _processColumns.default)(propsColumns !== null && propsColumns !== void 0 ? propsColumns : [], propsColumns)),
|
233
200
|
_useState16 = _slicedToArray(_useState15, 2),
|
234
201
|
filteredColumns = _useState16[0],
|
235
202
|
setFilteredColumns = _useState16[1];
|
236
203
|
// 全局状态 : 自适应表格
|
237
204
|
var autoWidth = (0, _react.useMemo)(function () {
|
238
|
-
var
|
239
|
-
return ((
|
205
|
+
var _getGlobalConfig;
|
206
|
+
return ((_getGlobalConfig = (0, _utils.getGlobalConfig)('ProTable')) === null || _getGlobalConfig === void 0 ? void 0 : _getGlobalConfig.autoWidth) || autoWidthProp;
|
240
207
|
}, [autoWidthProp]);
|
241
208
|
// 判断是否有操作列,有的话则渲染一个 shadow dom
|
242
209
|
var hasActionColumn = false;
|
@@ -426,8 +393,8 @@ var ProTable = function ProTable(props) {
|
|
426
393
|
});
|
427
394
|
// 全局状态 : 大数据截断
|
428
395
|
var globalUseMaxData = (0, _react.useMemo)(function () {
|
429
|
-
var
|
430
|
-
return (
|
396
|
+
var _getGlobalConfig2;
|
397
|
+
return (_getGlobalConfig2 = (0, _utils.getGlobalConfig)('ProTable')) === null || _getGlobalConfig2 === void 0 ? void 0 : _getGlobalConfig2.useMaxData;
|
431
398
|
}, []);
|
432
399
|
// 非全屏状态下的
|
433
400
|
var normalDataFilterFormRef = (0, _react.useRef)();
|
@@ -474,7 +441,9 @@ var ProTable = function ProTable(props) {
|
|
474
441
|
if (showSkeleton && result) {
|
475
442
|
result.disabled = true;
|
476
443
|
}
|
477
|
-
return
|
444
|
+
return _objectSpread({
|
445
|
+
_primaryKey: props.primaryKey
|
446
|
+
}, result);
|
478
447
|
},
|
479
448
|
titleProps: function titleProps() {
|
480
449
|
var result = {};
|
@@ -541,14 +510,25 @@ var ProTable = function ProTable(props) {
|
|
541
510
|
}, [propsActionRef]);
|
542
511
|
(0, _react.useEffect)(function () {
|
543
512
|
var _actionRef$current, _actionRef$current$se;
|
544
|
-
var columns =
|
513
|
+
var columns = (0, _processColumns.default)(propsColumns !== null && propsColumns !== void 0 ? propsColumns : [], propsColumns);
|
545
514
|
setFilteredColumns(columns);
|
546
515
|
(_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$se = _actionRef$current.setState) === null || _actionRef$current$se === void 0 ? void 0 : _actionRef$current$se.call(_actionRef$current, 'filterColumns', columns);
|
516
|
+
if (autoWidth) {
|
517
|
+
reGenFilteredColumnsByAutoWidth(columns);
|
518
|
+
}
|
547
519
|
}, [propsColumns]);
|
548
520
|
// dataSource 受控
|
549
521
|
(0, _react.useEffect)(function () {
|
550
522
|
if (propsDataSource) {
|
551
523
|
_setData(propsDataSource);
|
524
|
+
if (autoWidth) {
|
525
|
+
(0, _genAutoWidthColumns.shadowContainer)({
|
526
|
+
columns: filteredColumns,
|
527
|
+
data: propsDataSource,
|
528
|
+
shadowContainerRef: shadowContainerRef
|
529
|
+
});
|
530
|
+
reGenFilteredColumnsByAutoWidth();
|
531
|
+
}
|
552
532
|
}
|
553
533
|
}, [propsDataSource]);
|
554
534
|
// 初始化 ActionRef。
|
@@ -600,7 +580,7 @@ var ProTable = function ProTable(props) {
|
|
600
580
|
setColumn: function setColumn(newColumns) {
|
601
581
|
var _actionRef$current3, _actionRef$current3$s;
|
602
582
|
var update = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
603
|
-
var columns =
|
583
|
+
var columns = (0, _processColumns.default)(newColumns, propsColumns);
|
604
584
|
setFilteredColumns(columns);
|
605
585
|
(_actionRef$current3 = actionRef.current) === null || _actionRef$current3 === void 0 ? void 0 : (_actionRef$current3$s = _actionRef$current3.setState) === null || _actionRef$current3$s === void 0 ? void 0 : _actionRef$current3$s.call(_actionRef$current3, 'filterColumns', columns);
|
606
586
|
if (update) {
|
@@ -766,7 +746,9 @@ var ProTable = function ProTable(props) {
|
|
766
746
|
if (Number.isInteger(time) && time >= 1000) {
|
767
747
|
autoRefreshTimerRef.current = setTimeout(function () {
|
768
748
|
// 自动刷新不显示 loading
|
769
|
-
|
749
|
+
// 当表格自适应时,自动刷新要显示 loading ,否则表格自适应会出问题
|
750
|
+
// setShowLoading(true)
|
751
|
+
_request({}, !autoWidth);
|
770
752
|
}, Number(time));
|
771
753
|
(0, _utils2.emit)('PRO_TABLE_REFRESH_TIMER_FLAG', Number(time));
|
772
754
|
}
|
@@ -851,7 +833,7 @@ var ProTable = function ProTable(props) {
|
|
851
833
|
}
|
852
834
|
});
|
853
835
|
// 请求函数
|
854
|
-
|
836
|
+
var _request = (0, _react.useCallback)(function (params, noLoading, filterParams, isReset) {
|
855
837
|
var _dataFilterFormRef$cu2, _actionRef$current$ge, _actionRef$current6, _actionRef$current6$g, _objectSpread3;
|
856
838
|
// 首次渲染表格,获取 urlState 上的 表头 filter 数据
|
857
839
|
if (bindUrl && (bindUrlProps === null || bindUrlProps === void 0 ? void 0 : bindUrlProps.headerFilters) !== false && dataRef.current.flag) {
|
@@ -955,7 +937,7 @@ var ProTable = function ProTable(props) {
|
|
955
937
|
if (Number.isInteger(time) && time >= 1000) {
|
956
938
|
autoRefreshTimerRef.current = setTimeout(function () {
|
957
939
|
// 自动刷新不显示 loading
|
958
|
-
_request(params,
|
940
|
+
_request(params, !autoWidth);
|
959
941
|
}, Number(time));
|
960
942
|
(0, _utils2.emit)('PRO_TABLE_REFRESH_TIMER_FLAG', Number(time));
|
961
943
|
}
|
@@ -966,57 +948,68 @@ var ProTable = function ProTable(props) {
|
|
966
948
|
getData.run(requestData);
|
967
949
|
}
|
968
950
|
}
|
969
|
-
}
|
970
|
-
|
951
|
+
}, [bindUrl, bindUrlProps, dataRef, url, customRequest, currentPage, pageSize, propsParams]);
|
952
|
+
var onSort = (0, _react.useCallback)(function (dataIndex, order) {
|
971
953
|
var nextSort = _defineProperty({}, dataIndex, order);
|
972
954
|
setSort(nextSort);
|
973
955
|
_request(targetFormatSort(nextSort));
|
974
|
-
}
|
956
|
+
}, [_request, targetFormatSort]);
|
975
957
|
// 处理 dataFilter 中的 onFilter、onReset
|
976
|
-
var dataFilter =
|
977
|
-
|
978
|
-
|
979
|
-
|
980
|
-
|
981
|
-
|
982
|
-
|
983
|
-
|
984
|
-
|
985
|
-
|
986
|
-
|
987
|
-
|
988
|
-
|
989
|
-
|
990
|
-
|
991
|
-
filterEnableRef.current.fullscreen
|
992
|
-
|
993
|
-
|
994
|
-
|
995
|
-
|
996
|
-
filterEnableRef.current.normal
|
997
|
-
|
958
|
+
var dataFilter = (0, _react.useMemo)(function () {
|
959
|
+
return _objectSpread(_objectSpread({
|
960
|
+
mode: 'inline',
|
961
|
+
forceClear: true
|
962
|
+
}, propsDataFilter), {}, {
|
963
|
+
onInit: (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onInit) || requestWhenMount ? function (values) {
|
964
|
+
var _propsDataFilter$onIn;
|
965
|
+
// 表单初始化请求处理
|
966
|
+
propsDataFilter === null || propsDataFilter === void 0 ? void 0 : (_propsDataFilter$onIn = propsDataFilter.onInit) === null || _propsDataFilter$onIn === void 0 ? void 0 : _propsDataFilter$onIn.call(propsDataFilter, values);
|
967
|
+
!fullscreenState && requestWhenMount && _request({}, false, values);
|
968
|
+
return true;
|
969
|
+
} : undefined,
|
970
|
+
onFilter: function onFilter(values) {
|
971
|
+
var _actionRef$current7, _actionRef$current7$c;
|
972
|
+
// 全屏状态,判断全屏表单onFilter是否禁用
|
973
|
+
if (fullscreenState && !filterEnableRef.current.fullscreen) {
|
974
|
+
filterEnableRef.current.fullscreen = true;
|
975
|
+
return;
|
976
|
+
}
|
977
|
+
// 非全屏状态,判断普通表单onFiler是否禁用
|
978
|
+
if (!fullscreenState && !filterEnableRef.current.normal) {
|
979
|
+
filterEnableRef.current.normal = true;
|
980
|
+
return;
|
981
|
+
}
|
982
|
+
(propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter(values));
|
983
|
+
// 搜索变化时,暂时先清空选择
|
984
|
+
(_actionRef$current7 = actionRef.current) === null || _actionRef$current7 === void 0 ? void 0 : (_actionRef$current7$c = _actionRef$current7.clearRowSelection) === null || _actionRef$current7$c === void 0 ? void 0 : _actionRef$current7$c.call(_actionRef$current7);
|
985
|
+
setCurrentPage(1);
|
986
|
+
_request(_defineProperty({}, targetPageKey, 1), false, values);
|
987
|
+
},
|
988
|
+
onReset: function onReset(values) {
|
989
|
+
var _dataFilterFormRef$cu3;
|
990
|
+
(propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset());
|
991
|
+
(_dataFilterFormRef$cu3 = dataFilterFormRef.current) === null || _dataFilterFormRef$cu3 === void 0 ? void 0 : _dataFilterFormRef$cu3.reset();
|
992
|
+
setCurrentPage(1);
|
993
|
+
_request(_defineProperty({}, targetPageKey, 1), false, values);
|
998
994
|
}
|
999
|
-
|
1000
|
-
|
1001
|
-
|
1002
|
-
setCurrentPage(1);
|
1003
|
-
_request(_defineProperty({}, targetPageKey, 1), false, values);
|
1004
|
-
},
|
1005
|
-
onReset: function onReset(values) {
|
1006
|
-
var _dataFilterFormRef$cu3;
|
1007
|
-
(propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onReset());
|
1008
|
-
(_dataFilterFormRef$cu3 = dataFilterFormRef.current) === null || _dataFilterFormRef$cu3 === void 0 ? void 0 : _dataFilterFormRef$cu3.reset();
|
1009
|
-
setCurrentPage(1);
|
1010
|
-
_request(_defineProperty({}, targetPageKey, 1), false, values);
|
1011
|
-
}
|
1012
|
-
});
|
1013
|
-
var getTableLoading = function getTableLoading() {
|
995
|
+
});
|
996
|
+
}, [propsDataFilter, fullscreenState, filterEnableRef, actionRef]);
|
997
|
+
var isLoading = (0, _react.useMemo)(function () {
|
1014
998
|
if (!customRequest) {
|
1015
999
|
return showLoading && !showSkeleton && (getData.loading || props.loading);
|
1016
1000
|
} else {
|
1017
1001
|
return showLoading && !showSkeleton && (customTableLoading || props.loading);
|
1018
1002
|
}
|
1019
|
-
};
|
1003
|
+
}, [customRequest, showLoading, showSkeleton, customTableLoading, props.loading, getData]);
|
1004
|
+
(0, _react.useEffect)(function () {
|
1005
|
+
if (autoWidth) {
|
1006
|
+
reGenFilteredColumnsByAutoWidth();
|
1007
|
+
}
|
1008
|
+
}, [shadowContainerRef === null || shadowContainerRef === void 0 ? void 0 : shadowContainerRef.current]);
|
1009
|
+
var memorizedGenProColumnToColumn = (0, _react.useMemo)(function () {
|
1010
|
+
var result = (0, _genProColumnToColumn.default)(filteredColumns, showSkeleton, actionRef, context, dataTeamixSpm, bindUrl, bindUrlProps);
|
1011
|
+
return result;
|
1012
|
+
}, [filteredColumns, showSkeleton, actionRef, context, dataTeamixSpm, bindUrl, bindUrlProps]);
|
1020
1013
|
var renderTable = function renderTable(isFullScreen) {
|
1021
1014
|
if (propsColumns) {
|
1022
1015
|
return /*#__PURE__*/_react.default.createElement("div", {
|
@@ -1043,11 +1036,15 @@ var ProTable = function ProTable(props) {
|
|
1043
1036
|
autoRefreshProps: autoRefreshProps,
|
1044
1037
|
bindUrlProps: bindUrlProps,
|
1045
1038
|
bindUrl: bindUrl
|
1046
|
-
}),
|
1039
|
+
}), autoWidth && (0, _genAutoWidthColumns.shadowContainer)({
|
1040
|
+
columns: filteredColumns,
|
1041
|
+
data: data,
|
1042
|
+
shadowContainerRef: shadowContainerRef
|
1043
|
+
}), hasActionColumn && (0, _genAutoWidthColumns.shadowActionColumnContainer)(filteredColumns, shadowActionColumnContainerRef), switchViewState === 'table' && /*#__PURE__*/_react.default.createElement(_TableContent.default, _objectSpread({
|
1047
1044
|
hasBorder: false,
|
1048
1045
|
dataSource: showSkeleton ? skeletonDataSource : data || props.dataSource,
|
1049
|
-
columns:
|
1050
|
-
loading:
|
1046
|
+
columns: memorizedGenProColumnToColumn,
|
1047
|
+
loading: isLoading,
|
1051
1048
|
className: (0, _classnames.default)('teamix-pro-table', tableClassName, {
|
1052
1049
|
'with-row-select': rowSelection,
|
1053
1050
|
'teamix-pro-tree-table': isTree
|
@@ -1058,14 +1055,12 @@ var ProTable = function ProTable(props) {
|
|
1058
1055
|
sort: sort,
|
1059
1056
|
primaryKey: primaryKey,
|
1060
1057
|
rowSelection: rowSelection,
|
1061
|
-
emptyContent: /*#__PURE__*/_react.default.createElement(_proField.EmptyContent, _objectSpread({}, emptyProps)),
|
1062
|
-
sortIcons: (0, _getTableSortIcons.default)(),
|
1063
1058
|
fixedHeader: fullscreenState || fixedTableBody,
|
1064
1059
|
maxBodyHeight: "calc(100vh - ".concat(headerHeight, "px)")
|
1065
1060
|
}, (0, _utils.pickProps)((0, _getTableProps.default)(), otherProps))), switchViewState === 'card' && /*#__PURE__*/_react.default.createElement(_CardView.default, {
|
1066
1061
|
dataSource: showSkeleton ? skeletonDataSource : data || props.dataSource,
|
1067
1062
|
showSkeleton: showSkeleton,
|
1068
|
-
loading:
|
1063
|
+
loading: isLoading,
|
1069
1064
|
originColumns: propsColumns,
|
1070
1065
|
cardViewProps: cardViewProps,
|
1071
1066
|
scrollHeight: fullscreenState || fixedTableBody ? "calc(100vh - ".concat(headerHeight, "px)") : undefined,
|
@@ -1107,34 +1102,33 @@ var ProTable = function ProTable(props) {
|
|
1107
1102
|
})));
|
1108
1103
|
} else return footerAction;
|
1109
1104
|
};
|
1110
|
-
var
|
1111
|
-
|
1112
|
-
|
1113
|
-
|
1114
|
-
|
1115
|
-
|
1116
|
-
|
1117
|
-
}
|
1118
|
-
setCurrentPage(currentPage);
|
1119
|
-
_request(_objectSpread(_defineProperty({}, targetPageKey, currentPage), params));
|
1105
|
+
var onChangePagination = (0, _react.useCallback)(function (currentPage) {
|
1106
|
+
var _objectSpread4;
|
1107
|
+
var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
1108
|
+
// 翻页默认清空选择
|
1109
|
+
if (!reserveSelectedRecords) {
|
1110
|
+
var _actionRef$current8, _actionRef$current8$c;
|
1111
|
+
(_actionRef$current8 = actionRef.current) === null || _actionRef$current8 === void 0 ? void 0 : (_actionRef$current8$c = _actionRef$current8.clearRowSelection) === null || _actionRef$current8$c === void 0 ? void 0 : _actionRef$current8$c.call(_actionRef$current8);
|
1120
1112
|
}
|
1121
|
-
|
1122
|
-
|
1123
|
-
|
1124
|
-
|
1125
|
-
|
1126
|
-
|
1127
|
-
|
1128
|
-
|
1129
|
-
|
1130
|
-
_request((_request10 = {}, _defineProperty(_request10, targetPageSizeKey, currentPageSize), _defineProperty(_request10, targetPageKey, 1), _request10));
|
1113
|
+
setCurrentPage(currentPage);
|
1114
|
+
_request(_objectSpread((_objectSpread4 = {}, _defineProperty(_objectSpread4, targetPageKey, currentPage), _defineProperty(_objectSpread4, "pageSize", pageSize), _objectSpread4), params));
|
1115
|
+
}, [reserveSelectedRecords, targetPageKey, actionRef, pageSize]);
|
1116
|
+
var onChangePaginationSize = (0, _react.useCallback)(function (currentPageSize) {
|
1117
|
+
var _request10;
|
1118
|
+
// 翻页默认清空选择
|
1119
|
+
if (!reserveSelectedRecords) {
|
1120
|
+
var _actionRef$current9, _actionRef$current9$c;
|
1121
|
+
(_actionRef$current9 = actionRef.current) === null || _actionRef$current9 === void 0 ? void 0 : (_actionRef$current9$c = _actionRef$current9.clearRowSelection) === null || _actionRef$current9$c === void 0 ? void 0 : _actionRef$current9$c.call(_actionRef$current9);
|
1131
1122
|
}
|
1123
|
+
setPageSize(currentPageSize);
|
1124
|
+
setCurrentPage(1);
|
1125
|
+
_request((_request10 = {}, _defineProperty(_request10, targetPageSizeKey, currentPageSize), _defineProperty(_request10, targetPageKey, 1), _request10));
|
1126
|
+
}, [reserveSelectedRecords, actionRef, targetPageSizeKey, targetPageKey, currentPage]);
|
1127
|
+
var renderFooter = function renderFooter() {
|
1132
1128
|
function renderRowSelection() {
|
1133
1129
|
if (rowSelection) {
|
1134
1130
|
if (showSkeleton) {
|
1135
|
-
return
|
1136
|
-
className: cls('footer-left-wrapper')
|
1137
|
-
}, /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Footer.Operation, null));
|
1131
|
+
return null;
|
1138
1132
|
} else {
|
1139
1133
|
return /*#__PURE__*/_react.default.createElement("div", {
|
1140
1134
|
className: cls('footer-left-wrapper')
|
@@ -1148,9 +1142,7 @@ var ProTable = function ProTable(props) {
|
|
1148
1142
|
}
|
1149
1143
|
} else if (footerAction) {
|
1150
1144
|
if (showSkeleton) {
|
1151
|
-
return
|
1152
|
-
className: cls('footer-left-wrapper')
|
1153
|
-
}, /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Footer.Operation, null));
|
1145
|
+
return null;
|
1154
1146
|
} else {
|
1155
1147
|
return /*#__PURE__*/_react.default.createElement("div", {
|
1156
1148
|
className: cls('footer-left-wrapper')
|
@@ -1171,7 +1163,7 @@ var ProTable = function ProTable(props) {
|
|
1171
1163
|
})
|
1172
1164
|
}, renderRowSelection(), /*#__PURE__*/_react.default.createElement("div", {
|
1173
1165
|
className: cls('footer-right-wrapper')
|
1174
|
-
}, showSkeleton ?
|
1166
|
+
}, showSkeleton ? null : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, data.length > 0 && /*#__PURE__*/_react.default.createElement(_Pagination.default, _objectSpread({
|
1175
1167
|
className: cls('pagination'),
|
1176
1168
|
onChange: function onChange(number, e) {
|
1177
1169
|
onChangePagination(number);
|
@@ -1199,7 +1191,7 @@ var ProTable = function ProTable(props) {
|
|
1199
1191
|
})
|
1200
1192
|
}, renderRowSelection(), /*#__PURE__*/_react.default.createElement("div", {
|
1201
1193
|
className: cls('footer-right-wrapper')
|
1202
|
-
}, showSkeleton ?
|
1194
|
+
}, showSkeleton ? null : footer));
|
1203
1195
|
}
|
1204
1196
|
};
|
1205
1197
|
// 判断是否需要吸底
|
@@ -1226,7 +1218,7 @@ var ProTable = function ProTable(props) {
|
|
1226
1218
|
// 'footer-suction': footerSuctionState && footerSuction,
|
1227
1219
|
}),
|
1228
1220
|
ref: tableRef
|
1229
|
-
},
|
1221
|
+
}, autoWidth && (0, _genAutoWidthColumns.shadowContainer)({
|
1230
1222
|
columns: filteredColumns,
|
1231
1223
|
data: data,
|
1232
1224
|
shadowContainerRef: shadowContainerRef
|
package/lib/table/index.scss
CHANGED
package/lib/table/typing.d.ts
CHANGED
@@ -24,6 +24,8 @@ declare type TDataService = {
|
|
24
24
|
};
|
25
25
|
export declare type responsivePaginationType = 'mini' | 'small' | 'simple' | 'normal';
|
26
26
|
export declare type ProTableColumnProps = {
|
27
|
+
/** 是否开启了自动计算宽度 */
|
28
|
+
isAutoWidth?: boolean;
|
27
29
|
/** 自动计算宽度时的被挤占的情况 */
|
28
30
|
shrink?: number;
|
29
31
|
/** 是否自动适应该列宽度 */
|
@@ -182,7 +184,8 @@ export declare type ProTableProps = {
|
|
182
184
|
autoRedirect?: boolean;
|
183
185
|
/** 使用超大数据模式 **/
|
184
186
|
useMaxData?: boolean;
|
185
|
-
|
187
|
+
rowSelection?: rowSelectionType;
|
188
|
+
} & Omit<TableProps, 'columns' | 'rowSelection'> & ProTableTopAreaProps;
|
186
189
|
export declare type rowSelectionType = {
|
187
190
|
getProps?: (record: any, index: number) => any;
|
188
191
|
onChange?: (selectedRowKeys: Array<any>, records: Array<any>) => void;
|
@@ -194,7 +197,11 @@ export declare type rowSelectionType = {
|
|
194
197
|
titleProps?: () => any;
|
195
198
|
columnProps?: () => any;
|
196
199
|
titleAddons?: () => any;
|
197
|
-
|
200
|
+
/** 默认选中的 Key 值 **/
|
201
|
+
defaultSelectedRowKeys?: any[];
|
202
|
+
/** 默认选中的 record 值 **/
|
203
|
+
defaultSelectedRecords?: any[];
|
204
|
+
} & TableProps['rowSelection'];
|
198
205
|
export declare type innerRowSelectionType = {
|
199
206
|
rowSelection: rowSelectionType;
|
200
207
|
selectedRowKeys: string[];
|
@@ -6,13 +6,13 @@ import { ProTableColumnProps, ITableCellRender } from '../typing';
|
|
6
6
|
* @param data
|
7
7
|
* @returns
|
8
8
|
*/
|
9
|
-
export declare function genAutoWidthColumns(
|
9
|
+
export declare function genAutoWidthColumns(columns: ProTableColumnProps[], ref: MutableRefObject<HTMLDivElement | null>, data: any[], size: 'small' | 'medium', useRowSelection?: boolean | undefined, actionColumnRef?: MutableRefObject<HTMLDivElement | null>): ProTableColumnProps[];
|
10
10
|
interface IShadowContainerProps {
|
11
11
|
columns: ProTableColumnProps[];
|
12
12
|
data: any[];
|
13
13
|
shadowContainerRef: MutableRefObject<null>;
|
14
14
|
}
|
15
|
-
export declare const shadowContainer: (props: IShadowContainerProps) => JSX.Element;
|
15
|
+
export declare const shadowContainer: (props: IShadowContainerProps) => JSX.Element | null;
|
16
16
|
export declare const shadowActionColumnContainer: (columns: ProTableColumnProps[], shadowActionColumnContainerRef: MutableRefObject<null>) => JSX.Element | undefined;
|
17
17
|
export declare const computeableWidthTypeList: {
|
18
18
|
dateTime: (data: any[], render: ITableCellRender) => any;
|