@kdcloudjs/table 1.0.1 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/README.md +34 -33
- package/dist/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.css.map +1 -1
- package/dist/@kdcloudjs/table.js +6555 -3388
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +32 -24
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/es/_utils/hooks.js +1 -2
- package/es/_utils/numberUtil.js +3 -4
- package/es/locale/locale.js +1 -2
- package/es/table/base/calculations.js +3 -4
- package/es/table/base/empty.js +2 -2
- package/es/table/base/header.d.ts +6 -2
- package/es/table/base/header.js +41 -22
- package/es/table/base/helpers/SpanManager.js +1 -1
- package/es/table/base/helpers/TableDOMUtils.d.ts +3 -0
- package/es/table/base/helpers/TableDOMUtils.js +23 -5
- package/es/table/base/helpers/getRichVisibleRectsStream.d.ts +23 -0
- package/es/table/base/helpers/getRichVisibleRectsStream.js +216 -0
- package/es/table/base/html-table.d.ts +3 -1
- package/es/table/base/html-table.js +43 -26
- package/es/table/base/interfaces.d.ts +1 -0
- package/es/table/base/renderTemplates.d.ts +1 -0
- package/es/table/base/renderTemplates.js +344 -0
- package/es/table/base/styles.d.ts +24 -0
- package/es/table/base/styles.js +31 -9
- package/es/table/base/table.d.ts +12 -4
- package/es/table/base/table.js +183 -136
- package/es/table/base/utils.d.ts +6 -3
- package/es/table/base/utils.js +27 -6
- package/es/table/common-views.js +3 -3
- package/es/table/pipeline/features/autoFill.js +7 -1
- package/es/table/pipeline/features/columnDrag.js +168 -59
- package/es/table/pipeline/features/columnFilter.js +7 -9
- package/es/table/pipeline/features/columnResizeWidth.d.ts +3 -0
- package/es/table/pipeline/features/columnResizeWidth.js +11 -4
- package/es/table/pipeline/features/contextMenu.js +78 -31
- package/es/table/pipeline/features/filter/Filter.js +74 -37
- package/es/table/pipeline/features/index.d.ts +1 -0
- package/es/table/pipeline/features/index.js +2 -1
- package/es/table/pipeline/features/multiSelect.js +85 -79
- package/es/table/pipeline/features/rangeSelection.d.ts +10 -0
- package/es/table/pipeline/features/rangeSelection.js +231 -0
- package/es/table/pipeline/features/rowDetail.js +39 -16
- package/es/table/pipeline/features/rowGrouping.js +2 -1
- package/es/table/pipeline/features/singleSelect.js +4 -1
- package/es/table/pipeline/features/sort.js +2 -3
- package/es/table/pipeline/features/treeMode.js +4 -4
- package/es/table/pipeline/pipeline.d.ts +8 -0
- package/es/table/pipeline/pipeline.js +49 -5
- package/es/table/pivot/cross-table/buildCrossTable.js +1 -2
- package/es/table/pivot/cross-tree-table/buildCrossTreeTable.js +1 -2
- package/es/table/pivot/pivot-utils/builders.js +1 -2
- package/es/table/pivot/pivot-utils/convert-utils.js +5 -4
- package/es/table/transforms/autoWidth.js +1 -2
- package/es/table/transforms/sort.js +1 -2
- package/es/table/transforms/treeMode.js +1 -2
- package/es/table/utils/applyTransforms.js +1 -3
- package/es/table/utils/browserType.d.ts +6 -0
- package/es/table/utils/browserType.js +6 -0
- package/es/table/utils/buildTree.js +4 -5
- package/es/table/utils/collectNodes.js +1 -2
- package/es/table/utils/exportTableAsExcel.js +1 -2
- package/es/table/utils/getTreeDepth.js +1 -2
- package/es/table/utils/groupBy.js +1 -2
- package/es/table/utils/index.d.ts +1 -0
- package/es/table/utils/index.js +2 -1
- package/es/table/utils/layeredSort.js +5 -2
- package/es/table/utils/makeRecursiveMapper.js +4 -5
- package/es/table/utils/others.d.ts +1 -1
- package/es/table/utils/others.js +20 -14
- package/es/table/utils/traverseColumn.js +1 -2
- package/es/table/utils/tree-data-helpers/StrictTreeDataHelper.js +4 -5
- package/es/table/utils/tree-data-helpers/TreeDataHelper.js +4 -5
- package/lib/_utils/formatUtil.js +1 -1
- package/lib/_utils/hooks.js +2 -4
- package/lib/_utils/numberUtil.js +7 -9
- package/lib/_utils/usePopper.js +9 -1
- package/lib/config-provider/configProvider.js +9 -1
- package/lib/config-provider/index.js +5 -5
- package/lib/locale/index.js +14 -6
- package/lib/locale/locale.js +2 -4
- package/lib/table/base/calculations.js +4 -6
- package/lib/table/base/empty.js +11 -3
- package/lib/table/base/header.d.ts +6 -2
- package/lib/table/base/header.js +39 -19
- package/lib/table/base/helpers/SpanManager.js +1 -1
- package/lib/table/base/helpers/TableDOMUtils.d.ts +3 -0
- package/lib/table/base/helpers/TableDOMUtils.js +21 -5
- package/lib/table/base/helpers/getRichVisibleRectsStream.d.ts +23 -0
- package/lib/table/base/helpers/getRichVisibleRectsStream.js +246 -0
- package/lib/table/base/html-table.d.ts +3 -1
- package/lib/table/base/html-table.js +44 -26
- package/lib/table/base/index.js +4 -4
- package/lib/table/base/interfaces.d.ts +1 -0
- package/lib/table/base/renderTemplates.d.ts +1 -0
- package/lib/table/base/renderTemplates.js +370 -0
- package/lib/table/base/styles.d.ts +24 -0
- package/lib/table/base/styles.js +42 -13
- package/lib/table/base/table.d.ts +12 -4
- package/lib/table/base/table.js +191 -137
- package/lib/table/base/utils.d.ts +6 -3
- package/lib/table/base/utils.js +47 -10
- package/lib/table/common-views.js +3 -3
- package/lib/table/pipeline/features/autoFill.js +9 -2
- package/lib/table/pipeline/features/columnDrag.js +168 -59
- package/lib/table/pipeline/features/columnFilter.js +6 -9
- package/lib/table/pipeline/features/columnResizeWidth.d.ts +3 -0
- package/lib/table/pipeline/features/columnResizeWidth.js +21 -5
- package/lib/table/pipeline/features/contextMenu.js +89 -32
- package/lib/table/pipeline/features/filter/DefaultFilterContent.js +10 -2
- package/lib/table/pipeline/features/filter/Filter.js +88 -37
- package/lib/table/pipeline/features/filter/FilterPanel.js +10 -2
- package/lib/table/pipeline/features/filter/index.js +4 -4
- package/lib/table/pipeline/features/index.d.ts +1 -0
- package/lib/table/pipeline/features/index.js +37 -27
- package/lib/table/pipeline/features/multiSelect.js +81 -75
- package/lib/table/pipeline/features/rangeSelection.d.ts +10 -0
- package/lib/table/pipeline/features/rangeSelection.js +256 -0
- package/lib/table/pipeline/features/rowDetail.js +42 -16
- package/lib/table/pipeline/features/rowGrouping.js +3 -1
- package/lib/table/pipeline/features/singleSelect.js +4 -1
- package/lib/table/pipeline/features/sort.js +2 -4
- package/lib/table/pipeline/features/treeMode.js +6 -6
- package/lib/table/pipeline/index.js +11 -3
- package/lib/table/pipeline/pipeline.d.ts +8 -0
- package/lib/table/pipeline/pipeline.js +50 -7
- package/lib/table/pivot/cross-table/buildCrossTable.js +1 -3
- package/lib/table/pivot/cross-table/index.js +4 -4
- package/lib/table/pivot/cross-tree-table/buildCrossTreeTable.js +1 -3
- package/lib/table/pivot/pivot-utils/builders.js +2 -4
- package/lib/table/pivot/pivot-utils/convert-utils.js +7 -5
- package/lib/table/pivot/pivot-utils/index.js +4 -4
- package/lib/table/transforms/autoWidth.js +10 -4
- package/lib/table/transforms/columnResize.js +10 -2
- package/lib/table/transforms/index.js +32 -32
- package/lib/table/transforms/sort.js +10 -4
- package/lib/table/transforms/treeMode.js +9 -3
- package/lib/table/utils/applyTransforms.js +1 -5
- package/lib/table/utils/browserType.d.ts +6 -0
- package/lib/table/utils/browserType.js +13 -0
- package/lib/table/utils/buildTree.js +1 -3
- package/lib/table/utils/collectNodes.js +1 -3
- package/lib/table/utils/copyToClipboard.js +1 -1
- package/lib/table/utils/element.js +3 -3
- package/lib/table/utils/exportTableAsExcel.js +1 -3
- package/lib/table/utils/getTreeDepth.js +1 -3
- package/lib/table/utils/groupBy.js +1 -3
- package/lib/table/utils/index.d.ts +1 -0
- package/lib/table/utils/index.js +57 -49
- package/lib/table/utils/layeredSort.js +6 -2
- package/lib/table/utils/makeRecursiveMapper.js +1 -3
- package/lib/table/utils/others.d.ts +1 -1
- package/lib/table/utils/others.js +23 -18
- package/lib/table/utils/traverseColumn.js +1 -3
- package/lib/table/utils/tree-data-helpers/StrictTreeDataHelper.js +5 -7
- package/lib/table/utils/tree-data-helpers/TreeDataHelper.js +5 -7
- package/package.json +6 -2
- package/dist/kd-table.css +0 -422
- package/dist/kd-table.css.map +0 -1
- package/dist/kd-table.js +0 -38578
- package/dist/kd-table.js.map +0 -1
- package/dist/kd-table.min.css +0 -9
- package/dist/kd-table.min.js +0 -208
- package/dist/kd-table.min.js.map +0 -1
- package/es/table/base/helpers/__test__/visible-part.test.d.ts +0 -1
- package/es/table/base/helpers/__test__/visible-part.test.js +0 -28
- package/es/table/base/helpers/visible-part.d.ts +0 -23
- package/es/table/base/helpers/visible-part.js +0 -58
- package/es/table/pipeline/features/__test__/multiSelect.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/multiSelect.test.js +0 -152
- package/es/table/pipeline/features/__test__/rowDetail.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/rowDetail.test.js +0 -223
- package/es/table/pipeline/features/__test__/rowGrouping.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/rowGrouping.test.js +0 -120
- package/es/table/pipeline/features/__test__/singleSelect.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/singleSelect.test.js +0 -191
- package/es/table/pipeline/features/__test__/sort.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/sort.test.js +0 -213
- package/es/table/pipeline/features/__test__/tips.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/tips.test.js +0 -123
- package/es/table/pipeline/features/__test__/treeMode.test.d.ts +0 -1
- package/es/table/pipeline/features/__test__/treeMode.test.js +0 -202
- package/es/table/pipeline/features/filter/__test__/Filter.test.d.ts +0 -1
- package/es/table/pipeline/features/filter/__test__/Filter.test.js +0 -29
- package/lib/table/base/helpers/__test__/visible-part.test.d.ts +0 -1
- package/lib/table/base/helpers/__test__/visible-part.test.js +0 -31
- package/lib/table/base/helpers/visible-part.d.ts +0 -23
- package/lib/table/base/helpers/visible-part.js +0 -72
- package/lib/table/pipeline/features/__test__/multiSelect.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/multiSelect.test.js +0 -163
- package/lib/table/pipeline/features/__test__/rowDetail.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/rowDetail.test.js +0 -230
- package/lib/table/pipeline/features/__test__/rowGrouping.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/rowGrouping.test.js +0 -129
- package/lib/table/pipeline/features/__test__/singleSelect.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/singleSelect.test.js +0 -201
- package/lib/table/pipeline/features/__test__/sort.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/sort.test.js +0 -218
- package/lib/table/pipeline/features/__test__/tips.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/tips.test.js +0 -133
- package/lib/table/pipeline/features/__test__/treeMode.test.d.ts +0 -1
- package/lib/table/pipeline/features/__test__/treeMode.test.js +0 -206
- package/lib/table/pipeline/features/filter/__test__/Filter.test.d.ts +0 -1
- package/lib/table/pipeline/features/filter/__test__/Filter.test.js +0 -36
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import { getVisiblePartObservable, getVisiblePart } from '../visible-part';
|
|
2
|
-
var NAME = 'visible-part';
|
|
3
|
-
describe("".concat(NAME), function () {
|
|
4
|
-
it('getVisiblePartObservable', function () {
|
|
5
|
-
var container = document.createElement('div');
|
|
6
|
-
container.setAttribute('id', 't1');
|
|
7
|
-
container.style.cssText = 'width:100px;height:100px;overflow:auto;';
|
|
8
|
-
var content = document.createElement('div');
|
|
9
|
-
content.style.cssText = 'width:200px;height:200px;';
|
|
10
|
-
container.appendChild(content);
|
|
11
|
-
document.body.appendChild(container); // todo: rxjs test
|
|
12
|
-
|
|
13
|
-
getVisiblePartObservable(content, container);
|
|
14
|
-
var event = new window.Event('scroll', {
|
|
15
|
-
cancelable: false
|
|
16
|
-
});
|
|
17
|
-
container.dispatchEvent(event);
|
|
18
|
-
document.body.removeChild(container);
|
|
19
|
-
container = content = null;
|
|
20
|
-
});
|
|
21
|
-
it('getVisiblePart', function () {
|
|
22
|
-
var container = document.createElement('div');
|
|
23
|
-
document.body.appendChild(container);
|
|
24
|
-
expect(getVisiblePart(container, window).offsetX).toBe(0);
|
|
25
|
-
document.body.removeChild(container);
|
|
26
|
-
container = null;
|
|
27
|
-
});
|
|
28
|
-
});
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { Observable } from 'rxjs';
|
|
2
|
-
export declare function getVisiblePart(target: HTMLElement | typeof window, flowRoot: HTMLElement | typeof window): {
|
|
3
|
-
offsetY: number;
|
|
4
|
-
offsetX: number;
|
|
5
|
-
clipRect: {
|
|
6
|
-
left: number;
|
|
7
|
-
top: number;
|
|
8
|
-
right: number;
|
|
9
|
-
bottom: number;
|
|
10
|
-
};
|
|
11
|
-
};
|
|
12
|
-
/** 基于 ResizeObserver 和 scroll event 封装的 RxJS observable;
|
|
13
|
-
* 用于监听一个元素的在页面中的「可见范围」的不断变化 */
|
|
14
|
-
export declare function getVisiblePartObservable(target: HTMLElement, flowRoot: HTMLElement | typeof window): Observable<{
|
|
15
|
-
offsetY: number;
|
|
16
|
-
offsetX: number;
|
|
17
|
-
clipRect: {
|
|
18
|
-
left: number;
|
|
19
|
-
top: number;
|
|
20
|
-
right: number;
|
|
21
|
-
bottom: number;
|
|
22
|
-
};
|
|
23
|
-
}>;
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import ResizeObserver from 'resize-observer-polyfill';
|
|
2
|
-
import { fromEvent, merge, Observable } from 'rxjs';
|
|
3
|
-
import * as op from 'rxjs/operators';
|
|
4
|
-
|
|
5
|
-
function getRect(ele) {
|
|
6
|
-
if (ele === window) {
|
|
7
|
-
return {
|
|
8
|
-
left: 0,
|
|
9
|
-
top: 0,
|
|
10
|
-
bottom: window.innerHeight,
|
|
11
|
-
right: window.innerWidth
|
|
12
|
-
};
|
|
13
|
-
} else {
|
|
14
|
-
return ele.getBoundingClientRect();
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export function getVisiblePart(target, flowRoot) {
|
|
19
|
-
var targetRect = getRect(target);
|
|
20
|
-
var rootRect = getRect(flowRoot);
|
|
21
|
-
return {
|
|
22
|
-
offsetY: Math.max(0, rootRect.top - targetRect.top),
|
|
23
|
-
offsetX: Math.max(0, rootRect.left - targetRect.left),
|
|
24
|
-
clipRect: {
|
|
25
|
-
left: Math.max(targetRect.left, rootRect.left),
|
|
26
|
-
top: Math.max(targetRect.top, rootRect.top),
|
|
27
|
-
right: Math.min(targetRect.right, rootRect.right),
|
|
28
|
-
bottom: Math.min(targetRect.bottom, rootRect.bottom)
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
function fromResizeEvent(element) {
|
|
34
|
-
if (element === window) {
|
|
35
|
-
return fromEvent(element, 'resize');
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
return new Observable(function (subscriber) {
|
|
39
|
-
var resizeObserver = new ResizeObserver(function () {
|
|
40
|
-
subscriber.next();
|
|
41
|
-
});
|
|
42
|
-
resizeObserver.observe(element);
|
|
43
|
-
return function () {
|
|
44
|
-
resizeObserver.disconnect();
|
|
45
|
-
};
|
|
46
|
-
});
|
|
47
|
-
}
|
|
48
|
-
/** 基于 ResizeObserver 和 scroll event 封装的 RxJS observable;
|
|
49
|
-
* 用于监听一个元素的在页面中的「可见范围」的不断变化 */
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
export function getVisiblePartObservable(target, flowRoot) {
|
|
53
|
-
return merge(fromEvent(flowRoot, 'scroll', {
|
|
54
|
-
passive: true
|
|
55
|
-
}), fromResizeEvent(flowRoot), fromResizeEvent(target)).pipe(op.map(function () {
|
|
56
|
-
return getVisiblePart(target, flowRoot);
|
|
57
|
-
}));
|
|
58
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,152 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
2
|
-
import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
|
|
3
|
-
import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
|
|
4
|
-
|
|
5
|
-
var __rest = this && this.__rest || function (s, e) {
|
|
6
|
-
var t = {};
|
|
7
|
-
|
|
8
|
-
for (var p in s) {
|
|
9
|
-
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
if (s != null && typeof _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(s); i < p.length; i++) {
|
|
13
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
14
|
-
}
|
|
15
|
-
return t;
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
import React from 'react';
|
|
19
|
-
import { renderHook, act } from '@testing-library/react-hooks';
|
|
20
|
-
import { mount } from 'enzyme';
|
|
21
|
-
import { multiSelect } from '../multiSelect';
|
|
22
|
-
import { useTablePipeline } from '../../pipeline';
|
|
23
|
-
var NAME = 'multiSelect';
|
|
24
|
-
|
|
25
|
-
var MockCheckbox = function MockCheckbox(_a) {
|
|
26
|
-
var indeterminate = _a.indeterminate,
|
|
27
|
-
props = __rest(_a, ["indeterminate"]);
|
|
28
|
-
|
|
29
|
-
return /*#__PURE__*/React.createElement("input", _extends({
|
|
30
|
-
type: 'checkbox',
|
|
31
|
-
className: 'checkbox'
|
|
32
|
-
}, props));
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
var ROWS = [{
|
|
36
|
-
id: '1'
|
|
37
|
-
}];
|
|
38
|
-
var INPUT_DATA = {
|
|
39
|
-
columns: [],
|
|
40
|
-
dataSource: ROWS
|
|
41
|
-
};
|
|
42
|
-
describe("".concat(NAME), function () {
|
|
43
|
-
it('not set Checkbox', function () {
|
|
44
|
-
var _renderHook = renderHook(function () {
|
|
45
|
-
return useTablePipeline();
|
|
46
|
-
}),
|
|
47
|
-
result = _renderHook.result;
|
|
48
|
-
|
|
49
|
-
var _multiSelect = function _multiSelect() {
|
|
50
|
-
return multiSelect()(result.current);
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
expect(_multiSelect).toThrowError(/Checkbox/);
|
|
54
|
-
});
|
|
55
|
-
it('set require props,test checkboxColumn render, cell change and select all event', function () {
|
|
56
|
-
var _renderHook2 = renderHook(function () {
|
|
57
|
-
return useTablePipeline({
|
|
58
|
-
components: {
|
|
59
|
-
Checkbox: MockCheckbox
|
|
60
|
-
}
|
|
61
|
-
}).input(INPUT_DATA).primaryKey('id');
|
|
62
|
-
}),
|
|
63
|
-
result = _renderHook2.result;
|
|
64
|
-
|
|
65
|
-
multiSelect({
|
|
66
|
-
stopClickEventPropagation: true // 阻止冒泡
|
|
67
|
-
|
|
68
|
-
})(result.current);
|
|
69
|
-
expect(result.current.getColumns().length).toBeGreaterThan(0);
|
|
70
|
-
var checkboxColumn = result.current.getColumns()[0];
|
|
71
|
-
var wrapper = mount(checkboxColumn.render({}, {
|
|
72
|
-
id: '1'
|
|
73
|
-
}, 0)); // 测试复选框行点击onChange
|
|
74
|
-
|
|
75
|
-
act(function () {
|
|
76
|
-
_findInstanceProperty(wrapper).call(wrapper, MockCheckbox).at(0).simulate('change', {
|
|
77
|
-
target: {},
|
|
78
|
-
nativeEvent: {
|
|
79
|
-
stopPropagation: jest.fn()
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
});
|
|
83
|
-
expect(result.current.getStateAtKey('multiSelect')).toMatchObject({
|
|
84
|
-
"lastKey": "1",
|
|
85
|
-
"value": ["1"]
|
|
86
|
-
});
|
|
87
|
-
var titleWrapper = mount(checkboxColumn.title); // 测试选择列表头全选
|
|
88
|
-
|
|
89
|
-
act(function () {
|
|
90
|
-
_findInstanceProperty(titleWrapper).call(titleWrapper, MockCheckbox).at(0).simulate('change');
|
|
91
|
-
});
|
|
92
|
-
});
|
|
93
|
-
it('set clickArea=cell, test getCellProps and cell click', function () {
|
|
94
|
-
var _renderHook3 = renderHook(function () {
|
|
95
|
-
return useTablePipeline({
|
|
96
|
-
components: {
|
|
97
|
-
Checkbox: MockCheckbox
|
|
98
|
-
}
|
|
99
|
-
}).input(INPUT_DATA).primaryKey('id');
|
|
100
|
-
}),
|
|
101
|
-
result = _renderHook3.result;
|
|
102
|
-
|
|
103
|
-
multiSelect({
|
|
104
|
-
clickArea: 'cell'
|
|
105
|
-
})(result.current);
|
|
106
|
-
var checkboxColumn = result.current.getColumns()[0]; // 测试getCellProps
|
|
107
|
-
|
|
108
|
-
var cellProps = checkboxColumn.getCellProps('', ROWS[0], 0);
|
|
109
|
-
|
|
110
|
-
if (typeof cellProps.onClick === 'function') {
|
|
111
|
-
act(function () {
|
|
112
|
-
var mockEvent = {};
|
|
113
|
-
cellProps.onClick(mockEvent);
|
|
114
|
-
});
|
|
115
|
-
expect(result.current.getStateAtKey('multiSelect')).toMatchObject({
|
|
116
|
-
"lastKey": "1",
|
|
117
|
-
"value": ["1"]
|
|
118
|
-
});
|
|
119
|
-
}
|
|
120
|
-
});
|
|
121
|
-
it('set clickArea=row, test appendRowPropsGetter fn', function () {
|
|
122
|
-
var _renderHook4 = renderHook(function () {
|
|
123
|
-
return useTablePipeline({
|
|
124
|
-
components: {
|
|
125
|
-
Checkbox: MockCheckbox
|
|
126
|
-
}
|
|
127
|
-
}).input(INPUT_DATA).primaryKey('id');
|
|
128
|
-
}),
|
|
129
|
-
result = _renderHook4.result;
|
|
130
|
-
|
|
131
|
-
var pipeline = multiSelect({
|
|
132
|
-
lastKey: '1',
|
|
133
|
-
clickArea: 'row'
|
|
134
|
-
})(result.current); // 调用 appendRowPropsGetter 设置的函数
|
|
135
|
-
|
|
136
|
-
var props = pipeline.getProps();
|
|
137
|
-
var rowProps = props.getRowProps(ROWS[0], 0);
|
|
138
|
-
|
|
139
|
-
if (rowProps.onClick) {
|
|
140
|
-
act(function () {
|
|
141
|
-
var mockEvent = {
|
|
142
|
-
shiftKey: true
|
|
143
|
-
};
|
|
144
|
-
rowProps.onClick(mockEvent);
|
|
145
|
-
});
|
|
146
|
-
expect(result.current.getStateAtKey('multiSelect')).toMatchObject({
|
|
147
|
-
"lastKey": "1",
|
|
148
|
-
"value": ["1"]
|
|
149
|
-
});
|
|
150
|
-
}
|
|
151
|
-
});
|
|
152
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,223 +0,0 @@
|
|
|
1
|
-
import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
|
|
2
|
-
import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
|
|
3
|
-
import { rowDetail } from '../rowDetail';
|
|
4
|
-
import { useTablePipeline } from '../../pipeline';
|
|
5
|
-
import { mount } from 'enzyme';
|
|
6
|
-
import { renderHook } from '@testing-library/react-hooks';
|
|
7
|
-
import { act } from 'react-dom/test-utils';
|
|
8
|
-
var dataSource = [{
|
|
9
|
-
id: '1',
|
|
10
|
-
prov: '湖北省',
|
|
11
|
-
confirm: 54406,
|
|
12
|
-
cure: 4793,
|
|
13
|
-
dead: 1457,
|
|
14
|
-
t: '2020-02-15 19:52:02'
|
|
15
|
-
}, {
|
|
16
|
-
id: '2',
|
|
17
|
-
prov: '广东省',
|
|
18
|
-
confirm: 1294,
|
|
19
|
-
cure: 409,
|
|
20
|
-
dead: 2,
|
|
21
|
-
t: '2020-02-15 19:52:02'
|
|
22
|
-
}, {
|
|
23
|
-
id: '3',
|
|
24
|
-
prov: '河南省',
|
|
25
|
-
confirm: 1212,
|
|
26
|
-
cure: 390,
|
|
27
|
-
dead: 13,
|
|
28
|
-
t: '2020-02-15 19:52:02'
|
|
29
|
-
}, {
|
|
30
|
-
id: '4',
|
|
31
|
-
prov: '浙江省',
|
|
32
|
-
confirm: 1162,
|
|
33
|
-
cure: 428,
|
|
34
|
-
dead: 0,
|
|
35
|
-
t: '2020-02-15 19:52:02'
|
|
36
|
-
}, {
|
|
37
|
-
id: '5',
|
|
38
|
-
prov: '湖南省',
|
|
39
|
-
confirm: 1001,
|
|
40
|
-
cure: 417,
|
|
41
|
-
dead: 2,
|
|
42
|
-
t: '2020-02-15 19:52:02'
|
|
43
|
-
}];
|
|
44
|
-
var columns = [{
|
|
45
|
-
code: 'prov',
|
|
46
|
-
name: '省份',
|
|
47
|
-
width: 150,
|
|
48
|
-
features: {
|
|
49
|
-
sortable: true,
|
|
50
|
-
filterable: true
|
|
51
|
-
}
|
|
52
|
-
}, {
|
|
53
|
-
code: 'confirm',
|
|
54
|
-
name: '确诊',
|
|
55
|
-
width: 100,
|
|
56
|
-
align: 'right',
|
|
57
|
-
features: {
|
|
58
|
-
sortable: true,
|
|
59
|
-
filterable: true
|
|
60
|
-
}
|
|
61
|
-
}, {
|
|
62
|
-
code: 'cure',
|
|
63
|
-
name: '治愈',
|
|
64
|
-
width: 100,
|
|
65
|
-
align: 'right',
|
|
66
|
-
features: {
|
|
67
|
-
sortable: true,
|
|
68
|
-
filterable: true
|
|
69
|
-
}
|
|
70
|
-
}, {
|
|
71
|
-
code: 'dead',
|
|
72
|
-
name: '死亡',
|
|
73
|
-
width: 100,
|
|
74
|
-
align: 'right',
|
|
75
|
-
features: {
|
|
76
|
-
sortable: true,
|
|
77
|
-
filterable: true
|
|
78
|
-
}
|
|
79
|
-
}, {
|
|
80
|
-
code: 't',
|
|
81
|
-
name: '更新时间',
|
|
82
|
-
width: 180,
|
|
83
|
-
features: {
|
|
84
|
-
sortable: true,
|
|
85
|
-
filterable: true
|
|
86
|
-
}
|
|
87
|
-
}];
|
|
88
|
-
describe('rowDetail 单元测试', function () {
|
|
89
|
-
var opt = {
|
|
90
|
-
defaultOpenKeys: ['2'],
|
|
91
|
-
clickArea: 'content',
|
|
92
|
-
hasDetail: function hasDetail(row) {
|
|
93
|
-
var _context;
|
|
94
|
-
|
|
95
|
-
return _includesInstanceProperty(_context = ['1', '2', '3']).call(_context, row.id);
|
|
96
|
-
},
|
|
97
|
-
renderDetail: jest.fn(),
|
|
98
|
-
onChangeOpenKeys: jest.fn()
|
|
99
|
-
};
|
|
100
|
-
it('初始化', function () {
|
|
101
|
-
var _renderHook = renderHook(function () {
|
|
102
|
-
return useTablePipeline({
|
|
103
|
-
primaryKey: 'id'
|
|
104
|
-
}).input({
|
|
105
|
-
dataSource: dataSource,
|
|
106
|
-
columns: columns
|
|
107
|
-
});
|
|
108
|
-
}),
|
|
109
|
-
result = _renderHook.result;
|
|
110
|
-
|
|
111
|
-
var tablePipeline = result.current;
|
|
112
|
-
var newPipeline = rowDetail(opt)(tablePipeline); // 默认有1行展开,所以有6行
|
|
113
|
-
|
|
114
|
-
expect(newPipeline.getDataSource().length).toBe(6);
|
|
115
|
-
});
|
|
116
|
-
it('primaryKey不传', function () {
|
|
117
|
-
var _renderHook2 = renderHook(function () {
|
|
118
|
-
return useTablePipeline().input({
|
|
119
|
-
dataSource: dataSource,
|
|
120
|
-
columns: columns
|
|
121
|
-
});
|
|
122
|
-
}),
|
|
123
|
-
result = _renderHook2.result;
|
|
124
|
-
|
|
125
|
-
var tablePipeline = result.current;
|
|
126
|
-
expect(function () {
|
|
127
|
-
return rowDetail(opt)(tablePipeline);
|
|
128
|
-
}).toThrow(Error);
|
|
129
|
-
});
|
|
130
|
-
it('模拟行点击事件', function () {
|
|
131
|
-
var _renderHook3 = renderHook(function () {
|
|
132
|
-
return useTablePipeline({
|
|
133
|
-
primaryKey: 'id'
|
|
134
|
-
}).input({
|
|
135
|
-
dataSource: dataSource,
|
|
136
|
-
columns: columns
|
|
137
|
-
});
|
|
138
|
-
}),
|
|
139
|
-
result = _renderHook3.result;
|
|
140
|
-
|
|
141
|
-
var tablePipeline = result.current;
|
|
142
|
-
var newPipeline = rowDetail(opt)(tablePipeline);
|
|
143
|
-
var newDataSource = newPipeline.getDataSource();
|
|
144
|
-
var col = newPipeline.getColumns();
|
|
145
|
-
var wrapper = mount(col[0].render('1', newDataSource[0], 0));
|
|
146
|
-
|
|
147
|
-
var div = _findInstanceProperty(wrapper).call(wrapper, 'div').at(0);
|
|
148
|
-
|
|
149
|
-
expect(opt.onChangeOpenKeys).toHaveBeenCalledTimes(0);
|
|
150
|
-
act(function () {
|
|
151
|
-
div.simulate('click');
|
|
152
|
-
});
|
|
153
|
-
expect(opt.onChangeOpenKeys).toHaveBeenCalledTimes(1); // 点击没有展开行的行,不会触发onChange回调
|
|
154
|
-
|
|
155
|
-
var wrapper1 = mount(col[0].render('4', newDataSource[4], 4));
|
|
156
|
-
|
|
157
|
-
var div1 = _findInstanceProperty(wrapper1).call(wrapper1, 'div').at(0);
|
|
158
|
-
|
|
159
|
-
act(function () {
|
|
160
|
-
div1.simulate('click');
|
|
161
|
-
});
|
|
162
|
-
expect(opt.onChangeOpenKeys).toHaveBeenCalledTimes(1);
|
|
163
|
-
});
|
|
164
|
-
it('设置指定列展开', function () {
|
|
165
|
-
var _renderHook4 = renderHook(function () {
|
|
166
|
-
return useTablePipeline({
|
|
167
|
-
primaryKey: 'id'
|
|
168
|
-
}).input({
|
|
169
|
-
dataSource: dataSource,
|
|
170
|
-
columns: columns
|
|
171
|
-
});
|
|
172
|
-
}),
|
|
173
|
-
result = _renderHook4.result;
|
|
174
|
-
|
|
175
|
-
var tablePipeline = result.current;
|
|
176
|
-
opt.expandColumnCode = 'confirm';
|
|
177
|
-
var newPipeline = rowDetail(opt)(tablePipeline);
|
|
178
|
-
var col = newPipeline.getColumns();
|
|
179
|
-
var wrapper = mount(col[1].render('1', newPipeline.getDataSource()[0], 0)); // 不知道为啥是两个
|
|
180
|
-
|
|
181
|
-
expect(_findInstanceProperty(wrapper).call(wrapper, '.expansion-cell').length).toBe(2);
|
|
182
|
-
col[0].render('1', newPipeline.getDataSource()[2], 2);
|
|
183
|
-
expect(opt.renderDetail).toBeCalled();
|
|
184
|
-
var spanRect = col[0].getSpanRect('1', newPipeline.getDataSource()[2], 2);
|
|
185
|
-
expect(spanRect).toEqual({
|
|
186
|
-
top: 2,
|
|
187
|
-
bottom: 3,
|
|
188
|
-
left: 0,
|
|
189
|
-
right: 6
|
|
190
|
-
});
|
|
191
|
-
delete opt.expandColumnCode;
|
|
192
|
-
});
|
|
193
|
-
it('getCellProps 和getSpanRect', function () {
|
|
194
|
-
var _renderHook5 = renderHook(function () {
|
|
195
|
-
return useTablePipeline({
|
|
196
|
-
primaryKey: 'id'
|
|
197
|
-
}).input({
|
|
198
|
-
dataSource: dataSource,
|
|
199
|
-
columns: columns
|
|
200
|
-
});
|
|
201
|
-
}),
|
|
202
|
-
result = _renderHook5.result;
|
|
203
|
-
|
|
204
|
-
var tablePipeline = result.current;
|
|
205
|
-
opt.clickArea = 'cell';
|
|
206
|
-
var newPipeline = rowDetail(opt)(tablePipeline);
|
|
207
|
-
var col = newPipeline.getColumns();
|
|
208
|
-
var cellProps = col[0].getCellProps('1', newPipeline.getDataSource()[0], 0);
|
|
209
|
-
expect(cellProps.style).toEqual({
|
|
210
|
-
cursor: 'pointer'
|
|
211
|
-
});
|
|
212
|
-
cellProps.onClick();
|
|
213
|
-
expect(opt.onChangeOpenKeys).toBeCalled(); // detail 总是成一行
|
|
214
|
-
|
|
215
|
-
var spanRect = col[0].getSpanRect('1', newPipeline.getDataSource()[2], 2);
|
|
216
|
-
expect(spanRect).toEqual({
|
|
217
|
-
top: 2,
|
|
218
|
-
bottom: 3,
|
|
219
|
-
left: 0,
|
|
220
|
-
right: 6
|
|
221
|
-
});
|
|
222
|
-
});
|
|
223
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,120 +0,0 @@
|
|
|
1
|
-
import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
|
|
2
|
-
import { rowGrouping } from '../rowGrouping';
|
|
3
|
-
import { useTablePipeline } from '../../pipeline';
|
|
4
|
-
import { mount } from 'enzyme';
|
|
5
|
-
import { renderHook } from '@testing-library/react-hooks';
|
|
6
|
-
var dataSource = [{
|
|
7
|
-
id: 'alibaba',
|
|
8
|
-
groupTitle: '阿里巴巴网络技术有限公司',
|
|
9
|
-
children: [{
|
|
10
|
-
id: '1-1',
|
|
11
|
-
title: '二级标题',
|
|
12
|
-
dept: '消费者事业部-淘宝-UED',
|
|
13
|
-
dest: '云南大理',
|
|
14
|
-
guide: 'Douglas Lee'
|
|
15
|
-
}, {
|
|
16
|
-
id: '1-2',
|
|
17
|
-
title: '二级标题',
|
|
18
|
-
dept: '消费者事业部-淘宝-UED',
|
|
19
|
-
dest: '云南大理',
|
|
20
|
-
guide: 'Douglas Lee'
|
|
21
|
-
}]
|
|
22
|
-
}, {
|
|
23
|
-
id: 'antfin',
|
|
24
|
-
groupTitle: '蚂蚁金服有限公司',
|
|
25
|
-
children: [{
|
|
26
|
-
id: '2-1',
|
|
27
|
-
title: '二级标题',
|
|
28
|
-
dept: '消费者事业部-淘宝-UED',
|
|
29
|
-
dest: '云南大理',
|
|
30
|
-
guide: 'Douglas Lee'
|
|
31
|
-
}, {
|
|
32
|
-
id: '2-2',
|
|
33
|
-
title: '二级标题',
|
|
34
|
-
dept: '消费者事业部-淘宝-UED',
|
|
35
|
-
dest: '云南大理',
|
|
36
|
-
guide: 'Douglas Lee'
|
|
37
|
-
}]
|
|
38
|
-
}, {
|
|
39
|
-
id: 'other',
|
|
40
|
-
groupTitle: 'group without children'
|
|
41
|
-
}];
|
|
42
|
-
var columns = [{
|
|
43
|
-
code: 'title',
|
|
44
|
-
name: '标题',
|
|
45
|
-
width: 200
|
|
46
|
-
}, {
|
|
47
|
-
code: 'dept',
|
|
48
|
-
name: '部门名称',
|
|
49
|
-
width: 180
|
|
50
|
-
}, {
|
|
51
|
-
code: 'dest',
|
|
52
|
-
name: '团建目的地',
|
|
53
|
-
width: 160
|
|
54
|
-
}, {
|
|
55
|
-
code: 'guide',
|
|
56
|
-
name: '当地导游',
|
|
57
|
-
width: 160
|
|
58
|
-
}];
|
|
59
|
-
describe('rowGrouping 单元测试', function () {
|
|
60
|
-
var opts = {
|
|
61
|
-
defaultOpenAll: true,
|
|
62
|
-
onChangeOpenKeys: jest.fn()
|
|
63
|
-
};
|
|
64
|
-
var newPipeline = null;
|
|
65
|
-
beforeEach(function () {
|
|
66
|
-
var _renderHook = renderHook(function () {
|
|
67
|
-
return useTablePipeline({
|
|
68
|
-
primaryKey: 'id'
|
|
69
|
-
}).input({
|
|
70
|
-
dataSource: dataSource,
|
|
71
|
-
columns: columns
|
|
72
|
-
});
|
|
73
|
-
}),
|
|
74
|
-
result = _renderHook.result;
|
|
75
|
-
|
|
76
|
-
var tablePipeline = result.current;
|
|
77
|
-
newPipeline = rowGrouping(opts)(tablePipeline);
|
|
78
|
-
});
|
|
79
|
-
afterEach(function () {
|
|
80
|
-
newPipeline = null;
|
|
81
|
-
opts.onChangeOpenKeys.mockClear();
|
|
82
|
-
});
|
|
83
|
-
it('初始化', function () {
|
|
84
|
-
expect(newPipeline.getDataSource().length).toBe(7);
|
|
85
|
-
});
|
|
86
|
-
it('getCellProps', function () {
|
|
87
|
-
var col = newPipeline.getColumns();
|
|
88
|
-
var cellProps = col[0].getCellProps('阿里巴巴网络技术有限公司', newPipeline.getDataSource()[0], 0);
|
|
89
|
-
expect(cellProps.style).toEqual({
|
|
90
|
-
cursor: 'pointer'
|
|
91
|
-
});
|
|
92
|
-
cellProps.onClick();
|
|
93
|
-
expect(opts.onChangeOpenKeys).toBeCalled(); // 不是分组行没有cellProps
|
|
94
|
-
|
|
95
|
-
var cellProps1 = col[0].getCellProps('阿里巴巴网络技术有限公司', newPipeline.getDataSource()[1], 1);
|
|
96
|
-
expect(cellProps1).toBe(undefined);
|
|
97
|
-
});
|
|
98
|
-
it('getSpanRect', function () {
|
|
99
|
-
var col = newPipeline.getColumns();
|
|
100
|
-
var spanRect = col[0].getSpanRect('阿里巴巴网络技术有限公司', newPipeline.getDataSource()[0], 0);
|
|
101
|
-
expect(spanRect).toEqual({
|
|
102
|
-
top: 0,
|
|
103
|
-
bottom: 1,
|
|
104
|
-
left: 0,
|
|
105
|
-
right: 5
|
|
106
|
-
});
|
|
107
|
-
});
|
|
108
|
-
it('单元格渲染', function () {
|
|
109
|
-
var col = newPipeline.getColumns();
|
|
110
|
-
var wrapper = mount(col[0].render('1', newPipeline.getDataSource()[0], 0));
|
|
111
|
-
expect(_findInstanceProperty(wrapper).call(wrapper, '.expansion-cell').length).toBe(2);
|
|
112
|
-
var wrapper1 = mount(col[0].render('1', newPipeline.getDataSource()[1], 1));
|
|
113
|
-
expect(_findInstanceProperty(wrapper1).call(wrapper1, '.expansion-cell').length).toBe(0);
|
|
114
|
-
});
|
|
115
|
-
it('appendRowPropsGetter', function () {
|
|
116
|
-
var props = newPipeline.getProps();
|
|
117
|
-
var rowProps = props.getRowProps(newPipeline.getDataSource()[0], 0);
|
|
118
|
-
expect(rowProps.className).toBe('alternative');
|
|
119
|
-
});
|
|
120
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|