@kdcloudjs/table 1.2.0-canary.15 → 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 +2051 -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 +1 -10
- package/es/table/base/table.js +96 -179
- 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 +65 -143
- 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 +1 -22
- package/lib/table/base/table.js +96 -212
- 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 +65 -160
- 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,41 +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;
|
|
204
|
+
var artTableHeight = artTable.offsetHeight;
|
|
205
|
+
// 表格隐藏后,不需要对表格的滚动条做额外的逻辑处理
|
|
206
|
+
if (artTableWidth === 0 && artTableHeight === 0) return;
|
|
274
207
|
var stickyScrollHeightProp = this.props.stickyScrollHeight;
|
|
275
|
-
var stickyScrollHeight = stickyScrollHeightProp === 'auto' ? this.getScrollBarWidth() : stickyScrollHeightProp;
|
|
208
|
+
var stickyScrollHeight = stickyScrollHeightProp === 'auto' ? this.getScrollBarWidth() : stickyScrollHeightProp;
|
|
209
|
+
// stickyScroll.style.marginTop = `-${stickyScrollHeight + 1}px`
|
|
276
210
|
// 设置滚动条高度
|
|
277
|
-
|
|
278
211
|
stickyScroll.style.height = "".concat(stickyScrollHeight, "px");
|
|
279
|
-
|
|
280
212
|
if (artTableWidth >= innerTableWidth) {
|
|
281
213
|
if (this.state.hasScroll) {
|
|
282
214
|
this.setState({
|
|
@@ -291,7 +223,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
291
223
|
});
|
|
292
224
|
}
|
|
293
225
|
}
|
|
294
|
-
|
|
295
226
|
if (this.domHelper.virtual.offsetHeight > this.domHelper.tableBody.offsetHeight) {
|
|
296
227
|
// if (!this.state.hasScroll) {
|
|
297
228
|
// this.setState({
|
|
@@ -300,36 +231,32 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
300
231
|
// }
|
|
301
232
|
this.hasScrollY = true;
|
|
302
233
|
} else {
|
|
303
|
-
stickyScroll.style.paddingRight = "".concat(stickyScrollHeight, "px");
|
|
234
|
+
stickyScroll.style.paddingRight = "".concat(stickyScrollHeight, "px");
|
|
235
|
+
// this.setState({
|
|
304
236
|
// hasScrollY: false
|
|
305
237
|
// })
|
|
306
|
-
|
|
307
238
|
this.hasScrollY = false;
|
|
308
239
|
}
|
|
309
|
-
|
|
310
240
|
if (_lastHasScrollY !== this.hasScrollY) {
|
|
311
241
|
(_b = (_a = this.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, this.domHelper.tableBody.clientWidth);
|
|
312
242
|
}
|
|
313
|
-
|
|
314
243
|
var _this$lastInfo = this.lastInfo,
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
var lockTotalWidth = leftLockTotalWidth + rightLockTotalWidth;
|
|
318
|
-
|
|
244
|
+
leftLockTotalWidth = _this$lastInfo.leftLockTotalWidth,
|
|
245
|
+
rightLockTotalWidth = _this$lastInfo.rightLockTotalWidth;
|
|
246
|
+
var lockTotalWidth = leftLockTotalWidth + rightLockTotalWidth;
|
|
247
|
+
// 设置子节点宽度
|
|
319
248
|
stickyScrollItem.style.width = "".concat(innerTableWidth - lockTotalWidth, "px");
|
|
320
249
|
}
|
|
321
250
|
}, {
|
|
322
251
|
key: "renderTableHeader",
|
|
323
252
|
value: function renderTableHeader(info) {
|
|
324
253
|
var _this$props3 = this.props,
|
|
325
|
-
|
|
326
|
-
|
|
254
|
+
stickyTop = _this$props3.stickyTop,
|
|
255
|
+
hasHeader = _this$props3.hasHeader;
|
|
327
256
|
var renderHeader = (0, _renderTemplates.default)('header');
|
|
328
|
-
|
|
329
257
|
if (typeof renderHeader === 'function') {
|
|
330
258
|
return renderHeader(info, this.props);
|
|
331
259
|
}
|
|
332
|
-
|
|
333
260
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
334
261
|
className: (0, _classnames.default)(_styles.Classes.tableHeader, 'no-scrollbar'),
|
|
335
262
|
style: {
|
|
@@ -362,29 +289,23 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
362
289
|
this.syncHorizontalScroll(this.domHelper.virtual.scrollLeft);
|
|
363
290
|
}
|
|
364
291
|
/** 同步横向滚动偏移量 */
|
|
365
|
-
|
|
366
292
|
}, {
|
|
367
293
|
key: "syncHorizontalScroll",
|
|
368
294
|
value: function syncHorizontalScroll(x) {
|
|
369
295
|
this.updateOffsetX(x);
|
|
370
296
|
var flat = (0, _flat.default)(this.lastInfo);
|
|
371
297
|
var leftLockShadow = this.domHelper.getLeftLockShadow();
|
|
372
|
-
|
|
373
298
|
if (leftLockShadow) {
|
|
374
299
|
var shouldShowLeftLockShadow = flat.left.length > 0 && this.state.needRenderLock && x > 0;
|
|
375
|
-
|
|
376
300
|
if (shouldShowLeftLockShadow) {
|
|
377
301
|
leftLockShadow.classList.add('show-shadow');
|
|
378
302
|
} else {
|
|
379
303
|
leftLockShadow.classList.remove('show-shadow');
|
|
380
304
|
}
|
|
381
305
|
}
|
|
382
|
-
|
|
383
306
|
var rightLockShadow = this.domHelper.getRightLockShadow();
|
|
384
|
-
|
|
385
307
|
if (rightLockShadow) {
|
|
386
308
|
var shouldShowRightLockShadow = flat.right.length > 0 && this.state.needRenderLock && x < this.domHelper.virtual.scrollWidth - this.domHelper.virtual.clientWidth;
|
|
387
|
-
|
|
388
309
|
if (shouldShowRightLockShadow) {
|
|
389
310
|
rightLockShadow.classList.add('show-shadow');
|
|
390
311
|
} else {
|
|
@@ -397,10 +318,9 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
397
318
|
value: function getVerticalRenderRange(useVirtual) {
|
|
398
319
|
var dataSource = this.props.dataSource;
|
|
399
320
|
var _this$state = this.state,
|
|
400
|
-
|
|
401
|
-
|
|
321
|
+
offsetY = _this$state.offsetY,
|
|
322
|
+
maxRenderHeight = _this$state.maxRenderHeight;
|
|
402
323
|
var rowCount = dataSource.length;
|
|
403
|
-
|
|
404
324
|
if (useVirtual.vertical) {
|
|
405
325
|
return this.rowHeightManager.getRenderRange(offsetY, maxRenderHeight, rowCount);
|
|
406
326
|
} else {
|
|
@@ -412,13 +332,12 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
412
332
|
value: function renderTableFooter(info) {
|
|
413
333
|
// console.log('render footer')
|
|
414
334
|
var _this$props4 = this.props,
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
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;
|
|
420
340
|
var renderFooter = (0, _renderTemplates.default)('footer');
|
|
421
|
-
|
|
422
341
|
if (typeof renderFooter === 'function') {
|
|
423
342
|
return renderFooter(info, this.props, {
|
|
424
343
|
rowProps: {
|
|
@@ -427,7 +346,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
427
346
|
}
|
|
428
347
|
});
|
|
429
348
|
}
|
|
430
|
-
|
|
431
349
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
432
350
|
className: (0, _classnames.default)(_styles.Classes.tableFooter, _styles.Classes.horizontalScrollContainer),
|
|
433
351
|
style: {
|
|
@@ -480,8 +398,8 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
480
398
|
value: function renderStickyScroll(info) {
|
|
481
399
|
// console.log('render stickyscroll')
|
|
482
400
|
var _this$props5 = this.props,
|
|
483
|
-
|
|
484
|
-
|
|
401
|
+
hasStickyScroll = _this$props5.hasStickyScroll,
|
|
402
|
+
stickyBottom = _this$props5.stickyBottom;
|
|
485
403
|
var hasScroll = this.state.hasScroll;
|
|
486
404
|
var isScroll = hasStickyScroll && hasScroll;
|
|
487
405
|
var stickyScrollContainerStyle = this.getStickyScrollContainerStyle();
|
|
@@ -519,8 +437,8 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
519
437
|
key: "getStickyScrollContainerStyle",
|
|
520
438
|
value: function getStickyScrollContainerStyle() {
|
|
521
439
|
var _this$props6 = this.props,
|
|
522
|
-
|
|
523
|
-
|
|
440
|
+
hasStickyScroll = _this$props6.hasStickyScroll,
|
|
441
|
+
stickyScrollHeight = _this$props6.stickyScrollHeight;
|
|
524
442
|
var hasScroll = this.state.hasScroll;
|
|
525
443
|
var isScroll = hasStickyScroll && hasScroll;
|
|
526
444
|
var height = stickyScrollHeight === 'auto' ? this.getScrollBarWidth() : stickyScrollHeight;
|
|
@@ -535,24 +453,23 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
535
453
|
key: "render",
|
|
536
454
|
value: function render() {
|
|
537
455
|
var _cx;
|
|
538
|
-
|
|
539
456
|
// console.log('render table')
|
|
540
457
|
var info = (0, _calculations.calculateRenderInfo)(this);
|
|
541
458
|
this.lastInfo = info;
|
|
542
459
|
var _this$props7 = this.props,
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
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;
|
|
556
473
|
var artTableWrapperClassName = (0, _classnames.default)(_styles.Classes.artTableWrapper, (_cx = {
|
|
557
474
|
'use-outer-border': useOuterBorder,
|
|
558
475
|
empty: dataSource.length === 0,
|
|
@@ -579,18 +496,17 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
579
496
|
key: "componentDidMount",
|
|
580
497
|
value: function componentDidMount() {
|
|
581
498
|
var _a, _b, _c, _d, _e, _f;
|
|
582
|
-
|
|
583
499
|
this.rootSubscription = new _rxjs.Subscription();
|
|
584
500
|
this.resizeSubject = new _rxjs.Subject();
|
|
585
501
|
this.updateDOMHelper();
|
|
586
502
|
this.props$ = new _rxjs.BehaviorSubject(this.props);
|
|
587
503
|
this.initSubscriptions();
|
|
588
|
-
this.didMountOrUpdate();
|
|
589
|
-
|
|
504
|
+
this.didMountOrUpdate();
|
|
505
|
+
// console.log('did mount end')
|
|
590
506
|
var _this$props8 = this.props,
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
507
|
+
cssVariables = _this$props8.cssVariables,
|
|
508
|
+
enableCSSVariables = _this$props8.enableCSSVariables,
|
|
509
|
+
bordered = _this$props8.bordered;
|
|
594
510
|
(0, _utils.cssPolifill)({
|
|
595
511
|
variables: cssVariables || {},
|
|
596
512
|
enableCSSVariables: enableCSSVariables,
|
|
@@ -603,14 +519,12 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
603
519
|
}, {
|
|
604
520
|
key: "componentDidUpdate",
|
|
605
521
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
606
|
-
var _a;
|
|
607
|
-
|
|
608
|
-
|
|
522
|
+
var _a;
|
|
523
|
+
// console.log('did update start')
|
|
609
524
|
var _this$props9 = this.props,
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
525
|
+
cssVariables = _this$props9.cssVariables,
|
|
526
|
+
enableCSSVariables = _this$props9.enableCSSVariables,
|
|
527
|
+
bordered = _this$props9.bordered;
|
|
614
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)) {
|
|
615
529
|
(0, _utils.cssPolifill)({
|
|
616
530
|
variables: cssVariables || {},
|
|
@@ -618,10 +532,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
618
532
|
bordered: bordered
|
|
619
533
|
});
|
|
620
534
|
}
|
|
621
|
-
|
|
622
535
|
this.updateDOMHelper();
|
|
623
536
|
this.props$.next(this.props);
|
|
624
|
-
this.didMountOrUpdate(prevProps, prevState);
|
|
537
|
+
this.didMountOrUpdate(prevProps, prevState);
|
|
538
|
+
// console.log('did update end')
|
|
625
539
|
}
|
|
626
540
|
}, {
|
|
627
541
|
key: "didMountOrUpdate",
|
|
@@ -640,11 +554,9 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
640
554
|
this.domHelper.stickyScroll.scrollLeft = 0;
|
|
641
555
|
}
|
|
642
556
|
}
|
|
643
|
-
|
|
644
557
|
if (prevProps != null) {
|
|
645
558
|
var prevHasFooter = prevProps.footerDataSource.length > 0;
|
|
646
559
|
var currentHasFooter = this.props.footerDataSource.length > 0;
|
|
647
|
-
|
|
648
560
|
if (!prevHasFooter && currentHasFooter) {
|
|
649
561
|
(0, _utils.getTableScrollFooterDOM)(this.domHelper).scrollLeft = this.domHelper.virtual.scrollLeft;
|
|
650
562
|
}
|
|
@@ -654,64 +566,55 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
654
566
|
key: "initSubscriptions",
|
|
655
567
|
value: function initSubscriptions() {
|
|
656
568
|
var _this2 = this;
|
|
657
|
-
|
|
658
569
|
var _this$domHelper2 = this.domHelper,
|
|
659
|
-
|
|
660
|
-
|
|
570
|
+
virtual = _this$domHelper2.virtual,
|
|
571
|
+
stickyScroll = _this$domHelper2.stickyScroll;
|
|
661
572
|
this.rootSubscription.add(_utils.throttledWindowResize$.subscribe(function () {
|
|
662
573
|
_this2.updateStickyScroll();
|
|
663
|
-
|
|
664
574
|
_this2.adjustNeedRenderLock();
|
|
665
575
|
}));
|
|
666
576
|
this.resizeSubject.pipe(op.debounceTime(100)).subscribe(function () {
|
|
667
577
|
var _a, _b;
|
|
668
|
-
|
|
669
578
|
(_b = (_a = _this2.props).setTableWidth) === null || _b === void 0 ? void 0 : _b.call(_a, _this2.domHelper.tableBody.clientWidth);
|
|
670
579
|
});
|
|
671
|
-
|
|
672
580
|
var handleTableWrapperResize = function handleTableWrapperResize() {
|
|
673
581
|
_this2.resizeSubject.next();
|
|
674
582
|
};
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
583
|
+
this.resizeObserver = (0, _utils.addResizeObserver)(this.domHelper.artTableWrapper, handleTableWrapperResize);
|
|
584
|
+
// 滚动同步
|
|
678
585
|
this.rootSubscription.add((0, _utils.syncScrollLeft)([(0, _utils.getTableScrollHeaderDOM)(this.domHelper), virtual, (0, _utils.getTableScrollFooterDOM)(this.domHelper), stickyScroll], function (scrollLeft) {
|
|
679
586
|
_this2.syncHorizontalScroll(scrollLeft);
|
|
680
587
|
}));
|
|
681
|
-
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());
|
|
682
|
-
|
|
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 存在的话)
|
|
683
590
|
this.rootSubscription.add((0, _rxjs.combineLatest)([richVisibleRects$.pipe(op.map(function (p) {
|
|
684
591
|
return p.clipRect;
|
|
685
592
|
}), op.distinctUntilChanged(_utils.shallowEqual)), this.props$.pipe(op.startWith(null), op.pairwise(), op.filter(function (_ref) {
|
|
686
593
|
var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
594
|
+
prevProps = _ref2[0],
|
|
595
|
+
props = _ref2[1];
|
|
690
596
|
return prevProps == null || !prevProps.isLoading && props.isLoading;
|
|
691
597
|
}))]).subscribe(function (_ref3) {
|
|
692
598
|
var _ref4 = (0, _slicedToArray2.default)(_ref3, 1),
|
|
693
|
-
|
|
694
|
-
|
|
599
|
+
clipRect = _ref4[0];
|
|
695
600
|
var loadingIndicator = _this2.domHelper.getLoadingIndicator();
|
|
696
|
-
|
|
697
601
|
if (!loadingIndicator) {
|
|
698
602
|
return;
|
|
699
603
|
}
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
604
|
+
var height = clipRect.bottom - clipRect.top;
|
|
605
|
+
// fixme 这里的定位在有些特殊情况下可能会出错 see #132
|
|
703
606
|
loadingIndicator.style.top = "".concat(height / 2, "px");
|
|
704
607
|
loadingIndicator.style.marginTop = "".concat(height / 2, "px");
|
|
705
|
-
}));
|
|
706
|
-
|
|
608
|
+
}));
|
|
609
|
+
// 每当可见部分发生变化的时候,如果开启了虚拟滚动,则重新触发 render
|
|
707
610
|
this.rootSubscription.add(richVisibleRects$.pipe(op.filter(function () {
|
|
708
611
|
var _this2$lastInfo$useVi = _this2.lastInfo.useVirtual,
|
|
709
|
-
|
|
710
|
-
|
|
612
|
+
horizontal = _this2$lastInfo$useVi.horizontal,
|
|
613
|
+
vertical = _this2$lastInfo$useVi.vertical;
|
|
711
614
|
return horizontal || vertical;
|
|
712
615
|
}), op.map(function (_ref5) {
|
|
713
616
|
var clipRect = _ref5.clipRect,
|
|
714
|
-
|
|
617
|
+
offsetY = _ref5.offsetY;
|
|
715
618
|
return {
|
|
716
619
|
maxRenderHeight: clipRect.bottom - clipRect.top,
|
|
717
620
|
maxRenderWidth: clipRect.right - clipRect.left,
|
|
@@ -721,16 +624,15 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
721
624
|
// 如果表格区域被隐藏, 不需要触发组件重渲染
|
|
722
625
|
if (y.maxRenderHeight === 0 && y.maxRenderWidth === 0) {
|
|
723
626
|
return true;
|
|
724
|
-
}
|
|
725
|
-
|
|
726
|
-
|
|
627
|
+
}
|
|
628
|
+
// 因为 overscan 的存在,滚动较小的距离时不需要触发组件重渲染
|
|
727
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;
|
|
728
630
|
})).subscribe(function (sizeAndOffset) {
|
|
729
631
|
_this2.setState(sizeAndOffset);
|
|
730
632
|
}));
|
|
731
633
|
this.rootSubscription.add(richVisibleRects$.pipe(op.map(function (_ref6) {
|
|
732
634
|
var clipRect = _ref6.clipRect,
|
|
733
|
-
|
|
635
|
+
offsetY = _ref6.offsetY;
|
|
734
636
|
return {
|
|
735
637
|
maxRenderHeight: clipRect.bottom - clipRect.top,
|
|
736
638
|
maxRenderWidth: clipRect.right - clipRect.left,
|
|
@@ -738,20 +640,18 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
738
640
|
};
|
|
739
641
|
}), op.distinctUntilChanged(function (x, y) {
|
|
740
642
|
return x.offsetY - y.offsetY === 0;
|
|
741
|
-
}),
|
|
643
|
+
}),
|
|
644
|
+
// 计算得到当前行索引对应的数据块,blocks改成数组的形式,兼容快速拖动可视区域出现两个数据块的情况
|
|
742
645
|
op.map(function (sizeAndOffset) {
|
|
743
646
|
var _a;
|
|
744
|
-
|
|
745
647
|
var offsetY = sizeAndOffset.offsetY,
|
|
746
|
-
|
|
648
|
+
maxRenderHeight = sizeAndOffset.maxRenderHeight;
|
|
747
649
|
var scrollDirection = offsetY - _this2.offsetY >= 0 ? 'down' : 'up';
|
|
748
650
|
_this2.offsetY = offsetY;
|
|
749
651
|
var rowCount = _this2.props.dataSource.length;
|
|
750
|
-
|
|
751
652
|
var vertical = _this2.rowHeightManager.getRenderRange(offsetY, maxRenderHeight, rowCount);
|
|
752
|
-
|
|
753
653
|
var topIndex = vertical.topIndex,
|
|
754
|
-
|
|
654
|
+
bottomIndex = vertical.bottomIndex;
|
|
755
655
|
var blockSize = ((_a = _this2.props.scrollLoad) === null || _a === void 0 ? void 0 : _a.blockSize) || 200;
|
|
756
656
|
var topBlockStartIndex = Math.floor(Math.max(topIndex - 1, 0) / blockSize) * blockSize;
|
|
757
657
|
var bottomBlockStartIndex = Math.floor((bottomIndex + 1) / blockSize) * blockSize;
|
|
@@ -763,10 +663,10 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
763
663
|
return event$.pipe(op.map(function (startIndex) {
|
|
764
664
|
return startIndex;
|
|
765
665
|
}));
|
|
766
|
-
}),
|
|
666
|
+
}),
|
|
667
|
+
// 过滤掉重复掉值
|
|
767
668
|
op.distinctUntilChanged()).subscribe(function (startIndex) {
|
|
768
669
|
var _a;
|
|
769
|
-
|
|
770
670
|
(_a = _this2.props.scrollLoad) === null || _a === void 0 ? void 0 : _a.callback(startIndex);
|
|
771
671
|
}));
|
|
772
672
|
}
|
|
@@ -774,13 +674,11 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
774
674
|
key: "componentWillUnmount",
|
|
775
675
|
value: function componentWillUnmount() {
|
|
776
676
|
var _a;
|
|
777
|
-
|
|
778
677
|
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
779
678
|
this.rootSubscription.unsubscribe();
|
|
780
679
|
this.resizeSubject.unsubscribe();
|
|
781
680
|
}
|
|
782
681
|
/** 更新 DOM 节点的引用,方便其他方法直接操作 DOM */
|
|
783
|
-
|
|
784
682
|
}, {
|
|
785
683
|
key: "updateDOMHelper",
|
|
786
684
|
value: function updateDOMHelper() {
|
|
@@ -790,51 +688,42 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
790
688
|
key: "updateRowHeightManager",
|
|
791
689
|
value: function updateRowHeightManager() {
|
|
792
690
|
var _a;
|
|
793
|
-
|
|
794
691
|
var virtualTop = this.domHelper.getVirtualTop();
|
|
795
692
|
var virtualTopHeight = (_a = virtualTop === null || virtualTop === void 0 ? void 0 : virtualTop.clientHeight) !== null && _a !== void 0 ? _a : 0;
|
|
796
693
|
var maxTrRowIndex = -1;
|
|
797
694
|
var maxTrBottom = -1;
|
|
798
695
|
var zeroHeightRowCount = 0;
|
|
799
|
-
|
|
800
696
|
var _iterator = _createForOfIteratorHelper(this.domHelper.getTableRows()),
|
|
801
|
-
|
|
802
|
-
|
|
697
|
+
_step;
|
|
803
698
|
try {
|
|
804
699
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
805
700
|
var tr = _step.value;
|
|
806
701
|
var rowIndex = Number(tr.dataset.rowindex);
|
|
807
|
-
|
|
808
702
|
if (isNaN(rowIndex)) {
|
|
809
703
|
continue;
|
|
810
704
|
}
|
|
811
|
-
|
|
812
705
|
maxTrRowIndex = Math.max(maxTrRowIndex, rowIndex);
|
|
813
706
|
var offset = tr.offsetTop + virtualTopHeight;
|
|
814
707
|
var size = tr.offsetHeight;
|
|
815
|
-
|
|
816
708
|
if (size === 0) {
|
|
817
709
|
zeroHeightRowCount += 1;
|
|
818
710
|
} else {
|
|
819
711
|
// 渲染出来的行高度为0,说明是display=none情况,行高不存在该种异常情况,不保存当前的高度
|
|
820
712
|
this.rowHeightManager.updateRow(rowIndex, offset, size);
|
|
821
713
|
}
|
|
822
|
-
|
|
823
714
|
maxTrBottom = Math.max(maxTrBottom, offset + size);
|
|
824
|
-
}
|
|
715
|
+
}
|
|
716
|
+
// 当 estimatedRowHeight 过大时,可能出现「渲染行数过少,无法覆盖可视范围」的情况
|
|
825
717
|
// 出现这种情况时,我们判断「下一次渲染能够渲染更多行」是否满足,满足的话就直接调用 forceUpdate
|
|
826
718
|
// zeroHeightRowCount === 0 用于确保当前没有 display=none 的情况
|
|
827
|
-
|
|
828
719
|
} catch (err) {
|
|
829
720
|
_iterator.e(err);
|
|
830
721
|
} finally {
|
|
831
722
|
_iterator.f();
|
|
832
723
|
}
|
|
833
|
-
|
|
834
724
|
if (maxTrRowIndex !== -1 && zeroHeightRowCount === 0) {
|
|
835
725
|
if (maxTrBottom < this.state.offsetY + this.state.maxRenderHeight) {
|
|
836
726
|
var vertical = this.getVerticalRenderRange(this.lastInfo.useVirtual);
|
|
837
|
-
|
|
838
727
|
if (vertical.bottomIndex - 1 > maxTrRowIndex) {
|
|
839
728
|
this.forceUpdate();
|
|
840
729
|
}
|
|
@@ -842,23 +731,19 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
842
731
|
}
|
|
843
732
|
}
|
|
844
733
|
/** 计算表格所有列的渲染宽度之和,判断表格是否需要渲染锁列 */
|
|
845
|
-
|
|
846
734
|
}, {
|
|
847
735
|
key: "adjustNeedRenderLock",
|
|
848
736
|
value: function adjustNeedRenderLock() {
|
|
849
737
|
var needRenderLock = this.state.needRenderLock;
|
|
850
738
|
var _this$lastInfo2 = this.lastInfo,
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
739
|
+
flat = (0, _flat.default)(_this$lastInfo2),
|
|
740
|
+
hasLockColumn = _this$lastInfo2.hasLockColumn;
|
|
854
741
|
if (hasLockColumn) {
|
|
855
742
|
var _context;
|
|
856
|
-
|
|
857
743
|
var sumOfColWidth = (0, _utils.sum)((0, _map.default)(_context = flat.full).call(_context, function (col) {
|
|
858
744
|
return col.width;
|
|
859
745
|
}));
|
|
860
746
|
var nextNeedRenderLock = sumOfColWidth > this.domHelper.artTable.clientWidth;
|
|
861
|
-
|
|
862
747
|
if (needRenderLock !== nextNeedRenderLock) {
|
|
863
748
|
this.setState({
|
|
864
749
|
needRenderLock: nextNeedRenderLock
|
|
@@ -875,7 +760,6 @@ var BaseTable = /*#__PURE__*/function (_React$Component) {
|
|
|
875
760
|
}]);
|
|
876
761
|
return BaseTable;
|
|
877
762
|
}(_react.default.Component);
|
|
878
|
-
|
|
879
763
|
exports.BaseTable = BaseTable;
|
|
880
764
|
BaseTable.defaultProps = {
|
|
881
765
|
hasHeader: true,
|