vxe-table 3.12.10-beta.2 → 3.12.10-beta.21

package/es/table/src/util.js

@@ -118,7 +118,7 @@ function getElementMarginWidth(elem) {
 }
 export function handleFieldOrColumn(_vm, fieldOrColumn) {
     if (fieldOrColumn) {
-        return XEUtils.isString(fieldOrColumn) ? _vm.getColumnByField(fieldOrColumn) : fieldOrColumn;
+        return XEUtils.isString(fieldOrColumn) || XEUtils.isNumber(fieldOrColumn) ? _vm.getColumnByField(`${fieldOrColumn}`) : fieldOrColumn;
     }
     return null;
 }
@@ -180,6 +180,7 @@ export function toFilters(filters) {
 }
 export function getColReMinWidth(params) {
     const { $table, column, cell } = params;
+    const internalData = $table;
     const { showHeaderOverflow: allColumnHeaderOverflow, resizableOpts } = $table;
     const { minWidth } = resizableOpts;
     // 如果自定义调整宽度逻辑
@@ -189,6 +190,7 @@ export function getColReMinWidth(params) {
             return Math.max(1, XEUtils.toNumber(customMinWidth));
         }
     }
+    const { elemStore } = internalData;
     const { showHeaderOverflow, minWidth: colMinWidth } = column;
     const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
     const showEllipsis = headOverflow === 'ellipsis';
@@ -212,11 +214,10 @@ export function getColReMinWidth(params) {
     }
     // 如果设置最小宽
     if (colMinWidth) {
-        const { refTableBody } = $table.$refs;
-        const bodyElem = refTableBody ? refTableBody.$el : null;
-        if (bodyElem) {
+        const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
+        if (bodyScrollElem) {
             if (isScale(colMinWidth)) {
-                const bodyWidth = bodyElem.clientWidth - 1;
+                const bodyWidth = bodyScrollElem.clientWidth - 1;
                 const meanWidth = bodyWidth / 100;
                 return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMinWidth) * meanWidth));
             }
@@ -257,13 +258,31 @@ export function getOffsetSize($xeTable) {
     return 0;
 }
 export function calcTreeLine(params, prevRow) {
-    const { $table } = params;
+    const { $table, row } = params;
+    const tableProps = $table;
     const tableReactData = $table;
+    const tableInternalData = $table;
+    const { showOverflow } = tableProps;
+    const { scrollYLoad } = tableReactData;
+    const { fullAllDataRowIdData } = tableInternalData;
+    const rowOpts = $table.computeRowOpts;
+    const cellOpts = $table.computeCellOpts;
+    const defaultRowHeight = $table.computeDefaultRowHeight;
+    const rowid = getRowid($table, row);
+    const rowRest = fullAllDataRowIdData[rowid];
+    const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight;
     let expandSize = 1;
     if (prevRow) {
         expandSize = countTreeExpand(prevRow, params);
     }
-    return tableReactData.rowHeight * expandSize - (prevRow ? 1 : (12 - getOffsetSize($table)));
+    let cellHeight = currCellHeight;
+    const vnHeight = rowRest.height;
+    if (scrollYLoad) {
+        if (!showOverflow) {
+            cellHeight = vnHeight || currCellHeight;
+        }
+    }
+    return cellHeight * expandSize - (prevRow ? 1 : (12 - getOffsetSize($table)));
 }
 export function mergeBodyMethod(mergeList, _rowIndex, _columnIndex) {
     for (let mIndex = 0; mIndex < mergeList.length; mIndex++) {
@@ -327,29 +346,23 @@ export function createColumn($xeTable, options, renderOptions) {
     return isColumnInfo(options) ? options : new ColumnInfo($xeTable, options, renderOptions);
 }
 export function rowToVisible($xeTable, row) {
+    const tableProps = $xeTable;
     const reactData = $xeTable;
     const internalData = $xeTable;
-    const tableProps = $xeTable;
     const { showOverflow } = tableProps;
-    const refTableBody = $xeTable.$refs.refTableBody;
-    const { columnStore, scrollYLoad } = reactData;
-    const { afterFullData, scrollYStore, fullAllDataRowIdData } = internalData;
-    const { rowHeight } = scrollYStore;
-    const { leftList, rightList } = columnStore;
-    const bodyElem = refTableBody ? refTableBody.$el : null;
+    const { scrollYLoad } = reactData;
+    const { elemStore, afterFullData, fullAllDataRowIdData, isResizeCellHeight } = internalData;
+    const rowOpts = $xeTable.computeRowOpts;
+    const cellOpts = $xeTable.computeCellOpts;
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight;
+    const leftFixedWidth = $xeTable.computeLeftFixedWidth;
+    const rightFixedWidth = $xeTable.computeRightFixedWidth;
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
     const rowid = getRowid($xeTable, row);
-    let offsetFixedLeft = 0;
-    leftList.forEach((item) => {
-        offsetFixedLeft += item.renderWidth;
-    });
-    let offsetFixedRight = 0;
-    rightList.forEach((item) => {
-        offsetFixedRight += item.renderWidth;
-    });
-    if (bodyElem) {
-        const bodyHeight = bodyElem.clientHeight;
-        const bodyScrollTop = bodyElem.scrollTop;
-        const trElem = bodyElem.querySelector(`[rowid="${rowid}"]`);
+    if (bodyScrollElem) {
+        const bodyHeight = bodyScrollElem.clientHeight;
+        const bodyScrollTop = bodyScrollElem.scrollTop;
+        const trElem = bodyScrollElem.querySelector(`[rowid="${rowid}"]`);
         if (trElem) {
             const trOffsetParent = trElem.offsetParent;
             const trOffsetTop = trElem.offsetTop + (trOffsetParent ? trOffsetParent.offsetTop : 0);
@@ -365,12 +378,13 @@ export function rowToVisible($xeTable, row) {
         else {
             // 如果是虚拟渲染滚动
             if (scrollYLoad) {
-                if (showOverflow) {
-                    return $xeTable.scrollTo(null, ($xeTable.findRowIndexOf(afterFullData, row) - 1) * rowHeight);
+                const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
+                if (!isCustomCellHeight && showOverflow) {
+                    return $xeTable.scrollTo(null, ($xeTable.findRowIndexOf(afterFullData, row) - 1) * defaultRowHeight);
                 }
                 let scrollTop = 0;
                 const rowRest = fullAllDataRowIdData[rowid];
-                const rHeight = rowRest ? (rowRest.height || rowHeight) : rowHeight;
+                const rHeight = rowRest ? (rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight) : defaultRowHeight;
                 for (let i = 0; i < afterFullData.length; i++) {
                     const currRow = afterFullData[i];
                     const currRowid = getRowid($xeTable, currRow);
@@ -378,54 +392,49 @@ export function rowToVisible($xeTable, row) {
                         break;
                     }
                     const rowRest = fullAllDataRowIdData[currRowid];
-                    scrollTop += rowRest ? (rowRest.height || rowHeight) : rowHeight;
+                    scrollTop += rowRest ? (rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight) : defaultRowHeight;
                 }
                 if (scrollTop < bodyScrollTop) {
-                    return $xeTable.scrollTo(null, scrollTop - offsetFixedLeft - 1);
+                    return $xeTable.scrollTo(null, scrollTop - leftFixedWidth - 1);
                 }
-                return $xeTable.scrollTo(null, (scrollTop + rHeight) - (bodyHeight - offsetFixedRight - 1));
+                return $xeTable.scrollTo(null, (scrollTop + rHeight) - (bodyHeight - rightFixedWidth - 1));
             }
         }
     }
     return Promise.resolve();
 }
 export function colToVisible($xeTable, column, row) {
-    const { columnStore, scrollXLoad, visibleColumn } = $xeTable;
-    const refTableBody = $xeTable.$refs.refTableBody;
-    const { leftList, rightList } = columnStore;
-    const bodyElem = refTableBody ? refTableBody.$el : null;
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const { scrollXLoad } = reactData;
+    const { elemStore, visibleColumn } = internalData;
+    const leftFixedWidth = $xeTable.computeLeftFixedWidth;
+    const rightFixedWidth = $xeTable.computeRightFixedWidth;
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
     if (column.fixed) {
         return Promise.resolve();
     }
-    let offsetFixedLeft = 0;
-    leftList.forEach((item) => {
-        offsetFixedLeft += item.renderWidth;
-    });
-    let offsetFixedRight = 0;
-    rightList.forEach((item) => {
-        offsetFixedRight += item.renderWidth;
-    });
-    if (bodyElem) {
-        const bodyWidth = bodyElem.clientWidth;
-        const bodyScrollLeft = bodyElem.scrollLeft;
+    if (bodyScrollElem) {
+        const bodyWidth = bodyScrollElem.clientWidth;
+        const bodyScrollLeft = bodyScrollElem.scrollLeft;
         let tdElem = null;
         if (row) {
             const rowid = getRowid($xeTable, row);
-            tdElem = bodyElem.querySelector(`[rowid="${rowid}"] .${column.id}`);
+            tdElem = bodyScrollElem.querySelector(`[rowid="${rowid}"] .${column.id}`);
         }
         if (!tdElem) {
-            tdElem = bodyElem.querySelector(`.${column.id}`);
+            tdElem = bodyScrollElem.querySelector(`.${column.id}`);
         }
         if (tdElem) {
             const tdOffsetParent = tdElem.offsetParent;
             const tdOffsetLeft = tdElem.offsetLeft + (tdOffsetParent ? tdOffsetParent.offsetLeft : 0);
             const cellWidth = tdElem.clientWidth;
             // 检测是否在可视区中
-            if (tdOffsetLeft < (bodyScrollLeft + offsetFixedLeft)) {
-                return $xeTable.scrollTo(tdOffsetLeft - offsetFixedLeft - 1);
+            if (tdOffsetLeft < (bodyScrollLeft + leftFixedWidth)) {
+                return $xeTable.scrollTo(tdOffsetLeft - leftFixedWidth - 1);
             }
-            else if ((tdOffsetLeft + cellWidth - bodyScrollLeft) > (bodyWidth - offsetFixedRight)) {
-                return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - offsetFixedRight - 1));
+            else if ((tdOffsetLeft + cellWidth - bodyScrollLeft) > (bodyWidth - rightFixedWidth)) {
+                return $xeTable.scrollTo((tdOffsetLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1));
             }
         }
         else {
@@ -434,15 +443,16 @@ export function colToVisible($xeTable, column, row) {
                 let scrollLeft = 0;
                 const cellWidth = column.renderWidth;
                 for (let i = 0; i < visibleColumn.length; i++) {
-                    if (visibleColumn[i] === column) {
+                    const currCol = visibleColumn[i];
+                    if (currCol === column || currCol.id === column.id) {
                         break;
                     }
-                    scrollLeft += visibleColumn[i].renderWidth;
+                    scrollLeft += currCol.renderWidth;
                 }
                 if (scrollLeft < bodyScrollLeft) {
-                    return $xeTable.scrollTo(scrollLeft - offsetFixedLeft - 1);
+                    return $xeTable.scrollTo(scrollLeft - leftFixedWidth - 1);
                 }
-                return $xeTable.scrollTo((scrollLeft + cellWidth) - (bodyWidth - offsetFixedRight - 1));
+                return $xeTable.scrollTo((scrollLeft + cellWidth) - (bodyWidth - rightFixedWidth - 1));
             }
         }
     }