vxe-table 4.18.0 → 4.18.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.18.0",
+  "version": "4.18.2",
   "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",

package/packages/table/src/body.ts

@@ -43,8 +43,9 @@ export default defineVxeComponent({
     // 滚动、拖动过程中不需要触发
     const isVMScrollProcess = () => {
       const { delayHover } = tableProps
-      const { lastScrollTime, isDragResize } = tableReactData
-      return !!(isDragResize || (lastScrollTime && Date.now() < lastScrollTime + (delayHover as number)))
+      const { isDragResize } = tableReactData
+      const { lastSTime } = tableInternalData
+      return !!(isDragResize || (lastSTime && Date.now() < lastSTime + (delayHover as number)))
     }
 
     const renderLine = (rowid: string, params: VxeTableDefines.CellRenderBodyParams, cellHeight: number): VxeComponentSlotType[] => {

package/packages/table/src/column.ts

@@ -131,7 +131,7 @@ export const columnProps = {
   contentRender: Object as PropType<VxeColumnPropTypes.ContentRender>,
 
   // 聚合函数
-  aggFunc: [String, Boolean] as PropType<VxeColumnPropTypes.AggFunc>,
+  aggFunc: [Boolean, String] as PropType<VxeColumnPropTypes.AggFunc>,
   // 将单元格复制到剪贴板
   copyMethod: Function as PropType<VxeColumnPropTypes.CopyMethod>,
   // 将剪贴单元格的值清除

package/packages/table/src/group.ts

@@ -42,9 +42,10 @@ export default defineVxeComponent({
     })
 
     const renderVN = () => {
+      const defaultSlot = slots.default
       return h('div', {
         ref: refElem
-      }, slots.default ? slots.default() : [])
+      }, defaultSlot ? defaultSlot() : [])
     }
 
     const $xeColgroup = { columnConfig } as XEColumnInstance

package/packages/table/src/table.ts

@@ -30,7 +30,7 @@ import '../module/validator/hook'
 import '../module/custom/hook'
 import '../render'
 
-import type { VxeTooltipInstance, VxeTabsConstructor, VxeTabsPrivateMethods, ValueOf, VxeComponentSlotType } from 'vxe-pc-ui'
+import type { VxeTooltipInstance, VxeTabsConstructor, VxeTabsPrivateMethods, ValueOf, VxeComponentSlotType, VxeComponentStyleType } from 'vxe-pc-ui'
 import type { VxeGridConstructor, VxeGridPrivateMethods, VxeTableConstructor, VxeTablePropTypes, VxeToolbarConstructor, TablePrivateMethods, VxeTablePrivateRef, VxeTablePrivateComputed, VxeTablePrivateMethods, TableMethods, VxeTableMethods, VxeTableDefines, VxeTableEmits, VxeTableProps, VxeColumnPropTypes, VxeTableCustomPanelConstructor } from '../../../types'
 
 const { getConfig, getIcon, getI18n, renderer, formats, createEvent, globalResize, interceptor, hooks, globalEvents, GLOBAL_EVENT_KEYS, useFns, renderEmptyElement } = VxeUI
@@ -615,6 +615,19 @@ export default defineVxeComponent({
       return ''
     })
 
+    const computeTableStyle = computed(() => {
+      const scrollbarOpts = computeScrollbarOpts.value
+      const { width, height } = scrollbarOpts
+      const tStys: VxeComponentStyleType = {}
+      if (width) {
+        tStys['--vxe-ui-table-view-scrollbar-width'] = toCssUnit(width)
+      }
+      if (height) {
+        tStys['--vxe-ui-table-view-scrollbar-height'] = toCssUnit(height)
+      }
+      return tStys
+    })
+
     const computeTableRowExpandedList = computed(() => {
       const { tableData, rowExpandedFlag, expandColumn, rowGroupExpandedFlag, treeExpandedFlag } = reactData
       const { visibleDataRowIdData, rowExpandedMaps } = internalData
@@ -3755,7 +3768,7 @@ export default defineVxeComponent({
           if (reactData.expandColumn && expandOpts.mode !== 'fixed') {
             errLog('vxe.error.notConflictProp', ['column.type="expand', 'expand-config.mode="fixed"'])
           }
-          if (virtualYOpts.mode === 'scroll' && expandOpts.mode === 'fixed') {
+          if (virtualYOpts.mode === 'scroll' && reactData.expandColumn && expandOpts.mode === 'fixed') {
             warnLog('vxe.error.notConflictProp', ['virtual-y-config.mode=scroll', 'expand-config.mode=inside'])
           }
           // if (showOverflow) {
@@ -4462,7 +4475,7 @@ export default defineVxeComponent({
       return Promise.all([
         xRest,
         yRest,
-        $xeTable.updateCellAreas()
+        scrollXLoad || scrollYLoad ? $xeTable.updateCellAreas() : null
       ])
     }
 
@@ -5288,7 +5301,7 @@ export default defineVxeComponent({
               const tcFormatMethod = gFormatOpts ? (gFormatOpts.tableCellFormatMethod || gFormatOpts.cellFormatMethod) : null
               cellLabel = tcFormatMethod ? tcFormatMethod(formatParams, ...formatter.slice(1)) : ''
             } else {
-              cellLabel = `${formatter(formatParams)}`
+              cellLabel = formatter(formatParams)
             }
           } else if (renderOpts && tcFormatter) {
             cellLabel = tcFormatter(renderOpts, formatParams)
@@ -7299,14 +7312,18 @@ export default defineVxeComponent({
           setScrollLeft(bodyScrollElem, scrollLeft)
           setScrollLeft(headerScrollElem, scrollLeft)
           setScrollLeft(footerScrollElem, scrollLeft)
-          loadScrollXData()
+          if (reactData.scrollXLoad) {
+            loadScrollXData()
+          }
         }
         if (XEUtils.isNumber(scrollTop)) {
           setScrollTop(yHandleEl, scrollTop)
           setScrollTop(bodyScrollElem, scrollTop)
           setScrollTop(leftScrollElem, scrollTop)
           setScrollTop(rightScrollElem, scrollTop)
-          loadScrollYData()
+          if (reactData.scrollYLoad) {
+            loadScrollYData()
+          }
         }
         return new Promise<void>(resolve => {
           setTimeout(() => {
@@ -10184,6 +10201,7 @@ export default defineVxeComponent({
         if (!checkMethod || checkMethod({ $table: $xeTable, row })) {
           let newValue = row
           let isChange = oldValue !== newValue
+          const selected = !isChange
           if (isChange) {
             handleCheckedRadioRow(newValue)
           } else if (!strict) {
@@ -10194,7 +10212,7 @@ export default defineVxeComponent({
             }
           }
           if (isChange) {
-            dispatchEvent('radio-change', { oldValue, newValue, ...params }, evnt)
+            dispatchEvent('radio-change', { oldValue, newValue, selected, ...params }, evnt)
           }
         }
       },
@@ -10203,7 +10221,7 @@ export default defineVxeComponent({
         const columnOpts = computeColumnOpts.value
         const currentColumnOpts = computeCurrentColumnOpts.value
         const beforeRowMethod = currentColumnOpts.beforeSelectMethod || columnOpts.currentMethod as any
-        const { column: newValue } = params
+        let { column: newValue } = params
         const { trigger, strict } = currentColumnOpts
         if (trigger === 'manual') {
           return
@@ -10214,15 +10232,16 @@ export default defineVxeComponent({
           if (strict) {
             $xeTable.setCurrentColumn(newValue)
           } else {
-            isChange = true
-            if (selected) {
+            isChange = oldValue === newValue
+            if (isChange) {
+              newValue = null as any
               $xeTable.clearCurrentColumn()
             } else {
               $xeTable.setCurrentColumn(newValue)
             }
           }
           if (isChange) {
-            dispatchEvent('current-column-change', { oldValue, newValue, ...params }, evnt)
+            dispatchEvent('current-column-change', { oldValue, newValue, selected, ...params }, evnt)
           }
         } else {
           dispatchEvent('current-column-disabled', params, evnt)
@@ -10233,7 +10252,7 @@ export default defineVxeComponent({
         const rowOpts = computeRowOpts.value
         const currentRowOpts = computeCurrentRowOpts.value
         const beforeRowMethod = currentRowOpts.beforeSelectMethod || rowOpts.currentMethod as any
-        const { row: newValue } = params
+        let { row: newValue } = params
         const { trigger, strict } = currentRowOpts
         if (trigger === 'manual') {
           return
@@ -10244,17 +10263,18 @@ export default defineVxeComponent({
           if (strict) {
             $xeTable.setCurrentRow(newValue)
           } else {
-            isChange = true
-            if (selected) {
+            isChange = oldValue === newValue
+            if (isChange) {
+              newValue = null
               $xeTable.clearCurrentRow()
             } else {
               $xeTable.setCurrentRow(newValue)
             }
           }
           if (isChange) {
-            dispatchEvent('current-row-change', { oldValue, newValue, ...params }, evnt)
+            dispatchEvent('current-row-change', { oldValue, newValue, selected, ...params }, evnt)
             // 已废弃
-            dispatchEvent('current-change', { oldValue, newValue, ...params }, evnt)
+            dispatchEvent('current-change', { oldValue, newValue, selected, ...params }, evnt)
           }
         } else {
           dispatchEvent('current-row-disabled', params, evnt)
@@ -11622,7 +11642,7 @@ export default defineVxeComponent({
           }
           internalData.lastScrollTop = scrollTop
         }
-        reactData.lastScrollTime = Date.now()
+        internalData.lastSTime = Date.now()
         const evntParams = {
           source: sourceType,
           scrollTop,
@@ -11867,7 +11887,7 @@ export default defineVxeComponent({
           return
         }
 
-        const wheelSpeed = getWheelSpeed(reactData.lastScrollTime)
+        const wheelSpeed = getWheelSpeed(internalData.lastSTime)
         const deltaTop = shiftKey ? 0 : (deltaY * wheelSpeed)
         const deltaLeft = (shiftKey ? (deltaX || deltaY) : deltaX) * wheelSpeed
 
@@ -12870,6 +12890,7 @@ export default defineVxeComponent({
         footer: slots.footerTooltip || slots['footer-tooltip']
       }
       const currTooltipSlot = tooltipStore.visible && tooltipStore.type ? tipSlots[tooltipStore.type] : null
+      const tableStyle = computeTableStyle.value
       const rowDragOpts = computeRowDragOpts.value
       const tableTipConfig = computeTableTipConfig.value
       const validTipConfig = computeValidTipConfig.value
@@ -12941,6 +12962,7 @@ export default defineVxeComponent({
           'is--virtual-x': scrollXLoad,
           'is--virtual-y': scrollYLoad
         }],
+        style: tableStyle,
         spellcheck: false,
         ...tbOns
       }, [

package/packages/table/src/util.ts

@@ -137,6 +137,8 @@ export function createInternalData (): TableInternalData {
     teleportToWrapperElem: null,
     popupToWrapperElem: null,
 
+    lastSTime: 0,
+
     inited: false,
     tooltipTimeout: null,
     initStatus: false,
@@ -167,8 +169,6 @@ export function createReactData (): TableReactData {
     scrollbarWidth: 0,
     // 横向滚动条的高度
     scrollbarHeight: 0,
-    // 最后滚动时间戳
-    lastScrollTime: 0,
     // 行高
     rowHeight: 0,
     // 表格父容器的高度

package/styles/components/table.scss

@@ -912,7 +912,7 @@ $btnThemeList: (
   .vxe-table--scroll-x-handle {
     overflow-y: hidden;
     overflow-x: scroll;
-    height: 18px;
+    height: var(--vxe-ui-table-view-scrollbar-height);
   }
   .vxe-table--scroll-y-handle,
   .vxe-table--scroll-y-wrapper {
@@ -924,7 +924,7 @@ $btnThemeList: (
   .vxe-table--scroll-y-handle {
     overflow-y: scroll;
     overflow-x: hidden;
-    width: 18px;
+    width: var(--vxe-ui-table-view-scrollbar-width);
     height: 100%;
   }
   .vxe-table--scroll-x-space {

package/styles/theme/base.scss

@@ -78,6 +78,9 @@
 
   --vxe-ui-table-menu-item-width: 198px;
 
+  --vxe-ui-table-view-scrollbar-width: 18px;
+  --vxe-ui-table-view-scrollbar-height: 18px;
+
   --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);