@kdcloudjs/table 1.2.0-canary.6 → 1.2.0-canary.6-hotfix.2
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/LICENSE +568 -568
- package/README.md +111 -111
- package/dist/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +1877 -3363
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +16 -16
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/dist/kd-ui-complete.less +777 -777
- package/es/_utils/arrayUtil.js +0 -3
- package/es/_utils/devwarning.js +0 -1
- package/es/_utils/formatUtil.js +35 -96
- package/es/_utils/hooks.js +18 -42
- package/es/_utils/index.js +0 -2
- package/es/_utils/numberUtil.js +32 -55
- package/es/_utils/omit.js +0 -2
- package/es/_utils/type.js +0 -2
- package/es/_utils/usePopper.js +74 -137
- package/es/config-provider/compDefaultProps.js +0 -1
- package/es/config-provider/configProvider.js +2 -7
- package/es/config-provider/defaultConfig.js +0 -1
- package/es/index.js +0 -2
- package/es/locale/locale.js +5 -43
- package/es/style/color/colors.less +1 -1
- package/es/style/core/index.less +1 -1
- package/es/style/core/motion/other.less +27 -27
- package/es/style/core/motion/slide.less +53 -53
- package/es/style/core/motion.less +1 -1
- package/es/style/core/reset.less +185 -185
- package/es/style/index.less +1 -1
- package/es/style/mixins/index.less +18 -18
- package/es/style/mixins/overlay.less +21 -21
- package/es/style/mixins/reset.less +12 -12
- package/es/style/themes/default.less +445 -445
- package/es/table/base/calculations.js +22 -72
- package/es/table/base/colgroup.js +0 -1
- package/es/table/base/empty.js +4 -4
- package/es/table/base/header.d.ts +2 -1
- package/es/table/base/header.js +17 -68
- package/es/table/base/helpers/SpanManager.js +3 -9
- package/es/table/base/helpers/TableDOMUtils.js +3 -26
- package/es/table/base/helpers/__test__/SpanManager.test.js +2 -2
- package/es/table/base/helpers/__test__/TableDOMUtils.test.js +0 -1
- package/es/table/base/helpers/getRichVisibleRectsStream.js +11 -44
- package/es/table/base/helpers/rowHeightManager.js +0 -28
- package/es/table/base/html-table.js +15 -36
- package/es/table/base/loading.js +6 -8
- package/es/table/base/renderTemplates.js +50 -54
- package/es/table/base/styles.js +1 -10
- package/es/table/base/table.js +116 -189
- package/es/table/base/utils.js +14 -54
- package/es/table/common-views.js +0 -7
- package/es/table/internals.js +0 -13
- package/es/table/pipeline/features/autoFill.js +11 -38
- package/es/table/pipeline/features/autoRowSpan.js +1 -14
- package/es/table/pipeline/features/colGroupExtendable.js +4 -19
- package/es/table/pipeline/features/columnDrag.js +41 -95
- package/es/table/pipeline/features/columnFilter.js +11 -44
- package/es/table/pipeline/features/columnHover.js +1 -7
- package/es/table/pipeline/features/columnRangeHover.js +1 -8
- package/es/table/pipeline/features/columnResizeWidth.js +11 -37
- package/es/table/pipeline/features/contextMenu.js +18 -89
- package/es/table/pipeline/features/filter/DefaultFilterContent.js +10 -25
- package/es/table/pipeline/features/filter/DefaultFilterIcon.js +1 -1
- package/es/table/pipeline/features/filter/Filter.js +25 -48
- package/es/table/pipeline/features/filter/FilterPanel.js +11 -25
- package/es/table/pipeline/features/filter/util.js +0 -4
- package/es/table/pipeline/features/footerDataSource.js +0 -3
- package/es/table/pipeline/features/mergeCellHover.js +0 -1
- package/es/table/pipeline/features/multiSelect.js +15 -57
- package/es/table/pipeline/features/rangeSelection.js +63 -142
- package/es/table/pipeline/features/rowDetail.js +2 -41
- package/es/table/pipeline/features/rowGrouping.js +2 -35
- package/es/table/pipeline/features/singleSelect.js +0 -24
- package/es/table/pipeline/features/sort.js +29 -79
- package/es/table/pipeline/features/tips.js +0 -6
- package/es/table/pipeline/features/treeMode.js +9 -43
- package/es/table/pipeline/features/treeSelect.js +0 -26
- package/es/table/pipeline/pipeline.js +9 -49
- package/es/table/pivot/cross-table/buildCrossTable.js +15 -64
- package/es/table/pivot/cross-table/cross-table.js +22 -28
- package/es/table/pivot/cross-tree-table/buildCrossTreeTable.js +14 -47
- package/es/table/pivot/cross-tree-table/cross-tree-table.js +28 -50
- package/es/table/pivot/pivot-utils/buildDrillTree.js +10 -23
- package/es/table/pivot/pivot-utils/builders.js +31 -71
- package/es/table/pivot/pivot-utils/convert-utils.js +13 -39
- package/es/table/pivot/pivot-utils/simpleEncode.js +0 -1
- package/es/table/style/index.less +1 -1
- package/es/table/transforms/autoRowSpan.js +1 -15
- package/es/table/transforms/autoWidth.js +10 -32
- package/es/table/transforms/buildTree.js +1 -2
- package/es/table/transforms/columnHover.js +9 -15
- package/es/table/transforms/columnRangeHover.js +12 -19
- package/es/table/transforms/columnResize.js +15 -37
- package/es/table/transforms/flatten.js +0 -3
- package/es/table/transforms/orderField.js +0 -3
- package/es/table/transforms/sort.js +36 -88
- package/es/table/transforms/tips.js +1 -6
- package/es/table/transforms/treeMode.js +30 -69
- package/es/table/transforms/visible.js +0 -2
- package/es/table/use/useResizeObserver.js +1 -4
- package/es/table/utils/applyTransforms.js +0 -1
- package/es/table/utils/buildTree.js +4 -19
- package/es/table/utils/collectNodes.js +1 -10
- package/es/table/utils/console.js +0 -14
- package/es/table/utils/copyToClipboard.js +0 -4
- package/es/table/utils/element.js +14 -41
- package/es/table/utils/exportTableAsExcel.js +4 -40
- package/es/table/utils/getTreeDepth.js +1 -9
- package/es/table/utils/groupBy.js +1 -10
- package/es/table/utils/layeredFilter.js +0 -4
- package/es/table/utils/layeredSort.js +0 -5
- package/es/table/utils/makeRecursiveMapper.js +1 -12
- package/es/table/utils/mergeCellProps.js +6 -13
- package/es/table/utils/others.js +3 -16
- package/es/table/utils/proto.js +2 -30
- package/es/table/utils/smartCompare.js +4 -12
- package/es/table/utils/traverseColumn.js +2 -15
- package/es/table/utils/tree-data-helpers/StrictTreeDataHelper.js +1 -22
- package/es/table/utils/tree-data-helpers/TreeDataHelper.js +15 -69
- package/lib/_utils/arrayUtil.js +0 -5
- package/lib/_utils/devwarning.js +0 -5
- package/lib/_utils/formatUtil.js +35 -100
- package/lib/_utils/hooks.js +18 -53
- package/lib/_utils/index.js +0 -6
- package/lib/_utils/numberUtil.js +32 -63
- package/lib/_utils/omit.js +0 -5
- package/lib/_utils/react-children.js +0 -5
- package/lib/_utils/type.js +0 -6
- package/lib/_utils/usePopper.js +74 -158
- package/lib/config-provider/ConfigContext.js +1 -4
- package/lib/config-provider/compDefaultProps.js +0 -1
- package/lib/config-provider/configProvider.js +3 -18
- package/lib/config-provider/defaultConfig.js +0 -5
- package/lib/config-provider/index.js +0 -6
- package/lib/index.js +2 -8
- package/lib/locale/index.js +0 -7
- package/lib/locale/locale.js +5 -57
- package/lib/style/color/colors.less +1 -1
- package/lib/style/components.less +1 -1
- package/lib/style/core/index.less +1 -1
- package/lib/style/core/motion/other.less +27 -27
- package/lib/style/core/motion/slide.less +53 -53
- package/lib/style/core/motion.less +1 -1
- package/lib/style/core/reset.less +185 -185
- package/lib/style/index.less +1 -1
- package/lib/style/mixins/index.less +18 -18
- package/lib/style/mixins/overlay.less +21 -21
- package/lib/style/mixins/reset.less +12 -12
- package/lib/style/themes/default.less +445 -445
- package/lib/table/base/calculations.js +22 -83
- package/lib/table/base/colgroup.js +0 -5
- package/lib/table/base/empty.js +4 -16
- package/lib/table/base/header.d.ts +2 -1
- package/lib/table/base/header.js +17 -78
- package/lib/table/base/helpers/SpanManager.js +3 -11
- package/lib/table/base/helpers/TableDOMUtils.js +1 -26
- package/lib/table/base/helpers/__test__/SpanManager.test.js +2 -4
- package/lib/table/base/helpers/__test__/TableDOMUtils.test.js +0 -5
- package/lib/table/base/helpers/__test__/rowHeightManager.test.js +0 -1
- package/lib/table/base/helpers/getRichVisibleRectsStream.js +11 -62
- package/lib/table/base/helpers/rowHeightManager.js +0 -33
- package/lib/table/base/html-table.js +15 -46
- package/lib/table/base/index.js +0 -2
- package/lib/table/base/loading.js +6 -12
- package/lib/table/base/renderTemplates.js +51 -68
- package/lib/table/base/styles.js +1 -22
- package/lib/table/base/table.js +116 -222
- package/lib/table/base/utils.js +14 -89
- package/lib/table/common-views.js +0 -16
- package/lib/table/index.js +0 -13
- package/lib/table/internals.js +0 -14
- package/lib/table/pipeline/features/autoFill.js +11 -45
- package/lib/table/pipeline/features/autoRowSpan.js +1 -19
- package/lib/table/pipeline/features/buildTree.js +0 -2
- package/lib/table/pipeline/features/colGroupExtendable.js +4 -32
- package/lib/table/pipeline/features/columnDrag.js +41 -101
- package/lib/table/pipeline/features/columnFilter.js +11 -58
- package/lib/table/pipeline/features/columnHover.js +1 -11
- package/lib/table/pipeline/features/columnRangeHover.js +1 -13
- package/lib/table/pipeline/features/columnResizeWidth.js +11 -53
- package/lib/table/pipeline/features/contextMenu.js +18 -113
- package/lib/table/pipeline/features/filter/DefaultFilterContent.js +10 -43
- package/lib/table/pipeline/features/filter/DefaultFilterIcon.js +1 -4
- package/lib/table/pipeline/features/filter/Filter.js +25 -70
- package/lib/table/pipeline/features/filter/FilterPanel.js +11 -40
- package/lib/table/pipeline/features/filter/index.js +0 -5
- package/lib/table/pipeline/features/filter/util.js +0 -7
- package/lib/table/pipeline/features/footerDataSource.js +0 -10
- package/lib/table/pipeline/features/index.js +0 -22
- package/lib/table/pipeline/features/mergeCellHover.js +0 -5
- package/lib/table/pipeline/features/multiSelect.js +15 -70
- package/lib/table/pipeline/features/rangeSelection.js +63 -159
- package/lib/table/pipeline/features/rowDetail.js +2 -65
- package/lib/table/pipeline/features/rowGrouping.js +2 -55
- package/lib/table/pipeline/features/singleSelect.js +0 -33
- package/lib/table/pipeline/features/sort.js +29 -99
- package/lib/table/pipeline/features/tips.js +0 -15
- package/lib/table/pipeline/features/treeMode.js +9 -64
- package/lib/table/pipeline/features/treeSelect.js +0 -34
- package/lib/table/pipeline/index.js +0 -8
- package/lib/table/pipeline/pipeline.js +9 -58
- package/lib/table/pivot/cross-table/buildCrossTable.js +15 -75
- package/lib/table/pivot/cross-table/cross-table.js +22 -36
- package/lib/table/pivot/cross-table/index.js +0 -4
- package/lib/table/pivot/cross-tree-table/buildCrossTreeTable.js +14 -60
- package/lib/table/pivot/cross-tree-table/cross-tree-table.js +28 -60
- package/lib/table/pivot/cross-tree-table/index.js +0 -3
- package/lib/table/pivot/pivot-utils/buildDrillTree.js +10 -29
- package/lib/table/pivot/pivot-utils/builders.js +31 -82
- package/lib/table/pivot/pivot-utils/convert-utils.js +13 -57
- package/lib/table/pivot/pivot-utils/index.js +0 -7
- package/lib/table/pivot/pivot-utils/simpleEncode.js +0 -2
- package/lib/table/style/css.js +0 -1
- package/lib/table/style/index.js +0 -1
- package/lib/table/style/index.less +1 -1
- package/lib/table/transforms/autoRowSpan.js +1 -21
- package/lib/table/transforms/autoWidth.js +10 -53
- package/lib/table/transforms/buildTree.js +1 -4
- package/lib/table/transforms/columnHover.js +9 -22
- package/lib/table/transforms/columnRangeHover.js +12 -27
- package/lib/table/transforms/columnResize.js +15 -56
- package/lib/table/transforms/flatten.js +0 -5
- package/lib/table/transforms/index.js +0 -12
- package/lib/table/transforms/orderField.js +0 -7
- package/lib/table/transforms/sort.js +36 -112
- package/lib/table/transforms/tips.js +1 -16
- package/lib/table/transforms/treeMode.js +30 -96
- package/lib/table/transforms/visible.js +0 -7
- package/lib/table/transforms/warnTransformsDeprecated.js +0 -4
- package/lib/table/use/useResizeObserver.js +1 -8
- package/lib/table/utils/applyTransforms.js +0 -2
- package/lib/table/utils/buildTree.js +4 -30
- package/lib/table/utils/collectNodes.js +1 -15
- package/lib/table/utils/console.js +0 -16
- package/lib/table/utils/copyToClipboard.js +0 -6
- package/lib/table/utils/element.js +14 -46
- package/lib/table/utils/exportTableAsExcel.js +4 -49
- package/lib/table/utils/getTreeDepth.js +1 -14
- package/lib/table/utils/groupBy.js +1 -14
- package/lib/table/utils/index.js +0 -20
- package/lib/table/utils/isGroupColumn.js +0 -3
- package/lib/table/utils/isLeafNode.js +0 -1
- package/lib/table/utils/layeredFilter.js +0 -10
- package/lib/table/utils/layeredSort.js +0 -10
- package/lib/table/utils/makeRecursiveMapper.js +1 -21
- package/lib/table/utils/mergeCellProps.js +6 -17
- package/lib/table/utils/others.js +3 -31
- package/lib/table/utils/proto.js +2 -33
- package/lib/table/utils/smartCompare.js +4 -13
- package/lib/table/utils/traverseColumn.js +2 -22
- package/lib/table/utils/tree-data-helpers/StrictTreeDataHelper.js +1 -30
- package/lib/table/utils/tree-data-helpers/TreeDataHelper.js +15 -82
- package/package.json +219 -218
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
|
|
2
2
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
3
3
|
import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
|
|
4
|
-
|
|
5
4
|
var _templateObject;
|
|
6
|
-
|
|
7
5
|
import React, { useEffect } from 'react';
|
|
8
6
|
import { createPortal } from 'react-dom';
|
|
9
7
|
import styled from 'styled-components';
|
|
@@ -16,34 +14,27 @@ import { calculatePopupRelative } from '../../../utils';
|
|
|
16
14
|
import { addResizeObserver } from '../../../base/utils';
|
|
17
15
|
import KeyCode from '../../../utils/keyCode';
|
|
18
16
|
var HEADER_ICON_OFFSET_Y = 8 + 1; // padding-top + border
|
|
19
|
-
|
|
20
17
|
var HEADER_ICON_OFFSET_X = 16 + 1; // padding-left+ border
|
|
21
|
-
|
|
22
18
|
var FilterIconSpanStyle = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n // position: absolute;\n // right: 4px;\n // cursor: pointer;\n // transform: translateY(-50%);\n // top: 50%;\n // height: 12px; \n > .", " {\n display: flex\n }\n"])), Classes.filterIcon);
|
|
23
|
-
|
|
24
19
|
function Panel(_ref) {
|
|
25
20
|
var ele = _ref.ele,
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
21
|
+
filterIcon = _ref.filterIcon,
|
|
22
|
+
hidePanel = _ref.hidePanel,
|
|
23
|
+
renderPanelContent = _ref.renderPanelContent,
|
|
24
|
+
hideFilterPopupHeader = _ref.hideFilterPopupHeader,
|
|
25
|
+
popupParent = _ref.popupParent;
|
|
31
26
|
var filterPanelRef = React.useRef(null);
|
|
32
|
-
|
|
33
27
|
var _React$useState = React.useState(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader))),
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
28
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
29
|
+
position = _React$useState2[0],
|
|
30
|
+
setPosition = _React$useState2[1];
|
|
38
31
|
var style = {
|
|
39
32
|
position: 'absolute',
|
|
40
33
|
zIndex: 1050
|
|
41
34
|
};
|
|
42
|
-
|
|
43
35
|
var handleFilterPanelResize = function handleFilterPanelResize(resize) {
|
|
44
36
|
setPosition(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader)));
|
|
45
37
|
};
|
|
46
|
-
|
|
47
38
|
useEffect(function () {
|
|
48
39
|
var resizeObserver = addResizeObserver(filterPanelRef.current.children[0], handleFilterPanelResize);
|
|
49
40
|
return function () {
|
|
@@ -60,38 +51,32 @@ function Panel(_ref) {
|
|
|
60
51
|
hideFilterPopupHeader: hideFilterPopupHeader
|
|
61
52
|
}, renderPanelContent()));
|
|
62
53
|
}
|
|
63
|
-
|
|
64
54
|
function Filter(_ref2) {
|
|
65
55
|
var _cx;
|
|
66
|
-
|
|
67
56
|
var _ref2$size = _ref2.size,
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
57
|
+
size = _ref2$size === void 0 ? 12 : _ref2$size,
|
|
58
|
+
style = _ref2.style,
|
|
59
|
+
className = _ref2.className,
|
|
60
|
+
FilterPanelContent = _ref2.FilterPanelContent,
|
|
61
|
+
filterIcon = _ref2.filterIcon,
|
|
62
|
+
setFilter = _ref2.setFilter,
|
|
63
|
+
setFilterModel = _ref2.setFilterModel,
|
|
64
|
+
filterModel = _ref2.filterModel,
|
|
65
|
+
isFilterActive = _ref2.isFilterActive,
|
|
66
|
+
stopClickEventPropagation = _ref2.stopClickEventPropagation,
|
|
67
|
+
stopESCKeyDownEventPropagation = _ref2.stopESCKeyDownEventPropagation,
|
|
68
|
+
hideFilterPopupHeader = _ref2.hideFilterPopupHeader,
|
|
69
|
+
getPopupParent = _ref2.getPopupParent,
|
|
70
|
+
localeText = _ref2.localeText;
|
|
83
71
|
var _React$useState3 = React.useState(false),
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
72
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
73
|
+
showPanel = _React$useState4[0],
|
|
74
|
+
setShowPanel = _React$useState4[1];
|
|
88
75
|
var iconRef = React.useRef(null);
|
|
89
76
|
var iconWrapRef = React.useRef();
|
|
90
|
-
|
|
91
77
|
var hidePanel = function hidePanel() {
|
|
92
78
|
return setShowPanel(false);
|
|
93
79
|
};
|
|
94
|
-
|
|
95
80
|
var renderPanelContent = function renderPanelContent() {
|
|
96
81
|
if (FilterPanelContent) {
|
|
97
82
|
return /*#__PURE__*/React.createElement(FilterPanelContent, {
|
|
@@ -110,31 +95,26 @@ function Filter(_ref2) {
|
|
|
110
95
|
});
|
|
111
96
|
}
|
|
112
97
|
};
|
|
113
|
-
|
|
114
98
|
var handleIconClick = function handleIconClick(e) {
|
|
115
99
|
// 只有当icon区域点击会触发面板展开
|
|
116
100
|
// 防止 createPortal 区域的点击触发该事件
|
|
117
101
|
if (e.currentTarget.contains(e.target)) {
|
|
118
102
|
setShowPanel(true);
|
|
119
103
|
}
|
|
120
|
-
|
|
121
104
|
if (stopClickEventPropagation) {
|
|
122
105
|
e.stopPropagation();
|
|
123
106
|
}
|
|
124
107
|
};
|
|
125
|
-
|
|
126
108
|
var handleKeyDown = function handleKeyDown(e) {
|
|
127
109
|
if (e.keyCode === KeyCode.ESC) {
|
|
128
110
|
if (e.currentTarget.contains(e.target)) {
|
|
129
111
|
setShowPanel(false);
|
|
130
112
|
}
|
|
131
|
-
|
|
132
113
|
if (stopESCKeyDownEventPropagation) {
|
|
133
114
|
e.stopPropagation();
|
|
134
115
|
}
|
|
135
116
|
}
|
|
136
117
|
};
|
|
137
|
-
|
|
138
118
|
var iconClassName = cx((_cx = {}, _defineProperty(_cx, className, true), _defineProperty(_cx, 'filter-panel-open', showPanel), _cx));
|
|
139
119
|
var displayFilterIcon = typeof filterIcon === 'function' ? filterIcon(isFilterActive) : filterIcon;
|
|
140
120
|
var popupParent = (getPopupParent === null || getPopupParent === void 0 ? void 0 : getPopupParent(iconWrapRef.current)) || document.body;
|
|
@@ -160,7 +140,6 @@ function Filter(_ref2) {
|
|
|
160
140
|
popupParent: popupParent
|
|
161
141
|
}), popupParent));
|
|
162
142
|
}
|
|
163
|
-
|
|
164
143
|
function _getPanelOffset(ele, hideFilterPopupHeader) {
|
|
165
144
|
if (hideFilterPopupHeader) {
|
|
166
145
|
return {
|
|
@@ -168,11 +147,9 @@ function _getPanelOffset(ele, hideFilterPopupHeader) {
|
|
|
168
147
|
y: 0 - ele.offsetHeight
|
|
169
148
|
};
|
|
170
149
|
}
|
|
171
|
-
|
|
172
150
|
return {
|
|
173
151
|
x: HEADER_ICON_OFFSET_X,
|
|
174
152
|
y: HEADER_ICON_OFFSET_Y
|
|
175
153
|
};
|
|
176
154
|
}
|
|
177
|
-
|
|
178
155
|
export default Filter;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
2
2
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
3
3
|
import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
|
|
4
|
-
|
|
5
4
|
var _templateObject;
|
|
6
|
-
|
|
7
5
|
import React, { useEffect, useState, useRef } from 'react';
|
|
8
6
|
import styled from 'styled-components';
|
|
9
7
|
import { isElementInEventPath, keepWithinBounds } from '../../../utils/';
|
|
@@ -11,7 +9,6 @@ import DefaultFilterIcon from './DefaultFilterIcon';
|
|
|
11
9
|
import { Classes } from '../../../base/styles';
|
|
12
10
|
import KeyCode from '../../../utils/keyCode';
|
|
13
11
|
var FilterPanelStyle = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\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 .", " {\n display: flex;\n background-color: #ebedf1;\n\n .", " {\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 .", " {\n display: flex;\n }\n"])), Classes.popupHeader, Classes.filterIcon, Classes.popupBody);
|
|
14
|
-
|
|
15
12
|
var useWindowEvents = function useWindowEvents(func, evens) {
|
|
16
13
|
React.useEffect(function () {
|
|
17
14
|
evens.forEach(function (event) {
|
|
@@ -24,55 +21,45 @@ var useWindowEvents = function useWindowEvents(func, evens) {
|
|
|
24
21
|
};
|
|
25
22
|
}, [evens, func]);
|
|
26
23
|
};
|
|
27
|
-
|
|
28
24
|
function FilterPanel(_ref) {
|
|
29
25
|
var style = _ref.style,
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
26
|
+
children = _ref.children,
|
|
27
|
+
position = _ref.position,
|
|
28
|
+
filterIcon = _ref.filterIcon,
|
|
29
|
+
onClose = _ref.onClose,
|
|
30
|
+
hideFilterPopupHeader = _ref.hideFilterPopupHeader;
|
|
36
31
|
var _useState = useState(position),
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
32
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
33
|
+
perfectPosition = _useState2[0],
|
|
34
|
+
setPerfectPosition = _useState2[1];
|
|
41
35
|
var _useState3 = useState(false),
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
36
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
37
|
+
visible = _useState4[0],
|
|
38
|
+
setVisible = _useState4[1];
|
|
46
39
|
var ref = React.useRef(null);
|
|
47
|
-
|
|
48
40
|
var isContainPanel = function isContainPanel(e) {
|
|
49
41
|
return isElementInEventPath(ref.current, e);
|
|
50
42
|
};
|
|
51
|
-
|
|
52
43
|
useEffect(function () {
|
|
53
44
|
setPerfectPosition(keepWithinBounds(document.body, ref.current, position.x, position.y, true));
|
|
54
45
|
setVisible(true);
|
|
55
46
|
}, [position]);
|
|
56
47
|
var hasPopupMouseEvent = useRef(false);
|
|
57
|
-
|
|
58
48
|
var handleMouseEvent = function handleMouseEvent() {
|
|
59
49
|
// 当弹出的过滤面板内部发生鼠标按下、抬起事件时,标记当前事件,并在click捕获期清除标记,用来确定鼠标按下、抬起发生在过滤面板内部
|
|
60
50
|
// 利用了React.createPortal冒泡是根据React Tree的特性:
|
|
61
51
|
// https://jwwnz.medium.com/react-portals-and-event-bubbling-8df3e35ca3f1
|
|
62
52
|
hasPopupMouseEvent.current = true;
|
|
63
53
|
};
|
|
64
|
-
|
|
65
54
|
useWindowEvents(function (e) {
|
|
66
55
|
!isContainPanel(e) && !hasPopupMouseEvent.current && onClose();
|
|
67
56
|
hasPopupMouseEvent.current = false;
|
|
68
57
|
}, ['click']);
|
|
69
|
-
|
|
70
58
|
var handleKeyDown = function handleKeyDown(e) {
|
|
71
59
|
if (e.currentTarget.contains(e.target) && e.keyCode === KeyCode.ESC) {
|
|
72
60
|
onClose();
|
|
73
61
|
}
|
|
74
62
|
};
|
|
75
|
-
|
|
76
63
|
return /*#__PURE__*/React.createElement(FilterPanelStyle, {
|
|
77
64
|
className: Classes.popup,
|
|
78
65
|
style: _extends(_extends({}, style), {
|
|
@@ -96,5 +83,4 @@ function FilterPanel(_ref) {
|
|
|
96
83
|
className: Classes.popupBody
|
|
97
84
|
}, children));
|
|
98
85
|
}
|
|
99
|
-
|
|
100
86
|
export default FilterPanel;
|
|
@@ -7,11 +7,9 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
7
7
|
if (data == null) {
|
|
8
8
|
return false;
|
|
9
9
|
}
|
|
10
|
-
|
|
11
10
|
if (typeof data === 'number') {
|
|
12
11
|
data = data + '';
|
|
13
12
|
}
|
|
14
|
-
|
|
15
13
|
return _includesInstanceProperty(data).call(data, value[0]);
|
|
16
14
|
};
|
|
17
15
|
}
|
|
@@ -23,11 +21,9 @@ var DEFAULT_FILTER_OPTIONS = [{
|
|
|
23
21
|
if (data == null) {
|
|
24
22
|
return true;
|
|
25
23
|
}
|
|
26
|
-
|
|
27
24
|
if (typeof data === 'number') {
|
|
28
25
|
data = data + '';
|
|
29
26
|
}
|
|
30
|
-
|
|
31
27
|
return !_includesInstanceProperty(data).call(data, value[0]);
|
|
32
28
|
};
|
|
33
29
|
}
|
|
@@ -7,11 +7,9 @@ export function footerDataSource() {
|
|
|
7
7
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
8
8
|
return function footerDataSourceStep(pipeline) {
|
|
9
9
|
var _a, _b;
|
|
10
|
-
|
|
11
10
|
var footerDataSource = (_a = opts.dataSource) !== null && _a !== void 0 ? _a : pipeline.getFooterDataSource();
|
|
12
11
|
var footerRowMetaKey = (_b = opts.footerRowMetaKey) !== null && _b !== void 0 ? _b : footerRowMetaSymbol;
|
|
13
12
|
pipeline.setFeatureOptions('footerRowMetaKey', footerRowMetaKey);
|
|
14
|
-
|
|
15
13
|
if (footerDataSource) {
|
|
16
14
|
pipeline.footerDataSource(_mapInstanceProperty(footerDataSource).call(footerDataSource, function (row) {
|
|
17
15
|
return _extends(_defineProperty({}, footerRowMetaKey, true), row);
|
|
@@ -19,7 +17,6 @@ export function footerDataSource() {
|
|
|
19
17
|
} else {
|
|
20
18
|
console.warn('调用 pipeline.use(features.footerDataSource()) 前请先设置页脚数据源,设置方法有:pipeline.use(features.footerDataSource({dataSource:any[]})) 或者 pipeline.footerDataSource(any[])');
|
|
21
19
|
}
|
|
22
|
-
|
|
23
20
|
return pipeline;
|
|
24
21
|
};
|
|
25
22
|
}
|
|
@@ -13,23 +13,18 @@ export function multiSelect() {
|
|
|
13
13
|
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
14
14
|
return function multiSelectStep(pipeline) {
|
|
15
15
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
16
|
-
|
|
17
16
|
var stateKey = 'multiSelect';
|
|
18
17
|
var Checkbox = pipeline.ctx.components.Checkbox;
|
|
19
|
-
|
|
20
18
|
if (Checkbox == null) {
|
|
21
19
|
throw new Error('使用 multiSelect 之前需要设置 pipeline.ctx.components.Checkbox');
|
|
22
20
|
}
|
|
23
|
-
|
|
24
21
|
var primaryKey = pipeline.ensurePrimaryKey('multiSelect');
|
|
25
22
|
var isDisabled = (_a = opts.isDisabled) !== null && _a !== void 0 ? _a : always(false);
|
|
26
23
|
var clickArea = (_b = opts.clickArea) !== null && _b !== void 0 ? _b : 'checkbox';
|
|
27
24
|
var value = (_f = (_e = (_c = opts.value) !== null && _c !== void 0 ? _c : (_d = pipeline.getStateAtKey(stateKey)) === null || _d === void 0 ? void 0 : _d.value) !== null && _e !== void 0 ? _e : opts.defaultValue) !== null && _f !== void 0 ? _f : [];
|
|
28
25
|
var lastKey = (_k = (_j = (_g = opts.lastKey) !== null && _g !== void 0 ? _g : (_h = pipeline.getStateAtKey(stateKey)) === null || _h === void 0 ? void 0 : _h.lastKey) !== null && _j !== void 0 ? _j : opts.defaultLastKey) !== null && _k !== void 0 ? _k : '';
|
|
29
|
-
|
|
30
26
|
var _onChange = function onChange(nextValue, key, keys, action) {
|
|
31
27
|
var _a;
|
|
32
|
-
|
|
33
28
|
(_a = opts.onChange) === null || _a === void 0 ? void 0 : _a.call(opts, nextValue, key, keys, action);
|
|
34
29
|
pipeline.setStateAtKey(stateKey, {
|
|
35
30
|
value: nextValue,
|
|
@@ -40,46 +35,38 @@ export function multiSelect() {
|
|
|
40
35
|
});
|
|
41
36
|
};
|
|
42
37
|
/** dataSource 中包含的所有 keys */
|
|
43
|
-
|
|
44
|
-
|
|
45
38
|
var fullKeySet = new _Set();
|
|
46
39
|
/** 所有有效的 keys(disable 状态为 false) */
|
|
47
|
-
|
|
48
40
|
var allKeys = [];
|
|
49
41
|
var set = new _Set(value);
|
|
50
42
|
var isAllChecked = set.size !== 0; // 当前不存在选中则默认为false
|
|
51
|
-
|
|
52
43
|
var isAnyChecked = false;
|
|
53
44
|
var flatDataSource = collectNodes(pipeline.getDataSource());
|
|
54
45
|
flatDataSource.forEach(function (row, rowIndex) {
|
|
55
46
|
var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
56
|
-
fullKeySet.add(rowKey);
|
|
57
|
-
|
|
47
|
+
fullKeySet.add(rowKey);
|
|
48
|
+
// 在 allKeys 中排除被禁用的 key
|
|
58
49
|
if (!isDisabled(row, rowIndex)) {
|
|
59
|
-
allKeys.push(rowKey);
|
|
60
|
-
|
|
50
|
+
allKeys.push(rowKey);
|
|
51
|
+
// 存在一个非选中,则不再进行判断
|
|
61
52
|
if (isAllChecked) {
|
|
62
53
|
isAllChecked = set.has(rowKey);
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
|
|
54
|
+
}
|
|
55
|
+
// 存在一个选中,则不再进行判断
|
|
66
56
|
if (!isAnyChecked) {
|
|
67
57
|
isAnyChecked = set.has(rowKey);
|
|
68
58
|
}
|
|
69
59
|
}
|
|
70
|
-
});
|
|
71
|
-
|
|
60
|
+
});
|
|
61
|
+
// todo: 暂使用hidden隐藏选择列 后续增加配置
|
|
72
62
|
var hiddenSelectColumn = opts.checkboxColumn && opts.checkboxColumn.hidden === true;
|
|
73
|
-
|
|
74
63
|
if (!hiddenSelectColumn) {
|
|
75
64
|
var _context;
|
|
76
|
-
|
|
77
65
|
var defaultCheckboxColumnTitle = /*#__PURE__*/React.createElement(Checkbox, {
|
|
78
66
|
checked: isAllChecked,
|
|
79
67
|
indeterminate: !isAllChecked && isAnyChecked,
|
|
80
68
|
onChange: function onChange(_) {
|
|
81
69
|
var allKeys = pipeline.getFeatureOptions(allEnableKeys);
|
|
82
|
-
|
|
83
70
|
if (isAllChecked) {
|
|
84
71
|
_onChange(arrayUtils.diff(value, allKeys), '', allKeys, 'uncheck-all');
|
|
85
72
|
} else {
|
|
@@ -87,7 +74,6 @@ export function multiSelect() {
|
|
|
87
74
|
}
|
|
88
75
|
}
|
|
89
76
|
});
|
|
90
|
-
|
|
91
77
|
var checkboxColumn = _extends(_extends({
|
|
92
78
|
name: '是否选中',
|
|
93
79
|
title: defaultCheckboxColumnTitle,
|
|
@@ -96,13 +82,11 @@ export function multiSelect() {
|
|
|
96
82
|
}, opts.checkboxColumn), {
|
|
97
83
|
getCellProps: function getCellProps(value, row, rowIndex) {
|
|
98
84
|
var _a, _b;
|
|
99
|
-
|
|
100
85
|
var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
101
86
|
var checkboxCellProps = {};
|
|
102
87
|
var preCellProps = (_b = (_a = opts.checkboxColumn) === null || _a === void 0 ? void 0 : _a.getCellProps) === null || _b === void 0 ? void 0 : _b.call(_a, value, row, rowIndex);
|
|
103
88
|
var fullRowsSet = pipeline.getFeatureOptions(fullRowsSetKey) || new _Set();
|
|
104
89
|
var selectValueSet = pipeline.getFeatureOptions(selectValueSetKey) || new _Set();
|
|
105
|
-
|
|
106
90
|
if (fullRowsSet.has(rowKey) && clickArea === 'cell') {
|
|
107
91
|
var prevChecked = selectValueSet.has(rowKey);
|
|
108
92
|
var disabled = isDisabled(row, rowIndex);
|
|
@@ -114,19 +98,16 @@ export function multiSelect() {
|
|
|
114
98
|
if (opts.stopClickEventPropagation) {
|
|
115
99
|
e.stopPropagation();
|
|
116
100
|
}
|
|
117
|
-
|
|
118
101
|
onCheckboxChange(prevChecked, rowKey, e.shiftKey);
|
|
119
102
|
}
|
|
120
103
|
};
|
|
121
104
|
}
|
|
122
|
-
|
|
123
105
|
return mergeCellProps(preCellProps, checkboxCellProps);
|
|
124
106
|
},
|
|
125
107
|
render: function render(_, row, rowIndex) {
|
|
126
108
|
if (row[pipeline.getFeatureOptions('footerRowMetaKey')]) {
|
|
127
109
|
return null;
|
|
128
110
|
}
|
|
129
|
-
|
|
130
111
|
var key = internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
131
112
|
var selectValueSet = pipeline.getFeatureOptions(selectValueSetKey) || new _Set();
|
|
132
113
|
var checked = selectValueSet.has(key);
|
|
@@ -134,80 +115,64 @@ export function multiSelect() {
|
|
|
134
115
|
checked: checked,
|
|
135
116
|
disabled: isDisabled(row, rowIndex),
|
|
136
117
|
onChange: clickArea === 'checkbox' ? function (arg1, arg2) {
|
|
137
|
-
var _a;
|
|
118
|
+
var _a;
|
|
119
|
+
// 这里要同时兼容 antd 和 fusion 的用法
|
|
138
120
|
// fusion: arg2?.nativeEvent
|
|
139
121
|
// antd: arg1.nativeEvent
|
|
140
|
-
|
|
141
|
-
|
|
142
122
|
var nativeEvent = (_a = arg2 === null || arg2 === void 0 ? void 0 : arg2.nativeEvent) !== null && _a !== void 0 ? _a : arg1.nativeEvent;
|
|
143
|
-
|
|
144
123
|
if (nativeEvent) {
|
|
145
124
|
if (opts.stopClickEventPropagation) {
|
|
146
125
|
nativeEvent.stopPropagation();
|
|
147
126
|
}
|
|
148
|
-
|
|
149
127
|
onCheckboxChange(checked, key, nativeEvent.shiftKey);
|
|
150
128
|
}
|
|
151
129
|
} : undefined
|
|
152
130
|
});
|
|
153
131
|
}
|
|
154
132
|
});
|
|
155
|
-
|
|
156
133
|
var nextColumns = _sliceInstanceProperty(_context = pipeline.getColumns()).call(_context);
|
|
157
|
-
|
|
158
134
|
var checkboxPlacement = (_l = opts.checkboxPlacement) !== null && _l !== void 0 ? _l : 'start';
|
|
159
|
-
|
|
160
135
|
if (checkboxPlacement === 'start') {
|
|
161
136
|
nextColumns.unshift(checkboxColumn);
|
|
162
137
|
} else {
|
|
163
138
|
nextColumns.push(checkboxColumn);
|
|
164
139
|
}
|
|
165
|
-
|
|
166
140
|
pipeline.columns(nextColumns);
|
|
167
141
|
}
|
|
168
|
-
|
|
169
142
|
pipeline.appendRowPropsGetter(function (row, rowIndex) {
|
|
170
143
|
var rowKey = internals.safeGetRowKey(primaryKey, row, rowIndex);
|
|
171
144
|
var fullRowsSet = pipeline.getFeatureOptions(fullRowsSetKey) || new _Set();
|
|
172
|
-
|
|
173
145
|
if (!fullRowsSet.has(rowKey)) {
|
|
174
146
|
// rowKey 不在 fullKeySet 中说明这一行是在 multiSelect 之后才生成的,multiSelect 不对之后生成的行进行处理
|
|
175
147
|
return;
|
|
176
148
|
}
|
|
177
|
-
|
|
178
149
|
var style = {};
|
|
179
150
|
var className;
|
|
180
151
|
var onClick;
|
|
181
152
|
var selectValueSet = pipeline.getFeatureOptions(selectValueSetKey) || new _Set();
|
|
182
153
|
var checked = selectValueSet.has(rowKey);
|
|
183
|
-
|
|
184
154
|
if (opts.highlightRowWhenSelected && checked) {
|
|
185
155
|
className = 'highlight';
|
|
186
156
|
}
|
|
187
|
-
|
|
188
157
|
if (clickArea === 'row') {
|
|
189
158
|
var disabled = isDisabled(row, rowIndex);
|
|
190
|
-
|
|
191
159
|
if (!disabled) {
|
|
192
160
|
style.cursor = 'pointer';
|
|
193
|
-
|
|
194
161
|
onClick = function onClick(e) {
|
|
195
162
|
if (opts.stopClickEventPropagation) {
|
|
196
163
|
e.stopPropagation();
|
|
197
164
|
}
|
|
198
|
-
|
|
199
165
|
onCheckboxChange(checked, rowKey, e.shiftKey);
|
|
200
166
|
};
|
|
201
167
|
}
|
|
202
168
|
}
|
|
203
|
-
|
|
204
169
|
return {
|
|
205
170
|
className: className,
|
|
206
171
|
style: style,
|
|
207
172
|
onClick: onClick
|
|
208
173
|
};
|
|
209
|
-
});
|
|
210
|
-
|
|
174
|
+
});
|
|
175
|
+
// 只保留一份到pipeline, 避免行数据过多时内容被握住
|
|
211
176
|
pipeline.setFeatureOptions(fullRowsSetKey, fullKeySet);
|
|
212
177
|
pipeline.setFeatureOptions(allEnableKeys, allKeys);
|
|
213
178
|
pipeline.setFeatureOptions(selectValueSetKey, set);
|
|
@@ -215,25 +180,18 @@ export function multiSelect() {
|
|
|
215
180
|
allKeys = null;
|
|
216
181
|
set = null;
|
|
217
182
|
return pipeline;
|
|
218
|
-
|
|
219
183
|
function onCheckboxChange(prevChecked, key, batch) {
|
|
220
184
|
var batchKeys = [key];
|
|
221
|
-
|
|
222
185
|
if (batch && lastKey) {
|
|
223
186
|
var _allKeys = pipeline.getFeatureOptions(allEnableKeys);
|
|
224
|
-
|
|
225
187
|
var lastIdx = _allKeys.indexOf(lastKey);
|
|
226
|
-
|
|
227
188
|
var cntIdx = _allKeys.indexOf(key);
|
|
228
|
-
|
|
229
189
|
var _ref = lastIdx < cntIdx ? [lastIdx, cntIdx] : [cntIdx, lastIdx],
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
190
|
+
_ref2 = _slicedToArray(_ref, 2),
|
|
191
|
+
start = _ref2[0],
|
|
192
|
+
end = _ref2[1];
|
|
234
193
|
batchKeys = _sliceInstanceProperty(_allKeys).call(_allKeys, start, end + 1);
|
|
235
194
|
}
|
|
236
|
-
|
|
237
195
|
if (prevChecked) {
|
|
238
196
|
_onChange(arrayUtils.diff(value, batchKeys), key, batchKeys, 'uncheck');
|
|
239
197
|
} else {
|