vxe-table 3.15.27 → 3.15.29

package/es/table/module/filter/mixin.js

@@ -36,6 +36,7 @@ export default {
             if (column && column.filters) {
                 column.filters = toFilters(options || []);
                 if (isUpdate) {
+                    // 已废弃，即将去掉事件触发 new Event('click') -> null
                     return $xeTable.handleColumnConfirmFilter(column, new Event('click'));
                 }
             }
@@ -287,8 +288,14 @@ export default {
          * @param {Event} evnt 事件
          */
         handleFilterResetFilter(evnt) {
-            this.handleClearFilter(this.filterStore.column);
-            this.confirmFilterEvent(evnt);
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const { filterStore } = reactData;
+            $xeTable.handleClearFilter(filterStore.column);
+            $xeTable.confirmFilterEvent(evnt);
+            if (evnt) {
+                $xeTable.dispatchEvent('clear-filter', { filterList: [] }, evnt);
+            }
         },
         /**
          * 清空指定列的筛选条件
@@ -296,16 +303,20 @@ export default {
          * @param {String} fieldOrColumn 列
          */
         _clearFilter(fieldOrColumn) {
-            const { filterStore } = this;
+            const $xeTable = this;
+            const reactData = $xeTable;
+            const internalData = $xeTable;
+            const { filterStore } = reactData;
+            const { tableFullColumn } = internalData;
             let column;
             if (fieldOrColumn) {
-                column = handleFieldOrColumn(this, fieldOrColumn);
+                column = handleFieldOrColumn($xeTable, fieldOrColumn);
                 if (column) {
-                    this.handleClearFilter(column);
+                    $xeTable.handleClearFilter(column);
                 }
             }
             else {
-                this.visibleColumn.forEach(this.handleClearFilter);
+                tableFullColumn.forEach($xeTable.handleClearFilter);
             }
             if (!fieldOrColumn || column !== filterStore.column) {
                 Object.assign(filterStore, {
@@ -318,12 +329,13 @@ export default {
                     visible: false
                 });
             }
-            return this.updateData();
+            return $xeTable.updateData();
         },
         _updateFilterOptionStatus(item, checked) {
+            const $xeTable = this;
             item._checked = checked;
             item.checked = checked;
-            return this.$nextTick();
+            return $xeTable.$nextTick();
         }
     }
 };

package/es/table/src/methods.js

@@ -3,7 +3,7 @@ import { getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTarge
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
 import Cell from './cell';
-import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getColReMinWidth, createHandleUpdateRowId, createHandleGetRowId, getRefElem } from './util';
+import { getRowUniqueId, clearTableAllStatus, toFilters, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getColReMinWidth, createHandleUpdateRowId, createHandleGetRowId, getRefElem } from './util';
 import { getSlotVNs } from '../../ui/src/vn';
 import { warnLog, errLog } from '../../ui/src/log';
 const { getConfig, getI18n, renderer, formats, interceptor, createEvent } = VxeUI;
@@ -23,8 +23,9 @@ function eqCellValue(row1, row2, field) {
     }
     return XEUtils.isEqual(val1, val2);
 }
-function getNextSortOrder(_vm, column) {
-    const orders = _vm.sortOpts.orders;
+function getNextSortOrder($xeTable, column) {
+    const sortOpts = $xeTable.computeSortOpts;
+    const { orders = [] } = sortOpts;
     const currOrder = column.order || null;
     const oIndex = orders.indexOf(currOrder) + 1;
     return orders[oIndex < orders.length ? oIndex : 0];
@@ -1949,8 +1950,57 @@ function removeFooterMerges($xeTable, merges) {
     }
     return rest;
 }
-function clearAllSort(_vm) {
-    _vm.tableFullColumn.forEach((column) => {
+function handleSortEvent($xeTable, evnt, sortConfs, isUpdate) {
+    const sortOpts = $xeTable.computeSortOpts;
+    const { multiple, remote, orders } = sortOpts;
+    if (!XEUtils.isArray(sortConfs)) {
+        sortConfs = [sortConfs];
+    }
+    if (sortConfs && sortConfs.length) {
+        if (!multiple) {
+            sortConfs = [sortConfs[0]];
+            clearAllSort($xeTable);
+        }
+        let firstColumn = null;
+        sortConfs.forEach((confs, index) => {
+            let { field, order } = confs;
+            let column = field;
+            if (XEUtils.isString(field)) {
+                column = $xeTable.getColumnByField(field);
+            }
+            if (!firstColumn) {
+                firstColumn = column;
+            }
+            if (column && column.sortable) {
+                if (orders && orders.indexOf(order) === -1) {
+                    order = getNextSortOrder($xeTable, column);
+                }
+                if (column.order !== order) {
+                    column.order = order;
+                }
+                column.sortTime = Date.now() + index;
+            }
+        });
+        if (isUpdate) {
+            if (!remote) {
+                $xeTable.handleTableData(true);
+            }
+        }
+        if (evnt) {
+            $xeTable.handleColumnSortEvent(evnt, firstColumn);
+        }
+        return $xeTable.$nextTick().then(() => {
+            updateRowOffsetTop($xeTable);
+            $xeTable.updateCellAreas();
+            return updateStyle($xeTable);
+        });
+    }
+    return $xeTable.$nextTick();
+}
+function clearAllSort($xeTable) {
+    const internalData = $xeTable;
+    const { tableFullColumn } = internalData;
+    tableFullColumn.forEach((column) => {
         column.order = null;
     });
 }
@@ -3162,7 +3212,7 @@ function lazyScrollYData($xeTable) {
 function checkLastSyncScroll($xeTable, isRollX, isRollY) {
     const reactData = $xeTable;
     const internalData = $xeTable;
-    const { scrollXLoad, scrollYLoad } = reactData;
+    const { scrollXLoad, scrollYLoad, isAllOverflow } = reactData;
     const { lcsTimeout } = internalData;
     if (lcsTimeout) {
         clearTimeout(lcsTimeout);
@@ -3177,13 +3227,19 @@ function checkLastSyncScroll($xeTable, isRollX, isRollY) {
         internalData.inBodyScroll = false;
         internalData.inFooterScroll = false;
         internalData.scrollRenderType = '';
-        calcCellHeight($xeTable);
+        if (!isAllOverflow) {
+            calcCellHeight($xeTable);
+            updateRowOffsetTop($xeTable);
+        }
         if (isRollX && scrollXLoad) {
             $xeTable.updateScrollXData();
         }
         if (isRollY && scrollYLoad) {
             $xeTable.updateScrollYData().then(() => {
-                calcCellHeight($xeTable);
+                if (!isAllOverflow) {
+                    calcCellHeight($xeTable);
+                    updateRowOffsetTop($xeTable);
+                }
                 $xeTable.updateScrollYSpace();
             });
         }
@@ -4624,6 +4680,7 @@ const Methods = {
                 }
                 XEUtils.eachTree([targetColumn], (column) => {
                     column.fixed = fixed;
+                    column.renderFixed = fixed;
                 });
                 $xeTable.saveCustomStore('update:fixed');
                 if (!status) {
@@ -4649,6 +4706,7 @@ const Methods = {
             if (targetColumn && targetColumn.fixed) {
                 XEUtils.eachTree([targetColumn], (column) => {
                     column.fixed = null;
+                    column.renderFixed = null;
                 });
                 $xeTable.saveCustomStore('update:fixed');
                 if (!status) {
@@ -6231,7 +6289,16 @@ const Methods = {
             }
         }
         if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
-            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
+            const ctEl = tdEl.querySelector('.vxe-cell--wrapper');
+            let ovEl = null;
+            let tipEl = tdEl.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label');
+            if (column.treeNode) {
+                ovEl = tdEl.querySelector('.vxe-tree-cell');
+            }
+            if (!tipEl) {
+                tipEl = ctEl;
+            }
+            handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
         }
     },
     /**
@@ -6245,7 +6312,16 @@ const Methods = {
         const tdEl = evnt.currentTarget;
         handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row);
         if (tooltipStore.column !== column || !tooltipStore.visible) {
-            handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
+            const ctEl = tdEl.querySelector('.vxe-cell--wrapper');
+            let ovEl = null;
+            let tipEl = tdEl.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label');
+            if (column.type === 'html') {
+                ovEl = tdEl.querySelector('.vxe-cell--html');
+            }
+            if (!tipEl) {
+                tipEl = ctEl;
+            }
+            handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
         }
     },
     openTooltip(target, content) {
@@ -7371,12 +7447,15 @@ const Methods = {
         const props = $xeTable;
         const { mouseConfig } = props;
         const mouseOpts = $xeTable.computeMouseOpts;
-        const { field, sortable } = column;
+        const { field, sortable, order } = column;
         if (sortable) {
-            const params = { $table: $xeTable, $event: evnt, column, field, property: field, order: column.order, sortList: $xeTable.getSortColumns(), sortTime: column.sortTime };
+            const params = { $table: $xeTable, $event: evnt, column, field, property: field, order, sortList: $xeTable.getSortColumns(), sortTime: column.sortTime };
             if (mouseConfig && mouseOpts.area && $xeTable.handleSortEvent) {
                 $xeTable.handleSortEvent(evnt, params);
             }
+            if (!order) {
+                $xeTable.dispatchEvent('clear-sort', params, evnt);
+            }
             $xeTable.dispatchEvent('sort-change', params, evnt);
         }
     },
@@ -8259,49 +8338,12 @@ const Methods = {
     },
     setSort(sortConfs, isUpdate) {
         const $xeTable = this;
-        const sortOpts = $xeTable.computeSortOpts;
-        const { multiple, remote, orders } = sortOpts;
-        if (!XEUtils.isArray(sortConfs)) {
-            sortConfs = [sortConfs];
-        }
-        if (sortConfs && sortConfs.length) {
-            if (!multiple) {
-                sortConfs = [sortConfs[0]];
-                clearAllSort($xeTable);
-            }
-            let firstColumn = null;
-            sortConfs.forEach((confs, index) => {
-                let { field, order } = confs;
-                let column = field;
-                if (XEUtils.isString(field)) {
-                    column = $xeTable.getColumnByField(field);
-                }
-                if (!firstColumn) {
-                    firstColumn = column;
-                }
-                if (column && column.sortable) {
-                    if (orders && orders.indexOf(order) === -1) {
-                        order = getNextSortOrder($xeTable, column);
-                    }
-                    if (column.order !== order) {
-                        column.order = order;
-                    }
-                    column.sortTime = Date.now() + index;
-                }
-            });
-            if (isUpdate) {
-                if (!remote) {
-                    $xeTable.handleTableData(true);
-                }
-                $xeTable.handleColumnSortEvent(new Event('click'), firstColumn);
-            }
-            return $xeTable.$nextTick().then(() => {
-                updateRowOffsetTop($xeTable);
-                $xeTable.updateCellAreas();
-                return updateStyle($xeTable);
-            });
-        }
-        return $xeTable.$nextTick();
+        // 已废弃，即将去掉事件触发 new Event('click') -> null
+        return handleSortEvent($xeTable, new Event('click'), sortConfs, isUpdate);
+    },
+    setSortByEvent(evnt, sortConfs, isUpdate) {
+        const $xeTable = this;
+        return handleSortEvent($xeTable, evnt, sortConfs, isUpdate);
     },
     /**
      * 清空指定列的排序条件
@@ -8328,6 +8370,44 @@ const Methods = {
             return updateStyle($xeTable);
         });
     },
+    clearSortByEvent(evnt, fieldOrColumn) {
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const { tableFullColumn } = internalData;
+        const sortOpts = $xeTable.computeSortOpts;
+        const sortCols = [];
+        let column = null;
+        if (evnt) {
+            if (fieldOrColumn) {
+                column = handleFieldOrColumn($xeTable, fieldOrColumn);
+                if (column) {
+                    column.order = null;
+                }
+            }
+            else {
+                tableFullColumn.forEach((column) => {
+                    if (column.order) {
+                        column.order = null;
+                        sortCols.push(column);
+                    }
+                });
+            }
+            if (!sortOpts.remote) {
+                $xeTable.handleTableData(true);
+            }
+            if (sortCols.length) {
+                const params = { $table: $xeTable, $event: evnt, cols: sortCols, sortList: [] };
+                $xeTable.dispatchEvent('clear-all-sort', params, evnt);
+            }
+            else if (column) {
+                $xeTable.handleColumnSortEvent(evnt, column);
+            }
+        }
+        return $xeTable.$nextTick().then(() => {
+            updateRowOffsetTop($xeTable);
+            return updateStyle($xeTable);
+        });
+    },
     // 在 v3 中废弃
     getSortColumn() {
         if (process.env.NODE_ENV === 'development') {
@@ -8356,6 +8436,17 @@ const Methods = {
         }
         return sortList;
     },
+    setFilterByEvent(evnt, fieldOrColumn, options, isUpdate) {
+        const $xeTable = this;
+        const column = handleFieldOrColumn($xeTable, fieldOrColumn);
+        if (column && column.filters) {
+            column.filters = toFilters(options || []);
+            if (isUpdate) {
+                return $xeTable.handleColumnConfirmFilter(column, evnt);
+            }
+        }
+        return $xeTable.$nextTick();
+    },
     /**
      * 关闭筛选
      * @param {Event} evnt 事件
@@ -8395,6 +8486,52 @@ const Methods = {
     isFilter(fieldOrColumn) {
         return this.isActiveFilterByColumn(fieldOrColumn);
     },
+    clearFilterByEvent(evnt, fieldOrColumn) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { filterStore } = reactData;
+        const { tableFullColumn } = internalData;
+        const filterOpts = $xeTable.computeFilterOpts;
+        const filterCols = [];
+        let column = null;
+        if (fieldOrColumn) {
+            column = handleFieldOrColumn($xeTable, fieldOrColumn);
+            if (column) {
+                $xeTable.handleClearFilter(column);
+            }
+        }
+        else {
+            tableFullColumn.forEach(column => {
+                if (column.filters) {
+                    filterCols.push(column);
+                    $xeTable.handleClearFilter(column);
+                }
+            });
+        }
+        if (!fieldOrColumn || column !== filterStore.column) {
+            Object.assign(filterStore, {
+                isAllSelected: false,
+                isIndeterminate: false,
+                style: null,
+                options: [],
+                column: null,
+                multiple: false,
+                visible: false
+            });
+        }
+        if (!filterOpts.remote) {
+            $xeTable.updateData();
+        }
+        if (filterCols.length) {
+            const params = { $table: $xeTable, $event: evnt, cols: filterCols, filterList: [] };
+            $xeTable.dispatchEvent('clear-all-filter', params, evnt);
+        }
+        else if (column) {
+            $xeTable.dispatchEvent('clear-filter', { filterList: () => $xeTable.getCheckedFilters() }, evnt);
+        }
+        return $xeTable.$nextTick();
+    },
     /**
      * 判断展开行是否懒加载完成
      * @param {Row} row 行对象

package/es/table/src/table.js

@@ -1682,6 +1682,7 @@ export default {
         const columnOpts = $xeTable.computeColumnOpts;
         const rowOpts = $xeTable.computeRowOpts;
         const customOpts = $xeTable.computeCustomOpts;
+        const virtualYOpts = $xeTable.computeVirtualYOpts;
         if (columnOpts.drag || rowOpts.drag || customOpts.allowSort) {
             initTpImg();
         }
@@ -1722,9 +1723,11 @@ export default {
             resizeObserver.observe(this.getParentElem());
             this.$resize = resizeObserver;
         }
-        const tableViewportEl = $xeTable.$refs.refTableViewportElem;
-        if (tableViewportEl) {
-            tableViewportEl.addEventListener('wheel', $xeTable.triggerBodyWheelEvent, { passive: false });
+        if (virtualYOpts.mode !== 'scroll') {
+            const tableViewportEl = $xeTable.$refs.refTableViewportElem;
+            if (tableViewportEl) {
+                tableViewportEl.addEventListener('wheel', $xeTable.triggerBodyWheelEvent, { passive: false });
+            }
         }
         this.preventEvent(null, 'mounted');
     },

package/es/table/style.css

@@ -2550,6 +2550,12 @@
 .vxe-table--render-default .vxe-footer--column.col--right > .vxe-cell {
   justify-content: right;
 }
+.vxe-table--render-default .vxe-header--column.col--ellipsis.col--center .vxe-cell--wrapper {
+  justify-content: center;
+}
+.vxe-table--render-default .vxe-header--column.col--ellipsis.col--right .vxe-cell--wrapper {
+  justify-content: right;
+}
 .vxe-table--render-default .vxe-header--column.col--ellipsis.col--center .vxe-cell,
 .vxe-table--render-default .vxe-footer--column.col--ellipsis.col--center .vxe-cell {
   justify-content: center;