vxe-table 4.18.6 → 4.18.8

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 (148) hide show
  1. package/LICENSE +20 -20
  2. package/README.en.md +118 -118
  3. package/README.ja-JP.md +117 -117
  4. package/README.md +268 -268
  5. package/README.zh-TW.md +117 -117
  6. package/es/style.css +1 -1
  7. package/es/table/src/table.js +89 -79
  8. package/es/table/src/util.js +6 -0
  9. package/es/table/style.css +18 -48
  10. package/es/ui/index.js +1 -1
  11. package/es/ui/src/dom.js +21 -0
  12. package/es/ui/src/log.js +1 -1
  13. package/es/vxe-table/style.css +18 -48
  14. package/lib/index.common.js +2 -1
  15. package/lib/index.umd.js +2762 -2833
  16. package/lib/index.umd.min.js +1 -1
  17. package/lib/style.css +1 -1
  18. package/lib/table/src/table.js +15 -12
  19. package/lib/table/src/table.min.js +1 -1
  20. package/lib/table/src/util.js +6 -0
  21. package/lib/table/src/util.min.js +1 -1
  22. package/lib/table/style/style.css +18 -48
  23. package/lib/ui/index.js +1 -1
  24. package/lib/ui/index.min.js +1 -1
  25. package/lib/ui/src/dom.js +23 -0
  26. package/lib/ui/src/dom.min.js +1 -1
  27. package/lib/ui/src/log.js +1 -1
  28. package/lib/ui/src/log.min.js +1 -1
  29. package/lib/v-x-e-table/index.js +2 -1
  30. package/lib/v-x-e-table/index.min.js +1 -1
  31. package/lib/vxe-colgroup/index.js +2 -1
  32. package/lib/vxe-colgroup/index.min.js +1 -1
  33. package/lib/vxe-column/index.js +2 -1
  34. package/lib/vxe-column/index.min.js +1 -1
  35. package/lib/vxe-grid/index.js +2 -1
  36. package/lib/vxe-grid/index.min.js +1 -1
  37. package/lib/vxe-table/index.js +2 -1
  38. package/lib/vxe-table/index.min.js +1 -1
  39. package/lib/vxe-table/style/style.css +18 -48
  40. package/lib/vxe-toolbar/index.js +2 -1
  41. package/lib/vxe-toolbar/index.min.js +1 -1
  42. package/lib/vxe-ui/index.js +2 -1
  43. package/lib/vxe-ui/index.min.js +1 -1
  44. package/lib/vxe-v-x-e-table/index.js +2 -1
  45. package/lib/vxe-v-x-e-table/index.min.js +1 -1
  46. package/package.json +91 -91
  47. package/packages/colgroup/index.ts +22 -22
  48. package/packages/column/index.ts +22 -22
  49. package/packages/components.ts +43 -43
  50. package/packages/grid/index.ts +18 -18
  51. package/packages/grid/src/emits.ts +19 -19
  52. package/packages/grid/src/grid.ts +1768 -1768
  53. package/packages/grid/src/props.ts +23 -23
  54. package/packages/index.ts +4 -4
  55. package/packages/locale/lang/ar-EG.ts +832 -832
  56. package/packages/locale/lang/de-DE.ts +832 -832
  57. package/packages/locale/lang/en-US.ts +832 -832
  58. package/packages/locale/lang/es-ES.ts +832 -832
  59. package/packages/locale/lang/fr-FR.ts +832 -832
  60. package/packages/locale/lang/hu-HU.ts +832 -832
  61. package/packages/locale/lang/hy-AM.ts +832 -832
  62. package/packages/locale/lang/id-ID.ts +832 -832
  63. package/packages/locale/lang/it-IT.ts +832 -832
  64. package/packages/locale/lang/ja-JP.ts +832 -832
  65. package/packages/locale/lang/ko-KR.ts +832 -832
  66. package/packages/locale/lang/ms-MY.ts +832 -832
  67. package/packages/locale/lang/nb-NO.ts +832 -832
  68. package/packages/locale/lang/pt-BR.ts +832 -832
  69. package/packages/locale/lang/ru-RU.ts +832 -832
  70. package/packages/locale/lang/th-TH.ts +832 -832
  71. package/packages/locale/lang/ug-CN.ts +832 -832
  72. package/packages/locale/lang/uk-UA.ts +832 -832
  73. package/packages/locale/lang/uz-UZ.ts +832 -832
  74. package/packages/locale/lang/vi-VN.ts +832 -832
  75. package/packages/locale/lang/zh-CHT.ts +832 -832
  76. package/packages/locale/lang/zh-CN.ts +832 -832
  77. package/packages/locale/lang/zh-HK.ts +3 -3
  78. package/packages/locale/lang/zh-MO.ts +3 -3
  79. package/packages/locale/lang/zh-TC.ts +3 -3
  80. package/packages/locale/lang/zh-TW.ts +3 -3
  81. package/packages/table/index.ts +26 -26
  82. package/packages/table/module/custom/hook.ts +359 -359
  83. package/packages/table/module/custom/panel.ts +1331 -1331
  84. package/packages/table/module/edit/hook.ts +1032 -1032
  85. package/packages/table/module/export/export-panel.ts +567 -567
  86. package/packages/table/module/export/hook.ts +1654 -1654
  87. package/packages/table/module/export/import-panel.ts +266 -266
  88. package/packages/table/module/export/util.ts +24 -24
  89. package/packages/table/module/filter/hook.ts +468 -468
  90. package/packages/table/module/filter/panel.ts +301 -301
  91. package/packages/table/module/keyboard/hook.ts +495 -495
  92. package/packages/table/module/menu/hook.ts +325 -325
  93. package/packages/table/module/menu/panel.ts +201 -201
  94. package/packages/table/module/validator/hook.ts +631 -631
  95. package/packages/table/render/index.ts +1440 -1440
  96. package/packages/table/src/body.ts +932 -932
  97. package/packages/table/src/cell.ts +1290 -1290
  98. package/packages/table/src/column.ts +190 -190
  99. package/packages/table/src/columnInfo.ts +225 -225
  100. package/packages/table/src/emits.ts +123 -123
  101. package/packages/table/src/footer.ts +368 -368
  102. package/packages/table/src/group.ts +59 -59
  103. package/packages/table/src/header.ts +559 -559
  104. package/packages/table/src/props.ts +324 -324
  105. package/packages/table/src/store.ts +14 -14
  106. package/packages/table/src/table.ts +14010 -14001
  107. package/packages/table/src/use/cell-view.ts +44 -44
  108. package/packages/table/src/use/index.ts +1 -1
  109. package/packages/table/src/util.ts +1070 -1064
  110. package/packages/toolbar/index.ts +18 -18
  111. package/packages/toolbar/src/toolbar.ts +701 -701
  112. package/packages/ui/index.ts +530 -530
  113. package/packages/ui/src/anime.ts +52 -52
  114. package/packages/ui/src/comp.ts +3 -3
  115. package/packages/ui/src/dom.ts +259 -236
  116. package/packages/ui/src/log.ts +8 -8
  117. package/packages/ui/src/utils.ts +56 -56
  118. package/packages/ui/src/vn.ts +55 -55
  119. package/packages/v-x-e-table/index.d.ts +4 -4
  120. package/packages/v-x-e-table/index.ts +4 -4
  121. package/styles/all.scss +7 -7
  122. package/styles/base.scss +16 -16
  123. package/styles/components/grid.scss +89 -89
  124. package/styles/components/icon.scss +225 -225
  125. package/styles/components/old-icon.scss +715 -715
  126. package/styles/components/table-module/all.scss +6 -6
  127. package/styles/components/table-module/custom.scss +527 -527
  128. package/styles/components/table-module/export.scss +130 -130
  129. package/styles/components/table-module/filter.scss +130 -130
  130. package/styles/components/table-module/menu.scss +81 -81
  131. package/styles/components/table.scss +2679 -2679
  132. package/styles/components/toolbar.scss +119 -119
  133. package/styles/default.scss +2 -2
  134. package/styles/helpers/baseMixin.scss +95 -95
  135. package/styles/index.scss +4 -4
  136. package/styles/modules.scss +5 -5
  137. package/styles/theme/base.scss +93 -93
  138. package/styles/theme/dark.scss +49 -49
  139. package/styles/theme/light.scss +44 -44
  140. package/styles/variable.scss +43 -43
  141. package/types/all.d.ts +37 -37
  142. package/types/index.d.ts +4 -4
  143. /package/es/{iconfont.1773972993993.ttf → iconfont.1774240404046.ttf} +0 -0
  144. /package/es/{iconfont.1773972993993.woff → iconfont.1774240404046.woff} +0 -0
  145. /package/es/{iconfont.1773972993993.woff2 → iconfont.1774240404046.woff2} +0 -0
  146. /package/lib/{iconfont.1773972993993.ttf → iconfont.1774240404046.ttf} +0 -0
  147. /package/lib/{iconfont.1773972993993.woff → iconfont.1774240404046.woff} +0 -0
  148. /package/lib/{iconfont.1773972993993.woff2 → iconfont.1774240404046.woff2} +0 -0
@@ -1,1064 +1,1070 @@
1
- import { watch, reactive } from 'vue'
2
- import XEUtils from 'xe-utils'
3
- import { ColumnInfo } from './columnInfo'
4
- import { isPx, isScale, queryElement } from '../../ui/src/dom'
5
- import { eqEmptyValue } from '../../ui/src/utils'
6
-
7
- import type { VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines, VxeTablePropTypes, TableReactData, TableInternalData } from '../../../types'
8
-
9
- export function createInternalData (): TableInternalData {
10
- return {
11
- tZindex: 0,
12
- currKeyField: '',
13
- isCurrDeepKey: false,
14
- elemStore: {},
15
- // 存放横向 X 虚拟滚动相关的信息
16
- scrollXStore: {
17
- preloadSize: 0,
18
- offsetSize: 0,
19
- visibleSize: 0,
20
- visibleStartIndex: 0,
21
- visibleEndIndex: 0,
22
- startIndex: 0,
23
- endIndex: 0
24
- },
25
- // 存放纵向 Y 虚拟滚动相关信息
26
- scrollYStore: {
27
- preloadSize: 0,
28
- offsetSize: 0,
29
- visibleSize: 0,
30
- visibleStartIndex: 0,
31
- visibleEndIndex: 0,
32
- startIndex: 0,
33
- endIndex: 0
34
- },
35
- // 表格宽度
36
- tableWidth: 0,
37
- // 表格高度
38
- tableHeight: 0,
39
- customHeight: 0,
40
- customMinHeight: 0,
41
- customMaxHeight: 0,
42
- // 当前 hover 行
43
- hoverRow: null,
44
- // 最后滚动位置
45
- lastScrollLeft: 0,
46
- lastScrollTop: 0,
47
- // 单选框属性,已选中保留的行
48
- radioReserveRow: null,
49
- // 复选框属性,已选中保留的行集合
50
- checkboxReserveRowMap: {},
51
- // 行数据,已展开保留的行集合
52
- rowExpandedReserveRowMap: {},
53
- // 树结构数据,已展开保留的行集合
54
- treeExpandedReserveRowMap: {},
55
- // 树结构数据,不确定状态的集合
56
- treeIndeterminateRowMaps: {},
57
- // 列表完整数据、条件处理后
58
- tableFullData: [],
59
- afterFullData: [],
60
- afterTreeFullData: [],
61
- afterGroupFullData: [],
62
- // 列表条件处理后数据集合
63
- afterFullRowMaps: {},
64
- // 树结构完整数据、条件处理后
65
- tableFullTreeData: [],
66
- // 行分组全量数据、条件处理后
67
- tableFullGroupData: [],
68
- tableSynchData: [],
69
- tableSourceData: [],
70
- // 收集的列配置(带分组)
71
- collectColumn: [],
72
- // 完整所有列(不带分组)
73
- tableFullColumn: [],
74
- // 渲染所有列
75
- visibleColumn: [],
76
-
77
- // 全量数据集(包括当前和已删除)
78
- fullAllDataRowIdData: {},
79
- // 数据集(仅当前)
80
- fullDataRowIdData: {},
81
- // 数据集(仅可视)
82
- visibleDataRowIdData: {},
83
-
84
- keepUpdateFieldMaps: {},
85
-
86
- footerFullDataRowData: {},
87
-
88
- // 渲染中缓存数据
89
- sourceDataRowIdData: {},
90
- fullColumnIdData: {},
91
- fullColumnFieldData: {},
92
-
93
- // 合并表头单元格的数据
94
- mergeHeaderList: [],
95
- mergeHeaderMaps: {},
96
- // 已合并单元格数据集合
97
- mergeHeaderCellMaps: {},
98
- // 合并单元格的数据
99
- mergeBodyList: [],
100
- mergeBodyMaps: {},
101
- // 已合并单元格数据集合
102
- mergeBodyCellMaps: {},
103
- // 合并表尾的数据
104
- mergeFooterList: [],
105
- mergeFooterMaps: {},
106
- // 已合并表尾数据集合
107
- mergeFooterCellMaps: {},
108
-
109
- // 已展开的行集合
110
- rowExpandedMaps: {},
111
- // 懒加载中的展开行的集合
112
- rowExpandLazyLoadedMaps: {},
113
- // 已展开的分组行
114
- rowGroupExpandedMaps: {},
115
- // 已展开树节点集合
116
- treeExpandedMaps: {},
117
- // 懒加载中的树节点的集合
118
- treeExpandLazyLoadedMaps: {},
119
- // 复选框属性,已选中的行集合
120
- selectCheckboxMaps: {},
121
- // 已标记的对象集
122
- pendingRowMaps: {},
123
- // 已新增的临时行
124
- insertRowMaps: {},
125
- // 已删除行
126
- removeRowMaps: {},
127
-
128
- cvCacheMaps: {},
129
-
130
- // 表头高度
131
- tHeaderHeight: 0,
132
- // 表体高度
133
- tBodyHeight: 0,
134
- // 表尾高度
135
- tFooterHeight: 0,
136
-
137
- teleportToWrapperElem: null,
138
- popupToWrapperElem: null,
139
-
140
- lastSTime: 0,
141
-
142
- inited: false,
143
- tooltipTimeout: null,
144
- initStatus: false,
145
- isActivated: false
146
-
147
- // _sToTime: null
148
- }
149
- }
150
-
151
- export function createReactData (): TableReactData {
152
- return {
153
- updateColFlag: 0,
154
- // 低性能的静态列
155
- staticColumns: [],
156
- // 渲染的列分组
157
- tableGroupColumn: [],
158
- // 可视区渲染的列
159
- tableColumn: [],
160
- // 渲染中的数据
161
- tableData: [],
162
- // 是否启用了横向 X 可视渲染方式加载
163
- scrollXLoad: false,
164
- // 是否启用了纵向 Y 可视渲染方式加载
165
- scrollYLoad: false,
166
- // 是否存在纵向滚动条
167
- overflowY: true,
168
- // 是否存在横向滚动条
169
- overflowX: false,
170
- // 纵向滚动条的宽度
171
- scrollbarWidth: 0,
172
- // 横向滚动条的高度
173
- scrollbarHeight: 0,
174
- // 行高
175
- rowHeight: 0,
176
- // 表格父容器的高度
177
- parentHeight: 0,
178
- // 是否使用分组表头
179
- isGroup: false,
180
- isAllOverflow: false,
181
- // 复选框属性,是否全选
182
- isAllSelected: false,
183
- // 复选框属性,有选中且非全选状态
184
- isIndeterminate: false,
185
- // 当前行
186
- currentRow: null,
187
- // 单选框属性,选中列
188
- currentColumn: null,
189
- // 单选框属性,选中行
190
- selectRadioRow: null,
191
- // 表尾合计数据
192
- footerTableData: [],
193
- // 行分组列信息
194
- rowGroupColumn: null,
195
- // 展开列信息
196
- expandColumn: null,
197
- checkboxColumn: null,
198
- radioColumn: null,
199
- // 树节点列信息
200
- treeNodeColumn: null,
201
- hasFixedColumn: false,
202
- // 刷新列标识,当列筛选被改变时,触发表格刷新数据
203
- upDataFlag: 0,
204
- // 刷新列标识,当列的特定属性被改变时,触发表格刷新列
205
- reColumnFlag: 0,
206
- // 初始化标识
207
- initStore: {
208
- filter: false,
209
- import: false,
210
- export: false,
211
- custom: false
212
- },
213
- // 自定义列相关的信息
214
- customStore: {
215
- btnEl: null,
216
- isAll: false,
217
- isIndeterminate: false,
218
- activeBtn: false,
219
- activeWrapper: false,
220
- visible: false,
221
- maxHeight: null,
222
- popupTop: 0,
223
- oldSortMaps: {},
224
- oldFixedMaps: {},
225
- oldVisibleMaps: {}
226
- },
227
- customColumnList: [],
228
- // 当前选中的筛选列
229
- filterStore: {
230
- isAllSelected: false,
231
- isIndeterminate: false,
232
- style: null,
233
- column: null,
234
- visible: false,
235
- maxHeight: null
236
- },
237
- // 存放列相关的信息
238
- columnStore: {
239
- leftList: [],
240
- centerList: [],
241
- rightList: [],
242
- resizeList: [],
243
- pxList: [],
244
- pxMinList: [],
245
- autoMinList: [],
246
- scaleList: [],
247
- scaleMinList: [],
248
- autoList: [],
249
- remainList: []
250
- },
251
- // 存放快捷菜单的信息
252
- ctxMenuStore: {
253
- selected: null,
254
- visible: false,
255
- showChild: false,
256
- selectChild: null,
257
- list: [],
258
- style: null
259
- },
260
- // 存放可编辑相关信息
261
- editStore: {
262
- indexs: {
263
- columns: []
264
- },
265
- titles: {
266
- columns: []
267
- },
268
- // 选中源
269
- selected: {
270
- row: null,
271
- column: null
272
- },
273
- // 已复制源
274
- copyed: {
275
- cut: false,
276
- rows: [],
277
- columns: []
278
- },
279
- // 激活
280
- actived: {
281
- row: null,
282
- column: null
283
- },
284
- // 当前被强制聚焦单元格,只会在鼠标点击后算聚焦
285
- focused: {
286
- row: null,
287
- column: null
288
- }
289
- },
290
- // 存放 tooltip 相关信息
291
- tooltipStore: {
292
- row: null,
293
- column: null,
294
- content: null,
295
- visible: false,
296
- type: null,
297
- currOpts: {}
298
- },
299
- // 存放数据校验相关信息
300
- validStore: {
301
- visible: false
302
- },
303
- validErrorMaps: {},
304
- // 导入相关信息
305
- importStore: {
306
- inited: false,
307
- file: null,
308
- type: '',
309
- modeList: [],
310
- typeList: [],
311
- filename: '',
312
- visible: false
313
- },
314
- importParams: {
315
- mode: '',
316
- types: null,
317
- message: true
318
- },
319
- // 导出相关信息
320
- exportStore: {
321
- inited: false,
322
- name: '',
323
- modeList: [],
324
- typeList: [],
325
- columns: [],
326
- isPrint: false,
327
- hasFooter: false,
328
- hasMerge: false,
329
- hasTree: false,
330
- hasColgroup: false,
331
- visible: false
332
- },
333
- exportParams: {
334
- filename: '',
335
- sheetName: '',
336
- mode: '',
337
- type: '',
338
- isColgroup: false,
339
- isMerge: false,
340
- isAllExpand: false,
341
- useStyle: false,
342
- original: false,
343
- message: true,
344
- isHeader: false,
345
- isTitle: false,
346
- isFooter: false
347
- },
348
-
349
- visiblwRowsFlag: 1,
350
-
351
- isRowGroupStatus: false,
352
- rowGroupList: [],
353
- aggHandleFields: [],
354
- aggHandleAggColumns: [],
355
-
356
- rowGroupExpandedFlag: 1,
357
- rowExpandedFlag: 1,
358
- treeExpandedFlag: 1,
359
- updateCheckboxFlag: 1,
360
- pendingRowFlag: 1,
361
- insertRowFlag: 1,
362
- removeRowFlag: 1,
363
-
364
- mergeHeadFlag: 1,
365
- mergeBodyFlag: 1,
366
- mergeFootFlag: 1,
367
-
368
- rowHeightStore: {
369
- large: 52,
370
- default: 48,
371
- medium: 44,
372
- small: 40,
373
- mini: 36
374
- },
375
-
376
- scrollVMLoading: false,
377
- scrollYHeight: 0,
378
- scrollYTop: 0,
379
- isScrollYBig: false,
380
- scrollXLeft: 0,
381
- scrollXWidth: 0,
382
- isScrollXBig: false,
383
-
384
- lazScrollLoading: false,
385
-
386
- rowExpandHeightFlag: 1,
387
- calcCellHeightFlag: 1,
388
- resizeHeightFlag: 1,
389
- resizeWidthFlag: 1,
390
-
391
- isCustomStatus: false,
392
-
393
- isCrossDragRow: false,
394
- dragRow: null,
395
- isCrossDragCol: false,
396
- dragCol: null,
397
- dragTipText: '',
398
-
399
- isDragResize: false,
400
- isRowLoading: false,
401
- isColLoading: false
402
- }
403
- }
404
-
405
- const getAllConvertColumns = (columns: any, parentColumn?: any) => {
406
- const result: any[] = []
407
- columns.forEach((column: any) => {
408
- column.parentId = parentColumn ? parentColumn.id : null
409
- if (column.visible) {
410
- if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
411
- result.push(column)
412
- result.push(...getAllConvertColumns(column.children, column))
413
- } else {
414
- result.push(column)
415
- }
416
- }
417
- })
418
- return result
419
- }
420
-
421
- export const convertHeaderColumnToRows = (originColumns: any): any[][] => {
422
- let maxLevel = 1
423
- const traverse = (column: any, parent?: any) => {
424
- if (parent) {
425
- column.level = parent.level + 1
426
- if (maxLevel < column.level) {
427
- maxLevel = column.level
428
- }
429
- }
430
- if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
431
- let colSpan = 0
432
- column.children.forEach((subColumn: any) => {
433
- if (subColumn.visible) {
434
- traverse(subColumn, column)
435
- colSpan += subColumn.colSpan
436
- }
437
- })
438
- column.colSpan = colSpan
439
- } else {
440
- column.colSpan = 1
441
- }
442
- }
443
-
444
- originColumns.forEach((column: any) => {
445
- column.level = 1
446
- traverse(column)
447
- })
448
-
449
- const rows: any[] = []
450
- for (let i = 0; i < maxLevel; i++) {
451
- rows.push([])
452
- }
453
-
454
- const allColumns = getAllConvertColumns(originColumns)
455
-
456
- allColumns.forEach((column) => {
457
- if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
458
- column.rowSpan = 1
459
- } else {
460
- column.rowSpan = maxLevel - column.level + 1
461
- }
462
- rows[column.level - 1].push(column)
463
- })
464
-
465
- return rows
466
- }
467
-
468
- export function convertHeaderToGridRows (spanColumns: VxeTableDefines.ColumnInfo[][]) {
469
- const rSize = spanColumns.length
470
- const cSize = spanColumns[0].reduce((sum, cell) => sum + cell.colSpan, 0)
471
-
472
- const occupiedRows: boolean[][] = []
473
- const fullRows: any[][] = []
474
- for (let rIndex = 0; rIndex < rSize; rIndex++) {
475
- const oCols: boolean[] = []
476
- const dCols: string[] = []
477
- for (let cIndex = 0; cIndex < cSize; cIndex++) {
478
- oCols.push(false)
479
- dCols.push('')
480
- }
481
- occupiedRows.push(oCols)
482
- fullRows.push(dCols)
483
- }
484
-
485
- for (let rIndex = 0; rIndex < rSize; rIndex++) {
486
- let currColIndex = 0
487
- for (const column of spanColumns[rIndex]) {
488
- const { colSpan, rowSpan } = column
489
- let startColIndex = -1
490
- for (let ccIndex = currColIndex; ccIndex <= cSize - colSpan; ccIndex++) {
491
- let oFlag = true
492
- for (let csIndex = 0; csIndex < colSpan; csIndex++) {
493
- if (occupiedRows[rIndex][ccIndex + csIndex]) {
494
- oFlag = false
495
- break
496
- }
497
- }
498
- if (oFlag) {
499
- startColIndex = ccIndex
500
- break
501
- }
502
- }
503
- if (startColIndex === -1) {
504
- for (let j = 0; j <= cSize - colSpan; j++) {
505
- let oFlag = true
506
- for (let k = 0; k < colSpan; k++) {
507
- if (occupiedRows[rIndex][j + k]) {
508
- oFlag = false
509
- break
510
- }
511
- }
512
- if (oFlag) {
513
- startColIndex = j
514
- break
515
- }
516
- }
517
- if (startColIndex === -1) {
518
- // error
519
- break
520
- }
521
- }
522
-
523
- for (let srIndex = rIndex; srIndex < rIndex + rowSpan; srIndex++) {
524
- for (let scIndex = startColIndex; scIndex < startColIndex + colSpan; scIndex++) {
525
- occupiedRows[srIndex][scIndex] = true
526
- fullRows[srIndex][scIndex] = column
527
- }
528
- }
529
- currColIndex = startColIndex + colSpan
530
- }
531
- }
532
- return fullRows
533
- }
534
-
535
- export function restoreScrollLocation ($xeTable: VxeTableConstructor, scrollLeft: number, scrollTop: number) {
536
- const internalData = $xeTable.internalData
537
-
538
- if (scrollLeft || scrollTop) {
539
- internalData.intoRunScroll = false
540
- internalData.inVirtualScroll = false
541
- internalData.inWheelScroll = false
542
- internalData.inHeaderScroll = false
543
- internalData.inBodyScroll = false
544
- internalData.inFooterScroll = false
545
- internalData.scrollRenderType = ''
546
- // 还原滚动状态
547
- return $xeTable.scrollTo(scrollLeft, scrollTop)
548
- }
549
- return $xeTable.clearScroll()
550
- }
551
-
552
- export function getRowUniqueId () {
553
- return XEUtils.uniqueId('row_')
554
- }
555
-
556
- /**
557
- * 生成行的唯一主键
558
- */
559
- export function createRowId (rowOpts: VxeTablePropTypes.RowConfig, row: any, keyField: string) {
560
- const { createKeyMethod } = rowOpts
561
- if (createKeyMethod) {
562
- return createKeyMethod({ row, keyField })
563
- }
564
- return getRowUniqueId()
565
- }
566
-
567
- export function hasDeepKey (rowKey: string) {
568
- return rowKey.indexOf('.') > -1
569
- }
570
-
571
- // 行主键 key
572
- export function getRowkey ($xeTable: VxeTableConstructor) {
573
- const { currKeyField } = $xeTable.internalData
574
- return currKeyField
575
- }
576
-
577
- // 行主键 value
578
- export function getRowid ($xeTable: VxeTableConstructor, row: any) {
579
- const internalData = $xeTable.internalData
580
- const { isCurrDeepKey, currKeyField } = internalData
581
- return row ? encodeRowid((isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey)(row, currKeyField)) : ''
582
- }
583
-
584
- export function createHandleUpdateRowId ($xeTable: VxeTableConstructor) {
585
- const internalData = $xeTable.internalData
586
- const { isCurrDeepKey, currKeyField } = internalData
587
- const { computeRowOpts } = $xeTable.getComputeMaps()
588
- const rowOpts = computeRowOpts.value
589
- const updateRId = isCurrDeepKey ? updateDeepRowKey : updateFastRowKey
590
- return {
591
- rowKey: currKeyField,
592
- handleUpdateRowId (row: any) {
593
- return row ? updateRId(rowOpts, row, currKeyField) : ''
594
- }
595
- }
596
- }
597
-
598
- export function createHandleGetRowId ($xeTable: VxeTableConstructor) {
599
- const internalData = $xeTable.internalData
600
- const { isCurrDeepKey, currKeyField } = internalData
601
- const getRId = isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey
602
- return {
603
- rowKey: currKeyField,
604
- handleGetRowId (row: any) {
605
- return row ? encodeRowid(getRId(row, currKeyField)) : ''
606
- }
607
- }
608
- }
609
-
610
- // 编码行主键
611
- export function encodeRowid (rowVal: string) {
612
- return XEUtils.eqNull(rowVal) ? '' : encodeURIComponent(rowVal)
613
- }
614
-
615
- function getDeepRowIdByKey (row: any, rowKey: string) {
616
- return XEUtils.get(row, rowKey)
617
- }
618
-
619
- function updateDeepRowKey (rowOpts: VxeTablePropTypes.RowConfig, row: any, rowKey: string) {
620
- let rowid = encodeRowid(getDeepRowIdByKey(row, rowKey))
621
- if (eqEmptyValue(rowid)) {
622
- const newRowid = createRowId(rowOpts, row, rowKey)
623
- rowid = '' + newRowid
624
- XEUtils.set(row, rowKey, rowid)
625
- }
626
- return rowid
627
- }
628
-
629
- function getFastRowIdByKey (row: any, rowKey: string) {
630
- return row[rowKey]
631
- }
632
-
633
- function updateFastRowKey (rowOpts: VxeTablePropTypes.RowConfig, row: any, rowKey: string) {
634
- let rowid = encodeRowid(getFastRowIdByKey(row, rowKey))
635
- if (eqEmptyValue(rowid)) {
636
- const newRowid = createRowId(rowOpts, row, rowKey)
637
- rowid = '' + newRowid
638
- row[rowKey] = newRowid
639
- }
640
- return rowid
641
- }
642
-
643
- export interface XEColumnInstance {
644
- columnConfig: ColumnInfo;
645
- }
646
-
647
- export function handleFieldOrColumn ($xeTable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null) {
648
- if (fieldOrColumn) {
649
- return XEUtils.isString(fieldOrColumn) || XEUtils.isNumber(fieldOrColumn) ? $xeTable.getColumnByField(`${fieldOrColumn}`) : fieldOrColumn
650
- }
651
- return null
652
- }
653
-
654
- export function handleRowidOrRow ($xeTable: VxeTableConstructor, rowidOrRow: any) {
655
- if (rowidOrRow) {
656
- const rowid = XEUtils.isString(rowidOrRow) || XEUtils.isNumber(rowidOrRow) ? rowidOrRow : getRowid($xeTable, rowidOrRow)
657
- return $xeTable.getRowById(rowid)
658
- }
659
- return null
660
- }
661
-
662
- export function getCellRestHeight (rowRest: VxeTableDefines.RowCacheItem, cellOpts: VxeTablePropTypes.CellConfig, rowOpts: VxeTablePropTypes.RowConfig, defaultRowHeight: number) {
663
- return rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
664
- }
665
-
666
- function getPaddingLeftRightSize (elem: HTMLElement | null) {
667
- if (elem) {
668
- const computedStyle = getComputedStyle(elem)
669
- const paddingLeft = XEUtils.toNumber(computedStyle.paddingLeft)
670
- const paddingRight = XEUtils.toNumber(computedStyle.paddingRight)
671
- return paddingLeft + paddingRight
672
- }
673
- return 0
674
- }
675
-
676
- function getElementMarginAndWidth (elem: HTMLElement | null) {
677
- if (elem) {
678
- const computedStyle = getComputedStyle(elem)
679
- const marginLeft = XEUtils.toNumber(computedStyle.marginLeft)
680
- const marginRight = XEUtils.toNumber(computedStyle.marginRight)
681
- return elem.offsetWidth + marginLeft + marginRight
682
- }
683
- return 0
684
- }
685
-
686
- export function toFilters (filters: any, colid?: string) {
687
- if (filters) {
688
- if (XEUtils.isArray(filters)) {
689
- return filters.map(({ label, value, data, resetValue, checked }) => {
690
- return { label, value, data, resetValue, checked: !!checked, _checked: !!checked, _colId: colid }
691
- })
692
- }
693
- return []
694
- }
695
- return filters
696
- }
697
-
698
- export function toTreePathSeq (path: any[]) {
699
- return path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
700
- }
701
-
702
- export function getCellValue (row: any, column: VxeTableDefines.ColumnInfo) {
703
- return XEUtils.get(row, column.field)
704
- }
705
-
706
- export function setCellValue (row: any, column: VxeTableDefines.ColumnInfo, value: any) {
707
- return XEUtils.set(row, column.field, value)
708
- }
709
-
710
- export function getRefElem (refEl: any) {
711
- if (refEl) {
712
- const rest = refEl.value
713
- if (rest) {
714
- return (rest.$el || rest) as HTMLElement
715
- }
716
- }
717
- return null
718
- }
719
-
720
- export function getCalcHeight (height: number | 'unset' | undefined | null) {
721
- if (height === 'unset') {
722
- return 0
723
- }
724
- return height || 0
725
- }
726
-
727
- /**
728
- * 列宽拖动最大宽度
729
- * @param params
730
- * @returns
731
- */
732
- export function getColReMaxWidth (params: {
733
- $table: VxeTableConstructor & VxeTablePrivateMethods;
734
- column: VxeTableDefines.ColumnInfo;
735
- columnIndex: number;
736
- $columnIndex: number;
737
- $rowIndex: number;
738
- cell: HTMLTableCellElement;
739
- }) {
740
- const { $table } = params
741
- const { computeResizableOpts } = $table.getComputeMaps()
742
- const resizableOpts = computeResizableOpts.value
743
- const { maxWidth: reMaxWidth } = resizableOpts
744
- // 如果自定义调整宽度逻辑
745
- if (reMaxWidth) {
746
- const customMaxWidth = XEUtils.isFunction(reMaxWidth) ? reMaxWidth(params) : reMaxWidth
747
- if (customMaxWidth !== 'auto') {
748
- return Math.max(1, XEUtils.toNumber(customMaxWidth))
749
- }
750
- }
751
- return -1
752
- }
753
-
754
- /**
755
- * 列宽拖动最小宽度
756
- * @param params
757
- * @returns
758
- */
759
- export function getColReMinWidth (params: {
760
- $table: VxeTableConstructor & VxeTablePrivateMethods;
761
- column: VxeTableDefines.ColumnInfo;
762
- columnIndex: number;
763
- $columnIndex: number;
764
- $rowIndex: number;
765
- cell: HTMLTableCellElement;
766
- }) {
767
- const { $table, column, cell } = params
768
- const tableProps = $table.props
769
- const internalData = $table.internalData
770
- const { computeResizableOpts } = $table.getComputeMaps()
771
- const resizableOpts = computeResizableOpts.value
772
- const { minWidth: reMinWidth } = resizableOpts
773
- // 如果自定义调整宽度逻辑
774
- if (reMinWidth) {
775
- const customMinWidth = XEUtils.isFunction(reMinWidth) ? reMinWidth(params) : reMinWidth
776
- if (customMinWidth !== 'auto') {
777
- return Math.max(1, XEUtils.toNumber(customMinWidth))
778
- }
779
- }
780
- const { elemStore } = internalData
781
- const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps
782
- const { showHeaderOverflow, minWidth: colMinWidth } = column
783
- const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
784
- const showEllipsis = headOverflow === 'ellipsis'
785
- const showTitle = headOverflow === 'title'
786
- const showTooltip = headOverflow === true || headOverflow === 'tooltip'
787
- const hasEllipsis = showTitle || showTooltip || showEllipsis
788
- const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8)
789
- const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'))
790
- let mWidth = minTitleWidth + paddingLeftRight
791
- // 默认最小宽处理
792
- if (hasEllipsis) {
793
- const dragIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--drag-handle'))
794
- const checkboxIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--checkbox'))
795
- const requiredIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--required-icon'))
796
- const editIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--edit-icon'))
797
- const prefixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-prefix-icon'))
798
- const suffixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-suffix-icon'))
799
- const sortIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--sort'))
800
- const filterIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--filter'))
801
- mWidth += dragIconWidth + checkboxIconWidth + requiredIconWidth + editIconWidth + prefixIconWidth + suffixIconWidth + filterIconWidth + sortIconWidth
802
- }
803
- // 如果设置最小宽
804
- if (colMinWidth) {
805
- const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
806
- if (bodyScrollElem) {
807
- if (isScale(colMinWidth)) {
808
- const bodyWidth = bodyScrollElem.clientWidth - 1
809
- const meanWidth = bodyWidth / 100
810
- return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMinWidth) * meanWidth))
811
- } else if (isPx(colMinWidth)) {
812
- return Math.max(mWidth, XEUtils.toInteger(colMinWidth))
813
- }
814
- }
815
- }
816
- return mWidth
817
- }
818
-
819
- export function isColumnInfo (column: any): column is ColumnInfo {
820
- return column && (column.constructor === ColumnInfo || column instanceof ColumnInfo)
821
- }
822
-
823
- // 获取所有的列,排除分组
824
- export function getColumnList (columns: VxeTableDefines.ColumnInfo[]) {
825
- const result: VxeTableDefines.ColumnInfo[] = []
826
- columns.forEach((column) => {
827
- result.push(...(column.children && column.children.length ? getColumnList(column.children) : [column]))
828
- })
829
- return result
830
- }
831
-
832
- export function createColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, options: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo, renderOptions: any): any {
833
- return isColumnInfo(options) ? options : reactive(new ColumnInfo($xeTable, options, renderOptions))
834
- }
835
-
836
- export function watchColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, props: any, column: ColumnInfo) {
837
- Object.keys(props).forEach(name => {
838
- watch(() => props[name], (value: any) => {
839
- column.update(name, value)
840
- if ($xeTable) {
841
- if (name === 'filters') {
842
- $xeTable.setFilter(column as any, value)
843
- $xeTable.handleUpdateDataQueue()
844
- } else if (['visible', 'fixed', 'width', 'minWidth', 'maxWidth'].includes(name)) {
845
- $xeTable.handleRefreshColumnQueue()
846
- }
847
- }
848
- })
849
- })
850
- }
851
-
852
- export function assembleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, elem: HTMLElement, column: ColumnInfo, colgroup: XEColumnInstance | null) {
853
- const { reactData } = $xeTable
854
- const { staticColumns } = reactData
855
- const parentElem = elem.parentNode
856
- const parentColumn = colgroup ? colgroup.columnConfig : null
857
- const parentCols = parentColumn ? parentColumn.children : staticColumns
858
- if (parentElem && parentCols) {
859
- column.defaultParentId = parentColumn ? parentColumn.id : null
860
- parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, elem), 0, column)
861
- reactData.staticColumns = staticColumns.slice(0)
862
- }
863
- }
864
-
865
- export function destroyColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) {
866
- const { reactData } = $xeTable
867
- const { staticColumns } = reactData
868
- const matchObj = XEUtils.findTree(staticColumns, item => item.id === column.id, { children: 'children' })
869
- if (matchObj) {
870
- matchObj.items.splice(matchObj.index, 1)
871
- }
872
- reactData.staticColumns = staticColumns.slice(0)
873
- }
874
-
875
- export function getRootColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) {
876
- const { internalData } = $xeTable
877
-
878
- const { fullColumnIdData } = internalData
879
- if (!column) {
880
- return null
881
- }
882
- let parentColId = column.parentId
883
- while (fullColumnIdData[parentColId]) {
884
- const column = fullColumnIdData[parentColId].column
885
- parentColId = column.parentId
886
- if (!parentColId) {
887
- return column
888
- }
889
- }
890
- return column
891
- }
892
-
893
- export function getFirstChildColumn (column: VxeTableDefines.ColumnInfo): VxeTableDefines.ColumnInfo {
894
- const { children } = column
895
- if (children && children.length) {
896
- return getFirstChildColumn(XEUtils.first(children))
897
- }
898
- return column
899
- }
900
-
901
- export function getLastChildColumn (column: VxeTableDefines.ColumnInfo): VxeTableDefines.ColumnInfo {
902
- const { children } = column
903
- if (children && children.length) {
904
- return getFirstChildColumn(XEUtils.last(children))
905
- }
906
- return column
907
- }
908
-
909
- export function clearTableDefaultStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
910
- const { props, internalData } = $xeTable
911
-
912
- internalData.initStatus = false
913
- const actionList = [
914
- $xeTable.clearSort(),
915
- $xeTable.clearCurrentRow(),
916
- $xeTable.clearCurrentColumn(),
917
- $xeTable.clearRadioRow(),
918
- $xeTable.clearRadioReserve(),
919
- $xeTable.clearCheckboxRow(),
920
- $xeTable.clearCheckboxReserve(),
921
- $xeTable.clearRowExpand(),
922
- $xeTable.clearTreeExpand(),
923
- $xeTable.clearTreeExpandReserve(),
924
- $xeTable.clearPendingRow()
925
- ]
926
- if ($xeTable.clearFilter) {
927
- actionList.push(
928
- $xeTable.clearFilter()
929
- )
930
- }
931
- if ($xeTable.clearSelected && (props.keyboardConfig || props.mouseConfig)) {
932
- actionList.push(
933
- $xeTable.clearSelected()
934
- )
935
- }
936
- if ($xeTable.clearCellAreas && props.mouseConfig) {
937
- actionList.push(
938
- $xeTable.clearCellAreas(),
939
- $xeTable.clearCopyCellArea()
940
- )
941
- }
942
- return Promise.all(actionList).then(() => {
943
- return $xeTable.clearScroll()
944
- })
945
- }
946
-
947
- export function clearTableAllStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
948
- if ($xeTable.clearFilter) {
949
- $xeTable.clearFilter()
950
- }
951
- return clearTableDefaultStatus($xeTable)
952
- }
953
-
954
- export function rowToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, row: any) {
955
- const reactData = $xeTable.reactData
956
- const internalData = $xeTable.internalData
957
-
958
- const { computeLeftFixedWidth, computeRightFixedWidth, computeRowOpts, computeCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps()
959
- const { scrollYLoad, scrollYTop, isAllOverflow } = reactData
960
- const { elemStore, afterFullData, fullAllDataRowIdData, isResizeCellHeight } = internalData
961
- const rowOpts = computeRowOpts.value
962
- const cellOpts = computeCellOpts.value
963
- const defaultRowHeight = computeDefaultRowHeight.value
964
- const leftFixedWidth = computeLeftFixedWidth.value
965
- const rightFixedWidth = computeRightFixedWidth.value
966
- const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
967
- const rowid = getRowid($xeTable, row)
968
- if (bodyScrollElem) {
969
- const bodyHeight = bodyScrollElem.clientHeight
970
- const bodyScrollTop = bodyScrollElem.scrollTop
971
- const trElem: HTMLTableRowElement | null = bodyScrollElem.querySelector(`[rowid="${rowid}"]`)
972
- if (trElem) {
973
- const trOffsetTop = trElem.offsetTop + (scrollYLoad ? scrollYTop : 0)
974
- const trHeight = trElem.clientHeight
975
- // 检测行是否在可视区中
976
- if (trOffsetTop < bodyScrollTop || trOffsetTop > bodyScrollTop + bodyHeight) {
977
- return $xeTable.scrollTo(null, trOffsetTop)
978
- } else if (trOffsetTop + trHeight >= bodyHeight + bodyScrollTop) {
979
- return $xeTable.scrollTo(null, bodyScrollTop + trHeight)
980
- }
981
- } else {
982
- // 如果是虚拟渲染滚动
983
- if (scrollYLoad) {
984
- const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
985
- if (!isCustomCellHeight && isAllOverflow) {
986
- return $xeTable.scrollTo(null, ($xeTable.findRowIndexOf(afterFullData, row) - 1) * defaultRowHeight)
987
- }
988
- const rowRest = fullAllDataRowIdData[rowid] || {}
989
- const rHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
990
- const scrollTop = rowRest.oTop
991
- if (scrollTop < bodyScrollTop) {
992
- return $xeTable.scrollTo(null, scrollTop - leftFixedWidth - 1)
993
- }
994
- return $xeTable.scrollTo(null, (scrollTop + rHeight) - (bodyHeight - rightFixedWidth - 1))
995
- }
996
- }
997
- }
998
- return Promise.resolve()
999
- }
1000
-
1001
- export function colToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isForce: boolean, column: VxeTableDefines.ColumnInfo, row?: any) {
1002
- const reactData = $xeTable.reactData
1003
- const internalData = $xeTable.internalData
1004
-
1005
- const { computeLeftFixedWidth, computeRightFixedWidth } = $xeTable.getComputeMaps()
1006
- const { scrollXLoad, scrollXLeft } = reactData
1007
- const { elemStore, visibleColumn } = internalData
1008
- const leftFixedWidth = computeLeftFixedWidth.value
1009
- const rightFixedWidth = computeRightFixedWidth.value
1010
- const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
1011
- if (column.fixed) {
1012
- return Promise.resolve()
1013
- }
1014
- if (bodyScrollElem) {
1015
- const bodyWidth = bodyScrollElem.clientWidth
1016
- const bodyScrollLeft = bodyScrollElem.scrollLeft
1017
- let tdElem: HTMLTableCellElement | null = null
1018
- if (row) {
1019
- const rowid = getRowid($xeTable, row)
1020
- tdElem = bodyScrollElem.querySelector(`[rowid="${rowid}"] .${column.id}`)
1021
- }
1022
- if (!tdElem) {
1023
- tdElem = bodyScrollElem.querySelector(`.${column.id}`)
1024
- }
1025
- if (tdElem) {
1026
- const tdOffsetLeft = tdElem.offsetLeft + (scrollXLoad ? scrollXLeft : 0)
1027
- const cellWidth = tdElem.clientWidth
1028
- // 检测是否在可视区中
1029
- if (isForce || (
1030
- !(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
1031
- !(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth))
1032
- )) {
1033
- if (tdOffsetLeft < (bodyScrollLeft + leftFixedWidth)) {
1034
- return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1)
1035
- } else if ((tdOffsetLeft + cellWidth - bodyScrollLeft) > (bodyWidth - rightFixedWidth)) {
1036
- return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1))
1037
- }
1038
- }
1039
- } else {
1040
- if (scrollXLoad) {
1041
- let tdOffsetLeft = 0
1042
- const cellWidth = column.renderWidth
1043
- for (let i = 0; i < visibleColumn.length; i++) {
1044
- const currCol = visibleColumn[i]
1045
- if (currCol === column || currCol.id === column.id) {
1046
- break
1047
- }
1048
- tdOffsetLeft += currCol.renderWidth
1049
- }
1050
- // 检测是否在可视区中
1051
- if (isForce || (
1052
- !(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
1053
- !(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth))
1054
- )) {
1055
- if (tdOffsetLeft < bodyScrollLeft) {
1056
- return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1)
1057
- }
1058
- return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1))
1059
- }
1060
- }
1061
- }
1062
- }
1063
- return Promise.resolve()
1064
- }
1
+ import { watch, reactive } from 'vue'
2
+ import XEUtils from 'xe-utils'
3
+ import { ColumnInfo } from './columnInfo'
4
+ import { isPx, isScale, queryElement } from '../../ui/src/dom'
5
+ import { eqEmptyValue } from '../../ui/src/utils'
6
+
7
+ import type { VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines, VxeTablePropTypes, TableReactData, TableInternalData } from '../../../types'
8
+
9
+ export function createInternalData (): TableInternalData {
10
+ return {
11
+ tZindex: 0,
12
+ currKeyField: '',
13
+ isCurrDeepKey: false,
14
+ elemStore: {},
15
+ // 存放横向 X 虚拟滚动相关的信息
16
+ scrollXStore: {
17
+ preloadSize: 0,
18
+ offsetSize: 0,
19
+ visibleSize: 0,
20
+ visibleStartIndex: 0,
21
+ visibleEndIndex: 0,
22
+ startIndex: 0,
23
+ endIndex: 0
24
+ },
25
+ // 存放纵向 Y 虚拟滚动相关信息
26
+ scrollYStore: {
27
+ preloadSize: 0,
28
+ offsetSize: 0,
29
+ visibleSize: 0,
30
+ visibleStartIndex: 0,
31
+ visibleEndIndex: 0,
32
+ startIndex: 0,
33
+ endIndex: 0
34
+ },
35
+ // 表格宽度
36
+ tableWidth: 0,
37
+ // 表格高度
38
+ tableHeight: 0,
39
+ customHeight: 0,
40
+ customMinHeight: 0,
41
+ customMaxHeight: 0,
42
+ // 当前 hover 行
43
+ hoverRow: null,
44
+ // 最后滚动位置
45
+ lastScrollLeft: 0,
46
+ lastScrollTop: 0,
47
+ // 单选框属性,已选中保留的行
48
+ radioReserveRow: null,
49
+ // 复选框属性,已选中保留的行集合
50
+ checkboxReserveRowMap: {},
51
+ // 行数据,已展开保留的行集合
52
+ rowExpandedReserveRowMap: {},
53
+ // 树结构数据,已展开保留的行集合
54
+ treeExpandedReserveRowMap: {},
55
+ // 树结构数据,不确定状态的集合
56
+ treeIndeterminateRowMaps: {},
57
+ // 列表完整数据、条件处理后
58
+ tableFullData: [],
59
+ afterFullData: [],
60
+ afterTreeFullData: [],
61
+ afterGroupFullData: [],
62
+ // 列表条件处理后数据集合
63
+ afterFullRowMaps: {},
64
+ // 树结构完整数据、条件处理后
65
+ tableFullTreeData: [],
66
+ // 行分组全量数据、条件处理后
67
+ tableFullGroupData: [],
68
+ tableSynchData: [],
69
+ tableSourceData: [],
70
+ // 收集的列配置(带分组)
71
+ collectColumn: [],
72
+ // 完整所有列(不带分组)
73
+ tableFullColumn: [],
74
+ // 渲染所有列
75
+ visibleColumn: [],
76
+
77
+ // 全量数据集(包括当前和已删除)
78
+ fullAllDataRowIdData: {},
79
+ // 数据集(仅当前)
80
+ fullDataRowIdData: {},
81
+ // 数据集(仅可视)
82
+ visibleDataRowIdData: {},
83
+
84
+ keepUpdateFieldMaps: {},
85
+
86
+ footerFullDataRowData: {},
87
+
88
+ // 渲染中缓存数据
89
+ sourceDataRowIdData: {},
90
+ fullColumnIdData: {},
91
+ fullColumnFieldData: {},
92
+
93
+ // 合并表头单元格的数据
94
+ mergeHeaderList: [],
95
+ mergeHeaderMaps: {},
96
+ // 已合并单元格数据集合
97
+ mergeHeaderCellMaps: {},
98
+ mergeHeaderRowMaps: {},
99
+ mergeHeaderColMaps: {},
100
+ // 合并单元格的数据
101
+ mergeBodyList: [],
102
+ mergeBodyMaps: {},
103
+ // 已合并单元格数据集合
104
+ mergeBodyCellMaps: {},
105
+ mergeBodyRowMaps: {},
106
+ mergeBodyColMaps: {},
107
+ // 合并表尾的数据
108
+ mergeFooterList: [],
109
+ mergeFooterMaps: {},
110
+ // 已合并表尾数据集合
111
+ mergeFooterCellMaps: {},
112
+ mergeFooterRowMaps: {},
113
+ mergeFooterColMaps: {},
114
+
115
+ // 已展开的行集合
116
+ rowExpandedMaps: {},
117
+ // 懒加载中的展开行的集合
118
+ rowExpandLazyLoadedMaps: {},
119
+ // 已展开的分组行
120
+ rowGroupExpandedMaps: {},
121
+ // 已展开树节点集合
122
+ treeExpandedMaps: {},
123
+ // 懒加载中的树节点的集合
124
+ treeExpandLazyLoadedMaps: {},
125
+ // 复选框属性,已选中的行集合
126
+ selectCheckboxMaps: {},
127
+ // 已标记的对象集
128
+ pendingRowMaps: {},
129
+ // 已新增的临时行
130
+ insertRowMaps: {},
131
+ // 已删除行
132
+ removeRowMaps: {},
133
+
134
+ cvCacheMaps: {},
135
+
136
+ // 表头高度
137
+ tHeaderHeight: 0,
138
+ // 表体高度
139
+ tBodyHeight: 0,
140
+ // 表尾高度
141
+ tFooterHeight: 0,
142
+
143
+ teleportToWrapperElem: null,
144
+ popupToWrapperElem: null,
145
+
146
+ lastSTime: 0,
147
+
148
+ inited: false,
149
+ tooltipTimeout: null,
150
+ initStatus: false,
151
+ isActivated: false
152
+
153
+ // _sToTime: null
154
+ }
155
+ }
156
+
157
+ export function createReactData (): TableReactData {
158
+ return {
159
+ updateColFlag: 0,
160
+ // 低性能的静态列
161
+ staticColumns: [],
162
+ // 渲染的列分组
163
+ tableGroupColumn: [],
164
+ // 可视区渲染的列
165
+ tableColumn: [],
166
+ // 渲染中的数据
167
+ tableData: [],
168
+ // 是否启用了横向 X 可视渲染方式加载
169
+ scrollXLoad: false,
170
+ // 是否启用了纵向 Y 可视渲染方式加载
171
+ scrollYLoad: false,
172
+ // 是否存在纵向滚动条
173
+ overflowY: true,
174
+ // 是否存在横向滚动条
175
+ overflowX: false,
176
+ // 纵向滚动条的宽度
177
+ scrollbarWidth: 0,
178
+ // 横向滚动条的高度
179
+ scrollbarHeight: 0,
180
+ // 行高
181
+ rowHeight: 0,
182
+ // 表格父容器的高度
183
+ parentHeight: 0,
184
+ // 是否使用分组表头
185
+ isGroup: false,
186
+ isAllOverflow: false,
187
+ // 复选框属性,是否全选
188
+ isAllSelected: false,
189
+ // 复选框属性,有选中且非全选状态
190
+ isIndeterminate: false,
191
+ // 当前行
192
+ currentRow: null,
193
+ // 单选框属性,选中列
194
+ currentColumn: null,
195
+ // 单选框属性,选中行
196
+ selectRadioRow: null,
197
+ // 表尾合计数据
198
+ footerTableData: [],
199
+ // 行分组列信息
200
+ rowGroupColumn: null,
201
+ // 展开列信息
202
+ expandColumn: null,
203
+ checkboxColumn: null,
204
+ radioColumn: null,
205
+ // 树节点列信息
206
+ treeNodeColumn: null,
207
+ hasFixedColumn: false,
208
+ // 刷新列标识,当列筛选被改变时,触发表格刷新数据
209
+ upDataFlag: 0,
210
+ // 刷新列标识,当列的特定属性被改变时,触发表格刷新列
211
+ reColumnFlag: 0,
212
+ // 初始化标识
213
+ initStore: {
214
+ filter: false,
215
+ import: false,
216
+ export: false,
217
+ custom: false
218
+ },
219
+ // 自定义列相关的信息
220
+ customStore: {
221
+ btnEl: null,
222
+ isAll: false,
223
+ isIndeterminate: false,
224
+ activeBtn: false,
225
+ activeWrapper: false,
226
+ visible: false,
227
+ maxHeight: null,
228
+ popupTop: 0,
229
+ oldSortMaps: {},
230
+ oldFixedMaps: {},
231
+ oldVisibleMaps: {}
232
+ },
233
+ customColumnList: [],
234
+ // 当前选中的筛选列
235
+ filterStore: {
236
+ isAllSelected: false,
237
+ isIndeterminate: false,
238
+ style: null,
239
+ column: null,
240
+ visible: false,
241
+ maxHeight: null
242
+ },
243
+ // 存放列相关的信息
244
+ columnStore: {
245
+ leftList: [],
246
+ centerList: [],
247
+ rightList: [],
248
+ resizeList: [],
249
+ pxList: [],
250
+ pxMinList: [],
251
+ autoMinList: [],
252
+ scaleList: [],
253
+ scaleMinList: [],
254
+ autoList: [],
255
+ remainList: []
256
+ },
257
+ // 存放快捷菜单的信息
258
+ ctxMenuStore: {
259
+ selected: null,
260
+ visible: false,
261
+ showChild: false,
262
+ selectChild: null,
263
+ list: [],
264
+ style: null
265
+ },
266
+ // 存放可编辑相关信息
267
+ editStore: {
268
+ indexs: {
269
+ columns: []
270
+ },
271
+ titles: {
272
+ columns: []
273
+ },
274
+ // 选中源
275
+ selected: {
276
+ row: null,
277
+ column: null
278
+ },
279
+ // 已复制源
280
+ copyed: {
281
+ cut: false,
282
+ rows: [],
283
+ columns: []
284
+ },
285
+ // 激活
286
+ actived: {
287
+ row: null,
288
+ column: null
289
+ },
290
+ // 当前被强制聚焦单元格,只会在鼠标点击后算聚焦
291
+ focused: {
292
+ row: null,
293
+ column: null
294
+ }
295
+ },
296
+ // 存放 tooltip 相关信息
297
+ tooltipStore: {
298
+ row: null,
299
+ column: null,
300
+ content: null,
301
+ visible: false,
302
+ type: null,
303
+ currOpts: {}
304
+ },
305
+ // 存放数据校验相关信息
306
+ validStore: {
307
+ visible: false
308
+ },
309
+ validErrorMaps: {},
310
+ // 导入相关信息
311
+ importStore: {
312
+ inited: false,
313
+ file: null,
314
+ type: '',
315
+ modeList: [],
316
+ typeList: [],
317
+ filename: '',
318
+ visible: false
319
+ },
320
+ importParams: {
321
+ mode: '',
322
+ types: null,
323
+ message: true
324
+ },
325
+ // 导出相关信息
326
+ exportStore: {
327
+ inited: false,
328
+ name: '',
329
+ modeList: [],
330
+ typeList: [],
331
+ columns: [],
332
+ isPrint: false,
333
+ hasFooter: false,
334
+ hasMerge: false,
335
+ hasTree: false,
336
+ hasColgroup: false,
337
+ visible: false
338
+ },
339
+ exportParams: {
340
+ filename: '',
341
+ sheetName: '',
342
+ mode: '',
343
+ type: '',
344
+ isColgroup: false,
345
+ isMerge: false,
346
+ isAllExpand: false,
347
+ useStyle: false,
348
+ original: false,
349
+ message: true,
350
+ isHeader: false,
351
+ isTitle: false,
352
+ isFooter: false
353
+ },
354
+
355
+ visiblwRowsFlag: 1,
356
+
357
+ isRowGroupStatus: false,
358
+ rowGroupList: [],
359
+ aggHandleFields: [],
360
+ aggHandleAggColumns: [],
361
+
362
+ rowGroupExpandedFlag: 1,
363
+ rowExpandedFlag: 1,
364
+ treeExpandedFlag: 1,
365
+ updateCheckboxFlag: 1,
366
+ pendingRowFlag: 1,
367
+ insertRowFlag: 1,
368
+ removeRowFlag: 1,
369
+
370
+ mergeHeadFlag: 1,
371
+ mergeBodyFlag: 1,
372
+ mergeFootFlag: 1,
373
+
374
+ rowHeightStore: {
375
+ large: 52,
376
+ default: 48,
377
+ medium: 44,
378
+ small: 40,
379
+ mini: 36
380
+ },
381
+
382
+ scrollVMLoading: false,
383
+ scrollYHeight: 0,
384
+ scrollYTop: 0,
385
+ isScrollYBig: false,
386
+ scrollXLeft: 0,
387
+ scrollXWidth: 0,
388
+ isScrollXBig: false,
389
+
390
+ lazScrollLoading: false,
391
+
392
+ rowExpandHeightFlag: 1,
393
+ calcCellHeightFlag: 1,
394
+ resizeHeightFlag: 1,
395
+ resizeWidthFlag: 1,
396
+
397
+ isCustomStatus: false,
398
+
399
+ isCrossDragRow: false,
400
+ dragRow: null,
401
+ isCrossDragCol: false,
402
+ dragCol: null,
403
+ dragTipText: '',
404
+
405
+ isDragResize: false,
406
+ isRowLoading: false,
407
+ isColLoading: false
408
+ }
409
+ }
410
+
411
+ const getAllConvertColumns = (columns: any, parentColumn?: any) => {
412
+ const result: any[] = []
413
+ columns.forEach((column: any) => {
414
+ column.parentId = parentColumn ? parentColumn.id : null
415
+ if (column.visible) {
416
+ if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
417
+ result.push(column)
418
+ result.push(...getAllConvertColumns(column.children, column))
419
+ } else {
420
+ result.push(column)
421
+ }
422
+ }
423
+ })
424
+ return result
425
+ }
426
+
427
+ export const convertHeaderColumnToRows = (originColumns: any): any[][] => {
428
+ let maxLevel = 1
429
+ const traverse = (column: any, parent?: any) => {
430
+ if (parent) {
431
+ column.level = parent.level + 1
432
+ if (maxLevel < column.level) {
433
+ maxLevel = column.level
434
+ }
435
+ }
436
+ if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
437
+ let colSpan = 0
438
+ column.children.forEach((subColumn: any) => {
439
+ if (subColumn.visible) {
440
+ traverse(subColumn, column)
441
+ colSpan += subColumn.colSpan
442
+ }
443
+ })
444
+ column.colSpan = colSpan
445
+ } else {
446
+ column.colSpan = 1
447
+ }
448
+ }
449
+
450
+ originColumns.forEach((column: any) => {
451
+ column.level = 1
452
+ traverse(column)
453
+ })
454
+
455
+ const rows: any[] = []
456
+ for (let i = 0; i < maxLevel; i++) {
457
+ rows.push([])
458
+ }
459
+
460
+ const allColumns = getAllConvertColumns(originColumns)
461
+
462
+ allColumns.forEach((column) => {
463
+ if (column.children && column.children.length && column.children.some((column: any) => column.visible)) {
464
+ column.rowSpan = 1
465
+ } else {
466
+ column.rowSpan = maxLevel - column.level + 1
467
+ }
468
+ rows[column.level - 1].push(column)
469
+ })
470
+
471
+ return rows
472
+ }
473
+
474
+ export function convertHeaderToGridRows (spanColumns: VxeTableDefines.ColumnInfo[][]) {
475
+ const rSize = spanColumns.length
476
+ const cSize = spanColumns[0].reduce((sum, cell) => sum + cell.colSpan, 0)
477
+
478
+ const occupiedRows: boolean[][] = []
479
+ const fullRows: any[][] = []
480
+ for (let rIndex = 0; rIndex < rSize; rIndex++) {
481
+ const oCols: boolean[] = []
482
+ const dCols: string[] = []
483
+ for (let cIndex = 0; cIndex < cSize; cIndex++) {
484
+ oCols.push(false)
485
+ dCols.push('')
486
+ }
487
+ occupiedRows.push(oCols)
488
+ fullRows.push(dCols)
489
+ }
490
+
491
+ for (let rIndex = 0; rIndex < rSize; rIndex++) {
492
+ let currColIndex = 0
493
+ for (const column of spanColumns[rIndex]) {
494
+ const { colSpan, rowSpan } = column
495
+ let startColIndex = -1
496
+ for (let ccIndex = currColIndex; ccIndex <= cSize - colSpan; ccIndex++) {
497
+ let oFlag = true
498
+ for (let csIndex = 0; csIndex < colSpan; csIndex++) {
499
+ if (occupiedRows[rIndex][ccIndex + csIndex]) {
500
+ oFlag = false
501
+ break
502
+ }
503
+ }
504
+ if (oFlag) {
505
+ startColIndex = ccIndex
506
+ break
507
+ }
508
+ }
509
+ if (startColIndex === -1) {
510
+ for (let j = 0; j <= cSize - colSpan; j++) {
511
+ let oFlag = true
512
+ for (let k = 0; k < colSpan; k++) {
513
+ if (occupiedRows[rIndex][j + k]) {
514
+ oFlag = false
515
+ break
516
+ }
517
+ }
518
+ if (oFlag) {
519
+ startColIndex = j
520
+ break
521
+ }
522
+ }
523
+ if (startColIndex === -1) {
524
+ // error
525
+ break
526
+ }
527
+ }
528
+
529
+ for (let srIndex = rIndex; srIndex < rIndex + rowSpan; srIndex++) {
530
+ for (let scIndex = startColIndex; scIndex < startColIndex + colSpan; scIndex++) {
531
+ occupiedRows[srIndex][scIndex] = true
532
+ fullRows[srIndex][scIndex] = column
533
+ }
534
+ }
535
+ currColIndex = startColIndex + colSpan
536
+ }
537
+ }
538
+ return fullRows
539
+ }
540
+
541
+ export function restoreScrollLocation ($xeTable: VxeTableConstructor, scrollLeft: number, scrollTop: number) {
542
+ const internalData = $xeTable.internalData
543
+
544
+ if (scrollLeft || scrollTop) {
545
+ internalData.intoRunScroll = false
546
+ internalData.inVirtualScroll = false
547
+ internalData.inWheelScroll = false
548
+ internalData.inHeaderScroll = false
549
+ internalData.inBodyScroll = false
550
+ internalData.inFooterScroll = false
551
+ internalData.scrollRenderType = ''
552
+ // 还原滚动状态
553
+ return $xeTable.scrollTo(scrollLeft, scrollTop)
554
+ }
555
+ return $xeTable.clearScroll()
556
+ }
557
+
558
+ export function getRowUniqueId () {
559
+ return XEUtils.uniqueId('row_')
560
+ }
561
+
562
+ /**
563
+ * 生成行的唯一主键
564
+ */
565
+ export function createRowId (rowOpts: VxeTablePropTypes.RowConfig, row: any, keyField: string) {
566
+ const { createKeyMethod } = rowOpts
567
+ if (createKeyMethod) {
568
+ return createKeyMethod({ row, keyField })
569
+ }
570
+ return getRowUniqueId()
571
+ }
572
+
573
+ export function hasDeepKey (rowKey: string) {
574
+ return rowKey.indexOf('.') > -1
575
+ }
576
+
577
+ // 行主键 key
578
+ export function getRowkey ($xeTable: VxeTableConstructor) {
579
+ const { currKeyField } = $xeTable.internalData
580
+ return currKeyField
581
+ }
582
+
583
+ // 行主键 value
584
+ export function getRowid ($xeTable: VxeTableConstructor, row: any) {
585
+ const internalData = $xeTable.internalData
586
+ const { isCurrDeepKey, currKeyField } = internalData
587
+ return row ? encodeRowid((isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey)(row, currKeyField)) : ''
588
+ }
589
+
590
+ export function createHandleUpdateRowId ($xeTable: VxeTableConstructor) {
591
+ const internalData = $xeTable.internalData
592
+ const { isCurrDeepKey, currKeyField } = internalData
593
+ const { computeRowOpts } = $xeTable.getComputeMaps()
594
+ const rowOpts = computeRowOpts.value
595
+ const updateRId = isCurrDeepKey ? updateDeepRowKey : updateFastRowKey
596
+ return {
597
+ rowKey: currKeyField,
598
+ handleUpdateRowId (row: any) {
599
+ return row ? updateRId(rowOpts, row, currKeyField) : ''
600
+ }
601
+ }
602
+ }
603
+
604
+ export function createHandleGetRowId ($xeTable: VxeTableConstructor) {
605
+ const internalData = $xeTable.internalData
606
+ const { isCurrDeepKey, currKeyField } = internalData
607
+ const getRId = isCurrDeepKey ? getDeepRowIdByKey : getFastRowIdByKey
608
+ return {
609
+ rowKey: currKeyField,
610
+ handleGetRowId (row: any) {
611
+ return row ? encodeRowid(getRId(row, currKeyField)) : ''
612
+ }
613
+ }
614
+ }
615
+
616
+ // 编码行主键
617
+ export function encodeRowid (rowVal: string) {
618
+ return XEUtils.eqNull(rowVal) ? '' : encodeURIComponent(rowVal)
619
+ }
620
+
621
+ function getDeepRowIdByKey (row: any, rowKey: string) {
622
+ return XEUtils.get(row, rowKey)
623
+ }
624
+
625
+ function updateDeepRowKey (rowOpts: VxeTablePropTypes.RowConfig, row: any, rowKey: string) {
626
+ let rowid = encodeRowid(getDeepRowIdByKey(row, rowKey))
627
+ if (eqEmptyValue(rowid)) {
628
+ const newRowid = createRowId(rowOpts, row, rowKey)
629
+ rowid = '' + newRowid
630
+ XEUtils.set(row, rowKey, rowid)
631
+ }
632
+ return rowid
633
+ }
634
+
635
+ function getFastRowIdByKey (row: any, rowKey: string) {
636
+ return row[rowKey]
637
+ }
638
+
639
+ function updateFastRowKey (rowOpts: VxeTablePropTypes.RowConfig, row: any, rowKey: string) {
640
+ let rowid = encodeRowid(getFastRowIdByKey(row, rowKey))
641
+ if (eqEmptyValue(rowid)) {
642
+ const newRowid = createRowId(rowOpts, row, rowKey)
643
+ rowid = '' + newRowid
644
+ row[rowKey] = newRowid
645
+ }
646
+ return rowid
647
+ }
648
+
649
+ export interface XEColumnInstance {
650
+ columnConfig: ColumnInfo;
651
+ }
652
+
653
+ export function handleFieldOrColumn ($xeTable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null) {
654
+ if (fieldOrColumn) {
655
+ return XEUtils.isString(fieldOrColumn) || XEUtils.isNumber(fieldOrColumn) ? $xeTable.getColumnByField(`${fieldOrColumn}`) : fieldOrColumn
656
+ }
657
+ return null
658
+ }
659
+
660
+ export function handleRowidOrRow ($xeTable: VxeTableConstructor, rowidOrRow: any) {
661
+ if (rowidOrRow) {
662
+ const rowid = XEUtils.isString(rowidOrRow) || XEUtils.isNumber(rowidOrRow) ? rowidOrRow : getRowid($xeTable, rowidOrRow)
663
+ return $xeTable.getRowById(rowid)
664
+ }
665
+ return null
666
+ }
667
+
668
+ export function getCellRestHeight (rowRest: VxeTableDefines.RowCacheItem, cellOpts: VxeTablePropTypes.CellConfig, rowOpts: VxeTablePropTypes.RowConfig, defaultRowHeight: number) {
669
+ return rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
670
+ }
671
+
672
+ function getPaddingLeftRightSize (elem: HTMLElement | null) {
673
+ if (elem) {
674
+ const computedStyle = getComputedStyle(elem)
675
+ const paddingLeft = XEUtils.toNumber(computedStyle.paddingLeft)
676
+ const paddingRight = XEUtils.toNumber(computedStyle.paddingRight)
677
+ return paddingLeft + paddingRight
678
+ }
679
+ return 0
680
+ }
681
+
682
+ function getElementMarginAndWidth (elem: HTMLElement | null) {
683
+ if (elem) {
684
+ const computedStyle = getComputedStyle(elem)
685
+ const marginLeft = XEUtils.toNumber(computedStyle.marginLeft)
686
+ const marginRight = XEUtils.toNumber(computedStyle.marginRight)
687
+ return elem.offsetWidth + marginLeft + marginRight
688
+ }
689
+ return 0
690
+ }
691
+
692
+ export function toFilters (filters: any, colid?: string) {
693
+ if (filters) {
694
+ if (XEUtils.isArray(filters)) {
695
+ return filters.map(({ label, value, data, resetValue, checked }) => {
696
+ return { label, value, data, resetValue, checked: !!checked, _checked: !!checked, _colId: colid }
697
+ })
698
+ }
699
+ return []
700
+ }
701
+ return filters
702
+ }
703
+
704
+ export function toTreePathSeq (path: any[]) {
705
+ return path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
706
+ }
707
+
708
+ export function getCellValue (row: any, column: VxeTableDefines.ColumnInfo) {
709
+ return XEUtils.get(row, column.field)
710
+ }
711
+
712
+ export function setCellValue (row: any, column: VxeTableDefines.ColumnInfo, value: any) {
713
+ return XEUtils.set(row, column.field, value)
714
+ }
715
+
716
+ export function getRefElem (refEl: any) {
717
+ if (refEl) {
718
+ const rest = refEl.value
719
+ if (rest) {
720
+ return (rest.$el || rest) as HTMLElement
721
+ }
722
+ }
723
+ return null
724
+ }
725
+
726
+ export function getCalcHeight (height: number | 'unset' | undefined | null) {
727
+ if (height === 'unset') {
728
+ return 0
729
+ }
730
+ return height || 0
731
+ }
732
+
733
+ /**
734
+ * 列宽拖动最大宽度
735
+ * @param params
736
+ * @returns
737
+ */
738
+ export function getColReMaxWidth (params: {
739
+ $table: VxeTableConstructor & VxeTablePrivateMethods;
740
+ column: VxeTableDefines.ColumnInfo;
741
+ columnIndex: number;
742
+ $columnIndex: number;
743
+ $rowIndex: number;
744
+ cell: HTMLTableCellElement;
745
+ }) {
746
+ const { $table } = params
747
+ const { computeResizableOpts } = $table.getComputeMaps()
748
+ const resizableOpts = computeResizableOpts.value
749
+ const { maxWidth: reMaxWidth } = resizableOpts
750
+ // 如果自定义调整宽度逻辑
751
+ if (reMaxWidth) {
752
+ const customMaxWidth = XEUtils.isFunction(reMaxWidth) ? reMaxWidth(params) : reMaxWidth
753
+ if (customMaxWidth !== 'auto') {
754
+ return Math.max(1, XEUtils.toNumber(customMaxWidth))
755
+ }
756
+ }
757
+ return -1
758
+ }
759
+
760
+ /**
761
+ * 列宽拖动最小宽度
762
+ * @param params
763
+ * @returns
764
+ */
765
+ export function getColReMinWidth (params: {
766
+ $table: VxeTableConstructor & VxeTablePrivateMethods;
767
+ column: VxeTableDefines.ColumnInfo;
768
+ columnIndex: number;
769
+ $columnIndex: number;
770
+ $rowIndex: number;
771
+ cell: HTMLTableCellElement;
772
+ }) {
773
+ const { $table, column, cell } = params
774
+ const tableProps = $table.props
775
+ const internalData = $table.internalData
776
+ const { computeResizableOpts } = $table.getComputeMaps()
777
+ const resizableOpts = computeResizableOpts.value
778
+ const { minWidth: reMinWidth } = resizableOpts
779
+ // 如果自定义调整宽度逻辑
780
+ if (reMinWidth) {
781
+ const customMinWidth = XEUtils.isFunction(reMinWidth) ? reMinWidth(params) : reMinWidth
782
+ if (customMinWidth !== 'auto') {
783
+ return Math.max(1, XEUtils.toNumber(customMinWidth))
784
+ }
785
+ }
786
+ const { elemStore } = internalData
787
+ const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps
788
+ const { showHeaderOverflow, minWidth: colMinWidth } = column
789
+ const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
790
+ const showEllipsis = headOverflow === 'ellipsis'
791
+ const showTitle = headOverflow === 'title'
792
+ const showTooltip = headOverflow === true || headOverflow === 'tooltip'
793
+ const hasEllipsis = showTitle || showTooltip || showEllipsis
794
+ const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8)
795
+ const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'))
796
+ let mWidth = minTitleWidth + paddingLeftRight
797
+ // 默认最小宽处理
798
+ if (hasEllipsis) {
799
+ const dragIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--drag-handle'))
800
+ const checkboxIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--checkbox'))
801
+ const requiredIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--required-icon'))
802
+ const editIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--edit-icon'))
803
+ const prefixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-prefix-icon'))
804
+ const suffixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-suffix-icon'))
805
+ const sortIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--sort'))
806
+ const filterIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--filter'))
807
+ mWidth += dragIconWidth + checkboxIconWidth + requiredIconWidth + editIconWidth + prefixIconWidth + suffixIconWidth + filterIconWidth + sortIconWidth
808
+ }
809
+ // 如果设置最小宽
810
+ if (colMinWidth) {
811
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
812
+ if (bodyScrollElem) {
813
+ if (isScale(colMinWidth)) {
814
+ const bodyWidth = bodyScrollElem.clientWidth - 1
815
+ const meanWidth = bodyWidth / 100
816
+ return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMinWidth) * meanWidth))
817
+ } else if (isPx(colMinWidth)) {
818
+ return Math.max(mWidth, XEUtils.toInteger(colMinWidth))
819
+ }
820
+ }
821
+ }
822
+ return mWidth
823
+ }
824
+
825
+ export function isColumnInfo (column: any): column is ColumnInfo {
826
+ return column && (column.constructor === ColumnInfo || column instanceof ColumnInfo)
827
+ }
828
+
829
+ // 获取所有的列,排除分组
830
+ export function getColumnList (columns: VxeTableDefines.ColumnInfo[]) {
831
+ const result: VxeTableDefines.ColumnInfo[] = []
832
+ columns.forEach((column) => {
833
+ result.push(...(column.children && column.children.length ? getColumnList(column.children) : [column]))
834
+ })
835
+ return result
836
+ }
837
+
838
+ export function createColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, options: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo, renderOptions: any): any {
839
+ return isColumnInfo(options) ? options : reactive(new ColumnInfo($xeTable, options, renderOptions))
840
+ }
841
+
842
+ export function watchColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, props: any, column: ColumnInfo) {
843
+ Object.keys(props).forEach(name => {
844
+ watch(() => props[name], (value: any) => {
845
+ column.update(name, value)
846
+ if ($xeTable) {
847
+ if (name === 'filters') {
848
+ $xeTable.setFilter(column as any, value)
849
+ $xeTable.handleUpdateDataQueue()
850
+ } else if (['visible', 'fixed', 'width', 'minWidth', 'maxWidth'].includes(name)) {
851
+ $xeTable.handleRefreshColumnQueue()
852
+ }
853
+ }
854
+ })
855
+ })
856
+ }
857
+
858
+ export function assembleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, elem: HTMLElement, column: ColumnInfo, colgroup: XEColumnInstance | null) {
859
+ const { reactData } = $xeTable
860
+ const { staticColumns } = reactData
861
+ const parentElem = elem.parentNode
862
+ const parentColumn = colgroup ? colgroup.columnConfig : null
863
+ const parentCols = parentColumn ? parentColumn.children : staticColumns
864
+ if (parentElem && parentCols) {
865
+ column.defaultParentId = parentColumn ? parentColumn.id : null
866
+ parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, elem), 0, column)
867
+ reactData.staticColumns = staticColumns.slice(0)
868
+ }
869
+ }
870
+
871
+ export function destroyColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) {
872
+ const { reactData } = $xeTable
873
+ const { staticColumns } = reactData
874
+ const matchObj = XEUtils.findTree(staticColumns, item => item.id === column.id, { children: 'children' })
875
+ if (matchObj) {
876
+ matchObj.items.splice(matchObj.index, 1)
877
+ }
878
+ reactData.staticColumns = staticColumns.slice(0)
879
+ }
880
+
881
+ export function getRootColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) {
882
+ const { internalData } = $xeTable
883
+
884
+ const { fullColumnIdData } = internalData
885
+ if (!column) {
886
+ return null
887
+ }
888
+ let parentColId = column.parentId
889
+ while (fullColumnIdData[parentColId]) {
890
+ const column = fullColumnIdData[parentColId].column
891
+ parentColId = column.parentId
892
+ if (!parentColId) {
893
+ return column
894
+ }
895
+ }
896
+ return column
897
+ }
898
+
899
+ export function getFirstChildColumn (column: VxeTableDefines.ColumnInfo): VxeTableDefines.ColumnInfo {
900
+ const { children } = column
901
+ if (children && children.length) {
902
+ return getFirstChildColumn(XEUtils.first(children))
903
+ }
904
+ return column
905
+ }
906
+
907
+ export function getLastChildColumn (column: VxeTableDefines.ColumnInfo): VxeTableDefines.ColumnInfo {
908
+ const { children } = column
909
+ if (children && children.length) {
910
+ return getFirstChildColumn(XEUtils.last(children))
911
+ }
912
+ return column
913
+ }
914
+
915
+ export function clearTableDefaultStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
916
+ const { props, internalData } = $xeTable
917
+
918
+ internalData.initStatus = false
919
+ const actionList = [
920
+ $xeTable.clearSort(),
921
+ $xeTable.clearCurrentRow(),
922
+ $xeTable.clearCurrentColumn(),
923
+ $xeTable.clearRadioRow(),
924
+ $xeTable.clearRadioReserve(),
925
+ $xeTable.clearCheckboxRow(),
926
+ $xeTable.clearCheckboxReserve(),
927
+ $xeTable.clearRowExpand(),
928
+ $xeTable.clearTreeExpand(),
929
+ $xeTable.clearTreeExpandReserve(),
930
+ $xeTable.clearPendingRow()
931
+ ]
932
+ if ($xeTable.clearFilter) {
933
+ actionList.push(
934
+ $xeTable.clearFilter()
935
+ )
936
+ }
937
+ if ($xeTable.clearSelected && (props.keyboardConfig || props.mouseConfig)) {
938
+ actionList.push(
939
+ $xeTable.clearSelected()
940
+ )
941
+ }
942
+ if ($xeTable.clearCellAreas && props.mouseConfig) {
943
+ actionList.push(
944
+ $xeTable.clearCellAreas(),
945
+ $xeTable.clearCopyCellArea()
946
+ )
947
+ }
948
+ return Promise.all(actionList).then(() => {
949
+ return $xeTable.clearScroll()
950
+ })
951
+ }
952
+
953
+ export function clearTableAllStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
954
+ if ($xeTable.clearFilter) {
955
+ $xeTable.clearFilter()
956
+ }
957
+ return clearTableDefaultStatus($xeTable)
958
+ }
959
+
960
+ export function rowToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, row: any) {
961
+ const reactData = $xeTable.reactData
962
+ const internalData = $xeTable.internalData
963
+
964
+ const { computeLeftFixedWidth, computeRightFixedWidth, computeRowOpts, computeCellOpts, computeDefaultRowHeight } = $xeTable.getComputeMaps()
965
+ const { scrollYLoad, scrollYTop, isAllOverflow } = reactData
966
+ const { elemStore, afterFullData, fullAllDataRowIdData, isResizeCellHeight } = internalData
967
+ const rowOpts = computeRowOpts.value
968
+ const cellOpts = computeCellOpts.value
969
+ const defaultRowHeight = computeDefaultRowHeight.value
970
+ const leftFixedWidth = computeLeftFixedWidth.value
971
+ const rightFixedWidth = computeRightFixedWidth.value
972
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
973
+ const rowid = getRowid($xeTable, row)
974
+ if (bodyScrollElem) {
975
+ const bodyHeight = bodyScrollElem.clientHeight
976
+ const bodyScrollTop = bodyScrollElem.scrollTop
977
+ const trElem: HTMLTableRowElement | null = bodyScrollElem.querySelector(`[rowid="${rowid}"]`)
978
+ if (trElem) {
979
+ const trOffsetTop = trElem.offsetTop + (scrollYLoad ? scrollYTop : 0)
980
+ const trHeight = trElem.clientHeight
981
+ // 检测行是否在可视区中
982
+ if (trOffsetTop < bodyScrollTop || trOffsetTop > bodyScrollTop + bodyHeight) {
983
+ return $xeTable.scrollTo(null, trOffsetTop)
984
+ } else if (trOffsetTop + trHeight >= bodyHeight + bodyScrollTop) {
985
+ return $xeTable.scrollTo(null, bodyScrollTop + trHeight)
986
+ }
987
+ } else {
988
+ // 如果是虚拟渲染滚动
989
+ if (scrollYLoad) {
990
+ const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
991
+ if (!isCustomCellHeight && isAllOverflow) {
992
+ return $xeTable.scrollTo(null, ($xeTable.findRowIndexOf(afterFullData, row) - 1) * defaultRowHeight)
993
+ }
994
+ const rowRest = fullAllDataRowIdData[rowid] || {}
995
+ const rHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
996
+ const scrollTop = rowRest.oTop
997
+ if (scrollTop < bodyScrollTop) {
998
+ return $xeTable.scrollTo(null, scrollTop - leftFixedWidth - 1)
999
+ }
1000
+ return $xeTable.scrollTo(null, (scrollTop + rHeight) - (bodyHeight - rightFixedWidth - 1))
1001
+ }
1002
+ }
1003
+ }
1004
+ return Promise.resolve()
1005
+ }
1006
+
1007
+ export function colToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isForce: boolean, column: VxeTableDefines.ColumnInfo, row?: any) {
1008
+ const reactData = $xeTable.reactData
1009
+ const internalData = $xeTable.internalData
1010
+
1011
+ const { computeLeftFixedWidth, computeRightFixedWidth } = $xeTable.getComputeMaps()
1012
+ const { scrollXLoad, scrollXLeft } = reactData
1013
+ const { elemStore, visibleColumn } = internalData
1014
+ const leftFixedWidth = computeLeftFixedWidth.value
1015
+ const rightFixedWidth = computeRightFixedWidth.value
1016
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
1017
+ if (column.fixed) {
1018
+ return Promise.resolve()
1019
+ }
1020
+ if (bodyScrollElem) {
1021
+ const bodyWidth = bodyScrollElem.clientWidth
1022
+ const bodyScrollLeft = bodyScrollElem.scrollLeft
1023
+ let tdElem: HTMLTableCellElement | null = null
1024
+ if (row) {
1025
+ const rowid = getRowid($xeTable, row)
1026
+ tdElem = bodyScrollElem.querySelector(`[rowid="${rowid}"] .${column.id}`)
1027
+ }
1028
+ if (!tdElem) {
1029
+ tdElem = bodyScrollElem.querySelector(`.${column.id}`)
1030
+ }
1031
+ if (tdElem) {
1032
+ const tdOffsetLeft = tdElem.offsetLeft + (scrollXLoad ? scrollXLeft : 0)
1033
+ const cellWidth = tdElem.clientWidth
1034
+ // 检测是否在可视区中
1035
+ if (isForce || (
1036
+ !(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
1037
+ !(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth))
1038
+ )) {
1039
+ if (tdOffsetLeft < (bodyScrollLeft + leftFixedWidth)) {
1040
+ return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1)
1041
+ } else if ((tdOffsetLeft + cellWidth - bodyScrollLeft) > (bodyWidth - rightFixedWidth)) {
1042
+ return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1))
1043
+ }
1044
+ }
1045
+ } else {
1046
+ if (scrollXLoad) {
1047
+ let tdOffsetLeft = 0
1048
+ const cellWidth = column.renderWidth
1049
+ for (let i = 0; i < visibleColumn.length; i++) {
1050
+ const currCol = visibleColumn[i]
1051
+ if (currCol === column || currCol.id === column.id) {
1052
+ break
1053
+ }
1054
+ tdOffsetLeft += currCol.renderWidth
1055
+ }
1056
+ // 检测是否在可视区中
1057
+ if (isForce || (
1058
+ !(tdOffsetLeft <= (bodyScrollLeft + leftFixedWidth) && (tdOffsetLeft + cellWidth) > (bodyScrollLeft + leftFixedWidth)) &&
1059
+ !(tdOffsetLeft >= (bodyScrollLeft + leftFixedWidth) && tdOffsetLeft < (bodyScrollLeft + bodyWidth - rightFixedWidth))
1060
+ )) {
1061
+ if (tdOffsetLeft < bodyScrollLeft) {
1062
+ return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1)
1063
+ }
1064
+ return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1))
1065
+ }
1066
+ }
1067
+ }
1068
+ }
1069
+ return Promise.resolve()
1070
+ }