@teamix/pro 1.2.21 → 1.2.22
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.css +1 -1
- package/dist/pro.js +1506 -334
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/dialog.js +10 -21
- package/es/actions/index.d.ts +10 -0
- package/es/actions/index.js +11 -16
- package/es/form/Filter/AdvancedFilter.js +1 -0
- package/es/form/ProForm/index.scss +37 -6
- package/es/form/global.scss +1 -0
- package/es/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/table/components/Layout/index.js +21 -12
- package/es/table/components/Pagination/index.d.ts +1 -0
- package/es/table/components/Pagination/index.js +81 -9
- package/es/table/components/Pagination/index.scss +22 -0
- package/es/table/components/ToolBar/FilterColumnIcon.js +24 -3
- package/es/table/components/ToolBar/index.scss +9 -4
- package/es/table/index.js +72 -21
- package/es/table/index.scss +1 -1
- package/es/table/typing.d.ts +4 -2
- package/es/table/utils/columnRender.js +2 -1
- package/es/table/utils/index.d.ts +7 -0
- package/es/table/utils/index.js +38 -4
- package/lib/actions/dialog.js +9 -20
- package/lib/actions/index.d.ts +10 -0
- package/lib/actions/index.js +11 -16
- package/lib/form/Filter/AdvancedFilter.js +1 -0
- package/lib/form/ProForm/index.scss +37 -6
- package/lib/form/global.scss +1 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/table/components/Layout/index.js +20 -11
- package/lib/table/components/Pagination/index.d.ts +1 -0
- package/lib/table/components/Pagination/index.js +88 -9
- package/lib/table/components/Pagination/index.scss +22 -0
- package/lib/table/components/ToolBar/FilterColumnIcon.js +23 -2
- package/lib/table/components/ToolBar/index.scss +9 -4
- package/lib/table/index.js +71 -20
- package/lib/table/index.scss +1 -1
- package/lib/table/typing.d.ts +4 -2
- package/lib/table/utils/columnRender.js +2 -1
- package/lib/table/utils/index.d.ts +7 -0
- package/lib/table/utils/index.js +46 -4
- package/package.json +1 -1
@@ -1,19 +1,27 @@
|
|
1
1
|
"use strict";
|
2
2
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
4
|
+
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
4
6
|
value: true
|
5
7
|
});
|
6
8
|
exports.default = void 0;
|
7
9
|
|
8
|
-
var _react =
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
9
11
|
|
10
12
|
var _components = require("@alicloudfe/components");
|
11
13
|
|
14
|
+
var _utils = require("@teamix/utils");
|
15
|
+
|
12
16
|
var _hooks = require("@teamix/hooks");
|
13
17
|
|
18
|
+
require("./index.scss");
|
19
|
+
|
14
20
|
var _excluded = ["className", "onChange", "total", "totalRender", "pageSize", "current", "pageSizeList", "pageSizeSelector", "type", "onPageSizeChange"];
|
15
21
|
|
16
|
-
function
|
22
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
23
|
+
|
24
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
17
25
|
|
18
26
|
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; }
|
19
27
|
|
@@ -21,10 +29,24 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
21
29
|
|
22
30
|
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; }
|
23
31
|
|
32
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
33
|
+
|
34
|
+
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."); }
|
35
|
+
|
36
|
+
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); }
|
37
|
+
|
38
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
39
|
+
|
40
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
41
|
+
|
42
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
43
|
+
|
24
44
|
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; }
|
25
45
|
|
26
46
|
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; }
|
27
47
|
|
48
|
+
var cls = (0, _utils.baseClass)('teamix-pro-pagination');
|
49
|
+
|
28
50
|
var _default = function _default(props) {
|
29
51
|
var className = props.className,
|
30
52
|
onChange = props.onChange,
|
@@ -38,16 +60,20 @@ var _default = function _default(props) {
|
|
38
60
|
onPageSizeChange = props.onPageSizeChange,
|
39
61
|
otherProps = _objectWithoutProperties(props, _excluded);
|
40
62
|
|
41
|
-
var _useResponsiveProps = (0, _hooks.useResponsiveProps)([480,
|
63
|
+
var _useResponsiveProps = (0, _hooks.useResponsiveProps)([480, 590, 700], ['mini', 'small', 'simple', 'normal']),
|
42
64
|
responsiveProps = _useResponsiveProps.responsiveProps,
|
43
65
|
paginationWrapperRef = _useResponsiveProps.ref;
|
44
66
|
|
67
|
+
var _useState = (0, _react.useState)(false),
|
68
|
+
_useState2 = _slicedToArray(_useState, 2),
|
69
|
+
visible = _useState2[0],
|
70
|
+
setVisible = _useState2[1];
|
71
|
+
|
45
72
|
var commonPaginationProps = {
|
46
73
|
className: className,
|
47
74
|
onChange: onChange,
|
48
75
|
total: total,
|
49
76
|
pageSize: pageSize,
|
50
|
-
current: current,
|
51
77
|
shape: 'arrow-only',
|
52
78
|
pageSizeList: pageSizeList,
|
53
79
|
pageSizeSelector: pageSizeSelector,
|
@@ -55,26 +81,79 @@ var _default = function _default(props) {
|
|
55
81
|
onPageSizeChange: onPageSizeChange
|
56
82
|
};
|
57
83
|
|
84
|
+
var customTotalRender = function customTotalRender(total) {
|
85
|
+
return /*#__PURE__*/_react.default.createElement(_components.Balloon, {
|
86
|
+
visible: visible,
|
87
|
+
closable: false,
|
88
|
+
onVisibleChange: function onVisibleChange(visible) {
|
89
|
+
return setVisible(visible);
|
90
|
+
},
|
91
|
+
align: "t",
|
92
|
+
// triggerType="click"
|
93
|
+
trigger: /*#__PURE__*/_react.default.createElement(_components.Button, {
|
94
|
+
text: true,
|
95
|
+
onMouseEnter: function onMouseEnter() {
|
96
|
+
return setVisible(true);
|
97
|
+
}
|
98
|
+
}, (0, _utils.getMessage)('total', {
|
99
|
+
total: total
|
100
|
+
}))
|
101
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
102
|
+
className: cls('custom-total-content')
|
103
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
104
|
+
className: "title"
|
105
|
+
}, (0, _utils.getMessage)('pageSize')), /*#__PURE__*/_react.default.createElement(_components.Select, {
|
106
|
+
className: cls('custom-page-size-selector'),
|
107
|
+
dataSource: pageSizeList,
|
108
|
+
defaultValue: pageSize,
|
109
|
+
followTrigger: true,
|
110
|
+
menuProps: {
|
111
|
+
hasSelectedIcon: false
|
112
|
+
},
|
113
|
+
onChange: function onChange(value) {
|
114
|
+
setVisible(false);
|
115
|
+
onPageSizeChange === null || onPageSizeChange === void 0 ? void 0 : onPageSizeChange(value);
|
116
|
+
}
|
117
|
+
})));
|
118
|
+
};
|
119
|
+
|
58
120
|
var renderPagination = function renderPagination() {
|
59
121
|
switch (responsiveProps) {
|
60
122
|
case 'normal':
|
61
|
-
return /*#__PURE__*/_react.default.createElement(_components.Pagination, _objectSpread(_objectSpread({}, commonPaginationProps),
|
123
|
+
return /*#__PURE__*/_react.default.createElement(_components.Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
124
|
+
totalRender: function totalRender(total) {
|
125
|
+
return (0, _utils.getMessage)('total', {
|
126
|
+
total: total
|
127
|
+
});
|
128
|
+
}
|
129
|
+
}, otherProps));
|
62
130
|
|
63
131
|
case 'simple':
|
64
132
|
return /*#__PURE__*/_react.default.createElement(_components.Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
65
|
-
pageShowCount: 3
|
133
|
+
pageShowCount: 3,
|
134
|
+
totalRender: function totalRender(total) {
|
135
|
+
return (0, _utils.getMessage)('total', {
|
136
|
+
total: total
|
137
|
+
});
|
138
|
+
}
|
66
139
|
}, otherProps));
|
67
140
|
|
68
141
|
case 'small':
|
69
142
|
return /*#__PURE__*/_react.default.createElement(_components.Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
143
|
+
pageShowCount: 3,
|
70
144
|
pageSizeSelector: false,
|
71
|
-
|
145
|
+
totalRender: function totalRender(total) {
|
146
|
+
return customTotalRender(total);
|
147
|
+
}
|
72
148
|
}, otherProps));
|
73
149
|
|
74
150
|
case 'mini':
|
75
151
|
return /*#__PURE__*/_react.default.createElement(_components.Pagination, _objectSpread(_objectSpread({}, commonPaginationProps), {}, {
|
76
152
|
pageSizeSelector: false,
|
77
|
-
|
153
|
+
totalRender: function totalRender(total) {
|
154
|
+
return customTotalRender(total);
|
155
|
+
},
|
156
|
+
type: "simple"
|
78
157
|
}, otherProps));
|
79
158
|
|
80
159
|
default:
|
@@ -87,7 +166,7 @@ var _default = function _default(props) {
|
|
87
166
|
// 用于获取翻页器响应式 ref
|
88
167
|
_react.default.createElement("div", {
|
89
168
|
ref: paginationWrapperRef,
|
90
|
-
className:
|
169
|
+
className: cls('wrapper')
|
91
170
|
}, renderPagination())
|
92
171
|
);
|
93
172
|
};
|
@@ -0,0 +1,22 @@
|
|
1
|
+
$prefix: 'teamix-pro-pagination';
|
2
|
+
|
3
|
+
.#{$prefix} {
|
4
|
+
&-custom-total {
|
5
|
+
&-content {
|
6
|
+
display: flex;
|
7
|
+
align-items: center;
|
8
|
+
.next-menu {
|
9
|
+
min-width: 56px !important;
|
10
|
+
.next-menu-item.next-select-menu-item {
|
11
|
+
padding: 0 8px !important;
|
12
|
+
}
|
13
|
+
}
|
14
|
+
}
|
15
|
+
}
|
16
|
+
&-custom-page-size-selector.next-select-trigger {
|
17
|
+
min-width: 56px;
|
18
|
+
.next-select-inner {
|
19
|
+
min-width: 56px;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
}
|
@@ -102,6 +102,26 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
102
102
|
dropdownVisible = _useState10[0],
|
103
103
|
setDropdownVisible = _useState10[1];
|
104
104
|
|
105
|
+
(0, _react.useEffect)(function () {
|
106
|
+
_utils2.on === null || _utils2.on === void 0 ? void 0 : (0, _utils2.on)(function (stateFilterColumns) {
|
107
|
+
if (stateFilterColumns && stateFilterColumns.length > 0) {
|
108
|
+
var showDataIndex = stateFilterColumns.map(function (item) {
|
109
|
+
return item.dataIndex;
|
110
|
+
});
|
111
|
+
var stateColumns = (0, _utils2.cloneDeep)(processColumns(columns)).map(function (item) {
|
112
|
+
if (!showDataIndex.includes(item.dataIndex)) {
|
113
|
+
item.columnFilters = false;
|
114
|
+
}
|
115
|
+
|
116
|
+
return item;
|
117
|
+
});
|
118
|
+
setNewColumns(stateColumns);
|
119
|
+
}
|
120
|
+
}, 'refreshFilterState');
|
121
|
+
return function () {
|
122
|
+
(0, _utils2.off)('refreshFilterState');
|
123
|
+
};
|
124
|
+
});
|
105
125
|
(0, _react.useEffect)(function () {
|
106
126
|
setNewColumns(processColumns(columns));
|
107
127
|
}, [columns]); // 全选
|
@@ -213,7 +233,7 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
213
233
|
|
214
234
|
calculateSelectAllState(columns);
|
215
235
|
setNewColumns(columns);
|
216
|
-
(_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$se = _actionRef$current.setColumn) === null || _actionRef$current$se === void 0 ? void 0 : _actionRef$current$se.call(_actionRef$current, columns);
|
236
|
+
(_actionRef$current = actionRef.current) === null || _actionRef$current === void 0 ? void 0 : (_actionRef$current$se = _actionRef$current.setColumn) === null || _actionRef$current$se === void 0 ? void 0 : _actionRef$current$se.call(_actionRef$current, columns, false);
|
217
237
|
}; // 计算全选状态
|
218
238
|
|
219
239
|
|
@@ -334,7 +354,8 @@ var FilterColumnIcon = function FilterColumnIcon(props) {
|
|
334
354
|
onOk: onChangeColumnsForDialog,
|
335
355
|
onCancel: dialogOnClose,
|
336
356
|
onClose: dialogOnClose,
|
337
|
-
width: 480
|
357
|
+
width: 480,
|
358
|
+
className: cls('dialog')
|
338
359
|
}, /*#__PURE__*/_react.default.createElement(Row, {
|
339
360
|
gutter: 20,
|
340
361
|
wrap: true,
|
@@ -20,6 +20,12 @@
|
|
20
20
|
min-width: 180px;
|
21
21
|
box-shadow: var(--popup-local-shadow, 0px 6px 24px 0px rgba(0, 0, 0, 0.1));
|
22
22
|
background: var(--menu-background);
|
23
|
+
|
24
|
+
&-dialog {
|
25
|
+
.next-checkbox-label {
|
26
|
+
line-height: var(--checkbox-size,16px);
|
27
|
+
}
|
28
|
+
}
|
23
29
|
&-reset {
|
24
30
|
position: absolute;
|
25
31
|
right: 16px;
|
@@ -38,7 +44,6 @@
|
|
38
44
|
visibility: visible;
|
39
45
|
cursor: pointer;
|
40
46
|
}
|
41
|
-
|
42
47
|
}
|
43
48
|
}
|
44
49
|
.next-menu-item-text {
|
@@ -94,7 +99,7 @@
|
|
94
99
|
background-color: var(--balloon-tooltip-color-bg, #292929);
|
95
100
|
border-color: var(--balloon-tooltip-color-border, transparent);
|
96
101
|
box-shadow: var(--balloon-tooltip-shadow, none);
|
97
|
-
color: var(--balloon-tooltip-color, #
|
102
|
+
color: var(--balloon-tooltip-color, #ffffff);
|
98
103
|
display: flex;
|
99
104
|
align-items: center;
|
100
105
|
height: 36px;
|
@@ -105,7 +110,7 @@
|
|
105
110
|
display: none;
|
106
111
|
}
|
107
112
|
.next-message-content {
|
108
|
-
color: var(--balloon-tooltip-color, #
|
113
|
+
color: var(--balloon-tooltip-color, #ffffff);
|
109
114
|
padding: 0;
|
110
115
|
}
|
111
116
|
.teamix-pro-table-full-screen-message-esc {
|
@@ -114,7 +119,7 @@
|
|
114
119
|
padding: 0 2px;
|
115
120
|
position: relative;
|
116
121
|
// box-shadow: inset 0 0 1px 1px var(--color-fill1-1);
|
117
|
-
border: 1px solid var(--balloon-tooltip-color, #
|
122
|
+
border: 1px solid var(--balloon-tooltip-color, #ffffff);
|
118
123
|
display: inline-block;
|
119
124
|
line-height: 1;
|
120
125
|
&-title {
|
package/lib/table/index.js
CHANGED
@@ -109,6 +109,8 @@ var processColumns = function processColumns(columns, initialColumns) {
|
|
109
109
|
}); // 处理只剩一列批量选择的情况下宽度错乱问题
|
110
110
|
|
111
111
|
if (filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) {
|
112
|
+
var _initialColumns$;
|
113
|
+
|
112
114
|
if ((filterColumns === null || filterColumns === void 0 ? void 0 : filterColumns.length) === 1) {
|
113
115
|
var _filterColumns$, _filterColumns$2;
|
114
116
|
|
@@ -119,14 +121,14 @@ var processColumns = function processColumns(columns, initialColumns) {
|
|
119
121
|
if ((_filterColumns$2 = filterColumns[0]) === null || _filterColumns$2 === void 0 ? void 0 : _filterColumns$2.lock) {
|
120
122
|
filterColumns[0].lock = false;
|
121
123
|
}
|
122
|
-
} else {
|
123
|
-
var _initialColumns
|
124
|
+
} else if (((_initialColumns$ = initialColumns[0]) === null || _initialColumns$ === void 0 ? void 0 : _initialColumns$.columnFilters) !== false) {
|
125
|
+
var _initialColumns$2, _initialColumns$3;
|
124
126
|
|
125
|
-
if ((_initialColumns$ = initialColumns[0]) === null || _initialColumns$ === void 0 ? void 0 : _initialColumns
|
127
|
+
if ((_initialColumns$2 = initialColumns[0]) === null || _initialColumns$2 === void 0 ? void 0 : _initialColumns$2.width) {
|
126
128
|
filterColumns[0].width = initialColumns[0].width;
|
127
129
|
}
|
128
130
|
|
129
|
-
if ((_initialColumns$
|
131
|
+
if ((_initialColumns$3 = initialColumns[0]) === null || _initialColumns$3 === void 0 ? void 0 : _initialColumns$3.lock) {
|
130
132
|
filterColumns[0].lock = initialColumns[0].lock;
|
131
133
|
}
|
132
134
|
}
|
@@ -247,8 +249,10 @@ var ProTable = function ProTable(props) {
|
|
247
249
|
var _useState13 = (0, _react.useState)(true),
|
248
250
|
_useState14 = _slicedToArray(_useState13, 2),
|
249
251
|
customTableLoading = _useState14[0],
|
250
|
-
setCustomTableLoading = _useState14[1];
|
252
|
+
setCustomTableLoading = _useState14[1]; // 用于存放 Search 组件之前值的 ref
|
253
|
+
|
251
254
|
|
255
|
+
var searchValueRef = (0, _react.useRef)('');
|
252
256
|
var tableRef = (0, _react.useRef)(null);
|
253
257
|
var actionRef = (0, _react.useRef)(); // 传给 table 的过滤后的 columns
|
254
258
|
|
@@ -447,9 +451,14 @@ var ProTable = function ProTable(props) {
|
|
447
451
|
setColumn: function setColumn(newColumns) {
|
448
452
|
var _actionRef$current2, _actionRef$current2$s;
|
449
453
|
|
454
|
+
var update = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
450
455
|
var columns = processColumns(newColumns, propsColumns);
|
451
456
|
setFilteredColumns(columns);
|
452
457
|
(_actionRef$current2 = actionRef.current) === null || _actionRef$current2 === void 0 ? void 0 : (_actionRef$current2$s = _actionRef$current2.setState) === null || _actionRef$current2$s === void 0 ? void 0 : _actionRef$current2$s.call(_actionRef$current2, 'filterColumns', columns);
|
458
|
+
|
459
|
+
if (update) {
|
460
|
+
(0, _utils2.emit)('refreshFilterState', newColumns);
|
461
|
+
}
|
453
462
|
},
|
454
463
|
setSize: function setSize(mode) {
|
455
464
|
_setSize(mode);
|
@@ -653,10 +662,8 @@ var ProTable = function ProTable(props) {
|
|
653
662
|
}
|
654
663
|
|
655
664
|
(0, _react.useEffect)(function () {
|
656
|
-
|
657
|
-
|
658
|
-
// 初始化 state 状态
|
659
|
-
actionRef === null || actionRef === void 0 ? void 0 : (_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : (_actionRef$current5$i = _actionRef$current5.initState) === null || _actionRef$current5$i === void 0 ? void 0 : _actionRef$current5$i.call(_actionRef$current5); // 监听 浏览器变化 更吸底状态
|
665
|
+
// 初始化 actionRef state、callback 此时 actionRef 已初始化完成
|
666
|
+
(0, _utils2.initActionRef)(); // 监听 浏览器变化 更吸底状态
|
660
667
|
|
661
668
|
if (footerSuction) {
|
662
669
|
getFooterSuctionState();
|
@@ -670,6 +677,14 @@ var ProTable = function ProTable(props) {
|
|
670
677
|
_request();
|
671
678
|
}
|
672
679
|
|
680
|
+
var searchName = getSearchName();
|
681
|
+
|
682
|
+
if (searchName) {
|
683
|
+
// 如果有初始值,需要赋值
|
684
|
+
var initialValues = toJS(dataFilterForm.initialValues);
|
685
|
+
searchValueRef.current = initialValues[searchName][1];
|
686
|
+
}
|
687
|
+
|
673
688
|
return function () {
|
674
689
|
if (autoRefreshTimerRef.current) {
|
675
690
|
clearTimeout(autoRefreshTimerRef.current);
|
@@ -689,18 +704,54 @@ var ProTable = function ProTable(props) {
|
|
689
704
|
setSort(nextSort);
|
690
705
|
|
691
706
|
_request(targetFormatSort(nextSort));
|
692
|
-
} //
|
707
|
+
} // 找到 Search 组件对应的 name
|
708
|
+
|
709
|
+
|
710
|
+
var getSearchName = function getSearchName() {
|
711
|
+
var _dataFilter$schema;
|
712
|
+
|
713
|
+
if ((dataFilter === null || dataFilter === void 0 ? void 0 : dataFilter.schema) && ((_dataFilter$schema = dataFilter.schema) === null || _dataFilter$schema === void 0 ? void 0 : _dataFilter$schema.length) > 0) {
|
714
|
+
var searchSchema = dataFilter.schema.find(function (item) {
|
715
|
+
return item.component === 'Search';
|
716
|
+
});
|
717
|
+
|
718
|
+
if (searchSchema) {
|
719
|
+
var searchName = searchSchema.name;
|
720
|
+
return searchName;
|
721
|
+
}
|
722
|
+
}
|
723
|
+
}; // 处理 dataFilter 中的 onFilter、onReset
|
693
724
|
|
694
725
|
|
695
|
-
var dataFilter = _objectSpread(_objectSpread({
|
696
|
-
|
697
|
-
|
726
|
+
var dataFilter = _objectSpread(_objectSpread({
|
727
|
+
mode: 'inline'
|
728
|
+
}, propsDataFilter), {}, {
|
729
|
+
onFilter: (0, _lodash.default)(function (values) {
|
730
|
+
(propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter) && (propsDataFilter === null || propsDataFilter === void 0 ? void 0 : propsDataFilter.onFilter(values));
|
698
731
|
|
699
732
|
if (dataFilterForm.validate()) {
|
700
|
-
var _actionRef$
|
733
|
+
var _actionRef$current5, _actionRef$current5$c;
|
734
|
+
|
735
|
+
/**
|
736
|
+
* 针对 inline 模式下的 Search 组件做特殊处理
|
737
|
+
* 当切换条件且输入内容为空的时候,类似[a, ''] => [b, ''] 不触发请求
|
738
|
+
*/
|
739
|
+
if (dataFilter.mode === 'inline') {
|
740
|
+
var searchName = getSearchName();
|
741
|
+
|
742
|
+
if (searchName) {
|
743
|
+
var searchValue = values[searchName][1];
|
701
744
|
|
702
|
-
|
703
|
-
|
745
|
+
if (searchValue === (searchValueRef === null || searchValueRef === void 0 ? void 0 : searchValueRef.current)) {
|
746
|
+
return;
|
747
|
+
}
|
748
|
+
|
749
|
+
searchValueRef.current = searchValue;
|
750
|
+
}
|
751
|
+
} // 搜索变化时,暂时先清空选择
|
752
|
+
|
753
|
+
|
754
|
+
(_actionRef$current5 = actionRef.current) === null || _actionRef$current5 === void 0 ? void 0 : (_actionRef$current5$c = _actionRef$current5.clearRowSelection) === null || _actionRef$current5$c === void 0 ? void 0 : _actionRef$current5$c.call(_actionRef$current5);
|
704
755
|
setCurrentPage(1);
|
705
756
|
|
706
757
|
_request(_defineProperty({}, targetPageKey, 1));
|
@@ -795,21 +846,21 @@ var ProTable = function ProTable(props) {
|
|
795
846
|
|
796
847
|
var renderFooter = function renderFooter() {
|
797
848
|
function onChangePagination(currentPage) {
|
798
|
-
var _actionRef$
|
849
|
+
var _actionRef$current6, _actionRef$current6$c;
|
799
850
|
|
800
851
|
var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
801
852
|
// 翻页暂时先清空选择
|
802
|
-
(_actionRef$
|
853
|
+
(_actionRef$current6 = actionRef.current) === null || _actionRef$current6 === void 0 ? void 0 : (_actionRef$current6$c = _actionRef$current6.clearRowSelection) === null || _actionRef$current6$c === void 0 ? void 0 : _actionRef$current6$c.call(_actionRef$current6);
|
803
854
|
setCurrentPage(currentPage);
|
804
855
|
|
805
856
|
_request(_objectSpread(_defineProperty({}, targetPageKey, currentPage), params));
|
806
857
|
}
|
807
858
|
|
808
859
|
function onChangePaginationSize(currentPageSize) {
|
809
|
-
var _actionRef$
|
860
|
+
var _actionRef$current7, _actionRef$current7$c, _request5;
|
810
861
|
|
811
862
|
// 翻页暂时先清空选择
|
812
|
-
(_actionRef$
|
863
|
+
(_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);
|
813
864
|
setPageSize(currentPageSize);
|
814
865
|
setCurrentPage(1);
|
815
866
|
|
package/lib/table/index.scss
CHANGED
package/lib/table/typing.d.ts
CHANGED
@@ -12,7 +12,7 @@ import React from 'react';
|
|
12
12
|
import type { Form as FormType } from '@formily/core';
|
13
13
|
declare type IFieldRenderProps = keyof ProFieldRenderProps;
|
14
14
|
/** 列record函数 */
|
15
|
-
declare type ProTableCellFunProp = (value: any, index: number, record: any) => any;
|
15
|
+
declare type ProTableCellFunProp = (value: any, index: number, record: any, ...others: any) => any;
|
16
16
|
declare type ITableCellRender = {
|
17
17
|
[key in IFieldRenderProps]?: ProFieldRenderProps[key] | ProTableCellFunProp;
|
18
18
|
} | ((...other: any) => React.ReactNode);
|
@@ -146,7 +146,7 @@ export declare type ProTableActionType = {
|
|
146
146
|
/** 全屏展示 */
|
147
147
|
fullScreen?: () => boolean;
|
148
148
|
/** 设置显示列 */
|
149
|
-
setColumn?: (newColumns: ProColumnProps[]) => void;
|
149
|
+
setColumn?: (newColumns: ProColumnProps[], update?: boolean) => void;
|
150
150
|
/** 设置表格大小 */
|
151
151
|
setSize?: (mode: 'small' | 'medium') => void;
|
152
152
|
/** 刷新表格 */
|
@@ -220,6 +220,8 @@ export declare type ProTableDataFilterProps = {
|
|
220
220
|
searchUndefined?: boolean;
|
221
221
|
/** 搜索时是否传入值为空字符串的参数,默认不传 */
|
222
222
|
searchEmptyString?: boolean;
|
223
|
+
/** 自定义内容 */
|
224
|
+
content?: React.ReactNode;
|
223
225
|
} & IFilterProps;
|
224
226
|
export declare type dataFilterProps = ProTableDataFilterProps;
|
225
227
|
export declare type ProTableTopAreaProps = {
|
@@ -220,7 +220,8 @@ var processRenderFunction = function processRenderFunction() {
|
|
220
220
|
var value = arguments.length > 1 ? arguments[1] : undefined;
|
221
221
|
var index = arguments.length > 2 ? arguments[2] : undefined;
|
222
222
|
var record = arguments.length > 3 ? arguments[3] : undefined;
|
223
|
-
|
223
|
+
// 当 ProField render 类型为 function 时。需要表格预先处理以塞入 record
|
224
|
+
var external = ['linkOnClick', 'link', 'value', 'renderEdit', 'descriptionRenderEdit', 'editPopConfirmProps', 'descriptionEditPopConfirmProps', 'editOnClick', 'descriptionEditOnClick'];
|
224
225
|
return Object.fromEntries(Object.entries(render).map(function (_ref3) {
|
225
226
|
var _ref4 = _slicedToArray(_ref3, 2),
|
226
227
|
k = _ref4[0],
|
@@ -1,4 +1,11 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { ProTableActionType } from '../typing';
|
3
|
+
export declare function initActionRef(): void;
|
4
|
+
/** table 组件内监听 不对外暴露 */
|
5
|
+
export declare function on(fun: any, key: string): void;
|
6
|
+
/** table 组件内销毁监听 不对外暴露 */
|
7
|
+
export declare function off(key: string): void;
|
8
|
+
/** table 组件内触发事件 不对外暴露 */
|
9
|
+
export declare function emit(key: string, ...args: any): void;
|
3
10
|
export declare function useActionType<T>(ref: React.MutableRefObject<ProTableActionType | undefined>, action: ProTableActionType): void;
|
4
11
|
export declare function cloneDeep<T>(obj: T): T;
|
package/lib/table/utils/index.js
CHANGED
@@ -4,6 +4,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.cloneDeep = cloneDeep;
|
7
|
+
exports.emit = emit;
|
8
|
+
exports.initActionRef = initActionRef;
|
9
|
+
exports.off = off;
|
10
|
+
exports.on = on;
|
7
11
|
exports.useActionType = useActionType;
|
8
12
|
|
9
13
|
var _lodash = _interopRequireDefault(require("lodash.clonedeep"));
|
@@ -28,19 +32,23 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
|
|
28
32
|
|
29
33
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
30
34
|
|
31
|
-
// 组件内全局状态
|
35
|
+
// 组件内全局状态 每次初始化 ActionRef 会重新深拷贝对象
|
32
36
|
var state = {
|
33
37
|
fullScreenState: false,
|
34
38
|
filterRules: {},
|
35
39
|
filterColumns: []
|
36
40
|
};
|
37
41
|
|
38
|
-
var _initState = (0, _lodash.default)(state); //
|
42
|
+
var _initState = (0, _lodash.default)(state); // state监听事件 每次初始化 ActionRef 会重新深拷贝对象
|
39
43
|
|
40
44
|
|
41
45
|
var callback = {
|
42
46
|
fullScreenState: {}
|
43
|
-
};
|
47
|
+
};
|
48
|
+
var initCallback = (0, _lodash.default)(callback); // 所有 ProTable 组件公用一套组件内事件转发机制
|
49
|
+
|
50
|
+
var tableCallback = {}; // 组件内监听事件
|
51
|
+
// 组件内对全局状态的更改
|
44
52
|
|
45
53
|
var mutations = {
|
46
54
|
getState: function getState() {
|
@@ -140,7 +148,41 @@ var useOn = function useOn(state) {
|
|
140
148
|
}
|
141
149
|
});
|
142
150
|
}
|
143
|
-
};
|
151
|
+
}; // 初始化 actionRef
|
152
|
+
|
153
|
+
|
154
|
+
function initActionRef() {
|
155
|
+
state = (0, _lodash.default)(_initState);
|
156
|
+
callback = (0, _lodash.default)(initCallback);
|
157
|
+
}
|
158
|
+
/** table 组件内监听 不对外暴露 */
|
159
|
+
|
160
|
+
|
161
|
+
function on(fun, key) {
|
162
|
+
tableCallback[key] = fun;
|
163
|
+
}
|
164
|
+
/** table 组件内销毁监听 不对外暴露 */
|
165
|
+
|
166
|
+
|
167
|
+
function off(key) {
|
168
|
+
if (tableCallback[key]) {
|
169
|
+
delete tableCallback[key];
|
170
|
+
}
|
171
|
+
}
|
172
|
+
/** table 组件内触发事件 不对外暴露 */
|
173
|
+
|
174
|
+
|
175
|
+
function emit(key) {
|
176
|
+
var fun = tableCallback[key];
|
177
|
+
|
178
|
+
if (fun) {
|
179
|
+
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
180
|
+
args[_key2 - 1] = arguments[_key2];
|
181
|
+
}
|
182
|
+
|
183
|
+
fun.apply(void 0, args);
|
184
|
+
}
|
185
|
+
}
|
144
186
|
|
145
187
|
function useActionType(ref, action) {
|
146
188
|
// 合并自定义事件
|