@kdcloudjs/table 1.1.2 → 1.1.3-canary.10
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/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +611 -207
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +6 -6
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/es/table/base/helpers/TableDOMUtils.d.ts +2 -0
- package/es/table/base/helpers/TableDOMUtils.js +48 -12
- package/es/table/base/helpers/getRichVisibleRectsStream.js +1 -1
- package/es/table/base/html-table.js +1 -1
- package/es/table/base/styles.d.ts +2 -0
- package/es/table/base/styles.js +4 -2
- package/es/table/base/table.d.ts +0 -1
- package/es/table/base/table.js +22 -29
- package/es/table/pipeline/features/columnDrag.js +27 -16
- package/es/table/pipeline/features/columnFilter.d.ts +2 -2
- package/es/table/pipeline/features/columnFilter.js +33 -12
- package/es/table/pipeline/features/contextMenu.js +1 -0
- package/es/table/pipeline/features/filter/DefaultFilterIcon.d.ts +5 -0
- package/es/table/pipeline/features/filter/DefaultFilterIcon.js +20 -0
- package/es/table/pipeline/features/filter/Filter.d.ts +1 -1
- package/es/table/pipeline/features/filter/Filter.js +16 -20
- package/es/table/pipeline/features/filter/FilterPanel.js +25 -16
- package/es/table/pipeline/features/filter/util.js +4 -4
- package/es/table/pipeline/features/footerDataSource.d.ts +9 -0
- package/es/table/pipeline/features/footerDataSource.js +25 -0
- package/es/table/pipeline/features/index.d.ts +2 -0
- package/es/table/pipeline/features/index.js +3 -1
- package/es/table/pipeline/features/mergeCellHover.d.ts +2 -0
- package/es/table/pipeline/features/mergeCellHover.js +32 -0
- package/es/table/pipeline/features/multiSelect.js +7 -2
- package/es/table/pipeline/features/rangeSelection.d.ts +1 -1
- package/es/table/pipeline/features/rangeSelection.js +156 -28
- package/es/table/pipeline/features/singleSelect.js +4 -0
- package/es/table/pipeline/features/treeMode.d.ts +2 -0
- package/es/table/pipeline/features/treeMode.js +18 -20
- package/es/table/pipeline/pipeline.d.ts +5 -1
- package/es/table/pipeline/pipeline.js +11 -10
- package/lib/table/base/helpers/TableDOMUtils.d.ts +2 -0
- package/lib/table/base/helpers/TableDOMUtils.js +51 -12
- package/lib/table/base/helpers/getRichVisibleRectsStream.js +1 -1
- package/lib/table/base/html-table.js +1 -1
- package/lib/table/base/styles.d.ts +2 -0
- package/lib/table/base/styles.js +4 -2
- package/lib/table/base/table.d.ts +0 -1
- package/lib/table/base/table.js +22 -29
- package/lib/table/pipeline/features/columnDrag.js +27 -16
- package/lib/table/pipeline/features/columnFilter.d.ts +2 -2
- package/lib/table/pipeline/features/columnFilter.js +31 -12
- package/lib/table/pipeline/features/contextMenu.js +1 -0
- package/lib/table/pipeline/features/filter/DefaultFilterIcon.d.ts +5 -0
- package/lib/table/pipeline/features/filter/DefaultFilterIcon.js +30 -0
- package/lib/table/pipeline/features/filter/Filter.d.ts +1 -1
- package/lib/table/pipeline/features/filter/Filter.js +17 -20
- package/lib/table/pipeline/features/filter/FilterPanel.js +25 -15
- package/lib/table/pipeline/features/filter/util.js +4 -4
- package/lib/table/pipeline/features/footerDataSource.d.ts +9 -0
- package/lib/table/pipeline/features/footerDataSource.js +41 -0
- package/lib/table/pipeline/features/index.d.ts +2 -0
- package/lib/table/pipeline/features/index.js +23 -1
- package/lib/table/pipeline/features/mergeCellHover.d.ts +2 -0
- package/lib/table/pipeline/features/mergeCellHover.js +43 -0
- package/lib/table/pipeline/features/multiSelect.js +6 -1
- package/lib/table/pipeline/features/rangeSelection.d.ts +1 -1
- package/lib/table/pipeline/features/rangeSelection.js +158 -30
- package/lib/table/pipeline/features/singleSelect.js +4 -0
- package/lib/table/pipeline/features/treeMode.d.ts +2 -0
- package/lib/table/pipeline/features/treeMode.js +19 -22
- package/lib/table/pipeline/pipeline.d.ts +5 -1
- package/lib/table/pipeline/pipeline.js +12 -10
- package/package.json +2 -2
|
@@ -65,7 +65,7 @@ function filter() {
|
|
|
65
65
|
return (0, _map2.default)(columns).call(columns, dfs);
|
|
66
66
|
|
|
67
67
|
function dfs(col) {
|
|
68
|
-
var _a, _b, _c, _d, _e;
|
|
68
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
69
69
|
|
|
70
70
|
var result = (0, _extends2.default)({}, col);
|
|
71
71
|
var filterable = col.code && ((_a = col.features) === null || _a === void 0 ? void 0 : _a.filterable);
|
|
@@ -104,12 +104,13 @@ function filter() {
|
|
|
104
104
|
};
|
|
105
105
|
|
|
106
106
|
var filterPanel = (_d = col.features) === null || _d === void 0 ? void 0 : _d.filterPanel;
|
|
107
|
-
|
|
107
|
+
var colFilterIcon = (_f = (_e = col.features) === null || _e === void 0 ? void 0 : _e.filterIcon) !== null && _f !== void 0 ? _f : filterIcon;
|
|
108
|
+
result.title = (0, _concat.default)(_context = []).call(_context, (0, _toConsumableArray2.default)((0, _concat.default)(_context2 = []).call(_context2, (_g = result.title) !== null && _g !== void 0 ? _g : [_internals.internals.safeRenderHeader((0, _extends2.default)((0, _extends2.default)({}, col), {
|
|
108
109
|
title: null
|
|
109
110
|
}))])), [/*#__PURE__*/_react.default.createElement(_filter2.Filter, {
|
|
110
111
|
key: "filter",
|
|
111
112
|
FilterPanelContent: filterPanel,
|
|
112
|
-
filterIcon:
|
|
113
|
+
filterIcon: colFilterIcon,
|
|
113
114
|
filterModel: inputFiltersMap.get(col.code),
|
|
114
115
|
setFilterModel: handleFilterChanged,
|
|
115
116
|
setFilter: setFilter,
|
|
@@ -158,7 +159,7 @@ function filter() {
|
|
|
158
159
|
}));
|
|
159
160
|
|
|
160
161
|
function isMatchedFilterCondition(record) {
|
|
161
|
-
return
|
|
162
|
+
return filtersKeys.every(function (key) {
|
|
162
163
|
var _a, _b;
|
|
163
164
|
|
|
164
165
|
var filterItem = inputFiltersMap.get(key);
|
|
@@ -174,21 +175,39 @@ function filter() {
|
|
|
174
175
|
comparisonFn = (0, _filter.default)(defaultFilterOptionsMap.get('contain'));
|
|
175
176
|
}
|
|
176
177
|
|
|
177
|
-
return
|
|
178
|
+
return comparisonFn((0, _filter.default)(filterItem), filterItem)(_internals.internals.safeGetValue(columnsMap.get(key), record, -1), record);
|
|
178
179
|
});
|
|
179
180
|
}
|
|
180
181
|
|
|
181
|
-
return dataSource
|
|
182
|
-
if (isMatchedFilterCondition(record)) {
|
|
183
|
-
return (0, _concat.default)(pre).call(pre, [record]);
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
return pre;
|
|
187
|
-
}, []);
|
|
182
|
+
return layeredFilter(dataSource, isMatchedFilterCondition);
|
|
188
183
|
}
|
|
189
184
|
|
|
190
185
|
pipeline.dataSource(processDataSource(dataSource));
|
|
191
186
|
pipeline.columns(processColumns(columns));
|
|
192
187
|
return pipeline;
|
|
193
188
|
};
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
function layeredFilter(array, matchFn) {
|
|
192
|
+
return dfs(array);
|
|
193
|
+
|
|
194
|
+
function dfs(rows) {
|
|
195
|
+
var _context6;
|
|
196
|
+
|
|
197
|
+
var parentMatched = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
198
|
+
return (0, _filter.default)(_context6 = (0, _map2.default)(rows).call(rows, function (row) {
|
|
199
|
+
var currentMatched = matchFn(row);
|
|
200
|
+
|
|
201
|
+
if ((0, _utils.isLeafNode)(row)) {
|
|
202
|
+
return (parentMatched || currentMatched) && (0, _extends2.default)({}, row);
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
var children = row.children;
|
|
206
|
+
var rowAfterFilterChildren = (0, _extends2.default)((0, _extends2.default)({}, row), {
|
|
207
|
+
children: dfs(children, parentMatched || currentMatched)
|
|
208
|
+
});
|
|
209
|
+
var matchedByChildren = !(0, _utils.isLeafNode)(rowAfterFilterChildren);
|
|
210
|
+
return (parentMatched || currentMatched || matchedByChildren) && rowAfterFilterChildren;
|
|
211
|
+
})).call(_context6, Boolean);
|
|
212
|
+
}
|
|
194
213
|
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = DefaultFilterIcon;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
|
|
12
|
+
function DefaultFilterIcon(_ref) {
|
|
13
|
+
var width = _ref.width,
|
|
14
|
+
height = _ref.height;
|
|
15
|
+
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
16
|
+
width: width,
|
|
17
|
+
height: height,
|
|
18
|
+
style: {
|
|
19
|
+
verticalAlign: 'middle'
|
|
20
|
+
},
|
|
21
|
+
viewBox: "0 0 1024 1024",
|
|
22
|
+
focusable: "false",
|
|
23
|
+
"data-icon": "filter",
|
|
24
|
+
fill: "currentColor",
|
|
25
|
+
version: "1.1",
|
|
26
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
27
|
+
}, /*#__PURE__*/_react.default.createElement("path", {
|
|
28
|
+
d: "M891.448889 159.573333L626.460444 460.231111v443.221333c0 32.881778-25.429333 63.658667-55.864888 63.658667l-170.268445-172.942222V456.419556L132.266667 159.857778A59.619556 59.619556 0 0 1 173.511111 56.888889h676.977778c32.995556 0 59.733333 26.680889 59.733333 59.562667 0 17.066667-7.224889 32.312889-18.773333 43.121777z"
|
|
29
|
+
}));
|
|
30
|
+
}
|
|
@@ -6,7 +6,7 @@ interface FilterProps {
|
|
|
6
6
|
size?: number;
|
|
7
7
|
isFilterActive: boolean;
|
|
8
8
|
FilterPanelContent?: FilterPanelType;
|
|
9
|
-
filterIcon?: ReactNode;
|
|
9
|
+
filterIcon?: ReactNode | ((filtered: boolean) => ReactNode);
|
|
10
10
|
setFilterModel: DefaultFilterPanelProps['setFilterModel'];
|
|
11
11
|
filterModel: DefaultFilterPanelProps['filterModel'];
|
|
12
12
|
setFilter: CustomeFilterPanelProps['setFilter'];
|
|
@@ -31,6 +31,8 @@ var _FilterPanel = _interopRequireDefault(require("./FilterPanel"));
|
|
|
31
31
|
|
|
32
32
|
var _DefaultFilterContent = _interopRequireDefault(require("./DefaultFilterContent"));
|
|
33
33
|
|
|
34
|
+
var _DefaultFilterIcon = _interopRequireDefault(require("./DefaultFilterIcon"));
|
|
35
|
+
|
|
34
36
|
var _utils = require("../../../utils");
|
|
35
37
|
|
|
36
38
|
var _utils2 = require("../../../base/utils");
|
|
@@ -43,7 +45,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
|
|
|
43
45
|
|
|
44
46
|
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; }
|
|
45
47
|
|
|
46
|
-
var HEADER_ICON_OFFSET_Y =
|
|
48
|
+
var HEADER_ICON_OFFSET_Y = 8 + 1; // padding-top + border
|
|
47
49
|
|
|
48
50
|
var HEADER_ICON_OFFSET_X = 16 + 1; // padding-left+ border
|
|
49
51
|
|
|
@@ -119,10 +121,6 @@ function Filter(_ref2) {
|
|
|
119
121
|
return setShowPanel(false);
|
|
120
122
|
};
|
|
121
123
|
|
|
122
|
-
var handleMouseDown = function handleMouseDown(e) {
|
|
123
|
-
e.stopPropagation(); // 阻止触发拖拽
|
|
124
|
-
};
|
|
125
|
-
|
|
126
124
|
var renderPanelContent = function renderPanelContent() {
|
|
127
125
|
if (FilterPanelContent) {
|
|
128
126
|
return /*#__PURE__*/_react.default.createElement(FilterPanelContent, {
|
|
@@ -142,6 +140,12 @@ function Filter(_ref2) {
|
|
|
142
140
|
};
|
|
143
141
|
|
|
144
142
|
var handleIconClick = function handleIconClick(e) {
|
|
143
|
+
// 只有当icon区域点击会触发面板展开
|
|
144
|
+
// 防止 createPortal 区域的点击触发该事件
|
|
145
|
+
if (!e.currentTarget.contains(e.target)) {
|
|
146
|
+
return;
|
|
147
|
+
}
|
|
148
|
+
|
|
145
149
|
if (stopClickEventPropagation) {
|
|
146
150
|
e.stopPropagation();
|
|
147
151
|
}
|
|
@@ -150,27 +154,20 @@ function Filter(_ref2) {
|
|
|
150
154
|
};
|
|
151
155
|
|
|
152
156
|
var iconClassName = (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, className, true), (0, _defineProperty2.default)(_cx, 'filter-panel-open', showPanel), _cx));
|
|
157
|
+
var displayFilterIcon = typeof filterIcon === 'function' ? filterIcon(isFilterActive) : filterIcon;
|
|
153
158
|
return /*#__PURE__*/_react.default.createElement(FilterIconSpanStyle, {
|
|
154
159
|
style: style,
|
|
155
160
|
className: iconClassName,
|
|
156
|
-
onMouseDown: handleMouseDown,
|
|
157
|
-
ref: iconRef
|
|
158
|
-
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
159
|
-
className: _styles.Classes.filterIcon,
|
|
160
161
|
onClick: handleIconClick
|
|
161
|
-
},
|
|
162
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
163
|
+
ref: iconRef,
|
|
164
|
+
className: _styles.Classes.filterIcon
|
|
165
|
+
}, displayFilterIcon || /*#__PURE__*/_react.default.createElement(_DefaultFilterIcon.default, {
|
|
162
166
|
width: size,
|
|
163
|
-
height: size
|
|
164
|
-
|
|
165
|
-
focusable: "false",
|
|
166
|
-
"data-icon": "filter",
|
|
167
|
-
fill: "currentColor",
|
|
168
|
-
"aria-hidden": "true"
|
|
169
|
-
}, /*#__PURE__*/_react.default.createElement("path", {
|
|
170
|
-
d: "M349 838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3\n 31.8-32V642H349v196zm531.1-684H143.9c-24.5 0-39.8 26.7-27.5\n 48l221.3 376h348.8l221.3-376c12.1-21.3-3.2-48-27.7-48z"
|
|
171
|
-
}))), showPanel && /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react.default.createElement(Panel, {
|
|
167
|
+
height: size
|
|
168
|
+
})), showPanel && /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react.default.createElement(Panel, {
|
|
172
169
|
ele: iconRef.current,
|
|
173
|
-
filterIcon:
|
|
170
|
+
filterIcon: displayFilterIcon,
|
|
174
171
|
hidePanel: hidePanel,
|
|
175
172
|
renderPanelContent: renderPanelContent
|
|
176
173
|
}), document.body));
|
|
@@ -25,22 +25,24 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
25
25
|
|
|
26
26
|
var _utils = require("../../../utils/");
|
|
27
27
|
|
|
28
|
+
var _DefaultFilterIcon = _interopRequireDefault(require("./DefaultFilterIcon"));
|
|
29
|
+
|
|
28
30
|
var _templateObject;
|
|
29
31
|
|
|
30
32
|
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); }
|
|
31
33
|
|
|
32
34
|
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; }
|
|
33
35
|
|
|
34
|
-
var FilterPanelStyle = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n max-height: 450px;\n min-width: 160px;\n border-radius: 2px;\n background-color: #fff;\n box-shadow: 0 0 5px 0 rgba(154,154,154,.5);\n cursor: default;\n\n .popup-header {\n display: flex;\n background-color: #ebedf1;\n\n .popup-header-icon {\n color:#666;\n background-color: #fff;\n padding:
|
|
36
|
+
var FilterPanelStyle = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n max-height: 450px;\n min-width: 160px;\n border-radius: 2px;\n background-color: #fff;\n box-shadow: 0 0 5px 0 rgba(154,154,154,.5);\n cursor: default;\n\n .popup-header {\n display: flex;\n background-color: #ebedf1;\n\n .popup-header-icon {\n display: flex;\n color:#666;\n background-color: #fff;\n padding: 8px 16px 8px 16px;\n border-right: 1px solid transparent;\n border-left: 1px solid transparent;\n border-top: 1px solid transparent;\n border-top-right-radius: 2px;\n border-top-left-radius: 2px;\n }\n }\n\n .popup-body {\n display: flex;\n }\n"])));
|
|
35
37
|
|
|
36
38
|
var useWindowEvents = function useWindowEvents(func, evens) {
|
|
37
39
|
_react.default.useEffect(function () {
|
|
38
40
|
evens.forEach(function (event) {
|
|
39
|
-
return window.addEventListener(event, func
|
|
41
|
+
return window.addEventListener(event, func);
|
|
40
42
|
});
|
|
41
43
|
return function () {
|
|
42
44
|
return evens.forEach(function (event) {
|
|
43
|
-
return window.removeEventListener(event, func
|
|
45
|
+
return window.removeEventListener(event, func);
|
|
44
46
|
});
|
|
45
47
|
};
|
|
46
48
|
}, [evens, func]);
|
|
@@ -73,8 +75,22 @@ function FilterPanel(_ref) {
|
|
|
73
75
|
setPerfectPosition((0, _utils.keepWithinBounds)(document.body, ref.current, position.x, position.y, true));
|
|
74
76
|
setVisible(true);
|
|
75
77
|
}, [position]);
|
|
78
|
+
var hasPopupMouseDown = (0, _react.useRef)(false);
|
|
79
|
+
var mouseDownTimeout = (0, _react.useRef)();
|
|
80
|
+
|
|
81
|
+
var handleMouseDown = function handleMouseDown(e) {
|
|
82
|
+
// 当弹出的过滤面板内部发生鼠标按下事件时,标记当前事件,并在下个周期清除标记,用来确定鼠标按下发生在过滤面板内部
|
|
83
|
+
// 利用了React.createPortal冒泡是根据React Tree的特性:
|
|
84
|
+
// https://jwwnz.medium.com/react-portals-and-event-bubbling-8df3e35ca3f1
|
|
85
|
+
hasPopupMouseDown.current = true;
|
|
86
|
+
clearTimeout(mouseDownTimeout.current);
|
|
87
|
+
mouseDownTimeout.current = window.setTimeout(function () {
|
|
88
|
+
hasPopupMouseDown.current = false;
|
|
89
|
+
}, 0);
|
|
90
|
+
};
|
|
91
|
+
|
|
76
92
|
useWindowEvents(function (e) {
|
|
77
|
-
|
|
93
|
+
!isContainPanel(e) && !hasPopupMouseDown.current && onClose();
|
|
78
94
|
}, ['mousedown']);
|
|
79
95
|
return /*#__PURE__*/_react.default.createElement(FilterPanelStyle, {
|
|
80
96
|
style: (0, _extends2.default)((0, _extends2.default)({}, style), {
|
|
@@ -82,22 +98,16 @@ function FilterPanel(_ref) {
|
|
|
82
98
|
top: visible ? perfectPosition.y : 0,
|
|
83
99
|
opacity: visible ? 1 : 0
|
|
84
100
|
}),
|
|
101
|
+
onMouseDown: handleMouseDown,
|
|
85
102
|
ref: ref
|
|
86
103
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
87
104
|
className: 'popup-header'
|
|
88
105
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
89
106
|
className: 'popup-header-icon'
|
|
90
|
-
}, filterIcon || /*#__PURE__*/_react.default.createElement(
|
|
91
|
-
width:
|
|
92
|
-
height:
|
|
93
|
-
|
|
94
|
-
focusable: "false",
|
|
95
|
-
"data-icon": "filter",
|
|
96
|
-
fill: "currentColor",
|
|
97
|
-
"aria-hidden": "true"
|
|
98
|
-
}, /*#__PURE__*/_react.default.createElement("path", {
|
|
99
|
-
d: "M349 838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3\n 31.8-32V642H349v196zm531.1-684H143.9c-24.5 0-39.8 26.7-27.5\n 48l221.3 376h348.8l221.3-376c12.1-21.3-3.2-48-27.7-48z"
|
|
100
|
-
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
107
|
+
}, filterIcon || /*#__PURE__*/_react.default.createElement(_DefaultFilterIcon.default, {
|
|
108
|
+
width: 12,
|
|
109
|
+
height: 12
|
|
110
|
+
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
101
111
|
className: "popup-body"
|
|
102
112
|
}, children));
|
|
103
113
|
}
|
|
@@ -22,7 +22,7 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
22
22
|
data = data + '';
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
return (0, _includes.default)(data).call(data, value);
|
|
25
|
+
return (0, _includes.default)(data).call(data, value[0]);
|
|
26
26
|
};
|
|
27
27
|
}
|
|
28
28
|
}, {
|
|
@@ -38,7 +38,7 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
38
38
|
data = data + '';
|
|
39
39
|
}
|
|
40
40
|
|
|
41
|
-
return !(0, _includes.default)(data).call(data, value);
|
|
41
|
+
return !(0, _includes.default)(data).call(data, value[0]);
|
|
42
42
|
};
|
|
43
43
|
}
|
|
44
44
|
}, {
|
|
@@ -46,7 +46,7 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
46
46
|
key: 'equal',
|
|
47
47
|
filter: function filter(value) {
|
|
48
48
|
return function (data) {
|
|
49
|
-
return value
|
|
49
|
+
return value[0] === data;
|
|
50
50
|
};
|
|
51
51
|
}
|
|
52
52
|
}, {
|
|
@@ -54,7 +54,7 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
54
54
|
key: 'notEqual',
|
|
55
55
|
filter: function filter(value) {
|
|
56
56
|
return function (data) {
|
|
57
|
-
return value !== data;
|
|
57
|
+
return value[0] !== data;
|
|
58
58
|
};
|
|
59
59
|
}
|
|
60
60
|
}, {
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { TablePipeline } from '../pipeline';
|
|
2
|
+
export interface FooterDataSourceFeatureOptions {
|
|
3
|
+
/** 指定表格页脚每一行元信息的记录字段 */
|
|
4
|
+
footerRowMetaKey?: string | symbol;
|
|
5
|
+
/** 表格页脚数据源 */
|
|
6
|
+
dataSource?: any[];
|
|
7
|
+
}
|
|
8
|
+
export declare const footerRowMetaSymbol: unique symbol;
|
|
9
|
+
export declare function footerDataSource(opts?: FooterDataSourceFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.footerDataSource = footerDataSource;
|
|
9
|
+
exports.footerRowMetaSymbol = void 0;
|
|
10
|
+
|
|
11
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
12
|
+
|
|
13
|
+
var _extends3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
14
|
+
|
|
15
|
+
var _symbol = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/symbol"));
|
|
16
|
+
|
|
17
|
+
var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
|
|
18
|
+
|
|
19
|
+
var footerRowMetaSymbol = (0, _symbol.default)('footer-row');
|
|
20
|
+
exports.footerRowMetaSymbol = footerRowMetaSymbol;
|
|
21
|
+
|
|
22
|
+
function footerDataSource() {
|
|
23
|
+
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
24
|
+
return function footerDataSourceStep(pipeline) {
|
|
25
|
+
var _a, _b;
|
|
26
|
+
|
|
27
|
+
var footerDataSource = (_a = opts.dataSource) !== null && _a !== void 0 ? _a : pipeline.getFooterDataSource();
|
|
28
|
+
var footerRowMetaKey = (_b = opts.footerRowMetaKey) !== null && _b !== void 0 ? _b : footerRowMetaSymbol;
|
|
29
|
+
pipeline.setFeatureOptions('footerRowMetaKey', footerRowMetaKey);
|
|
30
|
+
|
|
31
|
+
if (footerDataSource) {
|
|
32
|
+
pipeline.footerDataSource((0, _map.default)(footerDataSource).call(footerDataSource, function (row) {
|
|
33
|
+
return (0, _extends3.default)((0, _defineProperty2.default)({}, footerRowMetaKey, true), row);
|
|
34
|
+
}));
|
|
35
|
+
} else {
|
|
36
|
+
console.warn('调用 pipeline.use(features.footerDataSource()) 前请先设置页脚数据源,设置方法有:pipeline.use(features.footerDataSource({dataSource:any[]})) 或者 pipeline.footerDataSource(any[])');
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
return pipeline;
|
|
40
|
+
};
|
|
41
|
+
}
|
|
@@ -15,3 +15,5 @@ export { columnResize, ColumnResizeOptions } from './columnResizeWidth';
|
|
|
15
15
|
export { contextMenu, ContextMenuFeatureOptions } from './contextMenu';
|
|
16
16
|
export { filter, FilterFeatureOptions } from './columnFilter';
|
|
17
17
|
export { rangeSelection, RangeSelectionFeatureOptions } from './rangeSelection';
|
|
18
|
+
export { mergeCellHover } from './mergeCellHover';
|
|
19
|
+
export { footerDataSource, FooterDataSourceFeatureOptions, footerRowMetaSymbol } from './footerDataSource';
|
|
@@ -55,6 +55,24 @@ Object.defineProperty(exports, "filter", {
|
|
|
55
55
|
return _filterInstanceProperty(_columnFilter);
|
|
56
56
|
}
|
|
57
57
|
});
|
|
58
|
+
Object.defineProperty(exports, "footerDataSource", {
|
|
59
|
+
enumerable: true,
|
|
60
|
+
get: function get() {
|
|
61
|
+
return _footerDataSource.footerDataSource;
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
Object.defineProperty(exports, "footerRowMetaSymbol", {
|
|
65
|
+
enumerable: true,
|
|
66
|
+
get: function get() {
|
|
67
|
+
return _footerDataSource.footerRowMetaSymbol;
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
Object.defineProperty(exports, "mergeCellHover", {
|
|
71
|
+
enumerable: true,
|
|
72
|
+
get: function get() {
|
|
73
|
+
return _mergeCellHover.mergeCellHover;
|
|
74
|
+
}
|
|
75
|
+
});
|
|
58
76
|
Object.defineProperty(exports, "multiSelect", {
|
|
59
77
|
enumerable: true,
|
|
60
78
|
get: function get() {
|
|
@@ -148,4 +166,8 @@ var _contextMenu = require("./contextMenu");
|
|
|
148
166
|
|
|
149
167
|
var _columnFilter = require("./columnFilter");
|
|
150
168
|
|
|
151
|
-
var _rangeSelection = require("./rangeSelection");
|
|
169
|
+
var _rangeSelection = require("./rangeSelection");
|
|
170
|
+
|
|
171
|
+
var _mergeCellHover = require("./mergeCellHover");
|
|
172
|
+
|
|
173
|
+
var _footerDataSource = require("./footerDataSource");
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.mergeCellHover = mergeCellHover;
|
|
9
|
+
|
|
10
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
11
|
+
|
|
12
|
+
var _utils = require("../../utils");
|
|
13
|
+
|
|
14
|
+
function mergeCellHover() {
|
|
15
|
+
return function (pipeline) {
|
|
16
|
+
return pipeline.mapColumns((0, _utils.makeRecursiveMapper)(function (col) {
|
|
17
|
+
if (!(0, _utils.isLeafNode)(col)) {
|
|
18
|
+
return col;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
var prevGetCellProps = col.getCellProps;
|
|
22
|
+
return (0, _extends2.default)((0, _extends2.default)({}, col), {
|
|
23
|
+
getCellProps: function getCellProps(value, record, rowIndex) {
|
|
24
|
+
var prevCellProps = prevGetCellProps === null || prevGetCellProps === void 0 ? void 0 : prevGetCellProps(value, record, rowIndex);
|
|
25
|
+
return (0, _utils.mergeCellProps)(prevCellProps, {
|
|
26
|
+
onMouseEnter: function onMouseEnter(e) {
|
|
27
|
+
var InRangeRow = pipeline.ref.current.domHelper.getInRangeRowByCellEvent(e);
|
|
28
|
+
InRangeRow.forEach(function (row) {
|
|
29
|
+
row.classList.add('row-hover');
|
|
30
|
+
});
|
|
31
|
+
},
|
|
32
|
+
onMouseLeave: function onMouseLeave(e) {
|
|
33
|
+
var InRangeRow = pipeline.ref.current.domHelper.getInRangeRowByCellEvent(e);
|
|
34
|
+
InRangeRow.forEach(function (row) {
|
|
35
|
+
row.classList.remove('row-hover');
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
});
|
|
41
|
+
}));
|
|
42
|
+
};
|
|
43
|
+
}
|
|
@@ -61,7 +61,8 @@ function multiSelect() {
|
|
|
61
61
|
/** 所有有效的 keys(disable 状态为 false) */
|
|
62
62
|
|
|
63
63
|
var allKeys = [];
|
|
64
|
-
|
|
64
|
+
var flatDataSource = (0, _utils.collectNodes)(dataSource);
|
|
65
|
+
flatDataSource.forEach(function (row, rowIndex) {
|
|
65
66
|
var rowKey = _internals.internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
66
67
|
|
|
67
68
|
fullKeySet.add(rowKey); // 在 allKeys 中排除被禁用的 key
|
|
@@ -130,6 +131,10 @@ function multiSelect() {
|
|
|
130
131
|
return (0, _utils.mergeCellProps)(preCellProps, checkboxCellProps);
|
|
131
132
|
},
|
|
132
133
|
render: function render(_, row, rowIndex) {
|
|
134
|
+
if (row[pipeline.getFeatureOptions('footerRowMetaKey')]) {
|
|
135
|
+
return null;
|
|
136
|
+
}
|
|
137
|
+
|
|
133
138
|
var key = _internals.internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
134
139
|
|
|
135
140
|
var checked = set.has(key);
|
|
@@ -6,5 +6,5 @@ export interface RangeSelectionFeatureOptions {
|
|
|
6
6
|
preventkDefaultOfKeyDownEvent?: boolean;
|
|
7
7
|
}
|
|
8
8
|
export declare const rangeSelectionKey = "rangeSelection";
|
|
9
|
-
export declare const
|
|
9
|
+
export declare const lastClickCellKey = "lastClickCell";
|
|
10
10
|
export declare function rangeSelection(opts: RangeSelectionFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
|