vxe-table 4.22.4 → 4.23.0-beta.1

package/packages/table/module/custom/panel.ts

@@ -1,7 +1,7 @@
 import { h, inject, ref, Ref, provide, VNode, PropType, nextTick, TransitionGroup, reactive, onUnmounted } from 'vue'
 import { defineVxeComponent } from '../../../ui/src/comp'
 import { VxeUI } from '../../../ui'
-import { formatText } from '../../../ui/src/utils'
+import { formatText, hasEnableConf } from '../../../ui/src/utils'
 import { getTpImg, addClass, removeClass, hasControlKey } from '../../../ui/src/dom'
 import { createComponentLog } from '../../../ui/src/log'
 import XEUtils from 'xe-utils'
@@ -45,7 +45,7 @@ export default defineVxeComponent({
     const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods)
 
     const { props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable
-    const { computeSize, computeCustomOpts, computeColumnDragOpts, computeColumnOpts, computeIsMaxFixedColumn, computeResizableOpts, computeAggregateOpts } = $xeTable.getComputeMaps()
+    const { computeSize, computeCustomOpts, computeMouseOpts, computeColumnDragOpts, computeColumnOpts, computeIsMaxFixedColumn, computeResizableOpts, computeAggregateOpts } = $xeTable.getComputeMaps()
 
     const refElem = ref() as Ref<HTMLDivElement>
     const refBodyWrapperElem = ref() as Ref<HTMLDivElement>
@@ -368,6 +368,7 @@ export default defineVxeComponent({
       const { customColumnList } = tableReactData
       const { collectColumn } = tableInternalData
       const customOpts = computeCustomOpts.value
+      const mouseOpts = computeMouseOpts.value
       const { immediate } = customOpts
       const trEl = evnt.currentTarget as HTMLElement
       const columnDragOpts = computeColumnDragOpts.value
@@ -520,7 +521,7 @@ export default defineVxeComponent({
               customColumnList.splice(nafIndex + dragOffsetIndex, 0, dragColumn)
             }
 
-            if (mouseConfig) {
+            if (hasEnableConf(mouseConfig, mouseOpts)) {
               if ($xeTable.clearSelected) {
                 $xeTable.clearSelected()
               }

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

@@ -1,7 +1,7 @@
 import { reactive, nextTick } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../../ui'
-import { isEnableConf } from '../../../ui/src/utils'
+import { hasEnableConf, isEnableConf } from '../../../ui/src/utils'
 import { getCellValue, setCellValue, getRowid } from '../../src/util'
 import { removeClass, addClass } from '../../../ui/src/dom'
 import { createComponentLog } from '../../../ui/src/log'
@@ -410,6 +410,7 @@ hooks.add('tableEditModule', {
       const { editConfig, mouseConfig } = props
       const { editStore, tableColumn } = reactData
       const editOpts = computeEditOpts.value
+      const mouseOpts = computeMouseOpts.value
       const { mode } = editOpts
       const { actived, focused } = editStore
       const { row, column } = params
@@ -425,7 +426,7 @@ hooks.add('tableEditModule', {
             // 判断是否禁用编辑
             let type: 'edit-disabled' | 'edit-activated' = 'edit-disabled'
             if (!beforeEditMethod || beforeEditMethod({ ...editParams, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt })) {
-              if (mouseConfig) {
+              if (hasEnableConf(mouseConfig, mouseOpts)) {
                 $xeTable.clearSelected()
                 if ($xeTable.clearCellAreas) {
                   $xeTable.clearCellAreas()
@@ -482,7 +483,7 @@ hooks.add('tableEditModule', {
             }
           } else {
             const { column: oldColumn } = actived
-            if (mouseConfig) {
+            if (hasEnableConf(mouseConfig, mouseOpts)) {
               $xeTable.clearSelected()
               if ($xeTable.clearCellAreas) {
                 $xeTable.clearCellAreas()
@@ -1067,7 +1068,7 @@ hooks.add('tableEditModule', {
         const editOpts = computeEditOpts.value
         const { actived, selected } = editStore
         const { row, column } = params
-        const isMouseSelected = mouseConfig && mouseOpts.selected
+        const isMouseSelected = hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.selected
         const selectMethod = () => {
           if (isMouseSelected && (selected.row !== row || selected.column !== column)) {
             if (actived.row !== row || (editOpts.mode === 'cell' ? actived.column !== column : false)) {

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

@@ -2,7 +2,7 @@ import { nextTick } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../../ui'
 import { isColumnInfo, getCellValue, createHandleGetRowId } from '../../src/util'
-import { parseFile, formatText, eqEmptyValue } from '../../../ui/src/utils'
+import { parseFile, formatText, eqEmptyValue, hasEnableConf } from '../../../ui/src/utils'
 import { hasClass, toCssUnit } from '../../../ui/src/dom'
 import { createHtmlPage, getExportBlobByContent } from './util'
 import { createComponentLog } from '../../../ui/src/log'
@@ -1985,7 +1985,7 @@ hooks.add('tableExportModule', {
           }
           return
         }
-        if (!importConfig) {
+        if (!hasEnableConf(importConfig, importOpts)) {
           errLog('vxe.error.reqProp', ['import-config'])
         }
         // 处理类型
@@ -2023,23 +2023,25 @@ hooks.add('tableExportModule', {
       },
       closeExport: handleCloseExport,
       openExport (options) {
+        const { exportConfig } = props
         const exportOpts = computeExportOpts.value
         const defOpts = Object.assign({
           message: true,
           types: XEUtils.keys(exportOpts._typeMaps)
         }, exportOpts, options)
-        if (!props.exportConfig) {
+        if (!hasEnableConf(exportConfig, exportOpts)) {
           errLog('vxe.error.reqProp', ['export-config'])
         }
         return handleExportAndPrint(defOpts)
       },
       closePrint: handleCloseExport,
       openPrint (options) {
+        const { printConfig } = props
         const printOpts = computePrintOpts.value
         const defOpts = Object.assign({
           message: true
         }, printOpts, options)
-        if (!props.printConfig) {
+        if (!hasEnableConf(printConfig, printOpts)) {
           errLog('vxe.error.reqProp', ['print-config'])
         }
         return handleExportAndPrint(defOpts, true)

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

@@ -3,7 +3,7 @@ import XEUtils from 'xe-utils'
 import { VxeUI } from '../../../ui'
 import { toFilters, handleFieldOrColumn, getRefElem } from '../../src/util'
 import { toCssUnit, triggerEvent, updatePanelPlacement } from '../../../ui/src/dom'
-import { isEnableConf } from '../../../ui/src/utils'
+import { hasEnableConf, isEnableConf } from '../../../ui/src/utils'
 
 import type { TableFilterMethods, TableFilterPrivateMethods, VxeTableDefines } from '../../../../types'
 
@@ -208,7 +208,7 @@ hooks.add('tableFilterModule', {
           $xeTable.handleTableData(true)
           $xeTable.checkSelectionStatus()
         }
-        if (mouseConfig && mouseOpts.area && $xeTable.handleFilterEvent) {
+        if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area && $xeTable.handleFilterEvent) {
           $xeTable.handleFilterEvent(evnt as Event, params)
         }
         if (evnt) {

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

@@ -2,6 +2,7 @@ import XEUtils from 'xe-utils'
 import { VxeUI } from '../../../ui'
 import { getRefElem } from '../../src/util'
 import { getAbsolutePos, addClass, removeClass, hasControlKey } from '../../../ui/src/dom'
+import { hasEnableConf } from '../../../ui/src/utils'
 
 import type { TableKeyboardPrivateMethods, VxeTableDefines } from '../../../../types'
 
@@ -244,13 +245,13 @@ hooks.add('tableKeyboardModule', {
       const checkboxOpts = computeCheckboxOpts.value
       const mouseOpts = computeMouseOpts.value
       const editOpts = computeEditOpts.value
-      if (mouseConfig && mouseOpts.area && $xeTable.triggerClAreaMnEvent) {
-        return $xeTable.triggerClAreaMnEvent(evnt, params)
+      if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area && $xeTable.triggerClAaMnEvent) {
+        return $xeTable.triggerClAaMnEvent(evnt, params)
       } else {
         if (checkboxConfig && checkboxOpts.range) {
           handleCheckboxRangeEvent(evnt, params)
         }
-        if (mouseConfig && mouseOpts.selected) {
+        if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.selected) {
           if (!editConfig || editOpts.mode === 'cell') {
             $xeTable.handleSelected(params, evnt)
           }

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

@@ -2,7 +2,7 @@ import { nextTick } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../../ui'
 import { getDomNode, getAbsolutePos, getEventTargetNode, toCssUnit } from '../../../ui/src/dom'
-import { isEnableConf, hasChildrenList } from '../../../ui/src/utils'
+import { isEnableConf, hasChildrenList, hasEnableConf } from '../../../ui/src/utils'
 
 import type { VxeComponentStyleType } from 'vxe-pc-ui'
 import type { TableMenuMethods, TableMenuPrivateMethods } from '../../../../types'
@@ -190,7 +190,7 @@ hooks.add('tableMenuModule', {
             const type = 'body'
             const params: any = { source: 'table', type, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt, keyboard: true, columns: visibleColumn.slice(0), $event: evnt }
             // 如果开启单元格区域
-            if (mouseConfig && mouseOpts.area) {
+            if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area) {
               const activeArea = $xeTable.getActiveCellArea()
               if (activeArea && activeArea.row && activeArea.column) {
                 params.row = activeArea.row
@@ -198,7 +198,7 @@ hooks.add('tableMenuModule', {
                 handleOpenMenuEvent(evnt, type, params)
                 return
               }
-            } else if (mouseConfig && mouseOpts.selected) {
+            } else if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.selected) {
               // 如果启用键盘导航且已选中单元格
               if (selected.row && selected.column) {
                 params.row = selected.row

package/packages/table/render/index.ts

@@ -2,7 +2,7 @@ import { h, VNode, resolveComponent, ComponentOptions } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { getCellValue, setCellValue } from '../../table/src/util'
-import { getFuncText, formatText, isEmptyValue } from '../../ui/src/utils'
+import { getFuncText, formatText, isEmptyValue, hasEnableConf } from '../../ui/src/utils'
 import { getOnName, getModelEvent, getChangeEvent, hasInputType } from '../../ui/src/vn'
 import { createComponentLog } from '../../ui/src/log'
 
@@ -907,9 +907,11 @@ function getNativeInputRenderCellVNs (cellValue: any, labelVNs: VNode[], renderO
   const { name } = renderOpts
   const tableProps = $table.props
   const { editConfig, mouseConfig } = tableProps
+  const { computeMouseOpts } = $table.getComputeMaps()
+  const mouseOpts = computeMouseOpts.value
   let isColSelected = false
   let isActiveCellArea = false
-  if (editConfig && mouseConfig) {
+  if (editConfig && hasEnableConf(mouseConfig, mouseOpts)) {
     const tableReactData = $table.reactData
     const { editStore } = tableReactData
     const { selected } = editStore
@@ -940,12 +942,13 @@ function getInputRenderCellVNs (cellValue: any, labelVNs: VNode[], renderOpts: V
   const { $table, row, column } = renderParams
   const tableProps = $table.props
   const { editConfig, mouseConfig } = tableProps
+  const { computeEditOpts, computeMouseOpts } = $table.getComputeMaps()
+  const mouseOpts = computeMouseOpts.value
   let isColSelected = false
   let isActiveCellArea = false
-  if (editConfig && mouseConfig) {
+  if (editConfig && hasEnableConf(mouseConfig, mouseOpts)) {
     const tableReactData = $table.reactData
     const { editStore } = tableReactData
-    const { computeEditOpts } = $table.getComputeMaps()
     const editOpts = computeEditOpts.value
     if (editOpts.isReuseKeep) {
       const { selected } = editStore

package/packages/table/src/body.ts

@@ -4,7 +4,7 @@ import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { getRowid, createHandleGetRowId, getCellRestHeight } from './util'
 import { updateCellTitle, getPropClass } from '../../ui/src/dom'
-import { isEnableConf, getDefaultConfig } from '../../ui/src/utils'
+import { isEnableConf, getDefaultConfig, hasEnableConf } from '../../ui/src/utils'
 import { getSlotVNs } from '../../ui/src/vn'
 
 import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableDefines, VxeComponentSlotType } from '../../../types'
@@ -243,7 +243,7 @@ export default defineVxeComponent({
         }
       }
       // 按下事件处理
-      if (isRowDragCell || checkboxOpts.range || mouseConfig) {
+      if (isRowDragCell || checkboxOpts.range || hasEnableConf(mouseConfig, mouseOpts)) {
         tdOns.onMousedown = (evnt: MouseEvent) => {
           $xeTable.triggerCellMousedownEvent(evnt, cellParams)
         }
@@ -434,7 +434,7 @@ export default defineVxeComponent({
       }
 
       let showAreaRowStatus = false
-      if (mouseConfig && mouseOpts.area && !_columnIndex && selectCellToRow) {
+      if (hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area && !_columnIndex && selectCellToRow) {
         showAreaRowStatus = true
       }
 
@@ -900,7 +900,7 @@ export default defineVxeComponent({
           h('div', {
             class: 'vxe-table--checkbox-range'
           }),
-          mouseConfig && mouseOpts.area
+          hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area
             ? h('div', {
               class: 'vxe-table--cell-area',
               xid: xID

package/packages/table/src/header.ts

@@ -2,7 +2,7 @@ import { h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted
 import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
-import { getDefaultConfig, isEnableConf } from '../../ui/src/utils'
+import { getDefaultConfig, hasEnableConf, isEnableConf } from '../../ui/src/utils'
 import { getCalcHeight, convertHeaderColumnToRows, convertHeaderToGridRows } from './util'
 import { getSlotVNs } from '../../ui/src/vn'
 
@@ -74,6 +74,7 @@ export default defineVxeComponent({
       const defaultRowHeight = computeDefaultRowHeight.value
       const headerCellOpts = computeHeaderCellOpts.value
       const rendererOpts = computeRendererOpts.value
+      const mouseOpts = computeMouseOpts.value
       const currCellHeight = getCalcHeight(headerCellOpts.height) || defaultRowHeight
       const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = columnDragOpts
       const isLastRow = _rowIndex === headerGroups.length - 1
@@ -165,7 +166,7 @@ export default defineVxeComponent({
           isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams))
         }
         // 按下事件处理
-        if (mouseConfig || isColDragCell) {
+        if (hasEnableConf(mouseConfig, mouseOpts) || isColDragCell) {
           thOns.onMousedown = (evnt: MouseEvent) => $xeTable.triggerHeaderCellMousedownEvent(evnt, cellParams)
         }
         // 拖拽列事件
@@ -513,7 +514,7 @@ export default defineVxeComponent({
               ref: refHeaderTHead
             }, renderHeads(isGroup, isOptimizeMode, renderHeaderList, renderColumnList))
           ]),
-          mouseConfig && mouseOpts.area
+          hasEnableConf(mouseConfig, mouseOpts) && mouseOpts.area
             ? h('div', {
               class: 'vxe-table--cell-area',
               xid: xID

package/packages/table/src/props.ts

@@ -305,6 +305,10 @@ export const tableProps = {
   virtualXConfig: Object as PropType<VxeTablePropTypes.VirtualXConfig>,
   // 纵向虚拟滚动配置项
   virtualYConfig: Object as PropType<VxeTablePropTypes.VirtualYConfig>,
+  useScrollbar: {
+    type: Boolean as PropType<VxeTablePropTypes.UseScrollbar>,
+    default: () => getConfig().table.useScrollbar
+  },
   // 滚动条配置项
   scrollbarConfig: Object as PropType<VxeTablePropTypes.ScrollbarConfig>,
   // 撤销/恢复历史配置项