vxe-table 3.19.3 → 3.19.5

package/lib/index.umd.js

@@ -2005,7 +2005,7 @@ function getClass(property, params) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "3.19.3";
+const version = "3.19.5";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -2178,7 +2178,8 @@ core_.VxeUI.setConfig({
       hasChildField: 'hasChild',
       mapChildrenField: '_X_ROW_CHILD',
       indent: 20,
-      showIcon: true
+      showIcon: true,
+      showRootLine: true
     },
     expandConfig: {
       // trigger: 'default',
@@ -2621,6 +2622,23 @@ function updateCellTitle(overflowElem, column) {
     overflowElem.setAttribute('title', content);
   }
 }
+function checkTargetElement(target, exEls, endEl) {
+  let targetEl = target;
+  if (!exEls || !exEls.length) {
+    return false;
+  }
+  const [exEl1, exEl2, exEl3] = exEls;
+  while (targetEl) {
+    if (exEl1 === targetEl || exEl2 && targetEl === exEl2 || exEl3 && targetEl === exEl3) {
+      return true;
+    }
+    if (endEl && targetEl === endEl) {
+      return false;
+    }
+    targetEl = targetEl.parentElement;
+  }
+  return false;
+}
 /**
  * 检查触发源是否属于目标节点
  */
@@ -2695,7 +2713,7 @@ function isNodeElement(elem) {
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"3.19.3"}`;
+const log_version = `table v${"3.19.5"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -3477,85 +3495,6 @@ function getLastChildColumn(column) {
   }
   return column;
 }
-const lineOffsetSizes = {
-  mini: 3,
-  small: 2,
-  medium: 1,
-  large: 0
-};
-function countTreeExpandSize(prevRow, params) {
-  let count = 1;
-  if (!prevRow) {
-    return count;
-  }
-  const {
-    $table
-  } = params;
-  const reactData = $table;
-  const {
-    treeExpandedFlag
-  } = reactData;
-  const internalData = $table;
-  const {
-    treeExpandedMaps
-  } = internalData;
-  const treeOpts = $table.computeTreeOpts;
-  const {
-    transform,
-    mapChildrenField
-  } = treeOpts;
-  const childrenField = treeOpts.children || treeOpts.childrenField;
-  const rowChildren = prevRow[transform ? mapChildrenField : childrenField];
-  if (rowChildren && treeExpandedFlag && treeExpandedMaps[getRowid($table, prevRow)]) {
-    for (let index = 0; index < rowChildren.length; index++) {
-      count += countTreeExpandSize(rowChildren[index], params);
-    }
-  }
-  return count;
-}
-function getOffsetSize($xeTable) {
-  const vSize = $xeTable.computeSize;
-  if (vSize) {
-    return lineOffsetSizes[vSize] || 0;
-  }
-  return 0;
-}
-function calcTreeLine(params, prevRow) {
-  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 || rowRest.height || defaultRowHeight;
-  let expandSize = 1;
-  if (prevRow) {
-    expandSize = countTreeExpandSize(prevRow, params);
-  }
-  let cellHeight = currCellHeight;
-  const vnHeight = rowRest.height;
-  if (scrollYLoad) {
-    if (!showOverflow) {
-      cellHeight = vnHeight || currCellHeight;
-    }
-  }
-  return cellHeight * expandSize - (prevRow ? 1 : 12 - getOffsetSize($table));
-}
 function getCellValue(row, column) {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, column.field);
 }
@@ -8878,6 +8817,9 @@ function autoCellWidth($xeTable) {
   updateColumnOffsetLeft($xeTable);
   updateHeight($xeTable);
 }
+/**
+ * 计算自适应行高
+ */
 const calcCellAutoHeight = (rowRest, wrapperEl) => {
   const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
   let colHeight = rowRest.height;
@@ -8895,9 +8837,16 @@ const calcCellAutoHeight = (rowRest, wrapperEl) => {
   }
   return colHeight;
 };
+/**
+ * 自适应行高
+ */
 const calcCellHeight = $xeTable => {
+  const props = $xeTable;
   const reactData = $xeTable;
   const internalData = $xeTable;
+  const {
+    treeConfig
+  } = props;
   const {
     tableData,
     isAllOverflow,
@@ -8907,9 +8856,10 @@ const calcCellHeight = $xeTable => {
   const {
     fullAllDataRowIdData
   } = internalData;
+  const treeOpts = $xeTable.computeTreeOpts;
   const defaultRowHeight = $xeTable.computeDefaultRowHeight;
   const el = $xeTable.$refs.refElem;
-  if (!isAllOverflow && (scrollYLoad || scrollXLoad) && el) {
+  if (!isAllOverflow && (scrollYLoad || scrollXLoad || treeConfig && treeOpts.showLine) && el) {
     const {
       handleGetRowId
     } = createHandleGetRowId($xeTable);
@@ -9833,6 +9783,7 @@ function loadTableData($xeTable, datas, isReset) {
         }
         reactData.isRowLoading = false;
         handleRecalculateStyle($xeTable, false, false, false);
+        updateTreeLineStyle($xeTable);
         // 如果是自动行高，特殊情况需调用 recalculate 手动刷新
         if (!props.showOverflow) {
           setTimeout(() => {
@@ -9845,6 +9796,7 @@ function loadTableData($xeTable, datas, isReset) {
           restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop).then(() => {
             handleRecalculateStyle($xeTable, false, true, true);
             updateRowOffsetTop($xeTable);
+            updateTreeLineStyle($xeTable);
             resolve();
           });
         } else {
@@ -9852,6 +9804,7 @@ function loadTableData($xeTable, datas, isReset) {
             restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop).then(() => {
               handleRecalculateStyle($xeTable, false, true, true);
               updateRowOffsetTop($xeTable);
+              updateTreeLineStyle($xeTable);
               resolve();
             });
           });
@@ -10417,6 +10370,9 @@ function updateHeight($xeTable) {
     internalData.customHeight = 300;
   }
 }
+/**
+ * 计算自适应列宽
+ */
 function calcColumnAutoWidth($xeTable, column, wrapperEl) {
   const columnOpts = $xeTable.computeColumnOpts;
   const {
@@ -10451,6 +10407,9 @@ function calcColumnAutoWidth($xeTable, column, wrapperEl) {
   }
   return colWidth + leftRightPadding;
 }
+/**
+ * 自适应列宽
+ */
 function calcCellWidth($xeTable) {
   const internalData = $xeTable;
   const autoWidthColumnList = $xeTable.computeAutoWidthColumnList;
@@ -10612,9 +10571,109 @@ function updateRowExpandStyle($xeTable) {
 /**
  * 更新树连接线样式
  */
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function updateTreeLineStyle($xeTable) {
-  // 待优化
+  const props = $xeTable;
+  const reactData = $xeTable;
+  const internalData = $xeTable;
+  const {
+    treeConfig
+  } = props;
+  if (!treeConfig) {
+    return;
+  }
+  const {
+    tableData
+  } = reactData;
+  const {
+    fullAllDataRowIdData,
+    treeExpandedMaps
+  } = internalData;
+  const cellOpts = $xeTable.computeCellOpts;
+  const rowOpts = $xeTable.computeRowOpts;
+  const defaultRowHeight = $xeTable.computeDefaultRowHeight;
+  const treeOpts = $xeTable.computeTreeOpts;
+  const {
+    transform,
+    mapChildrenField
+  } = treeOpts;
+  const childrenField = treeOpts.children || treeOpts.childrenField;
+  const {
+    handleGetRowId
+  } = createHandleGetRowId($xeTable);
+  const expParentList = [];
+  const handleNodeRow = (row, rIndex, rows) => {
+    const rowid = handleGetRowId(row);
+    const rowRest = fullAllDataRowIdData[rowid] || {};
+    const childList = row[transform ? mapChildrenField : childrenField];
+    const prevRow = rows[rIndex - 1] || null;
+    const nextRow = rows[rIndex + 1] || null;
+    if (childList && childList.length && treeExpandedMaps[rowid]) {
+      expParentList.push({
+        row,
+        prevRow,
+        nextRow
+      });
+      childList.forEach((childRow, crIndex) => {
+        const childRowid = handleGetRowId(childRow);
+        if (treeExpandedMaps[childRowid]) {
+          handleNodeRow(childRow, crIndex, childList);
+        }
+      });
+    } else {
+      if (nextRow) {
+        const nextRowid = handleGetRowId(nextRow);
+        const nextRowRest = fullAllDataRowIdData[nextRowid] || {};
+        const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
+        const nextCellHeight = getCellRestHeight(nextRowRest, cellOpts, rowOpts, defaultRowHeight);
+        rowRest.oHeight = currCellHeight;
+        rowRest.lineHeight = Math.floor(currCellHeight / 2 + nextCellHeight / 2);
+      } else {
+        rowRest.oHeight = 0;
+        rowRest.lineHeight = 0;
+      }
+    }
+  };
+  tableData.forEach((row, rIndex) => {
+    handleNodeRow(row, rIndex, tableData);
+  });
+  external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().lastArrayEach(expParentList, ({
+    row,
+    nextRow
+  }) => {
+    const rowid = handleGetRowId(row);
+    const childList = row[transform ? mapChildrenField : childrenField];
+    const rowRest = fullAllDataRowIdData[rowid];
+    if (rowRest) {
+      const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
+      let countOffsetHeight = currCellHeight;
+      let countLineHeight = 0;
+      childList.forEach(childRow => {
+        const childRowid = handleGetRowId(childRow);
+        const childRowRest = fullAllDataRowIdData[childRowid] || {};
+        const childList = childRow[transform ? mapChildrenField : childrenField];
+        if (treeExpandedMaps[childRowid] && childList && childList.length) {
+          countOffsetHeight += childRowRest.oHeight || 0;
+          countLineHeight += childRowRest.oHeight || 0;
+        } else {
+          const cellHeight = getCellRestHeight(childRowRest, cellOpts, rowOpts, defaultRowHeight);
+          childRowRest.oHeight = cellHeight;
+          childRowRest.lineHeight = cellHeight;
+          countOffsetHeight += cellHeight;
+          countLineHeight += cellHeight;
+        }
+      });
+      if (nextRow) {
+        const nextRowid = handleGetRowId(nextRow);
+        const nextRowRest = fullAllDataRowIdData[nextRowid] || {};
+        const currCellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight);
+        const nextCellHeight = getCellRestHeight(nextRowRest, cellOpts, rowOpts, defaultRowHeight);
+        countOffsetHeight += currCellHeight;
+        countLineHeight += Math.floor(currCellHeight / 2 + nextCellHeight / 2);
+      }
+      rowRest.lineHeight = countLineHeight;
+      rowRest.oHeight = countOffsetHeight;
+    }
+  });
 }
 function handleRowExpandScroll($xeTable) {
   const internalData = $xeTable;
@@ -18593,6 +18652,7 @@ const Methods = {
   },
   triggerBodyWheelEvent(evnt) {
     const $xeTable = this;
+    const $xeParentTable = $xeTable.$xeParentTable;
     const tableProps = $xeTable;
     const reactData = $xeTable;
     const internalData = $xeTable;
@@ -18666,6 +18726,21 @@ const Methods = {
         return;
       }
     }
+    // 展开行处理，如果展开行嵌入表格中
+    if ($xeParentTable) {
+      if (isRollY) {
+        if (checkTargetElement(evnt.target, [leftScrollElem, bodyScrollElem, rightScrollElem], evnt.currentTarget)) {
+          evnt.stopPropagation();
+          return;
+        }
+      }
+      if (isRollX) {
+        if (checkTargetElement(evnt.target, [headerScrollElem, bodyScrollElem, footerScrollElem], evnt.currentTarget)) {
+          evnt.stopPropagation();
+          return;
+        }
+      }
+    }
     if (!(leftFixedWidth || rightFixedWidth || expandColumn)) {
       return;
     }
@@ -19656,12 +19731,12 @@ function renderLine(h, $xeTable, rowid, params, cellHeight) {
   const {
     column
   } = params;
-  const {
-    afterFullData
-  } = tableInternalData;
   const {
     treeConfig
   } = tableProps;
+  const cellOpts = $xeTable.computeCellOpts;
+  const rowOpts = $xeTable.computeRowOpts;
+  const defaultRowHeight = $xeTable.computeDefaultRowHeight;
   const treeOpts = $xeTable.computeTreeOpts;
   const {
     slots,
@@ -19670,26 +19745,39 @@ function renderLine(h, $xeTable, rowid, params, cellHeight) {
   const {
     fullAllDataRowIdData
   } = tableInternalData;
-  if (slots && slots.line) {
-    return $xeTable.callSlot(slots.line, params, h);
-  }
-  const rowRest = fullAllDataRowIdData[rowid];
-  let rLevel = 0;
-  let prevRow = null;
-  if (rowRest) {
-    rLevel = rowRest.level;
-    prevRow = rowRest.items[rowRest.treeIndex - 1];
-  }
   if (treeConfig && treeNode && (treeOpts.showLine || treeOpts.line)) {
+    if (slots && slots.line) {
+      return $xeTable.callSlot(slots.line, params, h);
+    }
+    const rowRest = fullAllDataRowIdData[rowid];
+    let rLevel = 0;
+    let prevRow = null;
+    let parentRow = null;
+    let lineHeight = '';
+    if (rowRest) {
+      rLevel = rowRest.level;
+      prevRow = rowRest.items[rowRest.treeIndex - 1];
+      parentRow = rowRest.parent;
+    }
+    if (!rLevel && !treeOpts.showRootLine) {
+      return [];
+    }
+    if (prevRow) {
+      const prevRowRest = fullAllDataRowIdData[getRowid($xeTable, prevRow)] || {};
+      lineHeight = `${prevRowRest.lineHeight || 0}px`;
+    } else if (rLevel && parentRow) {
+      const parentRowRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)] || {};
+      lineHeight = `calc(-1em + ${Math.floor(cellHeight / 2 + getCellRestHeight(parentRowRest, cellOpts, rowOpts, defaultRowHeight) / 2)}px)`;
+    }
     return [h('div', {
       key: 'tl',
       class: 'vxe-tree--line-wrapper'
     }, [h('div', {
       class: 'vxe-tree--line',
       style: {
-        height: `${getRowid($xeTable, afterFullData[0]) === rowid ? 1 : calcTreeLine(params, prevRow)}px`,
+        height: lineHeight,
         bottom: `-${Math.floor(cellHeight / 2)}px`,
-        left: `${rLevel * treeOpts.indent + (rLevel ? 2 - getOffsetSize($xeTable) : 0) + 16}px`
+        left: `calc(${rLevel * treeOpts.indent}px + 1em)`
       }
     })])];
   }
@@ -25303,16 +25391,16 @@ function insertTreeRow($xeTable, newRecords, isAppend) {
       } = matchObj;
       const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)];
       const parentLevel = parentRest ? parentRest.level : 0;
-      let parentChilds = parentRow[childrenField];
-      let mapChilds = parentRow[mapChildrenField];
-      if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(parentChilds)) {
-        parentChilds = parentRow[childrenField] = [];
+      let pChilds = parentRow[childrenField];
+      let pMapChilds = parentRow[mapChildrenField];
+      if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(pChilds)) {
+        pChilds = parentRow[childrenField] = [];
       }
-      if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(mapChilds)) {
-        mapChilds = parentRow[childrenField] = [];
+      if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(pMapChilds)) {
+        pMapChilds = parentRow[mapChildrenField] = [];
       }
-      parentChilds[funcName](item);
-      mapChilds[funcName](item);
+      pChilds[funcName](item);
+      pMapChilds[funcName](item);
       const rest = {
         row: item,
         rowid,
@@ -25322,7 +25410,7 @@ function insertTreeRow($xeTable, newRecords, isAppend) {
         $index: -1,
         treeIndex: -1,
         _tIndex: -1,
-        items: parentChilds,
+        items: pChilds,
         parent: parentRow,
         level: parentLevel + 1,
         height: 0,
@@ -25505,13 +25593,15 @@ function handleInsertRowAt($xeTable, records, targetRow, isInsertNextRow) {
           treeRecords.forEach((row, i) => {
             if (parentRow) {
               if (row[parentField] !== parentRow[rowField]) {
-                row[parentField] = parentRow[rowField];
                 errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, `${parentField}=${parentRow[rowField]}`]);
+                row[parentField] = parentRow[rowField];
               }
             } else {
               if (row[parentField] !== null) {
+                if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(row[parentField])) {
+                  errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, 'null']);
+                }
                 row[parentField] = null;
-                errLog('vxe.error.errProp', [`${parentField}=${row[parentField]}`, 'null']);
               }
             }
             let targetIndex = matchMapObj.index + i;
@@ -30626,6 +30716,10 @@ function renderBody(h, $xeTable) {
     $xeTabs: {
       default: null
     },
+    $xeParentTable: {
+      from: '$xeTable',
+      default: null
+    },
     $xeGrid: {
       default: null
     },
@@ -31590,7 +31684,7 @@ function renderBody(h, $xeTable) {
       const {
         initStatus
       } = this;
-      if (value && value.length >= 50000) {
+      if (value && value.length >= 20000) {
         warnLog('vxe.error.errLargeData', ['loadData(data), reloadData(data)']);
       }
       this.loadTableData(value || [], true).then(() => {
@@ -31737,7 +31831,6 @@ function renderBody(h, $xeTable) {
       exportConfig,
       importConfig,
       treeConfig,
-      showOverflow,
       highlightCurrentRow,
       highlightCurrentColumn
     } = props;
@@ -31779,9 +31872,9 @@ function renderBody(h, $xeTable) {
     if (props.editConfig && editOpts.showStatus && !props.keepSource) {
       warnLog('vxe.error.reqProp', ['keep-source']);
     }
-    if (treeConfig && (treeOpts.showLine || treeOpts.line) && !showOverflow) {
-      warnLog('vxe.error.reqProp', ['show-overflow']);
-    }
+    // if (treeConfig && (treeOpts.showLine || treeOpts.line) && !showOverflow) {
+    //   warnLog('vxe.error.reqProp', ['show-overflow'])
+    // }
     if (treeConfig && !treeOpts.transform && props.stripe) {
       warnLog('vxe.error.noTree', ['stripe']);
     }