stk-table-vue 0.6.12 → 0.6.13

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.
@@ -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,239 +1,239 @@
1
- import { Component, 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['__EXPANDED__'];
21
- };
22
-
23
- export type CustomHeaderCellProps<T extends Record<string, any>> = {
24
- col: StkTableColumn<T>;
25
- rowIndex: number;
26
- colIndex: number;
27
- };
28
-
29
- /**
30
- * 自定义渲染单元格
31
- *
32
- * `StkTableColumn.customCell` 类型直接定义 `Component<Props>` 如果 Props 属性为必选,则 通过`defineComponent` 创建的组件必须要定义所有的Prop,否则就不适配。但是在函数式组件中是正常使用的。customCell: (props) => {}。
33
- *
34
- * 如果定义 Props 所有属性均为可选时。`defineComponent` 定义的组件仅需实现个别的 Prop 即可。但是函数式组件的入参props就需要额外判断是否存在。这增加了使用成本。
35
- *
36
- * 因此这里重新组合了Component类型
37
- */
38
- export type CustomCell<T extends CustomCellProps<U> | CustomHeaderCellProps<U>, U extends Record<string, any>> =
39
- | ConcreteComponent<T>
40
- | Exclude<Component<Partial<T>>, ConcreteComponent>
41
- | string;
42
-
43
- /** 表格列配置 */
44
- export type StkTableColumn<T extends Record<string, any>> = {
45
- /**
46
- * 用于区分相同dataIndex 的列。
47
- */
48
- key?: any;
49
- /**
50
- * 列类型
51
- * - seq 序号列
52
- * - expand 展开列
53
- * - dragRow 拖拽列(使用sktTableRef.getTableData 获取改变后的顺序)
54
- */
55
- type?: 'seq' | 'expand' | 'dragRow';
56
- /** 取值id */
57
- dataIndex: keyof T & string;
58
- /** 表头文字 */
59
- title?: string;
60
- /** 列内容对齐方式 */
61
- align?: 'right' | 'left' | 'center';
62
- /** 表头内容对齐方式 */
63
- headerAlign?: 'right' | 'left' | 'center';
64
- /** 筛选 */
65
- sorter?: Sorter<T>;
66
- /** 列宽。横向虚拟滚动时必须设置。 */
67
- width?: string | number;
68
- /** 最小列宽。非x虚拟滚动生效。 */
69
- minWidth?: string | number;
70
- /** 最大列宽。非x虚拟滚动生效。 */
71
- maxWidth?: string | number;
72
- /**th class */
73
- headerClassName?: string;
74
- /** td class */
75
- className?: string;
76
- /** 排序字段。default: dataIndex */
77
- sortField?: keyof T;
78
- /** 排序方式。按数字/字符串 */
79
- sortType?: 'number' | 'string';
80
- /** 配置当前列的排序规则 */
81
- sortConfig?: Pick<SortConfig<T>, 'emptyToBottom' | 'stringLocaleCompare'>;
82
- /** 固定列 */
83
- fixed?: 'left' | 'right' | null;
84
- /** private */ rowSpan?: number;
85
- /** private */ colSpan?: number;
86
- /**
87
- * 自定义 td 渲染内容。
88
- *
89
- * 组件prop入参:
90
- * @param props.row 一行的记录。
91
- * @param props.col 列配置
92
- * @param props.cellValue row[col.dataIndex] 的值
93
- * @param props.rowIndex 行索引
94
- * @param props.colIndex 列索引
95
- */
96
- customCell?: CustomCell<CustomCellProps<T>, T>;
97
- /**
98
- * 自定义 th 渲染内容
99
- *
100
- * 组件prop入参:
101
- * @param props.col 列配置
102
- * @param props.rowIndex 行索引
103
- * @param props.colIndex 列索引
104
- */
105
- customHeaderCell?: CustomCell<CustomHeaderCellProps<T>, T>;
106
- /** 二级表头 */
107
- children?: StkTableColumn<T>[];
108
- };
109
-
110
- /** private StkTableColumn type. Add some private key */
111
- export type PrivateStkTableColumn<T extends Record<string, any>> = StkTableColumn<T> & {
112
- /**
113
- * 父节点引用
114
- * @private
115
- */
116
- __PARENT__?: StkTableColumn<T> | null;
117
- /**
118
- * 保存计算的宽度。横向虚拟滚动用。
119
- * @private
120
- */
121
- __WIDTH__?: number;
122
- };
123
- /** private row keys */
124
- export type PrivateRowDT = {
125
- /**
126
- * Only expanded row will add this key
127
- *
128
- * If user define the `__ROW_KEY__` in table data, this value will be used as the row key
129
- * @private
130
- */
131
- __ROW_KEY__: string;
132
- /**
133
- * if row expanded
134
- * @private
135
- */
136
- __EXPANDED__?: StkTableColumn<any> | null;
137
- };
138
-
139
- export type SortOption<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'sorter' | 'dataIndex' | 'sortField' | 'sortType'>;
140
-
141
- export type SortState<T> = {
142
- dataIndex: keyof T;
143
- order: Order;
144
- sortType?: 'number' | 'string';
145
- };
146
-
147
- export type UniqKey = string | number;
148
- export type UniqKeyFun = (param: any) => UniqKey;
149
- export type UniqKeyProp = UniqKey | UniqKeyFun;
150
-
151
- export type SortConfig<T extends Record<string, any>> = {
152
- /** 空值始终排在列表末尾 */
153
- emptyToBottom?: boolean;
154
- /**
155
- * 默认排序(1.初始化时触发 2.排序方向为null时触发)
156
- * 类似onMounted时,调用setSorter点了下表头。
157
- */
158
- defaultSort?: {
159
- /**
160
- * 列唯一键,
161
- *
162
- * 如果您配了 `props.colKey` 则这里表示的列唯一键的值
163
- */
164
- key?: StkTableColumn<T>['key'];
165
- dataIndex: StkTableColumn<T>['dataIndex'];
166
- order: Order;
167
- sortField?: StkTableColumn<T>['sortField'];
168
- sortType?: StkTableColumn<T>['sortType'];
169
- sorter?: StkTableColumn<T>['sorter'];
170
- /** 是否禁止触发sort-change事件。默认false,表示触发事件。 */
171
- silent?: boolean;
172
- };
173
- /**
174
- * string sort if use `String.prototype.localCompare`
175
- * default: false
176
- */
177
- stringLocaleCompare?: boolean;
178
- };
179
-
180
- /** th td type */
181
- export const enum TagType {
182
- TH,
183
- TD,
184
- }
185
-
186
- export type HighlightConfig = {
187
- /** Duration of the highlight in seconds */
188
- duration?: number;
189
- /** Frame rate of the highlight */
190
- fps?: number;
191
- };
192
-
193
- /**
194
- * Configuration options for the sequence column.
195
- */
196
- export type SeqConfig = {
197
- /** The initial subscript of the sequence number column is used to adapt the paging. */
198
- startIndex?: number;
199
- };
200
-
201
- /** Configuration options for the expand column */
202
- export type ExpandConfig = {
203
- /** worked in virtual mode */
204
- height?: number;
205
- };
206
-
207
- export type ExpandedRow = PrivateRowDT & {
208
- __EXPANDED_ROW__: any;
209
- __EXPANDED_COL__: any;
210
- };
211
-
212
- /** drag row config */
213
- export type DragRowConfig = {
214
- mode?: 'none' | 'insert' | 'swap';
215
- // disabled?: (row: T, rowIndex: number) => boolean;
216
- };
217
- /** header drag config */
218
- export type HeaderDragConfig<DT extends Record<string, any> = any> =
219
- | boolean
220
- | {
221
- /**
222
- * 列交换模式
223
- * - none - 不做任何事
224
- * - insert - 插入(默认值)
225
- * - swap - 交换
226
- */
227
- mode?: 'none' | 'insert' | 'swap';
228
- /** 禁用拖动的列 */
229
- disabled?: (col: StkTableColumn<DT>) => boolean;
230
- };
231
-
232
- export type AutoRowHeightConfig<DT> = {
233
- /** Estimated row height */
234
- expectedHeight?: number | ((row: DT, index: number) => number);
235
- };
236
-
237
- export type ColResizableConfig<DT extends Record<string, any>> = {
238
- disabled: (col: StkTableColumn<DT>) => boolean;
239
- };
1
+ import { Component, 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['__EXPANDED__'];
21
+ };
22
+
23
+ export type CustomHeaderCellProps<T extends Record<string, any>> = {
24
+ col: StkTableColumn<T>;
25
+ rowIndex: number;
26
+ colIndex: number;
27
+ };
28
+
29
+ /**
30
+ * 自定义渲染单元格
31
+ *
32
+ * `StkTableColumn.customCell` 类型直接定义 `Component<Props>` 如果 Props 属性为必选,则 通过`defineComponent` 创建的组件必须要定义所有的Prop,否则就不适配。但是在函数式组件中是正常使用的。customCell: (props) => {}。
33
+ *
34
+ * 如果定义 Props 所有属性均为可选时。`defineComponent` 定义的组件仅需实现个别的 Prop 即可。但是函数式组件的入参props就需要额外判断是否存在。这增加了使用成本。
35
+ *
36
+ * 因此这里重新组合了Component类型
37
+ */
38
+ export type CustomCell<T extends CustomCellProps<U> | CustomHeaderCellProps<U>, U extends Record<string, any>> =
39
+ | ConcreteComponent<T>
40
+ | Exclude<Component<Partial<T>>, ConcreteComponent>
41
+ | string;
42
+
43
+ /** 表格列配置 */
44
+ export type StkTableColumn<T extends Record<string, any>> = {
45
+ /**
46
+ * 用于区分相同dataIndex 的列。
47
+ */
48
+ key?: any;
49
+ /**
50
+ * 列类型
51
+ * - seq 序号列
52
+ * - expand 展开列
53
+ * - dragRow 拖拽列(使用sktTableRef.getTableData 获取改变后的顺序)
54
+ */
55
+ type?: 'seq' | 'expand' | 'dragRow';
56
+ /** 取值id */
57
+ dataIndex: keyof T & string;
58
+ /** 表头文字 */
59
+ title?: string;
60
+ /** 列内容对齐方式 */
61
+ align?: 'right' | 'left' | 'center';
62
+ /** 表头内容对齐方式 */
63
+ headerAlign?: 'right' | 'left' | 'center';
64
+ /** 筛选 */
65
+ sorter?: Sorter<T>;
66
+ /** 列宽。横向虚拟滚动时必须设置。 */
67
+ width?: string | number;
68
+ /** 最小列宽。非x虚拟滚动生效。 */
69
+ minWidth?: string | number;
70
+ /** 最大列宽。非x虚拟滚动生效。 */
71
+ maxWidth?: string | number;
72
+ /**th class */
73
+ headerClassName?: string;
74
+ /** td class */
75
+ className?: string;
76
+ /** 排序字段。default: dataIndex */
77
+ sortField?: keyof T;
78
+ /** 排序方式。按数字/字符串 */
79
+ sortType?: 'number' | 'string';
80
+ /** 配置当前列的排序规则 */
81
+ sortConfig?: Pick<SortConfig<T>, 'emptyToBottom' | 'stringLocaleCompare'>;
82
+ /** 固定列 */
83
+ fixed?: 'left' | 'right' | null;
84
+ /** private */ rowSpan?: number;
85
+ /** private */ colSpan?: number;
86
+ /**
87
+ * 自定义 td 渲染内容。
88
+ *
89
+ * 组件prop入参:
90
+ * @param props.row 一行的记录。
91
+ * @param props.col 列配置
92
+ * @param props.cellValue row[col.dataIndex] 的值
93
+ * @param props.rowIndex 行索引
94
+ * @param props.colIndex 列索引
95
+ */
96
+ customCell?: CustomCell<CustomCellProps<T>, T>;
97
+ /**
98
+ * 自定义 th 渲染内容
99
+ *
100
+ * 组件prop入参:
101
+ * @param props.col 列配置
102
+ * @param props.rowIndex 行索引
103
+ * @param props.colIndex 列索引
104
+ */
105
+ customHeaderCell?: CustomCell<CustomHeaderCellProps<T>, T>;
106
+ /** 二级表头 */
107
+ children?: StkTableColumn<T>[];
108
+ };
109
+
110
+ /** private StkTableColumn type. Add some private key */
111
+ export type PrivateStkTableColumn<T extends Record<string, any>> = StkTableColumn<T> & {
112
+ /**
113
+ * 父节点引用
114
+ * @private
115
+ */
116
+ __PARENT__?: StkTableColumn<T> | null;
117
+ /**
118
+ * 保存计算的宽度。横向虚拟滚动用。
119
+ * @private
120
+ */
121
+ __WIDTH__?: number;
122
+ };
123
+ /** private row keys */
124
+ export type PrivateRowDT = {
125
+ /**
126
+ * Only expanded row will add this key
127
+ *
128
+ * If user define the `__ROW_KEY__` in table data, this value will be used as the row key
129
+ * @private
130
+ */
131
+ __ROW_KEY__: string;
132
+ /**
133
+ * if row expanded
134
+ * @private
135
+ */
136
+ __EXPANDED__?: StkTableColumn<any> | null;
137
+ };
138
+
139
+ export type SortOption<T extends Record<string, any>> = Pick<StkTableColumn<T>, 'sorter' | 'dataIndex' | 'sortField' | 'sortType'>;
140
+
141
+ export type SortState<T> = {
142
+ dataIndex: keyof T;
143
+ order: Order;
144
+ sortType?: 'number' | 'string';
145
+ };
146
+
147
+ export type UniqKey = string | number;
148
+ export type UniqKeyFun = (param: any) => UniqKey;
149
+ export type UniqKeyProp = UniqKey | UniqKeyFun;
150
+
151
+ export type SortConfig<T extends Record<string, any>> = {
152
+ /** 空值始终排在列表末尾 */
153
+ emptyToBottom?: boolean;
154
+ /**
155
+ * 默认排序(1.初始化时触发 2.排序方向为null时触发)
156
+ * 类似onMounted时,调用setSorter点了下表头。
157
+ */
158
+ defaultSort?: {
159
+ /**
160
+ * 列唯一键,
161
+ *
162
+ * 如果您配了 `props.colKey` 则这里表示的列唯一键的值
163
+ */
164
+ key?: StkTableColumn<T>['key'];
165
+ dataIndex: StkTableColumn<T>['dataIndex'];
166
+ order: Order;
167
+ sortField?: StkTableColumn<T>['sortField'];
168
+ sortType?: StkTableColumn<T>['sortType'];
169
+ sorter?: StkTableColumn<T>['sorter'];
170
+ /** 是否禁止触发sort-change事件。默认false,表示触发事件。 */
171
+ silent?: boolean;
172
+ };
173
+ /**
174
+ * string sort if use `String.prototype.localCompare`
175
+ * default: false
176
+ */
177
+ stringLocaleCompare?: boolean;
178
+ };
179
+
180
+ /** th td type */
181
+ export const enum TagType {
182
+ TH,
183
+ TD,
184
+ }
185
+
186
+ export type HighlightConfig = {
187
+ /** Duration of the highlight in seconds */
188
+ duration?: number;
189
+ /** Frame rate of the highlight */
190
+ fps?: number;
191
+ };
192
+
193
+ /**
194
+ * Configuration options for the sequence column.
195
+ */
196
+ export type SeqConfig = {
197
+ /** The initial subscript of the sequence number column is used to adapt the paging. */
198
+ startIndex?: number;
199
+ };
200
+
201
+ /** Configuration options for the expand column */
202
+ export type ExpandConfig = {
203
+ /** worked in virtual mode */
204
+ height?: number;
205
+ };
206
+
207
+ export type ExpandedRow = PrivateRowDT & {
208
+ __EXPANDED_ROW__: any;
209
+ __EXPANDED_COL__: any;
210
+ };
211
+
212
+ /** drag row config */
213
+ export type DragRowConfig = {
214
+ mode?: 'none' | 'insert' | 'swap';
215
+ // disabled?: (row: T, rowIndex: number) => boolean;
216
+ };
217
+ /** header drag config */
218
+ export type HeaderDragConfig<DT extends Record<string, any> = any> =
219
+ | boolean
220
+ | {
221
+ /**
222
+ * 列交换模式
223
+ * - none - 不做任何事
224
+ * - insert - 插入(默认值)
225
+ * - swap - 交换
226
+ */
227
+ mode?: 'none' | 'insert' | 'swap';
228
+ /** 禁用拖动的列 */
229
+ disabled?: (col: StkTableColumn<DT>) => boolean;
230
+ };
231
+
232
+ export type AutoRowHeightConfig<DT> = {
233
+ /** Estimated row height */
234
+ expectedHeight?: number | ((row: DT, index: number) => number);
235
+ };
236
+
237
+ export type ColResizableConfig<DT extends Record<string, any>> = {
238
+ disabled: (col: StkTableColumn<DT>) => boolean;
239
+ };