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
package/es/table/src/methods.js
CHANGED
|
@@ -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';
|
|
@@ -308,7 +308,7 @@ function updateAfterListIndex($xeTable) {
|
|
|
308
308
|
rowRest._index = index;
|
|
309
309
|
}
|
|
310
310
|
else {
|
|
311
|
-
const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 };
|
|
311
|
+
const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 };
|
|
312
312
|
fullAllDataRowIdData[rowid] = rest;
|
|
313
313
|
fullDataRowIdData[rowid] = rest;
|
|
314
314
|
}
|
|
@@ -339,7 +339,7 @@ function updateAfterDataIndex($xeTable) {
|
|
|
339
339
|
rowRest.treeIndex = index;
|
|
340
340
|
}
|
|
341
341
|
else {
|
|
342
|
-
const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, oTop: 0 };
|
|
342
|
+
const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 };
|
|
343
343
|
fullAllDataRowIdData[rowid] = rest;
|
|
344
344
|
fullDataRowIdData[rowid] = rest;
|
|
345
345
|
}
|
|
@@ -390,14 +390,16 @@ function updateStyle($xeTable) {
|
|
|
390
390
|
const props = $xeTable;
|
|
391
391
|
const reactData = $xeTable;
|
|
392
392
|
const internalData = $xeTable;
|
|
393
|
-
const { border,
|
|
394
|
-
const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, scrollbarWidth, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData;
|
|
393
|
+
const { border, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props;
|
|
394
|
+
const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData;
|
|
395
395
|
const { visibleColumn, fullColumnIdData, tableHeight, tableWidth, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData;
|
|
396
396
|
const el = $xeTable.$refs.refElem;
|
|
397
397
|
if (!el) {
|
|
398
398
|
return;
|
|
399
399
|
}
|
|
400
400
|
const containerList = ['main', 'left', 'right'];
|
|
401
|
+
const osbWidth = overflowY ? scrollbarWidth : 0;
|
|
402
|
+
const osbHeight = overflowX ? scrollbarHeight : 0;
|
|
401
403
|
const emptyPlaceholderElem = $xeTable.$refs.refEmptyPlaceholder;
|
|
402
404
|
const cellOffsetWidth = $xeTable.computeCellOffsetWidth;
|
|
403
405
|
const mouseOpts = $xeTable.computeMouseOpts;
|
|
@@ -405,16 +407,16 @@ function updateStyle($xeTable) {
|
|
|
405
407
|
const bodyTableElem = getRefElem(elemStore['main-body-table']);
|
|
406
408
|
if (emptyPlaceholderElem) {
|
|
407
409
|
emptyPlaceholderElem.style.top = `${headerHeight}px`;
|
|
408
|
-
emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight -
|
|
410
|
+
emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : '';
|
|
409
411
|
}
|
|
410
412
|
let bodyHeight = 0;
|
|
411
413
|
let bodyMaxHeight = 0;
|
|
412
|
-
const bodyMinHeight = customMinHeight - headerHeight - footerHeight -
|
|
414
|
+
const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight;
|
|
413
415
|
if (customMaxHeight) {
|
|
414
|
-
bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight -
|
|
416
|
+
bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight);
|
|
415
417
|
}
|
|
416
418
|
if (customHeight) {
|
|
417
|
-
bodyHeight = customHeight - headerHeight - footerHeight -
|
|
419
|
+
bodyHeight = customHeight - headerHeight - footerHeight - osbHeight;
|
|
418
420
|
}
|
|
419
421
|
if (!bodyHeight) {
|
|
420
422
|
if (bodyTableElem) {
|
|
@@ -432,27 +434,27 @@ function updateStyle($xeTable) {
|
|
|
432
434
|
const scrollbarXToTop = $xeTable.computeScrollbarXToTop;
|
|
433
435
|
const scrollXVirtualEl = $xeTable.$refs.refScrollXVirtualElem;
|
|
434
436
|
if (scrollXVirtualEl) {
|
|
435
|
-
scrollXVirtualEl.style.height = `${
|
|
436
|
-
scrollXVirtualEl.style.visibility =
|
|
437
|
+
scrollXVirtualEl.style.height = `${osbHeight}px`;
|
|
438
|
+
scrollXVirtualEl.style.visibility = overflowX ? 'visible' : 'hidden';
|
|
437
439
|
}
|
|
438
440
|
const xWrapperEl = $xeTable.$refs.refScrollXWrapperElem;
|
|
439
441
|
if (xWrapperEl) {
|
|
440
|
-
xWrapperEl.style.left = scrollbarXToTop ? `${
|
|
441
|
-
xWrapperEl.style.width = `${el.clientWidth -
|
|
442
|
+
xWrapperEl.style.left = scrollbarXToTop ? `${osbWidth}px` : '';
|
|
443
|
+
xWrapperEl.style.width = `${el.clientWidth - osbWidth}px`;
|
|
442
444
|
}
|
|
443
445
|
if (xLeftCornerEl) {
|
|
444
|
-
xLeftCornerEl.style.width = scrollbarXToTop ? `${
|
|
445
|
-
xLeftCornerEl.style.display = scrollbarXToTop ? (
|
|
446
|
+
xLeftCornerEl.style.width = scrollbarXToTop ? `${osbWidth}px` : '';
|
|
447
|
+
xLeftCornerEl.style.display = scrollbarXToTop ? (osbWidth && osbHeight ? 'block' : '') : '';
|
|
446
448
|
}
|
|
447
449
|
if (xRightCornerEl) {
|
|
448
|
-
xRightCornerEl.style.width = scrollbarXToTop ? '' : `${
|
|
449
|
-
xRightCornerEl.style.display = scrollbarXToTop ? '' : (
|
|
450
|
+
xRightCornerEl.style.width = scrollbarXToTop ? '' : `${osbWidth}px`;
|
|
451
|
+
xRightCornerEl.style.display = scrollbarXToTop ? '' : (osbWidth && osbHeight ? 'block' : '');
|
|
450
452
|
}
|
|
451
453
|
const scrollYVirtualEl = $xeTable.$refs.refScrollYVirtualElem;
|
|
452
454
|
if (scrollYVirtualEl) {
|
|
453
|
-
scrollYVirtualEl.style.width = `${
|
|
455
|
+
scrollYVirtualEl.style.width = `${osbWidth}px`;
|
|
454
456
|
scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`;
|
|
455
|
-
scrollYVirtualEl.style.visibility =
|
|
457
|
+
scrollYVirtualEl.style.visibility = overflowY ? 'visible' : 'hidden';
|
|
456
458
|
}
|
|
457
459
|
const yTopCornerEl = $xeTable.$refs.refScrollYTopCornerElem;
|
|
458
460
|
if (yTopCornerEl) {
|
|
@@ -570,14 +572,14 @@ function updateStyle($xeTable) {
|
|
|
570
572
|
if (wrapperElem) {
|
|
571
573
|
wrapperElem.style.top = `${headerHeight}px`;
|
|
572
574
|
}
|
|
573
|
-
fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight +
|
|
575
|
+
fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + osbHeight)}px`;
|
|
574
576
|
fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`;
|
|
575
577
|
}
|
|
576
578
|
let tWidth = tableWidth;
|
|
577
579
|
let renderColumnList = tableColumn;
|
|
578
580
|
let isOptimizeMode = false;
|
|
579
581
|
// 如果是使用优化模式
|
|
580
|
-
if (scrollXLoad || scrollYLoad ||
|
|
582
|
+
if (scrollXLoad || scrollYLoad || isAllOverflow) {
|
|
581
583
|
if (expandColumn || spanMethod || footerSpanMethod) {
|
|
582
584
|
// 如果不支持优化模式
|
|
583
585
|
}
|
|
@@ -600,7 +602,7 @@ function updateStyle($xeTable) {
|
|
|
600
602
|
if (tableElem) {
|
|
601
603
|
tableElem.style.width = tWidth ? `${tWidth}px` : '';
|
|
602
604
|
// 兼容性处理
|
|
603
|
-
tableElem.style.paddingRight =
|
|
605
|
+
tableElem.style.paddingRight = osbWidth && fixedType && (browse['-moz'] || browse.safari) ? `${osbWidth}px` : '';
|
|
604
606
|
}
|
|
605
607
|
const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`]);
|
|
606
608
|
if (emptyBlockElem) {
|
|
@@ -637,7 +639,7 @@ function updateStyle($xeTable) {
|
|
|
637
639
|
// 如果是固定列
|
|
638
640
|
if (fixedWrapperElem) {
|
|
639
641
|
if (wrapperElem) {
|
|
640
|
-
wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight -
|
|
642
|
+
wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - osbHeight : tableHeight + headerHeight}px`;
|
|
641
643
|
}
|
|
642
644
|
}
|
|
643
645
|
}
|
|
@@ -662,7 +664,7 @@ function updateStyle($xeTable) {
|
|
|
662
664
|
cellOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow;
|
|
663
665
|
}
|
|
664
666
|
else {
|
|
665
|
-
cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ?
|
|
667
|
+
cellOverflow = XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow) ? isAllOverflow : showOverflow;
|
|
666
668
|
}
|
|
667
669
|
const showEllipsis = cellOverflow === 'ellipsis';
|
|
668
670
|
const showTitle = cellOverflow === 'title';
|
|
@@ -706,52 +708,62 @@ function updateStyle($xeTable) {
|
|
|
706
708
|
return $xeTable.$nextTick();
|
|
707
709
|
}
|
|
708
710
|
function computeRowHeight($xeTable) {
|
|
711
|
+
const reactData = $xeTable;
|
|
712
|
+
const { isAllOverflow } = reactData;
|
|
709
713
|
const tableHeader = $xeTable.$refs.refTableHeader;
|
|
710
714
|
const tableBody = $xeTable.$refs.refTableBody;
|
|
711
715
|
const tableBodyElem = tableBody ? tableBody.$el : null;
|
|
712
716
|
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
713
717
|
let rowHeight = 0;
|
|
714
|
-
if (
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
firstTrElem
|
|
718
|
+
if (isAllOverflow) {
|
|
719
|
+
if (tableBodyElem) {
|
|
720
|
+
const tableHeaderElem = tableHeader ? tableHeader.$el : null;
|
|
721
|
+
let firstTrElem;
|
|
722
|
+
firstTrElem = tableBodyElem.querySelector('tr');
|
|
723
|
+
if (!firstTrElem && tableHeaderElem) {
|
|
724
|
+
firstTrElem = tableHeaderElem.querySelector('tr');
|
|
725
|
+
}
|
|
726
|
+
if (firstTrElem) {
|
|
727
|
+
rowHeight = firstTrElem.clientHeight;
|
|
728
|
+
}
|
|
720
729
|
}
|
|
721
|
-
if (
|
|
722
|
-
rowHeight =
|
|
730
|
+
if (!rowHeight) {
|
|
731
|
+
rowHeight = defaultRowHeight;
|
|
723
732
|
}
|
|
724
733
|
}
|
|
725
|
-
|
|
734
|
+
else {
|
|
726
735
|
rowHeight = defaultRowHeight;
|
|
727
736
|
}
|
|
728
737
|
// 最低支持 18px 行高
|
|
729
738
|
return Math.max(18, rowHeight);
|
|
730
739
|
}
|
|
731
|
-
function handleVirtualYVisible($xeTable) {
|
|
732
|
-
const props = $xeTable;
|
|
740
|
+
function handleVirtualYVisible($xeTable, currScrollTop) {
|
|
733
741
|
const reactData = $xeTable;
|
|
734
742
|
const internalData = $xeTable;
|
|
735
|
-
const {
|
|
736
|
-
const {
|
|
737
|
-
const
|
|
743
|
+
const { isAllOverflow } = reactData;
|
|
744
|
+
const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData;
|
|
745
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
746
|
+
const cellOpts = $xeTable.computeCellOpts;
|
|
747
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
738
748
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
739
749
|
if (bodyScrollElem) {
|
|
740
|
-
const
|
|
750
|
+
const clientHeight = bodyScrollElem.clientHeight;
|
|
751
|
+
const scrollTop = XEUtils.isNumber(currScrollTop) ? currScrollTop : bodyScrollElem.scrollTop;
|
|
741
752
|
const endHeight = scrollTop + clientHeight;
|
|
742
753
|
let toVisibleIndex = -1;
|
|
743
754
|
let offsetTop = 0;
|
|
744
755
|
let visibleSize = 0;
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
756
|
+
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
|
|
757
|
+
if (!isCustomCellHeight && isAllOverflow) {
|
|
758
|
+
toVisibleIndex = Math.floor(scrollTop / defaultRowHeight);
|
|
759
|
+
visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1;
|
|
748
760
|
}
|
|
749
761
|
else {
|
|
750
762
|
for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
|
|
751
763
|
const row = afterFullData[rIndex];
|
|
752
764
|
const rowid = getRowid($xeTable, row);
|
|
753
|
-
const rowRest = fullAllDataRowIdData[rowid];
|
|
754
|
-
offsetTop += rowRest
|
|
765
|
+
const rowRest = fullAllDataRowIdData[rowid] || {};
|
|
766
|
+
offsetTop += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
755
767
|
if (toVisibleIndex === -1 && scrollTop < offsetTop) {
|
|
756
768
|
toVisibleIndex = rIndex;
|
|
757
769
|
}
|
|
@@ -1003,7 +1015,7 @@ function autoCellWidth($xeTable) {
|
|
|
1003
1015
|
}
|
|
1004
1016
|
const tableHeight = bodyElem.offsetHeight;
|
|
1005
1017
|
const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight;
|
|
1006
|
-
reactData.scrollbarWidth =
|
|
1018
|
+
reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth);
|
|
1007
1019
|
reactData.overflowY = overflowY;
|
|
1008
1020
|
internalData.tableWidth = tableWidth;
|
|
1009
1021
|
internalData.tableHeight = tableHeight;
|
|
@@ -1012,7 +1024,7 @@ function autoCellWidth($xeTable) {
|
|
|
1012
1024
|
const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0;
|
|
1013
1025
|
const overflowX = tableWidth > bodyWidth;
|
|
1014
1026
|
const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0;
|
|
1015
|
-
reactData.scrollbarHeight =
|
|
1027
|
+
reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight);
|
|
1016
1028
|
internalData.headerHeight = headerHeight;
|
|
1017
1029
|
internalData.footerHeight = footerHeight;
|
|
1018
1030
|
reactData.overflowX = overflowX;
|
|
@@ -1022,61 +1034,36 @@ function autoCellWidth($xeTable) {
|
|
|
1022
1034
|
$xeTable.checkScrolling();
|
|
1023
1035
|
}
|
|
1024
1036
|
}
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
// }, 80)
|
|
1038
|
-
// }
|
|
1037
|
+
const calcCellAutoHeight = (rowRest, wrapperEl) => {
|
|
1038
|
+
const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
|
|
1039
|
+
let colHeight = rowRest.height;
|
|
1040
|
+
for (let i = 0; i < cellElemList.length; i++) {
|
|
1041
|
+
const cellElem = cellElemList[i];
|
|
1042
|
+
const tdEl = cellElem.parentElement;
|
|
1043
|
+
const topBottomPadding = Math.ceil(XEUtils.toNumber(tdEl.style.paddingTop) + XEUtils.toNumber(tdEl.style.paddingBottom));
|
|
1044
|
+
const cellHeight = cellElem ? cellElem.clientHeight : 0;
|
|
1045
|
+
colHeight = Math.max(colHeight - topBottomPadding, Math.ceil(cellHeight));
|
|
1046
|
+
}
|
|
1047
|
+
return colHeight;
|
|
1048
|
+
};
|
|
1039
1049
|
const calcCellHeight = ($xeTable) => {
|
|
1040
|
-
const props = $xeTable;
|
|
1041
1050
|
const reactData = $xeTable;
|
|
1042
1051
|
const internalData = $xeTable;
|
|
1043
|
-
const {
|
|
1044
|
-
const { tableData, scrollXLoad } = reactData;
|
|
1052
|
+
const { tableData, isAllOverflow, scrollYLoad, scrollXLoad } = reactData;
|
|
1045
1053
|
const { fullAllDataRowIdData } = internalData;
|
|
1054
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
1046
1055
|
const el = $xeTable.$refs.refElem;
|
|
1047
|
-
if (!
|
|
1048
|
-
let paddingTop = 0;
|
|
1049
|
-
let paddingBottom = 0;
|
|
1050
|
-
let calcPadding = false;
|
|
1056
|
+
if (!isAllOverflow && scrollYLoad && el) {
|
|
1051
1057
|
tableData.forEach(row => {
|
|
1052
1058
|
const rowid = getRowid($xeTable, row);
|
|
1053
1059
|
const rowRest = fullAllDataRowIdData[rowid];
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
for (let i = 0; i < cellList.length; i++) {
|
|
1058
|
-
const cellElem = cellList[i];
|
|
1059
|
-
const tdEl = cellElem.parentElement;
|
|
1060
|
-
if (!tdEl || !tdEl.clientWidth) {
|
|
1061
|
-
break;
|
|
1062
|
-
}
|
|
1063
|
-
if (!calcPadding) {
|
|
1064
|
-
paddingTop = XEUtils.toNumber(getComputedStyle(tdEl).paddingTop);
|
|
1065
|
-
paddingBottom = XEUtils.toNumber(getComputedStyle(tdEl).paddingBottom);
|
|
1066
|
-
calcPadding = true;
|
|
1067
|
-
}
|
|
1068
|
-
let cellHeight = paddingTop + paddingBottom;
|
|
1069
|
-
if (cellElem) {
|
|
1070
|
-
cellHeight += cellElem.clientHeight;
|
|
1071
|
-
}
|
|
1072
|
-
height = Math.max(height, cellHeight);
|
|
1073
|
-
}
|
|
1074
|
-
rowRest.height = scrollXLoad ? Math.max(rowRest.height, height) : height;
|
|
1060
|
+
if (rowRest) {
|
|
1061
|
+
const height = calcCellAutoHeight(rowRest, el);
|
|
1062
|
+
rowRest.height = Math.max(defaultRowHeight, scrollXLoad ? Math.max(rowRest.height, height) : height);
|
|
1075
1063
|
}
|
|
1076
1064
|
});
|
|
1077
|
-
reactData.
|
|
1065
|
+
reactData.calcCellHeightFlag++;
|
|
1078
1066
|
}
|
|
1079
|
-
// updateCellOffset()
|
|
1080
1067
|
};
|
|
1081
1068
|
function getOrderField(_vm, column) {
|
|
1082
1069
|
const { sortBy, sortType } = column;
|
|
@@ -1100,6 +1087,19 @@ function getOrderField(_vm, column) {
|
|
|
1100
1087
|
return cellValue;
|
|
1101
1088
|
};
|
|
1102
1089
|
}
|
|
1090
|
+
function handleTargetEnterEvent($xeTable, isClear) {
|
|
1091
|
+
const internalData = $xeTable;
|
|
1092
|
+
const $tooltip = $xeTable.$refs.refTooltip;
|
|
1093
|
+
clearTimeout(internalData.tooltipTimeout);
|
|
1094
|
+
if (isClear) {
|
|
1095
|
+
$xeTable.closeTooltip();
|
|
1096
|
+
}
|
|
1097
|
+
else {
|
|
1098
|
+
if ($tooltip && $tooltip.setActived) {
|
|
1099
|
+
$tooltip.setActived(true);
|
|
1100
|
+
}
|
|
1101
|
+
}
|
|
1102
|
+
}
|
|
1103
1103
|
function clearDragStatus($xeTable) {
|
|
1104
1104
|
const reactData = $xeTable;
|
|
1105
1105
|
const { dragRow, dragCol } = reactData;
|
|
@@ -1198,9 +1198,11 @@ function showDropTip($xeTable, evnt, trEl, thEl, showLine, dragPos) {
|
|
|
1198
1198
|
if (!el) {
|
|
1199
1199
|
return;
|
|
1200
1200
|
}
|
|
1201
|
-
const { scrollbarWidth, scrollbarHeight } = reactData;
|
|
1201
|
+
const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData;
|
|
1202
1202
|
const { prevDragToChild } = internalData;
|
|
1203
1203
|
const wrapperRect = el.getBoundingClientRect();
|
|
1204
|
+
const osbWidth = overflowY ? scrollbarWidth : 0;
|
|
1205
|
+
const osbHeight = overflowX ? scrollbarHeight : 0;
|
|
1204
1206
|
const tableWidth = el.clientWidth;
|
|
1205
1207
|
const tableHeight = el.clientHeight;
|
|
1206
1208
|
if (trEl) {
|
|
@@ -1211,14 +1213,14 @@ function showDropTip($xeTable, evnt, trEl, thEl, showLine, dragPos) {
|
|
|
1211
1213
|
const trRect = trEl.getBoundingClientRect();
|
|
1212
1214
|
let trHeight = trEl.clientHeight;
|
|
1213
1215
|
const offsetTop = Math.max(1, trRect.y - wrapperRect.y);
|
|
1214
|
-
if (offsetTop + trHeight > tableHeight -
|
|
1215
|
-
trHeight = tableHeight - offsetTop -
|
|
1216
|
+
if (offsetTop + trHeight > tableHeight - osbHeight) {
|
|
1217
|
+
trHeight = tableHeight - offsetTop - osbHeight;
|
|
1216
1218
|
}
|
|
1217
1219
|
rdLineEl.style.display = 'block';
|
|
1218
|
-
rdLineEl.style.left = `${scrollbarYToLeft ?
|
|
1220
|
+
rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`;
|
|
1219
1221
|
rdLineEl.style.top = `${offsetTop}px`;
|
|
1220
1222
|
rdLineEl.style.height = `${trHeight}px`;
|
|
1221
|
-
rdLineEl.style.width = `${tableWidth -
|
|
1223
|
+
rdLineEl.style.width = `${tableWidth - osbWidth}px`;
|
|
1222
1224
|
rdLineEl.setAttribute('drag-pos', dragPos);
|
|
1223
1225
|
rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
|
|
1224
1226
|
}
|
|
@@ -1245,7 +1247,7 @@ function showDropTip($xeTable, evnt, trEl, thEl, showLine, dragPos) {
|
|
|
1245
1247
|
thWidth -= startX - offsetLeft;
|
|
1246
1248
|
offsetLeft = startX;
|
|
1247
1249
|
}
|
|
1248
|
-
const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 :
|
|
1250
|
+
const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth);
|
|
1249
1251
|
if (offsetLeft + thWidth > endX) {
|
|
1250
1252
|
thWidth = endX - offsetLeft;
|
|
1251
1253
|
}
|
|
@@ -1257,7 +1259,7 @@ function showDropTip($xeTable, evnt, trEl, thEl, showLine, dragPos) {
|
|
|
1257
1259
|
cdLineEl.style.height = `${thRect.height}px`;
|
|
1258
1260
|
}
|
|
1259
1261
|
else {
|
|
1260
|
-
cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 :
|
|
1262
|
+
cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`;
|
|
1261
1263
|
}
|
|
1262
1264
|
cdLineEl.setAttribute('drag-pos', dragPos);
|
|
1263
1265
|
cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n');
|
|
@@ -1289,6 +1291,41 @@ function hideDropTip($xeTable) {
|
|
|
1289
1291
|
cdLineEl.style.display = '';
|
|
1290
1292
|
}
|
|
1291
1293
|
}
|
|
1294
|
+
/**
|
|
1295
|
+
* 处理显示 tooltip
|
|
1296
|
+
* @param {Event} evnt 事件
|
|
1297
|
+
* @param {Row} row 行对象
|
|
1298
|
+
*/
|
|
1299
|
+
function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
|
|
1300
|
+
const reactData = $xeTable;
|
|
1301
|
+
if (!overflowElem) {
|
|
1302
|
+
return $xeTable.$nextTick();
|
|
1303
|
+
}
|
|
1304
|
+
params.cell = tdEl;
|
|
1305
|
+
const { tooltipStore } = reactData;
|
|
1306
|
+
const tooltipOpts = $xeTable.computeTooltipOpts;
|
|
1307
|
+
const { column, row } = params;
|
|
1308
|
+
const { showAll, contentMethod } = tooltipOpts;
|
|
1309
|
+
const customContent = contentMethod ? contentMethod(params) : null;
|
|
1310
|
+
const useCustom = contentMethod && !XEUtils.eqNull(customContent);
|
|
1311
|
+
const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim();
|
|
1312
|
+
const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth;
|
|
1313
|
+
if (content && (showAll || useCustom || isCellOverflow)) {
|
|
1314
|
+
Object.assign(tooltipStore, {
|
|
1315
|
+
row,
|
|
1316
|
+
column,
|
|
1317
|
+
visible: true,
|
|
1318
|
+
currOpts: {}
|
|
1319
|
+
});
|
|
1320
|
+
$xeTable.$nextTick(() => {
|
|
1321
|
+
const $tooltip = $xeTable.$refs.refTooltip;
|
|
1322
|
+
if ($tooltip && $tooltip.open) {
|
|
1323
|
+
$tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content));
|
|
1324
|
+
}
|
|
1325
|
+
});
|
|
1326
|
+
}
|
|
1327
|
+
return $xeTable.$nextTick();
|
|
1328
|
+
}
|
|
1292
1329
|
function handleScrollToRowColumn($xeTable, fieldOrColumn, row) {
|
|
1293
1330
|
const internalData = $xeTable;
|
|
1294
1331
|
const { fullColumnIdData } = internalData;
|
|
@@ -1305,13 +1342,13 @@ function computeScrollLoad($xeTable) {
|
|
|
1305
1342
|
return $xeTable.$nextTick().then(() => {
|
|
1306
1343
|
const { scrollXLoad, scrollYLoad } = reactData;
|
|
1307
1344
|
const { scrollXStore, scrollYStore } = internalData;
|
|
1308
|
-
const
|
|
1309
|
-
const
|
|
1345
|
+
const virtualYOpts = $xeTable.computeVirtualYOpts;
|
|
1346
|
+
const virtualXOpts = $xeTable.computeVirtualXOpts;
|
|
1310
1347
|
// 计算 X 逻辑
|
|
1311
1348
|
if (scrollXLoad) {
|
|
1312
1349
|
const { toVisibleIndex: toXVisibleIndex, visibleSize: visibleXSize } = handleVirtualXVisible($xeTable);
|
|
1313
|
-
const offsetXSize = Math.max(0,
|
|
1314
|
-
scrollXStore.preloadSize =
|
|
1350
|
+
const offsetXSize = Math.max(0, virtualXOpts.oSize ? XEUtils.toNumber(virtualXOpts.oSize) : 0);
|
|
1351
|
+
scrollXStore.preloadSize = XEUtils.toNumber(virtualXOpts.preSize);
|
|
1315
1352
|
scrollXStore.offsetSize = offsetXSize;
|
|
1316
1353
|
scrollXStore.visibleSize = visibleXSize;
|
|
1317
1354
|
scrollXStore.endIndex = Math.max(scrollXStore.startIndex + scrollXStore.visibleSize + offsetXSize, scrollXStore.endIndex);
|
|
@@ -1324,15 +1361,14 @@ function computeScrollLoad($xeTable) {
|
|
|
1324
1361
|
else {
|
|
1325
1362
|
$xeTable.updateScrollXSpace();
|
|
1326
1363
|
}
|
|
1327
|
-
calcCellHeight($xeTable);
|
|
1328
1364
|
// 计算 Y 逻辑
|
|
1329
1365
|
const rowHeight = computeRowHeight($xeTable);
|
|
1330
1366
|
scrollYStore.rowHeight = rowHeight;
|
|
1331
1367
|
reactData.rowHeight = rowHeight;
|
|
1332
1368
|
const { toVisibleIndex: toYVisibleIndex, visibleSize: visibleYSize } = handleVirtualYVisible($xeTable);
|
|
1333
1369
|
if (scrollYLoad) {
|
|
1334
|
-
const offsetYSize = Math.max(0,
|
|
1335
|
-
scrollYStore.preloadSize =
|
|
1370
|
+
const offsetYSize = Math.max(0, virtualYOpts.oSize ? XEUtils.toNumber(virtualYOpts.oSize) : 0);
|
|
1371
|
+
scrollYStore.preloadSize = XEUtils.toNumber(virtualYOpts.preSize);
|
|
1336
1372
|
scrollYStore.offsetSize = offsetYSize;
|
|
1337
1373
|
scrollYStore.visibleSize = visibleYSize;
|
|
1338
1374
|
scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex);
|
|
@@ -1577,11 +1613,10 @@ function handleColumn($xeTable, collectColumn) {
|
|
|
1577
1613
|
internalData.collectColumn = collectColumn;
|
|
1578
1614
|
const tableFullColumn = getColumnList(collectColumn);
|
|
1579
1615
|
internalData.tableFullColumn = tableFullColumn;
|
|
1580
|
-
reactData.
|
|
1616
|
+
reactData.isColLoading = true;
|
|
1581
1617
|
reactData.isDragColMove = false;
|
|
1582
1618
|
initColumnSort($xeTable);
|
|
1583
1619
|
return Promise.resolve(restoreCustomStorage($xeTable)).then(() => {
|
|
1584
|
-
reactData.isLoading = false;
|
|
1585
1620
|
cacheColumnMap($xeTable);
|
|
1586
1621
|
parseColumns($xeTable, true).then(() => {
|
|
1587
1622
|
if (reactData.scrollXLoad) {
|
|
@@ -1606,6 +1641,7 @@ function handleColumn($xeTable, collectColumn) {
|
|
|
1606
1641
|
if ($xeTable.handleUpdateCustomColumn) {
|
|
1607
1642
|
$xeTable.handleUpdateCustomColumn();
|
|
1608
1643
|
}
|
|
1644
|
+
reactData.isColLoading = false;
|
|
1609
1645
|
return $xeTable.recalculate();
|
|
1610
1646
|
});
|
|
1611
1647
|
});
|
|
@@ -1613,16 +1649,14 @@ function handleColumn($xeTable, collectColumn) {
|
|
|
1613
1649
|
/**
|
|
1614
1650
|
* 纵向 Y 可视渲染处理
|
|
1615
1651
|
*/
|
|
1616
|
-
function loadScrollYData($xeTable) {
|
|
1617
|
-
const props = $xeTable;
|
|
1652
|
+
function loadScrollYData($xeTable, scrollTop) {
|
|
1618
1653
|
const reactData = $xeTable;
|
|
1619
1654
|
const internalData = $xeTable;
|
|
1620
|
-
const {
|
|
1621
|
-
const { mergeList } = reactData;
|
|
1655
|
+
const { mergeList, isAllOverflow } = reactData;
|
|
1622
1656
|
const { scrollYStore } = internalData;
|
|
1623
1657
|
const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore;
|
|
1624
|
-
const autoOffsetYSize =
|
|
1625
|
-
const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable);
|
|
1658
|
+
const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1;
|
|
1659
|
+
const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable, scrollTop);
|
|
1626
1660
|
const offsetItem = {
|
|
1627
1661
|
startIndex: Math.max(0, toVisibleIndex - 1 - offsetSize - preloadSize),
|
|
1628
1662
|
endIndex: toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize
|
|
@@ -1639,6 +1673,42 @@ function loadScrollYData($xeTable) {
|
|
|
1639
1673
|
}
|
|
1640
1674
|
}
|
|
1641
1675
|
}
|
|
1676
|
+
function lazyScrollXData($xeTable) {
|
|
1677
|
+
const internalData = $xeTable;
|
|
1678
|
+
const { lxTimeout, lxRunTime, scrollXStore } = internalData;
|
|
1679
|
+
const { visibleSize } = scrollXStore;
|
|
1680
|
+
const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)));
|
|
1681
|
+
if (lxTimeout) {
|
|
1682
|
+
clearTimeout(lxTimeout);
|
|
1683
|
+
}
|
|
1684
|
+
if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
|
|
1685
|
+
internalData.lxRunTime = Date.now();
|
|
1686
|
+
loadScrollXData($xeTable);
|
|
1687
|
+
}
|
|
1688
|
+
internalData.lxTimeout = setTimeout(() => {
|
|
1689
|
+
internalData.lxTimeout = undefined;
|
|
1690
|
+
internalData.lxRunTime = undefined;
|
|
1691
|
+
loadScrollXData($xeTable);
|
|
1692
|
+
}, fpsTime);
|
|
1693
|
+
}
|
|
1694
|
+
function lazyScrollYData($xeTable) {
|
|
1695
|
+
const internalData = $xeTable;
|
|
1696
|
+
const { lyTimeout, lyRunTime, scrollYStore } = internalData;
|
|
1697
|
+
const { visibleSize } = scrollYStore;
|
|
1698
|
+
const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)));
|
|
1699
|
+
if (lyTimeout) {
|
|
1700
|
+
clearTimeout(lyTimeout);
|
|
1701
|
+
}
|
|
1702
|
+
if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
|
|
1703
|
+
internalData.lyRunTime = Date.now();
|
|
1704
|
+
loadScrollYData($xeTable);
|
|
1705
|
+
}
|
|
1706
|
+
internalData.lyTimeout = setTimeout(() => {
|
|
1707
|
+
internalData.lyTimeout = undefined;
|
|
1708
|
+
internalData.lyRunTime = undefined;
|
|
1709
|
+
loadScrollYData($xeTable);
|
|
1710
|
+
}, fpsTime);
|
|
1711
|
+
}
|
|
1642
1712
|
function checkLastSyncScroll($xeTable, isRollX, isRollY) {
|
|
1643
1713
|
const reactData = $xeTable;
|
|
1644
1714
|
const internalData = $xeTable;
|
|
@@ -1650,27 +1720,68 @@ function checkLastSyncScroll($xeTable, isRollX, isRollY) {
|
|
|
1650
1720
|
internalData.lcsTimeout = setTimeout(() => {
|
|
1651
1721
|
internalData.lcsRunTime = Date.now();
|
|
1652
1722
|
internalData.lcsTimeout = undefined;
|
|
1723
|
+
internalData.intoRunScroll = false;
|
|
1653
1724
|
internalData.inVirtualScroll = false;
|
|
1654
1725
|
internalData.inWheelScroll = false;
|
|
1655
1726
|
internalData.inHeaderScroll = false;
|
|
1656
1727
|
internalData.inBodyScroll = false;
|
|
1657
1728
|
internalData.inFooterScroll = false;
|
|
1658
1729
|
internalData.scrollRenderType = '';
|
|
1730
|
+
calcCellHeight($xeTable);
|
|
1659
1731
|
if (isRollX && scrollXLoad) {
|
|
1660
|
-
$xeTable.updateScrollXData()
|
|
1661
|
-
calcCellHeight($xeTable);
|
|
1662
|
-
loadScrollXData($xeTable);
|
|
1663
|
-
});
|
|
1732
|
+
$xeTable.updateScrollXData();
|
|
1664
1733
|
}
|
|
1665
1734
|
if (isRollY && scrollYLoad) {
|
|
1666
1735
|
$xeTable.updateScrollYData().then(() => {
|
|
1667
1736
|
calcCellHeight($xeTable);
|
|
1668
|
-
|
|
1737
|
+
$xeTable.updateScrollYSpace();
|
|
1669
1738
|
});
|
|
1670
1739
|
}
|
|
1671
1740
|
$xeTable.updateCellAreas();
|
|
1672
1741
|
}, 200);
|
|
1673
1742
|
}
|
|
1743
|
+
const getWheelSpeed = (lastScrollTime) => {
|
|
1744
|
+
let multiple = 1;
|
|
1745
|
+
const currTime = Date.now();
|
|
1746
|
+
if (lastScrollTime + 25 > currTime) {
|
|
1747
|
+
multiple = 1.18;
|
|
1748
|
+
}
|
|
1749
|
+
else if (lastScrollTime + 30 > currTime) {
|
|
1750
|
+
multiple = 1.15;
|
|
1751
|
+
}
|
|
1752
|
+
else if (lastScrollTime + 40 > currTime) {
|
|
1753
|
+
multiple = 1.12;
|
|
1754
|
+
}
|
|
1755
|
+
else if (lastScrollTime + 55 > currTime) {
|
|
1756
|
+
multiple = 1.09;
|
|
1757
|
+
}
|
|
1758
|
+
else if (lastScrollTime + 75 > currTime) {
|
|
1759
|
+
multiple = 1.06;
|
|
1760
|
+
}
|
|
1761
|
+
else if (lastScrollTime + 100 > currTime) {
|
|
1762
|
+
multiple = 1.03;
|
|
1763
|
+
}
|
|
1764
|
+
return multiple;
|
|
1765
|
+
};
|
|
1766
|
+
const wheelScrollTo = (diffNum, cb) => {
|
|
1767
|
+
const duration = Math.abs(diffNum);
|
|
1768
|
+
const startTime = performance.now();
|
|
1769
|
+
let countTop = 0;
|
|
1770
|
+
const step = (timestamp) => {
|
|
1771
|
+
let progress = (timestamp - startTime) / duration;
|
|
1772
|
+
if (progress > 1) {
|
|
1773
|
+
progress = 1;
|
|
1774
|
+
}
|
|
1775
|
+
const easedProgress = Math.pow(progress, 2);
|
|
1776
|
+
const offsetTop = Math.floor((diffNum * easedProgress)) - countTop;
|
|
1777
|
+
countTop += offsetTop;
|
|
1778
|
+
cb(offsetTop);
|
|
1779
|
+
if (progress < 1) {
|
|
1780
|
+
requestAnimationFrame(step);
|
|
1781
|
+
}
|
|
1782
|
+
};
|
|
1783
|
+
requestAnimationFrame(step);
|
|
1784
|
+
};
|
|
1674
1785
|
function updateHeight($xeTable) {
|
|
1675
1786
|
const internalData = $xeTable;
|
|
1676
1787
|
internalData.customHeight = calcTableHeight($xeTable, 'height');
|
|
@@ -1678,58 +1789,60 @@ function updateHeight($xeTable) {
|
|
|
1678
1789
|
internalData.customMaxHeight = calcTableHeight($xeTable, 'maxHeight');
|
|
1679
1790
|
}
|
|
1680
1791
|
function calcColumnAutoWidth(column, wrapperEl) {
|
|
1681
|
-
const
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
if (firstCellEl) {
|
|
1685
|
-
const cellStyle = getComputedStyle(firstCellEl);
|
|
1686
|
-
|
|
1792
|
+
const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[colid="${column.id}"]`);
|
|
1793
|
+
let leftRightPadding = 0;
|
|
1794
|
+
const firstCellEl = cellElemList[0];
|
|
1795
|
+
if (firstCellEl && firstCellEl.parentElement) {
|
|
1796
|
+
const cellStyle = getComputedStyle(firstCellEl.parentElement);
|
|
1797
|
+
leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight));
|
|
1687
1798
|
}
|
|
1688
|
-
let colWidth = column.renderAutoWidth -
|
|
1689
|
-
|
|
1690
|
-
const
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
XEUtils.arrayEach(cellEl.children, (btnEl) => {
|
|
1695
|
-
titleWidth += btnEl.offsetWidth + 1;
|
|
1696
|
-
});
|
|
1697
|
-
}
|
|
1698
|
-
else {
|
|
1699
|
-
const labelEl = cellEl.firstElementChild;
|
|
1700
|
-
if (labelEl) {
|
|
1701
|
-
titleWidth = labelEl.offsetWidth;
|
|
1702
|
-
}
|
|
1703
|
-
}
|
|
1704
|
-
if (titleWidth) {
|
|
1705
|
-
colWidth = Math.max(colWidth, Math.ceil(titleWidth) + 4);
|
|
1706
|
-
}
|
|
1707
|
-
});
|
|
1708
|
-
return colWidth + paddingSize;
|
|
1799
|
+
let colWidth = column.renderAutoWidth - leftRightPadding;
|
|
1800
|
+
for (let i = 0; i < cellElemList.length; i++) {
|
|
1801
|
+
const celEl = cellElemList[i];
|
|
1802
|
+
colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0);
|
|
1803
|
+
}
|
|
1804
|
+
return colWidth + leftRightPadding;
|
|
1709
1805
|
}
|
|
1710
1806
|
function calcCellWidth($xeTable) {
|
|
1711
|
-
const reactData = $xeTable;
|
|
1712
1807
|
const internalData = $xeTable;
|
|
1713
1808
|
const autoWidthColumnList = $xeTable.computeAutoWidthColumnList;
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
reactData.isCalcColumn = false;
|
|
1731
|
-
});
|
|
1809
|
+
const { fullColumnIdData } = internalData;
|
|
1810
|
+
const el = $xeTable.$refs.refElem;
|
|
1811
|
+
if (el) {
|
|
1812
|
+
el.setAttribute('data-calc-col', 'Y');
|
|
1813
|
+
autoWidthColumnList.forEach(column => {
|
|
1814
|
+
const colid = column.id;
|
|
1815
|
+
const colRest = fullColumnIdData[colid];
|
|
1816
|
+
const colWidth = calcColumnAutoWidth(column, el);
|
|
1817
|
+
if (colRest) {
|
|
1818
|
+
colRest.width = Math.max(colWidth, colRest.width);
|
|
1819
|
+
}
|
|
1820
|
+
column.renderAutoWidth = colWidth;
|
|
1821
|
+
});
|
|
1822
|
+
$xeTable.analyColumnWidth();
|
|
1823
|
+
el.removeAttribute('data-calc-col');
|
|
1824
|
+
}
|
|
1732
1825
|
}
|
|
1826
|
+
const handleUpdateColResize = ($xeTable, evnt, params) => {
|
|
1827
|
+
$xeTable.analyColumnWidth();
|
|
1828
|
+
$xeTable.recalculate(true).then(() => {
|
|
1829
|
+
$xeTable.saveCustomStore('update:width');
|
|
1830
|
+
$xeTable.updateCellAreas();
|
|
1831
|
+
$xeTable.dispatchEvent('column-resizable-change', params, evnt);
|
|
1832
|
+
// 已废弃 resizable-change
|
|
1833
|
+
$xeTable.dispatchEvent('resizable-change', params, evnt);
|
|
1834
|
+
setTimeout(() => $xeTable.recalculate(true), 300);
|
|
1835
|
+
});
|
|
1836
|
+
};
|
|
1837
|
+
const handleUpdateRowResize = ($xeTable, evnt, params) => {
|
|
1838
|
+
const reactData = $xeTable;
|
|
1839
|
+
reactData.resizeHeightFlag++;
|
|
1840
|
+
$xeTable.recalculate(true).then(() => {
|
|
1841
|
+
$xeTable.updateCellAreas();
|
|
1842
|
+
$xeTable.dispatchEvent('row-resizable-change', params, evnt);
|
|
1843
|
+
setTimeout(() => $xeTable.recalculate(true), 300);
|
|
1844
|
+
});
|
|
1845
|
+
};
|
|
1733
1846
|
const Methods = {
|
|
1734
1847
|
callSlot(slotFunc, params, h, vNodes) {
|
|
1735
1848
|
if (slotFunc) {
|
|
@@ -1783,7 +1896,7 @@ const Methods = {
|
|
|
1783
1896
|
warnLog('vxe.error.delFunc', ['syncData', 'getData']);
|
|
1784
1897
|
return this.$nextTick().then(() => {
|
|
1785
1898
|
this.tableData = [];
|
|
1786
|
-
return this.$nextTick().then(() => this.loadTableData(this.tableFullData));
|
|
1899
|
+
return this.$nextTick().then(() => this.loadTableData(this.tableFullData, true));
|
|
1787
1900
|
});
|
|
1788
1901
|
},
|
|
1789
1902
|
/**
|
|
@@ -1837,11 +1950,12 @@ const Methods = {
|
|
|
1837
1950
|
* 加载表格数据
|
|
1838
1951
|
* @param {Array} datas 数据
|
|
1839
1952
|
*/
|
|
1840
|
-
loadTableData(datas) {
|
|
1953
|
+
loadTableData(datas, isReset) {
|
|
1841
1954
|
const $xeTable = this;
|
|
1842
|
-
const
|
|
1955
|
+
const reactData = $xeTable;
|
|
1956
|
+
const internalData = $xeTable;
|
|
1957
|
+
const { keepSource, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this;
|
|
1843
1958
|
const childrenField = treeOpts.children || treeOpts.childrenField;
|
|
1844
|
-
const rowOpts = $xeTable.computeRowOpts;
|
|
1845
1959
|
let treeData = [];
|
|
1846
1960
|
let fullData = datas ? datas.slice(0) : [];
|
|
1847
1961
|
if (treeConfig) {
|
|
@@ -1885,42 +1999,30 @@ const Methods = {
|
|
|
1885
1999
|
scrollYStore.endIndex = 1;
|
|
1886
2000
|
scrollXStore.startIndex = 0;
|
|
1887
2001
|
scrollXStore.endIndex = 1;
|
|
2002
|
+
reactData.isRowLoading = true;
|
|
2003
|
+
reactData.scrollVMLoading = false;
|
|
1888
2004
|
editStore.insertMaps = {};
|
|
1889
|
-
editStore.removeList = [];
|
|
1890
2005
|
editStore.removeMaps = {};
|
|
1891
2006
|
const sYLoad = updateScrollYStatus($xeTable, fullData);
|
|
1892
|
-
|
|
2007
|
+
reactData.isDragColMove = false;
|
|
2008
|
+
reactData.isDragRowMove = false;
|
|
1893
2009
|
// 全量数据
|
|
1894
|
-
|
|
1895
|
-
|
|
2010
|
+
internalData.tableFullData = fullData;
|
|
2011
|
+
internalData.tableFullTreeData = treeData;
|
|
1896
2012
|
// 缓存数据
|
|
1897
|
-
|
|
2013
|
+
$xeTable.cacheRowMap(true, isReset);
|
|
1898
2014
|
// 原始数据
|
|
1899
|
-
|
|
2015
|
+
internalData.tableSynchData = datas;
|
|
2016
|
+
if (isReset) {
|
|
2017
|
+
internalData.isResizeCellHeight = false;
|
|
2018
|
+
reactData.rowExpandedMaps = {};
|
|
2019
|
+
reactData.rowExpandLazyLoadedMaps = {};
|
|
2020
|
+
reactData.treeExpandedMaps = {};
|
|
2021
|
+
reactData.treeExpandLazyLoadedMaps = {};
|
|
2022
|
+
}
|
|
1900
2023
|
// 克隆原数据,用于显示编辑状态,与编辑值做对比
|
|
1901
2024
|
if (keepSource) {
|
|
1902
|
-
|
|
1903
|
-
}
|
|
1904
|
-
if (sYLoad) {
|
|
1905
|
-
if (showOverflow) {
|
|
1906
|
-
if (!rowOpts.height) {
|
|
1907
|
-
const errColumn = this.tableFullColumn.find((column) => column.showOverflow === false);
|
|
1908
|
-
if (errColumn) {
|
|
1909
|
-
errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true']);
|
|
1910
|
-
}
|
|
1911
|
-
}
|
|
1912
|
-
}
|
|
1913
|
-
if (process.env.NODE_ENV === 'development') {
|
|
1914
|
-
if (!(this.height || this.maxHeight)) {
|
|
1915
|
-
errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']);
|
|
1916
|
-
}
|
|
1917
|
-
// if (!this.showOverflow) {
|
|
1918
|
-
// warnLog('vxe.error.reqProp', ['table.show-overflow'])
|
|
1919
|
-
// }
|
|
1920
|
-
if (this.spanMethod) {
|
|
1921
|
-
warnLog('vxe.error.scrollErrProp', ['table.span-method']);
|
|
1922
|
-
}
|
|
1923
|
-
}
|
|
2025
|
+
$xeTable.cacheSourceMap(fullData);
|
|
1924
2026
|
}
|
|
1925
2027
|
if (this.clearCellAreas && this.mouseConfig) {
|
|
1926
2028
|
this.clearCellAreas();
|
|
@@ -1940,6 +2042,27 @@ const Methods = {
|
|
|
1940
2042
|
if (sYLoad) {
|
|
1941
2043
|
scrollYStore.endIndex = scrollYStore.visibleSize;
|
|
1942
2044
|
}
|
|
2045
|
+
if (sYLoad) {
|
|
2046
|
+
// if (showOverflow) {
|
|
2047
|
+
// if (!rowOpts.height) {
|
|
2048
|
+
// const errColumn = this.tableFullColumn.find((column: any) => column.showOverflow === false)
|
|
2049
|
+
// if (errColumn) {
|
|
2050
|
+
// errLog('vxe.error.errProp', [`column[field="${errColumn.field}"].show-overflow=false`, 'show-overflow=true'])
|
|
2051
|
+
// }
|
|
2052
|
+
// }
|
|
2053
|
+
// }
|
|
2054
|
+
if (process.env.NODE_ENV === 'development') {
|
|
2055
|
+
if (!(this.height || this.maxHeight)) {
|
|
2056
|
+
errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']);
|
|
2057
|
+
}
|
|
2058
|
+
// if (!this.showOverflow) {
|
|
2059
|
+
// warnLog('vxe.error.reqProp', ['table.show-overflow'])
|
|
2060
|
+
// }
|
|
2061
|
+
if (this.spanMethod) {
|
|
2062
|
+
warnLog('vxe.error.scrollErrProp', ['table.span-method']);
|
|
2063
|
+
}
|
|
2064
|
+
}
|
|
2065
|
+
}
|
|
1943
2066
|
this.handleReserveStatus();
|
|
1944
2067
|
this.checkSelectionStatus();
|
|
1945
2068
|
return new Promise(resolve => {
|
|
@@ -1955,6 +2078,8 @@ const Methods = {
|
|
|
1955
2078
|
if (sYOpts.scrollToTopOnChange) {
|
|
1956
2079
|
targetScrollTop = 0;
|
|
1957
2080
|
}
|
|
2081
|
+
reactData.isRowLoading = false;
|
|
2082
|
+
calcCellHeight($xeTable);
|
|
1958
2083
|
// 是否变更虚拟滚动
|
|
1959
2084
|
if (oldScrollYLoad === sYLoad) {
|
|
1960
2085
|
restoreScrollLocation(this, targetScrollLeft, targetScrollTop)
|
|
@@ -1980,7 +2105,7 @@ const Methods = {
|
|
|
1980
2105
|
*/
|
|
1981
2106
|
loadData(datas) {
|
|
1982
2107
|
const { initStatus } = this;
|
|
1983
|
-
return this.loadTableData(datas).then(() => {
|
|
2108
|
+
return this.loadTableData(datas, false).then(() => {
|
|
1984
2109
|
this.inited = true;
|
|
1985
2110
|
this.initStatus = true;
|
|
1986
2111
|
if (!initStatus) {
|
|
@@ -1998,7 +2123,7 @@ const Methods = {
|
|
|
1998
2123
|
.then(() => {
|
|
1999
2124
|
this.inited = true;
|
|
2000
2125
|
this.initStatus = true;
|
|
2001
|
-
return this.loadTableData(datas);
|
|
2126
|
+
return this.loadTableData(datas, true);
|
|
2002
2127
|
})
|
|
2003
2128
|
.then(() => {
|
|
2004
2129
|
this.handleLoadDefaults();
|
|
@@ -2076,9 +2201,8 @@ const Methods = {
|
|
|
2076
2201
|
},
|
|
2077
2202
|
/**
|
|
2078
2203
|
* 更新数据行的 Map
|
|
2079
|
-
* 牺牲数据组装的耗时,用来换取使用过程中的流畅
|
|
2080
2204
|
*/
|
|
2081
|
-
cacheRowMap(isSource) {
|
|
2205
|
+
cacheRowMap(isReset, isSource) {
|
|
2082
2206
|
const { treeConfig, treeOpts, tableFullData, fullAllDataRowIdData, tableFullTreeData } = this;
|
|
2083
2207
|
const childrenField = treeOpts.children || treeOpts.childrenField;
|
|
2084
2208
|
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
|
|
@@ -2098,8 +2222,8 @@ const Methods = {
|
|
|
2098
2222
|
row[childrenField] = null;
|
|
2099
2223
|
}
|
|
2100
2224
|
let cacheItem = fullAllDataRowIdData[rowid];
|
|
2101
|
-
if (!cacheItem) {
|
|
2102
|
-
cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, oTop: 0 };
|
|
2225
|
+
if (isReset || !cacheItem) {
|
|
2226
|
+
cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0 };
|
|
2103
2227
|
}
|
|
2104
2228
|
cacheItem.row = row;
|
|
2105
2229
|
cacheItem.items = items;
|
|
@@ -2173,7 +2297,7 @@ const Methods = {
|
|
|
2173
2297
|
XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
|
|
2174
2298
|
const rowid = getRowid($xeTable, childRow);
|
|
2175
2299
|
const parentRow = parentItem || parentRest.row;
|
|
2176
|
-
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 };
|
|
2300
|
+
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 };
|
|
2177
2301
|
fullDataRowIdData[rowid] = rest;
|
|
2178
2302
|
fullAllDataRowIdData[rowid] = rest;
|
|
2179
2303
|
}, { children: childrenField });
|
|
@@ -2529,18 +2653,37 @@ const Methods = {
|
|
|
2529
2653
|
return this.$nextTick();
|
|
2530
2654
|
},
|
|
2531
2655
|
getCellElement(row, fieldOrColumn) {
|
|
2532
|
-
const
|
|
2656
|
+
const $xeTable = this;
|
|
2657
|
+
const internalData = $xeTable;
|
|
2658
|
+
const { elemStore } = internalData;
|
|
2659
|
+
const column = handleFieldOrColumn($xeTable, fieldOrColumn);
|
|
2533
2660
|
if (!column) {
|
|
2534
2661
|
return null;
|
|
2535
2662
|
}
|
|
2536
|
-
const
|
|
2537
|
-
const
|
|
2538
|
-
|
|
2663
|
+
const rowid = getRowid($xeTable, row);
|
|
2664
|
+
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
2665
|
+
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
|
|
2666
|
+
const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
|
|
2667
|
+
let bodyElem;
|
|
2539
2668
|
if (column) {
|
|
2540
|
-
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2669
|
+
if (column.fixed) {
|
|
2670
|
+
if (column.fixed === 'left') {
|
|
2671
|
+
if (leftScrollElem) {
|
|
2672
|
+
bodyElem = leftScrollElem;
|
|
2673
|
+
}
|
|
2674
|
+
}
|
|
2675
|
+
else {
|
|
2676
|
+
if (rightScrollElem) {
|
|
2677
|
+
bodyElem = rightScrollElem;
|
|
2678
|
+
}
|
|
2679
|
+
}
|
|
2680
|
+
}
|
|
2681
|
+
if (!bodyElem) {
|
|
2682
|
+
bodyElem = bodyScrollElem;
|
|
2683
|
+
}
|
|
2684
|
+
if (bodyElem) {
|
|
2685
|
+
return bodyElem.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`);
|
|
2686
|
+
}
|
|
2544
2687
|
}
|
|
2545
2688
|
return null;
|
|
2546
2689
|
},
|
|
@@ -2943,7 +3086,9 @@ const Methods = {
|
|
|
2943
3086
|
* @param {String/Number} rowid 行主键
|
|
2944
3087
|
*/
|
|
2945
3088
|
getRowById(cellValue) {
|
|
2946
|
-
const
|
|
3089
|
+
const $xeTable = this;
|
|
3090
|
+
const internalData = $xeTable;
|
|
3091
|
+
const { fullDataRowIdData } = internalData;
|
|
2947
3092
|
const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue);
|
|
2948
3093
|
return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null;
|
|
2949
3094
|
},
|
|
@@ -2951,12 +3096,9 @@ const Methods = {
|
|
|
2951
3096
|
* 根据行获取行的唯一主键
|
|
2952
3097
|
* @param {Row} row 行对象
|
|
2953
3098
|
*/
|
|
2954
|
-
getRowid(
|
|
3099
|
+
getRowid(row) {
|
|
2955
3100
|
const $xeTable = this;
|
|
2956
|
-
|
|
2957
|
-
const { fullDataRowIdData } = internalData;
|
|
2958
|
-
const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue || '');
|
|
2959
|
-
return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null;
|
|
3101
|
+
return getRowid($xeTable, row);
|
|
2960
3102
|
},
|
|
2961
3103
|
/**
|
|
2962
3104
|
* 获取处理后的表格数据
|
|
@@ -3141,29 +3283,35 @@ const Methods = {
|
|
|
3141
3283
|
},
|
|
3142
3284
|
setColumnWidth(fieldOrColumn, width) {
|
|
3143
3285
|
const $xeTable = this;
|
|
3286
|
+
const internalData = $xeTable;
|
|
3287
|
+
const { elemStore } = internalData;
|
|
3144
3288
|
let status = false;
|
|
3145
3289
|
const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn];
|
|
3146
|
-
|
|
3147
|
-
|
|
3148
|
-
|
|
3149
|
-
|
|
3150
|
-
|
|
3151
|
-
|
|
3152
|
-
|
|
3153
|
-
|
|
3154
|
-
|
|
3155
|
-
|
|
3156
|
-
|
|
3157
|
-
|
|
3158
|
-
|
|
3159
|
-
|
|
3290
|
+
let cWidth = XEUtils.toInteger(width);
|
|
3291
|
+
if (isScale(width)) {
|
|
3292
|
+
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
3293
|
+
const bodyWidth = bodyScrollElem ? bodyScrollElem.clientWidth - 1 : 0;
|
|
3294
|
+
cWidth = Math.floor(cWidth * bodyWidth);
|
|
3295
|
+
}
|
|
3296
|
+
if (cWidth) {
|
|
3297
|
+
cols.forEach(item => {
|
|
3298
|
+
const column = handleFieldOrColumn($xeTable, item);
|
|
3299
|
+
if (column) {
|
|
3300
|
+
column.resizeWidth = cWidth;
|
|
3301
|
+
if (!status) {
|
|
3302
|
+
status = true;
|
|
3303
|
+
}
|
|
3160
3304
|
}
|
|
3305
|
+
});
|
|
3306
|
+
if (status) {
|
|
3307
|
+
return $xeTable.refreshColumn().then(() => {
|
|
3308
|
+
return { status };
|
|
3309
|
+
});
|
|
3161
3310
|
}
|
|
3162
|
-
});
|
|
3163
|
-
if (status) {
|
|
3164
|
-
return $xeTable.refreshColumn();
|
|
3165
3311
|
}
|
|
3166
|
-
return $xeTable.$nextTick()
|
|
3312
|
+
return $xeTable.$nextTick().then(() => {
|
|
3313
|
+
return { status };
|
|
3314
|
+
});
|
|
3167
3315
|
},
|
|
3168
3316
|
getColumnWidth(fieldOrColumn) {
|
|
3169
3317
|
const column = handleFieldOrColumn(this, fieldOrColumn);
|
|
@@ -3456,7 +3604,151 @@ const Methods = {
|
|
|
3456
3604
|
});
|
|
3457
3605
|
Object.assign(this.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList });
|
|
3458
3606
|
},
|
|
3459
|
-
|
|
3607
|
+
handleColResizeMousedownEvent(evnt, fixedType, params) {
|
|
3608
|
+
const $xeTable = this;
|
|
3609
|
+
const reactData = $xeTable;
|
|
3610
|
+
const internalData = $xeTable;
|
|
3611
|
+
evnt.stopPropagation();
|
|
3612
|
+
evnt.preventDefault();
|
|
3613
|
+
const { column } = params;
|
|
3614
|
+
const { overflowX, scrollbarHeight } = reactData;
|
|
3615
|
+
const { elemStore, visibleColumn } = internalData;
|
|
3616
|
+
const resizableOpts = $xeTable.computeResizableOpts;
|
|
3617
|
+
const osbHeight = overflowX ? scrollbarHeight : 0;
|
|
3618
|
+
const tableEl = $xeTable.$refs.refElem;
|
|
3619
|
+
const leftContainerElem = $xeTable.$refs.refLeftContainer;
|
|
3620
|
+
const rightContainerElem = $xeTable.$refs.refRightContainer;
|
|
3621
|
+
const resizeBarElem = $xeTable.$refs.refColResizeBar;
|
|
3622
|
+
if (!resizeBarElem) {
|
|
3623
|
+
return;
|
|
3624
|
+
}
|
|
3625
|
+
const resizeTipElem = resizeBarElem.firstElementChild;
|
|
3626
|
+
const scrollbarXToTop = $xeTable.computeScrollbarXToTop;
|
|
3627
|
+
const { clientX: dragClientX } = evnt;
|
|
3628
|
+
const wrapperElem = $xeTable.$refs.refElem;
|
|
3629
|
+
const dragBtnElem = evnt.target;
|
|
3630
|
+
let resizeColumn = column;
|
|
3631
|
+
if (column.children && column.children.length) {
|
|
3632
|
+
XEUtils.eachTree(column.children, childColumn => {
|
|
3633
|
+
resizeColumn = childColumn;
|
|
3634
|
+
});
|
|
3635
|
+
}
|
|
3636
|
+
const cell = dragBtnElem.parentNode;
|
|
3637
|
+
const cellParams = Object.assign(params, { cell });
|
|
3638
|
+
let dragLeft = 0;
|
|
3639
|
+
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
3640
|
+
if (!bodyScrollElem) {
|
|
3641
|
+
return;
|
|
3642
|
+
}
|
|
3643
|
+
const pos = getOffsetPos(dragBtnElem, wrapperElem);
|
|
3644
|
+
const dragBtnWidth = dragBtnElem.clientWidth;
|
|
3645
|
+
const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2);
|
|
3646
|
+
const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth; // 列之间的最小间距
|
|
3647
|
+
let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval;
|
|
3648
|
+
let dragPosLeft = pos.left + dragBtnOffsetWidth;
|
|
3649
|
+
const isLeftFixed = fixedType === 'left';
|
|
3650
|
+
const isRightFixed = fixedType === 'right';
|
|
3651
|
+
// 计算左右侧固定列偏移量
|
|
3652
|
+
let fixedOffsetWidth = 0;
|
|
3653
|
+
if (isLeftFixed || isRightFixed) {
|
|
3654
|
+
const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling';
|
|
3655
|
+
let tempCellElem = cell[siblingProp];
|
|
3656
|
+
while (tempCellElem) {
|
|
3657
|
+
if (hasClass(tempCellElem, 'fixed--hidden')) {
|
|
3658
|
+
break;
|
|
3659
|
+
}
|
|
3660
|
+
else if (!hasClass(tempCellElem, 'col--group')) {
|
|
3661
|
+
fixedOffsetWidth += tempCellElem.offsetWidth;
|
|
3662
|
+
}
|
|
3663
|
+
tempCellElem = tempCellElem[siblingProp];
|
|
3664
|
+
}
|
|
3665
|
+
if (isRightFixed && rightContainerElem) {
|
|
3666
|
+
dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth;
|
|
3667
|
+
}
|
|
3668
|
+
}
|
|
3669
|
+
// 处理拖动事件
|
|
3670
|
+
const updateEvent = (evnt) => {
|
|
3671
|
+
evnt.stopPropagation();
|
|
3672
|
+
evnt.preventDefault();
|
|
3673
|
+
const tableHeight = tableEl.clientHeight;
|
|
3674
|
+
const offsetX = evnt.clientX - dragClientX;
|
|
3675
|
+
let left = dragPosLeft + offsetX;
|
|
3676
|
+
const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft;
|
|
3677
|
+
if (isLeftFixed) {
|
|
3678
|
+
// 左固定列(不允许超过右侧固定列、不允许超过右边距)
|
|
3679
|
+
left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval);
|
|
3680
|
+
}
|
|
3681
|
+
else if (isRightFixed) {
|
|
3682
|
+
// 右侧固定列(不允许超过左侧固定列、不允许超过左边距)
|
|
3683
|
+
dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval;
|
|
3684
|
+
left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval);
|
|
3685
|
+
}
|
|
3686
|
+
else {
|
|
3687
|
+
dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft);
|
|
3688
|
+
// left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
|
|
3689
|
+
}
|
|
3690
|
+
dragLeft = Math.max(left, dragMinLeft);
|
|
3691
|
+
const resizeBarLeft = Math.max(1, dragLeft - scrollLeft);
|
|
3692
|
+
resizeBarElem.style.left = `${resizeBarLeft}px`;
|
|
3693
|
+
resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`;
|
|
3694
|
+
resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - osbHeight : tableHeight}px`;
|
|
3695
|
+
if (resizableOpts.showDragTip && resizeTipElem) {
|
|
3696
|
+
resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)]);
|
|
3697
|
+
const tableWidth = tableEl.clientWidth;
|
|
3698
|
+
const wrapperRect = wrapperElem.getBoundingClientRect();
|
|
3699
|
+
const resizeBarWidth = resizeBarElem.clientWidth;
|
|
3700
|
+
const resizeTipWidth = resizeTipElem.clientWidth;
|
|
3701
|
+
const resizeTipHeight = resizeTipElem.clientHeight;
|
|
3702
|
+
let resizeTipLeft = -resizeTipWidth;
|
|
3703
|
+
if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
|
|
3704
|
+
resizeTipLeft = 0;
|
|
3705
|
+
}
|
|
3706
|
+
else if (resizeBarLeft > tableWidth) {
|
|
3707
|
+
resizeTipLeft += tableWidth - resizeBarLeft;
|
|
3708
|
+
}
|
|
3709
|
+
resizeTipElem.style.left = `${resizeTipLeft}px`;
|
|
3710
|
+
resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`;
|
|
3711
|
+
}
|
|
3712
|
+
reactData.isDragResize = true;
|
|
3713
|
+
};
|
|
3714
|
+
reactData.isDragResize = true;
|
|
3715
|
+
addClass(tableEl, 'col-drag--resize');
|
|
3716
|
+
resizeBarElem.style.display = 'block';
|
|
3717
|
+
document.onmousemove = updateEvent;
|
|
3718
|
+
document.onmouseup = function (evnt) {
|
|
3719
|
+
document.onmousemove = null;
|
|
3720
|
+
document.onmouseup = null;
|
|
3721
|
+
resizeBarElem.style.display = 'none';
|
|
3722
|
+
internalData._lastResizeTime = Date.now();
|
|
3723
|
+
setTimeout(() => {
|
|
3724
|
+
reactData.isDragResize = false;
|
|
3725
|
+
}, 50);
|
|
3726
|
+
const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft);
|
|
3727
|
+
const resizeParams = Object.assign(Object.assign({}, params), { resizeWidth, resizeColumn });
|
|
3728
|
+
if (resizableOpts.dragMode === 'fixed') {
|
|
3729
|
+
visibleColumn.forEach(item => {
|
|
3730
|
+
if (item.id !== resizeColumn.id) {
|
|
3731
|
+
if (!item.resizeWidth) {
|
|
3732
|
+
item.resizeWidth = item.renderWidth;
|
|
3733
|
+
}
|
|
3734
|
+
}
|
|
3735
|
+
});
|
|
3736
|
+
}
|
|
3737
|
+
if ($xeTable.handleColResizeCellAreaEvent) {
|
|
3738
|
+
$xeTable.handleColResizeCellAreaEvent(evnt, resizeParams);
|
|
3739
|
+
}
|
|
3740
|
+
else {
|
|
3741
|
+
resizeColumn.resizeWidth = resizeWidth;
|
|
3742
|
+
handleUpdateColResize($xeTable, evnt, resizeParams);
|
|
3743
|
+
}
|
|
3744
|
+
removeClass(tableEl, 'col-drag--resize');
|
|
3745
|
+
};
|
|
3746
|
+
updateEvent(evnt);
|
|
3747
|
+
if ($xeTable.closeMenu) {
|
|
3748
|
+
$xeTable.closeMenu();
|
|
3749
|
+
}
|
|
3750
|
+
},
|
|
3751
|
+
handleColResizeDblclickEvent(evnt, params) {
|
|
3460
3752
|
const $xeTable = this;
|
|
3461
3753
|
const reactData = $xeTable;
|
|
3462
3754
|
const internalData = $xeTable;
|
|
@@ -3464,6 +3756,8 @@ const Methods = {
|
|
|
3464
3756
|
const { isDblclickAutoWidth } = resizableOpts;
|
|
3465
3757
|
const el = $xeTable.$refs.refElem;
|
|
3466
3758
|
if (isDblclickAutoWidth && el) {
|
|
3759
|
+
evnt.stopPropagation();
|
|
3760
|
+
evnt.preventDefault();
|
|
3467
3761
|
const { fullColumnIdData } = internalData;
|
|
3468
3762
|
const { column } = params;
|
|
3469
3763
|
let resizeColumn = column;
|
|
@@ -3478,21 +3772,266 @@ const Methods = {
|
|
|
3478
3772
|
const cell = dragBtnElem.parentNode;
|
|
3479
3773
|
const cellParams = Object.assign(params, { cell });
|
|
3480
3774
|
const colMinWidth = getColReMinWidth(cellParams);
|
|
3775
|
+
el.setAttribute('data-calc-col', 'Y');
|
|
3481
3776
|
let resizeWidth = calcColumnAutoWidth(resizeColumn, el);
|
|
3777
|
+
el.removeAttribute('data-calc-col');
|
|
3482
3778
|
if (colRest) {
|
|
3483
3779
|
resizeWidth = Math.max(resizeWidth, colRest.width);
|
|
3484
3780
|
}
|
|
3485
|
-
|
|
3486
|
-
|
|
3781
|
+
resizeWidth = Math.max(colMinWidth, resizeWidth);
|
|
3782
|
+
const resizeParams = Object.assign(Object.assign({}, params), { resizeWidth, resizeColumn });
|
|
3783
|
+
reactData.isDragResize = false;
|
|
3487
3784
|
internalData._lastResizeTime = Date.now();
|
|
3488
|
-
$xeTable.
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
|
|
3785
|
+
if ($xeTable.handleColResizeDblclickCellAreaEvent) {
|
|
3786
|
+
$xeTable.handleColResizeDblclickCellAreaEvent(evnt, resizeParams);
|
|
3787
|
+
}
|
|
3788
|
+
else {
|
|
3789
|
+
resizeColumn.resizeWidth = resizeWidth;
|
|
3790
|
+
handleUpdateColResize($xeTable, evnt, resizeParams);
|
|
3791
|
+
}
|
|
3792
|
+
}
|
|
3793
|
+
},
|
|
3794
|
+
handleRowResizeMousedownEvent(evnt, params) {
|
|
3795
|
+
const $xeTable = this;
|
|
3796
|
+
const reactData = $xeTable;
|
|
3797
|
+
const internalData = $xeTable;
|
|
3798
|
+
evnt.stopPropagation();
|
|
3799
|
+
evnt.preventDefault();
|
|
3800
|
+
const { row } = params;
|
|
3801
|
+
const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData;
|
|
3802
|
+
const { elemStore, fullAllDataRowIdData } = internalData;
|
|
3803
|
+
const osbWidth = overflowY ? scrollbarWidth : 0;
|
|
3804
|
+
const osbHeight = overflowX ? scrollbarHeight : 0;
|
|
3805
|
+
const scrollbarYToLeft = $xeTable.computeScrollbarYToLeft;
|
|
3806
|
+
const resizableOpts = $xeTable.computeResizableOpts;
|
|
3807
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
3808
|
+
const cellOpts = $xeTable.computeCellOpts;
|
|
3809
|
+
const tableEl = $xeTable.$refs.refElem;
|
|
3810
|
+
const resizeBarElem = $xeTable.$refs.refRowResizeBar;
|
|
3811
|
+
if (!resizeBarElem) {
|
|
3812
|
+
return;
|
|
3813
|
+
}
|
|
3814
|
+
const { clientY: dragClientY } = evnt;
|
|
3815
|
+
const resizeTipElem = resizeBarElem.firstElementChild;
|
|
3816
|
+
const dragBtnElem = evnt.currentTarget;
|
|
3817
|
+
const tdEl = dragBtnElem.parentNode;
|
|
3818
|
+
const trEl = tdEl.parentNode;
|
|
3819
|
+
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
3820
|
+
if (!bodyScrollElem) {
|
|
3821
|
+
return;
|
|
3822
|
+
}
|
|
3823
|
+
const rowid = getRowid($xeTable, row);
|
|
3824
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
3825
|
+
if (!rowRest) {
|
|
3826
|
+
return;
|
|
3827
|
+
}
|
|
3828
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
3829
|
+
const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
3830
|
+
const tableRect = tableEl.getBoundingClientRect();
|
|
3831
|
+
const trRect = trEl.getBoundingClientRect();
|
|
3832
|
+
const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight;
|
|
3833
|
+
let resizeHeight = currCellHeight;
|
|
3834
|
+
const cellEl = tdEl.querySelector('.vxe-cell');
|
|
3835
|
+
let cellMinHeight = 0;
|
|
3836
|
+
if (cellEl) {
|
|
3837
|
+
const cellStyle = getComputedStyle(cellEl);
|
|
3838
|
+
cellMinHeight = Math.max(1, Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom)));
|
|
3839
|
+
}
|
|
3840
|
+
const minTop = trRect.y - tableRect.y + cellMinHeight;
|
|
3841
|
+
// 处理拖动事件
|
|
3842
|
+
const updateEvent = (evnt) => {
|
|
3843
|
+
evnt.stopPropagation();
|
|
3844
|
+
evnt.preventDefault();
|
|
3845
|
+
const tableWidth = tableEl.clientWidth - osbWidth;
|
|
3846
|
+
const tableHeight = tableEl.clientHeight - osbHeight;
|
|
3847
|
+
let dragTop = evnt.clientY - tableRect.y - targetOffsetY;
|
|
3848
|
+
if (dragTop < minTop) {
|
|
3849
|
+
dragTop = minTop;
|
|
3850
|
+
}
|
|
3851
|
+
else {
|
|
3852
|
+
resizeHeight = Math.max(cellMinHeight, currCellHeight + evnt.clientY - dragClientY);
|
|
3853
|
+
}
|
|
3854
|
+
resizeBarElem.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`;
|
|
3855
|
+
resizeBarElem.style.top = `${dragTop}px`;
|
|
3856
|
+
resizeBarElem.style.width = `${tableWidth}px`;
|
|
3857
|
+
if (resizableOpts.showDragTip && resizeTipElem) {
|
|
3858
|
+
resizeTipElem.textContent = getI18n('vxe.table.resizeRowTip', [resizeHeight]);
|
|
3859
|
+
const resizeTipWidth = resizeTipElem.clientWidth;
|
|
3860
|
+
const resizeTipHeight = resizeTipElem.clientHeight;
|
|
3861
|
+
let resizeBarLeft = Math.max(2, evnt.clientX - tableRect.x);
|
|
3862
|
+
let resizeBarTop = 0;
|
|
3863
|
+
if (resizeBarLeft + resizeTipWidth >= tableWidth - 2) {
|
|
3864
|
+
resizeBarLeft = tableWidth - resizeTipWidth - 2;
|
|
3865
|
+
}
|
|
3866
|
+
if (dragTop + resizeTipHeight >= tableHeight) {
|
|
3867
|
+
resizeBarTop = tableHeight - (dragTop + resizeTipHeight);
|
|
3868
|
+
}
|
|
3869
|
+
resizeTipElem.style.left = `${resizeBarLeft}px`;
|
|
3870
|
+
resizeTipElem.style.top = `${resizeBarTop}px`;
|
|
3871
|
+
}
|
|
3872
|
+
reactData.isDragResize = true;
|
|
3873
|
+
};
|
|
3874
|
+
reactData.isDragResize = true;
|
|
3875
|
+
addClass(tableEl, 'row-drag--resize');
|
|
3876
|
+
resizeBarElem.style.display = 'block';
|
|
3877
|
+
document.onmousemove = updateEvent;
|
|
3878
|
+
document.onmouseup = function (evnt) {
|
|
3879
|
+
document.onmousemove = null;
|
|
3880
|
+
document.onmouseup = null;
|
|
3881
|
+
resizeBarElem.style.display = 'none';
|
|
3882
|
+
internalData._lastResizeTime = Date.now();
|
|
3883
|
+
setTimeout(() => {
|
|
3884
|
+
reactData.isDragResize = false;
|
|
3885
|
+
}, 50);
|
|
3886
|
+
if (resizeHeight !== currCellHeight) {
|
|
3887
|
+
const resizeParams = Object.assign(Object.assign({}, params), { resizeHeight, resizeRow: row });
|
|
3888
|
+
internalData.isResizeCellHeight = true;
|
|
3889
|
+
if ($xeTable.handleRowResizeCellAreaEvent) {
|
|
3890
|
+
$xeTable.handleRowResizeCellAreaEvent(evnt, resizeParams);
|
|
3891
|
+
}
|
|
3892
|
+
else {
|
|
3893
|
+
rowRest.resizeHeight = resizeHeight;
|
|
3894
|
+
handleUpdateRowResize($xeTable, evnt, resizeParams);
|
|
3895
|
+
}
|
|
3896
|
+
}
|
|
3897
|
+
removeClass(tableEl, 'row-drag--resize');
|
|
3898
|
+
};
|
|
3899
|
+
updateEvent(evnt);
|
|
3900
|
+
},
|
|
3901
|
+
handleRowResizeDblclickEvent(evnt, params) {
|
|
3902
|
+
const $xeTable = this;
|
|
3903
|
+
const reactData = $xeTable;
|
|
3904
|
+
const internalData = $xeTable;
|
|
3905
|
+
const resizableOpts = $xeTable.computeResizableOpts;
|
|
3906
|
+
const { isDblclickAutoHeight } = resizableOpts;
|
|
3907
|
+
const el = $xeTable.$refs.refElem;
|
|
3908
|
+
if (isDblclickAutoHeight && el) {
|
|
3909
|
+
evnt.stopPropagation();
|
|
3910
|
+
evnt.preventDefault();
|
|
3911
|
+
const { editStore } = reactData;
|
|
3912
|
+
const { fullAllDataRowIdData } = internalData;
|
|
3913
|
+
const { actived } = editStore;
|
|
3914
|
+
const { row } = params;
|
|
3915
|
+
const rowid = getRowid($xeTable, row);
|
|
3916
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
3917
|
+
if (!rowRest) {
|
|
3918
|
+
return;
|
|
3919
|
+
}
|
|
3920
|
+
const handleRsHeight = () => {
|
|
3921
|
+
const resizeHeight = calcCellAutoHeight(rowRest, el);
|
|
3922
|
+
const resizeParams = Object.assign(Object.assign({}, params), { resizeHeight, resizeRow: row });
|
|
3923
|
+
reactData.isDragResize = false;
|
|
3924
|
+
internalData._lastResizeTime = Date.now();
|
|
3925
|
+
if ($xeTable.handleRowResizeDblclickCellAreaEvent) {
|
|
3926
|
+
$xeTable.handleRowResizeDblclickCellAreaEvent(evnt, resizeParams);
|
|
3927
|
+
}
|
|
3928
|
+
else {
|
|
3929
|
+
rowRest.resizeHeight = resizeHeight;
|
|
3930
|
+
handleUpdateRowResize($xeTable, evnt, resizeParams);
|
|
3931
|
+
}
|
|
3932
|
+
};
|
|
3933
|
+
if (actived.row || actived.column) {
|
|
3934
|
+
$xeTable.clearEdit().then(handleRsHeight);
|
|
3935
|
+
}
|
|
3936
|
+
else {
|
|
3937
|
+
handleRsHeight();
|
|
3938
|
+
}
|
|
3939
|
+
}
|
|
3940
|
+
},
|
|
3941
|
+
setRowHeightConf(heightConf) {
|
|
3942
|
+
const $xeTable = this;
|
|
3943
|
+
const reactData = $xeTable;
|
|
3944
|
+
const internalData = $xeTable;
|
|
3945
|
+
const { fullAllDataRowIdData } = internalData;
|
|
3946
|
+
let status = false;
|
|
3947
|
+
if (heightConf) {
|
|
3948
|
+
XEUtils.each(heightConf, (height, rowid) => {
|
|
3949
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
3950
|
+
if (rowRest) {
|
|
3951
|
+
const rHeight = XEUtils.toInteger(height);
|
|
3952
|
+
if (rHeight) {
|
|
3953
|
+
rowRest.resizeHeight = rHeight;
|
|
3954
|
+
if (!status) {
|
|
3955
|
+
status = true;
|
|
3956
|
+
}
|
|
3957
|
+
}
|
|
3958
|
+
}
|
|
3494
3959
|
});
|
|
3960
|
+
if (status) {
|
|
3961
|
+
internalData.isResizeCellHeight = true;
|
|
3962
|
+
reactData.resizeHeightFlag++;
|
|
3963
|
+
}
|
|
3495
3964
|
}
|
|
3965
|
+
return $xeTable.$nextTick().then(() => {
|
|
3966
|
+
return { status };
|
|
3967
|
+
});
|
|
3968
|
+
},
|
|
3969
|
+
getRowHeightConf(isFull) {
|
|
3970
|
+
const $xeTable = this;
|
|
3971
|
+
const internalData = $xeTable;
|
|
3972
|
+
const { fullAllDataRowIdData, afterFullData } = internalData;
|
|
3973
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
3974
|
+
const cellOpts = $xeTable.computeCellOpts;
|
|
3975
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
3976
|
+
const rest = {};
|
|
3977
|
+
afterFullData.forEach(row => {
|
|
3978
|
+
const rowid = getRowid($xeTable, row);
|
|
3979
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
3980
|
+
if (rowRest) {
|
|
3981
|
+
const resizeHeight = rowRest.resizeHeight;
|
|
3982
|
+
if (resizeHeight || isFull) {
|
|
3983
|
+
const currCellHeight = resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
3984
|
+
rest[rowid] = currCellHeight;
|
|
3985
|
+
}
|
|
3986
|
+
}
|
|
3987
|
+
});
|
|
3988
|
+
return rest;
|
|
3989
|
+
},
|
|
3990
|
+
setRowHeight(rowOrId, height) {
|
|
3991
|
+
const $xeTable = this;
|
|
3992
|
+
const reactData = $xeTable;
|
|
3993
|
+
const internalData = $xeTable;
|
|
3994
|
+
const { fullAllDataRowIdData } = internalData;
|
|
3995
|
+
let status = false;
|
|
3996
|
+
const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId];
|
|
3997
|
+
let rHeight = XEUtils.toInteger(height);
|
|
3998
|
+
if (isScale(height)) {
|
|
3999
|
+
const tableBody = $xeTable.$refs.refTableBody;
|
|
4000
|
+
const bodyElem = tableBody ? tableBody.$el : null;
|
|
4001
|
+
const bodyHeight = bodyElem ? bodyElem.clientHeight - 1 : 0;
|
|
4002
|
+
rHeight = Math.floor(rHeight * bodyHeight);
|
|
4003
|
+
}
|
|
4004
|
+
if (rHeight) {
|
|
4005
|
+
rows.forEach(row => {
|
|
4006
|
+
const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : getRowid($xeTable, row);
|
|
4007
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
4008
|
+
if (rowRest) {
|
|
4009
|
+
rowRest.resizeHeight = rHeight;
|
|
4010
|
+
if (!status) {
|
|
4011
|
+
status = true;
|
|
4012
|
+
}
|
|
4013
|
+
}
|
|
4014
|
+
});
|
|
4015
|
+
if (status) {
|
|
4016
|
+
internalData.isResizeCellHeight = true;
|
|
4017
|
+
reactData.resizeHeightFlag++;
|
|
4018
|
+
}
|
|
4019
|
+
}
|
|
4020
|
+
return $xeTable.$nextTick();
|
|
4021
|
+
},
|
|
4022
|
+
getRowHeight(rowOrId) {
|
|
4023
|
+
const $xeTable = this;
|
|
4024
|
+
const internalData = $xeTable;
|
|
4025
|
+
const { fullAllDataRowIdData } = internalData;
|
|
4026
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
4027
|
+
const cellOpts = $xeTable.computeCellOpts;
|
|
4028
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
4029
|
+
const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId);
|
|
4030
|
+
const rowRest = fullAllDataRowIdData[rowid];
|
|
4031
|
+
if (rowRest) {
|
|
4032
|
+
return rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
4033
|
+
}
|
|
4034
|
+
return 0;
|
|
3496
4035
|
},
|
|
3497
4036
|
/**
|
|
3498
4037
|
* 刷新滚动操作,手动同步滚动相关位置(对于某些特殊的操作,比如滚动条错位、固定列不同步)
|
|
@@ -3873,10 +4412,10 @@ const Methods = {
|
|
|
3873
4412
|
}
|
|
3874
4413
|
else if (isContextMenu) {
|
|
3875
4414
|
// 如果按下上下文键
|
|
3876
|
-
|
|
4415
|
+
internalData._keyCtx = selected.row && selected.column && bodyCtxMenu.length;
|
|
3877
4416
|
clearTimeout(internalData.keyCtxTimeout);
|
|
3878
4417
|
internalData.keyCtxTimeout = setTimeout(() => {
|
|
3879
|
-
|
|
4418
|
+
internalData._keyCtx = false;
|
|
3880
4419
|
}, 1000);
|
|
3881
4420
|
}
|
|
3882
4421
|
else if (isEnter && !hasAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
|
|
@@ -4125,50 +4664,42 @@ const Methods = {
|
|
|
4125
4664
|
this.updateCellAreas();
|
|
4126
4665
|
this.recalculate(true);
|
|
4127
4666
|
},
|
|
4128
|
-
handleTargetEnterEvent(isClear) {
|
|
4129
|
-
const $tooltip = this.$refs.tooltip;
|
|
4130
|
-
clearTimeout(this.tooltipTimeout);
|
|
4131
|
-
if (isClear) {
|
|
4132
|
-
this.closeTooltip();
|
|
4133
|
-
}
|
|
4134
|
-
else {
|
|
4135
|
-
if ($tooltip) {
|
|
4136
|
-
$tooltip.setActived(true);
|
|
4137
|
-
}
|
|
4138
|
-
}
|
|
4139
|
-
},
|
|
4140
4667
|
handleTargetLeaveEvent() {
|
|
4141
|
-
const
|
|
4142
|
-
|
|
4143
|
-
|
|
4668
|
+
const $xeTable = this;
|
|
4669
|
+
const internalData = $xeTable;
|
|
4670
|
+
const tooltipOpts = $xeTable.computeTooltipOpts;
|
|
4671
|
+
let $tooltip = $xeTable.$refs.refTooltip;
|
|
4672
|
+
if ($tooltip && $tooltip.setActived) {
|
|
4144
4673
|
$tooltip.setActived(false);
|
|
4145
4674
|
}
|
|
4146
4675
|
if (tooltipOpts.enterable) {
|
|
4147
|
-
|
|
4148
|
-
$tooltip =
|
|
4149
|
-
if ($tooltip && !$tooltip.isActived()) {
|
|
4150
|
-
|
|
4676
|
+
internalData.tooltipTimeout = setTimeout(() => {
|
|
4677
|
+
$tooltip = $xeTable.$refs.refTooltip;
|
|
4678
|
+
if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
|
|
4679
|
+
$xeTable.closeTooltip();
|
|
4151
4680
|
}
|
|
4152
4681
|
}, tooltipOpts.leaveDelay);
|
|
4153
4682
|
}
|
|
4154
4683
|
else {
|
|
4155
|
-
|
|
4684
|
+
$xeTable.closeTooltip();
|
|
4156
4685
|
}
|
|
4157
4686
|
},
|
|
4158
4687
|
triggerHeaderTitleEvent(evnt, iconParams, params) {
|
|
4688
|
+
const $xeTable = this;
|
|
4689
|
+
const reactData = $xeTable;
|
|
4159
4690
|
const tipContent = iconParams.content || iconParams.message;
|
|
4160
4691
|
if (tipContent) {
|
|
4161
|
-
const {
|
|
4692
|
+
const { tooltipStore } = reactData;
|
|
4162
4693
|
const { column } = params;
|
|
4163
4694
|
const content = getFuncText(tipContent);
|
|
4164
|
-
|
|
4695
|
+
handleTargetEnterEvent($xeTable, true);
|
|
4165
4696
|
tooltipStore.row = null;
|
|
4166
4697
|
tooltipStore.column = column;
|
|
4167
4698
|
tooltipStore.visible = true;
|
|
4168
4699
|
tooltipStore.currOpts = iconParams;
|
|
4169
|
-
|
|
4170
|
-
const $tooltip = $refs.
|
|
4171
|
-
if ($tooltip) {
|
|
4700
|
+
$xeTable.$nextTick(() => {
|
|
4701
|
+
const $tooltip = $xeTable.$refs.refTooltip;
|
|
4702
|
+
if ($tooltip && $tooltip.open) {
|
|
4172
4703
|
$tooltip.open(evnt.currentTarget, content);
|
|
4173
4704
|
}
|
|
4174
4705
|
});
|
|
@@ -4178,23 +4709,42 @@ const Methods = {
|
|
|
4178
4709
|
* 触发表头 tooltip 事件
|
|
4179
4710
|
*/
|
|
4180
4711
|
triggerHeaderTooltipEvent(evnt, params) {
|
|
4181
|
-
const
|
|
4712
|
+
const $xeTable = this;
|
|
4713
|
+
const reactData = $xeTable;
|
|
4714
|
+
const { tooltipStore } = reactData;
|
|
4182
4715
|
const { column } = params;
|
|
4716
|
+
handleTargetEnterEvent($xeTable, true);
|
|
4183
4717
|
const titleElem = evnt.currentTarget;
|
|
4184
|
-
|
|
4718
|
+
if (!titleElem) {
|
|
4719
|
+
return;
|
|
4720
|
+
}
|
|
4721
|
+
const cellEl = titleElem.parentElement;
|
|
4722
|
+
if (!cellEl) {
|
|
4723
|
+
return;
|
|
4724
|
+
}
|
|
4725
|
+
const thEl = cellEl.parentElement;
|
|
4726
|
+
if (!thEl) {
|
|
4727
|
+
return;
|
|
4728
|
+
}
|
|
4185
4729
|
if (tooltipStore.column !== column || !tooltipStore.visible) {
|
|
4186
|
-
|
|
4730
|
+
handleTooltip($xeTable, evnt, thEl, cellEl, null, params);
|
|
4187
4731
|
}
|
|
4188
4732
|
},
|
|
4189
4733
|
/**
|
|
4190
4734
|
* 触发单元格 tooltip 事件
|
|
4191
4735
|
*/
|
|
4192
4736
|
triggerBodyTooltipEvent(evnt, params) {
|
|
4193
|
-
const
|
|
4737
|
+
const $xeTable = this;
|
|
4738
|
+
const props = $xeTable;
|
|
4739
|
+
const reactData = $xeTable;
|
|
4740
|
+
const { editConfig } = props;
|
|
4741
|
+
const { editStore } = reactData;
|
|
4742
|
+
const { tooltipStore } = reactData;
|
|
4743
|
+
const editOpts = $xeTable.computeEditOpts;
|
|
4194
4744
|
const { actived } = editStore;
|
|
4195
4745
|
const { row, column } = params;
|
|
4196
|
-
const
|
|
4197
|
-
|
|
4746
|
+
const tdEl = evnt.currentTarget;
|
|
4747
|
+
handleTargetEnterEvent($xeTable, tooltipStore.column !== column || tooltipStore.row !== row);
|
|
4198
4748
|
// 单元格处于编辑状态时不触发提示框
|
|
4199
4749
|
if (column.editRender && isEnableConf(editConfig)) {
|
|
4200
4750
|
// 如果是行编辑模式
|
|
@@ -4207,67 +4757,23 @@ const Methods = {
|
|
|
4207
4757
|
}
|
|
4208
4758
|
}
|
|
4209
4759
|
if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
|
|
4210
|
-
|
|
4211
|
-
let tipElem;
|
|
4212
|
-
if (column.treeNode) {
|
|
4213
|
-
overflowElem = cell.querySelector('.vxe-tree-cell');
|
|
4214
|
-
if (column.type === 'html') {
|
|
4215
|
-
tipElem = cell.querySelector('.vxe-cell--html');
|
|
4216
|
-
}
|
|
4217
|
-
}
|
|
4218
|
-
else {
|
|
4219
|
-
tipElem = cell.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label');
|
|
4220
|
-
}
|
|
4221
|
-
this.handleTooltip(evnt, cell, overflowElem || cell.children[0], tipElem, params);
|
|
4760
|
+
handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), null, params);
|
|
4222
4761
|
}
|
|
4223
4762
|
},
|
|
4224
4763
|
/**
|
|
4225
4764
|
* 触发表尾 tooltip 事件
|
|
4226
4765
|
*/
|
|
4227
4766
|
triggerFooterTooltipEvent(evnt, params) {
|
|
4767
|
+
const $xeTable = this;
|
|
4768
|
+
const reactData = $xeTable;
|
|
4228
4769
|
const { column } = params;
|
|
4229
|
-
const { tooltipStore } =
|
|
4770
|
+
const { tooltipStore } = reactData;
|
|
4230
4771
|
const cell = evnt.currentTarget;
|
|
4231
|
-
|
|
4772
|
+
handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row);
|
|
4232
4773
|
if (tooltipStore.column !== column || !tooltipStore.visible) {
|
|
4233
|
-
|
|
4774
|
+
handleTooltip($xeTable, evnt, cell, cell.querySelector('.vxe-cell--wrapper') || cell.children[0], null, params);
|
|
4234
4775
|
}
|
|
4235
4776
|
},
|
|
4236
|
-
/**
|
|
4237
|
-
* 处理显示 tooltip
|
|
4238
|
-
* @param {Event} evnt 事件
|
|
4239
|
-
* @param {ColumnInfo} column 列配置
|
|
4240
|
-
* @param {Row} row 行对象
|
|
4241
|
-
*/
|
|
4242
|
-
handleTooltip(evnt, cell, overflowElem, tipElem, params) {
|
|
4243
|
-
const $xeTable = this;
|
|
4244
|
-
if (!overflowElem) {
|
|
4245
|
-
return $xeTable.$nextTick();
|
|
4246
|
-
}
|
|
4247
|
-
params.cell = cell;
|
|
4248
|
-
const { $refs, tooltipOpts, tooltipStore } = this;
|
|
4249
|
-
const { column, row } = params;
|
|
4250
|
-
const { showAll, enabled, contentMethod } = tooltipOpts;
|
|
4251
|
-
const customContent = contentMethod ? contentMethod(params) : null;
|
|
4252
|
-
const useCustom = contentMethod && !XEUtils.eqNull(customContent);
|
|
4253
|
-
const content = useCustom ? customContent : (column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim();
|
|
4254
|
-
const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth;
|
|
4255
|
-
if (content && (showAll || enabled || useCustom || isCellOverflow)) {
|
|
4256
|
-
Object.assign(tooltipStore, {
|
|
4257
|
-
row,
|
|
4258
|
-
column,
|
|
4259
|
-
visible: true,
|
|
4260
|
-
currOpts: {}
|
|
4261
|
-
});
|
|
4262
|
-
this.$nextTick(() => {
|
|
4263
|
-
const $tooltip = $refs.tooltip;
|
|
4264
|
-
if ($tooltip) {
|
|
4265
|
-
$tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content));
|
|
4266
|
-
}
|
|
4267
|
-
});
|
|
4268
|
-
}
|
|
4269
|
-
return this.$nextTick();
|
|
4270
|
-
},
|
|
4271
4777
|
openTooltip(target, content) {
|
|
4272
4778
|
const { $refs } = this;
|
|
4273
4779
|
const commTip = $refs.refCommTooltip;
|
|
@@ -4280,9 +4786,11 @@ const Methods = {
|
|
|
4280
4786
|
* 关闭 tooltip
|
|
4281
4787
|
*/
|
|
4282
4788
|
closeTooltip() {
|
|
4283
|
-
const
|
|
4284
|
-
const
|
|
4285
|
-
const
|
|
4789
|
+
const $xeTable = this;
|
|
4790
|
+
const reactData = $xeTable;
|
|
4791
|
+
const { tooltipStore } = reactData;
|
|
4792
|
+
const tooltip = $xeTable.$refs.refTooltip;
|
|
4793
|
+
const commTip = $xeTable.$refs.refCommTooltip;
|
|
4286
4794
|
if (tooltipStore.visible) {
|
|
4287
4795
|
Object.assign(tooltipStore, {
|
|
4288
4796
|
row: null,
|
|
@@ -5284,20 +5792,24 @@ const Methods = {
|
|
|
5284
5792
|
this.hoverRow = null;
|
|
5285
5793
|
},
|
|
5286
5794
|
triggerHeaderCellClickEvent(evnt, params) {
|
|
5287
|
-
const
|
|
5795
|
+
const $xeTable = this;
|
|
5796
|
+
const internalData = $xeTable;
|
|
5797
|
+
const { _lastResizeTime } = internalData;
|
|
5798
|
+
const sortOpts = $xeTable.computeSortOpts;
|
|
5799
|
+
const columnOpts = $xeTable.computeColumnOpts;
|
|
5288
5800
|
const { column } = params;
|
|
5289
5801
|
const cell = evnt.currentTarget;
|
|
5290
5802
|
const triggerResizable = _lastResizeTime && _lastResizeTime > Date.now() - 300;
|
|
5291
5803
|
const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag;
|
|
5292
5804
|
const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag;
|
|
5293
5805
|
if (sortOpts.trigger === 'cell' && !(triggerResizable || triggerSort || triggerFilter)) {
|
|
5294
|
-
|
|
5806
|
+
$xeTable.triggerSortEvent(evnt, column, getNextSortOrder($xeTable, column));
|
|
5295
5807
|
}
|
|
5296
|
-
|
|
5297
|
-
if (
|
|
5298
|
-
|
|
5808
|
+
$xeTable.dispatchEvent('header-cell-click', Object.assign({ triggerResizable, triggerSort, triggerFilter, cell }, params), evnt);
|
|
5809
|
+
if (columnOpts.isCurrent || $xeTable.highlightCurrentColumn) {
|
|
5810
|
+
$xeTable.triggerCurrentColumnEvent(evnt, params);
|
|
5299
5811
|
}
|
|
5300
|
-
return
|
|
5812
|
+
return $xeTable.$nextTick();
|
|
5301
5813
|
},
|
|
5302
5814
|
triggerHeaderCellDblclickEvent(evnt, params) {
|
|
5303
5815
|
this.emitEvent('header-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, params), evnt);
|
|
@@ -5351,7 +5863,20 @@ const Methods = {
|
|
|
5351
5863
|
*/
|
|
5352
5864
|
triggerCellClickEvent(evnt, params) {
|
|
5353
5865
|
const $xeTable = this;
|
|
5354
|
-
const
|
|
5866
|
+
const props = $xeTable;
|
|
5867
|
+
const reactData = $xeTable;
|
|
5868
|
+
const { highlightCurrentRow, editConfig } = props;
|
|
5869
|
+
const { editStore, isDragResize } = reactData;
|
|
5870
|
+
if (isDragResize) {
|
|
5871
|
+
return;
|
|
5872
|
+
}
|
|
5873
|
+
const expandOpts = $xeTable.computeExpandOpts;
|
|
5874
|
+
const editOpts = $xeTable.computeEditOpts;
|
|
5875
|
+
const treeOpts = $xeTable.computeTreeOpts;
|
|
5876
|
+
const radioOpts = $xeTable.computeRadioOpts;
|
|
5877
|
+
const checkboxOpts = $xeTable.computeCheckboxOpts;
|
|
5878
|
+
const keyboardOpts = $xeTable.computeKeyboardOpts;
|
|
5879
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
5355
5880
|
const { actived, focused } = editStore;
|
|
5356
5881
|
const { row, column } = params;
|
|
5357
5882
|
const { type, treeNode } = column;
|
|
@@ -5438,7 +5963,15 @@ const Methods = {
|
|
|
5438
5963
|
* 如果是双击模式,则激活为编辑状态
|
|
5439
5964
|
*/
|
|
5440
5965
|
triggerCellDblclickEvent(evnt, params) {
|
|
5441
|
-
const
|
|
5966
|
+
const $xeTable = this;
|
|
5967
|
+
const props = $xeTable;
|
|
5968
|
+
const reactData = $xeTable;
|
|
5969
|
+
const { editConfig } = props;
|
|
5970
|
+
const { editStore, isDragResize } = reactData;
|
|
5971
|
+
if (isDragResize) {
|
|
5972
|
+
return;
|
|
5973
|
+
}
|
|
5974
|
+
const editOpts = $xeTable.computeEditOpts;
|
|
5442
5975
|
const { actived } = editStore;
|
|
5443
5976
|
const cell = evnt.currentTarget;
|
|
5444
5977
|
params = Object.assign({ cell }, params);
|
|
@@ -5507,10 +6040,13 @@ const Methods = {
|
|
|
5507
6040
|
triggerSortEvent(evnt, column, order) {
|
|
5508
6041
|
const $xeTable = this;
|
|
5509
6042
|
const sortOpts = $xeTable.computeSortOpts;
|
|
6043
|
+
const { multiple, allowClear } = sortOpts;
|
|
5510
6044
|
const { field, sortable, remoteSort } = column;
|
|
5511
6045
|
if (sortable || remoteSort) {
|
|
5512
6046
|
if (!order || column.order === order) {
|
|
5513
|
-
|
|
6047
|
+
if (allowClear) {
|
|
6048
|
+
$xeTable.clearSort(multiple ? column : null);
|
|
6049
|
+
}
|
|
5514
6050
|
}
|
|
5515
6051
|
else {
|
|
5516
6052
|
$xeTable.sort({ field, order });
|
|
@@ -5611,7 +6147,7 @@ const Methods = {
|
|
|
5611
6147
|
const { treeConfig, dragConfig } = props;
|
|
5612
6148
|
const rowDragOpts = $xeTable.computeRowDragOpts;
|
|
5613
6149
|
const { fullAllDataRowIdData } = internalData;
|
|
5614
|
-
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod } = rowDragOpts;
|
|
6150
|
+
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, dragEndMethod, dragToChildMethod } = rowDragOpts;
|
|
5615
6151
|
const treeOpts = $xeTable.computeTreeOpts;
|
|
5616
6152
|
const { transform, rowField, mapChildrenField, parentField } = treeOpts;
|
|
5617
6153
|
const childrenField = treeOpts.children || treeOpts.childrenField;
|
|
@@ -5621,15 +6157,15 @@ const Methods = {
|
|
|
5621
6157
|
if (prevDragRow && dragRow) {
|
|
5622
6158
|
// 判断是否有拖动
|
|
5623
6159
|
if (prevDragRow !== dragRow) {
|
|
5624
|
-
|
|
5625
|
-
|
|
5626
|
-
|
|
5627
|
-
|
|
5628
|
-
|
|
5629
|
-
|
|
5630
|
-
|
|
5631
|
-
|
|
5632
|
-
|
|
6160
|
+
const dragParams = {
|
|
6161
|
+
oldRow: dragRow,
|
|
6162
|
+
newRow: prevDragRow,
|
|
6163
|
+
dragPos: prevDragPos,
|
|
6164
|
+
dragToChild: !!prevDragToChild,
|
|
6165
|
+
offsetIndex: dragOffsetIndex
|
|
6166
|
+
};
|
|
6167
|
+
const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
|
|
6168
|
+
return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
|
|
5633
6169
|
if (!status) {
|
|
5634
6170
|
return;
|
|
5635
6171
|
}
|
|
@@ -5704,7 +6240,11 @@ const Methods = {
|
|
|
5704
6240
|
else {
|
|
5705
6241
|
// 根到根
|
|
5706
6242
|
}
|
|
5707
|
-
const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
|
|
6243
|
+
const fullList = XEUtils.toTreeArray(internalData.afterTreeFullData, {
|
|
6244
|
+
key: rowField,
|
|
6245
|
+
parentKey: parentField,
|
|
6246
|
+
children: mapChildrenField
|
|
6247
|
+
});
|
|
5708
6248
|
// 移出
|
|
5709
6249
|
const otfIndex = $xeTable.findRowIndexOf(fullList, dragRow);
|
|
5710
6250
|
fullList.splice(otfIndex, 1);
|
|
@@ -5718,12 +6258,12 @@ const Methods = {
|
|
|
5718
6258
|
childRow[parentField] = dragRow[parentField];
|
|
5719
6259
|
});
|
|
5720
6260
|
}
|
|
5721
|
-
dragRow[parentField] =
|
|
6261
|
+
dragRow[parentField] = isDragToChildFlag ? prevDragRow[rowField] : prevDragRow[parentField];
|
|
5722
6262
|
internalData.tableFullTreeData = XEUtils.toArrayTree(fullList, {
|
|
5723
|
-
key:
|
|
5724
|
-
parentKey:
|
|
6263
|
+
key: rowField,
|
|
6264
|
+
parentKey: parentField,
|
|
5725
6265
|
children: childrenField,
|
|
5726
|
-
mapChildren:
|
|
6266
|
+
mapChildren: mapChildrenField
|
|
5727
6267
|
});
|
|
5728
6268
|
}
|
|
5729
6269
|
}
|
|
@@ -5744,7 +6284,7 @@ const Methods = {
|
|
|
5744
6284
|
}
|
|
5745
6285
|
reactData.isDragRowMove = true;
|
|
5746
6286
|
$xeTable.handleTableData(treeConfig && transform);
|
|
5747
|
-
$xeTable.cacheRowMap();
|
|
6287
|
+
$xeTable.cacheRowMap(false);
|
|
5748
6288
|
updateScrollYStatus($xeTable);
|
|
5749
6289
|
if (!(treeConfig && transform)) {
|
|
5750
6290
|
updateAfterDataIndex($xeTable);
|
|
@@ -5761,7 +6301,7 @@ const Methods = {
|
|
|
5761
6301
|
oldRow: dragRow,
|
|
5762
6302
|
newRow: prevDragRow,
|
|
5763
6303
|
dragPos: prevDragPos,
|
|
5764
|
-
dragToChild:
|
|
6304
|
+
dragToChild: isDragToChildFlag,
|
|
5765
6305
|
offsetIndex: dragOffsetIndex,
|
|
5766
6306
|
_index: {
|
|
5767
6307
|
newIndex: nafIndex,
|
|
@@ -5786,20 +6326,18 @@ const Methods = {
|
|
|
5786
6326
|
const { lazy } = treeOpts;
|
|
5787
6327
|
const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
|
|
5788
6328
|
const { prevDragRow, prevDragPos } = internalData;
|
|
5789
|
-
if (treeConfig && prevDragToChild) {
|
|
6329
|
+
if (treeConfig && lazy && prevDragToChild) {
|
|
5790
6330
|
// 懒加载
|
|
5791
|
-
|
|
5792
|
-
|
|
5793
|
-
|
|
5794
|
-
if (
|
|
5795
|
-
if (rowRest && rowRest.treeLoaded) {
|
|
5796
|
-
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
|
|
5797
|
-
}
|
|
5798
|
-
}
|
|
5799
|
-
else {
|
|
6331
|
+
const newRowid = getRowid($xeTable, prevDragRow);
|
|
6332
|
+
const rowRest = fullAllDataRowIdData[newRowid];
|
|
6333
|
+
if (prevDragRow[hasChildField]) {
|
|
6334
|
+
if (rowRest && rowRest.treeLoaded) {
|
|
5800
6335
|
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
|
|
5801
6336
|
}
|
|
5802
6337
|
}
|
|
6338
|
+
else {
|
|
6339
|
+
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
|
|
6340
|
+
}
|
|
5803
6341
|
}
|
|
5804
6342
|
else {
|
|
5805
6343
|
$xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild);
|
|
@@ -5916,7 +6454,7 @@ const Methods = {
|
|
|
5916
6454
|
const internalData = $xeTable;
|
|
5917
6455
|
const { mouseConfig } = props;
|
|
5918
6456
|
const columnDragOpts = $xeTable.computeColumnDragOpts;
|
|
5919
|
-
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts;
|
|
6457
|
+
const { isPeerDrag, isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod, dragToChildMethod } = columnDragOpts;
|
|
5920
6458
|
const { collectColumn } = internalData;
|
|
5921
6459
|
const dragOffsetIndex = prevDragPos === 'right' ? 1 : 0;
|
|
5922
6460
|
if (prevDragCol && dragCol) {
|
|
@@ -5924,15 +6462,15 @@ const Methods = {
|
|
|
5924
6462
|
if (prevDragCol !== dragCol) {
|
|
5925
6463
|
const oldColumn = dragCol;
|
|
5926
6464
|
const newColumn = prevDragCol;
|
|
5927
|
-
|
|
5928
|
-
|
|
5929
|
-
|
|
5930
|
-
|
|
5931
|
-
|
|
5932
|
-
|
|
5933
|
-
|
|
5934
|
-
|
|
5935
|
-
|
|
6465
|
+
const dragParams = {
|
|
6466
|
+
oldColumn,
|
|
6467
|
+
newColumn,
|
|
6468
|
+
dragPos: prevDragPos,
|
|
6469
|
+
dragToChild: !!prevDragToChild,
|
|
6470
|
+
offsetIndex: dragOffsetIndex
|
|
6471
|
+
};
|
|
6472
|
+
const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild;
|
|
6473
|
+
return Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
|
|
5936
6474
|
if (!status) {
|
|
5937
6475
|
return;
|
|
5938
6476
|
}
|
|
@@ -6022,7 +6560,7 @@ const Methods = {
|
|
|
6022
6560
|
if (newMatchRest) {
|
|
6023
6561
|
const { items: nCols, index: nIndex, parent: nParent } = newMatchRest;
|
|
6024
6562
|
// 转子级
|
|
6025
|
-
if ((isCrossDrag && isToChildDrag) &&
|
|
6563
|
+
if ((isCrossDrag && isToChildDrag) && isDragToChildFlag) {
|
|
6026
6564
|
oldColumn.parentId = newColumn.id;
|
|
6027
6565
|
newColumn.children = (newColumn.children || []).concat([oldColumn]);
|
|
6028
6566
|
}
|
|
@@ -6054,7 +6592,7 @@ const Methods = {
|
|
|
6054
6592
|
oldColumn,
|
|
6055
6593
|
newColumn,
|
|
6056
6594
|
dragPos: prevDragPos,
|
|
6057
|
-
dragToChild:
|
|
6595
|
+
dragToChild: isDragToChildFlag,
|
|
6058
6596
|
offsetIndex: dragOffsetIndex,
|
|
6059
6597
|
_index: {
|
|
6060
6598
|
newIndex: nafIndex,
|
|
@@ -7079,13 +7617,17 @@ const Methods = {
|
|
|
7079
7617
|
* 获取表格的滚动状态
|
|
7080
7618
|
*/
|
|
7081
7619
|
getScroll() {
|
|
7082
|
-
const
|
|
7083
|
-
const
|
|
7620
|
+
const $xeTable = this;
|
|
7621
|
+
const reactData = $xeTable;
|
|
7622
|
+
const internalData = $xeTable;
|
|
7623
|
+
const { scrollXLoad, scrollYLoad } = reactData;
|
|
7624
|
+
const { elemStore } = internalData;
|
|
7625
|
+
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
7084
7626
|
return {
|
|
7085
7627
|
virtualX: scrollXLoad,
|
|
7086
7628
|
virtualY: scrollYLoad,
|
|
7087
|
-
scrollTop:
|
|
7088
|
-
scrollLeft:
|
|
7629
|
+
scrollTop: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
|
|
7630
|
+
scrollLeft: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
|
|
7089
7631
|
};
|
|
7090
7632
|
},
|
|
7091
7633
|
handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, params) {
|
|
@@ -7185,46 +7727,6 @@ const Methods = {
|
|
|
7185
7727
|
}
|
|
7186
7728
|
$xeTable.dispatchEvent('scroll', evntParams, evnt);
|
|
7187
7729
|
},
|
|
7188
|
-
lazyScrollXData() {
|
|
7189
|
-
const $xeTable = this;
|
|
7190
|
-
const internalData = $xeTable;
|
|
7191
|
-
const { lxTimeout, lxRunTime, scrollXStore } = internalData;
|
|
7192
|
-
const { visibleSize } = scrollXStore;
|
|
7193
|
-
const fpsTime = Math.max(5, Math.min(80, Math.floor(visibleSize * 3)));
|
|
7194
|
-
if (lxTimeout) {
|
|
7195
|
-
clearTimeout(lxTimeout);
|
|
7196
|
-
}
|
|
7197
|
-
if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
|
|
7198
|
-
internalData.lxRunTime = Date.now();
|
|
7199
|
-
loadScrollXData($xeTable);
|
|
7200
|
-
}
|
|
7201
|
-
internalData.lxTimeout = setTimeout(() => {
|
|
7202
|
-
internalData.lxTimeout = undefined;
|
|
7203
|
-
internalData.lxRunTime = undefined;
|
|
7204
|
-
loadScrollXData($xeTable);
|
|
7205
|
-
}, fpsTime);
|
|
7206
|
-
},
|
|
7207
|
-
lazyScrollYData() {
|
|
7208
|
-
const $xeTable = this;
|
|
7209
|
-
const props = $xeTable;
|
|
7210
|
-
const internalData = $xeTable;
|
|
7211
|
-
const { showOverflow } = props;
|
|
7212
|
-
const { lyTimeout, lyRunTime, scrollYStore } = internalData;
|
|
7213
|
-
const { visibleSize } = scrollYStore;
|
|
7214
|
-
const fpsTime = showOverflow ? 5 : Math.max(5, Math.min(80, Math.floor(visibleSize / 2)));
|
|
7215
|
-
if (lyTimeout) {
|
|
7216
|
-
clearTimeout(lyTimeout);
|
|
7217
|
-
}
|
|
7218
|
-
if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
|
|
7219
|
-
internalData.lyRunTime = Date.now();
|
|
7220
|
-
loadScrollYData($xeTable);
|
|
7221
|
-
}
|
|
7222
|
-
internalData.lyTimeout = setTimeout(() => {
|
|
7223
|
-
internalData.lyTimeout = undefined;
|
|
7224
|
-
internalData.lyRunTime = undefined;
|
|
7225
|
-
loadScrollYData($xeTable);
|
|
7226
|
-
}, fpsTime);
|
|
7227
|
-
},
|
|
7228
7730
|
/**
|
|
7229
7731
|
* 横向 X 可视渲染事件处理
|
|
7230
7732
|
*/
|
|
@@ -7235,7 +7737,7 @@ const Methods = {
|
|
|
7235
7737
|
loadScrollXData($xeTable);
|
|
7236
7738
|
}
|
|
7237
7739
|
else {
|
|
7238
|
-
$xeTable
|
|
7740
|
+
lazyScrollXData($xeTable);
|
|
7239
7741
|
}
|
|
7240
7742
|
},
|
|
7241
7743
|
/**
|
|
@@ -7248,13 +7750,13 @@ const Methods = {
|
|
|
7248
7750
|
loadScrollYData($xeTable);
|
|
7249
7751
|
}
|
|
7250
7752
|
else {
|
|
7251
|
-
$xeTable
|
|
7753
|
+
lazyScrollYData($xeTable);
|
|
7252
7754
|
}
|
|
7253
7755
|
},
|
|
7254
7756
|
triggerBodyScrollEvent(evnt, fixedType) {
|
|
7255
7757
|
const $xeTable = this;
|
|
7256
7758
|
const internalData = $xeTable;
|
|
7257
|
-
const { elemStore, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData;
|
|
7759
|
+
const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData;
|
|
7258
7760
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem;
|
|
7259
7761
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem;
|
|
7260
7762
|
const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
|
|
@@ -7265,6 +7767,9 @@ const Methods = {
|
|
|
7265
7767
|
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
|
|
7266
7768
|
return;
|
|
7267
7769
|
}
|
|
7770
|
+
if (intoRunScroll) {
|
|
7771
|
+
return;
|
|
7772
|
+
}
|
|
7268
7773
|
if (!bodyScrollElem) {
|
|
7269
7774
|
return;
|
|
7270
7775
|
}
|
|
@@ -7325,22 +7830,16 @@ const Methods = {
|
|
|
7325
7830
|
triggerHeaderScrollEvent(evnt, fixedType) {
|
|
7326
7831
|
const $xeTable = this;
|
|
7327
7832
|
const internalData = $xeTable;
|
|
7328
|
-
const { elemStore, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData;
|
|
7833
|
+
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData;
|
|
7329
7834
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem;
|
|
7330
7835
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem;
|
|
7331
7836
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
7332
7837
|
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
|
|
7333
7838
|
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
|
|
7334
|
-
if (inWheelScroll) {
|
|
7839
|
+
if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
|
|
7335
7840
|
return;
|
|
7336
7841
|
}
|
|
7337
|
-
if (
|
|
7338
|
-
return;
|
|
7339
|
-
}
|
|
7340
|
-
if (inBodyScroll) {
|
|
7341
|
-
return;
|
|
7342
|
-
}
|
|
7343
|
-
if (inFooterScroll) {
|
|
7842
|
+
if (intoRunScroll) {
|
|
7344
7843
|
return;
|
|
7345
7844
|
}
|
|
7346
7845
|
if (!headerScrollElem) {
|
|
@@ -7369,22 +7868,16 @@ const Methods = {
|
|
|
7369
7868
|
triggerFooterScrollEvent(evnt, fixedType) {
|
|
7370
7869
|
const $xeTable = this;
|
|
7371
7870
|
const internalData = $xeTable;
|
|
7372
|
-
const { elemStore, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData;
|
|
7871
|
+
const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData;
|
|
7373
7872
|
const xHandleEl = $xeTable.$refs.refScrollXHandleElem;
|
|
7374
7873
|
const yHandleEl = $xeTable.$refs.refScrollYHandleElem;
|
|
7375
7874
|
const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
|
|
7376
7875
|
const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
|
|
7377
7876
|
const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
|
|
7378
|
-
if (inWheelScroll) {
|
|
7877
|
+
if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
|
|
7379
7878
|
return;
|
|
7380
7879
|
}
|
|
7381
|
-
if (
|
|
7382
|
-
return;
|
|
7383
|
-
}
|
|
7384
|
-
if (inHeaderScroll) {
|
|
7385
|
-
return;
|
|
7386
|
-
}
|
|
7387
|
-
if (inBodyScroll) {
|
|
7880
|
+
if (intoRunScroll) {
|
|
7388
7881
|
return;
|
|
7389
7882
|
}
|
|
7390
7883
|
if (!footerScrollElem) {
|
|
@@ -7415,7 +7908,10 @@ const Methods = {
|
|
|
7415
7908
|
const tableProps = $xeTable;
|
|
7416
7909
|
const reactData = $xeTable;
|
|
7417
7910
|
const internalData = $xeTable;
|
|
7418
|
-
const { deltaY, deltaX } = evnt;
|
|
7911
|
+
const { target, deltaY, deltaX } = evnt;
|
|
7912
|
+
if (target && /^textarea$/i.test(target.tagName)) {
|
|
7913
|
+
return;
|
|
7914
|
+
}
|
|
7419
7915
|
const { highlightHoverRow } = tableProps;
|
|
7420
7916
|
const { elemStore, lastScrollTop, lastScrollLeft } = internalData;
|
|
7421
7917
|
const rowOpts = $xeTable.computeRowOpts;
|
|
@@ -7433,31 +7929,13 @@ const Methods = {
|
|
|
7433
7929
|
if (!bodyScrollElem) {
|
|
7434
7930
|
return;
|
|
7435
7931
|
}
|
|
7436
|
-
|
|
7437
|
-
|
|
7438
|
-
|
|
7439
|
-
}
|
|
7440
|
-
else if (reactData.lastScrollTime + 30 > Date.now()) {
|
|
7441
|
-
multiple = 1.15;
|
|
7442
|
-
}
|
|
7443
|
-
else if (reactData.lastScrollTime + 40 > Date.now()) {
|
|
7444
|
-
multiple = 1.12;
|
|
7445
|
-
}
|
|
7446
|
-
else if (reactData.lastScrollTime + 55 > Date.now()) {
|
|
7447
|
-
multiple = 1.09;
|
|
7448
|
-
}
|
|
7449
|
-
else if (reactData.lastScrollTime + 75 > Date.now()) {
|
|
7450
|
-
multiple = 1.06;
|
|
7451
|
-
}
|
|
7452
|
-
else if (reactData.lastScrollTime + 100 > Date.now()) {
|
|
7453
|
-
multiple = 1.03;
|
|
7454
|
-
}
|
|
7455
|
-
const deltaTop = deltaY * multiple;
|
|
7456
|
-
const deltaLeft = deltaX * multiple;
|
|
7932
|
+
const wheelSpeed = getWheelSpeed(reactData.lastScrollTime);
|
|
7933
|
+
const deltaTop = deltaY * wheelSpeed;
|
|
7934
|
+
const deltaLeft = deltaX * wheelSpeed;
|
|
7457
7935
|
const isTopWheel = deltaTop < 0;
|
|
7458
|
-
const currScrollTop =
|
|
7936
|
+
const currScrollTop = bodyScrollElem.scrollTop;
|
|
7459
7937
|
// 如果滚动位置已经是顶部或底部,则不需要触发
|
|
7460
|
-
if (isTopWheel ? currScrollTop <= 0 : currScrollTop >=
|
|
7938
|
+
if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
|
|
7461
7939
|
return;
|
|
7462
7940
|
}
|
|
7463
7941
|
const scrollTop = bodyScrollElem.scrollTop + deltaTop;
|
|
@@ -7470,16 +7948,29 @@ const Methods = {
|
|
|
7470
7948
|
if (rowOpts.isHover || highlightHoverRow) {
|
|
7471
7949
|
$xeTable.clearHoverRow();
|
|
7472
7950
|
}
|
|
7473
|
-
|
|
7474
|
-
|
|
7475
|
-
|
|
7476
|
-
|
|
7477
|
-
|
|
7478
|
-
|
|
7479
|
-
|
|
7480
|
-
|
|
7481
|
-
|
|
7951
|
+
wheelScrollTo(scrollTop - bodyScrollElem.scrollTop, (offsetTop) => {
|
|
7952
|
+
const currTopNum = bodyScrollElem.scrollTop + offsetTop;
|
|
7953
|
+
internalData.inWheelScroll = true;
|
|
7954
|
+
setScrollTop(yHandleEl, currTopNum);
|
|
7955
|
+
setScrollTop(bodyScrollElem, currTopNum);
|
|
7956
|
+
setScrollTop(leftScrollElem, currTopNum);
|
|
7957
|
+
setScrollTop(rightScrollElem, currTopNum);
|
|
7958
|
+
$xeTable.triggerScrollYEvent(evnt);
|
|
7959
|
+
$xeTable.handleScrollEvent(evnt, isRollY, isRollX, currTopNum, scrollLeft, {
|
|
7960
|
+
type: 'table',
|
|
7961
|
+
fixed: ''
|
|
7962
|
+
});
|
|
7482
7963
|
});
|
|
7964
|
+
// internalData.inWheelScroll = true
|
|
7965
|
+
// setScrollTop(yHandleEl, scrollTop)
|
|
7966
|
+
// setScrollTop(bodyScrollElem, scrollTop)
|
|
7967
|
+
// setScrollTop(leftScrollElem, scrollTop)
|
|
7968
|
+
// setScrollTop(rightScrollElem, scrollTop)
|
|
7969
|
+
// loadScrollYData($xeTable, scrollTop)
|
|
7970
|
+
// $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
|
|
7971
|
+
// type: 'footer',
|
|
7972
|
+
// fixed: ''
|
|
7973
|
+
// })
|
|
7483
7974
|
}
|
|
7484
7975
|
},
|
|
7485
7976
|
triggerVirtualScrollXEvent(evnt) {
|
|
@@ -7550,15 +8041,13 @@ const Methods = {
|
|
|
7550
8041
|
},
|
|
7551
8042
|
updateScrollXData() {
|
|
7552
8043
|
const $xeTable = this;
|
|
7553
|
-
const
|
|
7554
|
-
const {
|
|
8044
|
+
const reactData = $xeTable;
|
|
8045
|
+
const { isAllOverflow } = reactData;
|
|
7555
8046
|
handleTableColumn($xeTable);
|
|
7556
|
-
// calcCellHeight()
|
|
7557
8047
|
return $xeTable.$nextTick().then(() => {
|
|
7558
|
-
// calcCellHeight()
|
|
7559
8048
|
handleTableColumn($xeTable);
|
|
7560
8049
|
$xeTable.updateScrollXSpace();
|
|
7561
|
-
if (!
|
|
8050
|
+
if (!isAllOverflow) {
|
|
7562
8051
|
$xeTable.updateScrollYSpace();
|
|
7563
8052
|
}
|
|
7564
8053
|
});
|
|
@@ -7614,9 +8103,7 @@ const Methods = {
|
|
|
7614
8103
|
updateScrollYData() {
|
|
7615
8104
|
const $xeTable = this;
|
|
7616
8105
|
$xeTable.handleTableData();
|
|
7617
|
-
// calcCellHeight()
|
|
7618
8106
|
return $xeTable.$nextTick().then(() => {
|
|
7619
|
-
// calcCellHeight()
|
|
7620
8107
|
$xeTable.handleTableData();
|
|
7621
8108
|
$xeTable.updateScrollYSpace();
|
|
7622
8109
|
});
|
|
@@ -7624,38 +8111,36 @@ const Methods = {
|
|
|
7624
8111
|
// 更新纵向 Y 可视渲染上下剩余空间大小
|
|
7625
8112
|
updateScrollYSpace() {
|
|
7626
8113
|
const $xeTable = this;
|
|
7627
|
-
const props = $xeTable;
|
|
7628
8114
|
const reactData = $xeTable;
|
|
7629
8115
|
const internalData = $xeTable;
|
|
7630
|
-
const {
|
|
7631
|
-
const {
|
|
7632
|
-
const { scrollYStore, elemStore, afterFullData, fullAllDataRowIdData } = internalData;
|
|
8116
|
+
const { isAllOverflow, scrollYLoad } = reactData;
|
|
8117
|
+
const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData;
|
|
7633
8118
|
const { startIndex } = scrollYStore;
|
|
8119
|
+
const rowOpts = $xeTable.computeRowOpts;
|
|
8120
|
+
const cellOpts = $xeTable.computeCellOpts;
|
|
8121
|
+
const defaultRowHeight = $xeTable.computeDefaultRowHeight;
|
|
7634
8122
|
const bodyTableElem = getRefElem(elemStore['main-body-table']);
|
|
7635
8123
|
const containerList = ['main', 'left', 'right'];
|
|
7636
8124
|
let topSpaceHeight = 0;
|
|
7637
8125
|
let ySpaceHeight = 0;
|
|
7638
8126
|
if (scrollYLoad) {
|
|
7639
|
-
|
|
7640
|
-
|
|
7641
|
-
|
|
8127
|
+
const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
|
|
8128
|
+
if (!isCustomCellHeight && isAllOverflow) {
|
|
8129
|
+
ySpaceHeight = afterFullData.length * defaultRowHeight;
|
|
8130
|
+
topSpaceHeight = Math.max(0, startIndex * defaultRowHeight);
|
|
7642
8131
|
}
|
|
7643
8132
|
else {
|
|
7644
8133
|
for (let i = 0; i < afterFullData.length; i++) {
|
|
7645
8134
|
const row = afterFullData[i];
|
|
7646
8135
|
const rowid = getRowid($xeTable, row);
|
|
7647
|
-
const rowRest = fullAllDataRowIdData[rowid];
|
|
7648
|
-
|
|
7649
|
-
ySpaceHeight += rowRest.height || rowHeight;
|
|
7650
|
-
}
|
|
8136
|
+
const rowRest = fullAllDataRowIdData[rowid] || {};
|
|
8137
|
+
ySpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
7651
8138
|
}
|
|
7652
8139
|
for (let i = 0; i < startIndex; i++) {
|
|
7653
8140
|
const row = afterFullData[i];
|
|
7654
8141
|
const rowid = getRowid($xeTable, row);
|
|
7655
|
-
const rowRest = fullAllDataRowIdData[rowid];
|
|
7656
|
-
|
|
7657
|
-
topSpaceHeight += rowRest.height || rowHeight;
|
|
7658
|
-
}
|
|
8142
|
+
const rowRest = fullAllDataRowIdData[rowid] || {};
|
|
8143
|
+
topSpaceHeight += rowRest.resizeHeight || rowRest.height || cellOpts.height || rowOpts.height || defaultRowHeight;
|
|
7659
8144
|
}
|
|
7660
8145
|
}
|
|
7661
8146
|
}
|
|
@@ -7681,7 +8166,7 @@ const Methods = {
|
|
|
7681
8166
|
if (scrollYSpaceEl) {
|
|
7682
8167
|
scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
|
|
7683
8168
|
}
|
|
7684
|
-
$xeTable.$nextTick(() => {
|
|
8169
|
+
return $xeTable.$nextTick().then(() => {
|
|
7685
8170
|
updateStyle($xeTable);
|
|
7686
8171
|
});
|
|
7687
8172
|
},
|
|
@@ -7746,10 +8231,8 @@ const Methods = {
|
|
|
7746
8231
|
*/
|
|
7747
8232
|
scrollToRow(row, fieldOrColumn) {
|
|
7748
8233
|
const $xeTable = this;
|
|
7749
|
-
const props = $xeTable;
|
|
7750
8234
|
const reactData = $xeTable;
|
|
7751
|
-
const {
|
|
7752
|
-
const { scrollYLoad, scrollXLoad } = reactData;
|
|
8235
|
+
const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData;
|
|
7753
8236
|
const rest = [];
|
|
7754
8237
|
if (row) {
|
|
7755
8238
|
if (this.treeConfig) {
|
|
@@ -7764,7 +8247,7 @@ const Methods = {
|
|
|
7764
8247
|
}
|
|
7765
8248
|
return Promise.all(rest).then(() => {
|
|
7766
8249
|
if (row) {
|
|
7767
|
-
if (!
|
|
8250
|
+
if (!isAllOverflow && (scrollYLoad || scrollXLoad)) {
|
|
7768
8251
|
calcCellHeight($xeTable);
|
|
7769
8252
|
calcCellWidth($xeTable);
|
|
7770
8253
|
}
|