vxe-table 4.10.6-beta.8 → 4.10.6

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 (178) hide show
  1. package/es/grid/src/grid.js +1 -1
  2. package/es/index.css +1 -1
  3. package/es/index.min.css +1 -1
  4. package/es/locale/lang/ar-EG.js +2 -1
  5. package/es/locale/lang/de-DE.js +2 -1
  6. package/es/locale/lang/en-US.js +4 -3
  7. package/es/locale/lang/es-ES.js +2 -1
  8. package/es/locale/lang/fr-FR.js +2 -1
  9. package/es/locale/lang/hu-HU.js +2 -1
  10. package/es/locale/lang/hy-AM.js +2 -1
  11. package/es/locale/lang/it-IT.js +2 -1
  12. package/es/locale/lang/ja-JP.js +2 -1
  13. package/es/locale/lang/ko-KR.js +2 -1
  14. package/es/locale/lang/nb-NO.js +2 -1
  15. package/es/locale/lang/pt-BR.js +2 -1
  16. package/es/locale/lang/ru-RU.js +4 -3
  17. package/es/locale/lang/th-TH.js +2 -1
  18. package/es/locale/lang/ug-CN.js +2 -1
  19. package/es/locale/lang/uk-UA.js +518 -517
  20. package/es/locale/lang/vi-VN.js +2 -1
  21. package/es/locale/lang/zh-CHT.js +2 -1
  22. package/es/locale/lang/zh-CN.js +2 -1
  23. package/es/style.css +1 -1
  24. package/es/style.min.css +1 -1
  25. package/es/table/module/edit/hook.js +7 -7
  26. package/es/table/module/export/hook.js +97 -62
  27. package/es/table/module/keyboard/hook.js +63 -27
  28. package/es/table/src/body.js +128 -81
  29. package/es/table/src/cell.js +41 -55
  30. package/es/table/src/column.js +13 -1
  31. package/es/table/src/columnInfo.js +3 -0
  32. package/es/table/src/emits.js +2 -0
  33. package/es/table/src/footer.js +48 -10
  34. package/es/table/src/header.js +70 -168
  35. package/es/table/src/props.js +14 -4
  36. package/es/table/src/table.js +884 -426
  37. package/es/table/src/util.js +77 -62
  38. package/es/table/style.css +253 -189
  39. package/es/table/style.min.css +1 -1
  40. package/es/ui/index.js +26 -11
  41. package/es/ui/src/log.js +1 -1
  42. package/es/vxe-table/style.css +253 -189
  43. package/es/vxe-table/style.min.css +1 -1
  44. package/lib/grid/src/grid.js +1 -1
  45. package/lib/grid/src/grid.min.js +1 -1
  46. package/lib/index.css +1 -1
  47. package/lib/index.min.css +1 -1
  48. package/lib/index.umd.js +1533 -917
  49. package/lib/index.umd.min.js +1 -1
  50. package/lib/locale/lang/ar-EG.js +2 -1
  51. package/lib/locale/lang/ar-EG.min.js +1 -1
  52. package/lib/locale/lang/de-DE.js +2 -1
  53. package/lib/locale/lang/de-DE.min.js +1 -1
  54. package/lib/locale/lang/en-US.js +4 -3
  55. package/lib/locale/lang/en-US.min.js +1 -1
  56. package/lib/locale/lang/en-US.umd.js +4 -3
  57. package/lib/locale/lang/es-ES.js +2 -1
  58. package/lib/locale/lang/es-ES.min.js +1 -1
  59. package/lib/locale/lang/es-ES.umd.js +2 -1
  60. package/lib/locale/lang/fr-FR.js +2 -1
  61. package/lib/locale/lang/fr-FR.min.js +1 -1
  62. package/lib/locale/lang/hu-HU.js +2 -1
  63. package/lib/locale/lang/hu-HU.min.js +1 -1
  64. package/lib/locale/lang/hu-HU.umd.js +2 -1
  65. package/lib/locale/lang/hy-AM.js +2 -1
  66. package/lib/locale/lang/hy-AM.min.js +1 -1
  67. package/lib/locale/lang/it-IT.js +2 -1
  68. package/lib/locale/lang/it-IT.min.js +1 -1
  69. package/lib/locale/lang/ja-JP.js +2 -1
  70. package/lib/locale/lang/ja-JP.min.js +1 -1
  71. package/lib/locale/lang/ja-JP.umd.js +2 -1
  72. package/lib/locale/lang/ko-KR.js +2 -1
  73. package/lib/locale/lang/ko-KR.min.js +1 -1
  74. package/lib/locale/lang/ko-KR.umd.js +2 -1
  75. package/lib/locale/lang/nb-NO.js +2 -1
  76. package/lib/locale/lang/nb-NO.min.js +1 -1
  77. package/lib/locale/lang/pt-BR.js +2 -1
  78. package/lib/locale/lang/pt-BR.min.js +1 -1
  79. package/lib/locale/lang/pt-BR.umd.js +2 -1
  80. package/lib/locale/lang/ru-RU.js +4 -3
  81. package/lib/locale/lang/ru-RU.min.js +1 -1
  82. package/lib/locale/lang/ru-RU.umd.js +4 -3
  83. package/lib/locale/lang/th-TH.js +2 -1
  84. package/lib/locale/lang/th-TH.min.js +1 -1
  85. package/lib/locale/lang/ug-CN.js +2 -1
  86. package/lib/locale/lang/ug-CN.min.js +1 -1
  87. package/lib/locale/lang/uk-UA.js +518 -517
  88. package/lib/locale/lang/uk-UA.min.js +1 -1
  89. package/lib/locale/lang/uk-UA.umd.js +518 -517
  90. package/lib/locale/lang/vi-VN.js +2 -1
  91. package/lib/locale/lang/vi-VN.min.js +1 -1
  92. package/lib/locale/lang/zh-CHT.js +2 -1
  93. package/lib/locale/lang/zh-CHT.min.js +1 -1
  94. package/lib/locale/lang/zh-CN.js +2 -1
  95. package/lib/locale/lang/zh-CN.min.js +1 -1
  96. package/lib/locale/lang/zh-CN.umd.js +2 -1
  97. package/lib/style.css +1 -1
  98. package/lib/style.min.css +1 -1
  99. package/lib/table/module/edit/hook.js +7 -2
  100. package/lib/table/module/edit/hook.min.js +1 -1
  101. package/lib/table/module/export/hook.js +97 -57
  102. package/lib/table/module/export/hook.min.js +1 -1
  103. package/lib/table/module/keyboard/hook.js +71 -28
  104. package/lib/table/module/keyboard/hook.min.js +1 -1
  105. package/lib/table/src/body.js +129 -80
  106. package/lib/table/src/body.min.js +1 -1
  107. package/lib/table/src/cell.js +32 -42
  108. package/lib/table/src/cell.min.js +1 -1
  109. package/lib/table/src/column.js +13 -1
  110. package/lib/table/src/column.min.js +1 -1
  111. package/lib/table/src/columnInfo.js +3 -0
  112. package/lib/table/src/columnInfo.min.js +1 -1
  113. package/lib/table/src/emits.js +1 -1
  114. package/lib/table/src/emits.min.js +1 -1
  115. package/lib/table/src/footer.js +48 -8
  116. package/lib/table/src/footer.min.js +1 -1
  117. package/lib/table/src/header.js +54 -181
  118. package/lib/table/src/header.min.js +1 -1
  119. package/lib/table/src/props.js +14 -4
  120. package/lib/table/src/props.min.js +1 -1
  121. package/lib/table/src/table.js +935 -417
  122. package/lib/table/src/table.min.js +1 -1
  123. package/lib/table/src/util.js +100 -82
  124. package/lib/table/src/util.min.js +1 -1
  125. package/lib/table/style/style.css +253 -189
  126. package/lib/table/style/style.min.css +1 -1
  127. package/lib/ui/index.js +26 -11
  128. package/lib/ui/index.min.js +1 -1
  129. package/lib/ui/src/log.js +1 -1
  130. package/lib/ui/src/log.min.js +1 -1
  131. package/lib/vxe-table/style/style.css +253 -189
  132. package/lib/vxe-table/style/style.min.css +1 -1
  133. package/package.json +2 -2
  134. package/packages/grid/src/grid.ts +1 -1
  135. package/packages/locale/lang/ar-EG.ts +2 -1
  136. package/packages/locale/lang/de-DE.ts +2 -1
  137. package/packages/locale/lang/en-US.ts +4 -3
  138. package/packages/locale/lang/es-ES.ts +2 -1
  139. package/packages/locale/lang/fr-FR.ts +2 -1
  140. package/packages/locale/lang/hu-HU.ts +2 -1
  141. package/packages/locale/lang/hy-AM.ts +2 -1
  142. package/packages/locale/lang/it-IT.ts +2 -1
  143. package/packages/locale/lang/ja-JP.ts +2 -1
  144. package/packages/locale/lang/ko-KR.ts +2 -1
  145. package/packages/locale/lang/nb-NO.ts +2 -1
  146. package/packages/locale/lang/pt-BR.ts +2 -1
  147. package/packages/locale/lang/ru-RU.ts +4 -3
  148. package/packages/locale/lang/th-TH.ts +2 -1
  149. package/packages/locale/lang/ug-CN.ts +2 -1
  150. package/packages/locale/lang/uk-UA.ts +518 -517
  151. package/packages/locale/lang/vi-VN.ts +2 -1
  152. package/packages/locale/lang/zh-CHT.ts +2 -1
  153. package/packages/locale/lang/zh-CN.ts +2 -1
  154. package/packages/table/module/edit/hook.ts +7 -7
  155. package/packages/table/module/export/hook.ts +118 -65
  156. package/packages/table/module/keyboard/hook.ts +59 -25
  157. package/packages/table/src/body.ts +148 -91
  158. package/packages/table/src/cell.ts +41 -63
  159. package/packages/table/src/column.ts +13 -1
  160. package/packages/table/src/columnInfo.ts +3 -0
  161. package/packages/table/src/emits.ts +5 -1
  162. package/packages/table/src/footer.ts +51 -11
  163. package/packages/table/src/header.ts +70 -168
  164. package/packages/table/src/props.ts +14 -5
  165. package/packages/table/src/table.ts +890 -428
  166. package/packages/table/src/util.ts +81 -62
  167. package/packages/ui/index.ts +25 -10
  168. package/styles/components/table.scss +319 -271
  169. package/styles/theme/base.scss +4 -6
  170. package/styles/theme/dark.scss +1 -0
  171. package/styles/theme/light.scss +1 -0
  172. package/styles/variable.scss +1 -1
  173. /package/es/{iconfont.1736840923205.ttf → iconfont.1738985856004.ttf} +0 -0
  174. /package/es/{iconfont.1736840923205.woff → iconfont.1738985856004.woff} +0 -0
  175. /package/es/{iconfont.1736840923205.woff2 → iconfont.1738985856004.woff2} +0 -0
  176. /package/lib/{iconfont.1736840923205.ttf → iconfont.1738985856004.ttf} +0 -0
  177. /package/lib/{iconfont.1736840923205.woff → iconfont.1738985856004.woff} +0 -0
  178. /package/lib/{iconfont.1736840923205.woff2 → iconfont.1738985856004.woff2} +0 -0
@@ -1,6 +1,6 @@
1
1
  import { defineComponent, h, ComponentPublicInstance, reactive, ref, Ref, provide, inject, nextTick, onActivated, onDeactivated, onBeforeUnmount, onUnmounted, watch, computed, onMounted } from 'vue'
2
2
  import XEUtils from 'xe-utils'
3
- import { browse, initTpImg, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft } from '../../ui/src/dom'
3
+ import { browse, initTpImg, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft } from '../../ui/src/dom'
4
4
  import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils'
5
5
  import { VxeUI } from '../../ui'
6
6
  import Cell from './cell'
@@ -43,7 +43,6 @@ export default defineComponent({
43
43
  const { computeSize } = useFns.useSize(props)
44
44
 
45
45
  const reactData = reactive<TableReactData>({
46
- isCalcColumn: false,
47
46
  // 低性能的静态列
48
47
  staticColumns: [],
49
48
  // 渲染的列分组
@@ -258,7 +257,8 @@ export default defineComponent({
258
257
 
259
258
  scrollVMLoading: false,
260
259
 
261
- isCalcCellHeight: 0,
260
+ calcCellHeightFlag: 0,
261
+ resizeHeightFlag: 0,
262
262
 
263
263
  isCustomStatus: false,
264
264
 
@@ -268,8 +268,9 @@ export default defineComponent({
268
268
  dragCol: null,
269
269
  dragTipText: '',
270
270
 
271
- _isResize: false,
272
- isLoading: false
271
+ isDragResize: false,
272
+ isRowLoading: false,
273
+ isColLoading: false
273
274
  })
274
275
 
275
276
  const internalData: TableInternalData = {
@@ -344,10 +345,6 @@ export default defineComponent({
344
345
  fullDataRowIdData: {},
345
346
  fullColumnIdData: {},
346
347
  fullColumnFieldData: {},
347
- // 列选取状态
348
- columnStatusMaps: {},
349
- // 行选取状态
350
- rowStatusMaps: {},
351
348
  // prevDragRow: null,
352
349
 
353
350
  inited: false,
@@ -380,8 +377,8 @@ export default defineComponent({
380
377
 
381
378
  const refLeftContainer = ref() as Ref<HTMLDivElement>
382
379
  const refRightContainer = ref() as Ref<HTMLDivElement>
383
- const refCellResizeBar = ref() as Ref<HTMLDivElement>
384
- const refCellResizeTip = ref() as Ref<HTMLDivElement>
380
+ const refColResizeBar = ref() as Ref<HTMLDivElement>
381
+ const refRowResizeBar = ref() as Ref<HTMLDivElement>
385
382
  const refEmptyPlaceholder = ref() as Ref<HTMLDivElement>
386
383
 
387
384
  const refDragTipElem = ref<HTMLDivElement>()
@@ -445,11 +442,11 @@ export default defineComponent({
445
442
  })
446
443
 
447
444
  const computeVirtualXOpts = computed(() => {
448
- return Object.assign({}, getConfig().table.scrollX, getConfig().table.virtualXConfig, props.scrollX, props.virtualXConfig)
445
+ return Object.assign({}, getConfig().table.scrollX, getConfig().table.virtualXConfig, props.scrollX, props.virtualXConfig) as VxeTablePropTypes.VirtualXConfig
449
446
  })
450
447
 
451
448
  const computeVirtualYOpts = computed(() => {
452
- return Object.assign({}, getConfig().table.scrollY, getConfig().table.virtualYConfig, props.scrollY, props.virtualYConfig)
449
+ return Object.assign({}, getConfig().table.scrollY, getConfig().table.virtualYConfig, props.scrollY, props.virtualYConfig) as VxeTablePropTypes.VirtualYConfig
453
450
  })
454
451
 
455
452
  const computeScrollbarOpts = computed(() => {
@@ -487,7 +484,7 @@ export default defineComponent({
487
484
  const computeDefaultRowHeight = computed(() => {
488
485
  const vSize = computeSize.value
489
486
  const rowHeightMaps = computeRowHeightMaps.value
490
- return rowHeightMaps[vSize || 'default']
487
+ return rowHeightMaps[vSize || 'default'] || 18
491
488
  })
492
489
 
493
490
  const computeColumnOpts = computed(() => {
@@ -495,7 +492,15 @@ export default defineComponent({
495
492
  })
496
493
 
497
494
  const computeCellOpts = computed(() => {
498
- return Object.assign({}, getConfig().table.cellConfig, props.cellConfig) as VxeTablePropTypes.CellConfig
495
+ return Object.assign({}, getConfig().table.cellConfig, props.cellConfig)
496
+ })
497
+
498
+ const computeHeaderCellOpts = computed(() => {
499
+ return Object.assign({}, getConfig().table.headerCellConfig, props.headerCellConfig)
500
+ })
501
+
502
+ const computeFooterCellOpts = computed(() => {
503
+ return Object.assign({}, getConfig().table.footerCellConfig, props.footerCellConfig)
499
504
  })
500
505
 
501
506
  const computeRowOpts = computed(() => {
@@ -534,6 +539,17 @@ export default defineComponent({
534
539
  return Object.assign({}, getConfig().tooltip, getConfig().table.tooltipConfig, props.tooltipConfig)
535
540
  })
536
541
 
542
+ const computeTableTipConfig = computed(() => {
543
+ const { tooltipStore } = reactData
544
+ const tooltipOpts = computeTooltipOpts.value
545
+ return Object.assign({}, tooltipOpts, tooltipStore.currOpts)
546
+ })
547
+
548
+ const computeValidTipConfig = computed(() => {
549
+ const tooltipOpts = computeTooltipOpts.value
550
+ return Object.assign({}, tooltipOpts)
551
+ })
552
+
537
553
  const computeEditOpts = computed(() => {
538
554
  return Object.assign({}, getConfig().table.editConfig, props.editConfig) as VxeTablePropTypes.EditOpts
539
555
  })
@@ -755,8 +771,8 @@ export default defineComponent({
755
771
  refTableRightFooter,
756
772
  refLeftContainer,
757
773
  refRightContainer,
758
- refCellResizeBar,
759
- refCellResizeTip,
774
+ refColResizeBar,
775
+ refRowResizeBar,
760
776
  refScrollXVirtualElem,
761
777
  refScrollYVirtualElem,
762
778
  refScrollXHandleElem,
@@ -779,6 +795,8 @@ export default defineComponent({
779
795
  computeScrollYThreshold,
780
796
  computeDefaultRowHeight,
781
797
  computeCellOpts,
798
+ computeHeaderCellOpts,
799
+ computeFooterCellOpts,
782
800
  computeRowOpts,
783
801
  computeRowDragOpts,
784
802
  computeColumnDragOpts,
@@ -920,49 +938,58 @@ export default defineComponent({
920
938
  }
921
939
 
922
940
  const computeRowHeight = () => {
941
+ const { isAllOverflow } = reactData
923
942
  const tableHeader = refTableHeader.value
924
943
  const tableBody = refTableBody.value
925
944
  const tableBodyElem = tableBody ? tableBody.$el as HTMLDivElement : null
926
945
  const defaultRowHeight = computeDefaultRowHeight.value
927
946
  let rowHeight = 0
928
- if (tableBodyElem) {
929
- const tableHeaderElem = tableHeader ? tableHeader.$el as HTMLDivElement : null
930
- let firstTrElem
931
- firstTrElem = tableBodyElem.querySelector('tr')
932
- if (!firstTrElem && tableHeaderElem) {
933
- firstTrElem = tableHeaderElem.querySelector('tr')
947
+ if (isAllOverflow) {
948
+ if (tableBodyElem) {
949
+ const tableHeaderElem = tableHeader ? tableHeader.$el as HTMLDivElement : null
950
+ let firstTrElem
951
+ firstTrElem = tableBodyElem.querySelector('tr')
952
+ if (!firstTrElem && tableHeaderElem) {
953
+ firstTrElem = tableHeaderElem.querySelector('tr')
954
+ }
955
+ if (firstTrElem) {
956
+ rowHeight = firstTrElem.clientHeight
957
+ }
934
958
  }
935
- if (firstTrElem) {
936
- rowHeight = firstTrElem.clientHeight
959
+ if (!rowHeight) {
960
+ rowHeight = defaultRowHeight
937
961
  }
938
- }
939
- if (!rowHeight) {
962
+ } else {
940
963
  rowHeight = defaultRowHeight
941
964
  }
942
965
  // 最低支持 18px 行高
943
966
  return Math.max(18, rowHeight)
944
967
  }
945
968
 
946
- const handleVirtualYVisible = () => {
947
- const { showOverflow } = props
948
- const { rowHeight } = reactData
949
- const { elemStore, afterFullData, fullAllDataRowIdData } = internalData
969
+ const handleVirtualYVisible = (currScrollTop?: number) => {
970
+ const { isAllOverflow } = reactData
971
+ const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
972
+ const rowOpts = computeRowOpts.value
973
+ const cellOpts = computeCellOpts.value
974
+ const defaultRowHeight = computeDefaultRowHeight.value
950
975
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
951
976
  if (bodyScrollElem) {
952
- const { scrollTop, clientHeight } = bodyScrollElem
977
+ const clientHeight = bodyScrollElem.clientHeight
978
+ const scrollTop = XEUtils.isNumber(currScrollTop) ? currScrollTop : bodyScrollElem.scrollTop
953
979
  const endHeight = scrollTop + clientHeight
954
980
  let toVisibleIndex = -1
955
981
  let offsetTop = 0
956
982
  let visibleSize = 0
957
- if (showOverflow) {
958
- toVisibleIndex = Math.floor(scrollTop / rowHeight)
959
- visibleSize = Math.ceil(clientHeight / rowHeight) + 1
983
+ const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
984
+ if (!isCustomCellHeight && isAllOverflow) {
985
+ toVisibleIndex = Math.floor(scrollTop / defaultRowHeight)
986
+ visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1
960
987
  } else {
961
988
  for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
962
989
  const row = afterFullData[rIndex]
963
990
  const rowid = getRowid($xeTable, row)
964
- const rowRest = fullAllDataRowIdData[rowid]
965
- offsetTop += rowRest ? (rowRest.height || rowHeight) : rowHeight
991
+ const rowRest = fullAllDataRowIdData[rowid] || {}
992
+ offsetTop += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
966
993
  if (toVisibleIndex === -1 && scrollTop < offsetTop) {
967
994
  toVisibleIndex = rIndex
968
995
  }
@@ -1300,55 +1327,39 @@ export default defineComponent({
1300
1327
  }
1301
1328
 
1302
1329
  const calcColumnAutoWidth = (column: VxeTableDefines.ColumnInfo, wrapperEl: HTMLDivElement) => {
1303
- const cellElList = wrapperEl.querySelectorAll(`.vxe-header--column.${column.id}>.vxe-cell,.vxe-body--column.${column.id}>.vxe-cell,.vxe-footer--column.${column.id}>.vxe-cell`)
1304
- const firstCellEl = cellElList[0]
1305
- let paddingSize = 0
1306
- if (firstCellEl) {
1307
- const cellStyle = getComputedStyle(firstCellEl)
1308
- paddingSize = Math.floor(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight)) + 2
1309
- }
1310
- let colWidth = column.renderAutoWidth - paddingSize
1311
- XEUtils.arrayEach(cellElList, (itemEl) => {
1312
- const cellEl = itemEl as HTMLElement
1313
- const thElem = cellEl.parentElement as HTMLElement
1314
- let titleWidth = 0
1315
- if (`${thElem.tagName}`.toLowerCase() === 'th') {
1316
- XEUtils.arrayEach(cellEl.children, (btnEl) => {
1317
- titleWidth += (btnEl as HTMLElement).offsetWidth + 1
1318
- })
1319
- } else {
1320
- const labelEl = cellEl.firstElementChild as HTMLElement
1321
- if (labelEl) {
1322
- titleWidth = labelEl.offsetWidth
1323
- }
1324
- }
1325
- if (titleWidth) {
1326
- colWidth = Math.max(colWidth, Math.ceil(titleWidth) + 4)
1327
- }
1328
- })
1329
- return colWidth + paddingSize
1330
+ const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[colid="${column.id}"]`)
1331
+ let leftRightPadding = 0
1332
+ const firstCellEl = cellElemList[0]
1333
+ if (firstCellEl && firstCellEl.parentElement) {
1334
+ const cellStyle = getComputedStyle(firstCellEl.parentElement)
1335
+ leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight))
1336
+ }
1337
+ let colWidth = column.renderAutoWidth - leftRightPadding
1338
+ for (let i = 0; i < cellElemList.length; i++) {
1339
+ const celEl = cellElemList[i] as HTMLDivElement
1340
+ colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0)
1341
+ }
1342
+ return colWidth + leftRightPadding
1330
1343
  }
1331
1344
 
1332
1345
  const calcCellWidth = () => {
1333
1346
  const autoWidthColumnList = computeAutoWidthColumnList.value
1334
- reactData.isCalcColumn = true
1335
- return nextTick().then(() => {
1336
- const { fullColumnIdData } = internalData
1337
- const el = refElem.value
1338
- if (el) {
1339
- autoWidthColumnList.forEach(column => {
1340
- const colid = column.id
1341
- const colRest = fullColumnIdData[colid]
1342
- const colWidth = calcColumnAutoWidth(column, el)
1343
- if (colRest) {
1344
- colRest.width = Math.max(colWidth, colRest.width)
1345
- }
1346
- column.renderAutoWidth = colWidth
1347
- })
1348
- $xeTable.analyColumnWidth()
1349
- }
1350
- reactData.isCalcColumn = false
1351
- })
1347
+ const { fullColumnIdData } = internalData
1348
+ const el = refElem.value
1349
+ if (el) {
1350
+ el.setAttribute('data-calc-col', 'Y')
1351
+ autoWidthColumnList.forEach(column => {
1352
+ const colid = column.id
1353
+ const colRest = fullColumnIdData[colid]
1354
+ const colWidth = calcColumnAutoWidth(column, el)
1355
+ if (colRest) {
1356
+ colRest.width = Math.max(colWidth, colRest.width)
1357
+ }
1358
+ column.renderAutoWidth = colWidth
1359
+ })
1360
+ $xeTable.analyColumnWidth()
1361
+ el.removeAttribute('data-calc-col')
1362
+ }
1352
1363
  }
1353
1364
 
1354
1365
  /**
@@ -1390,39 +1401,39 @@ export default defineComponent({
1390
1401
  })
1391
1402
  // 最小自适应
1392
1403
  autoMinList.forEach((column) => {
1393
- const scaleWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth))
1394
- tableWidth += scaleWidth
1395
- column.renderWidth = scaleWidth
1404
+ const caWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth))
1405
+ tableWidth += caWidth
1406
+ column.renderWidth = caWidth
1396
1407
  })
1397
1408
  // 最小百分比
1398
1409
  scaleMinList.forEach((column) => {
1399
- const scaleWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth)
1400
- tableWidth += scaleWidth
1401
- column.renderWidth = scaleWidth
1410
+ const smWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth)
1411
+ tableWidth += smWidth
1412
+ column.renderWidth = smWidth
1402
1413
  })
1403
1414
  // 固定百分比
1404
1415
  scaleList.forEach((column) => {
1405
- const scaleWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth)
1406
- tableWidth += scaleWidth
1407
- column.renderWidth = scaleWidth
1416
+ const sfWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth)
1417
+ tableWidth += sfWidth
1418
+ column.renderWidth = sfWidth
1408
1419
  })
1409
1420
  // 固定宽
1410
1421
  pxList.forEach((column) => {
1411
- const width = XEUtils.toInteger(column.width)
1412
- tableWidth += width
1413
- column.renderWidth = width
1422
+ const pWidth = XEUtils.toInteger(column.width)
1423
+ tableWidth += pWidth
1424
+ column.renderWidth = pWidth
1414
1425
  })
1415
1426
  // 自适应宽
1416
1427
  autoList.forEach((column) => {
1417
- const width = Math.max(60, XEUtils.toInteger(column.renderAutoWidth))
1418
- tableWidth += width
1419
- column.renderWidth = width
1428
+ const aWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth))
1429
+ tableWidth += aWidth
1430
+ column.renderWidth = aWidth
1420
1431
  })
1421
1432
  // 调整了列宽
1422
1433
  resizeList.forEach((column) => {
1423
- const width = XEUtils.toInteger(column.resizeWidth)
1424
- tableWidth += width
1425
- column.renderWidth = width
1434
+ const reWidth = XEUtils.toInteger(column.resizeWidth)
1435
+ tableWidth += reWidth
1436
+ column.renderWidth = reWidth
1426
1437
  })
1427
1438
  remainWidth -= tableWidth
1428
1439
  meanWidth = remainWidth > 0 ? Math.floor(remainWidth / (scaleMinList.length + pxMinList.length + autoMinList.length + remainList.length)) : 0
@@ -1462,7 +1473,7 @@ export default defineComponent({
1462
1473
  }
1463
1474
  const tableHeight = bodyElem.offsetHeight
1464
1475
  const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight
1465
- reactData.scrollbarWidth = overflowY ? Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth) : 0
1476
+ reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth)
1466
1477
  reactData.overflowY = overflowY
1467
1478
  internalData.tableWidth = tableWidth
1468
1479
  internalData.tableHeight = tableHeight
@@ -1472,7 +1483,7 @@ export default defineComponent({
1472
1483
  const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0
1473
1484
  const overflowX = tableWidth > bodyWidth
1474
1485
  const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0
1475
- reactData.scrollbarHeight = overflowX ? Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight) : 0
1486
+ reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight)
1476
1487
  internalData.headerHeight = headerHeight
1477
1488
  internalData.footerHeight = footerHeight
1478
1489
  reactData.overflowX = overflowX
@@ -1483,58 +1494,37 @@ export default defineComponent({
1483
1494
  }
1484
1495
  }
1485
1496
 
1486
- // const updateCellOffset = () => {
1487
- // const { chTimeout, chRunTime } = internalData
1488
- // if (chTimeout) {
1489
- // clearTimeout(chTimeout)
1490
- // }
1491
- // if (!chRunTime || chRunTime + 10 < Date.now()) {
1492
- // internalData.chRunTime = Date.now()
1493
- // }
1494
- // internalData.chTimeout = setTimeout(() => {
1495
- // internalData.chRunTime = undefined
1496
- // internalData.chTimeout = undefined
1497
- // }, 80)
1498
- // }
1497
+ const calcCellAutoHeight = (rowRest: VxeTableDefines.RowCacheItem, wrapperEl: HTMLDivElement) => {
1498
+ const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`)
1499
+ let colHeight = rowRest.height
1500
+ for (let i = 0; i < cellElemList.length; i++) {
1501
+ const cellElem = cellElemList[i] as HTMLElement
1502
+ const tdEl = cellElem.parentElement as HTMLTableCellElement
1503
+ const topBottomPadding = Math.ceil(XEUtils.toNumber(tdEl.style.paddingTop) + XEUtils.toNumber(tdEl.style.paddingBottom))
1504
+ const cellHeight = cellElem ? cellElem.clientHeight : 0
1505
+ colHeight = Math.max(colHeight - topBottomPadding, Math.ceil(cellHeight))
1506
+ }
1507
+ return colHeight
1508
+ }
1499
1509
 
1500
1510
  const calcCellHeight = () => {
1501
- const { showOverflow } = props
1502
- const { tableData, scrollXLoad } = reactData
1511
+ const { tableData, isAllOverflow, scrollYLoad, scrollXLoad } = reactData
1503
1512
  const { fullAllDataRowIdData } = internalData
1513
+ const defaultRowHeight = computeDefaultRowHeight.value
1504
1514
  const el = refElem.value
1505
- if (!showOverflow && el) {
1506
- let paddingTop = 0
1507
- let paddingBottom = 0
1508
- let calcPadding = false
1515
+ if (!isAllOverflow && scrollYLoad && el) {
1516
+ el.setAttribute('data-calc-row', 'Y')
1509
1517
  tableData.forEach(row => {
1510
1518
  const rowid = getRowid($xeTable, row)
1511
1519
  const rowRest = fullAllDataRowIdData[rowid]
1512
- const cellList = el.querySelectorAll(`.vxe-body--row[rowid="${rowid}"]>.vxe-body--column>.vxe-cell`)
1513
- if (rowRest && cellList.length) {
1514
- let height = 0
1515
- for (let i = 0; i < cellList.length; i++) {
1516
- const cellElem = cellList[i] as HTMLElement
1517
- const tdEl = cellElem.parentElement as HTMLTableCellElement
1518
- if (!tdEl || !tdEl.clientWidth) {
1519
- break
1520
- }
1521
- if (!calcPadding) {
1522
- paddingTop = XEUtils.toNumber(getComputedStyle(tdEl).paddingTop)
1523
- paddingBottom = XEUtils.toNumber(getComputedStyle(tdEl).paddingBottom)
1524
- calcPadding = true
1525
- }
1526
- let cellHeight = paddingTop + paddingBottom
1527
- if (cellElem) {
1528
- cellHeight += cellElem.clientHeight
1529
- }
1530
- height = Math.max(height, cellHeight)
1531
- }
1532
- rowRest.height = scrollXLoad ? Math.max(rowRest.height, height) : height
1520
+ if (rowRest) {
1521
+ const reHeight = calcCellAutoHeight(rowRest, el)
1522
+ rowRest.height = Math.max(defaultRowHeight, scrollXLoad ? Math.max(rowRest.height, reHeight) : reHeight)
1533
1523
  }
1524
+ el.removeAttribute('data-calc-row')
1534
1525
  })
1535
- reactData.isCalcCellHeight++
1526
+ reactData.calcCellHeightFlag++
1536
1527
  }
1537
- // updateCellOffset()
1538
1528
  }
1539
1529
 
1540
1530
  const getOrderField = (column: VxeTableDefines.ColumnInfo) => {
@@ -1568,7 +1558,7 @@ export default defineComponent({
1568
1558
  rowRest.seq = seq
1569
1559
  rowRest._index = index
1570
1560
  } else {
1571
- const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 }
1561
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
1572
1562
  fullAllDataRowIdData[rowid] = rest
1573
1563
  fullDataRowIdData[rowid] = rest
1574
1564
  }
@@ -1597,7 +1587,7 @@ export default defineComponent({
1597
1587
  rowRest.seq = seq
1598
1588
  rowRest.treeIndex = index
1599
1589
  } else {
1600
- const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 }
1590
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
1601
1591
  fullAllDataRowIdData[rowid] = rest
1602
1592
  fullDataRowIdData[rowid] = rest
1603
1593
  }
@@ -1786,14 +1776,16 @@ export default defineComponent({
1786
1776
  }
1787
1777
 
1788
1778
  const updateStyle = () => {
1789
- const { border, showOverflow: allColumnOverflow, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
1790
- const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, scrollbarWidth, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
1779
+ const { border, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
1780
+ const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
1791
1781
  const { visibleColumn, fullColumnIdData, tableHeight, tableWidth, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData
1792
1782
  const el = refElem.value
1793
1783
  if (!el) {
1794
1784
  return
1795
1785
  }
1796
1786
  const containerList = ['main', 'left', 'right']
1787
+ const osbWidth = overflowY ? scrollbarWidth : 0
1788
+ const osbHeight = overflowX ? scrollbarHeight : 0
1797
1789
  const emptyPlaceholderElem = refEmptyPlaceholder.value
1798
1790
  const cellOffsetWidth = computeCellOffsetWidth.value
1799
1791
  const mouseOpts = computeMouseOpts.value
@@ -1801,17 +1793,17 @@ export default defineComponent({
1801
1793
  const bodyTableElem = getRefElem(elemStore['main-body-table'])
1802
1794
  if (emptyPlaceholderElem) {
1803
1795
  emptyPlaceholderElem.style.top = `${headerHeight}px`
1804
- emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - scrollbarHeight}px` : ''
1796
+ emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : ''
1805
1797
  }
1806
1798
 
1807
1799
  let bodyHeight = 0
1808
1800
  let bodyMaxHeight = 0
1809
- const bodyMinHeight = customMinHeight - headerHeight - footerHeight - scrollbarHeight
1801
+ const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight
1810
1802
  if (customMaxHeight) {
1811
- bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - scrollbarHeight)
1803
+ bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight)
1812
1804
  }
1813
1805
  if (customHeight) {
1814
- bodyHeight = customHeight - headerHeight - footerHeight - scrollbarHeight
1806
+ bodyHeight = customHeight - headerHeight - footerHeight - osbHeight
1815
1807
  }
1816
1808
  if (!bodyHeight) {
1817
1809
  if (bodyTableElem) {
@@ -1830,28 +1822,28 @@ export default defineComponent({
1830
1822
  const scrollbarXToTop = computeScrollbarXToTop.value
1831
1823
  const scrollXVirtualEl = refScrollXVirtualElem.value
1832
1824
  if (scrollXVirtualEl) {
1833
- scrollXVirtualEl.style.height = `${scrollbarHeight}px`
1834
- scrollXVirtualEl.style.visibility = scrollbarHeight ? 'visible' : 'hidden'
1825
+ scrollXVirtualEl.style.height = `${osbHeight}px`
1826
+ scrollXVirtualEl.style.visibility = overflowX ? 'visible' : 'hidden'
1835
1827
  }
1836
1828
  const xWrapperEl = refScrollXWrapperElem.value
1837
1829
  if (xWrapperEl) {
1838
- xWrapperEl.style.left = scrollbarXToTop ? `${scrollbarWidth}px` : ''
1839
- xWrapperEl.style.width = `${el.clientWidth - scrollbarWidth}px`
1830
+ xWrapperEl.style.left = scrollbarXToTop ? `${osbWidth}px` : ''
1831
+ xWrapperEl.style.width = `${el.clientWidth - osbWidth}px`
1840
1832
  }
1841
1833
  if (xLeftCornerEl) {
1842
- xLeftCornerEl.style.width = scrollbarXToTop ? `${scrollbarWidth}px` : ''
1843
- xLeftCornerEl.style.display = scrollbarXToTop ? (scrollbarWidth && scrollbarHeight ? 'block' : '') : ''
1834
+ xLeftCornerEl.style.width = scrollbarXToTop ? `${osbWidth}px` : ''
1835
+ xLeftCornerEl.style.display = scrollbarXToTop ? (osbWidth && osbHeight ? 'block' : '') : ''
1844
1836
  }
1845
1837
  if (xRightCornerEl) {
1846
- xRightCornerEl.style.width = scrollbarXToTop ? '' : `${scrollbarWidth}px`
1847
- xRightCornerEl.style.display = scrollbarXToTop ? '' : (scrollbarWidth && scrollbarHeight ? 'block' : '')
1838
+ xRightCornerEl.style.width = scrollbarXToTop ? '' : `${osbWidth}px`
1839
+ xRightCornerEl.style.display = scrollbarXToTop ? '' : (osbWidth && osbHeight ? 'block' : '')
1848
1840
  }
1849
1841
 
1850
1842
  const scrollYVirtualEl = refScrollYVirtualElem.value
1851
1843
  if (scrollYVirtualEl) {
1852
- scrollYVirtualEl.style.width = `${scrollbarWidth}px`
1844
+ scrollYVirtualEl.style.width = `${osbWidth}px`
1853
1845
  scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`
1854
- scrollYVirtualEl.style.visibility = scrollbarWidth ? 'visible' : 'hidden'
1846
+ scrollYVirtualEl.style.visibility = overflowY ? 'visible' : 'hidden'
1855
1847
  }
1856
1848
  const yTopCornerEl = refScrollYTopCornerElem.value
1857
1849
  if (yTopCornerEl) {
@@ -1977,7 +1969,7 @@ export default defineComponent({
1977
1969
  if (wrapperElem) {
1978
1970
  wrapperElem.style.top = `${headerHeight}px`
1979
1971
  }
1980
- fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + scrollbarHeight)}px`
1972
+ fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + osbHeight)}px`
1981
1973
  fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`
1982
1974
  }
1983
1975
 
@@ -1986,7 +1978,7 @@ export default defineComponent({
1986
1978
 
1987
1979
  let isOptimizeMode = false
1988
1980
  // 如果是使用优化模式
1989
- if (scrollXLoad || scrollYLoad || (allColumnOverflow && isAllOverflow)) {
1981
+ if (scrollXLoad || scrollYLoad || isAllOverflow) {
1990
1982
  if (expandColumn || spanMethod || footerSpanMethod) {
1991
1983
  // 如果不支持优化模式
1992
1984
  } else {
@@ -2012,7 +2004,7 @@ export default defineComponent({
2012
2004
  if (tableElem) {
2013
2005
  tableElem.style.width = tWidth ? `${tWidth}px` : ''
2014
2006
  // 兼容性处理
2015
- tableElem.style.paddingRight = scrollbarWidth && fixedType && (browse['-moz'] || browse.safari) ? `${scrollbarWidth}px` : ''
2007
+ tableElem.style.paddingRight = osbWidth && fixedType && (browse['-moz'] || browse.safari) ? `${osbWidth}px` : ''
2016
2008
  }
2017
2009
  const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`])
2018
2010
  if (emptyBlockElem) {
@@ -2052,7 +2044,7 @@ export default defineComponent({
2052
2044
  // 如果是固定列
2053
2045
  if (fixedWrapperElem) {
2054
2046
  if (wrapperElem) {
2055
- wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - scrollbarHeight : tableHeight + headerHeight}px`
2047
+ wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - osbHeight : tableHeight + headerHeight}px`
2056
2048
  }
2057
2049
  }
2058
2050
  }
@@ -2075,7 +2067,7 @@ export default defineComponent({
2075
2067
  } else if (layout === 'footer') {
2076
2068
  cellOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow
2077
2069
  } else {
2078
- cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ? allColumnOverflow : showOverflow
2070
+ cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ? isAllOverflow : showOverflow
2079
2071
  }
2080
2072
  const showEllipsis = cellOverflow === 'ellipsis'
2081
2073
  const showTitle = cellOverflow === 'title'
@@ -2601,13 +2593,13 @@ export default defineComponent({
2601
2593
  return nextTick().then(() => {
2602
2594
  const { scrollXLoad, scrollYLoad } = reactData
2603
2595
  const { scrollXStore, scrollYStore } = internalData
2604
- const sYOpts = computeSYOpts.value
2605
- const sXOpts = computeSXOpts.value
2596
+ const virtualYOpts = computeVirtualYOpts.value
2597
+ const virtualXOpts = computeVirtualXOpts.value
2606
2598
  // 计算 X 逻辑
2607
2599
  if (scrollXLoad) {
2608
2600
  const { toVisibleIndex: toXVisibleIndex, visibleSize: visibleXSize } = handleVirtualXVisible()
2609
- const offsetXSize = Math.max(0, sXOpts.oSize ? XEUtils.toNumber(sXOpts.oSize) : 0)
2610
- scrollXStore.preloadSize = 4
2601
+ const offsetXSize = Math.max(0, virtualXOpts.oSize ? XEUtils.toNumber(virtualXOpts.oSize) : 0)
2602
+ scrollXStore.preloadSize = XEUtils.toNumber(virtualXOpts.preSize)
2611
2603
  scrollXStore.offsetSize = offsetXSize
2612
2604
  scrollXStore.visibleSize = visibleXSize
2613
2605
  scrollXStore.endIndex = Math.max(scrollXStore.startIndex + scrollXStore.visibleSize + offsetXSize, scrollXStore.endIndex)
@@ -2619,15 +2611,14 @@ export default defineComponent({
2619
2611
  } else {
2620
2612
  $xeTable.updateScrollXSpace()
2621
2613
  }
2622
- calcCellHeight()
2623
2614
  // 计算 Y 逻辑
2624
2615
  const rowHeight = computeRowHeight()
2625
2616
  ;(scrollYStore as any).rowHeight = rowHeight
2626
2617
  reactData.rowHeight = rowHeight
2627
2618
  const { toVisibleIndex: toYVisibleIndex, visibleSize: visibleYSize } = handleVirtualYVisible()
2628
2619
  if (scrollYLoad) {
2629
- const offsetYSize = Math.max(0, sYOpts.oSize ? XEUtils.toNumber(sYOpts.oSize) : 0)
2630
- scrollYStore.preloadSize = 2
2620
+ const offsetYSize = Math.max(0, virtualYOpts.oSize ? XEUtils.toNumber(virtualYOpts.oSize) : 0)
2621
+ scrollYStore.preloadSize = XEUtils.toNumber(virtualYOpts.preSize)
2631
2622
  scrollYStore.offsetSize = offsetYSize
2632
2623
  scrollYStore.visibleSize = visibleYSize
2633
2624
  scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex)
@@ -2657,7 +2648,6 @@ export default defineComponent({
2657
2648
  return computeScrollLoad().then(() => {
2658
2649
  if (reFull === true) {
2659
2650
  // 初始化时需要在列计算之后再执行优化运算,达到最优显示效果
2660
- calcCellHeight()
2661
2651
  calcCellWidth()
2662
2652
  autoCellWidth()
2663
2653
  updateStyle()
@@ -2670,12 +2660,11 @@ export default defineComponent({
2670
2660
  * 加载表格数据
2671
2661
  * @param {Array} datas 数据
2672
2662
  */
2673
- const loadTableData = (datas: any[]) => {
2674
- const { keepSource, treeConfig, showOverflow } = props
2663
+ const loadTableData = (datas: any[], isReset: boolean) => {
2664
+ const { keepSource, treeConfig } = props
2675
2665
  const { editStore, scrollYLoad: oldScrollYLoad } = reactData
2676
2666
  const { scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop } = internalData
2677
2667
  const treeOpts = computeTreeOpts.value
2678
- const rowOpts = computeRowOpts.value
2679
2668
  const { transform } = treeOpts
2680
2669
  const childrenField = treeOpts.children || treeOpts.childrenField
2681
2670
  let treeData = []
@@ -2720,43 +2709,30 @@ export default defineComponent({
2720
2709
  scrollYStore.endIndex = 1
2721
2710
  scrollXStore.startIndex = 0
2722
2711
  scrollXStore.endIndex = 1
2712
+ reactData.isRowLoading = true
2723
2713
  reactData.scrollVMLoading = false
2724
2714
  editStore.insertMaps = {}
2725
2715
  editStore.removeMaps = {}
2726
2716
  const sYLoad = updateScrollYStatus(fullData)
2717
+ reactData.isDragColMove = false
2727
2718
  reactData.isDragRowMove = false
2728
2719
  // 全量数据
2729
2720
  internalData.tableFullData = fullData
2730
2721
  internalData.tableFullTreeData = treeData
2731
2722
  // 缓存数据
2732
- tablePrivateMethods.cacheRowMap(true)
2723
+ $xeTable.cacheRowMap(true, isReset)
2733
2724
  // 原始数据
2734
2725
  internalData.tableSynchData = datas
2726
+ if (isReset) {
2727
+ internalData.isResizeCellHeight = false
2728
+ reactData.rowExpandedMaps = {}
2729
+ reactData.rowExpandLazyLoadedMaps = {}
2730
+ reactData.treeExpandedMaps = {}
2731
+ reactData.treeExpandLazyLoadedMaps = {}
2732
+ }
2735
2733
  // 克隆原数据,用于显示编辑状态,与编辑值做对比
2736
2734
  if (keepSource) {
2737
- tablePrivateMethods.cacheSourceMap(fullData)
2738
- }
2739
- if (sYLoad) {
2740
- if (showOverflow) {
2741
- if (!rowOpts.height) {
2742
- const errColumn = internalData.tableFullColumn.find(column => column.showOverflow === false)
2743
- if (errColumn) {
2744
- errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
2745
- }
2746
- }
2747
- }
2748
-
2749
- if (process.env.VUE_APP_VXE_ENV === 'development') {
2750
- if (!(props.height || props.maxHeight)) {
2751
- errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}'])
2752
- }
2753
- // if (!props.showOverflow) {
2754
- // warnLog('vxe.error.reqProp', ['table.show-overflow'])
2755
- // }
2756
- if (props.spanMethod) {
2757
- warnLog('vxe.error.scrollErrProp', ['table.span-method'])
2758
- }
2759
- }
2735
+ $xeTable.cacheSourceMap(fullData)
2760
2736
  }
2761
2737
  if ($xeTable.clearCellAreas && props.mouseConfig) {
2762
2738
  $xeTable.clearCellAreas()
@@ -2776,6 +2752,30 @@ export default defineComponent({
2776
2752
  if (sYLoad) {
2777
2753
  scrollYStore.endIndex = scrollYStore.visibleSize
2778
2754
  }
2755
+
2756
+ if (sYLoad) {
2757
+ // if (showOverflow) {
2758
+ // if (!rowOpts.height) {
2759
+ // const errColumn = internalData.tableFullColumn.find(column => column.showOverflow === false)
2760
+ // if (errColumn) {
2761
+ // errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
2762
+ // }
2763
+ // }
2764
+ // }
2765
+
2766
+ if (process.env.VUE_APP_VXE_ENV === 'development') {
2767
+ if (!(props.height || props.maxHeight)) {
2768
+ errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}'])
2769
+ }
2770
+ // if (!props.showOverflow) {
2771
+ // warnLog('vxe.error.reqProp', ['table.show-overflow'])
2772
+ // }
2773
+ if (props.spanMethod) {
2774
+ warnLog('vxe.error.scrollErrProp', ['table.span-method'])
2775
+ }
2776
+ }
2777
+ }
2778
+
2779
2779
  handleReserveStatus()
2780
2780
  tablePrivateMethods.checkSelectionStatus()
2781
2781
  return new Promise<void>(resolve => {
@@ -2793,6 +2793,8 @@ export default defineComponent({
2793
2793
  if (sYOpts.scrollToTopOnChange) {
2794
2794
  targetScrollTop = 0
2795
2795
  }
2796
+ reactData.isRowLoading = false
2797
+ calcCellHeight()
2796
2798
  // 是否变更虚拟滚动
2797
2799
  if (oldScrollYLoad === sYLoad) {
2798
2800
  restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
@@ -3026,13 +3028,12 @@ export default defineComponent({
3026
3028
  internalData.collectColumn = collectColumn
3027
3029
  const tableFullColumn = getColumnList(collectColumn)
3028
3030
  internalData.tableFullColumn = tableFullColumn
3029
- reactData.isLoading = true
3031
+ reactData.isColLoading = true
3030
3032
  reactData.isDragColMove = false
3031
3033
  initColumnSort()
3032
3034
  return Promise.resolve(
3033
3035
  restoreCustomStorage()
3034
3036
  ).then(() => {
3035
- reactData.isLoading = false
3036
3037
  cacheColumnMap()
3037
3038
  parseColumns(true).then(() => {
3038
3039
  if (reactData.scrollXLoad) {
@@ -3057,6 +3058,7 @@ export default defineComponent({
3057
3058
  if ($xeTable.handleUpdateCustomColumn) {
3058
3059
  $xeTable.handleUpdateCustomColumn()
3059
3060
  }
3061
+ reactData.isColLoading = false
3060
3062
  return $xeTable.recalculate()
3061
3063
  })
3062
3064
  })
@@ -3176,13 +3178,12 @@ export default defineComponent({
3176
3178
  /**
3177
3179
  * 纵向 Y 可视渲染处理
3178
3180
  */
3179
- const loadScrollYData = () => {
3180
- const { showOverflow } = props
3181
- const { mergeList } = reactData
3181
+ const loadScrollYData = (scrollTop?: number) => {
3182
+ const { mergeList, isAllOverflow } = reactData
3182
3183
  const { scrollYStore } = internalData
3183
3184
  const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore
3184
- const autoOffsetYSize = showOverflow ? offsetSize : offsetSize + 1
3185
- const { toVisibleIndex, visibleSize } = handleVirtualYVisible()
3185
+ const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1
3186
+ const { toVisibleIndex, visibleSize } = handleVirtualYVisible(scrollTop)
3186
3187
  const offsetItem = {
3187
3188
  startIndex: Math.max(0, toVisibleIndex - 1 - offsetSize - preloadSize),
3188
3189
  endIndex: toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize
@@ -3230,7 +3231,7 @@ export default defineComponent({
3230
3231
  const lazyScrollXData = () => {
3231
3232
  const { lxTimeout, lxRunTime, scrollXStore } = internalData
3232
3233
  const { visibleSize } = scrollXStore
3233
- const fpsTime = Math.max(5, Math.min(80, Math.floor(visibleSize * 3)))
3234
+ const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)))
3234
3235
  if (lxTimeout) {
3235
3236
  clearTimeout(lxTimeout)
3236
3237
  }
@@ -3246,10 +3247,9 @@ export default defineComponent({
3246
3247
  }
3247
3248
 
3248
3249
  const lazyScrollYData = () => {
3249
- const { showOverflow } = props
3250
3250
  const { lyTimeout, lyRunTime, scrollYStore } = internalData
3251
3251
  const { visibleSize } = scrollYStore
3252
- const fpsTime = showOverflow ? 5 : Math.max(5, Math.min(80, Math.floor(visibleSize / 2)))
3252
+ const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)))
3253
3253
  if (lyTimeout) {
3254
3254
  clearTimeout(lyTimeout)
3255
3255
  }
@@ -3273,28 +3273,67 @@ export default defineComponent({
3273
3273
  internalData.lcsTimeout = setTimeout(() => {
3274
3274
  internalData.lcsRunTime = Date.now()
3275
3275
  internalData.lcsTimeout = undefined
3276
+ internalData.intoRunScroll = false
3276
3277
  internalData.inVirtualScroll = false
3277
3278
  internalData.inWheelScroll = false
3278
3279
  internalData.inHeaderScroll = false
3279
3280
  internalData.inBodyScroll = false
3280
3281
  internalData.inFooterScroll = false
3281
3282
  internalData.scrollRenderType = ''
3283
+
3284
+ calcCellHeight()
3282
3285
  if (isRollX && scrollXLoad) {
3283
- $xeTable.updateScrollXData().then(() => {
3284
- calcCellHeight()
3285
- loadScrollXData()
3286
- })
3286
+ $xeTable.updateScrollXData()
3287
3287
  }
3288
3288
  if (isRollY && scrollYLoad) {
3289
3289
  $xeTable.updateScrollYData().then(() => {
3290
3290
  calcCellHeight()
3291
- loadScrollYData()
3291
+ $xeTable.updateScrollYSpace()
3292
3292
  })
3293
3293
  }
3294
3294
  $xeTable.updateCellAreas()
3295
3295
  }, 200)
3296
3296
  }
3297
3297
 
3298
+ const getWheelSpeed = (lastScrollTime: number) => {
3299
+ let multiple = 1
3300
+ const currTime = Date.now()
3301
+ if (lastScrollTime + 25 > currTime) {
3302
+ multiple = 1.18
3303
+ } else if (lastScrollTime + 30 > currTime) {
3304
+ multiple = 1.15
3305
+ } else if (lastScrollTime + 40 > currTime) {
3306
+ multiple = 1.12
3307
+ } else if (lastScrollTime + 55 > currTime) {
3308
+ multiple = 1.09
3309
+ } else if (lastScrollTime + 75 > currTime) {
3310
+ multiple = 1.06
3311
+ } else if (lastScrollTime + 100 > currTime) {
3312
+ multiple = 1.03
3313
+ }
3314
+ return multiple
3315
+ }
3316
+
3317
+ const wheelScrollTo = (diffNum: number, cb: (progress: number) => void) => {
3318
+ const duration = Math.abs(diffNum)
3319
+ const startTime = performance.now()
3320
+ let countTop = 0
3321
+ const step = (timestamp: number) => {
3322
+ let progress = (timestamp - startTime) / duration
3323
+ if (progress > 1) {
3324
+ progress = 1
3325
+ }
3326
+ const easedProgress = Math.pow(progress, 2)
3327
+ const offsetTop = Math.floor((diffNum * easedProgress)) - countTop
3328
+ countTop += offsetTop
3329
+ cb(offsetTop)
3330
+ if (progress < 1) {
3331
+ requestAnimationFrame(step)
3332
+ }
3333
+ }
3334
+ requestAnimationFrame(step)
3335
+ }
3336
+
3298
3337
  const dispatchEvent = (type: ValueOf<VxeTableEmits>, params: Record<string, any>, evnt: Event | null) => {
3299
3338
  emit(type, createEvent(evnt, { $table: $xeTable, $grid: $xeGrid }, params))
3300
3339
  }
@@ -3308,13 +3347,34 @@ export default defineComponent({
3308
3347
  return nextTick()
3309
3348
  }
3310
3349
 
3311
- function handleUupdateResize () {
3350
+ const handleUpdateResize = () => {
3312
3351
  const el = refElem.value
3313
3352
  if (el && el.clientWidth && el.clientHeight) {
3314
3353
  tableMethods.recalculate()
3315
3354
  }
3316
3355
  }
3317
3356
 
3357
+ const handleUpdateColResize = (evnt: MouseEvent, params: any) => {
3358
+ $xeTable.analyColumnWidth()
3359
+ $xeTable.recalculate(true).then(() => {
3360
+ $xeTable.saveCustomStore('update:width')
3361
+ $xeTable.updateCellAreas()
3362
+ $xeTable.dispatchEvent('column-resizable-change', params, evnt)
3363
+ // 已废弃 resizable-change
3364
+ $xeTable.dispatchEvent('resizable-change', params, evnt)
3365
+ setTimeout(() => $xeTable.recalculate(true), 300)
3366
+ })
3367
+ }
3368
+
3369
+ const handleUpdateRowResize = (evnt: MouseEvent, params: any) => {
3370
+ reactData.resizeHeightFlag++
3371
+ $xeTable.recalculate(true).then(() => {
3372
+ $xeTable.updateCellAreas()
3373
+ $xeTable.dispatchEvent('row-resizable-change', params, evnt)
3374
+ setTimeout(() => $xeTable.recalculate(true), 300)
3375
+ })
3376
+ }
3377
+
3318
3378
  tableMethods = {
3319
3379
  dispatchEvent,
3320
3380
  /**
@@ -3367,7 +3427,7 @@ export default defineComponent({
3367
3427
  */
3368
3428
  loadData (datas) {
3369
3429
  const { initStatus } = internalData
3370
- return loadTableData(datas).then(() => {
3430
+ return loadTableData(datas, false).then(() => {
3371
3431
  internalData.inited = true
3372
3432
  internalData.initStatus = true
3373
3433
  if (!initStatus) {
@@ -3385,7 +3445,7 @@ export default defineComponent({
3385
3445
  .then(() => {
3386
3446
  internalData.inited = true
3387
3447
  internalData.initStatus = true
3388
- return loadTableData(datas)
3448
+ return loadTableData(datas, true)
3389
3449
  }).then(() => {
3390
3450
  handleLoadDefaults()
3391
3451
  return tableMethods.recalculate()
@@ -3474,7 +3534,7 @@ export default defineComponent({
3474
3534
  XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
3475
3535
  const rowid = getRowid($xeTable, childRow)
3476
3536
  const parentRow = parentItem || parentRest.row
3477
- const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, oTop: 0 }
3537
+ const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0 }
3478
3538
  fullDataRowIdData[rowid] = rest
3479
3539
  fullAllDataRowIdData[rowid] = rest
3480
3540
  }, { children: childrenField })
@@ -3699,29 +3759,30 @@ export default defineComponent({
3699
3759
  return nextTick()
3700
3760
  },
3701
3761
  getCellElement (row, fieldOrColumn) {
3762
+ const { elemStore } = internalData
3702
3763
  const column = handleFieldOrColumn($xeTable, fieldOrColumn)
3703
3764
  if (!column) {
3704
3765
  return null
3705
3766
  }
3706
3767
  const rowid = getRowid($xeTable, row)
3707
- const tableBody = refTableBody.value
3708
- const leftBody = refTableLeftBody.value
3709
- const rightBody = refTableRightBody.value
3768
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
3769
+ const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
3770
+ const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
3710
3771
  let bodyElem
3711
3772
  if (column) {
3712
3773
  if (column.fixed) {
3713
3774
  if (column.fixed === 'left') {
3714
- if (leftBody) {
3715
- bodyElem = leftBody.$el as HTMLDivElement
3775
+ if (leftScrollElem) {
3776
+ bodyElem = leftScrollElem
3716
3777
  }
3717
3778
  } else {
3718
- if (rightBody) {
3719
- bodyElem = rightBody.$el as HTMLDivElement
3779
+ if (rightScrollElem) {
3780
+ bodyElem = rightScrollElem
3720
3781
  }
3721
3782
  }
3722
3783
  }
3723
3784
  if (!bodyElem) {
3724
- bodyElem = tableBody.$el as HTMLDivElement
3785
+ bodyElem = bodyScrollElem
3725
3786
  }
3726
3787
  if (bodyElem) {
3727
3788
  return bodyElem.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`)
@@ -4126,29 +4187,34 @@ export default defineComponent({
4126
4187
  return nextTick()
4127
4188
  },
4128
4189
  setColumnWidth (fieldOrColumn, width) {
4190
+ const { elemStore } = internalData
4129
4191
  let status = false
4130
4192
  const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn]
4131
- cols.forEach(item => {
4132
- const column = handleFieldOrColumn($xeTable, item)
4133
- if (column) {
4134
- const colWidth = XEUtils.toInteger(width)
4135
- let rdWidth = colWidth
4136
- if (isScale(width)) {
4137
- const tableBody = refTableBody.value
4138
- const bodyElem = tableBody ? tableBody.$el as HTMLDivElement : null
4139
- const bodyWidth = bodyElem ? bodyElem.clientWidth - 1 : 0
4140
- rdWidth = Math.floor(colWidth * bodyWidth)
4141
- }
4142
- column.resizeWidth = rdWidth
4143
- if (!status) {
4144
- status = true
4193
+ let cWidth = XEUtils.toInteger(width)
4194
+ if (isScale(width)) {
4195
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
4196
+ const bodyWidth = bodyScrollElem ? bodyScrollElem.clientWidth - 1 : 0
4197
+ cWidth = Math.floor(cWidth * bodyWidth)
4198
+ }
4199
+ if (cWidth) {
4200
+ cols.forEach(item => {
4201
+ const column = handleFieldOrColumn($xeTable, item)
4202
+ if (column) {
4203
+ column.resizeWidth = cWidth
4204
+ if (!status) {
4205
+ status = true
4206
+ }
4145
4207
  }
4208
+ })
4209
+ if (status) {
4210
+ return $xeTable.refreshColumn().then(() => {
4211
+ return { status }
4212
+ })
4146
4213
  }
4147
- })
4148
- if (status) {
4149
- return tableMethods.refreshColumn()
4150
4214
  }
4151
- return nextTick()
4215
+ return nextTick().then(() => {
4216
+ return { status }
4217
+ })
4152
4218
  },
4153
4219
  getColumnWidth (fieldOrColumn) {
4154
4220
  const column = handleFieldOrColumn($xeTable, fieldOrColumn)
@@ -4181,6 +4247,93 @@ export default defineComponent({
4181
4247
  return tableMethods.recalculate()
4182
4248
  })
4183
4249
  },
4250
+ setRowHeightConf (heightConf) {
4251
+ const { fullAllDataRowIdData } = internalData
4252
+ let status = false
4253
+ if (heightConf) {
4254
+ XEUtils.each(heightConf, (height, rowid) => {
4255
+ const rowRest = fullAllDataRowIdData[rowid]
4256
+ if (rowRest) {
4257
+ const rHeight = XEUtils.toInteger(height)
4258
+ if (rHeight) {
4259
+ rowRest.resizeHeight = rHeight
4260
+ if (!status) {
4261
+ status = true
4262
+ }
4263
+ }
4264
+ }
4265
+ })
4266
+ if (status) {
4267
+ internalData.isResizeCellHeight = true
4268
+ reactData.resizeHeightFlag++
4269
+ }
4270
+ }
4271
+ return nextTick().then(() => {
4272
+ return { status }
4273
+ })
4274
+ },
4275
+ getRowHeightConf (isFull) {
4276
+ const { fullAllDataRowIdData, afterFullData } = internalData
4277
+ const rowOpts = computeRowOpts.value
4278
+ const cellOpts = computeCellOpts.value
4279
+ const defaultRowHeight = computeDefaultRowHeight.value
4280
+ const rest: Record<string, number> = {}
4281
+ afterFullData.forEach(row => {
4282
+ const rowid = getRowid($xeTable, row)
4283
+ const rowRest = fullAllDataRowIdData[rowid]
4284
+ if (rowRest) {
4285
+ const resizeHeight = rowRest.resizeHeight
4286
+ if (resizeHeight || isFull) {
4287
+ const currCellHeight = resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
4288
+ rest[rowid] = currCellHeight
4289
+ }
4290
+ }
4291
+ })
4292
+ return rest
4293
+ },
4294
+ setRowHeight (rowOrId, height) {
4295
+ const { fullAllDataRowIdData } = internalData
4296
+ let status = false
4297
+ const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId]
4298
+ let rHeight = XEUtils.toInteger(height)
4299
+ if (isScale(height)) {
4300
+ const tableBody = refTableBody.value
4301
+ const bodyElem = tableBody ? tableBody.$el as HTMLDivElement : null
4302
+ const bodyHeight = bodyElem ? bodyElem.clientHeight - 1 : 0
4303
+ rHeight = Math.floor(rHeight * bodyHeight)
4304
+ }
4305
+ if (rHeight) {
4306
+ rows.forEach(row => {
4307
+ const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : getRowid($xeTable, row)
4308
+ const rowRest = fullAllDataRowIdData[rowid]
4309
+ if (rowRest) {
4310
+ rowRest.resizeHeight = rHeight
4311
+ if (!status) {
4312
+ status = true
4313
+ }
4314
+ }
4315
+ })
4316
+ if (status) {
4317
+ internalData.isResizeCellHeight = true
4318
+ reactData.resizeHeightFlag++
4319
+ }
4320
+ }
4321
+ return nextTick().then(() => {
4322
+ return { status }
4323
+ })
4324
+ },
4325
+ getRowHeight (rowOrId) {
4326
+ const { fullAllDataRowIdData } = internalData
4327
+ const rowOpts = computeRowOpts.value
4328
+ const cellOpts = computeCellOpts.value
4329
+ const defaultRowHeight = computeDefaultRowHeight.value
4330
+ const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId)
4331
+ const rowRest = fullAllDataRowIdData[rowid]
4332
+ if (rowRest) {
4333
+ return rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
4334
+ }
4335
+ return 0
4336
+ },
4184
4337
  /**
4185
4338
  * 刷新滚动操作,手动同步滚动相关位置(对于某些特殊的操作,比如滚动条错位、固定列不同步)
4186
4339
  */
@@ -5201,13 +5354,13 @@ export default defineComponent({
5201
5354
  */
5202
5355
  getScroll () {
5203
5356
  const { scrollXLoad, scrollYLoad } = reactData
5204
- const tableBody = refTableBody.value
5205
- const bodyElem = tableBody.$el as HTMLDivElement
5357
+ const { elemStore } = internalData
5358
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
5206
5359
  return {
5207
5360
  virtualX: scrollXLoad,
5208
5361
  virtualY: scrollYLoad,
5209
- scrollTop: bodyElem.scrollTop,
5210
- scrollLeft: bodyElem.scrollLeft
5362
+ scrollTop: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
5363
+ scrollLeft: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
5211
5364
  }
5212
5365
  },
5213
5366
  /**
@@ -5257,8 +5410,7 @@ export default defineComponent({
5257
5410
  * @param {ColumnInfo} fieldOrColumn 列配置
5258
5411
  */
5259
5412
  scrollToRow (row, fieldOrColumn) {
5260
- const { showOverflow } = props
5261
- const { scrollYLoad, scrollXLoad } = reactData
5413
+ const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData
5262
5414
  const rest = []
5263
5415
  if (row) {
5264
5416
  if (props.treeConfig) {
@@ -5272,7 +5424,7 @@ export default defineComponent({
5272
5424
  }
5273
5425
  return Promise.all(rest).then(() => {
5274
5426
  if (row) {
5275
- if (!showOverflow && (scrollYLoad || scrollXLoad)) {
5427
+ if (!isAllOverflow && (scrollYLoad || scrollXLoad)) {
5276
5428
  calcCellHeight()
5277
5429
  calcCellWidth()
5278
5430
  }
@@ -6224,9 +6376,11 @@ export default defineComponent({
6224
6376
  if (!el) {
6225
6377
  return
6226
6378
  }
6227
- const { scrollbarWidth, scrollbarHeight } = reactData
6379
+ const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
6228
6380
  const { prevDragToChild } = internalData
6229
6381
  const wrapperRect = el.getBoundingClientRect()
6382
+ const osbWidth = overflowY ? scrollbarWidth : 0
6383
+ const osbHeight = overflowX ? scrollbarHeight : 0
6230
6384
  const tableWidth = el.clientWidth
6231
6385
  const tableHeight = el.clientHeight
6232
6386
  if (trEl) {
@@ -6237,14 +6391,14 @@ export default defineComponent({
6237
6391
  const trRect = trEl.getBoundingClientRect()
6238
6392
  let trHeight = trEl.clientHeight
6239
6393
  const offsetTop = Math.max(1, trRect.y - wrapperRect.y)
6240
- if (offsetTop + trHeight > tableHeight - scrollbarHeight) {
6241
- trHeight = tableHeight - offsetTop - scrollbarHeight
6394
+ if (offsetTop + trHeight > tableHeight - osbHeight) {
6395
+ trHeight = tableHeight - offsetTop - osbHeight
6242
6396
  }
6243
6397
  rdLineEl.style.display = 'block'
6244
- rdLineEl.style.left = `${scrollbarYToLeft ? scrollbarWidth : 0}px`
6398
+ rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
6245
6399
  rdLineEl.style.top = `${offsetTop}px`
6246
6400
  rdLineEl.style.height = `${trHeight}px`
6247
- rdLineEl.style.width = `${tableWidth - scrollbarWidth}px`
6401
+ rdLineEl.style.width = `${tableWidth - osbWidth}px`
6248
6402
  rdLineEl.setAttribute('drag-pos', dragPos)
6249
6403
  rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
6250
6404
  } else {
@@ -6269,7 +6423,7 @@ export default defineComponent({
6269
6423
  thWidth -= startX - offsetLeft
6270
6424
  offsetLeft = startX
6271
6425
  }
6272
- const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : scrollbarWidth)
6426
+ const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth)
6273
6427
  if (offsetLeft + thWidth > endX) {
6274
6428
  thWidth = endX - offsetLeft
6275
6429
  }
@@ -6280,7 +6434,7 @@ export default defineComponent({
6280
6434
  if (prevDragToChild) {
6281
6435
  cdLineEl.style.height = `${thRect.height}px`
6282
6436
  } else {
6283
- cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : scrollbarHeight)}px`
6437
+ cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`
6284
6438
  }
6285
6439
  cdLineEl.setAttribute('drag-pos', dragPos)
6286
6440
  cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
@@ -6318,11 +6472,11 @@ export default defineComponent({
6318
6472
  * @param {Event} evnt 事件
6319
6473
  * @param {Row} row 行对象
6320
6474
  */
6321
- const handleTooltip = (evnt: MouseEvent, cell: HTMLTableCellElement, overflowElem: HTMLElement, tipElem: HTMLElement | null, params: any) => {
6475
+ const handleTooltip = (evnt: MouseEvent, tdEl: HTMLTableCellElement, overflowElem: HTMLElement, tipElem: HTMLElement | null, params: any) => {
6322
6476
  if (!overflowElem) {
6323
6477
  return nextTick()
6324
6478
  }
6325
- params.cell = cell
6479
+ params.cell = tdEl
6326
6480
  const { tooltipStore } = reactData
6327
6481
  const tooltipOpts = computeTooltipOpts.value
6328
6482
  const { column, row } = params
@@ -6472,9 +6626,8 @@ export default defineComponent({
6472
6626
  },
6473
6627
  /**
6474
6628
  * 更新数据行的 Map
6475
- * 牺牲数据组装的耗时,用来换取使用过程中的流畅
6476
6629
  */
6477
- cacheRowMap (isSource) {
6630
+ cacheRowMap (isReset, isSource) {
6478
6631
  const { treeConfig } = props
6479
6632
  const treeOpts = computeTreeOpts.value
6480
6633
  const { fullAllDataRowIdData, tableFullData, tableFullTreeData } = internalData
@@ -6496,8 +6649,8 @@ export default defineComponent({
6496
6649
  row[childrenField] = null
6497
6650
  }
6498
6651
  let cacheItem = fullAllDataRowIdData[rowid]
6499
- if (!cacheItem) {
6500
- cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, oTop: 0 }
6652
+ if (isReset || !cacheItem) {
6653
+ cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0 }
6501
6654
  }
6502
6655
  cacheItem.row = row
6503
6656
  cacheItem.items = items
@@ -6587,11 +6740,155 @@ export default defineComponent({
6587
6740
  })
6588
6741
  Object.assign(reactData.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList })
6589
6742
  },
6590
- handleResizeDblclickEvent (evnt, params) {
6743
+ handleColResizeMousedownEvent (evnt, fixedType, params) {
6744
+ evnt.stopPropagation()
6745
+ evnt.preventDefault()
6746
+ const { column } = params
6747
+ const { overflowX, scrollbarHeight } = reactData
6748
+ const { elemStore, visibleColumn } = internalData
6749
+ const resizableOpts = computeResizableOpts.value
6750
+ const osbHeight = overflowX ? scrollbarHeight : 0
6751
+ const tableEl = refElem.value
6752
+ const leftContainerElem = refLeftContainer.value
6753
+ const rightContainerElem = refRightContainer.value
6754
+ const resizeBarElem = refColResizeBar.value
6755
+ if (!resizeBarElem) {
6756
+ return
6757
+ }
6758
+ const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
6759
+ const scrollbarXToTop = computeScrollbarXToTop.value
6760
+ const { clientX: dragClientX } = evnt
6761
+ const wrapperElem = refElem.value
6762
+ const dragBtnElem = evnt.target as HTMLDivElement
6763
+ let resizeColumn = column
6764
+ if (column.children && column.children.length) {
6765
+ XEUtils.eachTree(column.children, childColumn => {
6766
+ resizeColumn = childColumn
6767
+ })
6768
+ }
6769
+ const cell = dragBtnElem.parentNode as HTMLTableCellElement
6770
+ const cellParams = Object.assign(params, { cell })
6771
+ let dragLeft = 0
6772
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
6773
+ if (!bodyScrollElem) {
6774
+ return
6775
+ }
6776
+ const pos = getOffsetPos(dragBtnElem, wrapperElem)
6777
+ const dragBtnWidth = dragBtnElem.clientWidth
6778
+ const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2)
6779
+ const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth // 列之间的最小间距
6780
+ let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval
6781
+ let dragPosLeft = pos.left + dragBtnOffsetWidth
6782
+ const isLeftFixed = fixedType === 'left'
6783
+ const isRightFixed = fixedType === 'right'
6784
+
6785
+ // 计算左右侧固定列偏移量
6786
+ let fixedOffsetWidth = 0
6787
+ if (isLeftFixed || isRightFixed) {
6788
+ const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling'
6789
+ let tempCellElem = cell[siblingProp] as HTMLTableCellElement
6790
+ while (tempCellElem) {
6791
+ if (hasClass(tempCellElem, 'fixed--hidden')) {
6792
+ break
6793
+ } else if (!hasClass(tempCellElem, 'col--group')) {
6794
+ fixedOffsetWidth += tempCellElem.offsetWidth
6795
+ }
6796
+ tempCellElem = tempCellElem[siblingProp] as HTMLTableCellElement
6797
+ }
6798
+ if (isRightFixed && rightContainerElem) {
6799
+ dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth
6800
+ }
6801
+ }
6802
+
6803
+ // 处理拖动事件
6804
+ const updateEvent = (evnt: MouseEvent) => {
6805
+ evnt.stopPropagation()
6806
+ evnt.preventDefault()
6807
+ const tableHeight = tableEl.clientHeight
6808
+ const offsetX = evnt.clientX - dragClientX
6809
+ let left = dragPosLeft + offsetX
6810
+ const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft
6811
+ if (isLeftFixed) {
6812
+ // 左固定列(不允许超过右侧固定列、不允许超过右边距)
6813
+ left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval)
6814
+ } else if (isRightFixed) {
6815
+ // 右侧固定列(不允许超过左侧固定列、不允许超过左边距)
6816
+ dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval
6817
+ left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval)
6818
+ } else {
6819
+ dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft)
6820
+ // left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
6821
+ }
6822
+ dragLeft = Math.max(left, dragMinLeft)
6823
+ const resizeBarLeft = Math.max(1, dragLeft - scrollLeft)
6824
+ resizeBarElem.style.left = `${resizeBarLeft}px`
6825
+ resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`
6826
+ resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - osbHeight : tableHeight}px`
6827
+ if (resizableOpts.showDragTip && resizeTipElem) {
6828
+ resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)])
6829
+ const tableWidth = tableEl.clientWidth
6830
+ const wrapperRect = wrapperElem.getBoundingClientRect()
6831
+ const resizeBarWidth = resizeBarElem.clientWidth
6832
+ const resizeTipWidth = resizeTipElem.clientWidth
6833
+ const resizeTipHeight = resizeTipElem.clientHeight
6834
+ let resizeTipLeft = -resizeTipWidth
6835
+ if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
6836
+ resizeTipLeft = 0
6837
+ } else if (resizeBarLeft > tableWidth) {
6838
+ resizeTipLeft += tableWidth - resizeBarLeft
6839
+ }
6840
+ resizeTipElem.style.left = `${resizeTipLeft}px`
6841
+ resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`
6842
+ }
6843
+ reactData.isDragResize = true
6844
+ }
6845
+
6846
+ reactData.isDragResize = true
6847
+ addClass(tableEl, 'col-drag--resize')
6848
+ resizeBarElem.style.display = 'block'
6849
+ document.onmousemove = updateEvent
6850
+ document.onmouseup = function (evnt) {
6851
+ document.onmousemove = null
6852
+ document.onmouseup = null
6853
+ resizeBarElem.style.display = 'none'
6854
+ internalData._lastResizeTime = Date.now()
6855
+
6856
+ setTimeout(() => {
6857
+ reactData.isDragResize = false
6858
+ }, 50)
6859
+
6860
+ const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)
6861
+ const resizeParams = { ...params, resizeWidth, resizeColumn }
6862
+ if (resizableOpts.dragMode === 'fixed') {
6863
+ visibleColumn.forEach(item => {
6864
+ if (item.id !== resizeColumn.id) {
6865
+ if (!item.resizeWidth) {
6866
+ item.resizeWidth = item.renderWidth
6867
+ }
6868
+ }
6869
+ })
6870
+ }
6871
+
6872
+ if ($xeTable.handleColResizeCellAreaEvent) {
6873
+ $xeTable.handleColResizeCellAreaEvent(evnt, resizeParams)
6874
+ } else {
6875
+ resizeColumn.resizeWidth = resizeWidth
6876
+ handleUpdateColResize(evnt, resizeParams)
6877
+ }
6878
+ removeClass(tableEl, 'col-drag--resize')
6879
+ }
6880
+ updateEvent(evnt)
6881
+ if ($xeTable.closeMenu) {
6882
+ $xeTable.closeMenu()
6883
+ }
6884
+ },
6885
+ handleColResizeDblclickEvent (evnt, params) {
6591
6886
  const resizableOpts = computeResizableOpts.value
6592
6887
  const { isDblclickAutoWidth } = resizableOpts
6593
6888
  const el = refElem.value
6594
6889
  if (isDblclickAutoWidth && el) {
6890
+ evnt.stopPropagation()
6891
+ evnt.preventDefault()
6595
6892
  const { fullColumnIdData } = internalData
6596
6893
  const { column } = params
6597
6894
  let resizeColumn = column
@@ -6606,20 +6903,166 @@ export default defineComponent({
6606
6903
  const cell = dragBtnElem.parentNode as HTMLTableCellElement
6607
6904
  const cellParams = Object.assign(params, { cell })
6608
6905
  const colMinWidth = getColReMinWidth(cellParams)
6906
+
6907
+ el.setAttribute('data-calc-col', 'Y')
6609
6908
  let resizeWidth = calcColumnAutoWidth(resizeColumn, el)
6909
+ el.removeAttribute('data-calc-col')
6610
6910
  if (colRest) {
6611
6911
  resizeWidth = Math.max(resizeWidth, colRest.width)
6612
6912
  }
6613
- resizeColumn.resizeWidth = Math.max(colMinWidth, resizeWidth)
6614
- reactData._isResize = false
6913
+ resizeWidth = Math.max(colMinWidth, resizeWidth)
6914
+ const resizeParams = { ...params, resizeWidth, resizeColumn }
6915
+ reactData.isDragResize = false
6615
6916
  internalData._lastResizeTime = Date.now()
6616
- $xeTable.analyColumnWidth()
6617
- $xeTable.recalculate(true).then(() => {
6618
- $xeTable.saveCustomStore('update:visible')
6619
- $xeTable.updateCellAreas()
6620
- $xeTable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt)
6621
- setTimeout(() => $xeTable.recalculate(true), 300)
6622
- })
6917
+
6918
+ if ($xeTable.handleColResizeDblclickCellAreaEvent) {
6919
+ $xeTable.handleColResizeDblclickCellAreaEvent(evnt, resizeParams)
6920
+ } else {
6921
+ resizeColumn.resizeWidth = resizeWidth
6922
+ handleUpdateColResize(evnt, resizeParams)
6923
+ }
6924
+ }
6925
+ },
6926
+ handleRowResizeMousedownEvent (evnt, params) {
6927
+ evnt.stopPropagation()
6928
+ evnt.preventDefault()
6929
+ const { row } = params
6930
+ const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
6931
+ const { elemStore, fullAllDataRowIdData } = internalData
6932
+ const osbWidth = overflowY ? scrollbarWidth : 0
6933
+ const osbHeight = overflowX ? scrollbarHeight : 0
6934
+ const scrollbarYToLeft = computeScrollbarYToLeft.value
6935
+ const resizableOpts = computeResizableOpts.value
6936
+ const rowOpts = computeRowOpts.value
6937
+ const cellOpts = computeCellOpts.value
6938
+ const tableEl = refElem.value
6939
+ const resizeBarElem = refRowResizeBar.value
6940
+ if (!resizeBarElem) {
6941
+ return
6942
+ }
6943
+ const { clientY: dragClientY } = evnt
6944
+ const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
6945
+ const dragBtnElem = evnt.currentTarget as HTMLDivElement
6946
+ const tdEl = dragBtnElem.parentNode as HTMLTableCellElement
6947
+ const trEl = tdEl.parentNode as HTMLTableCellElement
6948
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
6949
+ if (!bodyScrollElem) {
6950
+ return
6951
+ }
6952
+ const rowid = getRowid($xeTable, row)
6953
+ const rowRest = fullAllDataRowIdData[rowid]
6954
+ if (!rowRest) {
6955
+ return
6956
+ }
6957
+ const defaultRowHeight = computeDefaultRowHeight.value
6958
+ const currCellHeight = rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
6959
+ const tableRect = tableEl.getBoundingClientRect()
6960
+ const trRect = trEl.getBoundingClientRect()
6961
+ const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight
6962
+ let resizeHeight = currCellHeight
6963
+ const cellEl = tdEl.querySelector('.vxe-cell')
6964
+ let cellMinHeight = 0
6965
+ if (cellEl) {
6966
+ const cellStyle = getComputedStyle(cellEl)
6967
+ cellMinHeight = Math.max(1, Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom)))
6968
+ }
6969
+ const minTop = trRect.y - tableRect.y + cellMinHeight
6970
+ // 处理拖动事件
6971
+ const updateEvent = (evnt: MouseEvent) => {
6972
+ evnt.stopPropagation()
6973
+ evnt.preventDefault()
6974
+ const tableWidth = tableEl.clientWidth - osbWidth
6975
+ const tableHeight = tableEl.clientHeight - osbHeight
6976
+ let dragTop = evnt.clientY - tableRect.y - targetOffsetY
6977
+ if (dragTop < minTop) {
6978
+ dragTop = minTop
6979
+ } else {
6980
+ resizeHeight = Math.max(cellMinHeight, currCellHeight + evnt.clientY - dragClientY)
6981
+ }
6982
+ resizeBarElem.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
6983
+ resizeBarElem.style.top = `${dragTop}px`
6984
+ resizeBarElem.style.width = `${tableWidth}px`
6985
+ if (resizableOpts.showDragTip && resizeTipElem) {
6986
+ resizeTipElem.textContent = getI18n('vxe.table.resizeRowTip', [resizeHeight])
6987
+ const resizeTipWidth = resizeTipElem.clientWidth
6988
+ const resizeTipHeight = resizeTipElem.clientHeight
6989
+ let resizeBarLeft = Math.max(2, evnt.clientX - tableRect.x)
6990
+ let resizeBarTop = 0
6991
+ if (resizeBarLeft + resizeTipWidth >= tableWidth - 2) {
6992
+ resizeBarLeft = tableWidth - resizeTipWidth - 2
6993
+ }
6994
+ if (dragTop + resizeTipHeight >= tableHeight) {
6995
+ resizeBarTop = tableHeight - (dragTop + resizeTipHeight)
6996
+ }
6997
+ resizeTipElem.style.left = `${resizeBarLeft}px`
6998
+ resizeTipElem.style.top = `${resizeBarTop}px`
6999
+ }
7000
+ reactData.isDragResize = true
7001
+ }
7002
+
7003
+ reactData.isDragResize = true
7004
+ addClass(tableEl, 'row-drag--resize')
7005
+ resizeBarElem.style.display = 'block'
7006
+ document.onmousemove = updateEvent
7007
+ document.onmouseup = function (evnt) {
7008
+ document.onmousemove = null
7009
+ document.onmouseup = null
7010
+ resizeBarElem.style.display = 'none'
7011
+ internalData._lastResizeTime = Date.now()
7012
+
7013
+ setTimeout(() => {
7014
+ reactData.isDragResize = false
7015
+ }, 50)
7016
+
7017
+ if (resizeHeight !== currCellHeight) {
7018
+ const resizeParams = { ...params, resizeHeight, resizeRow: row }
7019
+ internalData.isResizeCellHeight = true
7020
+ if ($xeTable.handleRowResizeCellAreaEvent) {
7021
+ $xeTable.handleRowResizeCellAreaEvent(evnt, resizeParams)
7022
+ } else {
7023
+ rowRest.resizeHeight = resizeHeight
7024
+ handleUpdateRowResize(evnt, resizeParams)
7025
+ }
7026
+ }
7027
+ removeClass(tableEl, 'row-drag--resize')
7028
+ }
7029
+ updateEvent(evnt)
7030
+ },
7031
+ handleRowResizeDblclickEvent (evnt, params) {
7032
+ const resizableOpts = computeResizableOpts.value
7033
+ const { isDblclickAutoHeight } = resizableOpts
7034
+ const el = refElem.value
7035
+ if (isDblclickAutoHeight && el) {
7036
+ evnt.stopPropagation()
7037
+ evnt.preventDefault()
7038
+ const { editStore } = reactData
7039
+ const { fullAllDataRowIdData } = internalData
7040
+ const { actived } = editStore
7041
+ const { row } = params
7042
+ const rowid = getRowid($xeTable, row)
7043
+ const rowRest = fullAllDataRowIdData[rowid]
7044
+ if (!rowRest) {
7045
+ return
7046
+ }
7047
+ const handleRsHeight = () => {
7048
+ el.setAttribute('data-calc-row', 'Y')
7049
+ const resizeHeight = calcCellAutoHeight(rowRest, el)
7050
+ el.removeAttribute('data-calc-row')
7051
+ const resizeParams = { ...params, resizeHeight, resizeRow: row }
7052
+ reactData.isDragResize = false
7053
+ internalData._lastResizeTime = Date.now()
7054
+ if ($xeTable.handleRowResizeDblclickCellAreaEvent) {
7055
+ $xeTable.handleRowResizeDblclickCellAreaEvent(evnt, resizeParams)
7056
+ } else {
7057
+ rowRest.resizeHeight = resizeHeight
7058
+ handleUpdateRowResize(evnt, resizeParams)
7059
+ }
7060
+ }
7061
+ if (actived.row || actived.column) {
7062
+ $xeTable.clearEdit().then(handleRsHeight)
7063
+ } else {
7064
+ handleRsHeight()
7065
+ }
6623
7066
  }
6624
7067
  },
6625
7068
  saveCustomStore (type) {
@@ -6966,10 +7409,21 @@ export default defineComponent({
6966
7409
  triggerHeaderTooltipEvent (evnt, params) {
6967
7410
  const { tooltipStore } = reactData
6968
7411
  const { column } = params
6969
- const titleElem = evnt.currentTarget as HTMLTableCellElement
6970
7412
  handleTargetEnterEvent(true)
7413
+ const titleElem = evnt.currentTarget as HTMLDivElement
7414
+ if (!titleElem) {
7415
+ return
7416
+ }
7417
+ const cellEl = titleElem.parentElement as HTMLDivElement
7418
+ if (!cellEl) {
7419
+ return
7420
+ }
7421
+ const thEl = cellEl.parentElement as HTMLTableCellElement
7422
+ if (!thEl) {
7423
+ return
7424
+ }
6971
7425
  if (tooltipStore.column !== column || !tooltipStore.visible) {
6972
- handleTooltip(evnt, titleElem, titleElem, null, params)
7426
+ handleTooltip(evnt, thEl, cellEl, null, params)
6973
7427
  }
6974
7428
  },
6975
7429
  /**
@@ -6982,7 +7436,7 @@ export default defineComponent({
6982
7436
  const editOpts = computeEditOpts.value
6983
7437
  const { actived } = editStore
6984
7438
  const { row, column } = params
6985
- const cell = evnt.currentTarget as HTMLTableCellElement
7439
+ const tdEl = evnt.currentTarget as HTMLTableCellElement
6986
7440
  handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row !== row)
6987
7441
  // 单元格处于编辑状态时不触发提示框
6988
7442
  if (column.editRender && isEnableConf(editConfig)) {
@@ -6996,17 +7450,7 @@ export default defineComponent({
6996
7450
  }
6997
7451
  }
6998
7452
  if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
6999
- let overflowElem
7000
- let tipElem
7001
- if (column.treeNode) {
7002
- overflowElem = cell.querySelector('.vxe-tree-cell')
7003
- if (column.type === 'html') {
7004
- tipElem = cell.querySelector('.vxe-cell--html')
7005
- }
7006
- } else {
7007
- tipElem = cell.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label') as HTMLElement
7008
- }
7009
- handleTooltip(evnt, cell, (overflowElem || cell.children[0]) as HTMLElement, tipElem as HTMLElement, params)
7453
+ handleTooltip(evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper') as HTMLElement, null, params)
7010
7454
  }
7011
7455
  },
7012
7456
  /**
@@ -7018,7 +7462,7 @@ export default defineComponent({
7018
7462
  const cell = evnt.currentTarget as HTMLTableCellElement
7019
7463
  handleTargetEnterEvent(tooltipStore.column !== column || !!tooltipStore.row)
7020
7464
  if (tooltipStore.column !== column || !tooltipStore.visible) {
7021
- handleTooltip(evnt, cell, cell.querySelector('.vxe-cell--item') as HTMLElement || cell.children[0], null, params)
7465
+ handleTooltip(evnt, cell, cell.querySelector('.vxe-cell--wrapper') as HTMLElement || cell.children[0], null, params)
7022
7466
  }
7023
7467
  },
7024
7468
  handleTargetLeaveEvent () {
@@ -7031,11 +7475,11 @@ export default defineComponent({
7031
7475
  internalData.tooltipTimeout = setTimeout(() => {
7032
7476
  $tooltip = refTooltip.value
7033
7477
  if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
7034
- tableMethods.closeTooltip()
7478
+ $xeTable.closeTooltip()
7035
7479
  }
7036
7480
  }, tooltipOpts.leaveDelay)
7037
7481
  } else {
7038
- tableMethods.closeTooltip()
7482
+ $xeTable.closeTooltip()
7039
7483
  }
7040
7484
  },
7041
7485
  triggerHeaderCellClickEvent (evnt, params) {
@@ -7065,7 +7509,10 @@ export default defineComponent({
7065
7509
  */
7066
7510
  triggerCellClickEvent (evnt, params) {
7067
7511
  const { highlightCurrentRow, editConfig } = props
7068
- const { editStore } = reactData
7512
+ const { editStore, isDragResize } = reactData
7513
+ if (isDragResize) {
7514
+ return
7515
+ }
7069
7516
  const expandOpts = computeExpandOpts.value
7070
7517
  const editOpts = computeEditOpts.value
7071
7518
  const treeOpts = computeTreeOpts.value
@@ -7157,7 +7604,10 @@ export default defineComponent({
7157
7604
  */
7158
7605
  triggerCellDblclickEvent (evnt, params) {
7159
7606
  const { editConfig } = props
7160
- const { editStore } = reactData
7607
+ const { editStore, isDragResize } = reactData
7608
+ if (isDragResize) {
7609
+ return
7610
+ }
7161
7611
  const editOpts = computeEditOpts.value
7162
7612
  const { actived } = editStore
7163
7613
  const cell = evnt.currentTarget as HTMLDivElement
@@ -7366,10 +7816,13 @@ export default defineComponent({
7366
7816
  */
7367
7817
  triggerSortEvent (evnt, column, order) {
7368
7818
  const sortOpts = computeSortOpts.value
7819
+ const { multiple, allowClear } = sortOpts
7369
7820
  const { field, sortable } = column
7370
7821
  if (sortable) {
7371
7822
  if (!order || column.order === order) {
7372
- tableMethods.clearSort(sortOpts.multiple ? column : null)
7823
+ if (allowClear) {
7824
+ tableMethods.clearSort(multiple ? column : null)
7825
+ }
7373
7826
  } else {
7374
7827
  tableMethods.sort({ field, order })
7375
7828
  }
@@ -7461,7 +7914,7 @@ export default defineComponent({
7461
7914
  const { treeConfig, dragConfig } = props
7462
7915
  const rowDragOpts = computeRowDragOpts.value
7463
7916
  const { fullAllDataRowIdData } = internalData
7464
- const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts
7917
+ const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod, dragToChildMethod } = rowDragOpts
7465
7918
  const treeOpts = computeTreeOpts.value
7466
7919
  const { transform, rowField, mapChildrenField, parentField } = treeOpts
7467
7920
  const childrenField = treeOpts.children || treeOpts.childrenField
@@ -7471,17 +7924,15 @@ export default defineComponent({
7471
7924
  if (prevDragRow && dragRow) {
7472
7925
  // 判断是否有拖动
7473
7926
  if (prevDragRow !== dragRow) {
7474
- return Promise.resolve(
7475
- dEndMethod
7476
- ? dEndMethod({
7477
- oldRow: dragRow,
7478
- newRow: prevDragRow,
7479
- dragPos: prevDragPos as any,
7480
- dragToChild: !!prevDragToChild,
7481
- offsetIndex: dragOffsetIndex
7482
- })
7483
- : true
7484
- ).then((status) => {
7927
+ const dragParams = {
7928
+ oldRow: dragRow,
7929
+ newRow: prevDragRow,
7930
+ dragPos: prevDragPos as 'top' | 'bottom',
7931
+ dragToChild: !!prevDragToChild,
7932
+ offsetIndex: dragOffsetIndex as 0 | 1
7933
+ }
7934
+ const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
7935
+ return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
7485
7936
  if (!status) {
7486
7937
  return
7487
7938
  }
@@ -7561,7 +8012,11 @@ export default defineComponent({
7561
8012
  // 根到根
7562
8013
  }
7563
8014
 
7564
- const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, { children: childrenField })
8015
+ const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
8016
+ key: rowField,
8017
+ parentKey: parentField,
8018
+ children: mapChildrenField
8019
+ })
7565
8020
 
7566
8021
  // 移出
7567
8022
  const otfIndex = $xeTable.findRowIndexOf(fullList, dragRow)
@@ -7578,13 +8033,13 @@ export default defineComponent({
7578
8033
  childRow[parentField] = dragRow[parentField]
7579
8034
  })
7580
8035
  }
7581
- dragRow[parentField] = prevDragToChild ? prevDragRow[rowField] : prevDragRow[parentField]
8036
+ dragRow[parentField] = isDragToChildFlag ? prevDragRow[rowField] : prevDragRow[parentField]
7582
8037
 
7583
8038
  internalData.tableFullTreeData = XEUtils.toArrayTree(fullList, {
7584
- key: treeOpts.rowField,
7585
- parentKey: treeOpts.parentField,
8039
+ key: rowField,
8040
+ parentKey: parentField,
7586
8041
  children: childrenField,
7587
- mapChildren: treeOpts.mapChildrenField
8042
+ mapChildren: mapChildrenField
7588
8043
  })
7589
8044
  }
7590
8045
  }
@@ -7605,7 +8060,7 @@ export default defineComponent({
7605
8060
 
7606
8061
  reactData.isDragRowMove = true
7607
8062
  $xeTable.handleTableData(treeConfig && transform)
7608
- $xeTable.cacheRowMap()
8063
+ $xeTable.cacheRowMap(false)
7609
8064
  updateScrollYStatus()
7610
8065
  if (!(treeConfig && transform)) {
7611
8066
  $xeTable.updateAfterDataIndex()
@@ -7623,7 +8078,7 @@ export default defineComponent({
7623
8078
  oldRow: dragRow,
7624
8079
  newRow: prevDragRow,
7625
8080
  dragPos: prevDragPos as any,
7626
- dragToChild: !!prevDragToChild,
8081
+ dragToChild: isDragToChildFlag,
7627
8082
  offsetIndex: dragOffsetIndex,
7628
8083
  _index: {
7629
8084
  newIndex: nafIndex,
@@ -7644,18 +8099,16 @@ export default defineComponent({
7644
8099
  const { lazy } = treeOpts
7645
8100
  const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
7646
8101
  const { prevDragRow, prevDragPos } = internalData
7647
- if (treeConfig && prevDragToChild) {
8102
+ if (treeConfig && lazy && prevDragToChild) {
7648
8103
  // 懒加载
7649
- if (lazy) {
7650
- const newRowid = getRowid($xeTable, prevDragRow)
7651
- const rowRest = fullAllDataRowIdData[newRowid]
7652
- if (prevDragRow[hasChildField]) {
7653
- if (rowRest && rowRest.treeLoaded) {
7654
- $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
7655
- }
7656
- } else {
8104
+ const newRowid = getRowid($xeTable, prevDragRow)
8105
+ const rowRest = fullAllDataRowIdData[newRowid]
8106
+ if (prevDragRow[hasChildField]) {
8107
+ if (rowRest && rowRest.treeLoaded) {
7657
8108
  $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
7658
8109
  }
8110
+ } else {
8111
+ $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
7659
8112
  }
7660
8113
  } else {
7661
8114
  $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
@@ -7758,7 +8211,7 @@ export default defineComponent({
7758
8211
  handleColDragSwapEvent (evnt, isSyncColumn, dragCol, prevDragCol, prevDragPos, prevDragToChild) {
7759
8212
  const { mouseConfig } = props
7760
8213
  const columnDragOpts = computeColumnDragOpts.value
7761
- const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
8214
+ const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts
7762
8215
  const { collectColumn } = internalData
7763
8216
  const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0
7764
8217
  if (prevDragCol && dragCol) {
@@ -7766,17 +8219,15 @@ export default defineComponent({
7766
8219
  if (prevDragCol !== dragCol) {
7767
8220
  const oldColumn = dragCol
7768
8221
  const newColumn = prevDragCol
7769
- return Promise.resolve(
7770
- dragEndMethod
7771
- ? dragEndMethod({
7772
- oldColumn,
7773
- newColumn,
7774
- dragPos: prevDragPos as any,
7775
- dragToChild: !!prevDragToChild,
7776
- offsetIndex: dragOffsetIndex
7777
- })
7778
- : true
7779
- ).then((status) => {
8222
+ const dragParams = {
8223
+ oldColumn,
8224
+ newColumn,
8225
+ dragPos: prevDragPos as 'left' | 'right',
8226
+ dragToChild: !!prevDragToChild,
8227
+ offsetIndex: dragOffsetIndex as 0 | 1
8228
+ }
8229
+ const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
8230
+ return Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
7780
8231
  if (!status) {
7781
8232
  return
7782
8233
  }
@@ -7872,7 +8323,7 @@ export default defineComponent({
7872
8323
  if (newMatchRest) {
7873
8324
  const { items: nCols, index: nIndex, parent: nParent } = newMatchRest
7874
8325
  // 转子级
7875
- if ((isCrossDrag && isToChildDrag) && prevDragToChild) {
8326
+ if ((isCrossDrag && isToChildDrag) && isDragToChildFlag) {
7876
8327
  oldColumn.parentId = newColumn.id
7877
8328
  newColumn.children = (newColumn.children || []).concat([oldColumn])
7878
8329
  } else {
@@ -7906,7 +8357,7 @@ export default defineComponent({
7906
8357
  oldColumn,
7907
8358
  newColumn,
7908
8359
  dragPos: prevDragPos,
7909
- dragToChild: !!prevDragToChild,
8360
+ dragToChild: isDragToChildFlag,
7910
8361
  offsetIndex: dragOffsetIndex,
7911
8362
  _index: {
7912
8363
  newIndex: nafIndex,
@@ -8154,7 +8605,7 @@ export default defineComponent({
8154
8605
  }
8155
8606
  },
8156
8607
  triggerBodyScrollEvent (evnt, fixedType) {
8157
- const { elemStore, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
8608
+ const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
8158
8609
  const xHandleEl = refScrollXHandleElem.value
8159
8610
  const yHandleEl = refScrollYHandleElem.value
8160
8611
  const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
@@ -8165,6 +8616,9 @@ export default defineComponent({
8165
8616
  if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
8166
8617
  return
8167
8618
  }
8619
+ if (intoRunScroll) {
8620
+ return
8621
+ }
8168
8622
  if (!bodyScrollElem) {
8169
8623
  return
8170
8624
  }
@@ -8219,22 +8673,16 @@ export default defineComponent({
8219
8673
  })
8220
8674
  },
8221
8675
  triggerHeaderScrollEvent (evnt, fixedType) {
8222
- const { elemStore, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
8676
+ const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
8223
8677
  const yHandleEl = refScrollYHandleElem.value
8224
8678
  const xHandleEl = refScrollXHandleElem.value
8225
8679
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
8226
8680
  const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
8227
8681
  const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
8228
- if (inWheelScroll) {
8682
+ if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
8229
8683
  return
8230
8684
  }
8231
- if (inVirtualScroll) {
8232
- return
8233
- }
8234
- if (inBodyScroll) {
8235
- return
8236
- }
8237
- if (inFooterScroll) {
8685
+ if (intoRunScroll) {
8238
8686
  return
8239
8687
  }
8240
8688
  if (!headerScrollElem) {
@@ -8261,22 +8709,16 @@ export default defineComponent({
8261
8709
  })
8262
8710
  },
8263
8711
  triggerFooterScrollEvent (evnt, fixedType) {
8264
- const { elemStore, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
8712
+ const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
8265
8713
  const yHandleEl = refScrollYHandleElem.value
8266
8714
  const xHandleEl = refScrollXHandleElem.value
8267
8715
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
8268
8716
  const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
8269
8717
  const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
8270
- if (inWheelScroll) {
8271
- return
8272
- }
8273
- if (inVirtualScroll) {
8718
+ if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
8274
8719
  return
8275
8720
  }
8276
- if (inHeaderScroll) {
8277
- return
8278
- }
8279
- if (inBodyScroll) {
8721
+ if (intoRunScroll) {
8280
8722
  return
8281
8723
  }
8282
8724
  if (!footerScrollElem) {
@@ -8303,7 +8745,10 @@ export default defineComponent({
8303
8745
  })
8304
8746
  },
8305
8747
  triggerBodyWheelEvent (evnt) {
8306
- const { deltaY, deltaX } = evnt
8748
+ const { target, deltaY, deltaX } = evnt
8749
+ if (target && /^textarea$/i.test((target as HTMLElement).tagName)) {
8750
+ return
8751
+ }
8307
8752
  const { highlightHoverRow } = tableProps
8308
8753
  const { elemStore, lastScrollTop, lastScrollLeft } = internalData
8309
8754
  const rowOpts = computeRowOpts.value
@@ -8322,30 +8767,14 @@ export default defineComponent({
8322
8767
  if (!bodyScrollElem) {
8323
8768
  return
8324
8769
  }
8325
-
8326
- let multiple = 1
8327
-
8328
- if (reactData.lastScrollTime + 25 > Date.now()) {
8329
- multiple = 1.18
8330
- } else if (reactData.lastScrollTime + 30 > Date.now()) {
8331
- multiple = 1.15
8332
- } else if (reactData.lastScrollTime + 40 > Date.now()) {
8333
- multiple = 1.12
8334
- } else if (reactData.lastScrollTime + 55 > Date.now()) {
8335
- multiple = 1.09
8336
- } else if (reactData.lastScrollTime + 75 > Date.now()) {
8337
- multiple = 1.06
8338
- } else if (reactData.lastScrollTime + 100 > Date.now()) {
8339
- multiple = 1.03
8340
- }
8341
-
8342
- const deltaTop = deltaY * multiple
8343
- const deltaLeft = deltaX * multiple
8770
+ const wheelSpeed = getWheelSpeed(reactData.lastScrollTime)
8771
+ const deltaTop = deltaY * wheelSpeed
8772
+ const deltaLeft = deltaX * wheelSpeed
8344
8773
 
8345
8774
  const isTopWheel = deltaTop < 0
8346
- const currScrollTop = yHandleEl.scrollTop
8775
+ const currScrollTop = bodyScrollElem.scrollTop
8347
8776
  // 如果滚动位置已经是顶部或底部,则不需要触发
8348
- if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= yHandleEl.scrollHeight - yHandleEl.clientHeight) {
8777
+ if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
8349
8778
  return
8350
8779
  }
8351
8780
 
@@ -8361,16 +8790,31 @@ export default defineComponent({
8361
8790
  $xeTable.clearHoverRow()
8362
8791
  }
8363
8792
 
8364
- internalData.inWheelScroll = true
8365
- setScrollTop(yHandleEl, scrollTop)
8366
- setScrollTop(bodyScrollElem, scrollTop)
8367
- setScrollTop(leftScrollElem, scrollTop)
8368
- setScrollTop(rightScrollElem, scrollTop)
8369
- $xeTable.triggerScrollYEvent(evnt)
8370
- $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
8371
- type: 'footer',
8372
- fixed: ''
8793
+ wheelScrollTo(scrollTop - bodyScrollElem.scrollTop, (offsetTop: number) => {
8794
+ const currTopNum = bodyScrollElem.scrollTop + offsetTop
8795
+ internalData.inWheelScroll = true
8796
+ setScrollTop(yHandleEl, currTopNum)
8797
+ setScrollTop(bodyScrollElem, currTopNum)
8798
+ setScrollTop(leftScrollElem, currTopNum)
8799
+ setScrollTop(rightScrollElem, currTopNum)
8800
+ $xeTable.triggerScrollYEvent(evnt)
8801
+ $xeTable.handleScrollEvent(evnt, isRollY, isRollX, currTopNum, scrollLeft, {
8802
+ type: 'table',
8803
+ fixed: ''
8804
+ })
8373
8805
  })
8806
+
8807
+ // internalData.inWheelScroll = true
8808
+ // setScrollTop(yHandleEl, scrollTop)
8809
+ // setScrollTop(bodyScrollElem, scrollTop)
8810
+ // setScrollTop(leftScrollElem, scrollTop)
8811
+ // setScrollTop(rightScrollElem, scrollTop)
8812
+
8813
+ // loadScrollYData(scrollTop)
8814
+ // $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
8815
+ // type: 'footer',
8816
+ // fixed: ''
8817
+ // })
8374
8818
  }
8375
8819
  },
8376
8820
  triggerVirtualScrollXEvent (evnt) {
@@ -8509,34 +8953,34 @@ export default defineComponent({
8509
8953
  },
8510
8954
  // 更新纵向 Y 可视渲染上下剩余空间大小
8511
8955
  updateScrollYSpace () {
8512
- const { showOverflow } = props
8513
- const { scrollYLoad, rowHeight } = reactData
8514
- const { scrollYStore, elemStore, afterFullData, fullAllDataRowIdData } = internalData
8956
+ const { isAllOverflow, scrollYLoad } = reactData
8957
+ const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
8515
8958
  const { startIndex } = scrollYStore
8959
+ const rowOpts = computeRowOpts.value
8960
+ const cellOpts = computeCellOpts.value
8961
+ const defaultRowHeight = computeDefaultRowHeight.value
8516
8962
  const bodyTableElem = getRefElem(elemStore['main-body-table'])
8517
8963
  const containerList = ['main', 'left', 'right']
8518
8964
  let topSpaceHeight = 0
8519
8965
  let ySpaceHeight = 0
8966
+
8520
8967
  if (scrollYLoad) {
8521
- if (showOverflow) {
8522
- ySpaceHeight = afterFullData.length * rowHeight
8523
- topSpaceHeight = Math.max(0, startIndex * rowHeight)
8968
+ const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
8969
+ if (!isCustomCellHeight && isAllOverflow) {
8970
+ ySpaceHeight = afterFullData.length * defaultRowHeight
8971
+ topSpaceHeight = Math.max(0, startIndex * defaultRowHeight)
8524
8972
  } else {
8525
8973
  for (let i = 0; i < afterFullData.length; i++) {
8526
8974
  const row = afterFullData[i]
8527
8975
  const rowid = getRowid($xeTable, row)
8528
- const rowRest = fullAllDataRowIdData[rowid]
8529
- if (rowRest) {
8530
- ySpaceHeight += rowRest.height || rowHeight
8531
- }
8976
+ const rowRest = fullAllDataRowIdData[rowid] || {}
8977
+ ySpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
8532
8978
  }
8533
8979
  for (let i = 0; i < startIndex; i++) {
8534
8980
  const row = afterFullData[i]
8535
8981
  const rowid = getRowid($xeTable, row)
8536
- const rowRest = fullAllDataRowIdData[rowid]
8537
- if (rowRest) {
8538
- topSpaceHeight += rowRest.height || rowHeight
8539
- }
8982
+ const rowRest = fullAllDataRowIdData[rowid] || {}
8983
+ topSpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
8540
8984
  }
8541
8985
  }
8542
8986
  } else {
@@ -8561,28 +9005,24 @@ export default defineComponent({
8561
9005
  if (scrollYSpaceEl) {
8562
9006
  scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
8563
9007
  }
8564
- nextTick(() => {
9008
+ return nextTick().then(() => {
8565
9009
  updateStyle()
8566
9010
  })
8567
9011
  },
8568
9012
  updateScrollXData () {
8569
- const { showOverflow } = props
9013
+ const { isAllOverflow } = reactData
8570
9014
  handleTableColumn()
8571
- // calcCellHeight()
8572
9015
  return nextTick().then(() => {
8573
- // calcCellHeight()
8574
9016
  handleTableColumn()
8575
9017
  $xeTable.updateScrollXSpace()
8576
- if (!showOverflow) {
9018
+ if (!isAllOverflow) {
8577
9019
  $xeTable.updateScrollYSpace()
8578
9020
  }
8579
9021
  })
8580
9022
  },
8581
9023
  updateScrollYData () {
8582
9024
  $xeTable.handleTableData()
8583
- // calcCellHeight()
8584
9025
  return nextTick().then(() => {
8585
- // calcCellHeight()
8586
9026
  $xeTable.handleTableData()
8587
9027
  $xeTable.updateScrollYSpace()
8588
9028
  })
@@ -8942,10 +9382,11 @@ export default defineComponent({
8942
9382
 
8943
9383
  const renderVN = () => {
8944
9384
  const { loading, stripe, showHeader, height, treeConfig, mouseConfig, showFooter, highlightCell, highlightHoverRow, highlightHoverColumn, editConfig, editRules } = props
8945
- const { isCalcColumn, isGroup, overflowX, overflowY, scrollXLoad, scrollYLoad, tableData, initStore, columnStore, filterStore, customStore, tooltipStore } = reactData
9385
+ const { isGroup, overflowX, overflowY, scrollXLoad, scrollYLoad, tableData, initStore, columnStore, filterStore, customStore } = reactData
8946
9386
  const { leftList, rightList } = columnStore
8947
9387
  const loadingSlot = slots.loading
8948
- const tooltipOpts = computeTooltipOpts.value
9388
+ const tableTipConfig = computeTableTipConfig.value
9389
+ const validTipConfig = computeValidTipConfig.value
8949
9390
  const validOpts = computeValidOpts.value
8950
9391
  const checkboxOpts = computeCheckboxOpts.value
8951
9392
  const treeOpts = computeTreeOpts.value
@@ -8957,7 +9398,7 @@ export default defineComponent({
8957
9398
  const areaOpts = computeAreaOpts.value
8958
9399
  const loadingOpts = computeLoadingOpts.value
8959
9400
  const isMenu = computeIsMenu.value
8960
- const currLoading = reactData.isLoading || loading
9401
+ const currLoading = reactData.isColLoading || reactData.isRowLoading || loading
8961
9402
  const resizableOpts = computeResizableOpts.value
8962
9403
  const isArea = mouseConfig && mouseOpts.area
8963
9404
  const columnDragOpts = computeColumnDragOpts.value
@@ -8978,7 +9419,6 @@ export default defineComponent({
8978
9419
  'row--highlight': rowOpts.isHover || highlightHoverRow,
8979
9420
  'column--highlight': columnOpts.isHover || highlightHoverColumn,
8980
9421
  'checkbox--range': checkboxOpts.range,
8981
- 'column--calc': isCalcColumn,
8982
9422
  'col--drag-cell': columnOpts.drag && columnDragOpts.trigger === 'cell',
8983
9423
  'is--header': showHeader,
8984
9424
  'is--footer': showFooter,
@@ -8987,7 +9427,6 @@ export default defineComponent({
8987
9427
  'is--fixed-left': leftList.length,
8988
9428
  'is--fixed-right': rightList.length,
8989
9429
  'is--animat': !!props.animat,
8990
- 'is--padding': props.padding,
8991
9430
  'is--round': props.round,
8992
9431
  'is--stripe': !treeConfig && stripe,
8993
9432
  'is--loading': currLoading,
@@ -9041,13 +9480,26 @@ export default defineComponent({
9041
9480
  * 列宽线
9042
9481
  */
9043
9482
  h('div', {
9044
- key: 'cl',
9045
- ref: refCellResizeBar,
9046
- class: 'vxe-table--resizable-bar'
9483
+ key: 'tcl',
9484
+ ref: refColResizeBar,
9485
+ class: 'vxe-table--resizable-col-bar'
9486
+ }, resizableOpts.showDragTip
9487
+ ? [
9488
+ h('div', {
9489
+ class: 'vxe-table--resizable-number-tip'
9490
+ })
9491
+ ]
9492
+ : []),
9493
+ /**
9494
+ * 行高线
9495
+ */
9496
+ h('div', {
9497
+ key: 'trl',
9498
+ ref: refRowResizeBar,
9499
+ class: 'vxe-table--resizable-row-bar'
9047
9500
  }, resizableOpts.showDragTip
9048
9501
  ? [
9049
9502
  h('div', {
9050
- ref: refCellResizeTip,
9051
9503
  class: 'vxe-table--resizable-number-tip'
9052
9504
  })
9053
9505
  ]
@@ -9144,10 +9596,14 @@ export default defineComponent({
9144
9596
  /**
9145
9597
  * 工具提示
9146
9598
  */
9147
- h(VxeUITooltipComponent, Object.assign({
9599
+ h(VxeUITooltipComponent, {
9148
9600
  key: 'btp',
9149
- ref: refTooltip
9150
- }, tooltipOpts, tooltipStore.currOpts)),
9601
+ ref: refTooltip,
9602
+ theme: tableTipConfig.theme,
9603
+ enterable: tableTipConfig.enterable,
9604
+ enterDelay: tableTipConfig.enterDelay,
9605
+ leaveDelay: tableTipConfig.leaveDelay
9606
+ }),
9151
9607
  /**
9152
9608
  * 校验提示
9153
9609
  */
@@ -9158,7 +9614,10 @@ export default defineComponent({
9158
9614
  class: [{
9159
9615
  'old-cell-valid': editRules && getConfig().cellVaildMode === 'obsolete'
9160
9616
  }, 'vxe-table--valid-error'],
9161
- ...(validOpts.message === 'tooltip' || tableData.length === 1 ? Object.assign({ isArrow: false }, tooltipOpts) : {}) as any
9617
+ theme: validTipConfig.theme,
9618
+ enterable: validTipConfig.enterable,
9619
+ enterDelay: validTipConfig.enterDelay,
9620
+ leaveDelay: validTipConfig.leaveDelay
9162
9621
  })
9163
9622
  : renderEmptyElement($xeTable)
9164
9623
  ])
@@ -9179,7 +9638,7 @@ export default defineComponent({
9179
9638
  if (value && value.length >= 50000) {
9180
9639
  warnLog('vxe.error.errLargeData', ['loadData(data), reloadData(data)'])
9181
9640
  }
9182
- loadTableData(value).then(() => {
9641
+ loadTableData(value, true).then(() => {
9183
9642
  const { scrollXLoad, scrollYLoad, expandColumn } = reactData
9184
9643
  internalData.inited = true
9185
9644
  internalData.initStatus = true
@@ -9278,10 +9737,10 @@ export default defineComponent({
9278
9737
 
9279
9738
  watch(() => props.syncResize, (value) => {
9280
9739
  if (value) {
9281
- handleUupdateResize()
9740
+ handleUpdateResize()
9282
9741
  nextTick(() => {
9283
- handleUupdateResize()
9284
- setTimeout(() => handleUupdateResize())
9742
+ handleUpdateResize()
9743
+ setTimeout(() => handleUpdateResize())
9285
9744
  })
9286
9745
  }
9287
9746
  })
@@ -9393,6 +9852,9 @@ export default defineComponent({
9393
9852
  if (props.showFooter && !(props.footerMethod || props.footerData)) {
9394
9853
  warnLog('vxe.error.reqProp', ['footer-data | footer-method'])
9395
9854
  }
9855
+ if (rowOpts.height) {
9856
+ warnLog('vxe.error.delProp', ['row-config.height', 'cell-config.height'])
9857
+ }
9396
9858
  // if (props.highlightCurrentRow) {
9397
9859
  // warnLog('vxe.error.delProp', ['highlight-current-row', 'row-config.isCurrent'])
9398
9860
  // }
@@ -9504,7 +9966,7 @@ export default defineComponent({
9504
9966
  visibleSize: 0
9505
9967
  })
9506
9968
 
9507
- loadTableData(data || []).then(() => {
9969
+ loadTableData(data || [], true).then(() => {
9508
9970
  if (data && data.length) {
9509
9971
  internalData.inited = true
9510
9972
  internalData.initStatus = true