vxe-table 3.17.5 → 3.17.7

package/es/table/module/custom/panel.js

@@ -994,8 +994,8 @@ export default {
             if (matchObj && matchObj.parent) {
                 const { parent } = matchObj;
                 if (parent.children && parent.children.length) {
-                    parent.visible = parent.children.every((column) => column.visible);
-                    parent.halfVisible = !parent.visible && parent.children.some((column) => column.visible || column.halfVisible);
+                    parent.renderVisible = parent.children.every((column) => column.renderVisible);
+                    parent.halfVisible = !parent.renderVisible && parent.children.some((column) => column.renderVisible || column.halfVisible);
                     this.handleOptionCheck(parent);
                 }
             }
@@ -1004,8 +1004,8 @@ export default {
             const $xeTableCustomPanel = this;
             const $xeTable = $xeTableCustomPanel.$xeTable;
             const tableReactData = $xeTable;
-            const customOpts = $xeTable.computeCustomOpts;
             const isChecked = !column.renderVisible;
+            const customOpts = $xeTable.computeCustomOpts;
             if (customOpts.immediate) {
                 XEUtils.eachTree([column], (item) => {
                     item.visible = isChecked;

package/es/table/src/methods.js

@@ -2249,12 +2249,17 @@ function autoCellWidth($xeTable) {
 const calcCellAutoHeight = (rowRest, wrapperEl) => {
     const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
     let colHeight = rowRest.height;
+    let firstCellStyle = null;
+    let topBottomPadding = 0;
     for (let i = 0; i < cellElemList.length; i++) {
-        const cellElem = cellElemList[i];
-        const tdEl = cellElem.parentElement;
-        const topBottomPadding = Math.ceil(XEUtils.toNumber(tdEl.style.paddingTop) + XEUtils.toNumber(tdEl.style.paddingBottom));
-        const cellHeight = cellElem ? cellElem.clientHeight : 0;
-        colHeight = Math.max(colHeight - topBottomPadding, Math.ceil(cellHeight));
+        const wrapperElem = cellElemList[i];
+        const cellElem = wrapperElem.parentElement;
+        if (!firstCellStyle) {
+            firstCellStyle = getComputedStyle(cellElem);
+            topBottomPadding = firstCellStyle ? Math.ceil(XEUtils.toNumber(firstCellStyle.paddingTop) + XEUtils.toNumber(firstCellStyle.paddingBottom)) : 0;
+        }
+        const cellHeight = wrapperElem ? wrapperElem.clientHeight : 0;
+        colHeight = Math.max(colHeight, Math.ceil(cellHeight + topBottomPadding));
     }
     return colHeight;
 };
@@ -5569,11 +5574,13 @@ const Methods = {
     },
     handleRowResizeMousedownEvent(evnt, params) {
         const $xeTable = this;
+        const props = $xeTable;
         const reactData = $xeTable;
         const internalData = $xeTable;
         evnt.stopPropagation();
         evnt.preventDefault();
         const { row } = params;
+        const { showOverflow } = props;
         const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData;
         const { elemStore, fullAllDataRowIdData } = internalData;
         const osbWidth = overflowY ? scrollbarWidth : 0;
@@ -5602,7 +5609,10 @@ const Methods = {
             return;
         }
         const defaultRowHeight = $xeTable.computeDefaultRowHeight;
-        const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+        let currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+        if (!showOverflow) {
+            currCellHeight = tdEl.clientHeight;
+        }
         const tableRect = tableEl.getBoundingClientRect();
         const trRect = trEl.getBoundingClientRect();
         const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight;
@@ -5766,6 +5776,28 @@ const Methods = {
         });
         return rest;
     },
+    recalcRowHeight(rowOrId) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { fullAllDataRowIdData } = internalData;
+        const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId];
+        const el = $xeTable.$refs.refElem;
+        if (el) {
+            const { handleGetRowId } = createHandleGetRowId($xeTable);
+            el.setAttribute('data-calc-row', 'Y');
+            rows.forEach(row => {
+                const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : handleGetRowId(row);
+                const rowRest = fullAllDataRowIdData[rowid];
+                if (rowRest) {
+                    rowRest.resizeHeight = calcCellAutoHeight(rowRest, el);
+                }
+                el.removeAttribute('data-calc-row');
+            });
+            reactData.calcCellHeightFlag++;
+        }
+        return $xeTable.$nextTick();
+    },
     setRowHeight(rowOrId, height) {
         const $xeTable = this;
         const reactData = $xeTable;

package/es/table/src/table.js

@@ -1313,25 +1313,19 @@ export default {
             this.$nextTick().then(() => this.refreshColumn());
         },
         computeSize() {
-            this.reScrollFlag++;
+            this.reLayoutFlag++;
         },
         showHeader() {
-            this.reScrollFlag++;
+            this.reLayoutFlag++;
         },
         showFooter() {
-            this.reScrollFlag++;
+            this.reLayoutFlag++;
         },
         overflowX() {
-            this.reScrollFlag++;
+            this.reLayoutFlag++;
         },
         overflowY() {
-            this.reScrollFlag++;
-        },
-        reScrollFlag() {
-            const $xeTable = this;
-            $xeTable.$nextTick(() => {
-                $xeTable.recalculate(true).then(() => $xeTable.refreshScroll());
-            });
+            this.reLayoutFlag++;
         },
         height() {
             this.reLayoutFlag++;

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "3.17.5";
+export const version = "3.17.7";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({

package/es/ui/src/log.js

@@ -1,5 +1,5 @@
 import { VxeUI } from '@vxe-ui/core';
 const { log } = VxeUI;
-const version = `table v${"3.17.5"}`;
+const version = `table v${"3.17.7"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);

package/lib/index.umd.js

@@ -2002,7 +2002,7 @@ function getClass(property, params) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "3.17.5";
+const version = "3.17.7";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -2669,7 +2669,7 @@ function isNodeElement(elem) {
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"3.17.5"}`;
+const log_version = `table v${"3.17.7"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -8109,12 +8109,17 @@ function autoCellWidth($xeTable) {
 const calcCellAutoHeight = (rowRest, wrapperEl) => {
   const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
   let colHeight = rowRest.height;
+  let firstCellStyle = null;
+  let topBottomPadding = 0;
   for (let i = 0; i < cellElemList.length; i++) {
-    const cellElem = cellElemList[i];
-    const tdEl = cellElem.parentElement;
-    const topBottomPadding = Math.ceil(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(tdEl.style.paddingTop) + external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(tdEl.style.paddingBottom));
-    const cellHeight = cellElem ? cellElem.clientHeight : 0;
-    colHeight = Math.max(colHeight - topBottomPadding, Math.ceil(cellHeight));
+    const wrapperElem = cellElemList[i];
+    const cellElem = wrapperElem.parentElement;
+    if (!firstCellStyle) {
+      firstCellStyle = getComputedStyle(cellElem);
+      topBottomPadding = firstCellStyle ? Math.ceil(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(firstCellStyle.paddingTop) + external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(firstCellStyle.paddingBottom)) : 0;
+    }
+    const cellHeight = wrapperElem ? wrapperElem.clientHeight : 0;
+    colHeight = Math.max(colHeight, Math.ceil(cellHeight + topBottomPadding));
   }
   return colHeight;
 };
@@ -11913,6 +11918,7 @@ const Methods = {
   },
   handleRowResizeMousedownEvent(evnt, params) {
     const $xeTable = this;
+    const props = $xeTable;
     const reactData = $xeTable;
     const internalData = $xeTable;
     evnt.stopPropagation();
@@ -11920,6 +11926,9 @@ const Methods = {
     const {
       row
     } = params;
+    const {
+      showOverflow
+    } = props;
     const {
       overflowX,
       scrollbarWidth,
@@ -11958,7 +11967,10 @@ const Methods = {
       return;
     }
     const defaultRowHeight = $xeTable.computeDefaultRowHeight;
-    const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+    let currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+    if (!showOverflow) {
+      currCellHeight = tdEl.clientHeight;
+    }
     const tableRect = tableEl.getBoundingClientRect();
     const trRect = trEl.getBoundingClientRect();
     const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight;
@@ -12145,6 +12157,32 @@ const Methods = {
     });
     return rest;
   },
+  recalcRowHeight(rowOrId) {
+    const $xeTable = this;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const {
+      fullAllDataRowIdData
+    } = internalData;
+    const rows = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(rowOrId) ? rowOrId : [rowOrId];
+    const el = $xeTable.$refs.refElem;
+    if (el) {
+      const {
+        handleGetRowId
+      } = createHandleGetRowId($xeTable);
+      el.setAttribute('data-calc-row', 'Y');
+      rows.forEach(row => {
+        const rowid = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(row) || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(row) ? row : handleGetRowId(row);
+        const rowRest = fullAllDataRowIdData[rowid];
+        if (rowRest) {
+          rowRest.resizeHeight = calcCellAutoHeight(rowRest, el);
+        }
+        el.removeAttribute('data-calc-row');
+      });
+      reactData.calcCellHeightFlag++;
+    }
+    return $xeTable.$nextTick();
+  },
   setRowHeight(rowOrId, height) {
     const $xeTable = this;
     const reactData = $xeTable;
@@ -21124,8 +21162,8 @@ const renderPopupPanel = (h, $xeTableCustomPanel) => {
           parent
         } = matchObj;
         if (parent.children && parent.children.length) {
-          parent.visible = parent.children.every(column => column.visible);
-          parent.halfVisible = !parent.visible && parent.children.some(column => column.visible || column.halfVisible);
+          parent.renderVisible = parent.children.every(column => column.renderVisible);
+          parent.halfVisible = !parent.renderVisible && parent.children.some(column => column.renderVisible || column.halfVisible);
           this.handleOptionCheck(parent);
         }
       }
@@ -21134,8 +21172,8 @@ const renderPopupPanel = (h, $xeTableCustomPanel) => {
       const $xeTableCustomPanel = this;
       const $xeTable = $xeTableCustomPanel.$xeTable;
       const tableReactData = $xeTable;
-      const customOpts = $xeTable.computeCustomOpts;
       const isChecked = !column.renderVisible;
+      const customOpts = $xeTable.computeCustomOpts;
       if (customOpts.immediate) {
         external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree([column], item => {
           item.visible = isChecked;
@@ -29679,25 +29717,19 @@ function renderBody(h, $xeTable) {
       this.$nextTick().then(() => this.refreshColumn());
     },
     computeSize() {
-      this.reScrollFlag++;
+      this.reLayoutFlag++;
     },
     showHeader() {
-      this.reScrollFlag++;
+      this.reLayoutFlag++;
     },
     showFooter() {
-      this.reScrollFlag++;
+      this.reLayoutFlag++;
     },
     overflowX() {
-      this.reScrollFlag++;
+      this.reLayoutFlag++;
     },
     overflowY() {
-      this.reScrollFlag++;
-    },
-    reScrollFlag() {
-      const $xeTable = this;
-      $xeTable.$nextTick(() => {
-        $xeTable.recalculate(true).then(() => $xeTable.refreshScroll());
-      });
+      this.reLayoutFlag++;
     },
     height() {
       this.reLayoutFlag++;