vxe-table 3.12.16 → 3.12.17

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 (48) hide show
  1. package/es/index.css +1 -1
  2. package/es/index.min.css +1 -1
  3. package/es/style.css +1 -1
  4. package/es/style.min.css +1 -1
  5. package/es/table/module/edit/mixin.js +5 -5
  6. package/es/table/src/body.js +60 -47
  7. package/es/table/src/methods.js +123 -24
  8. package/es/table/src/table.js +101 -23
  9. package/es/table/style.css +26 -0
  10. package/es/table/style.min.css +1 -1
  11. package/es/ui/index.js +1 -1
  12. package/es/ui/src/log.js +1 -1
  13. package/es/vxe-table/style.css +26 -0
  14. package/es/vxe-table/style.min.css +1 -1
  15. package/lib/index.css +1 -1
  16. package/lib/index.min.css +1 -1
  17. package/lib/index.umd.js +350 -113
  18. package/lib/index.umd.min.js +1 -1
  19. package/lib/style.css +1 -1
  20. package/lib/style.min.css +1 -1
  21. package/lib/table/module/edit/mixin.js +10 -5
  22. package/lib/table/module/edit/mixin.min.js +1 -1
  23. package/lib/table/src/body.js +71 -59
  24. package/lib/table/src/body.min.js +1 -1
  25. package/lib/table/src/methods.js +141 -23
  26. package/lib/table/src/methods.min.js +1 -1
  27. package/lib/table/src/table.js +126 -24
  28. package/lib/table/src/table.min.js +1 -1
  29. package/lib/table/style/style.css +26 -0
  30. package/lib/table/style/style.min.css +1 -1
  31. package/lib/ui/index.js +1 -1
  32. package/lib/ui/index.min.js +1 -1
  33. package/lib/ui/src/log.js +1 -1
  34. package/lib/ui/src/log.min.js +1 -1
  35. package/lib/vxe-table/style/style.css +26 -0
  36. package/lib/vxe-table/style/style.min.css +1 -1
  37. package/package.json +1 -1
  38. package/packages/table/module/edit/mixin.ts +5 -5
  39. package/packages/table/src/body.ts +62 -48
  40. package/packages/table/src/methods.ts +125 -24
  41. package/packages/table/src/table.ts +108 -24
  42. package/styles/components/table.scss +26 -0
  43. /package/es/{iconfont.1739333092714.ttf → iconfont.1739428244406.ttf} +0 -0
  44. /package/es/{iconfont.1739333092714.woff → iconfont.1739428244406.woff} +0 -0
  45. /package/es/{iconfont.1739333092714.woff2 → iconfont.1739428244406.woff2} +0 -0
  46. /package/lib/{iconfont.1739333092714.ttf → iconfont.1739428244406.ttf} +0 -0
  47. /package/lib/{iconfont.1739333092714.woff → iconfont.1739428244406.woff} +0 -0
  48. /package/lib/{iconfont.1739333092714.woff2 → iconfont.1739428244406.woff2} +0 -0
@@ -429,7 +429,7 @@ function renderRows (h: CreateElement, _vm: any, fixedType: 'left' | 'right' | '
429
429
  const tableInternalData = $xeTable as unknown as TableInternalData
430
430
 
431
431
  const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps
432
- const { hasFixedColumn, treeExpandedMaps, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove } = tableReactData
432
+ const { hasFixedColumn, treeExpandedMaps, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove, rowExpandHeightFlag } = tableReactData
433
433
  const { fullAllDataRowIdData } = tableInternalData
434
434
  const checkboxOpts = $xeTable.computeCheckboxOpts
435
435
  const radioOpts = $xeTable.computeRadioOpts
@@ -462,18 +462,18 @@ function renderRows (h: CreateElement, _vm: any, fixedType: 'left' | 'right' | '
462
462
  }
463
463
  }
464
464
  const rowid = getRowid($xeTable, row)
465
- const rest = fullAllDataRowIdData[rowid]
465
+ const rowRest = fullAllDataRowIdData[rowid]
466
466
  let rowLevel = 0
467
467
  let seq: string | number = -1
468
468
  let _rowIndex = 0
469
- if (rest) {
470
- rowLevel = rest.level
469
+ if (rowRest) {
470
+ rowLevel = rowRest.level
471
471
  if (treeConfig && transform && seqMode === 'increasing') {
472
- seq = rest._index + 1
472
+ seq = rowRest._index + 1
473
473
  } else {
474
- seq = rest.seq
474
+ seq = rowRest.seq
475
475
  }
476
- _rowIndex = rest._index
476
+ _rowIndex = rowRest._index
477
477
  }
478
478
  const params = { $table: $xeTable, seq, rowid, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex }
479
479
  // 行是否被展开
@@ -542,48 +542,66 @@ function renderRows (h: CreateElement, _vm: any, fixedType: 'left' | 'right' | '
542
542
  // 如果行被展开了
543
543
  if (isExpandRow) {
544
544
  const expandOpts = $xeTable.computeExpandOpts
545
- const { height: expandHeight, padding } = expandOpts
546
- const cellStyle: any = {}
547
- if (expandHeight) {
548
- cellStyle.height = `${expandHeight}px`
549
- }
550
- if (treeConfig) {
551
- cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`
552
- }
553
- const { showOverflow } = expandColumn
554
- const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow
555
- const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex }
556
- rows.push(
557
- h('tr', {
558
- class: ['vxe-body--expanded-row', {
559
- 'is--padding': padding
560
- }],
561
- key: `expand_${rowid}`,
562
- style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(expandParams) : rowStyle) as VxeComponentStyleType : undefined,
563
- on: trOn
564
- }, [
565
- h('td', {
566
- class: {
567
- 'vxe-body--expanded-column': 1,
568
- 'fixed--hidden': fixedType && !hasFixedColumn,
569
- 'col--ellipsis': hasEllipsis
570
- },
545
+ const { height: expandHeight, padding, mode: expandMode } = expandOpts
546
+ if (expandMode === 'fixed') {
547
+ rows.push(
548
+ h('tr', {
549
+ class: 'vxe-body--row-expanded-place',
550
+ key: `expand_${rowid}`,
571
551
  attrs: {
572
- colspan: tableColumn.length
552
+ rowid
573
553
  }
574
554
  }, [
575
- h('div', {
576
- class: {
577
- 'vxe-body--expanded-cell': 1,
578
- 'is--ellipsis': expandHeight
555
+ h('td', {
556
+ class: 'vxe-body--row-expanded-place-column',
557
+ attrs: {
558
+ colspan: tableColumn.length
579
559
  },
580
- style: cellStyle
560
+ style: {
561
+ height: `${rowExpandHeightFlag ? (rowRest.expandHeight || expandHeight) : 0}px`
562
+ }
563
+ })
564
+ ])
565
+ )
566
+ } else {
567
+ const cellStyle: any = {}
568
+ if (expandHeight) {
569
+ cellStyle.height = `${expandHeight}px`
570
+ }
571
+ if (treeConfig) {
572
+ cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`
573
+ }
574
+ const { showOverflow } = expandColumn
575
+ const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow
576
+ const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex }
577
+ rows.push(
578
+ h('tr', {
579
+ class: ['vxe-body--expanded-row', {
580
+ 'is--padding': padding
581
+ }],
582
+ key: `expand_${rowid}`
583
+ }, [
584
+ h('td', {
585
+ class: ['vxe-body--expanded-column', {
586
+ 'fixed--hidden': fixedType && !hasFixedColumn,
587
+ 'col--ellipsis': hasEllipsis
588
+ }],
589
+ attrs: {
590
+ colspan: tableColumn.length
591
+ }
581
592
  }, [
582
- expandColumn.renderData(h, expandParams)
593
+ h('div', {
594
+ class: ['vxe-body--expanded-cell', {
595
+ 'is--ellipsis': expandHeight
596
+ }],
597
+ style: cellStyle
598
+ }, [
599
+ expandColumn.renderData(h, expandParams)
600
+ ])
583
601
  ])
584
602
  ])
585
- ])
586
- )
603
+ )
604
+ }
587
605
  }
588
606
  // 如果是树形表格
589
607
  if (isExpandTree) {
@@ -656,15 +674,14 @@ export default {
656
674
  const emptyOpts = $xeTable.computeEmptyOpts
657
675
  const mouseOpts = $xeTable.computeMouseOpts
658
676
  const rowDragOpts = $xeTable.computeRowDragOpts
659
- const leftFixedWidth = $xeTable.computeLeftFixedWidth
660
- const rightFixedWidth = $xeTable.computeRightFixedWidth
677
+ const expandOpts = $xeTable.computeExpandOpts
661
678
 
662
679
  let renderDataList = tableData
663
680
  let renderColumnList = tableColumn as VxeTableDefines.ColumnInfo[]
664
681
  let isOptimizeMode = false
665
682
  // 如果是使用优化模式
666
683
  if (scrollXLoad || scrollYLoad || isAllOverflow) {
667
- if (expandColumn || spanMethod || footerSpanMethod) {
684
+ if ((expandColumn && expandOpts.mode !== 'fixed') || spanMethod || footerSpanMethod) {
668
685
  // 如果不支持优化模式
669
686
  } else {
670
687
  isOptimizeMode = true
@@ -744,9 +761,6 @@ export default {
744
761
  $xeTable.triggerBodyScrollEvent(evnt, fixedType)
745
762
  }
746
763
  }
747
- if (scrollYLoad || leftFixedWidth || rightFixedWidth) {
748
- ons.wheel = $xeTable.triggerBodyWheelEvent
749
- }
750
764
 
751
765
  return h('div', {
752
766
  ref: 'refElem',
@@ -1,5 +1,5 @@
1
1
  import XEUtils from 'xe-utils'
2
- import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft } from '../../ui/src/dom'
2
+ import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft, toCssUnit } 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, resizeHeight: 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, expandHeight: 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, resizeHeight: 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, expandHeight: 0 }
365
365
  fullAllDataRowIdData[rowid] = rest
366
366
  fullDataRowIdData[rowid] = rest
367
367
  }
@@ -430,6 +430,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
430
430
  const emptyPlaceholderElem = $xeTable.$refs.refEmptyPlaceholder as HTMLDivElement
431
431
  const cellOffsetWidth = $xeTable.computeCellOffsetWidth
432
432
  const mouseOpts = $xeTable.computeMouseOpts
433
+ const expandOpts = $xeTable.computeExpandOpts
433
434
  const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper'])
434
435
  const bodyTableElem = getRefElem(elemStore['main-body-table'])
435
436
  if (emptyPlaceholderElem) {
@@ -503,6 +504,12 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
503
504
  yBottomCornerEl.style.display = footerHeight ? 'block' : ''
504
505
  }
505
506
 
507
+ const rowExpandEl = $xeTable.$refs.refRowExpandElem as HTMLDivElement
508
+ if (rowExpandEl) {
509
+ rowExpandEl.style.height = `${bodyHeight}px`
510
+ rowExpandEl.style.top = `${headerHeight}px`
511
+ }
512
+
506
513
  containerList.forEach((name, index) => {
507
514
  const fixedType = index > 0 ? name : ''
508
515
  const layoutList = ['header', 'body', 'footer']
@@ -620,7 +627,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
620
627
  let isOptimizeMode = false
621
628
  // 如果是使用优化模式
622
629
  if (scrollXLoad || scrollYLoad || isAllOverflow) {
623
- if (expandColumn || spanMethod || footerSpanMethod) {
630
+ if ((expandColumn && expandOpts.mode !== 'fixed') || spanMethod || footerSpanMethod) {
624
631
  // 如果不支持优化模式
625
632
  } else {
626
633
  isOptimizeMode = true
@@ -752,6 +759,15 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
752
759
  return $xeTable.$nextTick()
753
760
  }
754
761
 
762
+ function calcVarRowHeightConfig ($xeTable: VxeTableConstructor, sizeKey: 'default' | 'medium' | 'small' | 'mini', sizeEl: Element) {
763
+ const reactData = $xeTable as unknown as TableReactData
764
+
765
+ const { rowHeightStore } = reactData
766
+ if (sizeEl && sizeEl.clientHeight) {
767
+ rowHeightStore[sizeKey] = sizeEl.clientHeight
768
+ }
769
+ }
770
+
755
771
  function computeRowHeight ($xeTable: VxeTableConstructor) {
756
772
  const reactData = $xeTable as unknown as TableReactData
757
773
 
@@ -787,8 +803,9 @@ function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: n
787
803
  const reactData = $xeTable as unknown as TableReactData
788
804
  const internalData = $xeTable as unknown as TableInternalData
789
805
 
790
- const { isAllOverflow } = reactData
806
+ const { isAllOverflow, expandColumn, rowExpandedMaps } = reactData
791
807
  const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
808
+ const expandOpts = $xeTable.computeExpandOpts
792
809
  const rowOpts = $xeTable.computeRowOpts
793
810
  const cellOpts = $xeTable.computeCellOpts
794
811
  const defaultRowHeight = $xeTable.computeDefaultRowHeight
@@ -801,7 +818,7 @@ function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: n
801
818
  let offsetTop = 0
802
819
  let visibleSize = 0
803
820
  const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
804
- if (!isCustomCellHeight && isAllOverflow) {
821
+ if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
805
822
  toVisibleIndex = Math.floor(scrollTop / defaultRowHeight)
806
823
  visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1
807
824
  } else {
@@ -819,6 +836,10 @@ function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: n
819
836
  break
820
837
  }
821
838
  }
839
+ // 是否展开行
840
+ if (expandColumn && rowExpandedMaps[rowid]) {
841
+ offsetTop += rowRest.expandHeight || expandOpts.height || 0
842
+ }
822
843
  }
823
844
  }
824
845
  return { toVisibleIndex: Math.max(0, toVisibleIndex), visibleSize: Math.max(6, visibleSize) }
@@ -1459,9 +1480,18 @@ function handleRecalculateLayout ($xeTable: VxeTableConstructor & VxeTablePrivat
1459
1480
  if (!el || !el.clientWidth) {
1460
1481
  return $xeTable.$nextTick()
1461
1482
  }
1483
+ const varEl = $xeTable.$refs.refVarElem as HTMLDivElement
1484
+ if (varEl) {
1485
+ const [defEl, mediumEl, smallEl, miniEl] = varEl.children
1486
+ calcVarRowHeightConfig($xeTable, 'default', defEl)
1487
+ calcVarRowHeightConfig($xeTable, 'medium', mediumEl)
1488
+ calcVarRowHeightConfig($xeTable, 'small', smallEl)
1489
+ calcVarRowHeightConfig($xeTable, 'mini', miniEl)
1490
+ }
1462
1491
  calcCellWidth($xeTable)
1463
1492
  autoCellWidth($xeTable)
1464
1493
  updateStyle($xeTable)
1494
+ updateRowExpandStyle($xeTable)
1465
1495
  return computeScrollLoad($xeTable).then(() => {
1466
1496
  if (reFull === true) {
1467
1497
  // 初始化时需要在列计算之后再执行优化运算,达到最优显示效果
@@ -1469,6 +1499,7 @@ function handleRecalculateLayout ($xeTable: VxeTableConstructor & VxeTablePrivat
1469
1499
  calcCellWidth($xeTable)
1470
1500
  autoCellWidth($xeTable)
1471
1501
  updateStyle($xeTable)
1502
+ updateRowExpandStyle($xeTable)
1472
1503
  return computeScrollLoad($xeTable)
1473
1504
  }
1474
1505
  })
@@ -1907,7 +1938,7 @@ function calcCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
1907
1938
  }
1908
1939
  }
1909
1940
 
1910
- const handleUpdateColResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
1941
+ function handleUpdateColResize ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) {
1911
1942
  $xeTable.analyColumnWidth()
1912
1943
  $xeTable.recalculate(true).then(() => {
1913
1944
  $xeTable.saveCustomStore('update:width')
@@ -1919,7 +1950,7 @@ const handleUpdateColResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMe
1919
1950
  })
1920
1951
  }
1921
1952
 
1922
- const handleUpdateRowResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
1953
+ function handleUpdateRowResize ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) {
1923
1954
  const reactData = $xeTable as unknown as TableReactData
1924
1955
 
1925
1956
  reactData.resizeHeightFlag++
@@ -1930,6 +1961,65 @@ const handleUpdateRowResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMe
1930
1961
  })
1931
1962
  }
1932
1963
 
1964
+ function updateRowExpandStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
1965
+ const reactData = $xeTable as unknown as TableReactData
1966
+ const internalData = $xeTable as unknown as TableInternalData
1967
+
1968
+ const { expandColumn, scrollYLoad, rowExpandedMaps } = reactData
1969
+ const expandOpts = $xeTable.computeExpandOpts
1970
+ const rowOpts = $xeTable.computeRowOpts
1971
+ const cellOpts = $xeTable.computeCellOpts
1972
+ const defaultRowHeight = $xeTable.computeDefaultRowHeight
1973
+ const { mode } = expandOpts
1974
+ if (expandColumn && mode === 'fixed') {
1975
+ const { elemStore, afterFullData, fullAllDataRowIdData } = internalData
1976
+ const rowExpandEl = $xeTable.$refs.refRowExpandElem as HTMLDivElement
1977
+ const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
1978
+ if (rowExpandEl && bodyScrollElem) {
1979
+ let isUpdateHeight = false
1980
+ if (scrollYLoad) {
1981
+ let offsetTop = 0
1982
+ for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
1983
+ const row = afterFullData[rIndex]
1984
+ const rowid = getRowid($xeTable, row)
1985
+ const rowRest = fullAllDataRowIdData[rowid] || {}
1986
+ rowRest.oTop = offsetTop
1987
+ offsetTop += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
1988
+ // 是否展开行
1989
+ if (expandColumn && rowExpandedMaps[rowid]) {
1990
+ offsetTop += rowRest.expandHeight || expandOpts.height || 0
1991
+ }
1992
+ }
1993
+ }
1994
+ XEUtils.arrayEach(rowExpandEl.children, reEl => {
1995
+ const expandEl = reEl as HTMLDivElement
1996
+ const rowid = expandEl.getAttribute('rowid') || ''
1997
+ const rowRest = fullAllDataRowIdData[rowid]
1998
+ if (rowRest) {
1999
+ const expandHeight = expandEl.offsetHeight + 1
2000
+ if (scrollYLoad) {
2001
+ expandEl.style.top = toCssUnit(rowRest.oTop + (rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight))
2002
+ } else {
2003
+ const trEl = bodyScrollElem.querySelector(`.vxe-body--row[rowid="${rowid}"]`) as HTMLTableCellElement
2004
+ if (trEl) {
2005
+ expandEl.style.top = toCssUnit(trEl.offsetTop + trEl.offsetHeight)
2006
+ }
2007
+ }
2008
+ if (!isUpdateHeight) {
2009
+ if (rowRest.expandHeight !== expandHeight) {
2010
+ isUpdateHeight = true
2011
+ }
2012
+ }
2013
+ rowRest.expandHeight = expandHeight
2014
+ }
2015
+ })
2016
+ if (isUpdateHeight) {
2017
+ reactData.rowExpandHeightFlag++
2018
+ }
2019
+ }
2020
+ }
2021
+ }
2022
+
1933
2023
  const Methods = {
1934
2024
  callSlot (slotFunc: any, params: any, h: any, vNodes: any) {
1935
2025
  if (slotFunc) {
@@ -2313,7 +2403,7 @@ const Methods = {
2313
2403
  }
2314
2404
  let cacheItem = fullAllDataRowIdData[rowid]
2315
2405
  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 }
2406
+ cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
2317
2407
  }
2318
2408
  cacheItem.row = row
2319
2409
  cacheItem.items = items
@@ -2386,7 +2476,7 @@ const Methods = {
2386
2476
  XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
2387
2477
  const rowid = getRowid($xeTable, childRow)
2388
2478
  const parentRow = parentItem || parentRest.row
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 }
2479
+ 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, expandHeight: 0 }
2390
2480
  fullDataRowIdData[rowid] = rest
2391
2481
  fullAllDataRowIdData[rowid] = rest
2392
2482
  }, { children: childrenField })
@@ -4226,6 +4316,7 @@ const Methods = {
4226
4316
  const el = $xeTable.$refs.refElem as HTMLElement
4227
4317
  if (el && el.clientWidth) {
4228
4318
  autoCellWidth($xeTable)
4319
+ updateRowExpandStyle($xeTable)
4229
4320
  }
4230
4321
  if (rceTimeout) {
4231
4322
  clearTimeout(rceTimeout)
@@ -7919,6 +8010,7 @@ const Methods = {
7919
8010
  direction,
7920
8011
  ...params
7921
8012
  }
8013
+ updateRowExpandStyle($xeTable)
7922
8014
  checkLastSyncScroll($xeTable, isRollX, isRollY)
7923
8015
  if (rowOpts.isHover || highlightHoverRow) {
7924
8016
  $xeTable.clearHoverRow()
@@ -7974,6 +8066,7 @@ const Methods = {
7974
8066
  const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
7975
8067
  const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
7976
8068
  const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
8069
+ const rowExpandEl = $xeTable.$refs.refRowExpandElem as HTMLDivElement
7977
8070
  if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
7978
8071
  return
7979
8072
  }
@@ -8020,6 +8113,7 @@ const Methods = {
8020
8113
  setScrollTop(rightScrollElem, scrollTop)
8021
8114
  }
8022
8115
  setScrollTop(yHandleEl, scrollTop)
8116
+ setScrollTop(rowExpandEl, scrollTop)
8023
8117
  if (scrollYLoad) {
8024
8118
  $xeTable.triggerScrollYEvent(evnt)
8025
8119
  }
@@ -8142,6 +8236,7 @@ const Methods = {
8142
8236
  const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
8143
8237
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
8144
8238
  const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
8239
+ const rowExpandEl = $xeTable.$refs.refRowExpandElem as HTMLDivElement
8145
8240
 
8146
8241
  if (!xHandleEl) {
8147
8242
  return
@@ -8183,6 +8278,7 @@ const Methods = {
8183
8278
  setScrollTop(bodyScrollElem, currTopNum)
8184
8279
  setScrollTop(leftScrollElem, currTopNum)
8185
8280
  setScrollTop(rightScrollElem, currTopNum)
8281
+ setScrollTop(rowExpandEl, currTopNum)
8186
8282
  if (scrollYLoad) {
8187
8283
  $xeTable.triggerScrollYEvent(evnt)
8188
8284
  }
@@ -8191,18 +8287,6 @@ const Methods = {
8191
8287
  fixed: ''
8192
8288
  })
8193
8289
  })
8194
-
8195
- // internalData.inWheelScroll = true
8196
- // setScrollTop(yHandleEl, scrollTop)
8197
- // setScrollTop(bodyScrollElem, scrollTop)
8198
- // setScrollTop(leftScrollElem, scrollTop)
8199
- // setScrollTop(rightScrollElem, scrollTop)
8200
-
8201
- // loadScrollYData($xeTable, scrollTop)
8202
- // $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
8203
- // type: 'footer',
8204
- // fixed: ''
8205
- // })
8206
8290
  }
8207
8291
  },
8208
8292
  triggerVirtualScrollXEvent (evnt: Event) {
@@ -8260,6 +8344,7 @@ const Methods = {
8260
8344
  const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
8261
8345
  const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
8262
8346
  const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
8347
+ const rowExpandEl = $xeTable.$refs.refRowExpandElem as HTMLDivElement
8263
8348
  const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
8264
8349
  const wrapperEl = evnt.currentTarget as HTMLDivElement
8265
8350
  const { scrollTop } = wrapperEl
@@ -8275,6 +8360,7 @@ const Methods = {
8275
8360
  setScrollTop(bodyScrollElem, scrollTop)
8276
8361
  setScrollTop(leftScrollElem, scrollTop)
8277
8362
  setScrollTop(rightScrollElem, scrollTop)
8363
+ setScrollTop(rowExpandEl, scrollTop)
8278
8364
  if (scrollYLoad) {
8279
8365
  $xeTable.triggerScrollYEvent(evnt)
8280
8366
  }
@@ -8289,6 +8375,7 @@ const Methods = {
8289
8375
 
8290
8376
  const { isAllOverflow } = reactData
8291
8377
  handleTableColumn($xeTable)
8378
+ $xeTable.updateScrollXSpace()
8292
8379
  return $xeTable.$nextTick().then(() => {
8293
8380
  handleTableColumn($xeTable)
8294
8381
  $xeTable.updateScrollXSpace()
@@ -8350,6 +8437,7 @@ const Methods = {
8350
8437
  const $xeTable = this
8351
8438
 
8352
8439
  $xeTable.handleTableData()
8440
+ $xeTable.updateScrollYSpace()
8353
8441
  return $xeTable.$nextTick().then(() => {
8354
8442
  $xeTable.handleTableData()
8355
8443
  $xeTable.updateScrollYSpace()
@@ -8361,9 +8449,10 @@ const Methods = {
8361
8449
  const reactData = $xeTable as unknown as TableReactData
8362
8450
  const internalData = $xeTable as unknown as TableInternalData
8363
8451
 
8364
- const { isAllOverflow, scrollYLoad } = reactData
8452
+ const { isAllOverflow, scrollYLoad, expandColumn, rowExpandedMaps } = reactData
8365
8453
  const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
8366
8454
  const { startIndex } = scrollYStore
8455
+ const expandOpts = $xeTable.computeExpandOpts
8367
8456
  const rowOpts = $xeTable.computeRowOpts
8368
8457
  const cellOpts = $xeTable.computeCellOpts
8369
8458
  const defaultRowHeight = $xeTable.computeDefaultRowHeight
@@ -8374,7 +8463,7 @@ const Methods = {
8374
8463
 
8375
8464
  if (scrollYLoad) {
8376
8465
  const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
8377
- if (!isCustomCellHeight && isAllOverflow) {
8466
+ if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
8378
8467
  ySpaceHeight = afterFullData.length * defaultRowHeight
8379
8468
  topSpaceHeight = Math.max(0, startIndex * defaultRowHeight)
8380
8469
  } else {
@@ -8383,12 +8472,20 @@ const Methods = {
8383
8472
  const rowid = getRowid($xeTable, row)
8384
8473
  const rowRest = fullAllDataRowIdData[rowid] || {}
8385
8474
  ySpaceHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
8475
+ // 是否展开行
8476
+ if (expandColumn && rowExpandedMaps[rowid]) {
8477
+ ySpaceHeight += rowRest.expandHeight || expandOpts.height || 0
8478
+ }
8386
8479
  }
8387
8480
  for (let i = 0; i < startIndex; i++) {
8388
8481
  const row = afterFullData[i]
8389
8482
  const rowid = getRowid($xeTable, row)
8390
8483
  const rowRest = fullAllDataRowIdData[rowid] || {}
8391
8484
  topSpaceHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
8485
+ // 是否展开行
8486
+ if (expandColumn && rowExpandedMaps[rowid]) {
8487
+ topSpaceHeight += rowRest.expandHeight || expandOpts.height || 0
8488
+ }
8392
8489
  }
8393
8490
  }
8394
8491
  } else {
@@ -8413,6 +8510,10 @@ const Methods = {
8413
8510
  if (scrollYSpaceEl) {
8414
8511
  scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
8415
8512
  }
8513
+ const rowExpandYSpaceEl = $xeTable.$refs.refRowExpandYSpaceElem as HTMLDivElement
8514
+ if (rowExpandYSpaceEl) {
8515
+ rowExpandYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
8516
+ }
8416
8517
  return $xeTable.$nextTick().then(() => {
8417
8518
  updateStyle($xeTable)
8418
8519
  })