stk-table-vue 0.8.13 → 0.9.0-beta.1

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.
Files changed (38) hide show
  1. package/README.md +172 -180
  2. package/lib/src/StkTable/StkTable.vue.d.ts +22 -2
  3. package/lib/src/StkTable/useScrollbar.d.ts +57 -0
  4. package/lib/src/StkTable/utils/index.d.ts +10 -0
  5. package/lib/stk-table-vue.js +563 -294
  6. package/lib/style.css +49 -2
  7. package/package.json +74 -72
  8. package/src/StkTable/StkTable.vue +1730 -1653
  9. package/src/StkTable/components/DragHandle.vue +9 -9
  10. package/src/StkTable/components/SortIcon.vue +6 -6
  11. package/src/StkTable/components/TriangleIcon.vue +3 -3
  12. package/src/StkTable/const.ts +50 -50
  13. package/src/StkTable/index.ts +4 -4
  14. package/src/StkTable/style.less +627 -580
  15. package/src/StkTable/types/highlightDimOptions.ts +26 -26
  16. package/src/StkTable/types/index.ts +297 -297
  17. package/src/StkTable/useAutoResize.ts +91 -91
  18. package/src/StkTable/useColResize.ts +216 -216
  19. package/src/StkTable/useFixedCol.ts +150 -148
  20. package/src/StkTable/useFixedStyle.ts +75 -75
  21. package/src/StkTable/useGetFixedColPosition.ts +65 -65
  22. package/src/StkTable/useHighlight.ts +257 -257
  23. package/src/StkTable/useKeyboardArrowScroll.ts +112 -112
  24. package/src/StkTable/useMaxRowSpan.ts +55 -55
  25. package/src/StkTable/useMergeCells.ts +120 -123
  26. package/src/StkTable/useRowExpand.ts +88 -88
  27. package/src/StkTable/useScrollRowByRow.ts +114 -79
  28. package/src/StkTable/useScrollbar.ts +187 -0
  29. package/src/StkTable/useThDrag.ts +102 -102
  30. package/src/StkTable/useTrDrag.ts +113 -118
  31. package/src/StkTable/useTree.ts +161 -161
  32. package/src/StkTable/useVirtualScroll.ts +494 -494
  33. package/src/StkTable/utils/constRefUtils.ts +29 -29
  34. package/src/StkTable/utils/index.ts +287 -242
  35. package/src/StkTable/utils/useTriggerRef.ts +33 -33
  36. package/src/VirtualTree.vue +622 -622
  37. package/src/VirtualTreeSelect.vue +367 -367
  38. package/src/vite-env.d.ts +10 -10
@@ -1,161 +1,161 @@
1
- import { ShallowRef } from 'vue';
2
- import { PrivateRowDT, RowKeyGen, TreeConfig, UniqKey } from './types';
3
-
4
- type DT = PrivateRowDT & { children?: DT[] };
5
- type Option<DT extends Record<string, any>> = {
6
- props: any;
7
- rowKeyGen: RowKeyGen;
8
- dataSourceCopy: ShallowRef<DT[]>;
9
- emits: any;
10
- };
11
-
12
- export function useTree({ props, dataSourceCopy, rowKeyGen, emits }: Option<DT>) {
13
- const { defaultExpandAll, defaultExpandKeys, defaultExpandLevel }: TreeConfig = props.treeConfig;
14
- /** It used to check if it is first load. To execute defaultExpandXXX */
15
- let isFirstLoad = true;
16
- /** click expended icon to toggle expand row */
17
- function toggleTreeNode(row: DT, col: any) {
18
- const expand = row ? !row.__T_EXP__ : false;
19
- privateSetTreeExpand(row, { expand, col, isClick: true });
20
- }
21
-
22
- /**
23
- *
24
- * @param row rowKey or row
25
- * @param option
26
- * @param option.expand expand or collapse
27
- * @param option.silent if set true, not emit `toggle-tree-expand`, default:false
28
- */
29
- function privateSetTreeExpand(row: (UniqKey | DT) | (UniqKey | DT)[], option: { expand?: boolean; col?: any; isClick: boolean }) {
30
- const rowKeyOrRowArr: (UniqKey | DT)[] = Array.isArray(row) ? row : [row];
31
-
32
- const tempData = dataSourceCopy.value.slice();
33
- for (let i = 0; i < rowKeyOrRowArr.length; i++) {
34
- const rowKeyOrRow = rowKeyOrRowArr[i];
35
- let rowKey: UniqKey;
36
- if (typeof rowKeyOrRow === 'string') {
37
- rowKey = rowKeyOrRow;
38
- } else {
39
- rowKey = rowKeyGen(rowKeyOrRow);
40
- }
41
- const index = tempData.findIndex(it => rowKeyGen(it) === rowKey);
42
- if (index === -1) {
43
- console.warn('treeExpandRow failed.rowKey:', rowKey);
44
- return;
45
- }
46
-
47
- const row = tempData[index];
48
- const level = row.__T_LV__ || 0;
49
- let expanded = option?.expand;
50
- if (expanded === void 0) {
51
- expanded = !row.__T_EXP__;
52
- }
53
- if (expanded) {
54
- const children = expandNode(row, level);
55
- tempData.splice(index + 1, 0, ...children);
56
- } else {
57
- // delete all child nodes from i
58
- const deleteCount = foldNode(index, tempData, level);
59
- tempData.splice(index + 1, deleteCount);
60
- }
61
-
62
- setNodeExpanded(row, expanded, level);
63
-
64
- if (option.isClick) {
65
- emits('toggle-tree-expand', { expanded: Boolean(expanded), row, col: option.col });
66
- }
67
- }
68
-
69
- dataSourceCopy.value = tempData;
70
- }
71
-
72
- function setTreeExpand(row: (UniqKey | DT) | (UniqKey | DT)[], option?: { expand?: boolean }) {
73
- privateSetTreeExpand(row, { ...option, isClick: false });
74
- }
75
-
76
- function setNodeExpanded(row: DT, expanded: boolean, level?: number, parent?: DT) {
77
- row.__T_EXP__ = expanded;
78
- if (level !== void 0) {
79
- row.__T_LV__ = level;
80
- }
81
- // if (parent) {
82
- // row.__T_P_K__ = rowKeyGen(parent);
83
- // }
84
- }
85
-
86
- function recursionFlat(data: DT[] | undefined, level: number, parent?: DT): DT[] {
87
- if (!data) return [];
88
- let result: DT[] = []
89
- for (let i = 0; i < data.length; i++) {
90
- const item = data[i];
91
- result.push(item);
92
- const isExpanded = Boolean(item.__T_EXP__);
93
- setNodeExpanded(item, isExpanded, level, parent);
94
- if (isFirstLoad && !isExpanded) {
95
- // first load will expand all node if defaultExpandAll is true
96
- if (defaultExpandAll) {
97
- setNodeExpanded(item, true);
98
- } else {
99
- if (defaultExpandLevel && level < defaultExpandLevel) {
100
- setNodeExpanded(item, true);
101
- }
102
- if (defaultExpandKeys?.includes(rowKeyGen(item))) {
103
- setNodeExpanded(item, true);
104
- }
105
- }
106
- }
107
- if (item.__T_EXP__) {
108
- const res = recursionFlat(item.children, level + 1, item);
109
- result = result.concat(res);
110
- }
111
- }
112
- return result;
113
- };
114
-
115
- /**
116
- * 根据保存的展开状态,深度遍历,展平树形数据。
117
- * en: flatten tree data by saved expand state.
118
- * @param data
119
- * @returns
120
- */
121
- function flatTreeData(data: DT[]) {
122
- const result = recursionFlat(data, 0);
123
- isFirstLoad = false;
124
- return result;
125
- }
126
-
127
- function expandNode(row: DT, level: number) {
128
- let result: DT[] = [];
129
- row.children &&
130
- row.children.forEach((child: DT) => {
131
- result.push(child);
132
- const childLv = level + 1;
133
- if (child.__T_EXP__ && child.children) {
134
- const res = expandNode(child, childLv);
135
- result = result.concat(res);
136
- } else {
137
- setNodeExpanded(child, false, childLv, row);
138
- }
139
- });
140
- return result;
141
- }
142
-
143
- function foldNode(index: number, tempData: DT[], level: number) {
144
- let deleteCount = 0;
145
- for (let i = index + 1; i < tempData.length; i++) {
146
- const child = tempData[i];
147
- if (child.__T_LV__ && child.__T_LV__ > level) {
148
- deleteCount++;
149
- } else {
150
- break;
151
- }
152
- }
153
- return deleteCount;
154
- }
155
-
156
- return {
157
- toggleTreeNode,
158
- setTreeExpand,
159
- flatTreeData,
160
- };
161
- }
1
+ import { ShallowRef } from 'vue';
2
+ import { PrivateRowDT, RowKeyGen, TreeConfig, UniqKey } from './types';
3
+
4
+ type DT = PrivateRowDT & { children?: DT[] };
5
+ type Option<DT extends Record<string, any>> = {
6
+ props: any;
7
+ rowKeyGen: RowKeyGen;
8
+ dataSourceCopy: ShallowRef<DT[]>;
9
+ emits: any;
10
+ };
11
+
12
+ export function useTree({ props, dataSourceCopy, rowKeyGen, emits }: Option<DT>) {
13
+ const { defaultExpandAll, defaultExpandKeys, defaultExpandLevel }: TreeConfig = props.treeConfig;
14
+ /** It used to check if it is first load. To execute defaultExpandXXX */
15
+ let isFirstLoad = true;
16
+ /** click expended icon to toggle expand row */
17
+ function toggleTreeNode(row: DT, col: any) {
18
+ const expand = row ? !row.__T_EXP__ : false;
19
+ privateSetTreeExpand(row, { expand, col, isClick: true });
20
+ }
21
+
22
+ /**
23
+ *
24
+ * @param row rowKey or row
25
+ * @param option
26
+ * @param option.expand expand or collapse
27
+ * @param option.silent if set true, not emit `toggle-tree-expand`, default:false
28
+ */
29
+ function privateSetTreeExpand(row: (UniqKey | DT) | (UniqKey | DT)[], option: { expand?: boolean; col?: any; isClick: boolean }) {
30
+ const rowKeyOrRowArr: (UniqKey | DT)[] = Array.isArray(row) ? row : [row];
31
+
32
+ const tempData = dataSourceCopy.value.slice();
33
+ for (let i = 0; i < rowKeyOrRowArr.length; i++) {
34
+ const rowKeyOrRow = rowKeyOrRowArr[i];
35
+ let rowKey: UniqKey;
36
+ if (typeof rowKeyOrRow === 'string') {
37
+ rowKey = rowKeyOrRow;
38
+ } else {
39
+ rowKey = rowKeyGen(rowKeyOrRow);
40
+ }
41
+ const index = tempData.findIndex(it => rowKeyGen(it) === rowKey);
42
+ if (index === -1) {
43
+ console.warn('treeExpandRow failed.rowKey:', rowKey);
44
+ return;
45
+ }
46
+
47
+ const row = tempData[index];
48
+ const level = row.__T_LV__ || 0;
49
+ let expanded = option?.expand;
50
+ if (expanded === void 0) {
51
+ expanded = !row.__T_EXP__;
52
+ }
53
+ if (expanded) {
54
+ const children = expandNode(row, level);
55
+ tempData.splice(index + 1, 0, ...children);
56
+ } else {
57
+ // delete all child nodes from i
58
+ const deleteCount = foldNode(index, tempData, level);
59
+ tempData.splice(index + 1, deleteCount);
60
+ }
61
+
62
+ setNodeExpanded(row, expanded, level);
63
+
64
+ if (option.isClick) {
65
+ emits('toggle-tree-expand', { expanded: Boolean(expanded), row, col: option.col });
66
+ }
67
+ }
68
+
69
+ dataSourceCopy.value = tempData;
70
+ }
71
+
72
+ function setTreeExpand(row: (UniqKey | DT) | (UniqKey | DT)[], option?: { expand?: boolean }) {
73
+ privateSetTreeExpand(row, { ...option, isClick: false });
74
+ }
75
+
76
+ function setNodeExpanded(row: DT, expanded: boolean, level?: number, parent?: DT) {
77
+ row.__T_EXP__ = expanded;
78
+ if (level !== void 0) {
79
+ row.__T_LV__ = level;
80
+ }
81
+ // if (parent) {
82
+ // row.__T_P_K__ = rowKeyGen(parent);
83
+ // }
84
+ }
85
+
86
+ function recursionFlat(data: DT[] | undefined, level: number, parent?: DT): DT[] {
87
+ if (!data) return [];
88
+ let result: DT[] = []
89
+ for (let i = 0; i < data.length; i++) {
90
+ const item = data[i];
91
+ result.push(item);
92
+ const isExpanded = Boolean(item.__T_EXP__);
93
+ setNodeExpanded(item, isExpanded, level, parent);
94
+ if (isFirstLoad && !isExpanded) {
95
+ // first load will expand all node if defaultExpandAll is true
96
+ if (defaultExpandAll) {
97
+ setNodeExpanded(item, true);
98
+ } else {
99
+ if (defaultExpandLevel && level < defaultExpandLevel) {
100
+ setNodeExpanded(item, true);
101
+ }
102
+ if (defaultExpandKeys?.includes(rowKeyGen(item))) {
103
+ setNodeExpanded(item, true);
104
+ }
105
+ }
106
+ }
107
+ if (item.__T_EXP__) {
108
+ const res = recursionFlat(item.children, level + 1, item);
109
+ result = result.concat(res);
110
+ }
111
+ }
112
+ return result;
113
+ };
114
+
115
+ /**
116
+ * 根据保存的展开状态,深度遍历,展平树形数据。
117
+ * en: flatten tree data by saved expand state.
118
+ * @param data
119
+ * @returns
120
+ */
121
+ function flatTreeData(data: DT[]) {
122
+ const result = recursionFlat(data, 0);
123
+ isFirstLoad = false;
124
+ return result;
125
+ }
126
+
127
+ function expandNode(row: DT, level: number) {
128
+ let result: DT[] = [];
129
+ row.children &&
130
+ row.children.forEach((child: DT) => {
131
+ result.push(child);
132
+ const childLv = level + 1;
133
+ if (child.__T_EXP__ && child.children) {
134
+ const res = expandNode(child, childLv);
135
+ result = result.concat(res);
136
+ } else {
137
+ setNodeExpanded(child, false, childLv, row);
138
+ }
139
+ });
140
+ return result;
141
+ }
142
+
143
+ function foldNode(index: number, tempData: DT[], level: number) {
144
+ let deleteCount = 0;
145
+ for (let i = index + 1; i < tempData.length; i++) {
146
+ const child = tempData[i];
147
+ if (child.__T_LV__ && child.__T_LV__ > level) {
148
+ deleteCount++;
149
+ } else {
150
+ break;
151
+ }
152
+ }
153
+ return deleteCount;
154
+ }
155
+
156
+ return {
157
+ toggleTreeNode,
158
+ setTreeExpand,
159
+ flatTreeData,
160
+ };
161
+ }