vxe-table 3.12.10-beta.8 → 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.
- package/es/index.css +1 -1
- package/es/index.min.css +1 -1
- package/es/locale/lang/ar-EG.js +2 -1
- package/es/locale/lang/de-DE.js +2 -1
- package/es/locale/lang/en-US.js +4 -3
- package/es/locale/lang/es-ES.js +2 -1
- package/es/locale/lang/fr-FR.js +2 -1
- package/es/locale/lang/hu-HU.js +2 -1
- package/es/locale/lang/hy-AM.js +2 -1
- package/es/locale/lang/it-IT.js +2 -1
- package/es/locale/lang/ja-JP.js +2 -1
- package/es/locale/lang/ko-KR.js +2 -1
- package/es/locale/lang/nb-NO.js +2 -1
- package/es/locale/lang/pt-BR.js +2 -1
- package/es/locale/lang/ru-RU.js +4 -3
- package/es/locale/lang/th-TH.js +2 -1
- package/es/locale/lang/ug-CN.js +2 -1
- package/es/locale/lang/uk-UA.js +518 -517
- package/es/locale/lang/vi-VN.js +2 -1
- package/es/locale/lang/zh-CHT.js +2 -1
- package/es/locale/lang/zh-CN.js +2 -1
- package/es/style.css +1 -1
- package/es/style.min.css +1 -1
- package/es/table/module/edit/mixin.js +7 -7
- package/es/table/module/export/mixin.js +105 -69
- package/es/table/module/keyboard/mixin.js +68 -25
- package/es/table/module/menu/mixin.js +3 -1
- package/es/table/src/body.js +135 -83
- package/es/table/src/cell.js +43 -57
- package/es/table/src/column.js +43 -8
- package/es/table/src/columnInfo.js +3 -0
- package/es/table/src/footer.js +50 -9
- package/es/table/src/header.js +70 -168
- package/es/table/src/methods.js +985 -502
- package/es/table/src/props.js +14 -4
- package/es/table/src/table.js +114 -33
- package/es/table/src/util.js +73 -57
- package/es/table/style.css +253 -189
- package/es/table/style.min.css +1 -1
- package/es/ui/index.js +26 -10
- package/es/ui/src/log.js +1 -1
- package/es/vxe-table/style.css +253 -189
- package/es/vxe-table/style.min.css +1 -1
- package/lib/index.css +1 -1
- package/lib/index.min.css +1 -1
- package/lib/index.umd.js +1782 -1056
- package/lib/index.umd.min.js +1 -1
- package/lib/locale/lang/ar-EG.js +2 -1
- package/lib/locale/lang/ar-EG.min.js +1 -1
- package/lib/locale/lang/de-DE.js +2 -1
- package/lib/locale/lang/de-DE.min.js +1 -1
- package/lib/locale/lang/en-US.js +4 -3
- package/lib/locale/lang/en-US.min.js +1 -1
- package/lib/locale/lang/en-US.umd.js +4 -3
- package/lib/locale/lang/es-ES.js +2 -1
- package/lib/locale/lang/es-ES.min.js +1 -1
- package/lib/locale/lang/es-ES.umd.js +2 -1
- package/lib/locale/lang/fr-FR.js +2 -1
- package/lib/locale/lang/fr-FR.min.js +1 -1
- package/lib/locale/lang/hu-HU.js +2 -1
- package/lib/locale/lang/hu-HU.min.js +1 -1
- package/lib/locale/lang/hu-HU.umd.js +2 -1
- package/lib/locale/lang/hy-AM.js +2 -1
- package/lib/locale/lang/hy-AM.min.js +1 -1
- package/lib/locale/lang/it-IT.js +2 -1
- package/lib/locale/lang/it-IT.min.js +1 -1
- package/lib/locale/lang/ja-JP.js +2 -1
- package/lib/locale/lang/ja-JP.min.js +1 -1
- package/lib/locale/lang/ja-JP.umd.js +2 -1
- package/lib/locale/lang/ko-KR.js +2 -1
- package/lib/locale/lang/ko-KR.min.js +1 -1
- package/lib/locale/lang/ko-KR.umd.js +2 -1
- package/lib/locale/lang/nb-NO.js +2 -1
- package/lib/locale/lang/nb-NO.min.js +1 -1
- package/lib/locale/lang/pt-BR.js +2 -1
- package/lib/locale/lang/pt-BR.min.js +1 -1
- package/lib/locale/lang/pt-BR.umd.js +2 -1
- package/lib/locale/lang/ru-RU.js +4 -3
- package/lib/locale/lang/ru-RU.min.js +1 -1
- package/lib/locale/lang/ru-RU.umd.js +4 -3
- package/lib/locale/lang/th-TH.js +2 -1
- package/lib/locale/lang/th-TH.min.js +1 -1
- package/lib/locale/lang/ug-CN.js +2 -1
- package/lib/locale/lang/ug-CN.min.js +1 -1
- package/lib/locale/lang/uk-UA.js +518 -517
- package/lib/locale/lang/uk-UA.min.js +1 -1
- package/lib/locale/lang/uk-UA.umd.js +518 -517
- package/lib/locale/lang/vi-VN.js +2 -1
- package/lib/locale/lang/vi-VN.min.js +1 -1
- package/lib/locale/lang/zh-CHT.js +2 -1
- package/lib/locale/lang/zh-CHT.min.js +1 -1
- package/lib/locale/lang/zh-CHT.umd.js +2 -1
- package/lib/locale/lang/zh-CN.js +2 -1
- package/lib/locale/lang/zh-CN.min.js +1 -1
- package/lib/locale/lang/zh-CN.umd.js +2 -1
- package/lib/style.css +1 -1
- package/lib/style.min.css +1 -1
- package/lib/table/module/edit/mixin.js +7 -2
- package/lib/table/module/edit/mixin.min.js +1 -1
- package/lib/table/module/export/mixin.js +105 -64
- package/lib/table/module/export/mixin.min.js +1 -1
- package/lib/table/module/keyboard/mixin.js +73 -27
- package/lib/table/module/keyboard/mixin.min.js +1 -1
- package/lib/table/module/menu/mixin.js +3 -1
- package/lib/table/src/body.js +132 -79
- package/lib/table/src/body.min.js +1 -1
- package/lib/table/src/cell.js +32 -42
- package/lib/table/src/cell.min.js +1 -1
- package/lib/table/src/column.js +12 -0
- package/lib/table/src/column.min.js +1 -1
- package/lib/table/src/columnInfo.js +3 -0
- package/lib/table/src/columnInfo.min.js +1 -1
- package/lib/table/src/footer.js +46 -7
- package/lib/table/src/footer.min.js +1 -1
- package/lib/table/src/header.js +52 -175
- package/lib/table/src/header.min.js +1 -1
- package/lib/table/src/methods.js +1096 -560
- package/lib/table/src/methods.min.js +1 -1
- package/lib/table/src/props.js +14 -4
- package/lib/table/src/props.min.js +1 -1
- package/lib/table/src/table.js +113 -36
- package/lib/table/src/table.min.js +1 -1
- package/lib/table/src/util.js +87 -70
- package/lib/table/src/util.min.js +1 -1
- package/lib/table/style/style.css +253 -189
- package/lib/table/style/style.min.css +1 -1
- package/lib/ui/index.js +26 -10
- package/lib/ui/index.min.js +1 -1
- package/lib/ui/src/log.js +1 -1
- package/lib/ui/src/log.min.js +1 -1
- package/lib/vxe-table/style/style.css +253 -189
- package/lib/vxe-table/style/style.min.css +1 -1
- package/package.json +2 -2
- package/packages/locale/lang/ar-EG.ts +2 -1
- package/packages/locale/lang/de-DE.ts +2 -1
- package/packages/locale/lang/en-US.ts +4 -3
- package/packages/locale/lang/es-ES.ts +2 -1
- package/packages/locale/lang/fr-FR.ts +2 -1
- package/packages/locale/lang/hu-HU.ts +2 -1
- package/packages/locale/lang/hy-AM.ts +2 -1
- package/packages/locale/lang/it-IT.ts +2 -1
- package/packages/locale/lang/ja-JP.ts +2 -1
- package/packages/locale/lang/ko-KR.ts +2 -1
- package/packages/locale/lang/nb-NO.ts +2 -1
- package/packages/locale/lang/pt-BR.ts +2 -1
- package/packages/locale/lang/ru-RU.ts +4 -3
- package/packages/locale/lang/th-TH.ts +2 -1
- package/packages/locale/lang/ug-CN.ts +2 -1
- package/packages/locale/lang/uk-UA.ts +518 -517
- package/packages/locale/lang/vi-VN.ts +2 -1
- package/packages/locale/lang/zh-CHT.ts +2 -1
- package/packages/locale/lang/zh-CN.ts +2 -1
- package/packages/table/module/edit/mixin.ts +7 -7
- package/packages/table/module/export/mixin.ts +138 -80
- package/packages/table/module/keyboard/mixin.ts +65 -24
- package/packages/table/module/menu/mixin.ts +4 -1
- package/packages/table/src/body.ts +148 -86
- package/packages/table/src/cell.ts +45 -67
- package/packages/table/src/column.ts +48 -10
- package/packages/table/src/columnInfo.ts +3 -0
- package/packages/table/src/footer.ts +53 -10
- package/packages/table/src/header.ts +70 -169
- package/packages/table/src/methods.ts +1031 -515
- package/packages/table/src/props.ts +16 -6
- package/packages/table/src/table.ts +124 -33
- package/packages/table/src/util.ts +82 -62
- package/packages/ui/index.ts +25 -9
- package/styles/components/table.scss +319 -271
- package/styles/theme/base.scss +4 -6
- package/styles/theme/dark.scss +1 -0
- package/styles/theme/light.scss +1 -0
- package/styles/variable.scss +1 -0
- /package/es/{iconfont.1736840896964.ttf → iconfont.1738985837413.ttf} +0 -0
- /package/es/{iconfont.1736840896964.woff → iconfont.1738985837413.woff} +0 -0
- /package/es/{iconfont.1736840896964.woff2 → iconfont.1738985837413.woff2} +0 -0
- /package/lib/{iconfont.1736840896964.ttf → iconfont.1738985837413.ttf} +0 -0
- /package/lib/{iconfont.1736840896964.woff → iconfont.1738985837413.woff} +0 -0
- /package/lib/{iconfont.1736840896964.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,
|
|
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 -
|
|
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 -
|
|
442
|
+
const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight
|
|
441
443
|
if (customMaxHeight) {
|
|
442
|
-
bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight -
|
|
444
|
+
bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight)
|
|
443
445
|
}
|
|
444
446
|
if (customHeight) {
|
|
445
|
-
bodyHeight = customHeight - headerHeight - footerHeight -
|
|
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 = `${
|
|
465
|
-
scrollXVirtualEl.style.visibility =
|
|
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 ? `${
|
|
470
|
-
xWrapperEl.style.width = `${el.clientWidth -
|
|
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 ? `${
|
|
474
|
-
xLeftCornerEl.style.display = scrollbarXToTop ? (
|
|
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 ? '' : `${
|
|
478
|
-
xRightCornerEl.style.display = scrollbarXToTop ? '' : (
|
|
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 = `${
|
|
485
|
+
scrollYVirtualEl.style.width = `${osbWidth}px`
|
|
484
486
|
scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`
|
|
485
|
-
scrollYVirtualEl.style.visibility =
|
|
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 +
|
|
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 ||
|
|
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 =
|
|
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 -
|
|
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) ?
|
|
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,53 +753,63 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
|
751
753
|
}
|
|
752
754
|
|
|
753
755
|
function computeRowHeight ($xeTable: VxeTableConstructor) {
|
|
756
|
+
const reactData = $xeTable as unknown as TableReactData
|
|
757
|
+
|
|
758
|
+
const { isAllOverflow } = reactData
|
|
754
759
|
const tableHeader = $xeTable.$refs.refTableHeader
|
|
755
760
|
const tableBody = $xeTable.$refs.refTableBody
|
|
756
761
|
const tableBodyElem = tableBody ? (tableBody as any).$el as HTMLDivElement : null
|
|
757
762
|
const defaultRowHeight = $xeTable.computeDefaultRowHeight
|
|
758
763
|
let rowHeight = 0
|
|
759
|
-
if (
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
firstTrElem
|
|
764
|
+
if (isAllOverflow) {
|
|
765
|
+
if (tableBodyElem) {
|
|
766
|
+
const tableHeaderElem = tableHeader ? (tableHeader as any).$el as HTMLDivElement : null
|
|
767
|
+
let firstTrElem
|
|
768
|
+
firstTrElem = tableBodyElem.querySelector('tr')
|
|
769
|
+
if (!firstTrElem && tableHeaderElem) {
|
|
770
|
+
firstTrElem = tableHeaderElem.querySelector('tr')
|
|
771
|
+
}
|
|
772
|
+
if (firstTrElem) {
|
|
773
|
+
rowHeight = firstTrElem.clientHeight
|
|
774
|
+
}
|
|
765
775
|
}
|
|
766
|
-
if (
|
|
767
|
-
rowHeight =
|
|
776
|
+
if (!rowHeight) {
|
|
777
|
+
rowHeight = defaultRowHeight
|
|
768
778
|
}
|
|
769
|
-
}
|
|
770
|
-
if (!rowHeight) {
|
|
779
|
+
} else {
|
|
771
780
|
rowHeight = defaultRowHeight
|
|
772
781
|
}
|
|
773
782
|
// 最低支持 18px 行高
|
|
774
783
|
return Math.max(18, rowHeight)
|
|
775
784
|
}
|
|
776
785
|
|
|
777
|
-
function handleVirtualYVisible ($xeTable: VxeTableConstructor) {
|
|
778
|
-
const props = $xeTable
|
|
786
|
+
function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: number) {
|
|
779
787
|
const reactData = $xeTable as unknown as TableReactData
|
|
780
788
|
const internalData = $xeTable as unknown as TableInternalData
|
|
781
789
|
|
|
782
|
-
const {
|
|
783
|
-
const {
|
|
784
|
-
const
|
|
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
|
|
785
795
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
|
|
786
796
|
if (bodyScrollElem) {
|
|
787
|
-
const
|
|
797
|
+
const clientHeight = bodyScrollElem.clientHeight
|
|
798
|
+
const scrollTop = XEUtils.isNumber(currScrollTop) ? currScrollTop : bodyScrollElem.scrollTop
|
|
788
799
|
const endHeight = scrollTop + clientHeight
|
|
789
800
|
let toVisibleIndex = -1
|
|
790
801
|
let offsetTop = 0
|
|
791
802
|
let visibleSize = 0
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
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
|
|
795
807
|
} else {
|
|
796
808
|
for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
|
|
797
809
|
const row = afterFullData[rIndex]
|
|
798
810
|
const rowid = getRowid($xeTable, row)
|
|
799
|
-
const rowRest = fullAllDataRowIdData[rowid]
|
|
800
|
-
offsetTop += rowRest
|
|
811
|
+
const rowRest = fullAllDataRowIdData[rowid] || {}
|
|
812
|
+
offsetTop += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
|
|
801
813
|
if (toVisibleIndex === -1 && scrollTop < offsetTop) {
|
|
802
814
|
toVisibleIndex = rIndex
|
|
803
815
|
}
|
|
@@ -1053,7 +1065,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
|
|
|
1053
1065
|
}
|
|
1054
1066
|
const tableHeight = bodyElem.offsetHeight
|
|
1055
1067
|
const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight
|
|
1056
|
-
reactData.scrollbarWidth =
|
|
1068
|
+
reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth)
|
|
1057
1069
|
reactData.overflowY = overflowY
|
|
1058
1070
|
internalData.tableWidth = tableWidth
|
|
1059
1071
|
internalData.tableHeight = tableHeight
|
|
@@ -1063,7 +1075,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
|
|
|
1063
1075
|
const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0
|
|
1064
1076
|
const overflowX = tableWidth > bodyWidth
|
|
1065
1077
|
const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0
|
|
1066
|
-
reactData.scrollbarHeight =
|
|
1078
|
+
reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight)
|
|
1067
1079
|
internalData.headerHeight = headerHeight
|
|
1068
1080
|
internalData.footerHeight = footerHeight
|
|
1069
1081
|
reactData.overflowX = overflowX
|
|
@@ -1074,64 +1086,38 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
|
|
|
1074
1086
|
}
|
|
1075
1087
|
}
|
|
1076
1088
|
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
// internalData.chTimeout = undefined
|
|
1090
|
-
// }, 80)
|
|
1091
|
-
// }
|
|
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
|
+
}
|
|
1092
1101
|
|
|
1093
1102
|
const calcCellHeight = ($xeTable: VxeTableConstructor) => {
|
|
1094
|
-
const props = $xeTable
|
|
1095
1103
|
const reactData = $xeTable as unknown as TableReactData
|
|
1096
1104
|
const internalData = $xeTable as unknown as TableInternalData
|
|
1097
1105
|
|
|
1098
|
-
const {
|
|
1099
|
-
const { tableData, scrollXLoad } = reactData
|
|
1106
|
+
const { tableData, isAllOverflow, scrollYLoad, scrollXLoad } = reactData
|
|
1100
1107
|
const { fullAllDataRowIdData } = internalData
|
|
1108
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight
|
|
1101
1109
|
const el = $xeTable.$refs.refElem as HTMLDivElement
|
|
1102
|
-
if (!
|
|
1103
|
-
let paddingTop = 0
|
|
1104
|
-
let paddingBottom = 0
|
|
1105
|
-
let calcPadding = false
|
|
1110
|
+
if (!isAllOverflow && scrollYLoad && el) {
|
|
1106
1111
|
tableData.forEach(row => {
|
|
1107
1112
|
const rowid = getRowid($xeTable, row)
|
|
1108
1113
|
const rowRest = fullAllDataRowIdData[rowid]
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
for (let i = 0; i < cellList.length; i++) {
|
|
1113
|
-
const cellElem = cellList[i] as HTMLElement
|
|
1114
|
-
const tdEl = cellElem.parentElement as HTMLTableCellElement
|
|
1115
|
-
if (!tdEl || !tdEl.clientWidth) {
|
|
1116
|
-
break
|
|
1117
|
-
}
|
|
1118
|
-
if (!calcPadding) {
|
|
1119
|
-
paddingTop = XEUtils.toNumber(getComputedStyle(tdEl).paddingTop)
|
|
1120
|
-
paddingBottom = XEUtils.toNumber(getComputedStyle(tdEl).paddingBottom)
|
|
1121
|
-
calcPadding = true
|
|
1122
|
-
}
|
|
1123
|
-
let cellHeight = paddingTop + paddingBottom
|
|
1124
|
-
if (cellElem) {
|
|
1125
|
-
cellHeight += cellElem.clientHeight
|
|
1126
|
-
}
|
|
1127
|
-
height = Math.max(height, cellHeight)
|
|
1128
|
-
}
|
|
1129
|
-
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)
|
|
1130
1117
|
}
|
|
1131
1118
|
})
|
|
1132
|
-
reactData.
|
|
1119
|
+
reactData.calcCellHeightFlag++
|
|
1133
1120
|
}
|
|
1134
|
-
// updateCellOffset()
|
|
1135
1121
|
}
|
|
1136
1122
|
|
|
1137
1123
|
function getOrderField (_vm: any, column: any) {
|
|
@@ -1154,6 +1140,20 @@ function getOrderField (_vm: any, column: any) {
|
|
|
1154
1140
|
}
|
|
1155
1141
|
}
|
|
1156
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
|
+
|
|
1157
1157
|
function clearDragStatus ($xeTable: any) {
|
|
1158
1158
|
const reactData = $xeTable
|
|
1159
1159
|
|
|
@@ -1261,9 +1261,11 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
|
|
|
1261
1261
|
if (!el) {
|
|
1262
1262
|
return
|
|
1263
1263
|
}
|
|
1264
|
-
const { scrollbarWidth, scrollbarHeight } = reactData
|
|
1264
|
+
const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
|
|
1265
1265
|
const { prevDragToChild } = internalData
|
|
1266
1266
|
const wrapperRect = el.getBoundingClientRect()
|
|
1267
|
+
const osbWidth = overflowY ? scrollbarWidth : 0
|
|
1268
|
+
const osbHeight = overflowX ? scrollbarHeight : 0
|
|
1267
1269
|
const tableWidth = el.clientWidth
|
|
1268
1270
|
const tableHeight = el.clientHeight
|
|
1269
1271
|
if (trEl) {
|
|
@@ -1274,14 +1276,14 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
|
|
|
1274
1276
|
const trRect = trEl.getBoundingClientRect()
|
|
1275
1277
|
let trHeight = trEl.clientHeight
|
|
1276
1278
|
const offsetTop = Math.max(1, trRect.y - wrapperRect.y)
|
|
1277
|
-
if (offsetTop + trHeight > tableHeight -
|
|
1278
|
-
trHeight = tableHeight - offsetTop -
|
|
1279
|
+
if (offsetTop + trHeight > tableHeight - osbHeight) {
|
|
1280
|
+
trHeight = tableHeight - offsetTop - osbHeight
|
|
1279
1281
|
}
|
|
1280
1282
|
rdLineEl.style.display = 'block'
|
|
1281
|
-
rdLineEl.style.left = `${scrollbarYToLeft ?
|
|
1283
|
+
rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
|
|
1282
1284
|
rdLineEl.style.top = `${offsetTop}px`
|
|
1283
1285
|
rdLineEl.style.height = `${trHeight}px`
|
|
1284
|
-
rdLineEl.style.width = `${tableWidth -
|
|
1286
|
+
rdLineEl.style.width = `${tableWidth - osbWidth}px`
|
|
1285
1287
|
rdLineEl.setAttribute('drag-pos', dragPos)
|
|
1286
1288
|
rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
|
|
1287
1289
|
} else {
|
|
@@ -1306,7 +1308,7 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
|
|
|
1306
1308
|
thWidth -= startX - offsetLeft
|
|
1307
1309
|
offsetLeft = startX
|
|
1308
1310
|
}
|
|
1309
|
-
const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 :
|
|
1311
|
+
const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth)
|
|
1310
1312
|
if (offsetLeft + thWidth > endX) {
|
|
1311
1313
|
thWidth = endX - offsetLeft
|
|
1312
1314
|
}
|
|
@@ -1317,7 +1319,7 @@ function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, ev
|
|
|
1317
1319
|
if (prevDragToChild) {
|
|
1318
1320
|
cdLineEl.style.height = `${thRect.height}px`
|
|
1319
1321
|
} else {
|
|
1320
|
-
cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 :
|
|
1322
|
+
cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`
|
|
1321
1323
|
}
|
|
1322
1324
|
cdLineEl.setAttribute('drag-pos', dragPos)
|
|
1323
1325
|
cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
|
|
@@ -1350,7 +1352,44 @@ function hideDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
|
1350
1352
|
}
|
|
1351
1353
|
}
|
|
1352
1354
|
|
|
1353
|
-
|
|
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) {
|
|
1354
1393
|
const internalData = $xeTable as unknown as TableInternalData
|
|
1355
1394
|
|
|
1356
1395
|
const { fullColumnIdData } = internalData
|
|
@@ -1369,13 +1408,13 @@ function computeScrollLoad ($xeTable: VxeTableConstructor & VxeTablePrivateMetho
|
|
|
1369
1408
|
return $xeTable.$nextTick().then(() => {
|
|
1370
1409
|
const { scrollXLoad, scrollYLoad } = reactData
|
|
1371
1410
|
const { scrollXStore, scrollYStore } = internalData
|
|
1372
|
-
const
|
|
1373
|
-
const
|
|
1411
|
+
const virtualYOpts = $xeTable.computeVirtualYOpts
|
|
1412
|
+
const virtualXOpts = $xeTable.computeVirtualXOpts
|
|
1374
1413
|
// 计算 X 逻辑
|
|
1375
1414
|
if (scrollXLoad) {
|
|
1376
1415
|
const { toVisibleIndex: toXVisibleIndex, visibleSize: visibleXSize } = handleVirtualXVisible($xeTable)
|
|
1377
|
-
const offsetXSize = Math.max(0,
|
|
1378
|
-
scrollXStore.preloadSize =
|
|
1416
|
+
const offsetXSize = Math.max(0, virtualXOpts.oSize ? XEUtils.toNumber(virtualXOpts.oSize) : 0)
|
|
1417
|
+
scrollXStore.preloadSize = XEUtils.toNumber(virtualXOpts.preSize)
|
|
1379
1418
|
scrollXStore.offsetSize = offsetXSize
|
|
1380
1419
|
scrollXStore.visibleSize = visibleXSize
|
|
1381
1420
|
scrollXStore.endIndex = Math.max(scrollXStore.startIndex + scrollXStore.visibleSize + offsetXSize, scrollXStore.endIndex)
|
|
@@ -1387,15 +1426,14 @@ function computeScrollLoad ($xeTable: VxeTableConstructor & VxeTablePrivateMetho
|
|
|
1387
1426
|
} else {
|
|
1388
1427
|
$xeTable.updateScrollXSpace()
|
|
1389
1428
|
}
|
|
1390
|
-
calcCellHeight($xeTable)
|
|
1391
1429
|
// 计算 Y 逻辑
|
|
1392
1430
|
const rowHeight = computeRowHeight($xeTable)
|
|
1393
1431
|
;(scrollYStore as any).rowHeight = rowHeight
|
|
1394
1432
|
reactData.rowHeight = rowHeight
|
|
1395
1433
|
const { toVisibleIndex: toYVisibleIndex, visibleSize: visibleYSize } = handleVirtualYVisible($xeTable)
|
|
1396
1434
|
if (scrollYLoad) {
|
|
1397
|
-
const offsetYSize = Math.max(0,
|
|
1398
|
-
scrollYStore.preloadSize =
|
|
1435
|
+
const offsetYSize = Math.max(0, virtualYOpts.oSize ? XEUtils.toNumber(virtualYOpts.oSize) : 0)
|
|
1436
|
+
scrollYStore.preloadSize = XEUtils.toNumber(virtualYOpts.preSize)
|
|
1399
1437
|
scrollYStore.offsetSize = offsetYSize
|
|
1400
1438
|
scrollYStore.visibleSize = visibleYSize
|
|
1401
1439
|
scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex)
|
|
@@ -1646,13 +1684,12 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
|
|
|
1646
1684
|
internalData.collectColumn = collectColumn
|
|
1647
1685
|
const tableFullColumn = getColumnList(collectColumn)
|
|
1648
1686
|
internalData.tableFullColumn = tableFullColumn
|
|
1649
|
-
reactData.
|
|
1687
|
+
reactData.isColLoading = true
|
|
1650
1688
|
reactData.isDragColMove = false
|
|
1651
1689
|
initColumnSort($xeTable)
|
|
1652
1690
|
return Promise.resolve(
|
|
1653
1691
|
restoreCustomStorage($xeTable)
|
|
1654
1692
|
).then(() => {
|
|
1655
|
-
reactData.isLoading = false
|
|
1656
1693
|
cacheColumnMap($xeTable)
|
|
1657
1694
|
parseColumns($xeTable, true).then(() => {
|
|
1658
1695
|
if (reactData.scrollXLoad) {
|
|
@@ -1677,6 +1714,7 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
|
|
|
1677
1714
|
if ($xeTable.handleUpdateCustomColumn) {
|
|
1678
1715
|
$xeTable.handleUpdateCustomColumn()
|
|
1679
1716
|
}
|
|
1717
|
+
reactData.isColLoading = false
|
|
1680
1718
|
return $xeTable.recalculate()
|
|
1681
1719
|
})
|
|
1682
1720
|
})
|
|
@@ -1685,17 +1723,15 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
|
|
|
1685
1723
|
/**
|
|
1686
1724
|
* 纵向 Y 可视渲染处理
|
|
1687
1725
|
*/
|
|
1688
|
-
function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
1689
|
-
const props = $xeTable
|
|
1726
|
+
function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, scrollTop?: number) {
|
|
1690
1727
|
const reactData = $xeTable as unknown as TableReactData
|
|
1691
1728
|
const internalData = $xeTable as unknown as TableInternalData
|
|
1692
1729
|
|
|
1693
|
-
const {
|
|
1694
|
-
const { mergeList } = reactData
|
|
1730
|
+
const { mergeList, isAllOverflow } = reactData
|
|
1695
1731
|
const { scrollYStore } = internalData
|
|
1696
1732
|
const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore
|
|
1697
|
-
const autoOffsetYSize =
|
|
1698
|
-
const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable)
|
|
1733
|
+
const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1
|
|
1734
|
+
const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable, scrollTop)
|
|
1699
1735
|
const offsetItem = {
|
|
1700
1736
|
startIndex: Math.max(0, toVisibleIndex - 1 - offsetSize - preloadSize),
|
|
1701
1737
|
endIndex: toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize
|
|
@@ -1713,6 +1749,46 @@ function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods
|
|
|
1713
1749
|
}
|
|
1714
1750
|
}
|
|
1715
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
|
+
|
|
1716
1792
|
function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isRollX: boolean, isRollY: boolean) {
|
|
1717
1793
|
const reactData = $xeTable as unknown as TableReactData
|
|
1718
1794
|
const internalData = $xeTable as unknown as TableInternalData
|
|
@@ -1725,28 +1801,66 @@ function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMet
|
|
|
1725
1801
|
internalData.lcsTimeout = setTimeout(() => {
|
|
1726
1802
|
internalData.lcsRunTime = Date.now()
|
|
1727
1803
|
internalData.lcsTimeout = undefined
|
|
1804
|
+
internalData.intoRunScroll = false
|
|
1728
1805
|
internalData.inVirtualScroll = false
|
|
1729
1806
|
internalData.inWheelScroll = false
|
|
1730
1807
|
internalData.inHeaderScroll = false
|
|
1731
1808
|
internalData.inBodyScroll = false
|
|
1732
1809
|
internalData.inFooterScroll = false
|
|
1733
1810
|
internalData.scrollRenderType = ''
|
|
1811
|
+
calcCellHeight($xeTable)
|
|
1734
1812
|
if (isRollX && scrollXLoad) {
|
|
1735
|
-
$xeTable.updateScrollXData()
|
|
1736
|
-
calcCellHeight($xeTable)
|
|
1737
|
-
loadScrollXData($xeTable)
|
|
1738
|
-
})
|
|
1813
|
+
$xeTable.updateScrollXData()
|
|
1739
1814
|
}
|
|
1740
1815
|
if (isRollY && scrollYLoad) {
|
|
1741
1816
|
$xeTable.updateScrollYData().then(() => {
|
|
1742
1817
|
calcCellHeight($xeTable)
|
|
1743
|
-
|
|
1818
|
+
$xeTable.updateScrollYSpace()
|
|
1744
1819
|
})
|
|
1745
1820
|
}
|
|
1746
1821
|
$xeTable.updateCellAreas()
|
|
1747
1822
|
}, 200)
|
|
1748
1823
|
}
|
|
1749
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
|
+
|
|
1750
1864
|
function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
1751
1865
|
const internalData = $xeTable as unknown as TableInternalData
|
|
1752
1866
|
|
|
@@ -1756,57 +1870,63 @@ function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
|
1756
1870
|
}
|
|
1757
1871
|
|
|
1758
1872
|
function calcColumnAutoWidth (column: VxeTableDefines.ColumnInfo, wrapperEl: HTMLDivElement) {
|
|
1759
|
-
const
|
|
1760
|
-
|
|
1761
|
-
|
|
1762
|
-
if (firstCellEl) {
|
|
1763
|
-
const cellStyle = getComputedStyle(firstCellEl)
|
|
1764
|
-
|
|
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))
|
|
1765
1879
|
}
|
|
1766
|
-
let colWidth = column.renderAutoWidth -
|
|
1767
|
-
|
|
1768
|
-
const
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
XEUtils.arrayEach(cellEl.children, (btnEl) => {
|
|
1773
|
-
titleWidth += (btnEl as HTMLElement).offsetWidth + 1
|
|
1774
|
-
})
|
|
1775
|
-
} else {
|
|
1776
|
-
const labelEl = cellEl.firstElementChild as HTMLElement
|
|
1777
|
-
if (labelEl) {
|
|
1778
|
-
titleWidth = labelEl.offsetWidth
|
|
1779
|
-
}
|
|
1780
|
-
}
|
|
1781
|
-
if (titleWidth) {
|
|
1782
|
-
colWidth = Math.max(colWidth, Math.ceil(titleWidth) + 4)
|
|
1783
|
-
}
|
|
1784
|
-
})
|
|
1785
|
-
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
|
|
1786
1886
|
}
|
|
1787
1887
|
|
|
1788
1888
|
function calcCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
|
|
1789
|
-
const reactData = $xeTable as unknown as TableReactData
|
|
1790
1889
|
const internalData = $xeTable as unknown as TableInternalData
|
|
1791
1890
|
|
|
1792
1891
|
const autoWidthColumnList = $xeTable.computeAutoWidthColumnList
|
|
1793
|
-
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
|
|
1799
|
-
|
|
1800
|
-
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
|
|
1809
|
-
|
|
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)
|
|
1810
1930
|
})
|
|
1811
1931
|
}
|
|
1812
1932
|
|
|
@@ -1863,7 +1983,7 @@ const Methods = {
|
|
|
1863
1983
|
warnLog('vxe.error.delFunc', ['syncData', 'getData'])
|
|
1864
1984
|
return this.$nextTick().then(() => {
|
|
1865
1985
|
this.tableData = []
|
|
1866
|
-
return this.$nextTick().then(() => this.loadTableData(this.tableFullData))
|
|
1986
|
+
return this.$nextTick().then(() => this.loadTableData(this.tableFullData, true))
|
|
1867
1987
|
})
|
|
1868
1988
|
},
|
|
1869
1989
|
/**
|
|
@@ -1918,12 +2038,13 @@ const Methods = {
|
|
|
1918
2038
|
* 加载表格数据
|
|
1919
2039
|
* @param {Array} datas 数据
|
|
1920
2040
|
*/
|
|
1921
|
-
loadTableData (datas: any) {
|
|
1922
|
-
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
|
|
1923
2045
|
|
|
1924
|
-
const { keepSource,
|
|
2046
|
+
const { keepSource, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this
|
|
1925
2047
|
const childrenField = treeOpts.children || treeOpts.childrenField
|
|
1926
|
-
const rowOpts = $xeTable.computeRowOpts
|
|
1927
2048
|
let treeData = []
|
|
1928
2049
|
let fullData = datas ? datas.slice(0) : []
|
|
1929
2050
|
if (treeConfig) {
|
|
@@ -1966,43 +2087,30 @@ const Methods = {
|
|
|
1966
2087
|
scrollYStore.endIndex = 1
|
|
1967
2088
|
scrollXStore.startIndex = 0
|
|
1968
2089
|
scrollXStore.endIndex = 1
|
|
2090
|
+
reactData.isRowLoading = true
|
|
2091
|
+
reactData.scrollVMLoading = false
|
|
1969
2092
|
editStore.insertMaps = {}
|
|
1970
|
-
editStore.removeList = []
|
|
1971
2093
|
editStore.removeMaps = {}
|
|
1972
2094
|
const sYLoad = updateScrollYStatus($xeTable, fullData)
|
|
1973
|
-
|
|
2095
|
+
reactData.isDragColMove = false
|
|
2096
|
+
reactData.isDragRowMove = false
|
|
1974
2097
|
// 全量数据
|
|
1975
|
-
|
|
1976
|
-
|
|
2098
|
+
internalData.tableFullData = fullData
|
|
2099
|
+
internalData.tableFullTreeData = treeData
|
|
1977
2100
|
// 缓存数据
|
|
1978
|
-
|
|
2101
|
+
$xeTable.cacheRowMap(true, isReset)
|
|
1979
2102
|
// 原始数据
|
|
1980
|
-
|
|
2103
|
+
internalData.tableSynchData = datas
|
|
2104
|
+
if (isReset) {
|
|
2105
|
+
internalData.isResizeCellHeight = false
|
|
2106
|
+
reactData.rowExpandedMaps = {}
|
|
2107
|
+
reactData.rowExpandLazyLoadedMaps = {}
|
|
2108
|
+
reactData.treeExpandedMaps = {}
|
|
2109
|
+
reactData.treeExpandLazyLoadedMaps = {}
|
|
2110
|
+
}
|
|
1981
2111
|
// 克隆原数据,用于显示编辑状态,与编辑值做对比
|
|
1982
2112
|
if (keepSource) {
|
|
1983
|
-
|
|
1984
|
-
}
|
|
1985
|
-
if (sYLoad) {
|
|
1986
|
-
if (showOverflow) {
|
|
1987
|
-
if (!rowOpts.height) {
|
|
1988
|
-
const errColumn = this.tableFullColumn.find((column: any) => column.showOverflow === false)
|
|
1989
|
-
if (errColumn) {
|
|
1990
|
-
errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
|
|
1991
|
-
}
|
|
1992
|
-
}
|
|
1993
|
-
}
|
|
1994
|
-
|
|
1995
|
-
if (process.env.VUE_APP_VXE_ENV === 'development') {
|
|
1996
|
-
if (!(this.height || this.maxHeight)) {
|
|
1997
|
-
errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}'])
|
|
1998
|
-
}
|
|
1999
|
-
// if (!this.showOverflow) {
|
|
2000
|
-
// warnLog('vxe.error.reqProp', ['table.show-overflow'])
|
|
2001
|
-
// }
|
|
2002
|
-
if (this.spanMethod) {
|
|
2003
|
-
warnLog('vxe.error.scrollErrProp', ['table.span-method'])
|
|
2004
|
-
}
|
|
2005
|
-
}
|
|
2113
|
+
$xeTable.cacheSourceMap(fullData)
|
|
2006
2114
|
}
|
|
2007
2115
|
if (this.clearCellAreas && this.mouseConfig) {
|
|
2008
2116
|
this.clearCellAreas()
|
|
@@ -2022,6 +2130,30 @@ const Methods = {
|
|
|
2022
2130
|
if (sYLoad) {
|
|
2023
2131
|
scrollYStore.endIndex = scrollYStore.visibleSize
|
|
2024
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
|
+
|
|
2025
2157
|
this.handleReserveStatus()
|
|
2026
2158
|
this.checkSelectionStatus()
|
|
2027
2159
|
return new Promise<void>(resolve => {
|
|
@@ -2037,6 +2169,8 @@ const Methods = {
|
|
|
2037
2169
|
if (sYOpts.scrollToTopOnChange) {
|
|
2038
2170
|
targetScrollTop = 0
|
|
2039
2171
|
}
|
|
2172
|
+
reactData.isRowLoading = false
|
|
2173
|
+
calcCellHeight($xeTable)
|
|
2040
2174
|
// 是否变更虚拟滚动
|
|
2041
2175
|
if (oldScrollYLoad === sYLoad) {
|
|
2042
2176
|
restoreScrollLocation(this, targetScrollLeft, targetScrollTop)
|
|
@@ -2061,7 +2195,7 @@ const Methods = {
|
|
|
2061
2195
|
*/
|
|
2062
2196
|
loadData (datas: any) {
|
|
2063
2197
|
const { initStatus } = this
|
|
2064
|
-
return this.loadTableData(datas).then(() => {
|
|
2198
|
+
return this.loadTableData(datas, false).then(() => {
|
|
2065
2199
|
this.inited = true
|
|
2066
2200
|
this.initStatus = true
|
|
2067
2201
|
if (!initStatus) {
|
|
@@ -2079,7 +2213,7 @@ const Methods = {
|
|
|
2079
2213
|
.then(() => {
|
|
2080
2214
|
this.inited = true
|
|
2081
2215
|
this.initStatus = true
|
|
2082
|
-
return this.loadTableData(datas)
|
|
2216
|
+
return this.loadTableData(datas, true)
|
|
2083
2217
|
})
|
|
2084
2218
|
.then(() => {
|
|
2085
2219
|
this.handleLoadDefaults()
|
|
@@ -2157,9 +2291,8 @@ const Methods = {
|
|
|
2157
2291
|
},
|
|
2158
2292
|
/**
|
|
2159
2293
|
* 更新数据行的 Map
|
|
2160
|
-
* 牺牲数据组装的耗时,用来换取使用过程中的流畅
|
|
2161
2294
|
*/
|
|
2162
|
-
cacheRowMap (isSource?: boolean) {
|
|
2295
|
+
cacheRowMap (isReset: boolean, isSource?: boolean) {
|
|
2163
2296
|
const { treeConfig, treeOpts, tableFullData, fullAllDataRowIdData, tableFullTreeData } = this
|
|
2164
2297
|
const childrenField = treeOpts.children || treeOpts.childrenField
|
|
2165
2298
|
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
|
|
@@ -2179,8 +2312,8 @@ const Methods = {
|
|
|
2179
2312
|
row[childrenField] = null
|
|
2180
2313
|
}
|
|
2181
2314
|
let cacheItem = fullAllDataRowIdData[rowid]
|
|
2182
|
-
if (!cacheItem) {
|
|
2183
|
-
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 }
|
|
2184
2317
|
}
|
|
2185
2318
|
cacheItem.row = row
|
|
2186
2319
|
cacheItem.items = items
|
|
@@ -2253,7 +2386,7 @@ const Methods = {
|
|
|
2253
2386
|
XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
|
|
2254
2387
|
const rowid = getRowid($xeTable, childRow)
|
|
2255
2388
|
const parentRow = parentItem || parentRest.row
|
|
2256
|
-
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 }
|
|
2257
2390
|
fullDataRowIdData[rowid] = rest
|
|
2258
2391
|
fullAllDataRowIdData[rowid] = rest
|
|
2259
2392
|
}, { children: childrenField })
|
|
@@ -2604,18 +2737,37 @@ const Methods = {
|
|
|
2604
2737
|
return this.$nextTick()
|
|
2605
2738
|
},
|
|
2606
2739
|
getCellElement (row: any, fieldOrColumn: any) {
|
|
2607
|
-
const
|
|
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)
|
|
2608
2745
|
if (!column) {
|
|
2609
2746
|
return null
|
|
2610
2747
|
}
|
|
2611
|
-
const
|
|
2612
|
-
const
|
|
2613
|
-
|
|
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
|
|
2614
2753
|
if (column) {
|
|
2615
|
-
|
|
2616
|
-
|
|
2617
|
-
|
|
2618
|
-
|
|
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
|
+
}
|
|
2619
2771
|
}
|
|
2620
2772
|
return null
|
|
2621
2773
|
},
|
|
@@ -3009,7 +3161,10 @@ const Methods = {
|
|
|
3009
3161
|
* @param {String/Number} rowid 行主键
|
|
3010
3162
|
*/
|
|
3011
3163
|
getRowById (cellValue: any) {
|
|
3012
|
-
const
|
|
3164
|
+
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
3165
|
+
const internalData = $xeTable as unknown as TableInternalData
|
|
3166
|
+
|
|
3167
|
+
const { fullDataRowIdData } = internalData
|
|
3013
3168
|
const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue)
|
|
3014
3169
|
return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
|
|
3015
3170
|
},
|
|
@@ -3017,13 +3172,10 @@ const Methods = {
|
|
|
3017
3172
|
* 根据行获取行的唯一主键
|
|
3018
3173
|
* @param {Row} row 行对象
|
|
3019
3174
|
*/
|
|
3020
|
-
getRowid (
|
|
3175
|
+
getRowid (row: any) {
|
|
3021
3176
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
3022
|
-
const internalData = $xeTable as unknown as TableInternalData
|
|
3023
3177
|
|
|
3024
|
-
|
|
3025
|
-
const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue || '')
|
|
3026
|
-
return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
|
|
3178
|
+
return getRowid($xeTable, row)
|
|
3027
3179
|
},
|
|
3028
3180
|
/**
|
|
3029
3181
|
* 获取处理后的表格数据
|
|
@@ -3214,34 +3366,40 @@ const Methods = {
|
|
|
3214
3366
|
}
|
|
3215
3367
|
return $xeTable.$nextTick()
|
|
3216
3368
|
},
|
|
3217
|
-
setColumnWidth (fieldOrColumn:
|
|
3218
|
-
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
|
|
3219
3372
|
|
|
3373
|
+
const { elemStore } = internalData
|
|
3220
3374
|
let status = false
|
|
3221
3375
|
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn]
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
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
|
+
}
|
|
3236
3390
|
}
|
|
3391
|
+
})
|
|
3392
|
+
if (status) {
|
|
3393
|
+
return $xeTable.refreshColumn().then(() => {
|
|
3394
|
+
return { status }
|
|
3395
|
+
})
|
|
3237
3396
|
}
|
|
3238
|
-
})
|
|
3239
|
-
if (status) {
|
|
3240
|
-
return $xeTable.refreshColumn()
|
|
3241
3397
|
}
|
|
3242
|
-
return $xeTable.$nextTick()
|
|
3398
|
+
return $xeTable.$nextTick().then(() => {
|
|
3399
|
+
return { status }
|
|
3400
|
+
})
|
|
3243
3401
|
},
|
|
3244
|
-
getColumnWidth (fieldOrColumn:
|
|
3402
|
+
getColumnWidth (fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
|
|
3245
3403
|
const column = handleFieldOrColumn(this, fieldOrColumn)
|
|
3246
3404
|
if (column) {
|
|
3247
3405
|
return column.renderWidth
|
|
@@ -3253,7 +3411,12 @@ const Methods = {
|
|
|
3253
3411
|
* 如果为 true 则重置所有状态
|
|
3254
3412
|
* 如果已关联工具栏,则会同步更新
|
|
3255
3413
|
*/
|
|
3256
|
-
resetColumn (options
|
|
3414
|
+
resetColumn (options?: boolean | {
|
|
3415
|
+
visible?: boolean
|
|
3416
|
+
resizable?: boolean
|
|
3417
|
+
fixed?: boolean
|
|
3418
|
+
order?: boolean
|
|
3419
|
+
}) {
|
|
3257
3420
|
warnLog('vxe.error.delFunc', ['resetColumn', 'resetCustom'])
|
|
3258
3421
|
return this.resetCustom(options)
|
|
3259
3422
|
},
|
|
@@ -3526,7 +3689,153 @@ const Methods = {
|
|
|
3526
3689
|
})
|
|
3527
3690
|
Object.assign(this.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList })
|
|
3528
3691
|
},
|
|
3529
|
-
|
|
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) {
|
|
3530
3839
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
3531
3840
|
const reactData = $xeTable as unknown as TableReactData
|
|
3532
3841
|
const internalData = $xeTable as unknown as TableInternalData
|
|
@@ -3535,6 +3844,8 @@ const Methods = {
|
|
|
3535
3844
|
const { isDblclickAutoWidth } = resizableOpts
|
|
3536
3845
|
const el = $xeTable.$refs.refElem as HTMLDivElement
|
|
3537
3846
|
if (isDblclickAutoWidth && el) {
|
|
3847
|
+
evnt.stopPropagation()
|
|
3848
|
+
evnt.preventDefault()
|
|
3538
3849
|
const { fullColumnIdData } = internalData
|
|
3539
3850
|
const { column } = params
|
|
3540
3851
|
let resizeColumn = column
|
|
@@ -3549,21 +3860,272 @@ const Methods = {
|
|
|
3549
3860
|
const cell = dragBtnElem.parentNode as HTMLTableCellElement
|
|
3550
3861
|
const cellParams = Object.assign(params, { cell })
|
|
3551
3862
|
const colMinWidth = getColReMinWidth(cellParams)
|
|
3863
|
+
|
|
3864
|
+
el.setAttribute('data-calc-col', 'Y')
|
|
3552
3865
|
let resizeWidth = calcColumnAutoWidth(resizeColumn, el)
|
|
3866
|
+
el.removeAttribute('data-calc-col')
|
|
3553
3867
|
if (colRest) {
|
|
3554
3868
|
resizeWidth = Math.max(resizeWidth, colRest.width)
|
|
3555
3869
|
}
|
|
3556
|
-
|
|
3557
|
-
|
|
3870
|
+
resizeWidth = Math.max(colMinWidth, resizeWidth)
|
|
3871
|
+
const resizeParams = { ...params, resizeWidth, resizeColumn }
|
|
3872
|
+
reactData.isDragResize = false
|
|
3558
3873
|
internalData._lastResizeTime = Date.now()
|
|
3559
|
-
|
|
3560
|
-
$xeTable.
|
|
3561
|
-
$xeTable.
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
|
|
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
|
+
}
|
|
3565
4107
|
})
|
|
4108
|
+
if (status) {
|
|
4109
|
+
internalData.isResizeCellHeight = true
|
|
4110
|
+
reactData.resizeHeightFlag++
|
|
4111
|
+
}
|
|
3566
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
|
|
3567
4129
|
},
|
|
3568
4130
|
/**
|
|
3569
4131
|
* 刷新滚动操作,手动同步滚动相关位置(对于某些特殊的操作,比如滚动条错位、固定列不同步)
|
|
@@ -3941,10 +4503,10 @@ const Methods = {
|
|
|
3941
4503
|
}
|
|
3942
4504
|
} else if (isContextMenu) {
|
|
3943
4505
|
// 如果按下上下文键
|
|
3944
|
-
|
|
4506
|
+
internalData._keyCtx = selected.row && selected.column && bodyCtxMenu.length
|
|
3945
4507
|
clearTimeout(internalData.keyCtxTimeout)
|
|
3946
4508
|
internalData.keyCtxTimeout = setTimeout(() => {
|
|
3947
|
-
|
|
4509
|
+
internalData._keyCtx = false
|
|
3948
4510
|
}, 1000)
|
|
3949
4511
|
} else if (isEnter && !hasAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
|
|
3950
4512
|
const { isLastEnterAppendRow, beforeEnterMethod, enterMethod } = keyboardOpts
|
|
@@ -4176,48 +4738,43 @@ const Methods = {
|
|
|
4176
4738
|
this.updateCellAreas()
|
|
4177
4739
|
this.recalculate(true)
|
|
4178
4740
|
},
|
|
4179
|
-
handleTargetEnterEvent (isClear: any) {
|
|
4180
|
-
const $tooltip = this.$refs.tooltip
|
|
4181
|
-
clearTimeout(this.tooltipTimeout)
|
|
4182
|
-
if (isClear) {
|
|
4183
|
-
this.closeTooltip()
|
|
4184
|
-
} else {
|
|
4185
|
-
if ($tooltip) {
|
|
4186
|
-
$tooltip.setActived(true)
|
|
4187
|
-
}
|
|
4188
|
-
}
|
|
4189
|
-
},
|
|
4190
4741
|
handleTargetLeaveEvent () {
|
|
4191
|
-
const
|
|
4192
|
-
|
|
4193
|
-
|
|
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) {
|
|
4194
4748
|
$tooltip.setActived(false)
|
|
4195
4749
|
}
|
|
4196
4750
|
if (tooltipOpts.enterable) {
|
|
4197
|
-
|
|
4198
|
-
$tooltip =
|
|
4199
|
-
if ($tooltip && !$tooltip.isActived()) {
|
|
4200
|
-
|
|
4751
|
+
internalData.tooltipTimeout = setTimeout(() => {
|
|
4752
|
+
$tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
|
|
4753
|
+
if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
|
|
4754
|
+
$xeTable.closeTooltip()
|
|
4201
4755
|
}
|
|
4202
4756
|
}, tooltipOpts.leaveDelay)
|
|
4203
4757
|
} else {
|
|
4204
|
-
|
|
4758
|
+
$xeTable.closeTooltip()
|
|
4205
4759
|
}
|
|
4206
4760
|
},
|
|
4207
4761
|
triggerHeaderTitleEvent (evnt: any, iconParams: any, params: any) {
|
|
4208
|
-
const
|
|
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
|
|
4209
4766
|
if (tipContent) {
|
|
4210
|
-
const {
|
|
4767
|
+
const { tooltipStore } = reactData
|
|
4211
4768
|
const { column } = params
|
|
4212
4769
|
const content = getFuncText(tipContent)
|
|
4213
|
-
|
|
4770
|
+
handleTargetEnterEvent($xeTable, true)
|
|
4214
4771
|
tooltipStore.row = null
|
|
4215
4772
|
tooltipStore.column = column
|
|
4216
4773
|
tooltipStore.visible = true
|
|
4217
4774
|
tooltipStore.currOpts = iconParams
|
|
4218
|
-
|
|
4219
|
-
const $tooltip = $refs.
|
|
4220
|
-
if ($tooltip) {
|
|
4775
|
+
$xeTable.$nextTick(() => {
|
|
4776
|
+
const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
|
|
4777
|
+
if ($tooltip && $tooltip.open) {
|
|
4221
4778
|
$tooltip.open(evnt.currentTarget, content)
|
|
4222
4779
|
}
|
|
4223
4780
|
})
|
|
@@ -4227,23 +4784,44 @@ const Methods = {
|
|
|
4227
4784
|
* 触发表头 tooltip 事件
|
|
4228
4785
|
*/
|
|
4229
4786
|
triggerHeaderTooltipEvent (evnt: any, params: any) {
|
|
4230
|
-
const
|
|
4787
|
+
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
4788
|
+
const reactData = $xeTable as unknown as TableReactData
|
|
4789
|
+
|
|
4790
|
+
const { tooltipStore } = reactData
|
|
4231
4791
|
const { column } = params
|
|
4232
|
-
|
|
4233
|
-
|
|
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
|
+
}
|
|
4234
4805
|
if (tooltipStore.column !== column || !tooltipStore.visible) {
|
|
4235
|
-
|
|
4806
|
+
handleTooltip($xeTable, evnt, thEl, cellEl, null, params)
|
|
4236
4807
|
}
|
|
4237
4808
|
},
|
|
4238
4809
|
/**
|
|
4239
4810
|
* 触发单元格 tooltip 事件
|
|
4240
4811
|
*/
|
|
4241
4812
|
triggerBodyTooltipEvent (evnt: any, params: any) {
|
|
4242
|
-
const
|
|
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
|
|
4243
4821
|
const { actived } = editStore
|
|
4244
4822
|
const { row, column } = params
|
|
4245
|
-
const
|
|
4246
|
-
|
|
4823
|
+
const tdEl = evnt.currentTarget as HTMLTableCellElement
|
|
4824
|
+
handleTargetEnterEvent($xeTable, tooltipStore.column !== column || tooltipStore.row !== row)
|
|
4247
4825
|
// 单元格处于编辑状态时不触发提示框
|
|
4248
4826
|
if (column.editRender && isEnableConf(editConfig)) {
|
|
4249
4827
|
// 如果是行编辑模式
|
|
@@ -4256,67 +4834,24 @@ const Methods = {
|
|
|
4256
4834
|
}
|
|
4257
4835
|
}
|
|
4258
4836
|
if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
|
|
4259
|
-
|
|
4260
|
-
let tipElem
|
|
4261
|
-
if (column.treeNode) {
|
|
4262
|
-
overflowElem = cell.querySelector('.vxe-tree-cell')
|
|
4263
|
-
if (column.type === 'html') {
|
|
4264
|
-
tipElem = cell.querySelector('.vxe-cell--html')
|
|
4265
|
-
}
|
|
4266
|
-
} else {
|
|
4267
|
-
tipElem = cell.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label')
|
|
4268
|
-
}
|
|
4269
|
-
this.handleTooltip(evnt, cell, overflowElem || cell.children[0], tipElem, params)
|
|
4837
|
+
handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper') as HTMLElement, null, params)
|
|
4270
4838
|
}
|
|
4271
4839
|
},
|
|
4272
4840
|
/**
|
|
4273
4841
|
* 触发表尾 tooltip 事件
|
|
4274
4842
|
*/
|
|
4275
4843
|
triggerFooterTooltipEvent (evnt: any, params: any) {
|
|
4844
|
+
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
4845
|
+
const reactData = $xeTable as unknown as TableReactData
|
|
4846
|
+
|
|
4276
4847
|
const { column } = params
|
|
4277
|
-
const { tooltipStore } =
|
|
4278
|
-
const cell = evnt.currentTarget
|
|
4279
|
-
|
|
4848
|
+
const { tooltipStore } = reactData
|
|
4849
|
+
const cell = evnt.currentTarget as HTMLTableCellElement
|
|
4850
|
+
handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row)
|
|
4280
4851
|
if (tooltipStore.column !== column || !tooltipStore.visible) {
|
|
4281
|
-
|
|
4852
|
+
handleTooltip($xeTable, evnt, cell, cell.querySelector('.vxe-cell--wrapper') as HTMLElement || cell.children[0], null, params)
|
|
4282
4853
|
}
|
|
4283
4854
|
},
|
|
4284
|
-
/**
|
|
4285
|
-
* 处理显示 tooltip
|
|
4286
|
-
* @param {Event} evnt 事件
|
|
4287
|
-
* @param {ColumnInfo} column 列配置
|
|
4288
|
-
* @param {Row} row 行对象
|
|
4289
|
-
*/
|
|
4290
|
-
handleTooltip (evnt: any, cell: any, overflowElem: any, tipElem: any, params: any) {
|
|
4291
|
-
const $xeTable = this
|
|
4292
|
-
|
|
4293
|
-
if (!overflowElem) {
|
|
4294
|
-
return $xeTable.$nextTick()
|
|
4295
|
-
}
|
|
4296
|
-
params.cell = cell
|
|
4297
|
-
const { $refs, tooltipOpts, tooltipStore } = this
|
|
4298
|
-
const { column, row } = params
|
|
4299
|
-
const { showAll, enabled, contentMethod } = tooltipOpts
|
|
4300
|
-
const customContent = contentMethod ? contentMethod(params) : null
|
|
4301
|
-
const useCustom = contentMethod && !XEUtils.eqNull(customContent)
|
|
4302
|
-
const content = useCustom ? customContent : (column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim()
|
|
4303
|
-
const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth
|
|
4304
|
-
if (content && (showAll || enabled || useCustom || isCellOverflow)) {
|
|
4305
|
-
Object.assign(tooltipStore, {
|
|
4306
|
-
row,
|
|
4307
|
-
column,
|
|
4308
|
-
visible: true,
|
|
4309
|
-
currOpts: {}
|
|
4310
|
-
})
|
|
4311
|
-
this.$nextTick(() => {
|
|
4312
|
-
const $tooltip = $refs.tooltip
|
|
4313
|
-
if ($tooltip) {
|
|
4314
|
-
$tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content))
|
|
4315
|
-
}
|
|
4316
|
-
})
|
|
4317
|
-
}
|
|
4318
|
-
return this.$nextTick()
|
|
4319
|
-
},
|
|
4320
4855
|
openTooltip (target: any, content: any) {
|
|
4321
4856
|
const { $refs } = this
|
|
4322
4857
|
const commTip = $refs.refCommTooltip
|
|
@@ -4329,9 +4864,12 @@ const Methods = {
|
|
|
4329
4864
|
* 关闭 tooltip
|
|
4330
4865
|
*/
|
|
4331
4866
|
closeTooltip () {
|
|
4332
|
-
const
|
|
4333
|
-
const
|
|
4334
|
-
|
|
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
|
|
4335
4873
|
if (tooltipStore.visible) {
|
|
4336
4874
|
Object.assign(tooltipStore, {
|
|
4337
4875
|
row: null,
|
|
@@ -5336,21 +5874,26 @@ const Methods = {
|
|
|
5336
5874
|
}
|
|
5337
5875
|
this.hoverRow = null
|
|
5338
5876
|
},
|
|
5339
|
-
triggerHeaderCellClickEvent (evnt:
|
|
5340
|
-
const
|
|
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
|
|
5341
5884
|
const { column } = params
|
|
5342
5885
|
const cell = evnt.currentTarget
|
|
5343
5886
|
const triggerResizable = _lastResizeTime && _lastResizeTime > Date.now() - 300
|
|
5344
5887
|
const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag
|
|
5345
5888
|
const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag
|
|
5346
5889
|
if (sortOpts.trigger === 'cell' && !(triggerResizable || triggerSort || triggerFilter)) {
|
|
5347
|
-
|
|
5890
|
+
$xeTable.triggerSortEvent(evnt, column, getNextSortOrder($xeTable, column))
|
|
5348
5891
|
}
|
|
5349
|
-
|
|
5350
|
-
if (
|
|
5351
|
-
|
|
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)
|
|
5352
5895
|
}
|
|
5353
|
-
return
|
|
5896
|
+
return $xeTable.$nextTick()
|
|
5354
5897
|
},
|
|
5355
5898
|
triggerHeaderCellDblclickEvent (evnt: any, params: any) {
|
|
5356
5899
|
this.emitEvent('header-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, params), evnt)
|
|
@@ -5404,8 +5947,21 @@ const Methods = {
|
|
|
5404
5947
|
*/
|
|
5405
5948
|
triggerCellClickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams) {
|
|
5406
5949
|
const $xeTable = this
|
|
5950
|
+
const props = $xeTable
|
|
5951
|
+
const reactData = $xeTable
|
|
5407
5952
|
|
|
5408
|
-
const { highlightCurrentRow,
|
|
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
|
|
5409
5965
|
const { actived, focused } = editStore
|
|
5410
5966
|
const { row, column } = params
|
|
5411
5967
|
const { type, treeNode } = column
|
|
@@ -5489,7 +6045,16 @@ const Methods = {
|
|
|
5489
6045
|
* 如果是双击模式,则激活为编辑状态
|
|
5490
6046
|
*/
|
|
5491
6047
|
triggerCellDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams) {
|
|
5492
|
-
const
|
|
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
|
|
5493
6058
|
const { actived } = editStore
|
|
5494
6059
|
const cell = evnt.currentTarget as HTMLDivElement
|
|
5495
6060
|
params = Object.assign({ cell }, params)
|
|
@@ -5560,10 +6125,13 @@ const Methods = {
|
|
|
5560
6125
|
const $xeTable = this
|
|
5561
6126
|
|
|
5562
6127
|
const sortOpts = $xeTable.computeSortOpts
|
|
6128
|
+
const { multiple, allowClear } = sortOpts
|
|
5563
6129
|
const { field, sortable, remoteSort } = column
|
|
5564
6130
|
if (sortable || remoteSort) {
|
|
5565
6131
|
if (!order || column.order === order) {
|
|
5566
|
-
|
|
6132
|
+
if (allowClear) {
|
|
6133
|
+
$xeTable.clearSort(multiple ? column : null)
|
|
6134
|
+
}
|
|
5567
6135
|
} else {
|
|
5568
6136
|
$xeTable.sort({ field, order })
|
|
5569
6137
|
}
|
|
@@ -5667,7 +6235,7 @@ const Methods = {
|
|
|
5667
6235
|
const { treeConfig, dragConfig } = props
|
|
5668
6236
|
const rowDragOpts = $xeTable.computeRowDragOpts
|
|
5669
6237
|
const { fullAllDataRowIdData } = internalData
|
|
5670
|
-
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts
|
|
6238
|
+
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod, dragToChildMethod } = rowDragOpts
|
|
5671
6239
|
const treeOpts = $xeTable.computeTreeOpts
|
|
5672
6240
|
const { transform, rowField, mapChildrenField, parentField } = treeOpts
|
|
5673
6241
|
const childrenField = treeOpts.children || treeOpts.childrenField
|
|
@@ -5677,17 +6245,15 @@ const Methods = {
|
|
|
5677
6245
|
if (prevDragRow && dragRow) {
|
|
5678
6246
|
// 判断是否有拖动
|
|
5679
6247
|
if (prevDragRow !== dragRow) {
|
|
5680
|
-
|
|
5681
|
-
|
|
5682
|
-
|
|
5683
|
-
|
|
5684
|
-
|
|
5685
|
-
|
|
5686
|
-
|
|
5687
|
-
|
|
5688
|
-
|
|
5689
|
-
: true
|
|
5690
|
-
).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) => {
|
|
5691
6257
|
if (!status) {
|
|
5692
6258
|
return
|
|
5693
6259
|
}
|
|
@@ -5767,7 +6333,11 @@ const Methods = {
|
|
|
5767
6333
|
// 根到根
|
|
5768
6334
|
}
|
|
5769
6335
|
|
|
5770
|
-
const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
|
|
6336
|
+
const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
|
|
6337
|
+
key: rowField,
|
|
6338
|
+
parentKey: parentField,
|
|
6339
|
+
children: mapChildrenField
|
|
6340
|
+
})
|
|
5771
6341
|
|
|
5772
6342
|
// 移出
|
|
5773
6343
|
const otfIndex = $xeTable.findRowIndexOf(fullList, dragRow)
|
|
@@ -5784,13 +6354,13 @@ const Methods = {
|
|
|
5784
6354
|
childRow[parentField] = dragRow[parentField]
|
|
5785
6355
|
})
|
|
5786
6356
|
}
|
|
5787
|
-
dragRow[parentField] =
|
|
6357
|
+
dragRow[parentField] = isDragToChildFlag ? prevDragRow[rowField] : prevDragRow[parentField]
|
|
5788
6358
|
|
|
5789
6359
|
internalData.tableFullTreeData = XEUtils.toArrayTree(fullList, {
|
|
5790
|
-
key:
|
|
5791
|
-
parentKey:
|
|
6360
|
+
key: rowField,
|
|
6361
|
+
parentKey: parentField,
|
|
5792
6362
|
children: childrenField,
|
|
5793
|
-
mapChildren:
|
|
6363
|
+
mapChildren: mapChildrenField
|
|
5794
6364
|
})
|
|
5795
6365
|
}
|
|
5796
6366
|
}
|
|
@@ -5811,7 +6381,7 @@ const Methods = {
|
|
|
5811
6381
|
|
|
5812
6382
|
reactData.isDragRowMove = true
|
|
5813
6383
|
$xeTable.handleTableData(treeConfig && transform)
|
|
5814
|
-
$xeTable.cacheRowMap()
|
|
6384
|
+
$xeTable.cacheRowMap(false)
|
|
5815
6385
|
updateScrollYStatus($xeTable)
|
|
5816
6386
|
if (!(treeConfig && transform)) {
|
|
5817
6387
|
updateAfterDataIndex($xeTable)
|
|
@@ -5829,7 +6399,7 @@ const Methods = {
|
|
|
5829
6399
|
oldRow: dragRow,
|
|
5830
6400
|
newRow: prevDragRow,
|
|
5831
6401
|
dragPos: prevDragPos as any,
|
|
5832
|
-
dragToChild:
|
|
6402
|
+
dragToChild: isDragToChildFlag,
|
|
5833
6403
|
offsetIndex: dragOffsetIndex,
|
|
5834
6404
|
_index: {
|
|
5835
6405
|
newIndex: nafIndex,
|
|
@@ -5856,18 +6426,16 @@ const Methods = {
|
|
|
5856
6426
|
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
|
|
5857
6427
|
const { prevDragRow, prevDragPos } = internalData
|
|
5858
6428
|
|
|
5859
|
-
if (treeConfig && prevDragToChild) {
|
|
6429
|
+
if (treeConfig && lazy && prevDragToChild) {
|
|
5860
6430
|
// 懒加载
|
|
5861
|
-
|
|
5862
|
-
|
|
5863
|
-
|
|
5864
|
-
if (
|
|
5865
|
-
if (rowRest && rowRest.treeLoaded) {
|
|
5866
|
-
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
|
|
5867
|
-
}
|
|
5868
|
-
} else {
|
|
6431
|
+
const newRowid = getRowid($xeTable, prevDragRow)
|
|
6432
|
+
const rowRest = fullAllDataRowIdData[newRowid]
|
|
6433
|
+
if (prevDragRow[hasChildField]) {
|
|
6434
|
+
if (rowRest && rowRest.treeLoaded) {
|
|
5869
6435
|
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
|
|
5870
6436
|
}
|
|
6437
|
+
} else {
|
|
6438
|
+
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
|
|
5871
6439
|
}
|
|
5872
6440
|
} else {
|
|
5873
6441
|
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
|
|
@@ -5989,7 +6557,7 @@ const Methods = {
|
|
|
5989
6557
|
|
|
5990
6558
|
const { mouseConfig } = props
|
|
5991
6559
|
const columnDragOpts = $xeTable.computeColumnDragOpts
|
|
5992
|
-
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
|
|
6560
|
+
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts
|
|
5993
6561
|
const { collectColumn } = internalData
|
|
5994
6562
|
const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0
|
|
5995
6563
|
if (prevDragCol && dragCol) {
|
|
@@ -5997,17 +6565,15 @@ const Methods = {
|
|
|
5997
6565
|
if (prevDragCol !== dragCol) {
|
|
5998
6566
|
const oldColumn = dragCol
|
|
5999
6567
|
const newColumn = prevDragCol
|
|
6000
|
-
|
|
6001
|
-
|
|
6002
|
-
|
|
6003
|
-
|
|
6004
|
-
|
|
6005
|
-
|
|
6006
|
-
|
|
6007
|
-
|
|
6008
|
-
|
|
6009
|
-
: true
|
|
6010
|
-
).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) => {
|
|
6011
6577
|
if (!status) {
|
|
6012
6578
|
return
|
|
6013
6579
|
}
|
|
@@ -6103,7 +6669,7 @@ const Methods = {
|
|
|
6103
6669
|
if (newMatchRest) {
|
|
6104
6670
|
const { items: nCols, index: nIndex, parent: nParent } = newMatchRest
|
|
6105
6671
|
// 转子级
|
|
6106
|
-
if ((isCrossDrag && isToChildDrag) &&
|
|
6672
|
+
if ((isCrossDrag && isToChildDrag) && isDragToChildFlag) {
|
|
6107
6673
|
oldColumn.parentId = newColumn.id
|
|
6108
6674
|
newColumn.children = (newColumn.children || []).concat([oldColumn])
|
|
6109
6675
|
} else {
|
|
@@ -6137,7 +6703,7 @@ const Methods = {
|
|
|
6137
6703
|
oldColumn,
|
|
6138
6704
|
newColumn,
|
|
6139
6705
|
dragPos: prevDragPos,
|
|
6140
|
-
dragToChild:
|
|
6706
|
+
dragToChild: isDragToChildFlag,
|
|
6141
6707
|
offsetIndex: dragOffsetIndex,
|
|
6142
6708
|
_index: {
|
|
6143
6709
|
newIndex: nafIndex,
|
|
@@ -7169,13 +7735,18 @@ const Methods = {
|
|
|
7169
7735
|
* 获取表格的滚动状态
|
|
7170
7736
|
*/
|
|
7171
7737
|
getScroll () {
|
|
7172
|
-
const
|
|
7173
|
-
const
|
|
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'])
|
|
7174
7745
|
return {
|
|
7175
7746
|
virtualX: scrollXLoad,
|
|
7176
7747
|
virtualY: scrollYLoad,
|
|
7177
|
-
scrollTop:
|
|
7178
|
-
scrollLeft:
|
|
7748
|
+
scrollTop: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
|
|
7749
|
+
scrollLeft: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
|
|
7179
7750
|
}
|
|
7180
7751
|
},
|
|
7181
7752
|
handleScrollEvent (evnt: Event, isRollY: boolean, isRollX: boolean, scrollTop: number, scrollLeft: number, params: any) {
|
|
@@ -7280,48 +7851,6 @@ const Methods = {
|
|
|
7280
7851
|
}
|
|
7281
7852
|
$xeTable.dispatchEvent('scroll', evntParams, evnt)
|
|
7282
7853
|
},
|
|
7283
|
-
lazyScrollXData () {
|
|
7284
|
-
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7285
|
-
const internalData = $xeTable as unknown as TableInternalData
|
|
7286
|
-
|
|
7287
|
-
const { lxTimeout, lxRunTime, scrollXStore } = internalData
|
|
7288
|
-
const { visibleSize } = scrollXStore
|
|
7289
|
-
const fpsTime = Math.max(5, Math.min(80, Math.floor(visibleSize * 3)))
|
|
7290
|
-
if (lxTimeout) {
|
|
7291
|
-
clearTimeout(lxTimeout)
|
|
7292
|
-
}
|
|
7293
|
-
if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
|
|
7294
|
-
internalData.lxRunTime = Date.now()
|
|
7295
|
-
loadScrollXData($xeTable)
|
|
7296
|
-
}
|
|
7297
|
-
internalData.lxTimeout = setTimeout(() => {
|
|
7298
|
-
internalData.lxTimeout = undefined
|
|
7299
|
-
internalData.lxRunTime = undefined
|
|
7300
|
-
loadScrollXData($xeTable)
|
|
7301
|
-
}, fpsTime)
|
|
7302
|
-
},
|
|
7303
|
-
lazyScrollYData () {
|
|
7304
|
-
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7305
|
-
const props = $xeTable
|
|
7306
|
-
const internalData = $xeTable as unknown as TableInternalData
|
|
7307
|
-
|
|
7308
|
-
const { showOverflow } = props
|
|
7309
|
-
const { lyTimeout, lyRunTime, scrollYStore } = internalData
|
|
7310
|
-
const { visibleSize } = scrollYStore
|
|
7311
|
-
const fpsTime = showOverflow ? 5 : Math.max(5, Math.min(80, Math.floor(visibleSize / 2)))
|
|
7312
|
-
if (lyTimeout) {
|
|
7313
|
-
clearTimeout(lyTimeout)
|
|
7314
|
-
}
|
|
7315
|
-
if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
|
|
7316
|
-
internalData.lyRunTime = Date.now()
|
|
7317
|
-
loadScrollYData($xeTable)
|
|
7318
|
-
}
|
|
7319
|
-
internalData.lyTimeout = setTimeout(() => {
|
|
7320
|
-
internalData.lyTimeout = undefined
|
|
7321
|
-
internalData.lyRunTime = undefined
|
|
7322
|
-
loadScrollYData($xeTable)
|
|
7323
|
-
}, fpsTime)
|
|
7324
|
-
},
|
|
7325
7854
|
/**
|
|
7326
7855
|
* 横向 X 可视渲染事件处理
|
|
7327
7856
|
*/
|
|
@@ -7332,7 +7861,7 @@ const Methods = {
|
|
|
7332
7861
|
if (sXOpts.immediate) {
|
|
7333
7862
|
loadScrollXData($xeTable)
|
|
7334
7863
|
} else {
|
|
7335
|
-
$xeTable
|
|
7864
|
+
lazyScrollXData($xeTable)
|
|
7336
7865
|
}
|
|
7337
7866
|
},
|
|
7338
7867
|
/**
|
|
@@ -7345,14 +7874,14 @@ const Methods = {
|
|
|
7345
7874
|
if (sYOpts.immediate) {
|
|
7346
7875
|
loadScrollYData($xeTable)
|
|
7347
7876
|
} else {
|
|
7348
|
-
$xeTable
|
|
7877
|
+
lazyScrollYData($xeTable)
|
|
7349
7878
|
}
|
|
7350
7879
|
},
|
|
7351
7880
|
triggerBodyScrollEvent (evnt: Event, fixedType: '' | 'left' | 'right') {
|
|
7352
7881
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7353
7882
|
const internalData = $xeTable as unknown as TableInternalData
|
|
7354
7883
|
|
|
7355
|
-
const { elemStore, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
|
|
7884
|
+
const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
|
|
7356
7885
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
|
|
7357
7886
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
|
|
7358
7887
|
const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
|
|
@@ -7363,6 +7892,9 @@ const Methods = {
|
|
|
7363
7892
|
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
|
|
7364
7893
|
return
|
|
7365
7894
|
}
|
|
7895
|
+
if (intoRunScroll) {
|
|
7896
|
+
return
|
|
7897
|
+
}
|
|
7366
7898
|
if (!bodyScrollElem) {
|
|
7367
7899
|
return
|
|
7368
7900
|
}
|
|
@@ -7420,22 +7952,16 @@ const Methods = {
|
|
|
7420
7952
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7421
7953
|
const internalData = $xeTable as unknown as TableInternalData
|
|
7422
7954
|
|
|
7423
|
-
const { elemStore, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
|
|
7955
|
+
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
|
|
7424
7956
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
|
|
7425
7957
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
|
|
7426
7958
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
|
|
7427
7959
|
const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
|
|
7428
7960
|
const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
|
|
7429
|
-
if (inWheelScroll) {
|
|
7961
|
+
if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
|
|
7430
7962
|
return
|
|
7431
7963
|
}
|
|
7432
|
-
if (
|
|
7433
|
-
return
|
|
7434
|
-
}
|
|
7435
|
-
if (inBodyScroll) {
|
|
7436
|
-
return
|
|
7437
|
-
}
|
|
7438
|
-
if (inFooterScroll) {
|
|
7964
|
+
if (intoRunScroll) {
|
|
7439
7965
|
return
|
|
7440
7966
|
}
|
|
7441
7967
|
if (!headerScrollElem) {
|
|
@@ -7465,22 +7991,16 @@ const Methods = {
|
|
|
7465
7991
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7466
7992
|
const internalData = $xeTable as unknown as TableInternalData
|
|
7467
7993
|
|
|
7468
|
-
const { elemStore, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
|
|
7994
|
+
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
|
|
7469
7995
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
|
|
7470
7996
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
|
|
7471
7997
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
|
|
7472
7998
|
const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
|
|
7473
7999
|
const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
|
|
7474
|
-
if (inWheelScroll) {
|
|
7475
|
-
return
|
|
7476
|
-
}
|
|
7477
|
-
if (inVirtualScroll) {
|
|
7478
|
-
return
|
|
7479
|
-
}
|
|
7480
|
-
if (inHeaderScroll) {
|
|
8000
|
+
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
|
|
7481
8001
|
return
|
|
7482
8002
|
}
|
|
7483
|
-
if (
|
|
8003
|
+
if (intoRunScroll) {
|
|
7484
8004
|
return
|
|
7485
8005
|
}
|
|
7486
8006
|
if (!footerScrollElem) {
|
|
@@ -7512,7 +8032,10 @@ const Methods = {
|
|
|
7512
8032
|
const reactData = $xeTable as unknown as TableReactData
|
|
7513
8033
|
const internalData = $xeTable as unknown as TableInternalData
|
|
7514
8034
|
|
|
7515
|
-
const { deltaY, deltaX } = evnt
|
|
8035
|
+
const { target, deltaY, deltaX } = evnt
|
|
8036
|
+
if (target && /^textarea$/i.test((target as HTMLElement).tagName)) {
|
|
8037
|
+
return
|
|
8038
|
+
}
|
|
7516
8039
|
const { highlightHoverRow } = tableProps
|
|
7517
8040
|
const { elemStore, lastScrollTop, lastScrollLeft } = internalData
|
|
7518
8041
|
const rowOpts = $xeTable.computeRowOpts
|
|
@@ -7532,29 +8055,14 @@ const Methods = {
|
|
|
7532
8055
|
return
|
|
7533
8056
|
}
|
|
7534
8057
|
|
|
7535
|
-
|
|
7536
|
-
|
|
7537
|
-
|
|
7538
|
-
multiple = 1.18
|
|
7539
|
-
} else if (reactData.lastScrollTime + 30 > Date.now()) {
|
|
7540
|
-
multiple = 1.15
|
|
7541
|
-
} else if (reactData.lastScrollTime + 40 > Date.now()) {
|
|
7542
|
-
multiple = 1.12
|
|
7543
|
-
} else if (reactData.lastScrollTime + 55 > Date.now()) {
|
|
7544
|
-
multiple = 1.09
|
|
7545
|
-
} else if (reactData.lastScrollTime + 75 > Date.now()) {
|
|
7546
|
-
multiple = 1.06
|
|
7547
|
-
} else if (reactData.lastScrollTime + 100 > Date.now()) {
|
|
7548
|
-
multiple = 1.03
|
|
7549
|
-
}
|
|
7550
|
-
|
|
7551
|
-
const deltaTop = deltaY * multiple
|
|
7552
|
-
const deltaLeft = deltaX * multiple
|
|
8058
|
+
const wheelSpeed = getWheelSpeed(reactData.lastScrollTime)
|
|
8059
|
+
const deltaTop = deltaY * wheelSpeed
|
|
8060
|
+
const deltaLeft = deltaX * wheelSpeed
|
|
7553
8061
|
|
|
7554
8062
|
const isTopWheel = deltaTop < 0
|
|
7555
|
-
const currScrollTop =
|
|
8063
|
+
const currScrollTop = bodyScrollElem.scrollTop
|
|
7556
8064
|
// 如果滚动位置已经是顶部或底部,则不需要触发
|
|
7557
|
-
if (isTopWheel ? currScrollTop <= 0 : currScrollTop >=
|
|
8065
|
+
if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
|
|
7558
8066
|
return
|
|
7559
8067
|
}
|
|
7560
8068
|
|
|
@@ -7570,16 +8078,31 @@ const Methods = {
|
|
|
7570
8078
|
$xeTable.clearHoverRow()
|
|
7571
8079
|
}
|
|
7572
8080
|
|
|
7573
|
-
|
|
7574
|
-
|
|
7575
|
-
|
|
7576
|
-
|
|
7577
|
-
|
|
7578
|
-
|
|
7579
|
-
|
|
7580
|
-
|
|
7581
|
-
|
|
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
|
+
})
|
|
7582
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
|
+
// })
|
|
7583
8106
|
}
|
|
7584
8107
|
},
|
|
7585
8108
|
triggerVirtualScrollXEvent (evnt: Event) {
|
|
@@ -7653,17 +8176,15 @@ const Methods = {
|
|
|
7653
8176
|
})
|
|
7654
8177
|
},
|
|
7655
8178
|
updateScrollXData () {
|
|
7656
|
-
const $xeTable = this
|
|
7657
|
-
const
|
|
8179
|
+
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
8180
|
+
const reactData = $xeTable as unknown as TableReactData
|
|
7658
8181
|
|
|
7659
|
-
const {
|
|
8182
|
+
const { isAllOverflow } = reactData
|
|
7660
8183
|
handleTableColumn($xeTable)
|
|
7661
|
-
// calcCellHeight()
|
|
7662
8184
|
return $xeTable.$nextTick().then(() => {
|
|
7663
|
-
// calcCellHeight()
|
|
7664
8185
|
handleTableColumn($xeTable)
|
|
7665
8186
|
$xeTable.updateScrollXSpace()
|
|
7666
|
-
if (!
|
|
8187
|
+
if (!isAllOverflow) {
|
|
7667
8188
|
$xeTable.updateScrollYSpace()
|
|
7668
8189
|
}
|
|
7669
8190
|
})
|
|
@@ -7721,9 +8242,7 @@ const Methods = {
|
|
|
7721
8242
|
const $xeTable = this
|
|
7722
8243
|
|
|
7723
8244
|
$xeTable.handleTableData()
|
|
7724
|
-
// calcCellHeight()
|
|
7725
8245
|
return $xeTable.$nextTick().then(() => {
|
|
7726
|
-
// calcCellHeight()
|
|
7727
8246
|
$xeTable.handleTableData()
|
|
7728
8247
|
$xeTable.updateScrollYSpace()
|
|
7729
8248
|
})
|
|
@@ -7731,38 +8250,37 @@ const Methods = {
|
|
|
7731
8250
|
// 更新纵向 Y 可视渲染上下剩余空间大小
|
|
7732
8251
|
updateScrollYSpace () {
|
|
7733
8252
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7734
|
-
const props = $xeTable
|
|
7735
8253
|
const reactData = $xeTable as unknown as TableReactData
|
|
7736
8254
|
const internalData = $xeTable as unknown as TableInternalData
|
|
7737
8255
|
|
|
7738
|
-
const {
|
|
7739
|
-
const {
|
|
7740
|
-
const { scrollYStore, elemStore, afterFullData, fullAllDataRowIdData } = internalData
|
|
8256
|
+
const { isAllOverflow, scrollYLoad } = reactData
|
|
8257
|
+
const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
|
|
7741
8258
|
const { startIndex } = scrollYStore
|
|
8259
|
+
const rowOpts = $xeTable.computeRowOpts
|
|
8260
|
+
const cellOpts = $xeTable.computeCellOpts
|
|
8261
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight
|
|
7742
8262
|
const bodyTableElem = getRefElem(elemStore['main-body-table'])
|
|
7743
8263
|
const containerList = ['main', 'left', 'right']
|
|
7744
8264
|
let topSpaceHeight = 0
|
|
7745
8265
|
let ySpaceHeight = 0
|
|
8266
|
+
|
|
7746
8267
|
if (scrollYLoad) {
|
|
7747
|
-
|
|
7748
|
-
|
|
7749
|
-
|
|
8268
|
+
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
|
|
8269
|
+
if (!isCustomCellHeight && isAllOverflow) {
|
|
8270
|
+
ySpaceHeight = afterFullData.length * defaultRowHeight
|
|
8271
|
+
topSpaceHeight = Math.max(0, startIndex * defaultRowHeight)
|
|
7750
8272
|
} else {
|
|
7751
8273
|
for (let i = 0; i < afterFullData.length; i++) {
|
|
7752
8274
|
const row = afterFullData[i]
|
|
7753
8275
|
const rowid = getRowid($xeTable, row)
|
|
7754
|
-
const rowRest = fullAllDataRowIdData[rowid]
|
|
7755
|
-
|
|
7756
|
-
ySpaceHeight += rowRest.height || rowHeight
|
|
7757
|
-
}
|
|
8276
|
+
const rowRest = fullAllDataRowIdData[rowid] || {}
|
|
8277
|
+
ySpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
|
|
7758
8278
|
}
|
|
7759
8279
|
for (let i = 0; i < startIndex; i++) {
|
|
7760
8280
|
const row = afterFullData[i]
|
|
7761
8281
|
const rowid = getRowid($xeTable, row)
|
|
7762
|
-
const rowRest = fullAllDataRowIdData[rowid]
|
|
7763
|
-
|
|
7764
|
-
topSpaceHeight += rowRest.height || rowHeight
|
|
7765
|
-
}
|
|
8282
|
+
const rowRest = fullAllDataRowIdData[rowid] || {}
|
|
8283
|
+
topSpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight
|
|
7766
8284
|
}
|
|
7767
8285
|
}
|
|
7768
8286
|
} else {
|
|
@@ -7787,7 +8305,7 @@ const Methods = {
|
|
|
7787
8305
|
if (scrollYSpaceEl) {
|
|
7788
8306
|
scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
|
|
7789
8307
|
}
|
|
7790
|
-
$xeTable.$nextTick(() => {
|
|
8308
|
+
return $xeTable.$nextTick().then(() => {
|
|
7791
8309
|
updateStyle($xeTable)
|
|
7792
8310
|
})
|
|
7793
8311
|
},
|
|
@@ -7852,11 +8370,9 @@ const Methods = {
|
|
|
7852
8370
|
*/
|
|
7853
8371
|
scrollToRow (row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
|
|
7854
8372
|
const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
|
|
7855
|
-
const props = $xeTable
|
|
7856
8373
|
const reactData = $xeTable as unknown as TableReactData
|
|
7857
8374
|
|
|
7858
|
-
const {
|
|
7859
|
-
const { scrollYLoad, scrollXLoad } = reactData
|
|
8375
|
+
const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData
|
|
7860
8376
|
const rest = []
|
|
7861
8377
|
if (row) {
|
|
7862
8378
|
if (this.treeConfig) {
|
|
@@ -7870,7 +8386,7 @@ const Methods = {
|
|
|
7870
8386
|
}
|
|
7871
8387
|
return Promise.all(rest).then(() => {
|
|
7872
8388
|
if (row) {
|
|
7873
|
-
if (!
|
|
8389
|
+
if (!isAllOverflow && (scrollYLoad || scrollXLoad)) {
|
|
7874
8390
|
calcCellHeight($xeTable)
|
|
7875
8391
|
calcCellWidth($xeTable)
|
|
7876
8392
|
}
|