vxe-table 3.12.10-beta.9 → 3.12.10

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/index.css +1 -1
  2. package/es/index.min.css +1 -1
  3. package/es/locale/lang/ar-EG.js +2 -1
  4. package/es/locale/lang/de-DE.js +2 -1
  5. package/es/locale/lang/en-US.js +4 -3
  6. package/es/locale/lang/es-ES.js +2 -1
  7. package/es/locale/lang/fr-FR.js +2 -1
  8. package/es/locale/lang/hu-HU.js +2 -1
  9. package/es/locale/lang/hy-AM.js +2 -1
  10. package/es/locale/lang/it-IT.js +2 -1
  11. package/es/locale/lang/ja-JP.js +2 -1
  12. package/es/locale/lang/ko-KR.js +2 -1
  13. package/es/locale/lang/nb-NO.js +2 -1
  14. package/es/locale/lang/pt-BR.js +2 -1
  15. package/es/locale/lang/ru-RU.js +4 -3
  16. package/es/locale/lang/th-TH.js +2 -1
  17. package/es/locale/lang/ug-CN.js +2 -1
  18. package/es/locale/lang/uk-UA.js +518 -517
  19. package/es/locale/lang/vi-VN.js +2 -1
  20. package/es/locale/lang/zh-CHT.js +2 -1
  21. package/es/locale/lang/zh-CN.js +2 -1
  22. package/es/style.css +1 -1
  23. package/es/style.min.css +1 -1
  24. package/es/table/module/edit/mixin.js +7 -7
  25. package/es/table/module/export/mixin.js +105 -69
  26. package/es/table/module/keyboard/mixin.js +68 -25
  27. package/es/table/module/menu/mixin.js +3 -1
  28. package/es/table/src/body.js +125 -86
  29. package/es/table/src/cell.js +43 -57
  30. package/es/table/src/column.js +43 -8
  31. package/es/table/src/columnInfo.js +3 -0
  32. package/es/table/src/footer.js +47 -6
  33. package/es/table/src/header.js +67 -165
  34. package/es/table/src/methods.js +962 -480
  35. package/es/table/src/props.js +14 -4
  36. package/es/table/src/table.js +114 -33
  37. package/es/table/src/util.js +73 -57
  38. package/es/table/style.css +246 -191
  39. package/es/table/style.min.css +1 -1
  40. package/es/ui/index.js +20 -6
  41. package/es/ui/src/log.js +1 -1
  42. package/es/vxe-table/style.css +246 -191
  43. package/es/vxe-table/style.min.css +1 -1
  44. package/lib/index.css +1 -1
  45. package/lib/index.min.css +1 -1
  46. package/lib/index.umd.js +1734 -1020
  47. package/lib/index.umd.min.js +1 -1
  48. package/lib/locale/lang/ar-EG.js +2 -1
  49. package/lib/locale/lang/ar-EG.min.js +1 -1
  50. package/lib/locale/lang/de-DE.js +2 -1
  51. package/lib/locale/lang/de-DE.min.js +1 -1
  52. package/lib/locale/lang/en-US.js +4 -3
  53. package/lib/locale/lang/en-US.min.js +1 -1
  54. package/lib/locale/lang/en-US.umd.js +4 -3
  55. package/lib/locale/lang/es-ES.js +2 -1
  56. package/lib/locale/lang/es-ES.min.js +1 -1
  57. package/lib/locale/lang/es-ES.umd.js +2 -1
  58. package/lib/locale/lang/fr-FR.js +2 -1
  59. package/lib/locale/lang/fr-FR.min.js +1 -1
  60. package/lib/locale/lang/hu-HU.js +2 -1
  61. package/lib/locale/lang/hu-HU.min.js +1 -1
  62. package/lib/locale/lang/hu-HU.umd.js +2 -1
  63. package/lib/locale/lang/hy-AM.js +2 -1
  64. package/lib/locale/lang/hy-AM.min.js +1 -1
  65. package/lib/locale/lang/it-IT.js +2 -1
  66. package/lib/locale/lang/it-IT.min.js +1 -1
  67. package/lib/locale/lang/ja-JP.js +2 -1
  68. package/lib/locale/lang/ja-JP.min.js +1 -1
  69. package/lib/locale/lang/ja-JP.umd.js +2 -1
  70. package/lib/locale/lang/ko-KR.js +2 -1
  71. package/lib/locale/lang/ko-KR.min.js +1 -1
  72. package/lib/locale/lang/ko-KR.umd.js +2 -1
  73. package/lib/locale/lang/nb-NO.js +2 -1
  74. package/lib/locale/lang/nb-NO.min.js +1 -1
  75. package/lib/locale/lang/pt-BR.js +2 -1
  76. package/lib/locale/lang/pt-BR.min.js +1 -1
  77. package/lib/locale/lang/pt-BR.umd.js +2 -1
  78. package/lib/locale/lang/ru-RU.js +4 -3
  79. package/lib/locale/lang/ru-RU.min.js +1 -1
  80. package/lib/locale/lang/ru-RU.umd.js +4 -3
  81. package/lib/locale/lang/th-TH.js +2 -1
  82. package/lib/locale/lang/th-TH.min.js +1 -1
  83. package/lib/locale/lang/ug-CN.js +2 -1
  84. package/lib/locale/lang/ug-CN.min.js +1 -1
  85. package/lib/locale/lang/uk-UA.js +518 -517
  86. package/lib/locale/lang/uk-UA.min.js +1 -1
  87. package/lib/locale/lang/uk-UA.umd.js +518 -517
  88. package/lib/locale/lang/vi-VN.js +2 -1
  89. package/lib/locale/lang/vi-VN.min.js +1 -1
  90. package/lib/locale/lang/zh-CHT.js +2 -1
  91. package/lib/locale/lang/zh-CHT.min.js +1 -1
  92. package/lib/locale/lang/zh-CHT.umd.js +2 -1
  93. package/lib/locale/lang/zh-CN.js +2 -1
  94. package/lib/locale/lang/zh-CN.min.js +1 -1
  95. package/lib/locale/lang/zh-CN.umd.js +2 -1
  96. package/lib/style.css +1 -1
  97. package/lib/style.min.css +1 -1
  98. package/lib/table/module/edit/mixin.js +7 -2
  99. package/lib/table/module/edit/mixin.min.js +1 -1
  100. package/lib/table/module/export/mixin.js +105 -64
  101. package/lib/table/module/export/mixin.min.js +1 -1
  102. package/lib/table/module/keyboard/mixin.js +73 -27
  103. package/lib/table/module/keyboard/mixin.min.js +1 -1
  104. package/lib/table/module/menu/mixin.js +3 -1
  105. package/lib/table/src/body.js +124 -79
  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 +12 -0
  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/footer.js +43 -4
  114. package/lib/table/src/footer.min.js +1 -1
  115. package/lib/table/src/header.js +49 -172
  116. package/lib/table/src/header.min.js +1 -1
  117. package/lib/table/src/methods.js +1072 -538
  118. package/lib/table/src/methods.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 +113 -36
  122. package/lib/table/src/table.min.js +1 -1
  123. package/lib/table/src/util.js +87 -70
  124. package/lib/table/src/util.min.js +1 -1
  125. package/lib/table/style/style.css +246 -191
  126. package/lib/table/style/style.min.css +1 -1
  127. package/lib/ui/index.js +20 -6
  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 +246 -191
  132. package/lib/vxe-table/style/style.min.css +1 -1
  133. package/package.json +2 -2
  134. package/packages/locale/lang/ar-EG.ts +2 -1
  135. package/packages/locale/lang/de-DE.ts +2 -1
  136. package/packages/locale/lang/en-US.ts +4 -3
  137. package/packages/locale/lang/es-ES.ts +2 -1
  138. package/packages/locale/lang/fr-FR.ts +2 -1
  139. package/packages/locale/lang/hu-HU.ts +2 -1
  140. package/packages/locale/lang/hy-AM.ts +2 -1
  141. package/packages/locale/lang/it-IT.ts +2 -1
  142. package/packages/locale/lang/ja-JP.ts +2 -1
  143. package/packages/locale/lang/ko-KR.ts +2 -1
  144. package/packages/locale/lang/nb-NO.ts +2 -1
  145. package/packages/locale/lang/pt-BR.ts +2 -1
  146. package/packages/locale/lang/ru-RU.ts +4 -3
  147. package/packages/locale/lang/th-TH.ts +2 -1
  148. package/packages/locale/lang/ug-CN.ts +2 -1
  149. package/packages/locale/lang/uk-UA.ts +518 -517
  150. package/packages/locale/lang/vi-VN.ts +2 -1
  151. package/packages/locale/lang/zh-CHT.ts +2 -1
  152. package/packages/locale/lang/zh-CN.ts +2 -1
  153. package/packages/table/module/edit/mixin.ts +7 -7
  154. package/packages/table/module/export/mixin.ts +138 -80
  155. package/packages/table/module/keyboard/mixin.ts +65 -24
  156. package/packages/table/module/menu/mixin.ts +4 -1
  157. package/packages/table/src/body.ts +136 -89
  158. package/packages/table/src/cell.ts +45 -67
  159. package/packages/table/src/column.ts +48 -10
  160. package/packages/table/src/columnInfo.ts +3 -0
  161. package/packages/table/src/footer.ts +50 -7
  162. package/packages/table/src/header.ts +67 -166
  163. package/packages/table/src/methods.ts +1007 -492
  164. package/packages/table/src/props.ts +16 -6
  165. package/packages/table/src/table.ts +124 -33
  166. package/packages/table/src/util.ts +82 -62
  167. package/packages/ui/index.ts +19 -5
  168. package/styles/components/table.scss +313 -274
  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 -0
  173. /package/es/{iconfont.1736854649055.ttf → iconfont.1738985837413.ttf} +0 -0
  174. /package/es/{iconfont.1736854649055.woff → iconfont.1738985837413.woff} +0 -0
  175. /package/es/{iconfont.1736854649055.woff2 → iconfont.1738985837413.woff2} +0 -0
  176. /package/lib/{iconfont.1736854649055.ttf → iconfont.1738985837413.ttf} +0 -0
  177. /package/lib/{iconfont.1736854649055.woff → iconfont.1738985837413.woff} +0 -0
  178. /package/lib/{iconfont.1736854649055.woff2 → iconfont.1738985837413.woff2} +0 -0
@@ -1,5 +1,5 @@
1
1
  import XEUtils from 'xe-utils'
2
- import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft } from '../../ui/src/dom'
2
+ import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft } from '../../ui/src/dom'
3
3
  import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils'
4
4
  import { VxeUI } from '../../ui'
5
5
  import Cell from './cell'
@@ -329,7 +329,7 @@ function updateAfterListIndex ($xeTable: VxeTableConstructor) {
329
329
  rowRest.seq = seq
330
330
  rowRest._index = index
331
331
  } else {
332
- const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 }
332
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
333
333
  fullAllDataRowIdData[rowid] = rest
334
334
  fullDataRowIdData[rowid] = rest
335
335
  }
@@ -361,7 +361,7 @@ function updateAfterDataIndex ($xeTable: VxeTableConstructor) {
361
361
  rowRest.seq = seq
362
362
  rowRest.treeIndex = index
363
363
  } else {
364
- const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 }
364
+ const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 }
365
365
  fullAllDataRowIdData[rowid] = rest
366
366
  fullDataRowIdData[rowid] = rest
367
367
  }
@@ -417,14 +417,16 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
417
417
  const reactData = $xeTable as unknown as TableReactData
418
418
  const internalData = $xeTable as unknown as TableInternalData
419
419
 
420
- const { border, showOverflow: allColumnOverflow, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
421
- const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, scrollbarWidth, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
420
+ const { border, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
421
+ const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
422
422
  const { visibleColumn, fullColumnIdData, tableHeight, tableWidth, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData
423
423
  const el = $xeTable.$refs.refElem as HTMLDivElement
424
424
  if (!el) {
425
425
  return
426
426
  }
427
427
  const containerList = ['main', 'left', 'right']
428
+ const osbWidth = overflowY ? scrollbarWidth : 0
429
+ const osbHeight = overflowX ? scrollbarHeight : 0
428
430
  const emptyPlaceholderElem = $xeTable.$refs.refEmptyPlaceholder as HTMLDivElement
429
431
  const cellOffsetWidth = $xeTable.computeCellOffsetWidth
430
432
  const mouseOpts = $xeTable.computeMouseOpts
@@ -432,17 +434,17 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
432
434
  const bodyTableElem = getRefElem(elemStore['main-body-table'])
433
435
  if (emptyPlaceholderElem) {
434
436
  emptyPlaceholderElem.style.top = `${headerHeight}px`
435
- emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - scrollbarHeight}px` : ''
437
+ emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : ''
436
438
  }
437
439
 
438
440
  let bodyHeight = 0
439
441
  let bodyMaxHeight = 0
440
- const bodyMinHeight = customMinHeight - headerHeight - footerHeight - scrollbarHeight
442
+ const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight
441
443
  if (customMaxHeight) {
442
- bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - scrollbarHeight)
444
+ bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight)
443
445
  }
444
446
  if (customHeight) {
445
- bodyHeight = customHeight - headerHeight - footerHeight - scrollbarHeight
447
+ bodyHeight = customHeight - headerHeight - footerHeight - osbHeight
446
448
  }
447
449
  if (!bodyHeight) {
448
450
  if (bodyTableElem) {
@@ -461,28 +463,28 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
461
463
  const scrollbarXToTop = $xeTable.computeScrollbarXToTop
462
464
  const scrollXVirtualEl = $xeTable.$refs.refScrollXVirtualElem as HTMLDivElement
463
465
  if (scrollXVirtualEl) {
464
- scrollXVirtualEl.style.height = `${scrollbarHeight}px`
465
- scrollXVirtualEl.style.visibility = scrollbarHeight ? 'visible' : 'hidden'
466
+ scrollXVirtualEl.style.height = `${osbHeight}px`
467
+ scrollXVirtualEl.style.visibility = overflowX ? 'visible' : 'hidden'
466
468
  }
467
469
  const xWrapperEl = $xeTable.$refs.refScrollXWrapperElem as HTMLDivElement
468
470
  if (xWrapperEl) {
469
- xWrapperEl.style.left = scrollbarXToTop ? `${scrollbarWidth}px` : ''
470
- xWrapperEl.style.width = `${el.clientWidth - scrollbarWidth}px`
471
+ xWrapperEl.style.left = scrollbarXToTop ? `${osbWidth}px` : ''
472
+ xWrapperEl.style.width = `${el.clientWidth - osbWidth}px`
471
473
  }
472
474
  if (xLeftCornerEl) {
473
- xLeftCornerEl.style.width = scrollbarXToTop ? `${scrollbarWidth}px` : ''
474
- xLeftCornerEl.style.display = scrollbarXToTop ? (scrollbarWidth && scrollbarHeight ? 'block' : '') : ''
475
+ xLeftCornerEl.style.width = scrollbarXToTop ? `${osbWidth}px` : ''
476
+ xLeftCornerEl.style.display = scrollbarXToTop ? (osbWidth && osbHeight ? 'block' : '') : ''
475
477
  }
476
478
  if (xRightCornerEl) {
477
- xRightCornerEl.style.width = scrollbarXToTop ? '' : `${scrollbarWidth}px`
478
- xRightCornerEl.style.display = scrollbarXToTop ? '' : (scrollbarWidth && scrollbarHeight ? 'block' : '')
479
+ xRightCornerEl.style.width = scrollbarXToTop ? '' : `${osbWidth}px`
480
+ xRightCornerEl.style.display = scrollbarXToTop ? '' : (osbWidth && osbHeight ? 'block' : '')
479
481
  }
480
482
 
481
483
  const scrollYVirtualEl = $xeTable.$refs.refScrollYVirtualElem as HTMLDivElement
482
484
  if (scrollYVirtualEl) {
483
- scrollYVirtualEl.style.width = `${scrollbarWidth}px`
485
+ scrollYVirtualEl.style.width = `${osbWidth}px`
484
486
  scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`
485
- scrollYVirtualEl.style.visibility = scrollbarWidth ? 'visible' : 'hidden'
487
+ scrollYVirtualEl.style.visibility = overflowY ? 'visible' : 'hidden'
486
488
  }
487
489
  const yTopCornerEl = $xeTable.$refs.refScrollYTopCornerElem as HTMLDivElement
488
490
  if (yTopCornerEl) {
@@ -608,7 +610,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
608
610
  if (wrapperElem) {
609
611
  wrapperElem.style.top = `${headerHeight}px`
610
612
  }
611
- fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + scrollbarHeight)}px`
613
+ fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + osbHeight)}px`
612
614
  fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`
613
615
  }
614
616
 
@@ -617,7 +619,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
617
619
 
618
620
  let isOptimizeMode = false
619
621
  // 如果是使用优化模式
620
- if (scrollXLoad || scrollYLoad || (allColumnOverflow && isAllOverflow)) {
622
+ if (scrollXLoad || scrollYLoad || isAllOverflow) {
621
623
  if (expandColumn || spanMethod || footerSpanMethod) {
622
624
  // 如果不支持优化模式
623
625
  } else {
@@ -643,7 +645,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
643
645
  if (tableElem) {
644
646
  tableElem.style.width = tWidth ? `${tWidth}px` : ''
645
647
  // 兼容性处理
646
- tableElem.style.paddingRight = scrollbarWidth && fixedType && (browse['-moz'] || browse.safari) ? `${scrollbarWidth}px` : ''
648
+ tableElem.style.paddingRight = osbWidth && fixedType && (browse['-moz'] || browse.safari) ? `${osbWidth}px` : ''
647
649
  }
648
650
  const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`])
649
651
  if (emptyBlockElem) {
@@ -683,7 +685,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
683
685
  // 如果是固定列
684
686
  if (fixedWrapperElem) {
685
687
  if (wrapperElem) {
686
- wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - scrollbarHeight : tableHeight + headerHeight}px`
688
+ wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - osbHeight : tableHeight + headerHeight}px`
687
689
  }
688
690
  }
689
691
  }
@@ -706,7 +708,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
706
708
  } else if (layout === 'footer') {
707
709
  cellOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow
708
710
  } else {
709
- cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ? allColumnOverflow : showOverflow
711
+ cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ? isAllOverflow : showOverflow
710
712
  }
711
713
  const showEllipsis = cellOverflow === 'ellipsis'
712
714
  const showTitle = cellOverflow === 'title'
@@ -751,15 +753,15 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
751
753
  }
752
754
 
753
755
  function computeRowHeight ($xeTable: VxeTableConstructor) {
754
- const props = $xeTable
756
+ const reactData = $xeTable as unknown as TableReactData
755
757
 
756
- const { showOverflow } = props
758
+ const { isAllOverflow } = reactData
757
759
  const tableHeader = $xeTable.$refs.refTableHeader
758
760
  const tableBody = $xeTable.$refs.refTableBody
759
761
  const tableBodyElem = tableBody ? (tableBody as any).$el as HTMLDivElement : null
760
762
  const defaultRowHeight = $xeTable.computeDefaultRowHeight
761
763
  let rowHeight = 0
762
- if (showOverflow) {
764
+ if (isAllOverflow) {
763
765
  if (tableBodyElem) {
764
766
  const tableHeaderElem = tableHeader ? (tableHeader as any).$el as HTMLDivElement : null
765
767
  let firstTrElem
@@ -781,30 +783,33 @@ function computeRowHeight ($xeTable: VxeTableConstructor) {
781
783
  return Math.max(18, rowHeight)
782
784
  }
783
785
 
784
- function handleVirtualYVisible ($xeTable: VxeTableConstructor) {
785
- const props = $xeTable
786
+ function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: number) {
786
787
  const reactData = $xeTable as unknown as TableReactData
787
788
  const internalData = $xeTable as unknown as TableInternalData
788
789
 
789
- const { showOverflow } = props
790
- const { rowHeight } = reactData
791
- const { elemStore, afterFullData, fullAllDataRowIdData } = internalData
790
+ const { isAllOverflow } = reactData
791
+ const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
792
+ const rowOpts = $xeTable.computeRowOpts
793
+ const cellOpts = $xeTable.computeCellOpts
794
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
792
795
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
793
796
  if (bodyScrollElem) {
794
- const { scrollTop, clientHeight } = bodyScrollElem
797
+ const clientHeight = bodyScrollElem.clientHeight
798
+ const scrollTop = XEUtils.isNumber(currScrollTop) ? currScrollTop : bodyScrollElem.scrollTop
795
799
  const endHeight = scrollTop + clientHeight
796
800
  let toVisibleIndex = -1
797
801
  let offsetTop = 0
798
802
  let visibleSize = 0
799
- if (showOverflow) {
800
- toVisibleIndex = Math.floor(scrollTop / rowHeight)
801
- visibleSize = Math.ceil(clientHeight / rowHeight) + 1
803
+ const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
804
+ if (!isCustomCellHeight && isAllOverflow) {
805
+ toVisibleIndex = Math.floor(scrollTop / defaultRowHeight)
806
+ visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1
802
807
  } else {
803
808
  for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
804
809
  const row = afterFullData[rIndex]
805
810
  const rowid = getRowid($xeTable, row)
806
- const rowRest = fullAllDataRowIdData[rowid]
807
- offsetTop += rowRest ? (rowRest.height || rowHeight) : rowHeight
811
+ const rowRest = fullAllDataRowIdData[rowid] || {}
812
+ offsetTop += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
808
813
  if (toVisibleIndex === -1 && scrollTop < offsetTop) {
809
814
  toVisibleIndex = rIndex
810
815
  }
@@ -1060,7 +1065,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
1060
1065
  }
1061
1066
  const tableHeight = bodyElem.offsetHeight
1062
1067
  const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight
1063
- reactData.scrollbarWidth = overflowY ? Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth) : 0
1068
+ reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth)
1064
1069
  reactData.overflowY = overflowY
1065
1070
  internalData.tableWidth = tableWidth
1066
1071
  internalData.tableHeight = tableHeight
@@ -1070,7 +1075,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
1070
1075
  const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0
1071
1076
  const overflowX = tableWidth > bodyWidth
1072
1077
  const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0
1073
- reactData.scrollbarHeight = overflowX ? Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight) : 0
1078
+ reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight)
1074
1079
  internalData.headerHeight = headerHeight
1075
1080
  internalData.footerHeight = footerHeight
1076
1081
  reactData.overflowX = overflowX
@@ -1081,64 +1086,38 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
1081
1086
  }
1082
1087
  }
1083
1088
 
1084
- // const updateCellOffset = ($xeTable: VxeTableConstructor) => {
1085
- // const internalData = $xeTable as unknown as TableInternalData
1086
-
1087
- // const { chTimeout, chRunTime } = internalData
1088
- // if (chTimeout) {
1089
- // clearTimeout(chTimeout)
1090
- // }
1091
- // if (!chRunTime || chRunTime + 10 < Date.now()) {
1092
- // internalData.chRunTime = Date.now()
1093
- // }
1094
- // internalData.chTimeout = setTimeout(() => {
1095
- // internalData.chRunTime = undefined
1096
- // internalData.chTimeout = undefined
1097
- // }, 80)
1098
- // }
1089
+ const calcCellAutoHeight = (rowRest: VxeTableDefines.RowCacheItem, wrapperEl: HTMLDivElement) => {
1090
+ const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`)
1091
+ let colHeight = rowRest.height
1092
+ for (let i = 0; i < cellElemList.length; i++) {
1093
+ const cellElem = cellElemList[i] as HTMLElement
1094
+ const tdEl = cellElem.parentElement as HTMLTableCellElement
1095
+ const topBottomPadding = Math.ceil(XEUtils.toNumber(tdEl.style.paddingTop) + XEUtils.toNumber(tdEl.style.paddingBottom))
1096
+ const cellHeight = cellElem ? cellElem.clientHeight : 0
1097
+ colHeight = Math.max(colHeight - topBottomPadding, Math.ceil(cellHeight))
1098
+ }
1099
+ return colHeight
1100
+ }
1099
1101
 
1100
1102
  const calcCellHeight = ($xeTable: VxeTableConstructor) => {
1101
- const props = $xeTable
1102
1103
  const reactData = $xeTable as unknown as TableReactData
1103
1104
  const internalData = $xeTable as unknown as TableInternalData
1104
1105
 
1105
- const { showOverflow } = props
1106
- const { tableData, scrollXLoad } = reactData
1106
+ const { tableData, isAllOverflow, scrollYLoad, scrollXLoad } = reactData
1107
1107
  const { fullAllDataRowIdData } = internalData
1108
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
1108
1109
  const el = $xeTable.$refs.refElem as HTMLDivElement
1109
- if (!showOverflow && el) {
1110
- let paddingTop = 0
1111
- let paddingBottom = 0
1112
- let calcPadding = false
1110
+ if (!isAllOverflow && scrollYLoad && el) {
1113
1111
  tableData.forEach(row => {
1114
1112
  const rowid = getRowid($xeTable, row)
1115
1113
  const rowRest = fullAllDataRowIdData[rowid]
1116
- const cellList = el.querySelectorAll(`.vxe-body--row[rowid="${rowid}"]>.vxe-body--column>.vxe-cell>.vxe-cell--auto-wrapper`)
1117
- if (rowRest && cellList.length) {
1118
- let height = 0
1119
- for (let i = 0; i < cellList.length; i++) {
1120
- const cellElem = cellList[i] as HTMLElement
1121
- const tdEl = cellElem.parentElement as HTMLTableCellElement
1122
- if (!tdEl || !tdEl.clientWidth) {
1123
- break
1124
- }
1125
- if (!calcPadding) {
1126
- paddingTop = XEUtils.toNumber(getComputedStyle(tdEl).paddingTop)
1127
- paddingBottom = XEUtils.toNumber(getComputedStyle(tdEl).paddingBottom)
1128
- calcPadding = true
1129
- }
1130
- let cellHeight = paddingTop + paddingBottom
1131
- if (cellElem) {
1132
- cellHeight += cellElem.clientHeight
1133
- }
1134
- height = Math.max(height, cellHeight)
1135
- }
1136
- rowRest.height = scrollXLoad ? Math.max(rowRest.height, height) : height
1114
+ if (rowRest) {
1115
+ const height = calcCellAutoHeight(rowRest, el)
1116
+ rowRest.height = Math.max(defaultRowHeight, scrollXLoad ? Math.max(rowRest.height, height) : height)
1137
1117
  }
1138
1118
  })
1139
- reactData.isCalcCellHeight++
1119
+ reactData.calcCellHeightFlag++
1140
1120
  }
1141
- // updateCellOffset()
1142
1121
  }
1143
1122
 
1144
1123
  function getOrderField (_vm: any, column: any) {
@@ -1161,6 +1140,20 @@ function getOrderField (_vm: any, column: any) {
1161
1140
  }
1162
1141
  }
1163
1142
 
1143
+ function handleTargetEnterEvent ($xeTable: VxeTableConstructor, isClear: boolean) {
1144
+ const internalData = $xeTable as unknown as TableInternalData
1145
+
1146
+ const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
1147
+ clearTimeout(internalData.tooltipTimeout)
1148
+ if (isClear) {
1149
+ $xeTable.closeTooltip()
1150
+ } else {
1151
+ if ($tooltip && $tooltip.setActived) {
1152
+ $tooltip.setActived(true)
1153
+ }
1154
+ }
1155
+ }
1156
+
1164
1157
  function clearDragStatus ($xeTable: any) {
1165
1158
  const reactData = $xeTable
1166
1159
 
@@ -1268,9 +1261,11 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
1268
1261
  if (!el) {
1269
1262
  return
1270
1263
  }
1271
- const { scrollbarWidth, scrollbarHeight } = reactData
1264
+ const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
1272
1265
  const { prevDragToChild } = internalData
1273
1266
  const wrapperRect = el.getBoundingClientRect()
1267
+ const osbWidth = overflowY ? scrollbarWidth : 0
1268
+ const osbHeight = overflowX ? scrollbarHeight : 0
1274
1269
  const tableWidth = el.clientWidth
1275
1270
  const tableHeight = el.clientHeight
1276
1271
  if (trEl) {
@@ -1281,14 +1276,14 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
1281
1276
  const trRect = trEl.getBoundingClientRect()
1282
1277
  let trHeight = trEl.clientHeight
1283
1278
  const offsetTop = Math.max(1, trRect.y - wrapperRect.y)
1284
- if (offsetTop + trHeight > tableHeight - scrollbarHeight) {
1285
- trHeight = tableHeight - offsetTop - scrollbarHeight
1279
+ if (offsetTop + trHeight > tableHeight - osbHeight) {
1280
+ trHeight = tableHeight - offsetTop - osbHeight
1286
1281
  }
1287
1282
  rdLineEl.style.display = 'block'
1288
- rdLineEl.style.left = `${scrollbarYToLeft ? scrollbarWidth : 0}px`
1283
+ rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
1289
1284
  rdLineEl.style.top = `${offsetTop}px`
1290
1285
  rdLineEl.style.height = `${trHeight}px`
1291
- rdLineEl.style.width = `${tableWidth - scrollbarWidth}px`
1286
+ rdLineEl.style.width = `${tableWidth - osbWidth}px`
1292
1287
  rdLineEl.setAttribute('drag-pos', dragPos)
1293
1288
  rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
1294
1289
  } else {
@@ -1313,7 +1308,7 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
1313
1308
  thWidth -= startX - offsetLeft
1314
1309
  offsetLeft = startX
1315
1310
  }
1316
- const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : scrollbarWidth)
1311
+ const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth)
1317
1312
  if (offsetLeft + thWidth > endX) {
1318
1313
  thWidth = endX - offsetLeft
1319
1314
  }
@@ -1324,7 +1319,7 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
1324
1319
  if (prevDragToChild) {
1325
1320
  cdLineEl.style.height = `${thRect.height}px`
1326
1321
  } else {
1327
- cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : scrollbarHeight)}px`
1322
+ cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`
1328
1323
  }
1329
1324
  cdLineEl.setAttribute('drag-pos', dragPos)
1330
1325
  cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
@@ -1357,7 +1352,44 @@ function hideDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1357
1352
  }
1358
1353
  }
1359
1354
 
1360
- function handleScrollToRowColumn ($xeTable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null, row?: any) {
1355
+ /**
1356
+ * 处理显示 tooltip
1357
+ * @param {Event} evnt 事件
1358
+ * @param {Row} row 行对象
1359
+ */
1360
+ function handleTooltip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, tdEl: HTMLTableCellElement, overflowElem: HTMLElement, tipElem: HTMLElement | null, params: any) {
1361
+ const reactData = $xeTable as unknown as TableReactData
1362
+
1363
+ if (!overflowElem) {
1364
+ return $xeTable.$nextTick()
1365
+ }
1366
+ params.cell = tdEl
1367
+ const { tooltipStore } = reactData
1368
+ const tooltipOpts = $xeTable.computeTooltipOpts
1369
+ const { column, row } = params
1370
+ const { showAll, contentMethod } = tooltipOpts
1371
+ const customContent = contentMethod ? contentMethod(params) : null
1372
+ const useCustom = contentMethod && !XEUtils.eqNull(customContent)
1373
+ const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim()
1374
+ const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth
1375
+ if (content && (showAll || useCustom || isCellOverflow)) {
1376
+ Object.assign(tooltipStore, {
1377
+ row,
1378
+ column,
1379
+ visible: true,
1380
+ currOpts: {}
1381
+ })
1382
+ $xeTable.$nextTick(() => {
1383
+ const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
1384
+ if ($tooltip && $tooltip.open) {
1385
+ $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content))
1386
+ }
1387
+ })
1388
+ }
1389
+ return $xeTable.$nextTick()
1390
+ }
1391
+
1392
+ function handleScrollToRowColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null, row?: any) {
1361
1393
  const internalData = $xeTable as unknown as TableInternalData
1362
1394
 
1363
1395
  const { fullColumnIdData } = internalData
@@ -1652,13 +1684,12 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
1652
1684
  internalData.collectColumn = collectColumn
1653
1685
  const tableFullColumn = getColumnList(collectColumn)
1654
1686
  internalData.tableFullColumn = tableFullColumn
1655
- reactData.isLoading = true
1687
+ reactData.isColLoading = true
1656
1688
  reactData.isDragColMove = false
1657
1689
  initColumnSort($xeTable)
1658
1690
  return Promise.resolve(
1659
1691
  restoreCustomStorage($xeTable)
1660
1692
  ).then(() => {
1661
- reactData.isLoading = false
1662
1693
  cacheColumnMap($xeTable)
1663
1694
  parseColumns($xeTable, true).then(() => {
1664
1695
  if (reactData.scrollXLoad) {
@@ -1683,6 +1714,7 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
1683
1714
  if ($xeTable.handleUpdateCustomColumn) {
1684
1715
  $xeTable.handleUpdateCustomColumn()
1685
1716
  }
1717
+ reactData.isColLoading = false
1686
1718
  return $xeTable.recalculate()
1687
1719
  })
1688
1720
  })
@@ -1691,17 +1723,15 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
1691
1723
  /**
1692
1724
  * 纵向 Y 可视渲染处理
1693
1725
  */
1694
- function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1695
- const props = $xeTable
1726
+ function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, scrollTop?: number) {
1696
1727
  const reactData = $xeTable as unknown as TableReactData
1697
1728
  const internalData = $xeTable as unknown as TableInternalData
1698
1729
 
1699
- const { showOverflow } = props
1700
- const { mergeList } = reactData
1730
+ const { mergeList, isAllOverflow } = reactData
1701
1731
  const { scrollYStore } = internalData
1702
1732
  const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore
1703
- const autoOffsetYSize = showOverflow ? offsetSize : offsetSize + 1
1704
- const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable)
1733
+ const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1
1734
+ const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable, scrollTop)
1705
1735
  const offsetItem = {
1706
1736
  startIndex: Math.max(0, toVisibleIndex - 1 - offsetSize - preloadSize),
1707
1737
  endIndex: toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize
@@ -1719,6 +1749,46 @@ function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods
1719
1749
  }
1720
1750
  }
1721
1751
 
1752
+ function lazyScrollXData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1753
+ const internalData = $xeTable as unknown as TableInternalData
1754
+
1755
+ const { lxTimeout, lxRunTime, scrollXStore } = internalData
1756
+ const { visibleSize } = scrollXStore
1757
+ const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)))
1758
+ if (lxTimeout) {
1759
+ clearTimeout(lxTimeout)
1760
+ }
1761
+ if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
1762
+ internalData.lxRunTime = Date.now()
1763
+ loadScrollXData($xeTable)
1764
+ }
1765
+ internalData.lxTimeout = setTimeout(() => {
1766
+ internalData.lxTimeout = undefined
1767
+ internalData.lxRunTime = undefined
1768
+ loadScrollXData($xeTable)
1769
+ }, fpsTime)
1770
+ }
1771
+
1772
+ function lazyScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1773
+ const internalData = $xeTable as unknown as TableInternalData
1774
+
1775
+ const { lyTimeout, lyRunTime, scrollYStore } = internalData
1776
+ const { visibleSize } = scrollYStore
1777
+ const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)))
1778
+ if (lyTimeout) {
1779
+ clearTimeout(lyTimeout)
1780
+ }
1781
+ if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
1782
+ internalData.lyRunTime = Date.now()
1783
+ loadScrollYData($xeTable)
1784
+ }
1785
+ internalData.lyTimeout = setTimeout(() => {
1786
+ internalData.lyTimeout = undefined
1787
+ internalData.lyRunTime = undefined
1788
+ loadScrollYData($xeTable)
1789
+ }, fpsTime)
1790
+ }
1791
+
1722
1792
  function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isRollX: boolean, isRollY: boolean) {
1723
1793
  const reactData = $xeTable as unknown as TableReactData
1724
1794
  const internalData = $xeTable as unknown as TableInternalData
@@ -1731,6 +1801,7 @@ function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMet
1731
1801
  internalData.lcsTimeout = setTimeout(() => {
1732
1802
  internalData.lcsRunTime = Date.now()
1733
1803
  internalData.lcsTimeout = undefined
1804
+ internalData.intoRunScroll = false
1734
1805
  internalData.inVirtualScroll = false
1735
1806
  internalData.inWheelScroll = false
1736
1807
  internalData.inHeaderScroll = false
@@ -1751,6 +1822,45 @@ function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMet
1751
1822
  }, 200)
1752
1823
  }
1753
1824
 
1825
+ const getWheelSpeed = (lastScrollTime: number) => {
1826
+ let multiple = 1
1827
+ const currTime = Date.now()
1828
+ if (lastScrollTime + 25 > currTime) {
1829
+ multiple = 1.18
1830
+ } else if (lastScrollTime + 30 > currTime) {
1831
+ multiple = 1.15
1832
+ } else if (lastScrollTime + 40 > currTime) {
1833
+ multiple = 1.12
1834
+ } else if (lastScrollTime + 55 > currTime) {
1835
+ multiple = 1.09
1836
+ } else if (lastScrollTime + 75 > currTime) {
1837
+ multiple = 1.06
1838
+ } else if (lastScrollTime + 100 > currTime) {
1839
+ multiple = 1.03
1840
+ }
1841
+ return multiple
1842
+ }
1843
+
1844
+ const wheelScrollTo = (diffNum: number, cb: (progress: number) => void) => {
1845
+ const duration = Math.abs(diffNum)
1846
+ const startTime = performance.now()
1847
+ let countTop = 0
1848
+ const step = (timestamp: number) => {
1849
+ let progress = (timestamp - startTime) / duration
1850
+ if (progress > 1) {
1851
+ progress = 1
1852
+ }
1853
+ const easedProgress = Math.pow(progress, 2)
1854
+ const offsetTop = Math.floor((diffNum * easedProgress)) - countTop
1855
+ countTop += offsetTop
1856
+ cb(offsetTop)
1857
+ if (progress < 1) {
1858
+ requestAnimationFrame(step)
1859
+ }
1860
+ }
1861
+ requestAnimationFrame(step)
1862
+ }
1863
+
1754
1864
  function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1755
1865
  const internalData = $xeTable as unknown as TableInternalData
1756
1866
 
@@ -1760,57 +1870,63 @@ function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1760
1870
  }
1761
1871
 
1762
1872
  function calcColumnAutoWidth (column: VxeTableDefines.ColumnInfo, wrapperEl: HTMLDivElement) {
1763
- 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`)
1764
- const firstCellEl = cellElList[0]
1765
- let paddingSize = 0
1766
- if (firstCellEl) {
1767
- const cellStyle = getComputedStyle(firstCellEl)
1768
- paddingSize = Math.floor(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight)) + 2
1873
+ const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[colid="${column.id}"]`)
1874
+ let leftRightPadding = 0
1875
+ const firstCellEl = cellElemList[0]
1876
+ if (firstCellEl && firstCellEl.parentElement) {
1877
+ const cellStyle = getComputedStyle(firstCellEl.parentElement)
1878
+ leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight))
1769
1879
  }
1770
- let colWidth = column.renderAutoWidth - paddingSize
1771
- XEUtils.arrayEach(cellElList, (itemEl) => {
1772
- const cellEl = itemEl as HTMLElement
1773
- const thElem = cellEl.parentElement as HTMLElement
1774
- let titleWidth = 0
1775
- if (`${thElem.tagName}`.toLowerCase() === 'th') {
1776
- XEUtils.arrayEach(cellEl.children, (btnEl) => {
1777
- titleWidth += (btnEl as HTMLElement).offsetWidth + 1
1778
- })
1779
- } else {
1780
- const labelEl = cellEl.firstElementChild as HTMLElement
1781
- if (labelEl) {
1782
- titleWidth = labelEl.offsetWidth
1783
- }
1784
- }
1785
- if (titleWidth) {
1786
- colWidth = Math.max(colWidth, Math.ceil(titleWidth) + 4)
1787
- }
1788
- })
1789
- return colWidth + paddingSize
1880
+ let colWidth = column.renderAutoWidth - leftRightPadding
1881
+ for (let i = 0; i < cellElemList.length; i++) {
1882
+ const celEl = cellElemList[i] as HTMLDivElement
1883
+ colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0)
1884
+ }
1885
+ return colWidth + leftRightPadding
1790
1886
  }
1791
1887
 
1792
1888
  function calcCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1793
- const reactData = $xeTable as unknown as TableReactData
1794
1889
  const internalData = $xeTable as unknown as TableInternalData
1795
1890
 
1796
1891
  const autoWidthColumnList = $xeTable.computeAutoWidthColumnList
1797
- reactData.isCalcColumn = true
1798
- return $xeTable.$nextTick().then(() => {
1799
- const { fullColumnIdData } = internalData
1800
- const el = $xeTable.$refs.refElem as HTMLDivElement
1801
- if (el) {
1802
- autoWidthColumnList.forEach(column => {
1803
- const colid = column.id
1804
- const colRest = fullColumnIdData[colid]
1805
- const colWidth = calcColumnAutoWidth(column, el)
1806
- if (colRest) {
1807
- colRest.width = Math.max(colWidth, colRest.width)
1808
- }
1809
- column.renderAutoWidth = colWidth
1810
- })
1811
- $xeTable.analyColumnWidth()
1812
- }
1813
- reactData.isCalcColumn = false
1892
+ const { fullColumnIdData } = internalData
1893
+ const el = $xeTable.$refs.refElem as HTMLDivElement
1894
+ if (el) {
1895
+ el.setAttribute('data-calc-col', 'Y')
1896
+ autoWidthColumnList.forEach(column => {
1897
+ const colid = column.id
1898
+ const colRest = fullColumnIdData[colid]
1899
+ const colWidth = calcColumnAutoWidth(column, el)
1900
+ if (colRest) {
1901
+ colRest.width = Math.max(colWidth, colRest.width)
1902
+ }
1903
+ column.renderAutoWidth = colWidth
1904
+ })
1905
+ $xeTable.analyColumnWidth()
1906
+ el.removeAttribute('data-calc-col')
1907
+ }
1908
+ }
1909
+
1910
+ const handleUpdateColResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
1911
+ $xeTable.analyColumnWidth()
1912
+ $xeTable.recalculate(true).then(() => {
1913
+ $xeTable.saveCustomStore('update:width')
1914
+ $xeTable.updateCellAreas()
1915
+ $xeTable.dispatchEvent('column-resizable-change', params, evnt)
1916
+ // 已废弃 resizable-change
1917
+ $xeTable.dispatchEvent('resizable-change', params, evnt)
1918
+ setTimeout(() => $xeTable.recalculate(true), 300)
1919
+ })
1920
+ }
1921
+
1922
+ const handleUpdateRowResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
1923
+ const reactData = $xeTable as unknown as TableReactData
1924
+
1925
+ reactData.resizeHeightFlag++
1926
+ $xeTable.recalculate(true).then(() => {
1927
+ $xeTable.updateCellAreas()
1928
+ $xeTable.dispatchEvent('row-resizable-change', params, evnt)
1929
+ setTimeout(() => $xeTable.recalculate(true), 300)
1814
1930
  })
1815
1931
  }
1816
1932
 
@@ -1867,7 +1983,7 @@ const Methods = {
1867
1983
  warnLog('vxe.error.delFunc', ['syncData', 'getData'])
1868
1984
  return this.$nextTick().then(() => {
1869
1985
  this.tableData = []
1870
- return this.$nextTick().then(() => this.loadTableData(this.tableFullData))
1986
+ return this.$nextTick().then(() => this.loadTableData(this.tableFullData, true))
1871
1987
  })
1872
1988
  },
1873
1989
  /**
@@ -1922,12 +2038,13 @@ const Methods = {
1922
2038
  * 加载表格数据
1923
2039
  * @param {Array} datas 数据
1924
2040
  */
1925
- loadTableData (datas: any) {
1926
- const $xeTable = this
2041
+ loadTableData (datas: any[], isReset: boolean) {
2042
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
2043
+ const reactData = $xeTable as unknown as TableReactData
2044
+ const internalData = $xeTable as unknown as TableInternalData
1927
2045
 
1928
- const { keepSource, showOverflow, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this
2046
+ const { keepSource, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this
1929
2047
  const childrenField = treeOpts.children || treeOpts.childrenField
1930
- const rowOpts = $xeTable.computeRowOpts
1931
2048
  let treeData = []
1932
2049
  let fullData = datas ? datas.slice(0) : []
1933
2050
  if (treeConfig) {
@@ -1970,43 +2087,30 @@ const Methods = {
1970
2087
  scrollYStore.endIndex = 1
1971
2088
  scrollXStore.startIndex = 0
1972
2089
  scrollXStore.endIndex = 1
2090
+ reactData.isRowLoading = true
2091
+ reactData.scrollVMLoading = false
1973
2092
  editStore.insertMaps = {}
1974
- editStore.removeList = []
1975
2093
  editStore.removeMaps = {}
1976
2094
  const sYLoad = updateScrollYStatus($xeTable, fullData)
1977
- this.isDragRowMove = false
2095
+ reactData.isDragColMove = false
2096
+ reactData.isDragRowMove = false
1978
2097
  // 全量数据
1979
- this.tableFullData = fullData
1980
- this.tableFullTreeData = treeData
2098
+ internalData.tableFullData = fullData
2099
+ internalData.tableFullTreeData = treeData
1981
2100
  // 缓存数据
1982
- this.cacheRowMap(true)
2101
+ $xeTable.cacheRowMap(true, isReset)
1983
2102
  // 原始数据
1984
- this.tableSynchData = datas
2103
+ internalData.tableSynchData = datas
2104
+ if (isReset) {
2105
+ internalData.isResizeCellHeight = false
2106
+ reactData.rowExpandedMaps = {}
2107
+ reactData.rowExpandLazyLoadedMaps = {}
2108
+ reactData.treeExpandedMaps = {}
2109
+ reactData.treeExpandLazyLoadedMaps = {}
2110
+ }
1985
2111
  // 克隆原数据,用于显示编辑状态,与编辑值做对比
1986
2112
  if (keepSource) {
1987
- this.cacheSourceMap(fullData)
1988
- }
1989
- if (sYLoad) {
1990
- if (showOverflow) {
1991
- if (!rowOpts.height) {
1992
- const errColumn = this.tableFullColumn.find((column: any) => column.showOverflow === false)
1993
- if (errColumn) {
1994
- errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
1995
- }
1996
- }
1997
- }
1998
-
1999
- if (process.env.VUE_APP_VXE_ENV === 'development') {
2000
- if (!(this.height || this.maxHeight)) {
2001
- errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}'])
2002
- }
2003
- // if (!this.showOverflow) {
2004
- // warnLog('vxe.error.reqProp', ['table.show-overflow'])
2005
- // }
2006
- if (this.spanMethod) {
2007
- warnLog('vxe.error.scrollErrProp', ['table.span-method'])
2008
- }
2009
- }
2113
+ $xeTable.cacheSourceMap(fullData)
2010
2114
  }
2011
2115
  if (this.clearCellAreas && this.mouseConfig) {
2012
2116
  this.clearCellAreas()
@@ -2026,6 +2130,30 @@ const Methods = {
2026
2130
  if (sYLoad) {
2027
2131
  scrollYStore.endIndex = scrollYStore.visibleSize
2028
2132
  }
2133
+
2134
+ if (sYLoad) {
2135
+ // if (showOverflow) {
2136
+ // if (!rowOpts.height) {
2137
+ // const errColumn = this.tableFullColumn.find((column: any) => column.showOverflow === false)
2138
+ // if (errColumn) {
2139
+ // errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
2140
+ // }
2141
+ // }
2142
+ // }
2143
+
2144
+ if (process.env.VUE_APP_VXE_ENV === 'development') {
2145
+ if (!(this.height || this.maxHeight)) {
2146
+ errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}'])
2147
+ }
2148
+ // if (!this.showOverflow) {
2149
+ // warnLog('vxe.error.reqProp', ['table.show-overflow'])
2150
+ // }
2151
+ if (this.spanMethod) {
2152
+ warnLog('vxe.error.scrollErrProp', ['table.span-method'])
2153
+ }
2154
+ }
2155
+ }
2156
+
2029
2157
  this.handleReserveStatus()
2030
2158
  this.checkSelectionStatus()
2031
2159
  return new Promise<void>(resolve => {
@@ -2041,6 +2169,7 @@ const Methods = {
2041
2169
  if (sYOpts.scrollToTopOnChange) {
2042
2170
  targetScrollTop = 0
2043
2171
  }
2172
+ reactData.isRowLoading = false
2044
2173
  calcCellHeight($xeTable)
2045
2174
  // 是否变更虚拟滚动
2046
2175
  if (oldScrollYLoad === sYLoad) {
@@ -2066,7 +2195,7 @@ const Methods = {
2066
2195
  */
2067
2196
  loadData (datas: any) {
2068
2197
  const { initStatus } = this
2069
- return this.loadTableData(datas).then(() => {
2198
+ return this.loadTableData(datas, false).then(() => {
2070
2199
  this.inited = true
2071
2200
  this.initStatus = true
2072
2201
  if (!initStatus) {
@@ -2084,7 +2213,7 @@ const Methods = {
2084
2213
  .then(() => {
2085
2214
  this.inited = true
2086
2215
  this.initStatus = true
2087
- return this.loadTableData(datas)
2216
+ return this.loadTableData(datas, true)
2088
2217
  })
2089
2218
  .then(() => {
2090
2219
  this.handleLoadDefaults()
@@ -2162,9 +2291,8 @@ const Methods = {
2162
2291
  },
2163
2292
  /**
2164
2293
  * 更新数据行的 Map
2165
- * 牺牲数据组装的耗时,用来换取使用过程中的流畅
2166
2294
  */
2167
- cacheRowMap (isSource?: boolean) {
2295
+ cacheRowMap (isReset: boolean, isSource?: boolean) {
2168
2296
  const { treeConfig, treeOpts, tableFullData, fullAllDataRowIdData, tableFullTreeData } = this
2169
2297
  const childrenField = treeOpts.children || treeOpts.childrenField
2170
2298
  const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
@@ -2184,8 +2312,8 @@ const Methods = {
2184
2312
  row[childrenField] = null
2185
2313
  }
2186
2314
  let cacheItem = fullAllDataRowIdData[rowid]
2187
- if (!cacheItem) {
2188
- cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, oTop: 0 }
2315
+ if (isReset || !cacheItem) {
2316
+ cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0 }
2189
2317
  }
2190
2318
  cacheItem.row = row
2191
2319
  cacheItem.items = items
@@ -2258,7 +2386,7 @@ const Methods = {
2258
2386
  XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
2259
2387
  const rowid = getRowid($xeTable, childRow)
2260
2388
  const parentRow = parentItem || parentRest.row
2261
- 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 }
2389
+ 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 }
2262
2390
  fullDataRowIdData[rowid] = rest
2263
2391
  fullAllDataRowIdData[rowid] = rest
2264
2392
  }, { children: childrenField })
@@ -2609,18 +2737,37 @@ const Methods = {
2609
2737
  return this.$nextTick()
2610
2738
  },
2611
2739
  getCellElement (row: any, fieldOrColumn: any) {
2612
- const column = handleFieldOrColumn(this, fieldOrColumn)
2740
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
2741
+ const internalData = $xeTable as unknown as TableInternalData
2742
+
2743
+ const { elemStore } = internalData
2744
+ const column = handleFieldOrColumn($xeTable, fieldOrColumn)
2613
2745
  if (!column) {
2614
2746
  return null
2615
2747
  }
2616
- const { $refs } = this
2617
- const rowid = getRowid(this, row)
2618
- let bodyElem = null
2748
+ const rowid = getRowid($xeTable, row)
2749
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
2750
+ const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
2751
+ const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
2752
+ let bodyElem
2619
2753
  if (column) {
2620
- bodyElem = $refs[`${column.fixed || 'table'}Body`] || $refs.refTableBody
2621
- }
2622
- if (bodyElem && bodyElem.$el) {
2623
- return bodyElem.$el.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`)
2754
+ if (column.fixed) {
2755
+ if (column.fixed === 'left') {
2756
+ if (leftScrollElem) {
2757
+ bodyElem = leftScrollElem
2758
+ }
2759
+ } else {
2760
+ if (rightScrollElem) {
2761
+ bodyElem = rightScrollElem
2762
+ }
2763
+ }
2764
+ }
2765
+ if (!bodyElem) {
2766
+ bodyElem = bodyScrollElem
2767
+ }
2768
+ if (bodyElem) {
2769
+ return bodyElem.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`)
2770
+ }
2624
2771
  }
2625
2772
  return null
2626
2773
  },
@@ -3014,7 +3161,10 @@ const Methods = {
3014
3161
  * @param {String/Number} rowid 行主键
3015
3162
  */
3016
3163
  getRowById (cellValue: any) {
3017
- const fullDataRowIdData = this.fullDataRowIdData
3164
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3165
+ const internalData = $xeTable as unknown as TableInternalData
3166
+
3167
+ const { fullDataRowIdData } = internalData
3018
3168
  const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue)
3019
3169
  return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
3020
3170
  },
@@ -3022,13 +3172,10 @@ const Methods = {
3022
3172
  * 根据行获取行的唯一主键
3023
3173
  * @param {Row} row 行对象
3024
3174
  */
3025
- getRowid (cellValue: any) {
3175
+ getRowid (row: any) {
3026
3176
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3027
- const internalData = $xeTable as unknown as TableInternalData
3028
3177
 
3029
- const { fullDataRowIdData } = internalData
3030
- const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue || '')
3031
- return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
3178
+ return getRowid($xeTable, row)
3032
3179
  },
3033
3180
  /**
3034
3181
  * 获取处理后的表格数据
@@ -3219,34 +3366,40 @@ const Methods = {
3219
3366
  }
3220
3367
  return $xeTable.$nextTick()
3221
3368
  },
3222
- setColumnWidth (fieldOrColumn: any, width: any) {
3223
- const $xeTable = this
3369
+ setColumnWidth (fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | VxeColumnPropTypes.Field[] | VxeTableDefines.ColumnInfo[], width: number | string) {
3370
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3371
+ const internalData = $xeTable as unknown as TableInternalData
3224
3372
 
3373
+ const { elemStore } = internalData
3225
3374
  let status = false
3226
3375
  const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn]
3227
- cols.forEach(item => {
3228
- const column = handleFieldOrColumn($xeTable, item)
3229
- if (column) {
3230
- const colWidth = XEUtils.toInteger(width)
3231
- let rdWidth = colWidth
3232
- if (isScale(width)) {
3233
- const refTableBody = $xeTable.$refs.refTableBody
3234
- const bodyElem = refTableBody ? refTableBody.$el as HTMLDivElement : null
3235
- const bodyWidth = bodyElem ? bodyElem.clientWidth - 1 : 0
3236
- rdWidth = Math.floor(colWidth * bodyWidth)
3237
- }
3238
- column.resizeWidth = rdWidth
3239
- if (!status) {
3240
- status = true
3376
+ let cWidth = XEUtils.toInteger(width)
3377
+ if (isScale(width)) {
3378
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
3379
+ const bodyWidth = bodyScrollElem ? bodyScrollElem.clientWidth - 1 : 0
3380
+ cWidth = Math.floor(cWidth * bodyWidth)
3381
+ }
3382
+ if (cWidth) {
3383
+ cols.forEach(item => {
3384
+ const column = handleFieldOrColumn($xeTable, item)
3385
+ if (column) {
3386
+ column.resizeWidth = cWidth
3387
+ if (!status) {
3388
+ status = true
3389
+ }
3241
3390
  }
3391
+ })
3392
+ if (status) {
3393
+ return $xeTable.refreshColumn().then(() => {
3394
+ return { status }
3395
+ })
3242
3396
  }
3243
- })
3244
- if (status) {
3245
- return $xeTable.refreshColumn()
3246
3397
  }
3247
- return $xeTable.$nextTick()
3398
+ return $xeTable.$nextTick().then(() => {
3399
+ return { status }
3400
+ })
3248
3401
  },
3249
- getColumnWidth (fieldOrColumn: any) {
3402
+ getColumnWidth (fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
3250
3403
  const column = handleFieldOrColumn(this, fieldOrColumn)
3251
3404
  if (column) {
3252
3405
  return column.renderWidth
@@ -3258,7 +3411,12 @@ const Methods = {
3258
3411
  * 如果为 true 则重置所有状态
3259
3412
  * 如果已关联工具栏,则会同步更新
3260
3413
  */
3261
- resetColumn (options: any) {
3414
+ resetColumn (options?: boolean | {
3415
+ visible?: boolean
3416
+ resizable?: boolean
3417
+ fixed?: boolean
3418
+ order?: boolean
3419
+ }) {
3262
3420
  warnLog('vxe.error.delFunc', ['resetColumn', 'resetCustom'])
3263
3421
  return this.resetCustom(options)
3264
3422
  },
@@ -3531,7 +3689,153 @@ const Methods = {
3531
3689
  })
3532
3690
  Object.assign(this.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList })
3533
3691
  },
3534
- handleResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams) {
3692
+ handleColResizeMousedownEvent (evnt: MouseEvent, fixedType: 'left' | 'right' | '', params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
3693
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3694
+ const reactData = $xeTable as unknown as TableReactData
3695
+ const internalData = $xeTable as unknown as TableInternalData
3696
+
3697
+ evnt.stopPropagation()
3698
+ evnt.preventDefault()
3699
+ const { column } = params
3700
+ const { overflowX, scrollbarHeight } = reactData
3701
+ const { elemStore, visibleColumn } = internalData
3702
+ const resizableOpts = $xeTable.computeResizableOpts
3703
+ const osbHeight = overflowX ? scrollbarHeight : 0
3704
+ const tableEl = $xeTable.$refs.refElem as HTMLDivElement
3705
+ const leftContainerElem = $xeTable.$refs.refLeftContainer as HTMLDivElement
3706
+ const rightContainerElem = $xeTable.$refs.refRightContainer as HTMLDivElement
3707
+ const resizeBarElem = $xeTable.$refs.refColResizeBar as HTMLDivElement
3708
+ if (!resizeBarElem) {
3709
+ return
3710
+ }
3711
+ const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
3712
+ const scrollbarXToTop = $xeTable.computeScrollbarXToTop
3713
+ const { clientX: dragClientX } = evnt
3714
+ const wrapperElem = $xeTable.$refs.refElem as HTMLDivElement
3715
+ const dragBtnElem = evnt.target as HTMLDivElement
3716
+ let resizeColumn = column
3717
+ if (column.children && column.children.length) {
3718
+ XEUtils.eachTree(column.children, childColumn => {
3719
+ resizeColumn = childColumn
3720
+ })
3721
+ }
3722
+ const cell = dragBtnElem.parentNode as HTMLTableCellElement
3723
+ const cellParams = Object.assign(params, { cell })
3724
+ let dragLeft = 0
3725
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
3726
+ if (!bodyScrollElem) {
3727
+ return
3728
+ }
3729
+ const pos = getOffsetPos(dragBtnElem, wrapperElem)
3730
+ const dragBtnWidth = dragBtnElem.clientWidth
3731
+ const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2)
3732
+ const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth // 列之间的最小间距
3733
+ let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval
3734
+ let dragPosLeft = pos.left + dragBtnOffsetWidth
3735
+ const isLeftFixed = fixedType === 'left'
3736
+ const isRightFixed = fixedType === 'right'
3737
+
3738
+ // 计算左右侧固定列偏移量
3739
+ let fixedOffsetWidth = 0
3740
+ if (isLeftFixed || isRightFixed) {
3741
+ const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling'
3742
+ let tempCellElem = cell[siblingProp] as HTMLTableCellElement
3743
+ while (tempCellElem) {
3744
+ if (hasClass(tempCellElem, 'fixed--hidden')) {
3745
+ break
3746
+ } else if (!hasClass(tempCellElem, 'col--group')) {
3747
+ fixedOffsetWidth += tempCellElem.offsetWidth
3748
+ }
3749
+ tempCellElem = tempCellElem[siblingProp] as HTMLTableCellElement
3750
+ }
3751
+ if (isRightFixed && rightContainerElem) {
3752
+ dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth
3753
+ }
3754
+ }
3755
+
3756
+ // 处理拖动事件
3757
+ const updateEvent = (evnt: MouseEvent) => {
3758
+ evnt.stopPropagation()
3759
+ evnt.preventDefault()
3760
+ const tableHeight = tableEl.clientHeight
3761
+ const offsetX = evnt.clientX - dragClientX
3762
+ let left = dragPosLeft + offsetX
3763
+ const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft
3764
+ if (isLeftFixed) {
3765
+ // 左固定列(不允许超过右侧固定列、不允许超过右边距)
3766
+ left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval)
3767
+ } else if (isRightFixed) {
3768
+ // 右侧固定列(不允许超过左侧固定列、不允许超过左边距)
3769
+ dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval
3770
+ left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval)
3771
+ } else {
3772
+ dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft)
3773
+ // left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
3774
+ }
3775
+ dragLeft = Math.max(left, dragMinLeft)
3776
+ const resizeBarLeft = Math.max(1, dragLeft - scrollLeft)
3777
+ resizeBarElem.style.left = `${resizeBarLeft}px`
3778
+ resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`
3779
+ resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - osbHeight : tableHeight}px`
3780
+ if (resizableOpts.showDragTip && resizeTipElem) {
3781
+ resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)])
3782
+ const tableWidth = tableEl.clientWidth
3783
+ const wrapperRect = wrapperElem.getBoundingClientRect()
3784
+ const resizeBarWidth = resizeBarElem.clientWidth
3785
+ const resizeTipWidth = resizeTipElem.clientWidth
3786
+ const resizeTipHeight = resizeTipElem.clientHeight
3787
+ let resizeTipLeft = -resizeTipWidth
3788
+ if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
3789
+ resizeTipLeft = 0
3790
+ } else if (resizeBarLeft > tableWidth) {
3791
+ resizeTipLeft += tableWidth - resizeBarLeft
3792
+ }
3793
+ resizeTipElem.style.left = `${resizeTipLeft}px`
3794
+ resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`
3795
+ }
3796
+ reactData.isDragResize = true
3797
+ }
3798
+
3799
+ reactData.isDragResize = true
3800
+ addClass(tableEl, 'col-drag--resize')
3801
+ resizeBarElem.style.display = 'block'
3802
+ document.onmousemove = updateEvent
3803
+ document.onmouseup = function (evnt) {
3804
+ document.onmousemove = null
3805
+ document.onmouseup = null
3806
+ resizeBarElem.style.display = 'none'
3807
+ internalData._lastResizeTime = Date.now()
3808
+
3809
+ setTimeout(() => {
3810
+ reactData.isDragResize = false
3811
+ }, 50)
3812
+
3813
+ const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)
3814
+ const resizeParams = { ...params, resizeWidth, resizeColumn }
3815
+ if (resizableOpts.dragMode === 'fixed') {
3816
+ visibleColumn.forEach(item => {
3817
+ if (item.id !== resizeColumn.id) {
3818
+ if (!item.resizeWidth) {
3819
+ item.resizeWidth = item.renderWidth
3820
+ }
3821
+ }
3822
+ })
3823
+ }
3824
+
3825
+ if ($xeTable.handleColResizeCellAreaEvent) {
3826
+ $xeTable.handleColResizeCellAreaEvent(evnt, resizeParams)
3827
+ } else {
3828
+ resizeColumn.resizeWidth = resizeWidth
3829
+ handleUpdateColResize($xeTable, evnt, resizeParams)
3830
+ }
3831
+ removeClass(tableEl, 'col-drag--resize')
3832
+ }
3833
+ updateEvent(evnt)
3834
+ if ($xeTable.closeMenu) {
3835
+ $xeTable.closeMenu()
3836
+ }
3837
+ },
3838
+ handleColResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams) {
3535
3839
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3536
3840
  const reactData = $xeTable as unknown as TableReactData
3537
3841
  const internalData = $xeTable as unknown as TableInternalData
@@ -3540,6 +3844,8 @@ const Methods = {
3540
3844
  const { isDblclickAutoWidth } = resizableOpts
3541
3845
  const el = $xeTable.$refs.refElem as HTMLDivElement
3542
3846
  if (isDblclickAutoWidth && el) {
3847
+ evnt.stopPropagation()
3848
+ evnt.preventDefault()
3543
3849
  const { fullColumnIdData } = internalData
3544
3850
  const { column } = params
3545
3851
  let resizeColumn = column
@@ -3554,21 +3860,272 @@ const Methods = {
3554
3860
  const cell = dragBtnElem.parentNode as HTMLTableCellElement
3555
3861
  const cellParams = Object.assign(params, { cell })
3556
3862
  const colMinWidth = getColReMinWidth(cellParams)
3863
+
3864
+ el.setAttribute('data-calc-col', 'Y')
3557
3865
  let resizeWidth = calcColumnAutoWidth(resizeColumn, el)
3866
+ el.removeAttribute('data-calc-col')
3558
3867
  if (colRest) {
3559
3868
  resizeWidth = Math.max(resizeWidth, colRest.width)
3560
3869
  }
3561
- resizeColumn.resizeWidth = Math.max(colMinWidth, resizeWidth)
3562
- reactData._isResize = false
3870
+ resizeWidth = Math.max(colMinWidth, resizeWidth)
3871
+ const resizeParams = { ...params, resizeWidth, resizeColumn }
3872
+ reactData.isDragResize = false
3563
3873
  internalData._lastResizeTime = Date.now()
3564
- $xeTable.analyColumnWidth()
3565
- $xeTable.recalculate(true).then(() => {
3566
- $xeTable.saveCustomStore('update:visible')
3567
- $xeTable.updateCellAreas()
3568
- $xeTable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt)
3569
- setTimeout(() => $xeTable.recalculate(true), 300)
3874
+
3875
+ if ($xeTable.handleColResizeDblclickCellAreaEvent) {
3876
+ $xeTable.handleColResizeDblclickCellAreaEvent(evnt, resizeParams)
3877
+ } else {
3878
+ resizeColumn.resizeWidth = resizeWidth
3879
+ handleUpdateColResize($xeTable, evnt, resizeParams)
3880
+ }
3881
+ }
3882
+ },
3883
+ handleRowResizeMousedownEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
3884
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3885
+ const reactData = $xeTable as unknown as TableReactData
3886
+ const internalData = $xeTable as unknown as TableInternalData
3887
+
3888
+ evnt.stopPropagation()
3889
+ evnt.preventDefault()
3890
+ const { row } = params
3891
+ const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
3892
+ const { elemStore, fullAllDataRowIdData } = internalData
3893
+ const osbWidth = overflowY ? scrollbarWidth : 0
3894
+ const osbHeight = overflowX ? scrollbarHeight : 0
3895
+ const scrollbarYToLeft = $xeTable.computeScrollbarYToLeft
3896
+ const resizableOpts = $xeTable.computeResizableOpts
3897
+ const rowOpts = $xeTable.computeRowOpts
3898
+ const cellOpts = $xeTable.computeCellOpts
3899
+ const tableEl = $xeTable.$refs.refElem as HTMLDivElement
3900
+ const resizeBarElem = $xeTable.$refs.refRowResizeBar as HTMLDivElement
3901
+ if (!resizeBarElem) {
3902
+ return
3903
+ }
3904
+ const { clientY: dragClientY } = evnt
3905
+ const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
3906
+ const dragBtnElem = evnt.currentTarget as HTMLDivElement
3907
+ const tdEl = dragBtnElem.parentNode as HTMLTableCellElement
3908
+ const trEl = tdEl.parentNode as HTMLTableCellElement
3909
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
3910
+ if (!bodyScrollElem) {
3911
+ return
3912
+ }
3913
+ const rowid = getRowid($xeTable, row)
3914
+ const rowRest = fullAllDataRowIdData[rowid]
3915
+ if (!rowRest) {
3916
+ return
3917
+ }
3918
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
3919
+ const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight
3920
+ const tableRect = tableEl.getBoundingClientRect()
3921
+ const trRect = trEl.getBoundingClientRect()
3922
+ const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight
3923
+ let resizeHeight = currCellHeight
3924
+ const cellEl = tdEl.querySelector('.vxe-cell')
3925
+ let cellMinHeight = 0
3926
+ if (cellEl) {
3927
+ const cellStyle = getComputedStyle(cellEl)
3928
+ cellMinHeight = Math.max(1, Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom)))
3929
+ }
3930
+ const minTop = trRect.y - tableRect.y + cellMinHeight
3931
+ // 处理拖动事件
3932
+ const updateEvent = (evnt: MouseEvent) => {
3933
+ evnt.stopPropagation()
3934
+ evnt.preventDefault()
3935
+ const tableWidth = tableEl.clientWidth - osbWidth
3936
+ const tableHeight = tableEl.clientHeight - osbHeight
3937
+ let dragTop = evnt.clientY - tableRect.y - targetOffsetY
3938
+ if (dragTop < minTop) {
3939
+ dragTop = minTop
3940
+ } else {
3941
+ resizeHeight = Math.max(cellMinHeight, currCellHeight + evnt.clientY - dragClientY)
3942
+ }
3943
+ resizeBarElem.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
3944
+ resizeBarElem.style.top = `${dragTop}px`
3945
+ resizeBarElem.style.width = `${tableWidth}px`
3946
+ if (resizableOpts.showDragTip && resizeTipElem) {
3947
+ resizeTipElem.textContent = getI18n('vxe.table.resizeRowTip', [resizeHeight])
3948
+ const resizeTipWidth = resizeTipElem.clientWidth
3949
+ const resizeTipHeight = resizeTipElem.clientHeight
3950
+ let resizeBarLeft = Math.max(2, evnt.clientX - tableRect.x)
3951
+ let resizeBarTop = 0
3952
+ if (resizeBarLeft + resizeTipWidth >= tableWidth - 2) {
3953
+ resizeBarLeft = tableWidth - resizeTipWidth - 2
3954
+ }
3955
+ if (dragTop + resizeTipHeight >= tableHeight) {
3956
+ resizeBarTop = tableHeight - (dragTop + resizeTipHeight)
3957
+ }
3958
+ resizeTipElem.style.left = `${resizeBarLeft}px`
3959
+ resizeTipElem.style.top = `${resizeBarTop}px`
3960
+ }
3961
+ reactData.isDragResize = true
3962
+ }
3963
+
3964
+ reactData.isDragResize = true
3965
+ addClass(tableEl, 'row-drag--resize')
3966
+ resizeBarElem.style.display = 'block'
3967
+ document.onmousemove = updateEvent
3968
+ document.onmouseup = function (evnt) {
3969
+ document.onmousemove = null
3970
+ document.onmouseup = null
3971
+ resizeBarElem.style.display = 'none'
3972
+ internalData._lastResizeTime = Date.now()
3973
+
3974
+ setTimeout(() => {
3975
+ reactData.isDragResize = false
3976
+ }, 50)
3977
+
3978
+ if (resizeHeight !== currCellHeight) {
3979
+ const resizeParams = { ...params, resizeHeight, resizeRow: row }
3980
+ internalData.isResizeCellHeight = true
3981
+ if ($xeTable.handleRowResizeCellAreaEvent) {
3982
+ $xeTable.handleRowResizeCellAreaEvent(evnt, resizeParams)
3983
+ } else {
3984
+ rowRest.resizeHeight = resizeHeight
3985
+ handleUpdateRowResize($xeTable, evnt, resizeParams)
3986
+ }
3987
+ }
3988
+ removeClass(tableEl, 'row-drag--resize')
3989
+ }
3990
+ updateEvent(evnt)
3991
+ },
3992
+ handleRowResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
3993
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
3994
+ const reactData = $xeTable as unknown as TableReactData
3995
+ const internalData = $xeTable as unknown as TableInternalData
3996
+
3997
+ const resizableOpts = $xeTable.computeResizableOpts
3998
+ const { isDblclickAutoHeight } = resizableOpts
3999
+ const el = $xeTable.$refs.refElem as HTMLDivElement
4000
+ if (isDblclickAutoHeight && el) {
4001
+ evnt.stopPropagation()
4002
+ evnt.preventDefault()
4003
+ const { editStore } = reactData
4004
+ const { fullAllDataRowIdData } = internalData
4005
+ const { actived } = editStore
4006
+ const { row } = params
4007
+ const rowid = getRowid($xeTable, row)
4008
+ const rowRest = fullAllDataRowIdData[rowid]
4009
+ if (!rowRest) {
4010
+ return
4011
+ }
4012
+ const handleRsHeight = () => {
4013
+ const resizeHeight = calcCellAutoHeight(rowRest, el)
4014
+ const resizeParams = { ...params, resizeHeight, resizeRow: row }
4015
+ reactData.isDragResize = false
4016
+ internalData._lastResizeTime = Date.now()
4017
+ if ($xeTable.handleRowResizeDblclickCellAreaEvent) {
4018
+ $xeTable.handleRowResizeDblclickCellAreaEvent(evnt, resizeParams)
4019
+ } else {
4020
+ rowRest.resizeHeight = resizeHeight
4021
+ handleUpdateRowResize($xeTable, evnt, resizeParams)
4022
+ }
4023
+ }
4024
+ if (actived.row || actived.column) {
4025
+ $xeTable.clearEdit().then(handleRsHeight)
4026
+ } else {
4027
+ handleRsHeight()
4028
+ }
4029
+ }
4030
+ },
4031
+ setRowHeightConf (heightConf: Record<string, number>) {
4032
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4033
+ const reactData = $xeTable as unknown as TableReactData
4034
+ const internalData = $xeTable as unknown as TableInternalData
4035
+
4036
+ const { fullAllDataRowIdData } = internalData
4037
+ let status = false
4038
+ if (heightConf) {
4039
+ XEUtils.each(heightConf, (height, rowid) => {
4040
+ const rowRest = fullAllDataRowIdData[rowid]
4041
+ if (rowRest) {
4042
+ const rHeight = XEUtils.toInteger(height)
4043
+ if (rHeight) {
4044
+ rowRest.resizeHeight = rHeight
4045
+ if (!status) {
4046
+ status = true
4047
+ }
4048
+ }
4049
+ }
4050
+ })
4051
+ if (status) {
4052
+ internalData.isResizeCellHeight = true
4053
+ reactData.resizeHeightFlag++
4054
+ }
4055
+ }
4056
+ return $xeTable.$nextTick().then(() => {
4057
+ return { status }
4058
+ })
4059
+ },
4060
+ getRowHeightConf (isFull?: boolean) {
4061
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4062
+ const internalData = $xeTable as unknown as TableInternalData
4063
+
4064
+ const { fullAllDataRowIdData, afterFullData } = internalData
4065
+ const rowOpts = $xeTable.computeRowOpts
4066
+ const cellOpts = $xeTable.computeCellOpts
4067
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
4068
+ const rest: Record<string, number> = {}
4069
+ afterFullData.forEach(row => {
4070
+ const rowid = getRowid($xeTable, row)
4071
+ const rowRest = fullAllDataRowIdData[rowid]
4072
+ if (rowRest) {
4073
+ const resizeHeight = rowRest.resizeHeight
4074
+ if (resizeHeight || isFull) {
4075
+ const currCellHeight = resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
4076
+ rest[rowid] = currCellHeight
4077
+ }
4078
+ }
4079
+ })
4080
+ return rest
4081
+ },
4082
+ setRowHeight (rowOrId: any | any[], height: number) {
4083
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4084
+ const reactData = $xeTable as unknown as TableReactData
4085
+ const internalData = $xeTable as unknown as TableInternalData
4086
+
4087
+ const { fullAllDataRowIdData } = internalData
4088
+ let status = false
4089
+ const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId]
4090
+ let rHeight = XEUtils.toInteger(height)
4091
+ if (isScale(height)) {
4092
+ const tableBody = $xeTable.$refs.refTableBody
4093
+ const bodyElem = tableBody ? (tableBody as any).$el as HTMLDivElement : null
4094
+ const bodyHeight = bodyElem ? bodyElem.clientHeight - 1 : 0
4095
+ rHeight = Math.floor(rHeight * bodyHeight)
4096
+ }
4097
+ if (rHeight) {
4098
+ rows.forEach(row => {
4099
+ const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : getRowid($xeTable, row)
4100
+ const rowRest = fullAllDataRowIdData[rowid]
4101
+ if (rowRest) {
4102
+ rowRest.resizeHeight = rHeight
4103
+ if (!status) {
4104
+ status = true
4105
+ }
4106
+ }
3570
4107
  })
4108
+ if (status) {
4109
+ internalData.isResizeCellHeight = true
4110
+ reactData.resizeHeightFlag++
4111
+ }
3571
4112
  }
4113
+ return $xeTable.$nextTick()
4114
+ },
4115
+ getRowHeight (rowOrId: any) {
4116
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4117
+ const internalData = $xeTable as unknown as TableInternalData
4118
+
4119
+ const { fullAllDataRowIdData } = internalData
4120
+ const rowOpts = $xeTable.computeRowOpts
4121
+ const cellOpts = $xeTable.computeCellOpts
4122
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
4123
+ const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId)
4124
+ const rowRest = fullAllDataRowIdData[rowid]
4125
+ if (rowRest) {
4126
+ return rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
4127
+ }
4128
+ return 0
3572
4129
  },
3573
4130
  /**
3574
4131
  * 刷新滚动操作,手动同步滚动相关位置(对于某些特殊的操作,比如滚动条错位、固定列不同步)
@@ -3946,10 +4503,10 @@ const Methods = {
3946
4503
  }
3947
4504
  } else if (isContextMenu) {
3948
4505
  // 如果按下上下文键
3949
- this._keyCtx = selected.row && selected.column && bodyCtxMenu.length
4506
+ internalData._keyCtx = selected.row && selected.column && bodyCtxMenu.length
3950
4507
  clearTimeout(internalData.keyCtxTimeout)
3951
4508
  internalData.keyCtxTimeout = setTimeout(() => {
3952
- this._keyCtx = false
4509
+ internalData._keyCtx = false
3953
4510
  }, 1000)
3954
4511
  } else if (isEnter && !hasAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
3955
4512
  const { isLastEnterAppendRow, beforeEnterMethod, enterMethod } = keyboardOpts
@@ -4181,48 +4738,43 @@ const Methods = {
4181
4738
  this.updateCellAreas()
4182
4739
  this.recalculate(true)
4183
4740
  },
4184
- handleTargetEnterEvent (isClear: any) {
4185
- const $tooltip = this.$refs.tooltip
4186
- clearTimeout(this.tooltipTimeout)
4187
- if (isClear) {
4188
- this.closeTooltip()
4189
- } else {
4190
- if ($tooltip) {
4191
- $tooltip.setActived(true)
4192
- }
4193
- }
4194
- },
4195
4741
  handleTargetLeaveEvent () {
4196
- const tooltipOpts = this.tooltipOpts
4197
- let $tooltip = this.$refs.tooltip
4198
- if ($tooltip) {
4742
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4743
+ const internalData = $xeTable as unknown as TableInternalData
4744
+
4745
+ const tooltipOpts = $xeTable.computeTooltipOpts
4746
+ let $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
4747
+ if ($tooltip && $tooltip.setActived) {
4199
4748
  $tooltip.setActived(false)
4200
4749
  }
4201
4750
  if (tooltipOpts.enterable) {
4202
- this.tooltipTimeout = setTimeout(() => {
4203
- $tooltip = this.$refs.tooltip
4204
- if ($tooltip && !$tooltip.isActived()) {
4205
- this.closeTooltip()
4751
+ internalData.tooltipTimeout = setTimeout(() => {
4752
+ $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
4753
+ if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
4754
+ $xeTable.closeTooltip()
4206
4755
  }
4207
4756
  }, tooltipOpts.leaveDelay)
4208
4757
  } else {
4209
- this.closeTooltip()
4758
+ $xeTable.closeTooltip()
4210
4759
  }
4211
4760
  },
4212
4761
  triggerHeaderTitleEvent (evnt: any, iconParams: any, params: any) {
4213
- const tipContent = iconParams.content || iconParams.message
4762
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4763
+ const reactData = $xeTable as unknown as TableReactData
4764
+
4765
+ const tipContent = iconParams.content || (iconParams as any).message
4214
4766
  if (tipContent) {
4215
- const { $refs, tooltipStore } = this
4767
+ const { tooltipStore } = reactData
4216
4768
  const { column } = params
4217
4769
  const content = getFuncText(tipContent)
4218
- this.handleTargetEnterEvent(true)
4770
+ handleTargetEnterEvent($xeTable, true)
4219
4771
  tooltipStore.row = null
4220
4772
  tooltipStore.column = column
4221
4773
  tooltipStore.visible = true
4222
4774
  tooltipStore.currOpts = iconParams
4223
- this.$nextTick(() => {
4224
- const $tooltip = $refs.tooltip
4225
- if ($tooltip) {
4775
+ $xeTable.$nextTick(() => {
4776
+ const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
4777
+ if ($tooltip && $tooltip.open) {
4226
4778
  $tooltip.open(evnt.currentTarget, content)
4227
4779
  }
4228
4780
  })
@@ -4232,23 +4784,44 @@ const Methods = {
4232
4784
  * 触发表头 tooltip 事件
4233
4785
  */
4234
4786
  triggerHeaderTooltipEvent (evnt: any, params: any) {
4235
- const { tooltipStore } = this
4787
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4788
+ const reactData = $xeTable as unknown as TableReactData
4789
+
4790
+ const { tooltipStore } = reactData
4236
4791
  const { column } = params
4237
- const titleElem = evnt.currentTarget
4238
- this.handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row)
4792
+ handleTargetEnterEvent($xeTable, true)
4793
+ const titleElem = evnt.currentTarget as HTMLDivElement
4794
+ if (!titleElem) {
4795
+ return
4796
+ }
4797
+ const cellEl = titleElem.parentElement as HTMLDivElement
4798
+ if (!cellEl) {
4799
+ return
4800
+ }
4801
+ const thEl = cellEl.parentElement as HTMLTableCellElement
4802
+ if (!thEl) {
4803
+ return
4804
+ }
4239
4805
  if (tooltipStore.column !== column || !tooltipStore.visible) {
4240
- this.handleTooltip(evnt, titleElem, titleElem, null, params)
4806
+ handleTooltip($xeTable, evnt, thEl, cellEl, null, params)
4241
4807
  }
4242
4808
  },
4243
4809
  /**
4244
4810
  * 触发单元格 tooltip 事件
4245
4811
  */
4246
4812
  triggerBodyTooltipEvent (evnt: any, params: any) {
4247
- const { editConfig, editOpts, editStore, tooltipStore } = this
4813
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4814
+ const props = $xeTable
4815
+ const reactData = $xeTable as unknown as TableReactData
4816
+
4817
+ const { editConfig } = props
4818
+ const { editStore } = reactData
4819
+ const { tooltipStore } = reactData
4820
+ const editOpts = $xeTable.computeEditOpts
4248
4821
  const { actived } = editStore
4249
4822
  const { row, column } = params
4250
- const cell = evnt.currentTarget
4251
- this.handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row !== row)
4823
+ const tdEl = evnt.currentTarget as HTMLTableCellElement
4824
+ handleTargetEnterEvent($xeTable, tooltipStore.column !== column || tooltipStore.row !== row)
4252
4825
  // 单元格处于编辑状态时不触发提示框
4253
4826
  if (column.editRender && isEnableConf(editConfig)) {
4254
4827
  // 如果是行编辑模式
@@ -4261,67 +4834,24 @@ const Methods = {
4261
4834
  }
4262
4835
  }
4263
4836
  if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
4264
- let overflowElem
4265
- let tipElem
4266
- if (column.treeNode) {
4267
- overflowElem = cell.querySelector('.vxe-tree-cell')
4268
- if (column.type === 'html') {
4269
- tipElem = cell.querySelector('.vxe-cell--html')
4270
- }
4271
- } else {
4272
- tipElem = cell.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label')
4273
- }
4274
- this.handleTooltip(evnt, cell, overflowElem || cell.children[0], tipElem, params)
4837
+ handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper') as HTMLElement, null, params)
4275
4838
  }
4276
4839
  },
4277
4840
  /**
4278
4841
  * 触发表尾 tooltip 事件
4279
4842
  */
4280
4843
  triggerFooterTooltipEvent (evnt: any, params: any) {
4844
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4845
+ const reactData = $xeTable as unknown as TableReactData
4846
+
4281
4847
  const { column } = params
4282
- const { tooltipStore } = this
4283
- const cell = evnt.currentTarget
4284
- this.handleTargetEnterEvent(true)
4848
+ const { tooltipStore } = reactData
4849
+ const cell = evnt.currentTarget as HTMLTableCellElement
4850
+ handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row)
4285
4851
  if (tooltipStore.column !== column || !tooltipStore.visible) {
4286
- this.handleTooltip(evnt, cell, cell.querySelector('.vxe-cell--item') || cell.children[0], null, params)
4852
+ handleTooltip($xeTable, evnt, cell, cell.querySelector('.vxe-cell--wrapper') as HTMLElement || cell.children[0], null, params)
4287
4853
  }
4288
4854
  },
4289
- /**
4290
- * 处理显示 tooltip
4291
- * @param {Event} evnt 事件
4292
- * @param {ColumnInfo} column 列配置
4293
- * @param {Row} row 行对象
4294
- */
4295
- handleTooltip (evnt: any, cell: any, overflowElem: any, tipElem: any, params: any) {
4296
- const $xeTable = this
4297
-
4298
- if (!overflowElem) {
4299
- return $xeTable.$nextTick()
4300
- }
4301
- params.cell = cell
4302
- const { $refs, tooltipOpts, tooltipStore } = this
4303
- const { column, row } = params
4304
- const { showAll, enabled, contentMethod } = tooltipOpts
4305
- const customContent = contentMethod ? contentMethod(params) : null
4306
- const useCustom = contentMethod && !XEUtils.eqNull(customContent)
4307
- const content = useCustom ? customContent : (column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim()
4308
- const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth
4309
- if (content && (showAll || enabled || useCustom || isCellOverflow)) {
4310
- Object.assign(tooltipStore, {
4311
- row,
4312
- column,
4313
- visible: true,
4314
- currOpts: {}
4315
- })
4316
- this.$nextTick(() => {
4317
- const $tooltip = $refs.tooltip
4318
- if ($tooltip) {
4319
- $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content))
4320
- }
4321
- })
4322
- }
4323
- return this.$nextTick()
4324
- },
4325
4855
  openTooltip (target: any, content: any) {
4326
4856
  const { $refs } = this
4327
4857
  const commTip = $refs.refCommTooltip
@@ -4334,9 +4864,12 @@ const Methods = {
4334
4864
  * 关闭 tooltip
4335
4865
  */
4336
4866
  closeTooltip () {
4337
- const { $refs, tooltipStore } = this
4338
- const tooltip = $refs.tooltip
4339
- const commTip = $refs.refCommTooltip
4867
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
4868
+ const reactData = $xeTable as unknown as TableReactData
4869
+
4870
+ const { tooltipStore } = reactData
4871
+ const tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
4872
+ const commTip = $xeTable.$refs.refCommTooltip as VxeTooltipInstance
4340
4873
  if (tooltipStore.visible) {
4341
4874
  Object.assign(tooltipStore, {
4342
4875
  row: null,
@@ -5341,21 +5874,26 @@ const Methods = {
5341
5874
  }
5342
5875
  this.hoverRow = null
5343
5876
  },
5344
- triggerHeaderCellClickEvent (evnt: any, params: any) {
5345
- const { _lastResizeTime, sortOpts } = this
5877
+ triggerHeaderCellClickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams) {
5878
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
5879
+ const internalData = $xeTable as unknown as TableInternalData
5880
+
5881
+ const { _lastResizeTime } = internalData
5882
+ const sortOpts = $xeTable.computeSortOpts
5883
+ const columnOpts = $xeTable.computeColumnOpts
5346
5884
  const { column } = params
5347
5885
  const cell = evnt.currentTarget
5348
5886
  const triggerResizable = _lastResizeTime && _lastResizeTime > Date.now() - 300
5349
5887
  const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag
5350
5888
  const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag
5351
5889
  if (sortOpts.trigger === 'cell' && !(triggerResizable || triggerSort || triggerFilter)) {
5352
- this.triggerSortEvent(evnt, column, getNextSortOrder(this, column))
5890
+ $xeTable.triggerSortEvent(evnt, column, getNextSortOrder($xeTable, column))
5353
5891
  }
5354
- this.emitEvent('header-cell-click', Object.assign({ triggerResizable, triggerSort, triggerFilter, cell }, params), evnt)
5355
- if (this.columnOpts.isCurrent || this.highlightCurrentColumn) {
5356
- this.triggerCurrentColumnEvent(evnt, params)
5892
+ $xeTable.dispatchEvent('header-cell-click', Object.assign({ triggerResizable, triggerSort, triggerFilter, cell }, params), evnt)
5893
+ if (columnOpts.isCurrent || $xeTable.highlightCurrentColumn) {
5894
+ $xeTable.triggerCurrentColumnEvent(evnt, params)
5357
5895
  }
5358
- return this.$nextTick()
5896
+ return $xeTable.$nextTick()
5359
5897
  },
5360
5898
  triggerHeaderCellDblclickEvent (evnt: any, params: any) {
5361
5899
  this.emitEvent('header-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, params), evnt)
@@ -5409,8 +5947,21 @@ const Methods = {
5409
5947
  */
5410
5948
  triggerCellClickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams) {
5411
5949
  const $xeTable = this
5950
+ const props = $xeTable
5951
+ const reactData = $xeTable
5412
5952
 
5413
- const { highlightCurrentRow, editStore, radioOpts, expandOpts, treeOpts, keyboardOpts, editConfig, editOpts, checkboxOpts, rowOpts } = this
5953
+ const { highlightCurrentRow, editConfig } = props
5954
+ const { editStore, isDragResize } = reactData
5955
+ if (isDragResize) {
5956
+ return
5957
+ }
5958
+ const expandOpts = $xeTable.computeExpandOpts
5959
+ const editOpts = $xeTable.computeEditOpts
5960
+ const treeOpts = $xeTable.computeTreeOpts
5961
+ const radioOpts = $xeTable.computeRadioOpts
5962
+ const checkboxOpts = $xeTable.computeCheckboxOpts
5963
+ const keyboardOpts = $xeTable.computeKeyboardOpts
5964
+ const rowOpts = $xeTable.computeRowOpts
5414
5965
  const { actived, focused } = editStore
5415
5966
  const { row, column } = params
5416
5967
  const { type, treeNode } = column
@@ -5494,7 +6045,16 @@ const Methods = {
5494
6045
  * 如果是双击模式,则激活为编辑状态
5495
6046
  */
5496
6047
  triggerCellDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams) {
5497
- const { editStore, editConfig, editOpts } = this
6048
+ const $xeTable = this
6049
+ const props = $xeTable
6050
+ const reactData = $xeTable
6051
+
6052
+ const { editConfig } = props
6053
+ const { editStore, isDragResize } = reactData
6054
+ if (isDragResize) {
6055
+ return
6056
+ }
6057
+ const editOpts = $xeTable.computeEditOpts
5498
6058
  const { actived } = editStore
5499
6059
  const cell = evnt.currentTarget as HTMLDivElement
5500
6060
  params = Object.assign({ cell }, params)
@@ -5565,10 +6125,13 @@ const Methods = {
5565
6125
  const $xeTable = this
5566
6126
 
5567
6127
  const sortOpts = $xeTable.computeSortOpts
6128
+ const { multiple, allowClear } = sortOpts
5568
6129
  const { field, sortable, remoteSort } = column
5569
6130
  if (sortable || remoteSort) {
5570
6131
  if (!order || column.order === order) {
5571
- $xeTable.clearSort(sortOpts.multiple ? column : null)
6132
+ if (allowClear) {
6133
+ $xeTable.clearSort(multiple ? column : null)
6134
+ }
5572
6135
  } else {
5573
6136
  $xeTable.sort({ field, order })
5574
6137
  }
@@ -5672,7 +6235,7 @@ const Methods = {
5672
6235
  const { treeConfig, dragConfig } = props
5673
6236
  const rowDragOpts = $xeTable.computeRowDragOpts
5674
6237
  const { fullAllDataRowIdData } = internalData
5675
- const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts
6238
+ const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod, dragToChildMethod } = rowDragOpts
5676
6239
  const treeOpts = $xeTable.computeTreeOpts
5677
6240
  const { transform, rowField, mapChildrenField, parentField } = treeOpts
5678
6241
  const childrenField = treeOpts.children || treeOpts.childrenField
@@ -5682,17 +6245,15 @@ const Methods = {
5682
6245
  if (prevDragRow && dragRow) {
5683
6246
  // 判断是否有拖动
5684
6247
  if (prevDragRow !== dragRow) {
5685
- return Promise.resolve(
5686
- dEndMethod
5687
- ? dEndMethod({
5688
- oldRow: dragRow,
5689
- newRow: prevDragRow,
5690
- dragPos: prevDragPos as any,
5691
- dragToChild: !!prevDragToChild,
5692
- offsetIndex: dragOffsetIndex
5693
- })
5694
- : true
5695
- ).then((status) => {
6248
+ const dragParams = {
6249
+ oldRow: dragRow,
6250
+ newRow: prevDragRow,
6251
+ dragPos: prevDragPos as 'top' | 'bottom',
6252
+ dragToChild: !!prevDragToChild,
6253
+ offsetIndex: dragOffsetIndex as 0 | 1
6254
+ }
6255
+ const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
6256
+ return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
5696
6257
  if (!status) {
5697
6258
  return
5698
6259
  }
@@ -5772,7 +6333,11 @@ const Methods = {
5772
6333
  // 根到根
5773
6334
  }
5774
6335
 
5775
- const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, { children: childrenField })
6336
+ const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
6337
+ key: rowField,
6338
+ parentKey: parentField,
6339
+ children: mapChildrenField
6340
+ })
5776
6341
 
5777
6342
  // 移出
5778
6343
  const otfIndex = $xeTable.findRowIndexOf(fullList, dragRow)
@@ -5789,13 +6354,13 @@ const Methods = {
5789
6354
  childRow[parentField] = dragRow[parentField]
5790
6355
  })
5791
6356
  }
5792
- dragRow[parentField] = prevDragToChild ? prevDragRow[rowField] : prevDragRow[parentField]
6357
+ dragRow[parentField] = isDragToChildFlag ? prevDragRow[rowField] : prevDragRow[parentField]
5793
6358
 
5794
6359
  internalData.tableFullTreeData = XEUtils.toArrayTree(fullList, {
5795
- key: treeOpts.rowField,
5796
- parentKey: treeOpts.parentField,
6360
+ key: rowField,
6361
+ parentKey: parentField,
5797
6362
  children: childrenField,
5798
- mapChildren: treeOpts.mapChildrenField
6363
+ mapChildren: mapChildrenField
5799
6364
  })
5800
6365
  }
5801
6366
  }
@@ -5816,7 +6381,7 @@ const Methods = {
5816
6381
 
5817
6382
  reactData.isDragRowMove = true
5818
6383
  $xeTable.handleTableData(treeConfig && transform)
5819
- $xeTable.cacheRowMap()
6384
+ $xeTable.cacheRowMap(false)
5820
6385
  updateScrollYStatus($xeTable)
5821
6386
  if (!(treeConfig && transform)) {
5822
6387
  updateAfterDataIndex($xeTable)
@@ -5834,7 +6399,7 @@ const Methods = {
5834
6399
  oldRow: dragRow,
5835
6400
  newRow: prevDragRow,
5836
6401
  dragPos: prevDragPos as any,
5837
- dragToChild: !!prevDragToChild,
6402
+ dragToChild: isDragToChildFlag,
5838
6403
  offsetIndex: dragOffsetIndex,
5839
6404
  _index: {
5840
6405
  newIndex: nafIndex,
@@ -5861,18 +6426,16 @@ const Methods = {
5861
6426
  const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
5862
6427
  const { prevDragRow, prevDragPos } = internalData
5863
6428
 
5864
- if (treeConfig && prevDragToChild) {
6429
+ if (treeConfig && lazy && prevDragToChild) {
5865
6430
  // 懒加载
5866
- if (lazy) {
5867
- const newRowid = getRowid($xeTable, prevDragRow)
5868
- const rowRest = fullAllDataRowIdData[newRowid]
5869
- if (prevDragRow[hasChildField]) {
5870
- if (rowRest && rowRest.treeLoaded) {
5871
- $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
5872
- }
5873
- } else {
6431
+ const newRowid = getRowid($xeTable, prevDragRow)
6432
+ const rowRest = fullAllDataRowIdData[newRowid]
6433
+ if (prevDragRow[hasChildField]) {
6434
+ if (rowRest && rowRest.treeLoaded) {
5874
6435
  $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
5875
6436
  }
6437
+ } else {
6438
+ $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
5876
6439
  }
5877
6440
  } else {
5878
6441
  $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
@@ -5994,7 +6557,7 @@ const Methods = {
5994
6557
 
5995
6558
  const { mouseConfig } = props
5996
6559
  const columnDragOpts = $xeTable.computeColumnDragOpts
5997
- const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
6560
+ const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts
5998
6561
  const { collectColumn } = internalData
5999
6562
  const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0
6000
6563
  if (prevDragCol && dragCol) {
@@ -6002,17 +6565,15 @@ const Methods = {
6002
6565
  if (prevDragCol !== dragCol) {
6003
6566
  const oldColumn = dragCol
6004
6567
  const newColumn = prevDragCol
6005
- return Promise.resolve(
6006
- dragEndMethod
6007
- ? dragEndMethod({
6008
- oldColumn,
6009
- newColumn,
6010
- dragPos: prevDragPos as any,
6011
- dragToChild: !!prevDragToChild,
6012
- offsetIndex: dragOffsetIndex
6013
- })
6014
- : true
6015
- ).then((status) => {
6568
+ const dragParams = {
6569
+ oldColumn,
6570
+ newColumn,
6571
+ dragPos: prevDragPos as 'left' | 'right',
6572
+ dragToChild: !!prevDragToChild,
6573
+ offsetIndex: dragOffsetIndex as 0 | 1
6574
+ }
6575
+ const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
6576
+ return Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
6016
6577
  if (!status) {
6017
6578
  return
6018
6579
  }
@@ -6108,7 +6669,7 @@ const Methods = {
6108
6669
  if (newMatchRest) {
6109
6670
  const { items: nCols, index: nIndex, parent: nParent } = newMatchRest
6110
6671
  // 转子级
6111
- if ((isCrossDrag && isToChildDrag) && prevDragToChild) {
6672
+ if ((isCrossDrag && isToChildDrag) && isDragToChildFlag) {
6112
6673
  oldColumn.parentId = newColumn.id
6113
6674
  newColumn.children = (newColumn.children || []).concat([oldColumn])
6114
6675
  } else {
@@ -6142,7 +6703,7 @@ const Methods = {
6142
6703
  oldColumn,
6143
6704
  newColumn,
6144
6705
  dragPos: prevDragPos,
6145
- dragToChild: !!prevDragToChild,
6706
+ dragToChild: isDragToChildFlag,
6146
6707
  offsetIndex: dragOffsetIndex,
6147
6708
  _index: {
6148
6709
  newIndex: nafIndex,
@@ -7174,13 +7735,18 @@ const Methods = {
7174
7735
  * 获取表格的滚动状态
7175
7736
  */
7176
7737
  getScroll () {
7177
- const { $refs, scrollXLoad, scrollYLoad } = this
7178
- const bodyElem = $refs.refTableBody.$el
7738
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7739
+ const reactData = $xeTable as unknown as TableReactData
7740
+ const internalData = $xeTable as unknown as TableInternalData
7741
+
7742
+ const { scrollXLoad, scrollYLoad } = reactData
7743
+ const { elemStore } = internalData
7744
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
7179
7745
  return {
7180
7746
  virtualX: scrollXLoad,
7181
7747
  virtualY: scrollYLoad,
7182
- scrollTop: bodyElem.scrollTop,
7183
- scrollLeft: bodyElem.scrollLeft
7748
+ scrollTop: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
7749
+ scrollLeft: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
7184
7750
  }
7185
7751
  },
7186
7752
  handleScrollEvent (evnt: Event, isRollY: boolean, isRollX: boolean, scrollTop: number, scrollLeft: number, params: any) {
@@ -7285,48 +7851,6 @@ const Methods = {
7285
7851
  }
7286
7852
  $xeTable.dispatchEvent('scroll', evntParams, evnt)
7287
7853
  },
7288
- lazyScrollXData () {
7289
- const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7290
- const internalData = $xeTable as unknown as TableInternalData
7291
-
7292
- const { lxTimeout, lxRunTime, scrollXStore } = internalData
7293
- const { visibleSize } = scrollXStore
7294
- const fpsTime = Math.max(5, Math.min(80, Math.floor(visibleSize * 3)))
7295
- if (lxTimeout) {
7296
- clearTimeout(lxTimeout)
7297
- }
7298
- if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
7299
- internalData.lxRunTime = Date.now()
7300
- loadScrollXData($xeTable)
7301
- }
7302
- internalData.lxTimeout = setTimeout(() => {
7303
- internalData.lxTimeout = undefined
7304
- internalData.lxRunTime = undefined
7305
- loadScrollXData($xeTable)
7306
- }, fpsTime)
7307
- },
7308
- lazyScrollYData () {
7309
- const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7310
- const props = $xeTable
7311
- const internalData = $xeTable as unknown as TableInternalData
7312
-
7313
- const { showOverflow } = props
7314
- const { lyTimeout, lyRunTime, scrollYStore } = internalData
7315
- const { visibleSize } = scrollYStore
7316
- const fpsTime = showOverflow ? 5 : Math.max(5, Math.min(80, Math.floor(visibleSize / 2)))
7317
- if (lyTimeout) {
7318
- clearTimeout(lyTimeout)
7319
- }
7320
- if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
7321
- internalData.lyRunTime = Date.now()
7322
- loadScrollYData($xeTable)
7323
- }
7324
- internalData.lyTimeout = setTimeout(() => {
7325
- internalData.lyTimeout = undefined
7326
- internalData.lyRunTime = undefined
7327
- loadScrollYData($xeTable)
7328
- }, fpsTime)
7329
- },
7330
7854
  /**
7331
7855
  * 横向 X 可视渲染事件处理
7332
7856
  */
@@ -7337,7 +7861,7 @@ const Methods = {
7337
7861
  if (sXOpts.immediate) {
7338
7862
  loadScrollXData($xeTable)
7339
7863
  } else {
7340
- $xeTable.lazyScrollXData()
7864
+ lazyScrollXData($xeTable)
7341
7865
  }
7342
7866
  },
7343
7867
  /**
@@ -7350,14 +7874,14 @@ const Methods = {
7350
7874
  if (sYOpts.immediate) {
7351
7875
  loadScrollYData($xeTable)
7352
7876
  } else {
7353
- $xeTable.lazyScrollYData()
7877
+ lazyScrollYData($xeTable)
7354
7878
  }
7355
7879
  },
7356
7880
  triggerBodyScrollEvent (evnt: Event, fixedType: '' | 'left' | 'right') {
7357
7881
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7358
7882
  const internalData = $xeTable as unknown as TableInternalData
7359
7883
 
7360
- const { elemStore, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
7884
+ const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
7361
7885
  const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
7362
7886
  const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
7363
7887
  const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
@@ -7368,6 +7892,9 @@ const Methods = {
7368
7892
  if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
7369
7893
  return
7370
7894
  }
7895
+ if (intoRunScroll) {
7896
+ return
7897
+ }
7371
7898
  if (!bodyScrollElem) {
7372
7899
  return
7373
7900
  }
@@ -7425,22 +7952,16 @@ const Methods = {
7425
7952
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7426
7953
  const internalData = $xeTable as unknown as TableInternalData
7427
7954
 
7428
- const { elemStore, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
7955
+ const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
7429
7956
  const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
7430
7957
  const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
7431
7958
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
7432
7959
  const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
7433
7960
  const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
7434
- if (inWheelScroll) {
7435
- return
7436
- }
7437
- if (inVirtualScroll) {
7438
- return
7439
- }
7440
- if (inBodyScroll) {
7961
+ if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
7441
7962
  return
7442
7963
  }
7443
- if (inFooterScroll) {
7964
+ if (intoRunScroll) {
7444
7965
  return
7445
7966
  }
7446
7967
  if (!headerScrollElem) {
@@ -7470,22 +7991,16 @@ const Methods = {
7470
7991
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7471
7992
  const internalData = $xeTable as unknown as TableInternalData
7472
7993
 
7473
- const { elemStore, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
7994
+ const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
7474
7995
  const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
7475
7996
  const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
7476
7997
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
7477
7998
  const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
7478
7999
  const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
7479
- if (inWheelScroll) {
7480
- return
7481
- }
7482
- if (inVirtualScroll) {
8000
+ if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
7483
8001
  return
7484
8002
  }
7485
- if (inHeaderScroll) {
7486
- return
7487
- }
7488
- if (inBodyScroll) {
8003
+ if (intoRunScroll) {
7489
8004
  return
7490
8005
  }
7491
8006
  if (!footerScrollElem) {
@@ -7517,7 +8032,10 @@ const Methods = {
7517
8032
  const reactData = $xeTable as unknown as TableReactData
7518
8033
  const internalData = $xeTable as unknown as TableInternalData
7519
8034
 
7520
- const { deltaY, deltaX } = evnt
8035
+ const { target, deltaY, deltaX } = evnt
8036
+ if (target && /^textarea$/i.test((target as HTMLElement).tagName)) {
8037
+ return
8038
+ }
7521
8039
  const { highlightHoverRow } = tableProps
7522
8040
  const { elemStore, lastScrollTop, lastScrollLeft } = internalData
7523
8041
  const rowOpts = $xeTable.computeRowOpts
@@ -7537,29 +8055,14 @@ const Methods = {
7537
8055
  return
7538
8056
  }
7539
8057
 
7540
- let multiple = 1
7541
-
7542
- if (reactData.lastScrollTime + 25 > Date.now()) {
7543
- multiple = 1.18
7544
- } else if (reactData.lastScrollTime + 30 > Date.now()) {
7545
- multiple = 1.15
7546
- } else if (reactData.lastScrollTime + 40 > Date.now()) {
7547
- multiple = 1.12
7548
- } else if (reactData.lastScrollTime + 55 > Date.now()) {
7549
- multiple = 1.09
7550
- } else if (reactData.lastScrollTime + 75 > Date.now()) {
7551
- multiple = 1.06
7552
- } else if (reactData.lastScrollTime + 100 > Date.now()) {
7553
- multiple = 1.03
7554
- }
7555
-
7556
- const deltaTop = deltaY * multiple
7557
- const deltaLeft = deltaX * multiple
8058
+ const wheelSpeed = getWheelSpeed(reactData.lastScrollTime)
8059
+ const deltaTop = deltaY * wheelSpeed
8060
+ const deltaLeft = deltaX * wheelSpeed
7558
8061
 
7559
8062
  const isTopWheel = deltaTop < 0
7560
- const currScrollTop = yHandleEl.scrollTop
8063
+ const currScrollTop = bodyScrollElem.scrollTop
7561
8064
  // 如果滚动位置已经是顶部或底部,则不需要触发
7562
- if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= yHandleEl.scrollHeight - yHandleEl.clientHeight) {
8065
+ if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
7563
8066
  return
7564
8067
  }
7565
8068
 
@@ -7575,16 +8078,31 @@ const Methods = {
7575
8078
  $xeTable.clearHoverRow()
7576
8079
  }
7577
8080
 
7578
- internalData.inWheelScroll = true
7579
- setScrollTop(yHandleEl, scrollTop)
7580
- setScrollTop(bodyScrollElem, scrollTop)
7581
- setScrollTop(leftScrollElem, scrollTop)
7582
- setScrollTop(rightScrollElem, scrollTop)
7583
- $xeTable.triggerScrollYEvent(evnt)
7584
- $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
7585
- type: 'footer',
7586
- fixed: ''
8081
+ wheelScrollTo(scrollTop - bodyScrollElem.scrollTop, (offsetTop: number) => {
8082
+ const currTopNum = bodyScrollElem.scrollTop + offsetTop
8083
+ internalData.inWheelScroll = true
8084
+ setScrollTop(yHandleEl, currTopNum)
8085
+ setScrollTop(bodyScrollElem, currTopNum)
8086
+ setScrollTop(leftScrollElem, currTopNum)
8087
+ setScrollTop(rightScrollElem, currTopNum)
8088
+ $xeTable.triggerScrollYEvent(evnt)
8089
+ $xeTable.handleScrollEvent(evnt, isRollY, isRollX, currTopNum, scrollLeft, {
8090
+ type: 'table',
8091
+ fixed: ''
8092
+ })
7587
8093
  })
8094
+
8095
+ // internalData.inWheelScroll = true
8096
+ // setScrollTop(yHandleEl, scrollTop)
8097
+ // setScrollTop(bodyScrollElem, scrollTop)
8098
+ // setScrollTop(leftScrollElem, scrollTop)
8099
+ // setScrollTop(rightScrollElem, scrollTop)
8100
+
8101
+ // loadScrollYData($xeTable, scrollTop)
8102
+ // $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
8103
+ // type: 'footer',
8104
+ // fixed: ''
8105
+ // })
7588
8106
  }
7589
8107
  },
7590
8108
  triggerVirtualScrollXEvent (evnt: Event) {
@@ -7658,15 +8176,15 @@ const Methods = {
7658
8176
  })
7659
8177
  },
7660
8178
  updateScrollXData () {
7661
- const $xeTable = this
7662
- const props = $xeTable
8179
+ const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
8180
+ const reactData = $xeTable as unknown as TableReactData
7663
8181
 
7664
- const { showOverflow } = props
8182
+ const { isAllOverflow } = reactData
7665
8183
  handleTableColumn($xeTable)
7666
8184
  return $xeTable.$nextTick().then(() => {
7667
8185
  handleTableColumn($xeTable)
7668
8186
  $xeTable.updateScrollXSpace()
7669
- if (!showOverflow) {
8187
+ if (!isAllOverflow) {
7670
8188
  $xeTable.updateScrollYSpace()
7671
8189
  }
7672
8190
  })
@@ -7732,38 +8250,37 @@ const Methods = {
7732
8250
  // 更新纵向 Y 可视渲染上下剩余空间大小
7733
8251
  updateScrollYSpace () {
7734
8252
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7735
- const props = $xeTable
7736
8253
  const reactData = $xeTable as unknown as TableReactData
7737
8254
  const internalData = $xeTable as unknown as TableInternalData
7738
8255
 
7739
- const { showOverflow } = props
7740
- const { scrollYLoad, rowHeight } = reactData
7741
- const { scrollYStore, elemStore, afterFullData, fullAllDataRowIdData } = internalData
8256
+ const { isAllOverflow, scrollYLoad } = reactData
8257
+ const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
7742
8258
  const { startIndex } = scrollYStore
8259
+ const rowOpts = $xeTable.computeRowOpts
8260
+ const cellOpts = $xeTable.computeCellOpts
8261
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
7743
8262
  const bodyTableElem = getRefElem(elemStore['main-body-table'])
7744
8263
  const containerList = ['main', 'left', 'right']
7745
8264
  let topSpaceHeight = 0
7746
8265
  let ySpaceHeight = 0
8266
+
7747
8267
  if (scrollYLoad) {
7748
- if (showOverflow) {
7749
- ySpaceHeight = afterFullData.length * rowHeight
7750
- topSpaceHeight = Math.max(0, startIndex * rowHeight)
8268
+ const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
8269
+ if (!isCustomCellHeight && isAllOverflow) {
8270
+ ySpaceHeight = afterFullData.length * defaultRowHeight
8271
+ topSpaceHeight = Math.max(0, startIndex * defaultRowHeight)
7751
8272
  } else {
7752
8273
  for (let i = 0; i < afterFullData.length; i++) {
7753
8274
  const row = afterFullData[i]
7754
8275
  const rowid = getRowid($xeTable, row)
7755
- const rowRest = fullAllDataRowIdData[rowid]
7756
- if (rowRest) {
7757
- ySpaceHeight += rowRest.height || rowHeight
7758
- }
8276
+ const rowRest = fullAllDataRowIdData[rowid] || {}
8277
+ ySpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
7759
8278
  }
7760
8279
  for (let i = 0; i < startIndex; i++) {
7761
8280
  const row = afterFullData[i]
7762
8281
  const rowid = getRowid($xeTable, row)
7763
- const rowRest = fullAllDataRowIdData[rowid]
7764
- if (rowRest) {
7765
- topSpaceHeight += rowRest.height || rowHeight
7766
- }
8282
+ const rowRest = fullAllDataRowIdData[rowid] || {}
8283
+ topSpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
7767
8284
  }
7768
8285
  }
7769
8286
  } else {
@@ -7788,7 +8305,7 @@ const Methods = {
7788
8305
  if (scrollYSpaceEl) {
7789
8306
  scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
7790
8307
  }
7791
- $xeTable.$nextTick(() => {
8308
+ return $xeTable.$nextTick().then(() => {
7792
8309
  updateStyle($xeTable)
7793
8310
  })
7794
8311
  },
@@ -7853,11 +8370,9 @@ const Methods = {
7853
8370
  */
7854
8371
  scrollToRow (row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
7855
8372
  const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
7856
- const props = $xeTable
7857
8373
  const reactData = $xeTable as unknown as TableReactData
7858
8374
 
7859
- const { showOverflow } = props
7860
- const { scrollYLoad, scrollXLoad } = reactData
8375
+ const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData
7861
8376
  const rest = []
7862
8377
  if (row) {
7863
8378
  if (this.treeConfig) {
@@ -7871,7 +8386,7 @@ const Methods = {
7871
8386
  }
7872
8387
  return Promise.all(rest).then(() => {
7873
8388
  if (row) {
7874
- if (!showOverflow && (scrollYLoad || scrollXLoad)) {
8389
+ if (!isAllOverflow && (scrollYLoad || scrollXLoad)) {
7875
8390
  calcCellHeight($xeTable)
7876
8391
  calcCellWidth($xeTable)
7877
8392
  }