vxe-table 3.15.12 → 3.15.14

package/es/table/src/cell.js

@@ -10,7 +10,7 @@ function renderTitlePrefixIcon(h, params) {
     const titlePrefix = column.titlePrefix || column.titleHelp;
     if (titlePrefix) {
         return h('i', {
-            class: ['vxe-cell-title-prefix-icon', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX],
+            class: ['vxe-cell-title-prefix-icon', titlePrefix.iconStatus ? `theme--${titlePrefix.iconStatus}` : '', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX],
             on: {
                 mouseenter(evnt) {
                     $table.triggerHeaderTitleEvent(evnt, titlePrefix, params);
@@ -28,7 +28,7 @@ function renderTitleSuffixIcon(h, params) {
     const titleSuffix = column.titleSuffix;
     if (titleSuffix) {
         return h('i', {
-            class: ['vxe-cell-title-suffix-icon', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX],
+            class: ['vxe-cell-title-suffix-icon', titleSuffix.iconStatus ? `theme--${titleSuffix.iconStatus}` : '', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX],
             on: {
                 mouseenter(evnt) {
                     $table.triggerHeaderTitleEvent(evnt, titleSuffix, params);

package/es/table/src/methods.js

@@ -2418,12 +2418,12 @@ function calcScrollbar($xeTable) {
     if (bodyWrapperElem) {
         overflowY = scrollYHeight > bodyWrapperElem.clientHeight;
         if (yHandleEl) {
-            reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth);
+            reactData.scrollbarWidth = scrollbarOpts.width || (yHandleEl.offsetWidth - yHandleEl.clientWidth) || 14;
         }
         reactData.overflowY = overflowY;
         overflowX = scrollXWidth > bodyWrapperElem.clientWidth;
         if (xHandleEl) {
-            reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight);
+            reactData.scrollbarHeight = scrollbarOpts.height || (xHandleEl.offsetHeight - xHandleEl.clientHeight) || 14;
         }
         reactData.overflowX = overflowX;
         const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0;
@@ -2621,6 +2621,7 @@ function loadTableData($xeTable, datas, isReset) {
     scrollYStore.endIndex = 1;
     scrollXStore.startIndex = 0;
     scrollXStore.endIndex = 1;
+    internalData.cvCacheMaps = {};
     reactData.isRowLoading = true;
     reactData.scrollVMLoading = false;
     internalData.treeExpandedMaps = {};
@@ -3052,7 +3053,7 @@ function lazyScrollXData($xeTable) {
     const internalData = $xeTable;
     const { lxTimeout, lxRunTime, scrollXStore } = internalData;
     const { visibleSize } = scrollXStore;
-    const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)));
+    const fpsTime = visibleSize > 26 ? 26 : (visibleSize > 16 ? 14 : 6);
     if (lxTimeout) {
         clearTimeout(lxTimeout);
     }
@@ -3070,7 +3071,7 @@ function lazyScrollYData($xeTable) {
     const internalData = $xeTable;
     const { lyTimeout, lyRunTime, scrollYStore } = internalData;
     const { visibleSize } = scrollYStore;
-    const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)));
+    const fpsTime = visibleSize > 30 ? 32 : (visibleSize > 20 ? 18 : 8);
     if (lyTimeout) {
         clearTimeout(lyTimeout);
     }
@@ -9264,8 +9265,8 @@ const Methods = {
         if (isRollX) {
             evnt.preventDefault();
             internalData.inWheelScroll = true;
-            wheelScrollLeftTo(scrollLeft, (offsetLeft) => {
-                const currLeftNum = offsetLeft;
+            if (browseObj['-moz'] || browseObj.safari) {
+                const currLeftNum = scrollLeft;
                 setScrollLeft(xHandleEl, currLeftNum);
                 setScrollLeft(bodyScrollElem, currLeftNum);
                 setScrollLeft(headerScrollElem, currLeftNum);
@@ -9277,13 +9278,28 @@ const Methods = {
                     type: 'table',
                     fixed: ''
                 });
-            });
+            }
+            else {
+                wheelScrollLeftTo(scrollLeft, (offsetLeft) => {
+                    const currLeftNum = offsetLeft;
+                    setScrollLeft(xHandleEl, currLeftNum);
+                    setScrollLeft(bodyScrollElem, currLeftNum);
+                    setScrollLeft(headerScrollElem, currLeftNum);
+                    setScrollLeft(footerScrollElem, currLeftNum);
+                    if (scrollXLoad) {
+                        $xeTable.triggerScrollXEvent(evnt);
+                    }
+                    $xeTable.handleScrollEvent(evnt, isRollY, isRollX, bodyScrollElem.scrollTop, currLeftNum, {
+                        type: 'table',
+                        fixed: ''
+                    });
+                });
+            }
         }
         if (isRollY) {
             evnt.preventDefault();
-            wheelScrollTopTo(scrollTop - currScrollTop, (offsetTop) => {
-                const currTopNum = bodyScrollElem.scrollTop + offsetTop;
-                internalData.inWheelScroll = true;
+            if (browseObj['-moz'] || browseObj.safari) {
+                const currTopNum = scrollTop;
                 setScrollTop(yHandleEl, currTopNum);
                 setScrollTop(bodyScrollElem, currTopNum);
                 setScrollTop(leftScrollElem, currTopNum);
@@ -9296,7 +9312,25 @@ const Methods = {
                     type: 'table',
                     fixed: ''
                 });
-            });
+            }
+            else {
+                wheelScrollTopTo(scrollTop - currScrollTop, (offsetTop) => {
+                    const currTopNum = bodyScrollElem.scrollTop + offsetTop;
+                    internalData.inWheelScroll = true;
+                    setScrollTop(yHandleEl, currTopNum);
+                    setScrollTop(bodyScrollElem, currTopNum);
+                    setScrollTop(leftScrollElem, currTopNum);
+                    setScrollTop(rightScrollElem, currTopNum);
+                    setScrollTop(rowExpandEl, currTopNum);
+                    if (scrollYLoad) {
+                        $xeTable.triggerScrollYEvent(evnt);
+                    }
+                    $xeTable.handleScrollEvent(evnt, isRollY, isRollX, currTopNum, bodyScrollElem.scrollLeft, {
+                        type: 'table',
+                        fixed: ''
+                    });
+                });
+            }
         }
     },
     triggerVirtualScrollXEvent(evnt) {
@@ -9428,20 +9462,18 @@ const Methods = {
                 ySpaceWidth = maxXWidth;
                 isScrollXBig = true;
             }
-            let marginLeft = '';
-            if (scrollXLoad && overflowX) {
-                marginLeft = `${xSpaceLeft}px`;
+            if (!(scrollXLoad && overflowX)) {
+                xSpaceLeft = 0;
             }
             if (headerTableElem) {
-                headerTableElem.style.marginLeft = headerTableElem.getAttribute('xvm') ? marginLeft : '';
+                headerTableElem.style.transform = headerTableElem.getAttribute('xvm') ? `translate(${xSpaceLeft}px, 0px)` : '';
             }
             if (bodyTableElem) {
-                bodyTableElem.style.marginLeft = marginLeft;
+                bodyTableElem.style.transform = `translate(${xSpaceLeft}px, ${reactData.scrollYTop || 0}px)`;
             }
             if (footerTableElem) {
-                footerTableElem.style.marginLeft = footerTableElem.getAttribute('xvm') ? marginLeft : '';
+                footerTableElem.style.transform = footerTableElem.getAttribute('xvm') ? `translate(${xSpaceLeft}px, 0px)` : '';
             }
-            reactData.isScrollXBig = isScrollXBig;
             const containerList = ['main'];
             containerList.forEach(name => {
                 const layoutList = ['header', 'body', 'footer'];
@@ -9452,6 +9484,9 @@ const Methods = {
                     }
                 });
             });
+            reactData.scrollXLeft = xSpaceLeft;
+            reactData.scrollXWidth = ySpaceWidth;
+            reactData.isScrollXBig = isScrollXBig;
             const scrollXSpaceEl = $xeTable.$refs.refScrollXSpaceElem;
             if (scrollXSpaceEl) {
                 scrollXSpaceEl.style.width = `${ySpaceWidth}px`;
@@ -9489,6 +9524,8 @@ const Methods = {
         const defaultRowHeight = $xeTable.computeDefaultRowHeight;
         const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
         const bodyTableElem = getRefElem(elemStore['main-body-table']);
+        const leftBodyTableElem = getRefElem(elemStore['left-body-table']);
+        const rightbodyTableElem = getRefElem(elemStore['right-body-table']);
         const containerList = ['main', 'left', 'right'];
         let ySpaceTop = 0;
         let scrollYHeight = 0;
@@ -9542,12 +9579,17 @@ const Methods = {
             }
             ySpaceHeight = maxYHeight;
         }
+        if (leftBodyTableElem) {
+            leftBodyTableElem.style.transform = `translate(0px, ${scrollYTop}px)`;
+        }
+        if (bodyTableElem) {
+            bodyTableElem.style.transform = `translate(${reactData.scrollXLeft || 0}px, ${scrollYTop}px)`;
+        }
+        if (rightbodyTableElem) {
+            rightbodyTableElem.style.transform = `translate(0px, ${scrollYTop}px)`;
+        }
         containerList.forEach(name => {
             const layoutList = ['header', 'body', 'footer'];
-            const tableElem = getRefElem(elemStore[`${name}-body-table`]);
-            if (tableElem) {
-                tableElem.style.marginTop = scrollYTop ? `${scrollYTop}px` : '';
-            }
             layoutList.forEach(layout => {
                 const ySpaceElem = getRefElem(elemStore[`${name}-${layout}-ySpace`]);
                 if (ySpaceElem) {

package/es/table/src/table.js

@@ -1414,6 +1414,7 @@ export default {
             insertRowMaps: {},
             // 已删除行
             removeRowMaps: {},
+            cvCacheMaps: {},
             swYSize: 0,
             swYInterval: 0,
             swYTotal: 0
@@ -1709,10 +1710,14 @@ export default {
     },
     beforeDestroy() {
         const $xeTable = this;
+        const internalData = $xeTable;
         const tableViewportEl = $xeTable.$refs.refTableViewportElem;
         if (tableViewportEl) {
             tableViewportEl.removeEventListener('wheel', $xeTable.triggerBodyWheelEvent);
         }
+        internalData.cvCacheMaps = {};
+        internalData.prevDragRow = null;
+        internalData.prevDragCol = null;
         if (this.$resize) {
             this.$resize.disconnect();
         }

package/es/table/style.css

@@ -2327,6 +2327,30 @@
 .vxe-header--column .vxe-cell-title-suffix-icon {
   cursor: help;
 }
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--primary,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--primary {
+  color: var(--vxe-ui-font-primary-color);
+}
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--success,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--success {
+  color: var(--vxe-ui-status-success-color);
+}
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--info,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--info {
+  color: var(--vxe-ui-status-info-color);
+}
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--warning,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--warning {
+  color: var(--vxe-ui-status-warning-color);
+}
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--danger,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--danger {
+  color: var(--vxe-ui-status-danger-color);
+}
+.vxe-header--column .vxe-cell-title-prefix-icon.theme--error,
+.vxe-header--column .vxe-cell-title-suffix-icon.theme--error {
+  color: var(--vxe-ui-status-error-color);
+}
 
 .vxe-cell--col-resizable {
   position: absolute;