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.
- package/README.md +172 -180
- package/lib/src/StkTable/StkTable.vue.d.ts +22 -2
- package/lib/src/StkTable/useScrollbar.d.ts +57 -0
- package/lib/src/StkTable/utils/index.d.ts +10 -0
- package/lib/stk-table-vue.js +563 -294
- package/lib/style.css +49 -2
- package/package.json +74 -72
- package/src/StkTable/StkTable.vue +1730 -1653
- package/src/StkTable/components/DragHandle.vue +9 -9
- package/src/StkTable/components/SortIcon.vue +6 -6
- package/src/StkTable/components/TriangleIcon.vue +3 -3
- package/src/StkTable/const.ts +50 -50
- package/src/StkTable/index.ts +4 -4
- package/src/StkTable/style.less +627 -580
- package/src/StkTable/types/highlightDimOptions.ts +26 -26
- package/src/StkTable/types/index.ts +297 -297
- package/src/StkTable/useAutoResize.ts +91 -91
- package/src/StkTable/useColResize.ts +216 -216
- package/src/StkTable/useFixedCol.ts +150 -148
- package/src/StkTable/useFixedStyle.ts +75 -75
- package/src/StkTable/useGetFixedColPosition.ts +65 -65
- package/src/StkTable/useHighlight.ts +257 -257
- package/src/StkTable/useKeyboardArrowScroll.ts +112 -112
- package/src/StkTable/useMaxRowSpan.ts +55 -55
- package/src/StkTable/useMergeCells.ts +120 -123
- package/src/StkTable/useRowExpand.ts +88 -88
- package/src/StkTable/useScrollRowByRow.ts +114 -79
- package/src/StkTable/useScrollbar.ts +187 -0
- package/src/StkTable/useThDrag.ts +102 -102
- package/src/StkTable/useTrDrag.ts +113 -118
- package/src/StkTable/useTree.ts +161 -161
- package/src/StkTable/useVirtualScroll.ts +494 -494
- package/src/StkTable/utils/constRefUtils.ts +29 -29
- package/src/StkTable/utils/index.ts +287 -242
- package/src/StkTable/utils/useTriggerRef.ts +33 -33
- package/src/VirtualTree.vue +622 -622
- package/src/VirtualTreeSelect.vue +367 -367
- package/src/vite-env.d.ts +10 -10
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
type HighlightDimBaseOption = {
|
|
2
|
-
duration?: number;
|
|
3
|
-
};
|
|
4
|
-
|
|
5
|
-
type HighlightDimAnimationOption = HighlightDimBaseOption & {
|
|
6
|
-
/** use Animation API */
|
|
7
|
-
method: 'animation';
|
|
8
|
-
/**
|
|
9
|
-
* same as https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats
|
|
10
|
-
*/
|
|
11
|
-
keyframe?: Parameters<Animatable['animate']>['0'];
|
|
12
|
-
};
|
|
13
|
-
type HighlightDimCssOption = HighlightDimBaseOption & {
|
|
14
|
-
method: 'css';
|
|
15
|
-
/** class name with css animation */
|
|
16
|
-
className?: string;
|
|
17
|
-
/** control delay time to remove className */
|
|
18
|
-
duration?: number;
|
|
19
|
-
};
|
|
20
|
-
// type HighlightDimJsOption = HighlightDimBaseOption & {
|
|
21
|
-
// /** use d3-interpolate js to change background color */
|
|
22
|
-
// method: 'js';
|
|
23
|
-
// };
|
|
24
|
-
|
|
25
|
-
export type HighlightDimCellOption = HighlightDimBaseOption | HighlightDimAnimationOption | HighlightDimCssOption;
|
|
26
|
-
export type HighlightDimRowOption = HighlightDimBaseOption | HighlightDimAnimationOption | HighlightDimCssOption /* | HighlightDimJsOption */;
|
|
1
|
+
type HighlightDimBaseOption = {
|
|
2
|
+
duration?: number;
|
|
3
|
+
};
|
|
4
|
+
|
|
5
|
+
type HighlightDimAnimationOption = HighlightDimBaseOption & {
|
|
6
|
+
/** use Animation API */
|
|
7
|
+
method: 'animation';
|
|
8
|
+
/**
|
|
9
|
+
* same as https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Keyframe_Formats
|
|
10
|
+
*/
|
|
11
|
+
keyframe?: Parameters<Animatable['animate']>['0'];
|
|
12
|
+
};
|
|
13
|
+
type HighlightDimCssOption = HighlightDimBaseOption & {
|
|
14
|
+
method: 'css';
|
|
15
|
+
/** class name with css animation */
|
|
16
|
+
className?: string;
|
|
17
|
+
/** control delay time to remove className */
|
|
18
|
+
duration?: number;
|
|
19
|
+
};
|
|
20
|
+
// type HighlightDimJsOption = HighlightDimBaseOption & {
|
|
21
|
+
// /** use d3-interpolate js to change background color */
|
|
22
|
+
// method: 'js';
|
|
23
|
+
// };
|
|
24
|
+
|
|
25
|
+
export type HighlightDimCellOption = HighlightDimBaseOption | HighlightDimAnimationOption | HighlightDimCssOption;
|
|
26
|
+
export type HighlightDimRowOption = HighlightDimBaseOption | HighlightDimAnimationOption | HighlightDimCssOption /* | HighlightDimJsOption */;
|
|
@@ -1,297 +1,297 @@
|
|
|
1
|
-
import { Component, ComputedRef, ConcreteComponent } from 'vue';
|
|
2
|
-
|
|
3
|
-
/** 排序方式,asc-正序,desc-倒序,null-默认顺序 */
|
|
4
|
-
export type Order = null | 'asc' | 'desc';
|
|
5
|
-
|
|
6
|
-
type Sorter<T> = boolean | ((data: T[], option: { order: Order; column: any }) => T[]);
|
|
7
|
-
|
|
8
|
-
export type CustomCellProps<T extends Record<string, any>> = {
|
|
9
|
-
row: T;
|
|
10
|
-
col: StkTableColumn<T>;
|
|
11
|
-
/** row[col.dataIndex] 的值 */
|
|
12
|
-
cellValue: any;
|
|
13
|
-
rowIndex: number;
|
|
14
|
-
colIndex: number;
|
|
15
|
-
/**
|
|
16
|
-
* 当前行是否展开
|
|
17
|
-
* - 不展开: null
|
|
18
|
-
* - 展开: 返回column配置
|
|
19
|
-
*/
|
|
20
|
-
expanded?: PrivateRowDT['__EXP__'];
|
|
21
|
-
/** if tree expanded */
|
|
22
|
-
treeExpanded?: PrivateRowDT['__T_EXP__']
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
export type CustomHeaderCellProps<T extends Record<string, any>> = {
|
|
26
|
-
col: StkTableColumn<T>;
|
|
27
|
-
rowIndex: number;
|
|
28
|
-
colIndex: number;
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
export type MergeCellsParam<T extends Record<string, any>> = {
|
|
32
|
-
row: T;
|
|
33
|
-
col: StkTableColumn<T>;
|
|
34
|
-
rowIndex: number;
|
|
35
|
-
colIndex: number;
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
export type MergeCellsFn<T extends Record<string, any>> = (data: MergeCellsParam<T>) => { rowspan?: number; colspan?: number } | undefined;
|
|
39
|
-
|
|
40
|
-
/**
|
|
41
|
-
* 自定义渲染单元格
|
|
42
|
-
*
|
|
43
|
-
* `StkTableColumn.customCell` 类型直接定义 `Component<Props>` 如果 Props 属性为必选,则 通过`defineComponent` 创建的组件必须要定义所有的Prop,否则就不适配。但是在函数式组件中是正常使用的。customCell: (props) => {}。
|
|
44
|
-
*
|
|
45
|
-
* 如果定义 Props 所有属性均为可选时。`defineComponent` 定义的组件仅需实现个别的 Prop 即可。但是函数式组件的入参props就需要额外判断是否存在。这增加了使用成本。
|
|
46
|
-
*
|
|
47
|
-
* 因此这里重新组合了Component类型
|
|
48
|
-
*/
|
|
49
|
-
export type CustomCell<T extends CustomCellProps<U> | CustomHeaderCellProps<U>, U extends Record<string, any>> =
|
|
50
|
-
| ConcreteComponent<T>
|
|
51
|
-
| Exclude<Component<Partial<T>>, ConcreteComponent>
|
|
52
|
-
| string;
|
|
53
|
-
|
|
54
|
-
/** 表格列配置 */
|
|
55
|
-
export type StkTableColumn<T extends Record<string, any>> = {
|
|
56
|
-
/**
|
|
57
|
-
* 列唯一键,(可选),不传则默认取dataIndex 字段作为列唯一键。
|
|
58
|
-
*/
|
|
59
|
-
key?: any;
|
|
60
|
-
/**
|
|
61
|
-
* 列类型
|
|
62
|
-
* - seq 序号列
|
|
63
|
-
* - expand 展开列
|
|
64
|
-
* - dragRow 拖拽列(使用sktTableRef.getTableData 获取改变后的顺序)
|
|
65
|
-
* - tree-node 树节点列,这一列前面有展开收起箭头
|
|
66
|
-
*/
|
|
67
|
-
type?: 'seq' | 'expand' | 'dragRow' | 'tree-node';
|
|
68
|
-
/** 取值id */
|
|
69
|
-
dataIndex: keyof T & string;
|
|
70
|
-
/** 表头文字 */
|
|
71
|
-
title?: string;
|
|
72
|
-
/** 列内容对齐方式 */
|
|
73
|
-
align?: 'right' | 'left' | 'center';
|
|
74
|
-
/** 表头内容对齐方式 */
|
|
75
|
-
headerAlign?: 'right' | 'left' | 'center';
|
|
76
|
-
/** 筛选 */
|
|
77
|
-
sorter?: Sorter<T>;
|
|
78
|
-
/** 列宽。横向虚拟滚动时必须设置。 */
|
|
79
|
-
width?: string | number;
|
|
80
|
-
/** 最小列宽。非x虚拟滚动生效。 */
|
|
81
|
-
minWidth?: string | number;
|
|
82
|
-
/** 最大列宽。非x虚拟滚动生效。 */
|
|
83
|
-
maxWidth?: string | number;
|
|
84
|
-
/**th class */
|
|
85
|
-
headerClassName?: string;
|
|
86
|
-
/** td class */
|
|
87
|
-
className?: string;
|
|
88
|
-
/** 排序字段。default: dataIndex */
|
|
89
|
-
sortField?: keyof T;
|
|
90
|
-
/** 排序方式。按数字/字符串 */
|
|
91
|
-
sortType?: 'number' | 'string';
|
|
92
|
-
/** 配置当前列的排序规则 */
|
|
93
|
-
sortConfig?: Omit<SortConfig<T>, 'defaultSort'>;
|
|
94
|
-
/** 固定列 */
|
|
95
|
-
fixed?: 'left' | 'right' | null;
|
|
96
|
-
/**
|
|
97
|
-
* 自定义 td 渲染内容。
|
|
98
|
-
*
|
|
99
|
-
* 组件prop入参:
|
|
100
|
-
* @param props.row 一行的记录。
|
|
101
|
-
* @param props.col 列配置
|
|
102
|
-
* @param props.cellValue row[col.dataIndex] 的值
|
|
103
|
-
* @param props.rowIndex 行索引
|
|
104
|
-
* @param props.colIndex 列索引
|
|
105
|
-
*/
|
|
106
|
-
customCell?: CustomCell<CustomCellProps<T>, T>;
|
|
107
|
-
/**
|
|
108
|
-
* 自定义 th 渲染内容
|
|
109
|
-
*
|
|
110
|
-
* 组件prop入参:
|
|
111
|
-
* @param props.col 列配置
|
|
112
|
-
* @param props.rowIndex 行索引
|
|
113
|
-
* @param props.colIndex 列索引
|
|
114
|
-
*/
|
|
115
|
-
customHeaderCell?: CustomCell<CustomHeaderCellProps<T>, T>;
|
|
116
|
-
/** 二级表头 */
|
|
117
|
-
children?: StkTableColumn<T>[];
|
|
118
|
-
/** 单元格合并 */
|
|
119
|
-
mergeCells?: MergeCellsFn<T>;
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
/** private StkTableColumn type. Add some private key */
|
|
123
|
-
export type PrivateStkTableColumn<T extends Record<string, any>> = StkTableColumn<T> & {
|
|
124
|
-
/** header rowSpan */
|
|
125
|
-
__R_SP__?: number;
|
|
126
|
-
/** header colSpan */
|
|
127
|
-
__C_SP__?: number;
|
|
128
|
-
/**
|
|
129
|
-
* parent not ref
|
|
130
|
-
* @private
|
|
131
|
-
*/
|
|
132
|
-
__PARENT__?: StkTableColumn<T> | null;
|
|
133
|
-
/**
|
|
134
|
-
* Save the calculated width. Used for horizontal virtual scrolling.
|
|
135
|
-
* @private
|
|
136
|
-
*/
|
|
137
|
-
__WIDTH__?: number;
|
|
138
|
-
};
|
|
139
|
-
/** private row keys */
|
|
140
|
-
export type PrivateRowDT = {
|
|
141
|
-
/**
|
|
142
|
-
* Only expanded row will add this key
|
|
143
|
-
*
|
|
144
|
-
* If user define the `__ROW_K__` in table data, this value will be used as the row key
|
|
145
|
-
* @private
|
|
146
|
-
*/
|
|
147
|
-
__ROW_K__?: string;
|
|
148
|
-
/**
|
|
149
|
-
* if row expanded
|
|
150
|
-
* @private
|
|
151
|
-
*/
|
|
152
|
-
__EXP__?: StkTableColumn<any>;
|
|
153
|
-
/**
|
|
154
|
-
* if tree node row expanded
|
|
155
|
-
* @private
|
|
156
|
-
*/
|
|
157
|
-
__T_EXP__?: boolean;
|
|
158
|
-
/**
|
|
159
|
-
* tree parent key
|
|
160
|
-
* @private
|
|
161
|
-
*/
|
|
162
|
-
__T_P_K__?: UniqKey;
|
|
163
|
-
/**
|
|
164
|
-
* tree level
|
|
165
|
-
* @private
|
|
166
|
-
*/
|
|
167
|
-
__T_LV__?: number;
|
|
168
|
-
/** expanded row */
|
|
169
|
-
__EXP_R__?: any;
|
|
170
|
-
/** expanded col */
|
|
171
|
-
__EXP_C__?: StkTableColumn<any>;
|
|
172
|
-
children?: any[]
|
|
173
|
-
};
|
|
174
|
-
|
|
175
|
-
export type SortOption<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'sorter' | 'dataIndex' | 'sortField' | 'sortType'>;
|
|
176
|
-
|
|
177
|
-
export type SortState<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'dataIndex' | 'sortField' | 'sortType'> & {
|
|
178
|
-
order: Order;
|
|
179
|
-
};
|
|
180
|
-
|
|
181
|
-
export type UniqKey = string | number;
|
|
182
|
-
export type UniqKeyFun = (param: any) => UniqKey;
|
|
183
|
-
export type UniqKeyProp = UniqKey | UniqKeyFun;
|
|
184
|
-
|
|
185
|
-
export type SortConfig<T extends Record<string, any>> = {
|
|
186
|
-
/**
|
|
187
|
-
* 1. trigger when init
|
|
188
|
-
* 2. trigger when sort direction is null
|
|
189
|
-
*/
|
|
190
|
-
defaultSort?: {
|
|
191
|
-
/**
|
|
192
|
-
* colKey
|
|
193
|
-
*
|
|
194
|
-
* if set `props.colKey`
|
|
195
|
-
*
|
|
196
|
-
* default: StkTableColumn<T>['dataIndex']
|
|
197
|
-
*/
|
|
198
|
-
key?: StkTableColumn<T>['key'];
|
|
199
|
-
dataIndex: StkTableColumn<T>['dataIndex'];
|
|
200
|
-
order: Order;
|
|
201
|
-
sortField?: StkTableColumn<T>['sortField'];
|
|
202
|
-
sortType?: StkTableColumn<T>['sortType'];
|
|
203
|
-
sorter?: StkTableColumn<T>['sorter'];
|
|
204
|
-
/**
|
|
205
|
-
* whether to disable trigger`sort-change` event. default: false
|
|
206
|
-
*/
|
|
207
|
-
silent?: boolean;
|
|
208
|
-
};
|
|
209
|
-
/** empty value always sort to bottom */
|
|
210
|
-
emptyToBottom?: boolean;
|
|
211
|
-
/**
|
|
212
|
-
* string sort if use `String.prototype.localCompare`
|
|
213
|
-
* default: false
|
|
214
|
-
*/
|
|
215
|
-
stringLocaleCompare?: boolean;
|
|
216
|
-
/**
|
|
217
|
-
* whether to sort children when sort current column. default: false
|
|
218
|
-
*/
|
|
219
|
-
sortChildren?: boolean;
|
|
220
|
-
};
|
|
221
|
-
|
|
222
|
-
/** th td type */
|
|
223
|
-
export const enum TagType {
|
|
224
|
-
TH,
|
|
225
|
-
TD,
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
export type HighlightConfig = {
|
|
229
|
-
/** Duration of the highlight in seconds */
|
|
230
|
-
duration?: number;
|
|
231
|
-
/** Frame rate of the highlight */
|
|
232
|
-
fps?: number;
|
|
233
|
-
};
|
|
234
|
-
|
|
235
|
-
/**
|
|
236
|
-
* Configuration options for the sequence column.
|
|
237
|
-
*/
|
|
238
|
-
export type SeqConfig = {
|
|
239
|
-
/** The initial subscript of the sequence number column is used to adapt the paging. */
|
|
240
|
-
startIndex?: number;
|
|
241
|
-
};
|
|
242
|
-
|
|
243
|
-
/** Configuration options for the expand column */
|
|
244
|
-
export type ExpandConfig = {
|
|
245
|
-
/** worked in virtual mode */
|
|
246
|
-
height?: number;
|
|
247
|
-
};
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
/** drag row config */
|
|
251
|
-
export type DragRowConfig = {
|
|
252
|
-
mode?: 'none' | 'insert' | 'swap';
|
|
253
|
-
// disabled?: (row: T, rowIndex: number) => boolean;
|
|
254
|
-
};
|
|
255
|
-
|
|
256
|
-
export type TreeConfig = {
|
|
257
|
-
// childrenField?: string;
|
|
258
|
-
defaultExpandAll?: boolean;
|
|
259
|
-
defaultExpandKeys?: UniqKey[];
|
|
260
|
-
defaultExpandLevel?: number;
|
|
261
|
-
};
|
|
262
|
-
|
|
263
|
-
/** header drag config */
|
|
264
|
-
export type HeaderDragConfig<DT extends Record<string, any> = any> = {
|
|
265
|
-
/**
|
|
266
|
-
* col switch mode
|
|
267
|
-
* - none
|
|
268
|
-
* - insert - (default)
|
|
269
|
-
* - swap
|
|
270
|
-
*/
|
|
271
|
-
mode?: 'none' | 'insert' | 'swap';
|
|
272
|
-
/** disabled drag col */
|
|
273
|
-
disabled?: (col: StkTableColumn<DT>) => boolean;
|
|
274
|
-
};
|
|
275
|
-
|
|
276
|
-
export type AutoRowHeightConfig<DT> = {
|
|
277
|
-
/** Estimated row height */
|
|
278
|
-
expectedHeight?: number | ((row: DT) => number);
|
|
279
|
-
};
|
|
280
|
-
|
|
281
|
-
export type ColResizableConfig<DT extends Record<string, any>> = {
|
|
282
|
-
disabled: (col: StkTableColumn<DT>) => boolean;
|
|
283
|
-
};
|
|
284
|
-
|
|
285
|
-
export type RowKeyGen = (row: any) => UniqKey;
|
|
286
|
-
|
|
287
|
-
export type ColKeyGen = ComputedRef<(col: StkTableColumn<any>) => UniqKey>;
|
|
288
|
-
|
|
289
|
-
export type CellKeyGen = (row: any, col: StkTableColumn<any>) => string;
|
|
290
|
-
|
|
291
|
-
export type RowActiveOption<DT> = {
|
|
292
|
-
enabled?: boolean;
|
|
293
|
-
/** disabled row active */
|
|
294
|
-
disabled?: (row: DT) => boolean;
|
|
295
|
-
/** current row again click can revoke active */
|
|
296
|
-
revokable?: boolean;
|
|
297
|
-
};
|
|
1
|
+
import { Component, ComputedRef, ConcreteComponent } from 'vue';
|
|
2
|
+
|
|
3
|
+
/** 排序方式,asc-正序,desc-倒序,null-默认顺序 */
|
|
4
|
+
export type Order = null | 'asc' | 'desc';
|
|
5
|
+
|
|
6
|
+
type Sorter<T> = boolean | ((data: T[], option: { order: Order; column: any }) => T[]);
|
|
7
|
+
|
|
8
|
+
export type CustomCellProps<T extends Record<string, any>> = {
|
|
9
|
+
row: T;
|
|
10
|
+
col: StkTableColumn<T>;
|
|
11
|
+
/** row[col.dataIndex] 的值 */
|
|
12
|
+
cellValue: any;
|
|
13
|
+
rowIndex: number;
|
|
14
|
+
colIndex: number;
|
|
15
|
+
/**
|
|
16
|
+
* 当前行是否展开
|
|
17
|
+
* - 不展开: null
|
|
18
|
+
* - 展开: 返回column配置
|
|
19
|
+
*/
|
|
20
|
+
expanded?: PrivateRowDT['__EXP__'];
|
|
21
|
+
/** if tree expanded */
|
|
22
|
+
treeExpanded?: PrivateRowDT['__T_EXP__']
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
export type CustomHeaderCellProps<T extends Record<string, any>> = {
|
|
26
|
+
col: StkTableColumn<T>;
|
|
27
|
+
rowIndex: number;
|
|
28
|
+
colIndex: number;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
export type MergeCellsParam<T extends Record<string, any>> = {
|
|
32
|
+
row: T;
|
|
33
|
+
col: StkTableColumn<T>;
|
|
34
|
+
rowIndex: number;
|
|
35
|
+
colIndex: number;
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
export type MergeCellsFn<T extends Record<string, any>> = (data: MergeCellsParam<T>) => { rowspan?: number; colspan?: number } | undefined;
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* 自定义渲染单元格
|
|
42
|
+
*
|
|
43
|
+
* `StkTableColumn.customCell` 类型直接定义 `Component<Props>` 如果 Props 属性为必选,则 通过`defineComponent` 创建的组件必须要定义所有的Prop,否则就不适配。但是在函数式组件中是正常使用的。customCell: (props) => {}。
|
|
44
|
+
*
|
|
45
|
+
* 如果定义 Props 所有属性均为可选时。`defineComponent` 定义的组件仅需实现个别的 Prop 即可。但是函数式组件的入参props就需要额外判断是否存在。这增加了使用成本。
|
|
46
|
+
*
|
|
47
|
+
* 因此这里重新组合了Component类型
|
|
48
|
+
*/
|
|
49
|
+
export type CustomCell<T extends CustomCellProps<U> | CustomHeaderCellProps<U>, U extends Record<string, any>> =
|
|
50
|
+
| ConcreteComponent<T>
|
|
51
|
+
| Exclude<Component<Partial<T>>, ConcreteComponent>
|
|
52
|
+
| string;
|
|
53
|
+
|
|
54
|
+
/** 表格列配置 */
|
|
55
|
+
export type StkTableColumn<T extends Record<string, any>> = {
|
|
56
|
+
/**
|
|
57
|
+
* 列唯一键,(可选),不传则默认取dataIndex 字段作为列唯一键。
|
|
58
|
+
*/
|
|
59
|
+
key?: any;
|
|
60
|
+
/**
|
|
61
|
+
* 列类型
|
|
62
|
+
* - seq 序号列
|
|
63
|
+
* - expand 展开列
|
|
64
|
+
* - dragRow 拖拽列(使用sktTableRef.getTableData 获取改变后的顺序)
|
|
65
|
+
* - tree-node 树节点列,这一列前面有展开收起箭头
|
|
66
|
+
*/
|
|
67
|
+
type?: 'seq' | 'expand' | 'dragRow' | 'tree-node';
|
|
68
|
+
/** 取值id */
|
|
69
|
+
dataIndex: keyof T & string;
|
|
70
|
+
/** 表头文字 */
|
|
71
|
+
title?: string;
|
|
72
|
+
/** 列内容对齐方式 */
|
|
73
|
+
align?: 'right' | 'left' | 'center';
|
|
74
|
+
/** 表头内容对齐方式 */
|
|
75
|
+
headerAlign?: 'right' | 'left' | 'center';
|
|
76
|
+
/** 筛选 */
|
|
77
|
+
sorter?: Sorter<T>;
|
|
78
|
+
/** 列宽。横向虚拟滚动时必须设置。 */
|
|
79
|
+
width?: string | number;
|
|
80
|
+
/** 最小列宽。非x虚拟滚动生效。 */
|
|
81
|
+
minWidth?: string | number;
|
|
82
|
+
/** 最大列宽。非x虚拟滚动生效。 */
|
|
83
|
+
maxWidth?: string | number;
|
|
84
|
+
/**th class */
|
|
85
|
+
headerClassName?: string;
|
|
86
|
+
/** td class */
|
|
87
|
+
className?: string;
|
|
88
|
+
/** 排序字段。default: dataIndex */
|
|
89
|
+
sortField?: keyof T;
|
|
90
|
+
/** 排序方式。按数字/字符串 */
|
|
91
|
+
sortType?: 'number' | 'string';
|
|
92
|
+
/** 配置当前列的排序规则 */
|
|
93
|
+
sortConfig?: Omit<SortConfig<T>, 'defaultSort'>;
|
|
94
|
+
/** 固定列 */
|
|
95
|
+
fixed?: 'left' | 'right' | null;
|
|
96
|
+
/**
|
|
97
|
+
* 自定义 td 渲染内容。
|
|
98
|
+
*
|
|
99
|
+
* 组件prop入参:
|
|
100
|
+
* @param props.row 一行的记录。
|
|
101
|
+
* @param props.col 列配置
|
|
102
|
+
* @param props.cellValue row[col.dataIndex] 的值
|
|
103
|
+
* @param props.rowIndex 行索引
|
|
104
|
+
* @param props.colIndex 列索引
|
|
105
|
+
*/
|
|
106
|
+
customCell?: CustomCell<CustomCellProps<T>, T>;
|
|
107
|
+
/**
|
|
108
|
+
* 自定义 th 渲染内容
|
|
109
|
+
*
|
|
110
|
+
* 组件prop入参:
|
|
111
|
+
* @param props.col 列配置
|
|
112
|
+
* @param props.rowIndex 行索引
|
|
113
|
+
* @param props.colIndex 列索引
|
|
114
|
+
*/
|
|
115
|
+
customHeaderCell?: CustomCell<CustomHeaderCellProps<T>, T>;
|
|
116
|
+
/** 二级表头 */
|
|
117
|
+
children?: StkTableColumn<T>[];
|
|
118
|
+
/** 单元格合并 */
|
|
119
|
+
mergeCells?: MergeCellsFn<T>;
|
|
120
|
+
};
|
|
121
|
+
|
|
122
|
+
/** private StkTableColumn type. Add some private key */
|
|
123
|
+
export type PrivateStkTableColumn<T extends Record<string, any>> = StkTableColumn<T> & {
|
|
124
|
+
/** header rowSpan */
|
|
125
|
+
__R_SP__?: number;
|
|
126
|
+
/** header colSpan */
|
|
127
|
+
__C_SP__?: number;
|
|
128
|
+
/**
|
|
129
|
+
* parent not ref
|
|
130
|
+
* @private
|
|
131
|
+
*/
|
|
132
|
+
__PARENT__?: StkTableColumn<T> | null;
|
|
133
|
+
/**
|
|
134
|
+
* Save the calculated width. Used for horizontal virtual scrolling.
|
|
135
|
+
* @private
|
|
136
|
+
*/
|
|
137
|
+
__WIDTH__?: number;
|
|
138
|
+
};
|
|
139
|
+
/** private row keys */
|
|
140
|
+
export type PrivateRowDT = {
|
|
141
|
+
/**
|
|
142
|
+
* Only expanded row will add this key
|
|
143
|
+
*
|
|
144
|
+
* If user define the `__ROW_K__` in table data, this value will be used as the row key
|
|
145
|
+
* @private
|
|
146
|
+
*/
|
|
147
|
+
__ROW_K__?: string;
|
|
148
|
+
/**
|
|
149
|
+
* if row expanded
|
|
150
|
+
* @private
|
|
151
|
+
*/
|
|
152
|
+
__EXP__?: StkTableColumn<any>;
|
|
153
|
+
/**
|
|
154
|
+
* if tree node row expanded
|
|
155
|
+
* @private
|
|
156
|
+
*/
|
|
157
|
+
__T_EXP__?: boolean;
|
|
158
|
+
/**
|
|
159
|
+
* tree parent key
|
|
160
|
+
* @private
|
|
161
|
+
*/
|
|
162
|
+
__T_P_K__?: UniqKey;
|
|
163
|
+
/**
|
|
164
|
+
* tree level
|
|
165
|
+
* @private
|
|
166
|
+
*/
|
|
167
|
+
__T_LV__?: number;
|
|
168
|
+
/** expanded row */
|
|
169
|
+
__EXP_R__?: any;
|
|
170
|
+
/** expanded col */
|
|
171
|
+
__EXP_C__?: StkTableColumn<any>;
|
|
172
|
+
children?: any[]
|
|
173
|
+
};
|
|
174
|
+
|
|
175
|
+
export type SortOption<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'sorter' | 'dataIndex' | 'sortField' | 'sortType'>;
|
|
176
|
+
|
|
177
|
+
export type SortState<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'dataIndex' | 'sortField' | 'sortType'> & {
|
|
178
|
+
order: Order;
|
|
179
|
+
};
|
|
180
|
+
|
|
181
|
+
export type UniqKey = string | number;
|
|
182
|
+
export type UniqKeyFun = (param: any) => UniqKey;
|
|
183
|
+
export type UniqKeyProp = UniqKey | UniqKeyFun;
|
|
184
|
+
|
|
185
|
+
export type SortConfig<T extends Record<string, any>> = {
|
|
186
|
+
/**
|
|
187
|
+
* 1. trigger when init
|
|
188
|
+
* 2. trigger when sort direction is null
|
|
189
|
+
*/
|
|
190
|
+
defaultSort?: {
|
|
191
|
+
/**
|
|
192
|
+
* colKey
|
|
193
|
+
*
|
|
194
|
+
* if set `props.colKey`
|
|
195
|
+
*
|
|
196
|
+
* default: StkTableColumn<T>['dataIndex']
|
|
197
|
+
*/
|
|
198
|
+
key?: StkTableColumn<T>['key'];
|
|
199
|
+
dataIndex: StkTableColumn<T>['dataIndex'];
|
|
200
|
+
order: Order;
|
|
201
|
+
sortField?: StkTableColumn<T>['sortField'];
|
|
202
|
+
sortType?: StkTableColumn<T>['sortType'];
|
|
203
|
+
sorter?: StkTableColumn<T>['sorter'];
|
|
204
|
+
/**
|
|
205
|
+
* whether to disable trigger`sort-change` event. default: false
|
|
206
|
+
*/
|
|
207
|
+
silent?: boolean;
|
|
208
|
+
};
|
|
209
|
+
/** empty value always sort to bottom */
|
|
210
|
+
emptyToBottom?: boolean;
|
|
211
|
+
/**
|
|
212
|
+
* string sort if use `String.prototype.localCompare`
|
|
213
|
+
* default: false
|
|
214
|
+
*/
|
|
215
|
+
stringLocaleCompare?: boolean;
|
|
216
|
+
/**
|
|
217
|
+
* whether to sort children when sort current column. default: false
|
|
218
|
+
*/
|
|
219
|
+
sortChildren?: boolean;
|
|
220
|
+
};
|
|
221
|
+
|
|
222
|
+
/** th td type */
|
|
223
|
+
export const enum TagType {
|
|
224
|
+
TH,
|
|
225
|
+
TD,
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
export type HighlightConfig = {
|
|
229
|
+
/** Duration of the highlight in seconds */
|
|
230
|
+
duration?: number;
|
|
231
|
+
/** Frame rate of the highlight */
|
|
232
|
+
fps?: number;
|
|
233
|
+
};
|
|
234
|
+
|
|
235
|
+
/**
|
|
236
|
+
* Configuration options for the sequence column.
|
|
237
|
+
*/
|
|
238
|
+
export type SeqConfig = {
|
|
239
|
+
/** The initial subscript of the sequence number column is used to adapt the paging. */
|
|
240
|
+
startIndex?: number;
|
|
241
|
+
};
|
|
242
|
+
|
|
243
|
+
/** Configuration options for the expand column */
|
|
244
|
+
export type ExpandConfig = {
|
|
245
|
+
/** worked in virtual mode */
|
|
246
|
+
height?: number;
|
|
247
|
+
};
|
|
248
|
+
|
|
249
|
+
|
|
250
|
+
/** drag row config */
|
|
251
|
+
export type DragRowConfig = {
|
|
252
|
+
mode?: 'none' | 'insert' | 'swap';
|
|
253
|
+
// disabled?: (row: T, rowIndex: number) => boolean;
|
|
254
|
+
};
|
|
255
|
+
|
|
256
|
+
export type TreeConfig = {
|
|
257
|
+
// childrenField?: string;
|
|
258
|
+
defaultExpandAll?: boolean;
|
|
259
|
+
defaultExpandKeys?: UniqKey[];
|
|
260
|
+
defaultExpandLevel?: number;
|
|
261
|
+
};
|
|
262
|
+
|
|
263
|
+
/** header drag config */
|
|
264
|
+
export type HeaderDragConfig<DT extends Record<string, any> = any> = {
|
|
265
|
+
/**
|
|
266
|
+
* col switch mode
|
|
267
|
+
* - none
|
|
268
|
+
* - insert - (default)
|
|
269
|
+
* - swap
|
|
270
|
+
*/
|
|
271
|
+
mode?: 'none' | 'insert' | 'swap';
|
|
272
|
+
/** disabled drag col */
|
|
273
|
+
disabled?: (col: StkTableColumn<DT>) => boolean;
|
|
274
|
+
};
|
|
275
|
+
|
|
276
|
+
export type AutoRowHeightConfig<DT> = {
|
|
277
|
+
/** Estimated row height */
|
|
278
|
+
expectedHeight?: number | ((row: DT) => number);
|
|
279
|
+
};
|
|
280
|
+
|
|
281
|
+
export type ColResizableConfig<DT extends Record<string, any>> = {
|
|
282
|
+
disabled: (col: StkTableColumn<DT>) => boolean;
|
|
283
|
+
};
|
|
284
|
+
|
|
285
|
+
export type RowKeyGen = (row: any) => UniqKey;
|
|
286
|
+
|
|
287
|
+
export type ColKeyGen = ComputedRef<(col: StkTableColumn<any>) => UniqKey>;
|
|
288
|
+
|
|
289
|
+
export type CellKeyGen = (row: any, col: StkTableColumn<any>) => string;
|
|
290
|
+
|
|
291
|
+
export type RowActiveOption<DT> = {
|
|
292
|
+
enabled?: boolean;
|
|
293
|
+
/** disabled row active */
|
|
294
|
+
disabled?: (row: DT) => boolean;
|
|
295
|
+
/** current row again click can revoke active */
|
|
296
|
+
revokable?: boolean;
|
|
297
|
+
};
|