vxe-table 4.21.4 → 4.21.6

package/README.md

@@ -20,34 +20,45 @@
   * 双向数据流的设计，在渲染器或自定义扩展中支持直接操作数据值，达到最高效的简洁 API 设计
   * 按需加载、自定义主题样式
 
+* 分支说明
+  * v3 分支和 v4 分支功能与 API 保持同步更新
+  * v3 分支对应 vue 2.6~2.7 版本，v3.9+ 为长期维护版本
+  * v4 分支对应 vue 3.x 版本，v4.7+ 为长期维护版本
+
 * 版本说明
   * **V4**
-    * [ ] v4.22 功能需求收集中，大福提升渲染性能，优化百万级渲染量
-    * [x] v4.21 重构全键盘操作，解决按键输入为拼音输入法时第一个字符无法唤起输入法问题
+    * [ ] v4.? 重构虚拟渲染v8，数据渲染量提升至千万级
+    * [ ] v4.? 重构虚拟渲染v7，优化百万级渲染量
+    * [ ] v4.? 重构虚拟渲染v6，同时支持原生滚动条和虚拟滚动条
+    * [ ] v4.? 功能需求收集中...
+    * [x] v4.21 重构全键盘操作，修复按键编辑为拼音输入法时首字母丢失问题；筛选支持自适应屏幕上下位置显示；优化虚拟渲染，解决滚动错位场景
     * [x] v4.20 内部重构优化，内部结构调整
     * [x] v4.19 增加对增删改操作撤销回退的支持；优化虚拟渲染，优化提升 Window/Mac 触摸板滚动流畅度
     * [x] v4.18 基于 xe-utils@4.0+，内部优化，优化键盘操作
     * [x] v4.17 优化触摸板操作；重构筛选渲染，筛选配置更简单功能更强大
     * [x] v4.16 适配 Gantt 甘特图
-    * [x] v4.15 优化虚拟渲染，降低内存的占用率
-    * [x] v4.14 重构虚拟渲染，提高渲染与拖拽效果流畅度
-    * [x] v4.13 优化虚拟渲染，提升 Chrome、Safari、Firefox 流畅度极兼容性
-    * [x] v4.12 重构虚拟渲染，支持百万级数据渲染、渲染性能及流畅度大幅提升
+    * [x] v4.15 重构虚拟渲染v5，降低内存的占用率
+    * [x] v4.14 重构虚拟渲染v4，提高渲染与拖拽效果流畅度
+    * [x] v4.13 重构虚拟渲染v3，提升 Chrome、Safari、Firefox 流畅度极兼容性
+    * [x] v4.12 重构虚拟渲染v2，支持百万级数据渲染、渲染性能及流畅度大幅提升
     * [x] v4.11 重构展开行功能，同时支持展开行与虚拟渲染和冻结列
     * [x] v4.7 基于 vue3.2+，内部重构，拆分 Table 库和 UI 库，只支持现代浏览器，不支持 IE
     * [x] ~~v4.0 基于 vue3.2+，只支持现代浏览器，不支持 IE（2020-03-01 ~ 2024-12-01 已停止维护）~~
   * **V3**
-    * [ ] v3.24 功能需求收集中，大福提升渲染性能，优化百万级渲染量
-    * [x] v3.23 重构全键盘操作，解决按键输入为拼音输入法时第一个字符无法唤起输入法问题
+    * [ ] v3.? 重构虚拟渲染v8，数据渲染量提升至千万级
+    * [ ] v3.? 重构虚拟渲染v7，优化百万级渲染量
+    * [ ] v3.? 重构虚拟渲染v6，同时支持原生滚动条和虚拟滚动条
+    * [ ] v3.? 功能需求收集中...
+    * [x] v3.23 重构全键盘操作，修复按键编辑为拼音输入法时首字母丢失问题；筛选支持自适应屏幕上下位置显示；优化虚拟渲染，解决滚动错位场景
     * [x] v3.22 内部重构优化，内部结构调整
     * [x] v3.21 增加对增删改操作撤销回退的支持；优化虚拟渲染，优化提升 Window/Mac 触摸板滚动流畅度
     * [x] v3.20 基于 xe-utils@4.0+，优化渲染性能，优化键盘操作
     * [x] v3.19 优化触摸板操作；重构筛选渲染，筛选配置更简单功能更强大
     * [x] v3.18 适配 Gantt 甘特图
-    * [x] v3.17 优化虚拟渲染，降低内存的占用率
-    * [x] v3.16 重构虚拟渲染，提高渲染与拖拽效果流畅度
-    * [x] v3.15 优化虚拟渲染，提升 Chrome、Safari、Firefox 流畅度极兼容性
-    * [x] v3.14 重构虚拟渲染，支持百万级数据渲染、渲染性能及流畅度大幅提升
+    * [x] v3.17 重构虚拟渲染v5，降低内存的占用率
+    * [x] v3.16 重构虚拟渲染v4，提高渲染与拖拽效果流畅度
+    * [x] v3.15 重构虚拟渲染v3，提升 Chrome、Safari、Firefox 流畅度极兼容性
+    * [x] v3.14 重构虚拟渲染v2，支持百万级数据渲染、渲染性能及流畅度大幅提升
     * [x] v3.13 重构展开行功能，同时支持展开行与虚拟渲染和冻结列
     * [x] v3.9 基于 vue2.6~2.7，内部重构，拆分 Table 库和 UI 库，只支持现代浏览器，不支持 IE
     * [x] ~~v3.0 基于 vue2.6~2.7，支持现代浏览器并保留兼容 IE11（2020-03-01 ~ 2024-12-01 已停止维护）~~
@@ -55,10 +66,6 @@
     * [x] ~~v2.0 基于 vue2.6~2.7，支持所有主流的浏览器，同时兼具功能与性能（2019-03-01 ~ 2021-12-01 已停止维护）~~
   * **V1**
     * [x] ~~v1.0 基于 vue2.6~2.7，支持所有主流的浏览器，实现表格的一切实用的功能（2018-02-01 ~ 2020-04-01 已停止维护）~~
-* 版本计划
-    * [x] 优化展开行与冻结列
-    * [ ] 优化虚拟渲染，支持千万级数据渲染
-    * [ ] 数据图表可视化
 
 ## 浏览器支持
 

package/dist/all.esm.js

@@ -47,7 +47,7 @@ function getDefaultConfig(val1, def1) {
     return XEUtils.eqNull(val1) ? def1 : val1;
 }
 
-const version = "4.21.4";
+const version = "4.21.6";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({
@@ -729,6 +729,18 @@ function hasEventInputTarget(target) {
     const tagName = target ? target.tagName : '';
     return tagName && ['input', 'textarea'].includes((tagName.toLowerCase()));
 }
+/**
+ * 判断是否由内部可复用控件触发，输入框带有 vxe-reusekeep-control
+ */
+function hasReusekeepControl(elem) {
+    if (elem) {
+        return hasClass(elem, 'vxe-reusekeep-control');
+    }
+    return false;
+}
+function hasAxternalInputTarget(target) {
+    return hasEventInputTarget(target) ? !hasReusekeepControl(target) : false;
+}
 const scrollIntoViewIfNeeded = 'scrollIntoViewIfNeeded';
 const scrollIntoView = 'scrollIntoView';
 function scrollToView(elem) {
@@ -767,9 +779,159 @@ function wheelScrollTopTo(diffNum, cb) {
         wtaFrame = null;
     });
 }
+/**
+ * 通用定位计算
+ */
+function updatePanelPlacement(targetElem, panelElem, options) {
+    const { defaultTop, defaultLeft, placement, defaultPlacement, teleportTo, marginSize, isMinWidth } = Object.assign({
+        teleportTo: false,
+        marginSize: 18,
+        isMinWidth: true
+    }, options);
+    let panelPlacement = 'bottom';
+    let top = '';
+    let bottom = '';
+    let left = 0;
+    let minWidth = '';
+    let arrowLeft = '';
+    const stys = {};
+    if (panelElem && targetElem) {
+        const bodyEl = document.body;
+        const parentWrapperEl = getPopupWrapperElement(panelElem);
+        if (parentWrapperEl) {
+            const targetWidth = targetElem.offsetWidth;
+            const targetHeight = targetElem.offsetHeight;
+            const panelWidth = panelElem.offsetWidth;
+            const panelHeight = panelElem.offsetHeight;
+            const parentWrapperRect = parentWrapperEl.getBoundingClientRect();
+            const panelRect = panelElem.getBoundingClientRect();
+            const targetRect = targetElem.getBoundingClientRect();
+            const visibleHeight = bodyEl.clientHeight;
+            const visibleWidth = bodyEl.clientWidth;
+            const offsetLeft = parentWrapperRect.left;
+            const offsetTop = parentWrapperRect.top;
+            const targetLeft = targetRect.left;
+            const targetTop = targetRect.top;
+            minWidth = targetElem.offsetWidth;
+            if (teleportTo) {
+                left = defaultLeft || (targetLeft - (panelWidth - targetWidth) / 2);
+                top = defaultTop || (targetTop + targetHeight);
+                if (placement === 'top') {
+                    panelPlacement = 'top';
+                    top = targetTop - panelHeight;
+                }
+                else if (!placement) {
+                    if (defaultPlacement === 'top') {
+                        panelPlacement = 'top';
+                        if (!defaultTop) {
+                            top = targetTop - panelHeight;
+                        }
+                        // 如果上面不够放，则向下
+                        if (top < marginSize) {
+                            panelPlacement = 'bottom';
+                            top = targetTop + targetHeight;
+                        }
+                        // 如果下面不够放，则向上（优先）
+                        if (top + panelHeight + marginSize > visibleHeight) {
+                            panelPlacement = 'top';
+                            top = targetTop - panelHeight;
+                        }
+                    }
+                    else {
+                        // 如果下面不够放，则向上
+                        if (top + panelHeight + marginSize > visibleHeight) {
+                            panelPlacement = 'top';
+                            top = targetTop - panelHeight;
+                        }
+                        // 如果上面不够放，则向下（优先）
+                        if (top < marginSize) {
+                            panelPlacement = 'bottom';
+                            top = targetTop + targetHeight;
+                        }
+                    }
+                }
+                // 如果溢出右边
+                if (left + panelWidth + marginSize > visibleWidth) {
+                    left -= left + panelWidth + marginSize - visibleWidth;
+                }
+                // 如果溢出左边
+                if (left < marginSize) {
+                    left = marginSize;
+                }
+                // 偏移
+                top -= offsetTop;
+                left -= offsetLeft;
+            }
+            else {
+                if (placement === 'top') {
+                    panelPlacement = 'top';
+                    bottom = targetHeight;
+                }
+                else if (!placement) {
+                    // 如果下面不够放，则向上
+                    top = targetHeight;
+                    if (targetTop + targetHeight + panelHeight + marginSize > visibleHeight) {
+                        // 如果上面不够放，则向下（优先）
+                        if (targetTop - targetHeight - panelHeight > marginSize) {
+                            panelPlacement = 'top';
+                            top = '';
+                            bottom = targetHeight;
+                        }
+                    }
+                }
+                // 是否超出右侧
+                if (panelRect.left + panelRect.width + marginSize > visibleWidth) {
+                    left = -(panelRect.left + panelRect.width + marginSize - visibleWidth);
+                }
+            }
+            if (XEUtils.isNumber(top)) {
+                stys.top = toCssUnit(top);
+            }
+            if (XEUtils.isNumber(bottom)) {
+                stys.bottom = toCssUnit(bottom);
+            }
+            if (XEUtils.isNumber(left)) {
+                stys.left = toCssUnit(left);
+            }
+            if (isMinWidth && XEUtils.isNumber(minWidth)) {
+                stys.minWidth = toCssUnit(minWidth);
+            }
+            // 箭头
+            if (left === targetLeft) {
+                if (targetWidth <= panelWidth) {
+                    arrowLeft = targetWidth / 2;
+                }
+            }
+            else if (left < targetLeft) {
+                if (left + panelWidth > targetLeft + targetWidth) {
+                    arrowLeft = (targetLeft - left) + targetWidth / 2;
+                }
+                else {
+                    arrowLeft = (targetLeft - left) + (panelWidth - (targetLeft - left)) / 2;
+                }
+            }
+        }
+    }
+    return {
+        top: top || 0,
+        bottom: bottom || 0,
+        left: left || 0,
+        arrowLeft: arrowLeft || 0,
+        style: stys,
+        placement: panelPlacement
+    };
+}
+function getPopupWrapperElement(panelElem) {
+    if (!panelElem) {
+        return null;
+    }
+    const bodyEl = document.body;
+    const parentEl = panelElem.parentElement;
+    return (parentEl === bodyEl ? document.documentElement : parentEl) || null;
+}
 
 const { log } = VxeUI;
-const tableVersion = `table v${"4.21.4"}`;
+const tableVersion = `table v${"4.21.6"}`;
 function createComponentLog(name) {
     const uiVersion = VxeUI.uiVersion ? `ui v${VxeUI.uiVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -1016,6 +1178,10 @@ function createInternalData$3() {
         customMaxHeight: 0,
         // 当前 hover 行
         hoverRow: null,
+        hoverCol: null,
+        // 当前行
+        currentRow: null,
+        currentCol: null,
         // 最后滚动位置
         lastScrollLeft: 0,
         lastScrollTop: 0,
@@ -1063,8 +1229,6 @@ function createInternalData$3() {
         fullColumnFieldData: {},
         fullCellHeightMaps: {},
         fullCellStoreMaps: {},
-        // 当前行
-        currentRow: null,
         // 合并表头单元格的数据
         mergeHeaderList: [],
         mergeHeaderMaps: {},
@@ -1164,8 +1328,6 @@ function createReactData$2() {
         isAllSelected: false,
         // 复选框属性，有选中且非全选状态
         isIndeterminate: false,
-        // 单选框属性，选中列
-        currentColumn: null,
         // 单选框属性，选中行
         selectRadioRow: null,
         // 表尾合计数据
@@ -1374,7 +1536,8 @@ function createReactData$2() {
         dragTipText: '',
         isDragResize: false,
         isRowLoading: false,
-        isColLoading: false
+        isColLoading: false,
+        currColFlag: 1
     };
 }
 const maxKey = '__max';
@@ -4150,8 +4313,8 @@ var TableBodyComponent = defineVxeComponent({
             const $xeGrid = $xeTable.xeGrid;
             const $xeGantt = $xeTable.xeGantt;
             const { columnKey, resizable: allResizable, showOverflow: allShowOverflow, border, height, treeConfig, cellClassName: allCellClassName, cellStyle, align: allAlign, spanMethod, mouseConfig, editConfig, editRules, tooltipConfig, padding: allPadding } = tableProps;
-            const { tableData, tableColumn, dragRow, overflowX, overflowY, currentColumn, scrollXLoad, scrollYLoad, mergeBodyFlag, calcCellHeightFlag, resizeHeightFlag, resizeWidthFlag, editStore, isAllOverflow, validErrorMaps } = tableReactData;
-            const { fullAllDataRowIdData, fullColumnIdData, mergeBodyCellMaps, visibleColumn, afterFullData, mergeBodyList, scrollXStore, scrollYStore, keepUpdateFieldMaps } = tableInternalData;
+            const { tableData, tableColumn, dragRow, overflowX, overflowY, scrollXLoad, scrollYLoad, mergeBodyFlag, calcCellHeightFlag, resizeHeightFlag, resizeWidthFlag, editStore, isAllOverflow, validErrorMaps, currColFlag } = tableReactData;
+            const { fullAllDataRowIdData, fullColumnIdData, mergeBodyCellMaps, visibleColumn, afterFullData, mergeBodyList, scrollXStore, scrollYStore, keepUpdateFieldMaps, currentCol } = tableInternalData;
             const cellOpts = computeCellOpts.value;
             const validOpts = computeValidOpts.value;
             const checkboxOpts = computeCheckboxOpts.value;
@@ -4496,7 +4659,7 @@ var TableBodyComponent = defineVxeComponent({
                         'col--active': editConfig && isEdit && (actived.row === row && (actived.column === column || editOpts.mode === 'row')),
                         'col--valid-error': !!errorValidItem,
                         'show--valid-bg': errorValidItem && validOpts.showErrorBackground,
-                        'col--current': currentColumn === column
+                        'col--current': currColFlag && currentCol === column
                     },
                     getPropClass(compCellClassName, cellParams),
                     getPropClass(className, cellParams),
@@ -4980,8 +5143,8 @@ var TableHeaderComponent = defineVxeComponent({
             const $xeGantt = $xeTable.xeGantt;
             const { fixedType } = props;
             const { resizable: allResizable, columnKey, showCustomHeader, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, mouseConfig } = tableProps;
-            const { currentColumn, dragCol, scrollXLoad, scrollYLoad, overflowX, mergeHeadFlag, tableColumn } = tableReactData;
-            const { fullColumnIdData, scrollXStore, mergeHeaderList, mergeHeaderCellMaps } = tableInternalData;
+            const { dragCol, scrollXLoad, scrollYLoad, overflowX, mergeHeadFlag, tableColumn, currColFlag } = tableReactData;
+            const { fullColumnIdData, scrollXStore, mergeHeaderList, mergeHeaderCellMaps, currentCol } = tableInternalData;
             const virtualXOpts = computeVirtualXOpts.value;
             const columnOpts = computeColumnOpts.value;
             const columnDragOpts = computeColumnDragOpts.value;
@@ -5131,7 +5294,7 @@ var TableHeaderComponent = defineVxeComponent({
                             'is--filter-active': hasFilter,
                             'is--drag-active': columnOpts.drag && !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
                             'is--drag-disabled': columnOpts.drag && isDisabledDrag,
-                            'col--current': currentColumn === column
+                            'col--current': currColFlag && currentCol === column
                         },
                         headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName) : '',
                         headerCellClassName ? (XEUtils.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName) : ''
@@ -5169,8 +5332,8 @@ var TableHeaderComponent = defineVxeComponent({
             const $xeGantt = $xeTable.xeGantt;
             const { fixedType } = props;
             const { showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign } = tableProps;
-            const { currentColumn, overflowX } = tableReactData;
-            const { fullColumnIdData } = tableInternalData;
+            const { overflowX, currColFlag } = tableReactData;
+            const { fullColumnIdData, currentCol } = tableInternalData;
             const headerTooltipOpts = computeHeaderTooltipOpts.value;
             const cellOpts = computeCellOpts.value;
             const defaultRowHeight = computeDefaultRowHeight.value;
@@ -5239,7 +5402,7 @@ var TableHeaderComponent = defineVxeComponent({
                             'fixed--width': !isAutoCellWidth,
                             'is--padding': isPadding,
                             'is--sortable': column.sortable,
-                            'col--current': currentColumn === column
+                            'col--current': currColFlag && currentCol === column
                         }
                     ], key: colid }, thAttrs), [
                     h('div', {
@@ -5490,8 +5653,8 @@ var TableFooterComponent = defineVxeComponent({
             const $xeGantt = $xeTable.xeGantt;
             const { fixedType } = props;
             const { resizable: allResizable, border, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, footerSpanMethod, align: allAlign, columnKey, showFooterOverflow: allColumnFooterOverflow } = tableProps;
-            const { scrollXLoad, scrollYLoad, overflowX, currentColumn, mergeFootFlag } = tableReactData;
-            const { fullColumnIdData, mergeFooterList, mergeFooterCellMaps, scrollXStore } = tableInternalData;
+            const { scrollXLoad, scrollYLoad, overflowX, mergeFootFlag, currColFlag } = tableReactData;
+            const { fullColumnIdData, mergeFooterList, mergeFooterCellMaps, scrollXStore, currentCol } = tableInternalData;
             const virtualXOpts = computeVirtualXOpts.value;
             const footerTooltipOpts = computeFooterTooltipOpts.value;
             const resizableOpts = computeResizableOpts.value;
@@ -5627,7 +5790,7 @@ var TableFooterComponent = defineVxeComponent({
                             'is--pg-left': isCellPaddingLeft,
                             'is--pg-right': isCellPaddingRight,
                             'col--ellipsis': hasEllipsis,
-                            'col--current': currentColumn === column
+                            'col--current': currColFlag && currentCol === column
                         }, getPropClass(footerClassName, cellParams), getPropClass(footerCellClassName, cellParams)] }, attrs), { style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null }), tfOns), { key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag ? column.id : $columnIndex }), [
                     h('div', {
                         class: ['vxe-cell', {
@@ -8686,15 +8849,12 @@ hooks$7.add('tableFilterModule', {
             const { filterStore } = reactData;
             const { elemStore } = internalData;
             const { column, targetEl } = filterStore;
-            if (!column || !targetEl) {
+            if (!column) {
                 return nextTick();
             }
             const tableEl = refElem.value;
-            const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = getDomNode();
             const filterOpts = computeFilterOpts.value;
             const { maxHeight: customMaxHeight, transfer, zIndex } = filterOpts;
-            const currEl = targetEl;
-            const tableRect = tableEl.getBoundingClientRect();
             const filterRender = column ? column.filterRender : null;
             const compConf = filterRender && isEnableConf(filterRender) ? renderer$5.get(filterRender.name) : null;
             const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
@@ -8706,67 +8866,82 @@ hooks$7.add('tableFilterModule', {
             if (!filterWrapperElem) {
                 return nextTick();
             }
-            const btnRect = currEl.getBoundingClientRect();
             const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
             const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
-            const filterWidth = filterWrapperElem.offsetWidth;
-            const centerWidth = currEl ? filterWidth / 2 : ((filterWidth - column.renderWidth) / 2);
-            let left = 0;
-            let top = 0;
-            let maxHeight = 0;
             /**
              * 是否显示筛选按钮图标
              * 如果不存在图标，则相对单元格居中显示
              */
-            if (transfer) {
-                left = btnRect.left - centerWidth + scrollLeft;
-                top = btnRect.top + currEl.clientHeight + scrollTop;
-                maxHeight = Math.min(Math.max(tableRect.height, Math.floor(visibleHeight / 2)), Math.max(80, visibleHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 28));
-                if (left < 16) {
-                    left = 16;
+            const handleStyle = () => {
+                let currEl = targetEl;
+                if (!targetEl) {
+                    const headerWrapperElem = getRefElem(elemStore[`${column.fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
+                    const colEl = headerWrapperElem ? headerWrapperElem.querySelector(`.vxe-header--column.${column.id}`) : null;
+                    if (colEl) {
+                        currEl = colEl;
+                    }
                 }
-                else if (left > (visibleWidth - filterWidth - 16)) {
-                    left = visibleWidth - filterWidth - 16;
+                if (!currEl) {
+                    return nextTick();
                 }
-            }
-            else {
-                left = btnRect.left - tableRect.left - centerWidth;
-                top = btnRect.top - tableRect.top + currEl.clientHeight;
-                maxHeight = Math.max(40, tableEl.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
-                if (left < 1) {
-                    left = 1;
+                const btnRect = currEl.getBoundingClientRect();
+                const tableRect = tableEl.getBoundingClientRect();
+                let left = 0;
+                let top = 0;
+                let maxHeight = 0;
+                let panelStyle = {};
+                if (transfer) {
+                    const ppObj = updatePanelPlacement(currEl, filterWrapperElem, {
+                        defaultPlacement: 'bottom',
+                        isMinWidth: false,
+                        teleportTo: transfer
+                    });
+                    panelStyle = ppObj.style;
                 }
-                else if (left > (tableEl.clientWidth - filterWidth - 1)) {
-                    left = tableEl.clientWidth - filterWidth - 1;
+                else {
+                    const filterWidth = filterWrapperElem.offsetWidth;
+                    const centerWidth = targetEl ? filterWidth / 2 : ((filterWidth - column.renderWidth) / 2);
+                    left = btnRect.left - tableRect.left - centerWidth;
+                    top = btnRect.top - tableRect.top + currEl.clientHeight;
+                    maxHeight = Math.max(40, tableEl.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
+                    if (left < 1) {
+                        left = 1;
+                    }
+                    else if (left > (tableEl.clientWidth - filterWidth - 1)) {
+                        left = tableEl.clientWidth - filterWidth - 1;
+                    }
+                    if ($xeGGWrapper) {
+                        const wrapperEl = $xeGGWrapper.getRefMaps().refElem.value;
+                        if (wrapperEl) {
+                            const wrapperRect = wrapperEl.getBoundingClientRect();
+                            top += tableRect.top - wrapperRect.top;
+                        }
+                    }
+                    panelStyle = {
+                        top: toCssUnit(top),
+                        left: toCssUnit(left)
+                    };
                 }
-                if ($xeGGWrapper) {
-                    const wrapperEl = $xeGGWrapper.getRefMaps().refElem.value;
-                    if (wrapperEl) {
-                        const wrapperRect = wrapperEl.getBoundingClientRect();
-                        top += tableRect.top - wrapperRect.top;
+                if (zIndex) {
+                    panelStyle.zIndex = zIndex;
+                }
+                filterStore.style = panelStyle;
+                // 筛选面板是自适应表格高度
+                if (compConf ? !compConf.tableFilterAutoHeight : false) {
+                    maxHeight = 0;
+                }
+                else {
+                    if (customMaxHeight) {
+                        maxHeight = customMaxHeight > maxHeight ? maxHeight : customMaxHeight;
                     }
                 }
-            }
-            const fStys = {
-                top: toCssUnit(top),
-                left: toCssUnit(left)
+                // 判断面板不能大于表格高度
+                filterStore.maxHeight = maxHeight;
             };
-            if (zIndex) {
-                fStys.zIndex = zIndex;
-            }
-            filterStore.style = fStys;
-            // 筛选面板是自适应表格高度
-            if (compConf ? !compConf.tableFilterAutoHeight : false) {
-                maxHeight = 0;
-            }
-            else {
-                if (customMaxHeight) {
-                    maxHeight = customMaxHeight > maxHeight ? maxHeight : customMaxHeight;
-                }
-            }
-            // 判断面板不能大于表格高度
-            filterStore.maxHeight = maxHeight;
-            return nextTick();
+            handleStyle();
+            return nextTick().then(() => {
+                handleStyle();
+            });
         };
         const filterPrivateMethods = {
             checkFilterOptions() {
@@ -8784,15 +8959,14 @@ hooks$7.add('tableFilterModule', {
                     filterStore.visible = false;
                 }
                 else {
-                    const currEl = btnEl || colEl;
                     $xeTable.handleFilterOptions(column);
                     internalData._currFilterParams = params;
-                    filterStore.targetEl = currEl;
+                    filterStore.targetEl = btnEl;
                     filterStore.style = null;
                     filterStore.visible = true;
                     initStore.filter = true;
                 }
-                nextTick(() => {
+                nextTick().then(() => {
                     updatePopupStyle();
                 });
                 $xeTable.dispatchEvent('filter-visible', { column, field: column.field, property: column.field, filterList: $xeTable.getCheckedFilters(), visible: filterStore.visible }, evnt);
@@ -13002,11 +13176,10 @@ hooks$3.add('tableKeyboardModule', {
             },
             // 处理当前列方向键移动
             moveCurrentColumn(isLeftArrow, isRightArrow, evnt) {
-                const { currentColumn } = reactData;
-                const { visibleColumn } = internalData;
+                const { currentCol, visibleColumn } = internalData;
                 let targetCol = null;
-                if (currentColumn) {
-                    const _columnIndex = $xeTable.getVTColumnIndex(currentColumn);
+                if (currentCol) {
+                    const _columnIndex = $xeTable.getVTColumnIndex(currentCol);
                     if (isLeftArrow && _columnIndex > 0) {
                         targetCol = visibleColumn[_columnIndex - 1];
                     }
@@ -15972,10 +16145,18 @@ var VxeTableComponent = defineVxeComponent({
             return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.tooltipConfig, props.tooltipConfig);
         });
         const computeHeaderTooltipOpts = computed(() => {
-            return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.headerTooltipConfig, props.headerTooltipConfig);
+            const tooltipOpts = computeTooltipOpts.value;
+            return Object.assign({}, getConfig$2().tooltip, {
+                enterable: tooltipOpts.enterable,
+                defaultPlacement: tooltipOpts.defaultPlacement
+            }, getConfig$2().table.headerTooltipConfig, props.headerTooltipConfig);
         });
         const computeFooterTooltipOpts = computed(() => {
-            return Object.assign({}, getConfig$2().tooltip, getConfig$2().table.footerTooltipConfig, props.footerTooltipConfig);
+            const tooltipOpts = computeTooltipOpts.value;
+            return Object.assign({}, getConfig$2().tooltip, {
+                enterable: tooltipOpts.enterable,
+                defaultPlacement: tooltipOpts.defaultPlacement
+            }, getConfig$2().table.footerTooltipConfig, props.footerTooltipConfig);
         });
         const computeTableTipConfig = computed(() => {
             const { tooltipStore } = reactData;
@@ -22402,7 +22583,7 @@ var VxeTableComponent = defineVxeComponent({
             },
             getCurrentColumn() {
                 const columnOpts = computeColumnOpts.value;
-                return columnOpts.isCurrent || props.highlightCurrentColumn ? reactData.currentColumn : null;
+                return columnOpts.isCurrent || props.highlightCurrentColumn ? internalData.currentCol : null;
             },
             /**
              * 用于当前列，设置某列行为高亮状态
@@ -22414,7 +22595,8 @@ var VxeTableComponent = defineVxeComponent({
                 const column = handleFieldOrColumn($xeTable, fieldOrColumn);
                 if (column) {
                     $xeTable.clearCurrentColumn();
-                    reactData.currentColumn = column;
+                    internalData.currentCol = column;
+                    reactData.currColFlag++; // 刷新当前列状态
                 }
                 return nextTick().then(() => {
                     // 更新状选中态
@@ -22427,7 +22609,8 @@ var VxeTableComponent = defineVxeComponent({
              * 用于当前列，手动清空当前高亮的状态
              */
             clearCurrentColumn() {
-                reactData.currentColumn = null;
+                internalData.currentCol = null;
+                reactData.currColFlag++; // 刷新当前列状态
                 return nextTick();
             },
             setPendingRow(rows, status) {
@@ -24060,8 +24243,7 @@ var VxeTableComponent = defineVxeComponent({
         };
         const handleGlobalScrollEvent = (evnt) => {
             const { filterStore } = reactData;
-            const filterOpts = computeFilterOpts.value;
-            if (filterStore.visible && filterOpts.transfer) {
+            if (filterStore.visible) {
                 $xeTable.handleFilterStyle();
             }
             reUpdateCustomStyleEvent(evnt);
@@ -24501,7 +24683,7 @@ var VxeTableComponent = defineVxeComponent({
                                 .then(() => $xeTable.triggerCurrentRowEvent(evnt, params));
                         }
                     }
-                    else if (keyboardConfig && keyboardOpts.isUndoRedo && isControlKey && (isZ || isY) && !hasEventInputTarget(evnt.target)) {
+                    else if (keyboardConfig && keyboardOpts.isUndoRedo && isControlKey && (isZ || isY) && !hasAxternalInputTarget(evnt.target)) {
                         if (evnt.target) {
                             if (isY || (hasShiftKey && isZ)) {
                                 // 恢复被撤销的操作：Ctrl + Y 或 Ctrl + Shift + Z
@@ -24607,6 +24789,10 @@ var VxeTableComponent = defineVxeComponent({
             }
         };
         const handleGlobalResizeEvent = () => {
+            const { filterStore } = reactData;
+            if (filterStore.visible) {
+                $xeTable.handleFilterStyle();
+            }
             if ($xeTable.closeMenu) {
                 $xeTable.closeMenu();
             }
@@ -26797,7 +26983,7 @@ var VxeTableComponent = defineVxeComponent({
                 }
             },
             triggerCurrentColumnEvent(evnt, params) {
-                const { currentColumn: oldValue } = reactData;
+                const { currentCol: oldValue } = internalData;
                 const columnOpts = computeColumnOpts.value;
                 const currentColumnOpts = computeCurrentColumnOpts.value;
                 const beforeRowMethod = currentColumnOpts.beforeSelectMethod || columnOpts.currentMethod;
@@ -28993,9 +29179,9 @@ var VxeTableComponent = defineVxeComponent({
             },
             setHoverRow(row) {
                 const $xeGanttView = internalData.xeGanttView;
+                $xeTable.clearHoverRow();
                 const rowid = getRowid($xeTable, row);
                 const el = refElem.value;
-                $xeTable.clearHoverRow();
                 if (el) {
                     XEUtils.arrayEach(el.querySelectorAll(`.vxe-body--row[rowid="${rowid}"]`), elem => addClass(elem, 'row--hover'));
                 }