vxe-table 3.15.0-beta.4 → 3.15.0

package/lib/table/src/methods.js

@@ -1757,10 +1757,8 @@ function autoCellWidth($xeTable) {
   const {
     elemStore
   } = internalData;
-  const scrollbarOpts = $xeTable.computeScrollbarOpts;
-  const tableBody = $xeTable.$refs.refTableBody;
-  const bodyElem = tableBody ? tableBody.$el : null;
-  if (!bodyElem) {
+  const bodyWrapperElem = (0, _util.getRefElem)(elemStore['main-body-wrapper']);
+  if (!bodyWrapperElem) {
     return;
   }
   const yHandleEl = $xeTable.$refs.refScrollYHandleElem;
@@ -1773,7 +1771,7 @@ function autoCellWidth($xeTable) {
   }
   let tWidth = 0;
   const minCellWidth = 40; // 列宽最少限制 40px
-  const bodyWidth = bodyElem.clientWidth;
+  const bodyWidth = bodyWrapperElem.clientWidth;
   let remainWidth = bodyWidth;
   let meanWidth = remainWidth / 100;
   const {
@@ -1854,9 +1852,9 @@ function autoCellWidth($xeTable) {
   });
   if (fit) {
     /**
-         * 偏移量算法
-         * 如果所有列足够放的情况下，从最后动态列开始分配
-         */
+     * 偏移量算法
+     * 如果所有列足够放的情况下，从最后动态列开始分配
+     */
     const dynamicList = scaleList.concat(scaleMinList).concat(pxMinList).concat(autoMinList).concat(remainList);
     let dynamicSize = dynamicList.length - 1;
     if (dynamicSize > 0) {
@@ -1870,28 +1868,10 @@ function autoCellWidth($xeTable) {
       }
     }
   }
-  const tableHeight = bodyElem.offsetHeight;
-  const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight;
-  reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth);
-  reactData.overflowY = overflowY;
   reactData.scrollXWidth = tWidth;
-  internalData.tableHeight = tableHeight;
-  const headerTableElem = (0, _util.getRefElem)(elemStore['main-header-table']);
-  const footerTableElem = (0, _util.getRefElem)(elemStore['main-footer-table']);
-  const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0;
-  const overflowX = tWidth > bodyWidth;
-  const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0;
-  reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight);
-  internalData.headerHeight = headerHeight;
-  internalData.footerHeight = footerHeight;
-  reactData.overflowX = overflowX;
   reactData.resizeWidthFlag++;
   updateColumnOffsetLeft($xeTable);
   updateHeight($xeTable);
-  reactData.parentHeight = Math.max(internalData.headerHeight + footerHeight + 20, $xeTable.getParentHeight());
-  if (overflowX) {
-    $xeTable.checkScrolling();
-  }
 }
 const calcCellAutoHeight = (rowRest, wrapperEl) => {
   const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
@@ -2300,7 +2280,7 @@ function computeScrollLoad($xeTable) {
     }
     // 计算 Y 逻辑
     const rowHeight = computeRowHeight($xeTable);
-    scrollYStore.rowHeight = rowHeight;
+    scrollYStore.rowHeight = rowHeight; // 已废弃
     reactData.rowHeight = rowHeight;
     const {
       toVisibleIndex: toYVisibleIndex,
@@ -2320,11 +2300,48 @@ function computeScrollLoad($xeTable) {
     } else {
       $xeTable.updateScrollYSpace();
     }
-    $xeTable.$nextTick(() => {
-      updateStyle($xeTable);
-    });
   });
 }
+function calcScrollbar($xeTable) {
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  const {
+    scrollXWidth,
+    scrollYHeight
+  } = reactData;
+  const {
+    elemStore
+  } = internalData;
+  const scrollbarOpts = $xeTable.computeScrollbarOpts;
+  const bodyWrapperElem = (0, _util.getRefElem)(elemStore['main-body-wrapper']);
+  const headerTableElem = (0, _util.getRefElem)(elemStore['main-header-table']);
+  const footerTableElem = (0, _util.getRefElem)(elemStore['main-footer-table']);
+  const xHandleEl = $xeTable.$refs.refScrollXHandleElem;
+  const yHandleEl = $xeTable.$refs.refScrollYHandleElem;
+  let overflowY = false;
+  let overflowX = false;
+  if (bodyWrapperElem) {
+    overflowY = scrollYHeight > bodyWrapperElem.clientHeight;
+    if (yHandleEl) {
+      reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth);
+    }
+    reactData.overflowY = overflowY;
+    overflowX = scrollXWidth > bodyWrapperElem.clientWidth;
+    if (xHandleEl) {
+      reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight);
+    }
+    reactData.overflowX = overflowX;
+    const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0;
+    const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0;
+    internalData.tableHeight = bodyWrapperElem.offsetHeight;
+    internalData.headerHeight = headerHeight;
+    internalData.footerHeight = footerHeight;
+    reactData.parentHeight = Math.max(internalData.headerHeight + footerHeight + 20, $xeTable.getParentHeight());
+  }
+  if (overflowX) {
+    $xeTable.checkScrolling();
+  }
+}
 function handleRecalculateLayout($xeTable, reFull) {
   const internalData = $xeTable;
   const el = $xeTable.$refs.refElem;
@@ -2342,21 +2359,22 @@ function handleRecalculateLayout($xeTable, reFull) {
   }
   calcCellWidth($xeTable);
   autoCellWidth($xeTable);
+  calcScrollbar($xeTable);
   updateStyle($xeTable);
-  if (reFull) {
-    updateRowOffsetTop($xeTable);
-  }
   updateRowExpandStyle($xeTable);
   return computeScrollLoad($xeTable).then(() => {
-    if (reFull === true) {
-      // 初始化时需要在列计算之后再执行优化运算，达到最优显示效果
-      calcCellWidth($xeTable);
+    // 初始化时需要在列计算之后再执行优化运算，达到最优显示效果
+    calcCellWidth($xeTable);
+    if (reFull) {
       autoCellWidth($xeTable);
-      updateStyle($xeTable);
-      if (reFull) {
-        updateRowOffsetTop($xeTable);
-      }
-      updateRowExpandStyle($xeTable);
+    }
+    calcScrollbar($xeTable);
+    updateStyle($xeTable);
+    if (reFull) {
+      updateRowOffsetTop($xeTable);
+    }
+    updateRowExpandStyle($xeTable);
+    if (reFull) {
       return computeScrollLoad($xeTable);
     }
   });
@@ -3343,6 +3361,7 @@ const Methods = {
           }
           reactData.isRowLoading = false;
           calcCellHeight($xeTable);
+          updateRowOffsetTop($xeTable);
           // 是否变更虚拟滚动
           if (oldScrollYLoad === sYLoad) {
             (0, _util.restoreScrollLocation)($xeTable, targetScrollLeft, targetScrollTop).then(() => {
@@ -5652,6 +5671,7 @@ const Methods = {
       }
     }
     return $xeTable.$nextTick().then(() => {
+      updateRowOffsetTop($xeTable);
       return {
         status
       };
@@ -10490,11 +10510,11 @@ const Methods = {
         const firstRow = afterFullData[startIndex];
         let rowid = (0, _util.getRowid)($xeTable, firstRow);
         let rowRest = fullAllDataRowIdData[rowid] || {};
-        ySpaceTop = rowRest.oTop;
+        ySpaceTop = rowRest.oTop || 0;
         const lastRow = afterFullData[afterFullData.length - 1];
         rowid = (0, _util.getRowid)($xeTable, lastRow);
         rowRest = fullAllDataRowIdData[rowid] || {};
-        scrollYHeight = rowRest.oTop + (rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight);
+        scrollYHeight = (rowRest.oTop || 0) + (rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight);
         // 是否展开行
         if (expandColumn && rowExpandedMaps[rowid]) {
           scrollYHeight += rowRest.expandHeight || expandOpts.height || 0;