@kdcloudjs/table 1.2.0-canary.16 → 1.2.0-canary.16-hotfix
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 +2047 -3489
- 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/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/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.js +14 -67
- package/es/table/base/helpers/SpanManager.js +3 -9
- package/es/table/base/helpers/TableDOMUtils.js +4 -27
- 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 +14 -35
- package/es/table/base/loading.js +6 -8
- package/es/table/base/renderTemplates.js +26 -44
- package/es/table/base/styles.js +0 -9
- package/es/table/base/table.js +95 -181
- 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 -40
- package/es/table/pipeline/features/autoRowSpan.js +1 -14
- package/es/table/pipeline/features/colGroupExtendable.js +4 -19
- package/es/table/pipeline/features/columnDrag.d.ts +1 -0
- package/es/table/pipeline/features/columnDrag.js +236 -303
- package/es/table/pipeline/features/columnFilter.js +11 -48
- 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 +51 -42
- 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/rowDrag.js +36 -71
- 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 +31 -83
- package/es/table/pipeline/features/tips.js +0 -6
- package/es/table/pipeline/features/treeMode.js +9 -44
- package/es/table/pipeline/features/treeSelect.js +0 -26
- package/es/table/pipeline/features/utils/touchEventUtils.d.ts +15 -0
- package/es/table/pipeline/features/utils/touchEventUtils.js +65 -0
- package/es/table/pipeline/pipeline.js +11 -51
- 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/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/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.js +14 -77
- package/lib/table/base/helpers/SpanManager.js +3 -11
- package/lib/table/base/helpers/TableDOMUtils.js +2 -27
- 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 +14 -45
- package/lib/table/base/index.js +0 -2
- package/lib/table/base/loading.js +6 -12
- package/lib/table/base/renderTemplates.js +27 -58
- package/lib/table/base/styles.js +0 -21
- package/lib/table/base/table.js +95 -214
- 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 -47
- 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.d.ts +1 -0
- package/lib/table/pipeline/features/columnDrag.js +236 -309
- package/lib/table/pipeline/features/columnFilter.js +11 -62
- 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 +51 -58
- 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 -23
- package/lib/table/pipeline/features/mergeCellHover.js +0 -5
- package/lib/table/pipeline/features/multiSelect.js +15 -71
- package/lib/table/pipeline/features/rangeSelection.js +63 -159
- package/lib/table/pipeline/features/rowDetail.js +2 -65
- package/lib/table/pipeline/features/rowDrag.js +36 -81
- package/lib/table/pipeline/features/rowGrouping.js +2 -55
- package/lib/table/pipeline/features/singleSelect.js +0 -34
- package/lib/table/pipeline/features/sort.js +31 -103
- package/lib/table/pipeline/features/tips.js +0 -15
- package/lib/table/pipeline/features/treeMode.js +9 -65
- package/lib/table/pipeline/features/treeSelect.js +0 -34
- package/lib/table/pipeline/features/utils/touchEventUtils.d.ts +15 -0
- package/lib/table/pipeline/features/utils/touchEventUtils.js +76 -0
- package/lib/table/pipeline/index.js +0 -8
- package/lib/table/pipeline/pipeline.js +11 -60
- 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/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 -21
- 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/selectColumn.js +0 -1
- 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 +2 -1
package/lib/table/base/table.js
CHANGED
|
@@ -1,166 +1,107 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
|
|
4
|
-
|
|
5
4
|
var _Reflect$construct = require("@babel/runtime-corejs3/core-js-stable/reflect/construct");
|
|
6
|
-
|
|
7
5
|
var _sliceInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/slice");
|
|
8
|
-
|
|
9
6
|
var _Array$from = require("@babel/runtime-corejs3/core-js-stable/array/from");
|
|
10
|
-
|
|
11
7
|
var _Symbol = require("@babel/runtime-corejs3/core-js-stable/symbol");
|
|
12
|
-
|
|
13
8
|
var _getIteratorMethod = require("@babel/runtime-corejs3/core-js/get-iterator-method");
|
|
14
|
-
|
|
15
9
|
var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
|
|
16
|
-
|
|
17
10
|
var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
|
|
18
|
-
|
|
19
11
|
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
20
|
-
|
|
21
12
|
Object.defineProperty(exports, "__esModule", {
|
|
22
13
|
value: true
|
|
23
14
|
});
|
|
24
15
|
exports.BaseTable = void 0;
|
|
25
|
-
|
|
26
16
|
var _slice = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/slice"));
|
|
27
|
-
|
|
28
17
|
var _flat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/flat"));
|
|
29
|
-
|
|
30
18
|
var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
|
|
31
|
-
|
|
32
19
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
|
|
33
|
-
|
|
34
20
|
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
35
|
-
|
|
36
21
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
37
|
-
|
|
38
22
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/classCallCheck"));
|
|
39
|
-
|
|
40
23
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/createClass"));
|
|
41
|
-
|
|
42
24
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/inherits"));
|
|
43
|
-
|
|
44
25
|
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/possibleConstructorReturn"));
|
|
45
|
-
|
|
46
26
|
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/getPrototypeOf"));
|
|
47
|
-
|
|
48
27
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
49
|
-
|
|
50
28
|
var _react = _interopRequireDefault(require("react"));
|
|
51
|
-
|
|
52
29
|
var _rxjs = require("rxjs");
|
|
53
|
-
|
|
54
30
|
var op = _interopRequireWildcard(require("rxjs/operators"));
|
|
55
|
-
|
|
56
31
|
var _calculations = require("./calculations");
|
|
57
|
-
|
|
58
32
|
var _empty = require("./empty");
|
|
59
|
-
|
|
60
33
|
var _header = _interopRequireDefault(require("./header"));
|
|
61
|
-
|
|
62
34
|
var _getRichVisibleRectsStream = require("./helpers/getRichVisibleRectsStream");
|
|
63
|
-
|
|
64
35
|
var _rowHeightManager = require("./helpers/rowHeightManager");
|
|
65
|
-
|
|
66
36
|
var _TableDOMUtils = require("./helpers/TableDOMUtils");
|
|
67
|
-
|
|
68
37
|
var _htmlTable = require("./html-table");
|
|
69
|
-
|
|
70
38
|
var _loading = _interopRequireDefault(require("./loading"));
|
|
71
|
-
|
|
72
39
|
var _styles = require("./styles");
|
|
73
|
-
|
|
74
40
|
var _utils = require("./utils");
|
|
75
|
-
|
|
76
41
|
var _utils2 = require("../utils");
|
|
77
|
-
|
|
78
42
|
var _renderTemplates = _interopRequireDefault(require("./renderTemplates"));
|
|
79
|
-
|
|
80
43
|
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); }
|
|
81
|
-
|
|
82
44
|
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; }
|
|
83
|
-
|
|
84
45
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof _Symbol !== "undefined" && _getIteratorMethod(o) || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
85
|
-
|
|
86
46
|
function _unsupportedIterableToArray(o, minLen) { var _context2; if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = _sliceInstanceProperty2(_context2 = Object.prototype.toString.call(o)).call(_context2, 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); }
|
|
87
|
-
|
|
88
47
|
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; }
|
|
89
|
-
|
|
90
48
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = _Reflect$construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
91
|
-
|
|
92
49
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !_Reflect$construct) return false; if (_Reflect$construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(_Reflect$construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
93
|
-
|
|
94
50
|
var propsDotEmptyContentDeprecatedWarned = false;
|
|
95
|
-
|
|
96
51
|
function warnPropsDotEmptyContentIsDeprecated() {
|
|
97
52
|
if (!propsDotEmptyContentDeprecatedWarned) {
|
|
98
53
|
propsDotEmptyContentDeprecatedWarned = true;
|
|
99
|
-
|
|
100
54
|
_utils2.console.warn('BaseTable props.emptyContent 已经过时,请使用 props.components.EmptyContent 来自定义数据为空时的表格表现');
|
|
101
55
|
}
|
|
102
56
|
}
|
|
103
|
-
|
|
104
57
|
var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
105
58
|
(0, _inherits2.default)(BaseTable, _React$Component);
|
|
106
|
-
|
|
107
59
|
var _super = _createSuper(BaseTable);
|
|
108
|
-
|
|
109
60
|
function BaseTable(props) {
|
|
110
61
|
var _this;
|
|
111
|
-
|
|
112
62
|
(0, _classCallCheck2.default)(this, BaseTable);
|
|
113
63
|
_this = _super.call(this, props);
|
|
114
64
|
_this.rowHeightManager = (0, _rowHeightManager.makeRowHeightManager)(_this.props.dataSource.length, _this.props.estimatedRowHeight);
|
|
115
65
|
_this.artTableWrapperRef = /*#__PURE__*/_react.default.createRef();
|
|
116
66
|
_this.hasScrollY = false;
|
|
117
67
|
_this.offsetY = 0;
|
|
118
|
-
|
|
119
68
|
_this.handleRowMouseEnter = function (e) {
|
|
120
69
|
var nodeList = _this.domHelper.getRowNodeListByEvent(e);
|
|
121
|
-
|
|
122
70
|
nodeList && nodeList.forEach(function (node) {
|
|
123
71
|
node.classList.add('row-hover');
|
|
124
72
|
});
|
|
125
73
|
};
|
|
126
|
-
|
|
127
74
|
_this.handleRowMouseLeave = function (e) {
|
|
128
75
|
var nodeList = _this.domHelper.getRowNodeListByEvent(e);
|
|
129
|
-
|
|
130
76
|
nodeList && nodeList.forEach(function (node) {
|
|
131
77
|
node.classList.remove('row-hover');
|
|
132
78
|
});
|
|
133
79
|
};
|
|
134
|
-
|
|
135
80
|
_this.renderTableBody = function (info) {
|
|
136
81
|
// console.log('render body')
|
|
137
82
|
var _this$props = _this.props,
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
var tableBodyClassName = (0, _classnames.default)(_styles.Classes.tableBody, _styles.Classes.horizontalScrollContainer);
|
|
145
|
-
|
|
83
|
+
dataSource = _this$props.dataSource,
|
|
84
|
+
getRowProps = _this$props.getRowProps,
|
|
85
|
+
primaryKey = _this$props.primaryKey,
|
|
86
|
+
isLoading = _this$props.isLoading,
|
|
87
|
+
emptyCellHeight = _this$props.emptyCellHeight,
|
|
88
|
+
footerDataSource = _this$props.footerDataSource;
|
|
89
|
+
var tableBodyClassName = (0, _classnames.default)(_styles.Classes.tableBody, _styles.Classes.horizontalScrollContainer);
|
|
90
|
+
// 低版本Edge浏览器下也会出现双滚动条,这里设置overflow: 'hidden',先去掉edge的方向键控制滚动条的功能
|
|
146
91
|
var virtualStyle = _utils2.browserType.isIE || _utils2.browserType.isEdge ? {
|
|
147
92
|
overflow: 'hidden'
|
|
148
93
|
} : {};
|
|
149
|
-
|
|
150
94
|
if (dataSource.length === 0) {
|
|
151
95
|
var _this$props2 = _this.props,
|
|
152
|
-
|
|
153
|
-
|
|
96
|
+
components = _this$props2.components,
|
|
97
|
+
emptyContent = _this$props2.emptyContent;
|
|
154
98
|
var EmptyContent = components.EmptyContent;
|
|
155
|
-
|
|
156
99
|
if (EmptyContent == null && emptyContent != null) {
|
|
157
100
|
warnPropsDotEmptyContentIsDeprecated();
|
|
158
|
-
|
|
159
101
|
EmptyContent = function EmptyContent() {
|
|
160
102
|
return emptyContent;
|
|
161
103
|
};
|
|
162
104
|
}
|
|
163
|
-
|
|
164
105
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
165
106
|
className: (0, _classnames.default)(tableBodyClassName, 'empty')
|
|
166
107
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -174,15 +115,13 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
174
115
|
emptyCellHeight: emptyCellHeight
|
|
175
116
|
})));
|
|
176
117
|
}
|
|
177
|
-
|
|
178
118
|
var _info$verticalRenderR = info.verticalRenderRange,
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
119
|
+
topIndex = _info$verticalRenderR.topIndex,
|
|
120
|
+
bottomBlank = _info$verticalRenderR.bottomBlank,
|
|
121
|
+
topBlank = _info$verticalRenderR.topBlank,
|
|
122
|
+
bottomIndex = _info$verticalRenderR.bottomIndex;
|
|
183
123
|
var stickyRightOffset = _this.hasScrollY ? _this.getScrollBarWidth() : 0;
|
|
184
124
|
var renderBody = (0, _renderTemplates.default)('body');
|
|
185
|
-
|
|
186
125
|
if (typeof renderBody === 'function') {
|
|
187
126
|
return renderBody(info, _this.props, {
|
|
188
127
|
rowProps: {
|
|
@@ -192,7 +131,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
192
131
|
stickyRightOffset: stickyRightOffset
|
|
193
132
|
});
|
|
194
133
|
}
|
|
195
|
-
|
|
196
134
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
197
135
|
className: tableBodyClassName
|
|
198
136
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -226,7 +164,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
226
164
|
}
|
|
227
165
|
})));
|
|
228
166
|
};
|
|
229
|
-
|
|
230
167
|
_this.state = {
|
|
231
168
|
hasScroll: true,
|
|
232
169
|
hasScrollY: true,
|
|
@@ -242,44 +179,36 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
242
179
|
return _this;
|
|
243
180
|
}
|
|
244
181
|
/** @deprecated BaseTable.getDoms() 已经过时,请勿调用 */
|
|
245
|
-
|
|
246
|
-
|
|
247
182
|
(0, _createClass2.default)(BaseTable, [{
|
|
248
183
|
key: "getDoms",
|
|
249
184
|
value: function getDoms() {
|
|
250
185
|
_utils2.console.warn('[kd-table] BaseTable.getDoms() 已经过时');
|
|
251
|
-
|
|
252
186
|
return this.domHelper;
|
|
253
187
|
}
|
|
254
188
|
/** 自定义滚动条宽度为table宽度,使滚动条滑块宽度相同 */
|
|
255
|
-
|
|
256
189
|
}, {
|
|
257
190
|
key: "updateStickyScroll",
|
|
258
191
|
value: function updateStickyScroll() {
|
|
259
192
|
var _a, _b;
|
|
260
|
-
|
|
261
193
|
var _this$domHelper = this.domHelper,
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
194
|
+
stickyScroll = _this$domHelper.stickyScroll,
|
|
195
|
+
artTable = _this$domHelper.artTable,
|
|
196
|
+
stickyScrollItem = _this$domHelper.stickyScrollItem;
|
|
265
197
|
var _lastHasScrollY = this.hasScrollY;
|
|
266
|
-
|
|
267
198
|
if (!artTable) {
|
|
268
199
|
return;
|
|
269
200
|
}
|
|
270
|
-
|
|
271
201
|
var tableBodyHtmlTable = this.domHelper.getTableBodyHtmlTable();
|
|
272
202
|
var innerTableWidth = tableBodyHtmlTable.offsetWidth;
|
|
273
203
|
var artTableWidth = artTable.offsetWidth;
|
|
274
|
-
var artTableHeight = artTable.offsetHeight;
|
|
275
|
-
|
|
204
|
+
var artTableHeight = artTable.offsetHeight;
|
|
205
|
+
// 表格隐藏后,不需要对表格的滚动条做额外的逻辑处理
|
|
276
206
|
if (artTableWidth === 0 && artTableHeight === 0) return;
|
|
277
207
|
var stickyScrollHeightProp = this.props.stickyScrollHeight;
|
|
278
|
-
var stickyScrollHeight = stickyScrollHeightProp === 'auto' ? this.getScrollBarWidth() : stickyScrollHeightProp;
|
|
208
|
+
var stickyScrollHeight = stickyScrollHeightProp === 'auto' ? this.getScrollBarWidth() : stickyScrollHeightProp;
|
|
209
|
+
// stickyScroll.style.marginTop = `-${stickyScrollHeight + 1}px`
|
|
279
210
|
// 设置滚动条高度
|
|
280
|
-
|
|
281
211
|
stickyScroll.style.height = "".concat(stickyScrollHeight, "px");
|
|
282
|
-
|
|
283
212
|
if (artTableWidth >= innerTableWidth) {
|
|
284
213
|
if (this.state.hasScroll) {
|
|
285
214
|
this.setState({
|
|
@@ -294,7 +223,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
294
223
|
});
|
|
295
224
|
}
|
|
296
225
|
}
|
|
297
|
-
|
|
298
226
|
if (this.domHelper.virtual.offsetHeight > this.domHelper.tableBody.offsetHeight) {
|
|
299
227
|
// if (!this.state.hasScroll) {
|
|
300
228
|
// this.setState({
|
|
@@ -303,36 +231,32 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
303
231
|
// }
|
|
304
232
|
this.hasScrollY = true;
|
|
305
233
|
} else {
|
|
306
|
-
stickyScroll.style.paddingRight = "".concat(stickyScrollHeight, "px");
|
|
234
|
+
stickyScroll.style.paddingRight = "".concat(stickyScrollHeight, "px");
|
|
235
|
+
// this.setState({
|
|
307
236
|
// hasScrollY: false
|
|
308
237
|
// })
|
|
309
|
-
|
|
310
238
|
this.hasScrollY = false;
|
|
311
239
|
}
|
|
312
|
-
|
|
313
240
|
if (_lastHasScrollY !== this.hasScrollY) {
|
|
314
241
|
(_b = (_a = this.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, this.domHelper.tableBody.clientWidth);
|
|
315
242
|
}
|
|
316
|
-
|
|
317
243
|
var _this$lastInfo = this.lastInfo,
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
var lockTotalWidth = leftLockTotalWidth + rightLockTotalWidth;
|
|
321
|
-
|
|
244
|
+
leftLockTotalWidth = _this$lastInfo.leftLockTotalWidth,
|
|
245
|
+
rightLockTotalWidth = _this$lastInfo.rightLockTotalWidth;
|
|
246
|
+
var lockTotalWidth = leftLockTotalWidth + rightLockTotalWidth;
|
|
247
|
+
// 设置子节点宽度
|
|
322
248
|
stickyScrollItem.style.width = "".concat(innerTableWidth - lockTotalWidth, "px");
|
|
323
249
|
}
|
|
324
250
|
}, {
|
|
325
251
|
key: "renderTableHeader",
|
|
326
252
|
value: function renderTableHeader(info) {
|
|
327
253
|
var _this$props3 = this.props,
|
|
328
|
-
|
|
329
|
-
|
|
254
|
+
stickyTop = _this$props3.stickyTop,
|
|
255
|
+
hasHeader = _this$props3.hasHeader;
|
|
330
256
|
var renderHeader = (0, _renderTemplates.default)('header');
|
|
331
|
-
|
|
332
257
|
if (typeof renderHeader === 'function') {
|
|
333
258
|
return renderHeader(info, this.props);
|
|
334
259
|
}
|
|
335
|
-
|
|
336
260
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
337
261
|
className: (0, _classnames.default)(_styles.Classes.tableHeader, 'no-scrollbar'),
|
|
338
262
|
style: {
|
|
@@ -365,29 +289,23 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
365
289
|
this.syncHorizontalScroll(this.domHelper.virtual.scrollLeft);
|
|
366
290
|
}
|
|
367
291
|
/** 同步横向滚动偏移量 */
|
|
368
|
-
|
|
369
292
|
}, {
|
|
370
293
|
key: "syncHorizontalScroll",
|
|
371
294
|
value: function syncHorizontalScroll(x) {
|
|
372
295
|
this.updateOffsetX(x);
|
|
373
296
|
var flat = (0, _flat.default)(this.lastInfo);
|
|
374
297
|
var leftLockShadow = this.domHelper.getLeftLockShadow();
|
|
375
|
-
|
|
376
298
|
if (leftLockShadow) {
|
|
377
299
|
var shouldShowLeftLockShadow = flat.left.length > 0 && this.state.needRenderLock && x > 0;
|
|
378
|
-
|
|
379
300
|
if (shouldShowLeftLockShadow) {
|
|
380
301
|
leftLockShadow.classList.add('show-shadow');
|
|
381
302
|
} else {
|
|
382
303
|
leftLockShadow.classList.remove('show-shadow');
|
|
383
304
|
}
|
|
384
305
|
}
|
|
385
|
-
|
|
386
306
|
var rightLockShadow = this.domHelper.getRightLockShadow();
|
|
387
|
-
|
|
388
307
|
if (rightLockShadow) {
|
|
389
308
|
var shouldShowRightLockShadow = flat.right.length > 0 && this.state.needRenderLock && x < this.domHelper.virtual.scrollWidth - this.domHelper.virtual.clientWidth;
|
|
390
|
-
|
|
391
309
|
if (shouldShowRightLockShadow) {
|
|
392
310
|
rightLockShadow.classList.add('show-shadow');
|
|
393
311
|
} else {
|
|
@@ -400,10 +318,9 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
400
318
|
value: function getVerticalRenderRange(useVirtual) {
|
|
401
319
|
var dataSource = this.props.dataSource;
|
|
402
320
|
var _this$state = this.state,
|
|
403
|
-
|
|
404
|
-
|
|
321
|
+
offsetY = _this$state.offsetY,
|
|
322
|
+
maxRenderHeight = _this$state.maxRenderHeight;
|
|
405
323
|
var rowCount = dataSource.length;
|
|
406
|
-
|
|
407
324
|
if (useVirtual.vertical) {
|
|
408
325
|
return this.rowHeightManager.getRenderRange(offsetY, maxRenderHeight, rowCount);
|
|
409
326
|
} else {
|
|
@@ -415,13 +332,12 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
415
332
|
value: function renderTableFooter(info) {
|
|
416
333
|
// console.log('render footer')
|
|
417
334
|
var _this$props4 = this.props,
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
335
|
+
_this$props4$footerDa = _this$props4.footerDataSource,
|
|
336
|
+
footerDataSource = _this$props4$footerDa === void 0 ? [] : _this$props4$footerDa,
|
|
337
|
+
getRowProps = _this$props4.getRowProps,
|
|
338
|
+
primaryKey = _this$props4.primaryKey,
|
|
339
|
+
stickyBottom = _this$props4.stickyBottom;
|
|
423
340
|
var renderFooter = (0, _renderTemplates.default)('footer');
|
|
424
|
-
|
|
425
341
|
if (typeof renderFooter === 'function') {
|
|
426
342
|
return renderFooter(info, this.props, {
|
|
427
343
|
rowProps: {
|
|
@@ -430,7 +346,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
430
346
|
}
|
|
431
347
|
});
|
|
432
348
|
}
|
|
433
|
-
|
|
434
349
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
435
350
|
className: (0, _classnames.default)(_styles.Classes.tableFooter, _styles.Classes.horizontalScrollContainer),
|
|
436
351
|
style: {
|
|
@@ -483,8 +398,8 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
483
398
|
value: function renderStickyScroll(info) {
|
|
484
399
|
// console.log('render stickyscroll')
|
|
485
400
|
var _this$props5 = this.props,
|
|
486
|
-
|
|
487
|
-
|
|
401
|
+
hasStickyScroll = _this$props5.hasStickyScroll,
|
|
402
|
+
stickyBottom = _this$props5.stickyBottom;
|
|
488
403
|
var hasScroll = this.state.hasScroll;
|
|
489
404
|
var isScroll = hasStickyScroll && hasScroll;
|
|
490
405
|
var stickyScrollContainerStyle = this.getStickyScrollContainerStyle();
|
|
@@ -522,8 +437,8 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
522
437
|
key: "getStickyScrollContainerStyle",
|
|
523
438
|
value: function getStickyScrollContainerStyle() {
|
|
524
439
|
var _this$props6 = this.props,
|
|
525
|
-
|
|
526
|
-
|
|
440
|
+
hasStickyScroll = _this$props6.hasStickyScroll,
|
|
441
|
+
stickyScrollHeight = _this$props6.stickyScrollHeight;
|
|
527
442
|
var hasScroll = this.state.hasScroll;
|
|
528
443
|
var isScroll = hasStickyScroll && hasScroll;
|
|
529
444
|
var height = stickyScrollHeight === 'auto' ? this.getScrollBarWidth() : stickyScrollHeight;
|
|
@@ -538,24 +453,23 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
538
453
|
key: "render",
|
|
539
454
|
value: function render() {
|
|
540
455
|
var _cx;
|
|
541
|
-
|
|
542
456
|
// console.log('render table')
|
|
543
457
|
var info = (0, _calculations.calculateRenderInfo)(this);
|
|
544
458
|
this.lastInfo = info;
|
|
545
459
|
var _this$props7 = this.props,
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
460
|
+
dataSource = _this$props7.dataSource,
|
|
461
|
+
className = _this$props7.className,
|
|
462
|
+
style = _this$props7.style,
|
|
463
|
+
hasHeader = _this$props7.hasHeader,
|
|
464
|
+
useOuterBorder = _this$props7.useOuterBorder,
|
|
465
|
+
isStickyHead = _this$props7.isStickyHead,
|
|
466
|
+
isStickyHeader = _this$props7.isStickyHeader,
|
|
467
|
+
isStickyFooter = _this$props7.isStickyFooter,
|
|
468
|
+
isLoading = _this$props7.isLoading,
|
|
469
|
+
getTableProps = _this$props7.getTableProps,
|
|
470
|
+
footerDataSource = _this$props7.footerDataSource,
|
|
471
|
+
components = _this$props7.components,
|
|
472
|
+
bordered = _this$props7.bordered;
|
|
559
473
|
var artTableWrapperClassName = (0, _classnames.default)(_styles.Classes.artTableWrapper, (_cx = {
|
|
560
474
|
'use-outer-border': useOuterBorder,
|
|
561
475
|
empty: dataSource.length === 0,
|
|
@@ -582,18 +496,17 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
582
496
|
key: "componentDidMount",
|
|
583
497
|
value: function componentDidMount() {
|
|
584
498
|
var _a, _b, _c, _d, _e, _f;
|
|
585
|
-
|
|
586
499
|
this.rootSubscription = new _rxjs.Subscription();
|
|
587
500
|
this.resizeSubject = new _rxjs.Subject();
|
|
588
501
|
this.updateDOMHelper();
|
|
589
502
|
this.props$ = new _rxjs.BehaviorSubject(this.props);
|
|
590
503
|
this.initSubscriptions();
|
|
591
|
-
this.didMountOrUpdate();
|
|
592
|
-
|
|
504
|
+
this.didMountOrUpdate();
|
|
505
|
+
// console.log('did mount end')
|
|
593
506
|
var _this$props8 = this.props,
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
507
|
+
cssVariables = _this$props8.cssVariables,
|
|
508
|
+
enableCSSVariables = _this$props8.enableCSSVariables,
|
|
509
|
+
bordered = _this$props8.bordered;
|
|
597
510
|
(0, _utils.cssPolifill)({
|
|
598
511
|
variables: cssVariables || {},
|
|
599
512
|
enableCSSVariables: enableCSSVariables,
|
|
@@ -606,14 +519,12 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
606
519
|
}, {
|
|
607
520
|
key: "componentDidUpdate",
|
|
608
521
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
609
|
-
var _a;
|
|
610
|
-
|
|
611
|
-
|
|
522
|
+
var _a;
|
|
523
|
+
// console.log('did update start')
|
|
612
524
|
var _this$props9 = this.props,
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
525
|
+
cssVariables = _this$props9.cssVariables,
|
|
526
|
+
enableCSSVariables = _this$props9.enableCSSVariables,
|
|
527
|
+
bordered = _this$props9.bordered;
|
|
617
528
|
if (!(0, _utils.shallowEqual)(prevProps === null || prevProps === void 0 ? void 0 : prevProps.cssVariables, (_a = this.props) === null || _a === void 0 ? void 0 : _a.cssVariables)) {
|
|
618
529
|
(0, _utils.cssPolifill)({
|
|
619
530
|
variables: cssVariables || {},
|
|
@@ -621,10 +532,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
621
532
|
bordered: bordered
|
|
622
533
|
});
|
|
623
534
|
}
|
|
624
|
-
|
|
625
535
|
this.updateDOMHelper();
|
|
626
536
|
this.props$.next(this.props);
|
|
627
|
-
this.didMountOrUpdate(prevProps, prevState);
|
|
537
|
+
this.didMountOrUpdate(prevProps, prevState);
|
|
538
|
+
// console.log('did update end')
|
|
628
539
|
}
|
|
629
540
|
}, {
|
|
630
541
|
key: "didMountOrUpdate",
|
|
@@ -643,11 +554,9 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
643
554
|
this.domHelper.stickyScroll.scrollLeft = 0;
|
|
644
555
|
}
|
|
645
556
|
}
|
|
646
|
-
|
|
647
557
|
if (prevProps != null) {
|
|
648
558
|
var prevHasFooter = prevProps.footerDataSource.length > 0;
|
|
649
559
|
var currentHasFooter = this.props.footerDataSource.length > 0;
|
|
650
|
-
|
|
651
560
|
if (!prevHasFooter && currentHasFooter) {
|
|
652
561
|
(0, _utils.getTableScrollFooterDOM)(this.domHelper).scrollLeft = this.domHelper.virtual.scrollLeft;
|
|
653
562
|
}
|
|
@@ -657,64 +566,55 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
657
566
|
key: "initSubscriptions",
|
|
658
567
|
value: function initSubscriptions() {
|
|
659
568
|
var _this2 = this;
|
|
660
|
-
|
|
661
569
|
var _this$domHelper2 = this.domHelper,
|
|
662
|
-
|
|
663
|
-
|
|
570
|
+
virtual = _this$domHelper2.virtual,
|
|
571
|
+
stickyScroll = _this$domHelper2.stickyScroll;
|
|
664
572
|
this.rootSubscription.add(_utils.throttledWindowResize$.subscribe(function () {
|
|
665
573
|
_this2.updateStickyScroll();
|
|
666
|
-
|
|
667
574
|
_this2.adjustNeedRenderLock();
|
|
668
575
|
}));
|
|
669
576
|
this.resizeSubject.pipe(op.debounceTime(100)).subscribe(function () {
|
|
670
577
|
var _a, _b;
|
|
671
|
-
|
|
672
578
|
(_b = (_a = _this2.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, _this2.domHelper.tableBody.clientWidth);
|
|
673
579
|
});
|
|
674
|
-
|
|
675
580
|
var handleTableWrapperResize = function handleTableWrapperResize() {
|
|
676
581
|
_this2.resizeSubject.next();
|
|
677
582
|
};
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
583
|
+
this.resizeObserver = (0, _utils.addResizeObserver)(this.domHelper.artTableWrapper, handleTableWrapperResize);
|
|
584
|
+
// 滚动同步
|
|
681
585
|
this.rootSubscription.add((0, _utils.syncScrollLeft)([(0, _utils.getTableScrollHeaderDOM)(this.domHelper), virtual, (0, _utils.getTableScrollFooterDOM)(this.domHelper), stickyScroll], function (scrollLeft) {
|
|
682
586
|
_this2.syncHorizontalScroll(scrollLeft);
|
|
683
587
|
}));
|
|
684
|
-
var richVisibleRects$ = (0, _getRichVisibleRectsStream.getRichVisibleRectsStream)(this.domHelper.virtual, this.props$.pipe(op.skip(1), op.mapTo('structure-may-change')), this.props.virtualDebugLabel).pipe(op.shareReplay());
|
|
685
|
-
|
|
588
|
+
var richVisibleRects$ = (0, _getRichVisibleRectsStream.getRichVisibleRectsStream)(this.domHelper.virtual, this.props$.pipe(op.skip(1), op.mapTo('structure-may-change')), this.props.virtualDebugLabel).pipe(op.shareReplay());
|
|
589
|
+
// 每当可见部分发生变化的时候,调整 loading icon 的未知(如果 loading icon 存在的话)
|
|
686
590
|
this.rootSubscription.add((0, _rxjs.combineLatest)([richVisibleRects$.pipe(op.map(function (p) {
|
|
687
591
|
return p.clipRect;
|
|
688
592
|
}), op.distinctUntilChanged(_utils.shallowEqual)), this.props$.pipe(op.startWith(null), op.pairwise(), op.filter(function (_ref) {
|
|
689
593
|
var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
594
|
+
prevProps = _ref2[0],
|
|
595
|
+
props = _ref2[1];
|
|
693
596
|
return prevProps == null || !prevProps.isLoading && props.isLoading;
|
|
694
597
|
}))]).subscribe(function (_ref3) {
|
|
695
598
|
var _ref4 = (0, _slicedToArray2.default)(_ref3, 1),
|
|
696
|
-
|
|
697
|
-
|
|
599
|
+
clipRect = _ref4[0];
|
|
698
600
|
var loadingIndicator = _this2.domHelper.getLoadingIndicator();
|
|
699
|
-
|
|
700
601
|
if (!loadingIndicator) {
|
|
701
602
|
return;
|
|
702
603
|
}
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
604
|
+
var height = clipRect.bottom - clipRect.top;
|
|
605
|
+
// fixme 这里的定位在有些特殊情况下可能会出错 see #132
|
|
706
606
|
loadingIndicator.style.top = "".concat(height / 2, "px");
|
|
707
607
|
loadingIndicator.style.marginTop = "".concat(height / 2, "px");
|
|
708
|
-
}));
|
|
709
|
-
|
|
608
|
+
}));
|
|
609
|
+
// 每当可见部分发生变化的时候,如果开启了虚拟滚动,则重新触发 render
|
|
710
610
|
this.rootSubscription.add(richVisibleRects$.pipe(op.filter(function () {
|
|
711
611
|
var _this2$lastInfo$useVi = _this2.lastInfo.useVirtual,
|
|
712
|
-
|
|
713
|
-
|
|
612
|
+
horizontal = _this2$lastInfo$useVi.horizontal,
|
|
613
|
+
vertical = _this2$lastInfo$useVi.vertical;
|
|
714
614
|
return horizontal || vertical;
|
|
715
615
|
}), op.map(function (_ref5) {
|
|
716
616
|
var clipRect = _ref5.clipRect,
|
|
717
|
-
|
|
617
|
+
offsetY = _ref5.offsetY;
|
|
718
618
|
return {
|
|
719
619
|
maxRenderHeight: clipRect.bottom - clipRect.top,
|
|
720
620
|
maxRenderWidth: clipRect.right - clipRect.left,
|
|
@@ -724,16 +624,15 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
724
624
|
// 如果表格区域被隐藏, 不需要触发组件重渲染
|
|
725
625
|
if (y.maxRenderHeight === 0 && y.maxRenderWidth === 0) {
|
|
726
626
|
return true;
|
|
727
|
-
}
|
|
728
|
-
|
|
729
|
-
|
|
627
|
+
}
|
|
628
|
+
// 因为 overscan 的存在,滚动较小的距离时不需要触发组件重渲染
|
|
730
629
|
return Math.abs(x.maxRenderWidth - y.maxRenderWidth) < _utils.OVERSCAN_SIZE / 2 && Math.abs(x.maxRenderHeight - y.maxRenderHeight) < _utils.OVERSCAN_SIZE / 2 && Math.abs(x.offsetY - y.offsetY) < _utils.OVERSCAN_SIZE / 2;
|
|
731
630
|
})).subscribe(function (sizeAndOffset) {
|
|
732
631
|
_this2.setState(sizeAndOffset);
|
|
733
632
|
}));
|
|
734
633
|
this.rootSubscription.add(richVisibleRects$.pipe(op.map(function (_ref6) {
|
|
735
634
|
var clipRect = _ref6.clipRect,
|
|
736
|
-
|
|
635
|
+
offsetY = _ref6.offsetY;
|
|
737
636
|
return {
|
|
738
637
|
maxRenderHeight: clipRect.bottom - clipRect.top,
|
|
739
638
|
maxRenderWidth: clipRect.right - clipRect.left,
|
|
@@ -741,20 +640,18 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
741
640
|
};
|
|
742
641
|
}), op.distinctUntilChanged(function (x, y) {
|
|
743
642
|
return x.offsetY - y.offsetY === 0;
|
|
744
|
-
}),
|
|
643
|
+
}),
|
|
644
|
+
// 计算得到当前行索引对应的数据块,blocks改成数组的形式,兼容快速拖动可视区域出现两个数据块的情况
|
|
745
645
|
op.map(function (sizeAndOffset) {
|
|
746
646
|
var _a;
|
|
747
|
-
|
|
748
647
|
var offsetY = sizeAndOffset.offsetY,
|
|
749
|
-
|
|
648
|
+
maxRenderHeight = sizeAndOffset.maxRenderHeight;
|
|
750
649
|
var scrollDirection = offsetY - _this2.offsetY >= 0 ? 'down' : 'up';
|
|
751
650
|
_this2.offsetY = offsetY;
|
|
752
651
|
var rowCount = _this2.props.dataSource.length;
|
|
753
|
-
|
|
754
652
|
var vertical = _this2.rowHeightManager.getRenderRange(offsetY, maxRenderHeight, rowCount);
|
|
755
|
-
|
|
756
653
|
var topIndex = vertical.topIndex,
|
|
757
|
-
|
|
654
|
+
bottomIndex = vertical.bottomIndex;
|
|
758
655
|
var blockSize = ((_a = _this2.props.scrollLoad) === null || _a === void 0 ? void 0 : _a.blockSize) || 200;
|
|
759
656
|
var topBlockStartIndex = Math.floor(Math.max(topIndex - 1, 0) / blockSize) * blockSize;
|
|
760
657
|
var bottomBlockStartIndex = Math.floor((bottomIndex + 1) / blockSize) * blockSize;
|
|
@@ -766,10 +663,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
766
663
|
return event$.pipe(op.map(function (startIndex) {
|
|
767
664
|
return startIndex;
|
|
768
665
|
}));
|
|
769
|
-
}),
|
|
666
|
+
}),
|
|
667
|
+
// 过滤掉重复掉值
|
|
770
668
|
op.distinctUntilChanged()).subscribe(function (startIndex) {
|
|
771
669
|
var _a;
|
|
772
|
-
|
|
773
670
|
(_a = _this2.props.scrollLoad) === null || _a === void 0 ? void 0 : _a.callback(startIndex);
|
|
774
671
|
}));
|
|
775
672
|
}
|
|
@@ -777,13 +674,11 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
777
674
|
key: "componentWillUnmount",
|
|
778
675
|
value: function componentWillUnmount() {
|
|
779
676
|
var _a;
|
|
780
|
-
|
|
781
677
|
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
782
678
|
this.rootSubscription.unsubscribe();
|
|
783
679
|
this.resizeSubject.unsubscribe();
|
|
784
680
|
}
|
|
785
681
|
/** 更新 DOM 节点的引用,方便其他方法直接操作 DOM */
|
|
786
|
-
|
|
787
682
|
}, {
|
|
788
683
|
key: "updateDOMHelper",
|
|
789
684
|
value: function updateDOMHelper() {
|
|
@@ -793,51 +688,42 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
793
688
|
key: "updateRowHeightManager",
|
|
794
689
|
value: function updateRowHeightManager() {
|
|
795
690
|
var _a;
|
|
796
|
-
|
|
797
691
|
var virtualTop = this.domHelper.getVirtualTop();
|
|
798
692
|
var virtualTopHeight = (_a = virtualTop === null || virtualTop === void 0 ? void 0 : virtualTop.clientHeight) !== null && _a !== void 0 ? _a : 0;
|
|
799
693
|
var maxTrRowIndex = -1;
|
|
800
694
|
var maxTrBottom = -1;
|
|
801
695
|
var zeroHeightRowCount = 0;
|
|
802
|
-
|
|
803
696
|
var _iterator = _createForOfIteratorHelper(this.domHelper.getTableRows()),
|
|
804
|
-
|
|
805
|
-
|
|
697
|
+
_step;
|
|
806
698
|
try {
|
|
807
699
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
808
700
|
var tr = _step.value;
|
|
809
701
|
var rowIndex = Number(tr.dataset.rowindex);
|
|
810
|
-
|
|
811
702
|
if (isNaN(rowIndex)) {
|
|
812
703
|
continue;
|
|
813
704
|
}
|
|
814
|
-
|
|
815
705
|
maxTrRowIndex = Math.max(maxTrRowIndex, rowIndex);
|
|
816
706
|
var offset = tr.offsetTop + virtualTopHeight;
|
|
817
707
|
var size = tr.offsetHeight;
|
|
818
|
-
|
|
819
708
|
if (size === 0) {
|
|
820
709
|
zeroHeightRowCount += 1;
|
|
821
710
|
} else {
|
|
822
711
|
// 渲染出来的行高度为0,说明是display=none情况,行高不存在该种异常情况,不保存当前的高度
|
|
823
712
|
this.rowHeightManager.updateRow(rowIndex, offset, size);
|
|
824
713
|
}
|
|
825
|
-
|
|
826
714
|
maxTrBottom = Math.max(maxTrBottom, offset + size);
|
|
827
|
-
}
|
|
715
|
+
}
|
|
716
|
+
// 当 estimatedRowHeight 过大时,可能出现「渲染行数过少,无法覆盖可视范围」的情况
|
|
828
717
|
// 出现这种情况时,我们判断「下一次渲染能够渲染更多行」是否满足,满足的话就直接调用 forceUpdate
|
|
829
718
|
// zeroHeightRowCount === 0 用于确保当前没有 display=none 的情况
|
|
830
|
-
|
|
831
719
|
} catch (err) {
|
|
832
720
|
_iterator.e(err);
|
|
833
721
|
} finally {
|
|
834
722
|
_iterator.f();
|
|
835
723
|
}
|
|
836
|
-
|
|
837
724
|
if (maxTrRowIndex !== -1 && zeroHeightRowCount === 0) {
|
|
838
725
|
if (maxTrBottom < this.state.offsetY + this.state.maxRenderHeight) {
|
|
839
726
|
var vertical = this.getVerticalRenderRange(this.lastInfo.useVirtual);
|
|
840
|
-
|
|
841
727
|
if (vertical.bottomIndex - 1 > maxTrRowIndex) {
|
|
842
728
|
this.forceUpdate();
|
|
843
729
|
}
|
|
@@ -845,23 +731,19 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
845
731
|
}
|
|
846
732
|
}
|
|
847
733
|
/** 计算表格所有列的渲染宽度之和,判断表格是否需要渲染锁列 */
|
|
848
|
-
|
|
849
734
|
}, {
|
|
850
735
|
key: "adjustNeedRenderLock",
|
|
851
736
|
value: function adjustNeedRenderLock() {
|
|
852
737
|
var needRenderLock = this.state.needRenderLock;
|
|
853
738
|
var _this$lastInfo2 = this.lastInfo,
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
739
|
+
flat = (0, _flat.default)(_this$lastInfo2),
|
|
740
|
+
hasLockColumn = _this$lastInfo2.hasLockColumn;
|
|
857
741
|
if (hasLockColumn) {
|
|
858
742
|
var _context;
|
|
859
|
-
|
|
860
743
|
var sumOfColWidth = (0, _utils.sum)((0, _map.default)(_context = flat.full).call(_context, function (col) {
|
|
861
744
|
return col.width;
|
|
862
745
|
}));
|
|
863
746
|
var nextNeedRenderLock = sumOfColWidth > this.domHelper.artTable.clientWidth;
|
|
864
|
-
|
|
865
747
|
if (needRenderLock !== nextNeedRenderLock) {
|
|
866
748
|
this.setState({
|
|
867
749
|
needRenderLock: nextNeedRenderLock
|
|
@@ -878,7 +760,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
878
760
|
}]);
|
|
879
761
|
return BaseTable;
|
|
880
762
|
}(_react.default.Component);
|
|
881
|
-
|
|
882
763
|
exports.BaseTable = BaseTable;
|
|
883
764
|
BaseTable.defaultProps = {
|
|
884
765
|
hasHeader: true,
|