vxe-table 3.21.13 → 3.21.15

package/packages/table/src/methods.ts

@@ -654,28 +654,66 @@ function handleDefaultRowGroupExpand ($xeTable: VxeTableConstructor & VxeTablePr
   }
 }
 
+function updateAfterTreeIndex ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const { fullDataRowIdData, fullAllDataRowIdData, afterFullData, afterTreeFullData } = internalData
+  const treeOpts = $xeTable.computeTreeOpts
+  const { transform, mapChildrenField } = treeOpts
+  const childrenField = treeOpts.children || treeOpts.childrenField
+  const fullMaps: Record<string, any> = {}
+  let rowNum = 0
+  const { handleGetRowId } = createHandleGetRowId($xeTable)
+  XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
+    const rowid = handleGetRowId(row)
+    const rowRest = fullAllDataRowIdData[rowid]
+    const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
+    if (rowRest) {
+      rowRest.seq = seq
+      rowRest._seq = rowNum
+      rowRest.treeIndex = index
+      rowRest._tIndex = rowNum
+    } else {
+      const rest = { row, rowid, _seq: rowNum, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, _tIndex: rowNum, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
+      fullAllDataRowIdData[rowid] = rest
+      fullDataRowIdData[rowid] = rest
+    }
+    rowNum++
+    fullMaps[rowid] = row
+  }, { children: transform ? mapChildrenField : childrenField })
+  if (transform) {
+    afterFullData.forEach((row, index) => {
+      const rowid = handleGetRowId(row)
+      const rowRest = fullAllDataRowIdData[rowid]
+      if (rowRest) {
+        rowRest._index = index
+      }
+    })
+  }
+  internalData.afterFullRowMaps = fullMaps
+}
+
 function updateAfterListIndex ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
-  const props = $xeTable
   const internalData = $xeTable as unknown as TableInternalData
 
-  const { treeConfig } = props
   const { afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData
   const { handleGetRowId } = createHandleGetRowId($xeTable)
   const fullMaps: Record<string, any> = {}
+  let rowNum = 0
   afterFullData.forEach((row, index) => {
     const rowid = handleGetRowId(row)
     const rowRest = fullAllDataRowIdData[rowid]
     const seq = index + 1
     if (rowRest) {
-      if (!treeConfig) {
-        rowRest.seq = seq
-      }
+      rowRest.seq = seq
+      rowRest._seq = rowNum
       rowRest._index = index
     } else {
-      const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, _tIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
+      const rest = { row, rowid, _seq: rowNum, seq, index: -1, $index: -1, _index: index, treeIndex: -1, _tIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
       fullAllDataRowIdData[rowid] = rest
       fullDataRowIdData[rowid] = rest
     }
+    rowNum++
     fullMaps[rowid] = row
   })
   internalData.afterFullRowMaps = fullMaps
@@ -687,47 +725,10 @@ function updateAfterListIndex ($xeTable: VxeTableConstructor & VxeTablePrivateMe
  */
 function updateAfterDataIndex ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
   const props = $xeTable
-  const internalData = $xeTable as unknown as TableInternalData
 
   const { treeConfig } = props
-  const { fullDataRowIdData, fullAllDataRowIdData, afterFullData, afterTreeFullData } = internalData
-  const treeOpts = $xeTable.computeTreeOpts
-  const { transform } = treeOpts
-  const childrenField = treeOpts.children || treeOpts.childrenField
-  const fullMaps: Record<string, any> = {}
   if (treeConfig) {
-    let _treeIndex = 0
-    const { handleGetRowId } = createHandleGetRowId($xeTable)
-    XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
-      const rowid = handleGetRowId(row)
-      const rowRest = fullAllDataRowIdData[rowid]
-      const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
-      if (rowRest) {
-        rowRest.seq = seq
-        rowRest.treeIndex = index
-        rowRest._tIndex = _treeIndex
-      } else {
-        const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, _tIndex: _treeIndex, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
-        fullAllDataRowIdData[rowid] = rest
-        fullDataRowIdData[rowid] = rest
-      }
-      _treeIndex++
-      fullMaps[rowid] = row
-    }, { children: transform ? treeOpts.mapChildrenField : childrenField })
-    if (transform) {
-      afterFullData.forEach((row, index) => {
-        const rowid = handleGetRowId(row)
-        const rowRest = fullAllDataRowIdData[rowid]
-        const seq = index + 1
-        if (rowRest) {
-          if (!treeConfig) {
-            rowRest.seq = seq
-          }
-          rowRest._index = index
-        }
-      })
-    }
-    internalData.afterFullRowMaps = fullMaps
+    updateAfterTreeIndex($xeTable)
   } else {
     updateAfterListIndex($xeTable)
   }
@@ -3199,12 +3200,15 @@ function handleRecalculateStyle ($xeTable: VxeTableConstructor & VxeTablePrivate
   })
 }
 
-const minRunDelay = 50
+const defaultMinRunDelay = 50
 
-function handleLazyRecalculate ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, reFull: boolean, reWidth: boolean, reHeight: boolean) {
+function handleLazyRecalculate ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, reFull: boolean, reWidth: boolean, reHeight: boolean, options?: {
+  minRunDelay?: number // 多少毫秒内至少执行一次
+}) {
   const reactData = $xeTable as unknown as TableReactData
   const internalData = $xeTable as unknown as TableInternalData
 
+  const minRunDelay = (options ? options.minRunDelay : defaultMinRunDelay) || defaultMinRunDelay
   return new Promise<void>(resolve => {
     const { customStore } = reactData
     const { rceTimeout, rceRunTime } = internalData
@@ -3230,6 +3234,7 @@ function handleLazyRecalculate ($xeTable: VxeTableConstructor & VxeTablePrivateM
     }
     if (rceTimeout) {
       clearTimeout(rceTimeout)
+      // 多少毫秒内至少执行一次
       if (rceRunTime && rceRunTime + minRunDelay < Date.now()) {
         resolve(
           handleRecalculateStyle($xeTable, reFull, reWidth, reHeight)
@@ -3255,7 +3260,19 @@ function handleLazyRecalculate ($xeTable: VxeTableConstructor & VxeTablePrivateM
 }
 
 function handleResizeEvent ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
-  handleLazyRecalculate($xeTable, true, true, true)
+  const internalData = $xeTable as unknown as TableInternalData
+
+  if (internalData.rsePending) {
+    return
+  }
+  internalData.rsePending = true
+  handleLazyRecalculate($xeTable, true, true, true, {
+    minRunDelay: 200
+  }).then(() => {
+    internalData.rsePending = false
+  }).catch(() => {
+    internalData.rsePending = false
+  })
 }
 
 function handleUpdateAggValues ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
@@ -5126,17 +5143,19 @@ const tableMethods: any = {
 
     const idMaps: Record<string, boolean> = {}
     const { handleUpdateRowId } = createHandleUpdateRowId($xeTable)
+    let rowNum = 0
     const handleRowCache = (row: any, index: number, items: any, currIndex: number, parentRow: any, rowid: string, level: number, seq: string | number) => {
       let rowRest = fullAllDataRowIdMaps[rowid]
       if (idMaps[rowid]) {
         errLog('vxe.error.repeatKey', [currKeyField, rowid])
       }
       if (!rowRest) {
-        rowRest = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, _tIndex: -1, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
+        rowRest = { row, rowid, _seq: -1, seq, index: -1, _index: -1, $index: -1, treeIndex: index, _tIndex: -1, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
       }
       rowRest.treeLoaded = false
       rowRest.expandLoaded = false
 
+      rowRest._seq = rowNum++
       rowRest.row = row
       rowRest.items = items
       rowRest.parent = parentRow
@@ -5250,7 +5269,7 @@ const tableMethods: any = {
       XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
         const rowid = getRowid($xeTable, childRow)
         const parentRow = parentItem || parentRest.row
-        const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
+        const rest = { row: childRow, rowid, _seq: -1, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, _tIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
         fullDataRowIdData[rowid] = rest
         fullAllDataRowIdData[rowid] = rest
       }, { children: childrenField })
@@ -8747,31 +8766,162 @@ const tableMethods: any = {
     const { treeConfig } = props
     const { row } = params
     const { isRowGroupStatus } = reactData
-    const { afterFullData } = internalData
+    const { fullAllDataRowIdData, afterFullData, afterTreeFullData, afterGroupFullData } = internalData
     const checkboxOpts = $xeTable.computeCheckboxOpts
-    const { checkMethod, trigger } = checkboxOpts
+    const aggregateOpts = $xeTable.computeAggregateOpts
+    const treeOpts = $xeTable.computeTreeOpts
+    const { checkMethod, trigger, checkStrictly } = checkboxOpts
     if (trigger === 'manual') {
       return
     }
     evnt.stopPropagation()
-    if (checkboxOpts.isShiftKey && evnt.shiftKey && !(treeConfig || isRowGroupStatus)) {
+
+    if (checkboxOpts.isShiftKey && evnt.shiftKey) {
+      const { handleGetRowId } = createHandleGetRowId($xeTable)
       const checkboxRecords = $xeTable.getCheckboxRecords()
-      if (checkboxRecords.length) {
-        const firstRow = checkboxRecords[0]
-        const _rowIndex = $xeTable.getVTRowIndex(row)
-        const _firstRowIndex = $xeTable.getVTRowIndex(firstRow)
-        if (_rowIndex !== _firstRowIndex) {
+      let currSeq = -1
+      let currRow: any = null
+      const currRowid = handleGetRowId(row)
+      const rowRest = fullAllDataRowIdData[currRowid]
+      if (rowRest) {
+        currRow = rowRest.row
+        currSeq = rowRest._seq
+      }
+      if (currRow && checkboxRecords.length) {
+        let rangeRows: any[] = []
+        let firstSeq = -1
+        let firstRow: any = null
+        let firstRowid = ''
+        let lastSeq = -1
+        let lastRow: any = null
+        let lastRowid = ''
+        // 根据序号取出范围最小/最大的行
+        const selectMaps: Record<string, any> = {}
+        checkboxRecords.forEach(item => {
+          const rowid = handleGetRowId(item)
+          const rowRest = fullAllDataRowIdData[rowid]
+          if (rowRest) {
+            if (!firstRow || firstSeq > rowRest._seq) {
+              firstRowid = rowRest.rowid
+              firstRow = rowRest.row
+              firstSeq = rowRest._seq
+            }
+            if (!lastRow || lastSeq < rowRest._seq) {
+              lastRowid = rowRest.rowid
+              lastRow = rowRest.row
+              lastSeq = rowRest._seq
+            }
+          }
+          selectMaps[rowid] = item
+        })
+        // 如果已选只有一条并选择当前则跳过
+        if (firstRow && lastRow && (checkboxRecords.length > 1 || currRowid !== firstRowid) && (Math.abs(firstSeq - lastSeq) > 1 || Math.abs(currSeq - firstSeq) > 1 || Math.abs(currSeq - lastSeq) > 1)) {
+          // 树与分组
+          if (treeConfig || isRowGroupStatus) {
+            const { transform } = treeOpts
+            const childrenField = treeOpts.children || treeOpts.childrenField
+            const iteratorChildField = treeConfig ? (transform ? treeOpts.mapChildrenField : childrenField) : aggregateOpts.mapChildrenField as string
+            let isMatchFirst = false
+            let matchStartRowid = ''
+            let matchEndRowid = ''
+
+            const handleGetChildRowid = (rowid: string, isLast: 0 | 1): string => {
+              const rowRest = fullAllDataRowIdData[rowid]
+              if (rowRest) {
+                const item = rowRest.row
+                const childList = item[iteratorChildField]
+                if (childList && childList.length) {
+                  const targetRow = isLast ? XEUtils.last(childList) : XEUtils.first(childList)
+                  return handleGetChildRowid(handleGetRowId(targetRow), isLast)
+                }
+              }
+              return rowid
+            }
+
+            const handleGetSelectParentRowid = (rowid: string): string => {
+              const rowRest = fullAllDataRowIdData[rowid]
+              if (rowRest) {
+                const parentItem = rowRest.parent
+                if (parentItem) {
+                  const parentRowid = handleGetRowId(parentItem)
+                  if (selectMaps[parentRowid]) {
+                    return handleGetSelectParentRowid(parentRowid)
+                  }
+                }
+              }
+              return rowid
+            }
+
+            const handleGetRootRow = (row: string): VxeTableDefines.RowCacheItem | null => {
+              const rowid = handleGetRowId(row)
+              if (rowid) {
+                const rest = fullAllDataRowIdData[rowid]
+                if (rest) {
+                  return rest.parent ? handleGetRootRow(rest.parent) : rest
+                }
+              }
+              return null
+            }
+
+            if (currSeq < firstSeq) {
+              matchStartRowid = handleGetChildRowid(currRowid, 0)
+              matchEndRowid = handleGetChildRowid(firstRowid, 1)
+            } else {
+              if (currSeq > lastSeq) {
+                matchStartRowid = handleGetSelectParentRowid(lastRowid)
+              } else {
+                matchStartRowid = handleGetChildRowid(firstRowid, 0)
+              }
+              matchEndRowid = handleGetChildRowid(currRowid, 1)
+            }
+
+            const handleRangeRow = (item: any) => {
+              const rowid = handleGetRowId(item)
+              const childList = item[iteratorChildField]
+              if (!isMatchFirst && rowid === matchStartRowid) {
+                isMatchFirst = true
+              }
+              // 如果是父子关联，则排除父节点
+              if (isMatchFirst && (checkStrictly || !childList || !childList.length)) {
+                rangeRows.push(item)
+              }
+              // break
+              return rowid === matchEndRowid
+            }
+            if (treeConfig) {
+              const matchStartRowRest = fullAllDataRowIdData[matchStartRowid]
+              const firstRootRowRest = matchStartRowRest ? handleGetRootRow(matchStartRowRest.row) : null
+              if (firstRootRowRest) {
+                // 优化查找复杂度
+                XEUtils.findTree(afterTreeFullData.slice(firstRootRowRest.treeIndex), handleRangeRow, { children: iteratorChildField })
+              } else {
+                XEUtils.findTree(afterTreeFullData, handleRangeRow, { children: iteratorChildField })
+              }
+            } else {
+              XEUtils.findTree(afterGroupFullData, handleRangeRow, { children: iteratorChildField })
+            }
+          } else {
+            const _currRowIndex = $xeTable.getVTRowIndex(currRow)
+            const _firstRowIndex = $xeTable.getVTRowIndex(firstRow)
+            const _lastRowIndex = $xeTable.getVTRowIndex(lastRow)
+            if (_currRowIndex < _firstRowIndex) {
+              rangeRows = afterFullData.slice(_currRowIndex, _firstRowIndex + 1)
+            } else if (_currRowIndex > _lastRowIndex) {
+              rangeRows = afterFullData.slice(_lastRowIndex, _currRowIndex + 1)
+            } else {
+              rangeRows = afterFullData.slice(_firstRowIndex, _currRowIndex + 1)
+            }
+          }
           $xeTable.setAllCheckboxRow(false)
-          const rangeRows = _rowIndex < _firstRowIndex ? afterFullData.slice(_rowIndex, _firstRowIndex + 1) : afterFullData.slice(_firstRowIndex, _rowIndex + 1)
           $xeTable.$nextTick(() => {
             handleCheckedCheckboxRow($xeTable, rangeRows, true, false)
           })
           $xeTable.dispatchEvent('checkbox-range-select', Object.assign({ rangeRecords: rangeRows }, params), evnt)
-          return
         }
       }
     }
-    if (isRowGroupStatus || !checkMethod || checkMethod({ $table: $xeTable, row })) {
+
+    if (!checkMethod || checkMethod({ $table: $xeTable, row })) {
       $xeTable.handleBatchSelectRows([row], checked)
       $xeTable.checkSelectionStatus()
       $xeTable.dispatchEvent('checkbox-change', Object.assign({

package/packages/table/src/table.ts

@@ -1348,22 +1348,32 @@ export default {
       const { tableFullColumn } = internalData
       const { updateColFlag } = reactData
       const editDirtyOpts = $xeTable.computeEditDirtyOpts
-      const { includeFields, excludeFields } = editDirtyOpts
+      const { extraFields, includeFields, excludeFields } = editDirtyOpts
       const kpFields: string[] = []
       if (updateColFlag) {
         if (includeFields && includeFields.length) {
           return includeFields
         }
-        const exfMaps: Record<string, number> = {}
+        const excludeFdMaps: Record<string, number> = {}
         if (excludeFields && excludeFields.length) {
           excludeFields.forEach(field => {
-            exfMaps[field] = 1
+            excludeFdMaps[field] = 1
+          })
+        }
+        const addFdMaps: Record<string, number> = {}
+        if (extraFields && extraFields.length) {
+          extraFields.forEach(field => {
+            if (!addFdMaps[field]) {
+              addFdMaps[field] = 1
+              kpFields.push(field)
+            }
           })
         }
         for (let i = 0; i < tableFullColumn.length; i++) {
           const column = tableFullColumn[i]
           const { field, type, editRender, cellRender } = column
-          if (field && !type && (editRender || cellRender) && !exfMaps[field]) {
+          if (field && !type && (editRender || cellRender) && !addFdMaps[field] && !excludeFdMaps[field]) {
+            addFdMaps[field] = 1
             kpFields.push(field)
           }
         }
@@ -1862,9 +1872,6 @@ export default {
     if (props.editConfig && editOpts.activeMethod) {
       warnLog('vxe.error.delProp', ['table.edit-config.activeMethod', 'table.edit-config.beforeEditMethod'])
     }
-    if (props.treeConfig && checkboxOpts.isShiftKey) {
-      errLog('vxe.error.reqSupportProp', ['tree-config', 'checkbox-config.isShiftKey=false'])
-    }
     if (checkboxOpts.halfField) {
       warnLog('vxe.error.delProp', ['checkbox-config.halfField', 'checkbox-config.indeterminateField'])
     }

package/styles/components/table.scss

@@ -213,7 +213,8 @@ $btnThemeList: (
         .vxe-date-picker,
         .vxe-date-range-picker,
         .vxe-number-input,
-        .vxe-ico-picker {
+        .vxe-ico-picker,
+        .vxe-cascader {
           width: 100%;
         }
       }
@@ -236,7 +237,8 @@ $btnThemeList: (
         & > .vxe-date-picker,
         & > .vxe-date-range-picker,
         & > .vxe-number-input,
-        & > .vxe-ico-picker {
+        & > .vxe-ico-picker,
+        .vxe-cascader {
           width: 100%;
         }
         & > .vxe-row-group--tree-node,
@@ -251,7 +253,8 @@ $btnThemeList: (
           .vxe-date-picker,
           .vxe-date-range-picker,
           .vxe-number-input,
-          .vxe-ico-picker {
+          .vxe-ico-picker,
+          .vxe-cascader {
             width: 100%;
           }
         }
@@ -272,7 +275,8 @@ $btnThemeList: (
   & > .vxe-date-picker,
   & > .vxe-date-range-picker,
   & > .vxe-number-input,
-  & > .vxe-ico-picker {
+  & > .vxe-ico-picker,
+  & > .vxe-cascader {
     width: 100%;
   }
 }