vxe-table 4.20.7 → 4.20.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.20.7",
+  "version": "4.20.9",
   "description": "A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -66,7 +66,7 @@
     "typescript": "~5.9.3",
     "vue": "3.4.27",
     "vue-router": "~4.5.1",
-    "vxe-pc-ui": "4.16.21"
+    "vxe-pc-ui": "4.16.22"
   },
   "vetur": {
     "tags": "helper/vetur/tags.json",

package/packages/grid/src/grid.ts

@@ -1536,6 +1536,17 @@ export default defineVxeComponent({
           }
         }
         return null
+      },
+      getCustomPagerData () {
+        const { pagerConfig } = props
+        const { tablePage } = reactData
+        const pagerOpts = computePagerOpts.value
+        if (pagerConfig && isEnableConf(pagerOpts)) {
+          return {
+            pSize: tablePage.pageSize
+          }
+        }
+        return {}
       }
       // setProxyInfo (options) {
       //   if (props.proxyConfig && options) {

package/packages/table/module/export/hook.ts

@@ -1355,7 +1355,7 @@ hooks.add('tableExportModule', {
         const isColGroup = column.children && column.children.length > 0
         let isChecked = false
         const isExtraChecked = extraFdMaps[column.field]
-        if (columns && columns.length) {
+        if (columns) {
           isChecked = handleFilterColumns(defOpts, column, columns)
         } else if (excludeFields || includeFields) {
           isChecked = handleFilterFields(defOpts, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps)
@@ -1510,7 +1510,7 @@ hooks.add('tableExportModule', {
 
         let isCustomCol = false
         let customCols = []
-        if (columns && columns.length) {
+        if (columns) {
           isCustomCol = true
           customCols = XEUtils.searchTree(columns, () => true, { children: 'children', mapChildren: 'childNodes', original: true })
         } else {
@@ -1518,7 +1518,7 @@ hooks.add('tableExportModule', {
             const isColGroup = column.children && column.children.length > 0
             let isChecked = false
             const isExtraChecked = extraFdMaps[column.field]
-            if (columns && columns.length) {
+            if (columns) {
               isChecked = handleFilterColumns(opts, column, columns)
             } else if (excludeFields || includeFields) {
               isChecked = handleFilterFields(opts, column, includeFields, includeFdMaps, excludeFdMaps, extraFdMaps)

package/packages/table/src/body.ts

@@ -161,9 +161,9 @@ export default defineVxeComponent({
       let fixedHiddenColumn = overflowX && (fixedType ? column.fixed !== fixedType : !!column.fixed)
       const isCellPadding = XEUtils.eqNull(padding) ? (allPadding === null ? cellOpts.padding : allPadding) : padding
       const cellOverflow = XEUtils.eqNull(showOverflow) ? allShowOverflow : showOverflow
-      const showEllipsis = cellOverflow === 'ellipsis'
-      const showTitle = cellOverflow === 'title'
-      const showTooltip = cellOverflow === true ? tooltipOpts.mode === 'tooltip' : cellOverflow === 'tooltip'
+      const showEllipsis = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'ellipsis'
+      const showTitle = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'title'
+      const showTooltip = (cellOverflow === true ? tooltipOpts.mode : cellOverflow) === 'tooltip'
       const hasEllipsis = isAllOverflow || showTitle || showTooltip || showEllipsis
       const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable))
       const isCsHeight = !!customCellHeight

package/packages/table/src/cell.ts

@@ -191,8 +191,8 @@ function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams & {
   const headerTooltipOpts = computeHeaderTooltipOpts.value
   const showAllTip = headerTooltipOpts.showAll
   const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
-  const showTitle = headOverflow === 'title'
-  const showTooltip = headOverflow === true || headOverflow === 'tooltip'
+  const showTitle = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'title'
+  const showTooltip = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'tooltip'
   const ons: Record<string, any> = {}
   if (showTitle || showTooltip || showAllTip) {
     ons.onMouseenter = (evnt: MouseEvent) => {

package/packages/table/src/footer.ts

@@ -74,9 +74,9 @@ export default defineVxeComponent({
         const isPadding = XEUtils.isBoolean(footerCellOpts.padding) ? footerCellOpts.padding : cellOpts.padding
         const footOverflow = XEUtils.eqNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow
         const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign
-        const showEllipsis = footOverflow === 'ellipsis'
-        const showTitle = footOverflow === 'title'
-        const showTooltip = footOverflow === true ? footerTooltipOpts.mode === 'tooltip' : footOverflow === 'tooltip'
+        const showEllipsis = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'ellipsis'
+        const showTitle = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'title'
+        const showTooltip = (footOverflow === true ? footerTooltipOpts.mode : footOverflow) === 'tooltip'
         const hasEllipsis = showTitle || showTooltip || showEllipsis
         const showResizable = (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || allResizable))
         const attrs: any = { colid }

package/packages/table/src/header.ts

@@ -88,9 +88,9 @@ export default defineVxeComponent({
         const isPadding = XEUtils.isBoolean(headerCellOpts.padding) ? headerCellOpts.padding : cellOpts.padding
         const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
         const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign
-        const showEllipsis = headOverflow === 'ellipsis'
-        const showTitle = headOverflow === 'title'
-        const showTooltip = headOverflow === true ? headerTooltipOpts.mode === 'tooltip' : headOverflow === 'tooltip'
+        const showEllipsis = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'ellipsis'
+        const showTitle = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'title'
+        const showTooltip = (headOverflow === true ? headerTooltipOpts.mode : headOverflow) === 'tooltip'
         const hasEllipsis = showTitle || showTooltip || showEllipsis
         let hasFilter = false
         let firstFilterOption: VxeTableDefines.FilterOption | null = null

package/packages/table/src/table.ts

@@ -1610,9 +1610,9 @@ export default defineVxeComponent({
     const handleCustomRestore = (storeData: VxeTableDefines.CustomStoreData) => {
       const { aggregateConfig, rowGroupConfig } = props
       const { collectColumn } = internalData
-      const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc } = handleCustomStoreConfig($xeTable)
+      const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable)
 
-      let { alignData, headerAlignData, footerAlignData, resizableData, sortData, visibleData, fixedData, aggGroupData, aggFuncData } = storeData
+      let { alignData, headerAlignData, footerAlignData, resizableData, sortData, visibleData, fixedData, aggGroupData, aggFuncData, pagerData } = storeData
       // 处理还原
       if ((isCustomAlign && alignData) ||
         (isCustomHeaderAlign && headerAlignData) ||
@@ -1622,7 +1622,8 @@ export default defineVxeComponent({
         (isCustomVisible && visibleData) ||
         (isCustomFixed && fixedData) ||
         (isCustomAggGroup && aggGroupData) ||
-        (isCustomAggFunc && aggFuncData)) {
+        (isCustomAggFunc && aggFuncData) ||
+        (isCustomPager && pagerData && $xeGGWrapper)) {
         const sortColMaps: Record<string, {
           key: string
           sNum: number
@@ -1957,7 +1958,7 @@ export default defineVxeComponent({
       const autoWidthColumnList = computeAutoWidthColumnList.value
       const { fullColumnIdData } = internalData
       const el = refElem.value
-      if (el) {
+      if (el && autoWidthColumnList.length) {
         el.setAttribute('data-calc-col', 'Y')
         autoWidthColumnList.forEach(column => {
           const colid = column.id
@@ -2244,7 +2245,7 @@ export default defineVxeComponent({
       const fullMaps: Record<string, any> = {}
       let rowNum = 0
       const { handleGetRowId } = createHandleGetRowId($xeTable)
-      XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
+      XEUtils.eachTree(afterTreeFullData, (row, index, items, path, parentRow) => {
         const rowid = handleGetRowId(row)
         const rowRest = fullAllDataRowIdData[rowid]
         const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
@@ -2252,9 +2253,10 @@ export default defineVxeComponent({
           rowRest.seq = seq
           rowRest._seq = rowNum
           rowRest.treeIndex = index
+          rowRest._index = rowNum
           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 }
+          const rest = { row, rowid, _seq: rowNum, seq, index, $index: -1, _index: rowNum, treeIndex: index, _tIndex: rowNum, items, parent: parentRow, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 }
           fullAllDataRowIdData[rowid] = rest
           fullDataRowIdData[rowid] = rest
         }
@@ -3493,7 +3495,7 @@ export default defineVxeComponent({
       if (reWidth) {
         calcCellWidth()
       }
-      if (reFull) {
+      if (reWidth || reFull) {
         autoCellWidth()
       }
       calcScrollbar()
@@ -3508,7 +3510,7 @@ export default defineVxeComponent({
         if (reWidth) {
           calcCellWidth()
         }
-        if (reFull) {
+        if (reWidth || reFull) {
           autoCellWidth()
         }
         if (reHeight) {
@@ -3606,7 +3608,7 @@ export default defineVxeComponent({
         return
       }
       internalData.rsePending = true
-      handleLazyRecalculate(true, true, true, {
+      handleLazyRecalculate(false, true, true, {
         minRunDelay: 200
       }).then(() => {
         internalData.rsePending = false
@@ -4888,12 +4890,12 @@ export default defineVxeComponent({
         return
       }
       const expandOpts = computeExpandOpts.value
-      const rowOpts = computeRowOpts.value
-      const cellOpts = computeCellOpts.value
-      const defaultRowHeight = computeDefaultRowHeight.value
       const { mode } = expandOpts
       if (expandColumn && mode === 'fixed') {
         const { elemStore, fullAllDataRowIdData } = internalData
+        const rowOpts = computeRowOpts.value
+        const cellOpts = computeCellOpts.value
+        const defaultRowHeight = computeDefaultRowHeight.value
         const rowExpandEl = refRowExpandElem.value
         const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
         if (rowExpandEl && bodyScrollElem) {
@@ -8241,7 +8243,7 @@ export default defineVxeComponent({
         const { isRowGroupStatus, rowGroupList } = reactData
         const { fullColumnFieldData, collectColumn } = internalData
         const { storage, checkMethod } = customOpts
-        const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc } = handleCustomStoreConfig($xeTable)
+        const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable)
 
         const alignData: Record<string, VxeColumnPropTypes.Align> = {}
         const headerAlignData: Record<string, VxeColumnPropTypes.HeaderAlign> = {}
@@ -8254,6 +8256,7 @@ export default defineVxeComponent({
         const aggFuncData: Record<string, VxeColumnPropTypes.AggFunc> = {}
 
         const storeData: VxeTableDefines.CustomStoreData = {
+          pagerData: isCustomPager && $xeGGWrapper && $xeGGWrapper.getCustomPagerData ? $xeGGWrapper.getCustomPagerData() : undefined,
           alignData: undefined,
           headerAlignData: undefined,
           footerAlignData: undefined,
@@ -9090,8 +9093,10 @@ export default defineVxeComponent({
       if (!el || !el.clientWidth) {
         return
       }
+      if (internalData.rsePending) {
+        return
+      }
       handleResizeEvent()
-      $xeTable.updateCellAreas()
     }
 
     const handleTargetEnterEvent = (isClear: boolean) => {
@@ -10232,7 +10237,7 @@ export default defineVxeComponent({
         const tableId = computeTableId.value
         const customOpts = computeCustomOpts.value
         const { updateStore, storage } = customOpts
-        const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc } = handleCustomStoreConfig($xeTable)
+        const { isCustomAlign, isCustomHeaderAlign, isCustomFooterAlign, isCustomResizable, isCustomVisible, isCustomFixed, isCustomSort, isCustomAggGroup, isCustomAggFunc, isCustomPager } = handleCustomStoreConfig($xeTable)
 
         if (type !== 'reset') {
           // fix：修复拖动列宽，重置按钮无法点击的问题
@@ -10249,7 +10254,8 @@ export default defineVxeComponent({
             isCustomFixed ||
             isCustomSort ||
             isCustomAggGroup ||
-            isCustomAggFunc
+            isCustomAggFunc ||
+            isCustomPager
           )
         ) {
           if (!tableId) {
@@ -10258,6 +10264,7 @@ export default defineVxeComponent({
           }
           const storeData: VxeTableDefines.CustomStoreData = type === 'reset'
             ? {
+                pagerData: {},
                 alignData: {},
                 headerAlignData: {},
                 footerAlignData: {},
@@ -11573,6 +11580,7 @@ export default defineVxeComponent({
           status: false
         }
         if (!(el && prevDragRow && dragRow)) {
+          handleRowDragEndClearStatus()
           return Promise.resolve(errRest)
         }
         // 判断是否有拖动
@@ -11681,6 +11689,9 @@ export default defineVxeComponent({
           }
 
           const isDragToChildFlag = isSelfToChildDrag && dragToChildMethod ? dragToChildMethod(dragParams) : prevDragToChild
+          if (dEndMethod) {
+            handleRowDragEndClearStatus()
+          }
           return Promise.resolve(dEndMethod ? dEndMethod(dragParams) : true).then((status) => {
             if (!status) {
               return errRest
@@ -11985,6 +11996,9 @@ export default defineVxeComponent({
             const errRest = {
               status: false
             }
+            if (dragEndMethod) {
+              handleRowDragEndClearStatus()
+            }
             Promise.resolve(dragEndMethod ? dragEndMethod(dragParams) : true).then((status) => {
               if (!status) {
                 if ($oldTable) {
@@ -14657,9 +14671,9 @@ export default defineVxeComponent({
       // if (treeConfig && (treeOpts.showLine || treeOpts.line) && !showOverflow) {
       //   warnLog('vxe.error.reqProp', ['show-overflow'])
       // }
-      if (treeConfig && !treeOpts.transform && props.stripe) {
-        warnLog('vxe.error.noTree', ['stripe'])
-      }
+      // if (treeConfig && !treeOpts.transform && props.stripe) {
+      //   warnLog('vxe.error.noTree', ['stripe'])
+      // }
       if (treeConfig && !treeOpts.transform) {
         if (sortOpts.isDeep) {
           warnLog('vxe.error.reqSupportProp', ['transform=false', 'sort-config.isDeep=false'])

package/packages/table/src/util.ts

@@ -165,6 +165,8 @@ export function createInternalData (): TableInternalData {
     initStatus: false,
     isActivated: false,
 
+    // rceTimeout: undefined,
+    // rceRunTime: undefined,
     rceDelay: 0
 
     // _sToTime: null
@@ -1136,6 +1138,7 @@ export function handleCustomStoreConfig ($xeTable: VxeTableConstructor) {
   const isCustomSort = hangleBolleanDefaultValue(storageOpts.sort, isAllCustom)
   const isCustomAggGroup = hangleBolleanDefaultValue(storageOpts.aggGroup, isAllCustom)
   const isCustomAggFunc = hangleBolleanDefaultValue(storageOpts.aggFunc, isAllCustom)
+  const isCustomPager = hangleBolleanDefaultValue(storageOpts.pager, isAllCustom)
   return {
     isCustomAlign,
     isCustomHeaderAlign,
@@ -1145,6 +1148,7 @@ export function handleCustomStoreConfig ($xeTable: VxeTableConstructor) {
     isCustomFixed,
     isCustomSort,
     isCustomAggGroup,
-    isCustomAggFunc
+    isCustomAggFunc,
+    isCustomPager
   }
 }

package/packages/ui/index.ts

@@ -77,9 +77,11 @@ VxeUI.setConfig({
       defaultPlacement: 'top'
     },
     headerTooltipConfig: {
+      mode: 'tooltip',
       enterable: true
     },
     footerTooltipConfig: {
+      mode: 'tooltip',
       enterable: true
     },
     validConfig: {

package/styles/components/table.scss

@@ -4,6 +4,27 @@
 @use './icon.scss';
 @use './table-module/all.scss';
 
+
+// 局部变量
+.vxe-table {
+  --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-default);
+  &.size--xlarge {
+    --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-xlarge);
+  }
+  &.size--large {
+    --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-large);
+  }
+  &.size--medium {
+    --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-medium);
+  }
+  &.size--small {
+    --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-small);
+  }
+  &.size--mini {
+    --vxe-ui-table-current-font-size: var(--vxe-ui-font-size-mini);
+  }
+}
+
 $btnThemeList: (
   (
     name: "primary",
@@ -1374,7 +1395,7 @@ $btnThemeList: (
 /*table*/
 .vxe-table--render-default {
   position: relative;
-  font-size: var(--vxe-ui-font-size-default);
+  font-size: var(--vxe-ui-table-current-font-size);
   color: var(--vxe-ui-font-color);
   font-family: var(--vxe-ui-font-family);
   direction: ltr;
@@ -1832,7 +1853,6 @@ $btnThemeList: (
   }
   
   &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
     .vxe-table--empty-placeholder,
     .vxe-table--empty-block {
       min-height: var(--vxe-ui-table-row-height-medium);
@@ -1866,7 +1886,6 @@ $btnThemeList: (
     }
   }
   &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
     .vxe-table--empty-placeholder,
     .vxe-table--empty-block {
       min-height: var(--vxe-ui-table-row-height-small);
@@ -1900,7 +1919,6 @@ $btnThemeList: (
     }
   }
   &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
     .vxe-table--empty-placeholder,
     .vxe-table--empty-block {
       min-height: var(--vxe-ui-table-row-height-mini);
@@ -2447,7 +2465,7 @@ $btnThemeList: (
       width: 100%;
       position: absolute;
       left: 50%;
-      font-size: var(--vxe-ui-table-validate-error-font-size);
+      font-size: var(--vxe-ui-table-validate-error-font-size, var(--vxe-ui-table-current-font-size));
       line-height: 1em;
       transform: translate(-50%, -2px);
       text-align: left;
@@ -2473,7 +2491,7 @@ $btnThemeList: (
       // }
     }
     .vxe-cell--valid-error-theme-beautify {
-      padding: 0.2em 0.6em 0.25em 0.6em;
+      padding: var(--vxe-ui-table-validate-error-padding, 0.2em 0.6em);
       color: #fff;
       background-color: var(--vxe-ui-table-validate-error-color);
       .vxe-cell--valid-error-msg {

package/styles/theme/base.scss

@@ -91,7 +91,6 @@
   --vxe-ui-table-view-scrollbar-width: 18px;
   --vxe-ui-table-view-scrollbar-height: 18px;
 
-  --vxe-ui-table-validate-error-font-size: 12px;
   --vxe-ui-table-validate-error-color: #f56c6c;
   --vxe-ui-table-validate-error-cell-background-color: rgba(245, 108,108, 0.1);
   --vxe-ui-table-validate-error-theme-normal-background-color: var(--vxe-ui-layout-background-color);