vxe-table 4.15.0-beta.1 → 4.15.0-beta.11

package/packages/table/src/footer.ts

@@ -68,8 +68,7 @@ export default defineVxeComponent({
         const renderOpts = editRender || cellRender
         const compConf = renderOpts ? renderer.get(renderOpts.name) : null
         const showAllTip = tooltipOpts.showAll
-        const isColGroup = column.children && column.children.length
-        const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX
+        const fixedHiddenColumn = overflowX && (fixedType ? column.fixed !== fixedType : !!column.fixed)
         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
@@ -159,7 +158,7 @@ export default defineVxeComponent({
         const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
 
         let isVNPreEmptyStatus = false
-        if (isOptimizeMode && !isMergeCell) {
+        if (isOptimizeMode && overflowX && !isMergeCell) {
           if (scrollXLoad && !column.fixed && !virtualXOpts.immediate && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
             isVNPreEmptyStatus = true
           }

package/packages/table/src/header.ts

@@ -66,7 +66,7 @@ export default defineVxeComponent({
         const renderOpts = editRender || cellRender
         const compConf = renderOpts ? renderer.get(renderOpts.name) : null
         const isColGroup = column.children && column.children.length
-        const fixedHiddenColumn = fixedType ? (column.fixed !== fixedType && !isColGroup) : !!column.fixed && overflowX
+        const fixedHiddenColumn = overflowX && !isColGroup && (fixedType ? column.fixed !== fixedType : !!column.fixed)
         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
@@ -130,7 +130,7 @@ export default defineVxeComponent({
         const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
 
         let isVNPreEmptyStatus = false
-        if (isOptimizeMode && !isGroup) {
+        if (isOptimizeMode && overflowX && !isGroup) {
           if (!dragCol || dragCol.id !== colid) {
             if (scrollXLoad && !column.fixed && !virtualXOpts.immediate && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
               isVNPreEmptyStatus = true

package/packages/table/src/table.ts

@@ -1443,16 +1443,23 @@ export default defineVxeComponent({
     }
 
     const handleSortEvent = (evnt: Event | null, sortConfs: VxeTableDefines.SortConfs | VxeTableDefines.SortConfs[], isUpdate?: boolean) => {
+      const { tableFullColumn } = internalData
       const sortOpts = computeSortOpts.value
       const { multiple, remote, orders } = sortOpts
       if (!XEUtils.isArray(sortConfs)) {
         sortConfs = [sortConfs]
       }
       if (sortConfs && sortConfs.length) {
+        const orderActiveMaps: Record<string, VxeTableDefines.ColumnInfo> = {}
         if (!multiple) {
           sortConfs = [sortConfs[0]]
-          clearAllSort()
+          tableFullColumn.forEach((column) => {
+            if (column.order) {
+              orderActiveMaps[column.id] = column
+            }
+          })
         }
+        const sortColMpps: Record<string, VxeTableDefines.ColumnInfo> = {}
         let firstColumn: any = null
         sortConfs.forEach((confs: any, index: number) => {
           let { field, order } = confs
@@ -1471,8 +1478,16 @@ export default defineVxeComponent({
               column.order = order
             }
             column.sortTime = Date.now() + index
+            sortColMpps[column.id] = column
           }
         })
+        if (!multiple) {
+          XEUtils.each(orderActiveMaps, (oaCol: VxeTableDefines.ColumnInfo, oaId) => {
+            if (!sortColMpps[oaId]) {
+              oaCol.order = null
+            }
+          })
+        }
         if (isUpdate) {
           if (!remote) {
             $xeTable.handleTableData(true)
@@ -2907,19 +2922,17 @@ export default defineVxeComponent({
     const handleDefaultTreeExpand = () => {
       const { treeConfig } = props
       if (treeConfig) {
-        const { tableFullData } = internalData
+        const { fullAllDataRowIdData } = internalData
         const treeOpts = computeTreeOpts.value
         const { expandAll, expandRowKeys } = treeOpts
-        const childrenField = treeOpts.children || treeOpts.childrenField
         if (expandAll) {
           $xeTable.setAllTreeExpand(true)
         } else if (expandRowKeys) {
           const defExpandeds: any[] = []
-          const rowkey = getRowkey($xeTable)
-          expandRowKeys.forEach((rowid: any) => {
-            const matchObj = XEUtils.findTree(tableFullData, item => rowid === XEUtils.get(item, rowkey), { children: childrenField })
-            if (matchObj) {
-              defExpandeds.push(matchObj.item)
+          expandRowKeys.forEach((rowid) => {
+            const rowRest = fullAllDataRowIdData[rowid]
+            if (rowRest) {
+              defExpandeds.push(rowRest.row)
             }
           })
           $xeTable.setTreeExpand(defExpandeds, true)
@@ -3525,6 +3538,13 @@ export default defineVxeComponent({
               }
               reactData.isRowLoading = false
               handleRecalculateStyle(false, false, false)
+              // 如果是自动行高，特殊情况需调用 recalculate 手动刷新
+              if (!props.showOverflow) {
+                setTimeout(() => {
+                  handleLazyRecalculate(false, true, true)
+                  setTimeout(() => handleLazyRecalculate(false, true, true), 3000)
+                }, 2000)
+              }
               // 是否变更虚拟滚动
               if (oldScrollYLoad === sYLoad) {
                 restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop)
@@ -3557,6 +3577,7 @@ export default defineVxeComponent({
       handleDefaultRadioChecked()
       handleDefaultRowExpand()
       handleDefaultTreeExpand()
+      handleDefaultRowGroupExpand()
       handleDefaultMergeCells()
       handleDefaultMergeFooterItems()
       nextTick(() => setTimeout(() => $xeTable.recalculate()))
@@ -3980,6 +4001,22 @@ export default defineVxeComponent({
       })
     }
 
+    /**
+     * 处理默认展开分组行
+     */
+    const handleDefaultRowGroupExpand = () => {
+      const { isRowGroupStatus } = reactData
+      if (isRowGroupStatus) {
+        const aggregateOpts = computeAggregateOpts.value
+        const { expandAll, expandGroupFields } = aggregateOpts
+        if (expandAll) {
+          $xeTable.setAllRowGroupExpand(true)
+        } else if (expandGroupFields && expandGroupFields.length) {
+          $xeTable.setRowGroupExpandByField(expandGroupFields, true)
+        }
+      }
+    }
+
     const handleCheckAllEvent = (evnt: Event | null, value: any) => {
       handleCheckedAllCheckboxRow(value)
       if (evnt) {
@@ -5933,11 +5970,10 @@ export default defineVxeComponent({
         return nextTick()
       },
       setSort (sortConfs, isUpdate) {
-        // 已废弃，即将去掉事件触发 new Event('click') -> null
-        return handleSortEvent(new Event('click'), sortConfs, isUpdate)
+        return handleSortEvent(null, sortConfs, isUpdate)
       },
-      setSortByEvent (evnt, sortConfs, isUpdate) {
-        return handleSortEvent(evnt, sortConfs, isUpdate)
+      setSortByEvent (evnt, sortConfs) {
+        return handleSortEvent(evnt, sortConfs, true)
       },
       /**
        * 清空指定列的排序条件
@@ -5965,6 +6001,7 @@ export default defineVxeComponent({
       clearSortByEvent (evnt, fieldOrColumn) {
         const { tableFullColumn } = internalData
         const sortOpts = computeSortOpts.value
+        const { multiple } = sortOpts
         const sortCols: VxeTableDefines.ColumnInfo[] = []
         let column: VxeTableDefines.ColumnInfo<any> | null = null
         if (evnt) {
@@ -5984,11 +6021,18 @@ export default defineVxeComponent({
           if (!sortOpts.remote) {
             $xeTable.handleTableData(true)
           }
-          if (sortCols.length) {
+
+          if (!multiple) {
+            column = sortCols[0]
+          }
+
+          if (column) {
+            $xeTable.handleColumnSortEvent(evnt, column)
+          }
+
+          if (multiple && sortCols.length) {
             const params = { $table: $xeTable, $event: evnt, cols: sortCols, sortList: [] }
             dispatchEvent('clear-all-sort', params, evnt)
-          } else if (column) {
-            $xeTable.handleColumnSortEvent(evnt, column)
           }
         }
         return nextTick().then(() => {
@@ -6019,13 +6063,11 @@ export default defineVxeComponent({
         }
         return sortList
       },
-      setFilterByEvent (evnt, fieldOrColumn, options, isUpdate) {
+      setFilterByEvent (evnt, fieldOrColumn, options) {
         const column = handleFieldOrColumn($xeTable, fieldOrColumn)
         if (column && column.filters) {
           column.filters = toFilters(options || [])
-          if (isUpdate) {
-            return $xeTable.handleColumnConfirmFilter(column, evnt)
-          }
+          return $xeTable.handleColumnConfirmFilter(column, evnt)
         }
         return nextTick()
       },
@@ -6069,6 +6111,7 @@ export default defineVxeComponent({
         const { filterStore } = reactData
         const { tableFullColumn } = internalData
         const filterOpts = computeFilterOpts.value
+        const { multiple } = filterOpts
         const filterCols: VxeTableDefines.ColumnInfo[] = []
         let column: VxeTableDefines.ColumnInfo<any> | null = null
         if (fieldOrColumn) {
@@ -6091,19 +6134,49 @@ export default defineVxeComponent({
             style: null,
             options: [],
             column: null,
-            multiple: false,
+            multiple: false, // 选项是覅多选
             visible: false
           })
         }
+
         if (!filterOpts.remote) {
           $xeTable.updateData()
         }
-        if (filterCols.length) {
+
+        if (!multiple) {
+          column = filterCols[0]
+        }
+
+        if (column) {
+          const filterList = () => $xeTable.getCheckedFilters()
+          const values: any[] = []
+          const datas: any[] = []
+          column.filters.forEach((item: any) => {
+            if (item.checked) {
+              values.push(item.value)
+              datas.push(item.data)
+            }
+          })
+          const params = {
+            $table: $xeTable,
+            $event: evnt as Event,
+            column,
+            field: column.field,
+            property: column.field,
+            values,
+            datas,
+            filters: filterList,
+            filterList
+          }
+          $xeTable.dispatchEvent('filter-change', params, evnt)
+          $xeTable.dispatchEvent('clear-filter', params, evnt)
+        }
+
+        if (multiple && filterCols.length) {
           const params = { $table: $xeTable, $event: evnt, cols: filterCols, filterList: [] }
           dispatchEvent('clear-all-filter', params, evnt)
-        } else if (column) {
-          $xeTable.dispatchEvent('clear-filter', { filterList: () => $xeTable.getCheckedFilters() }, evnt)
         }
+
         return nextTick()
       },
       /**
@@ -6361,6 +6434,32 @@ export default defineVxeComponent({
         }
         return nextTick()
       },
+      setRowGroupExpandByField (groupFields, expanded) {
+        const { isRowGroupStatus } = reactData
+        const aggregateOpts = computeAggregateOpts.value
+        const { childrenField } = aggregateOpts
+        if (groupFields) {
+          if (!XEUtils.isArray(groupFields)) {
+            groupFields = [groupFields]
+          }
+          if (isRowGroupStatus) {
+            const rows: any[] = []
+            const gfKeys: Record<string, boolean> = {}
+            groupFields.forEach(groupField => {
+              gfKeys[groupField] = true
+            })
+            XEUtils.eachTree(internalData.afterGroupFullData, (row) => {
+              if (row.isAggregate && gfKeys[row.groupField]) {
+                rows.push(row)
+              }
+            }, { children: childrenField })
+            if (rows.length) {
+              return handleRowGroupVirtualExpand(rows, expanded)
+            }
+          }
+        }
+        return nextTick()
+      },
       setAllRowGroupExpand (expanded) {
         const { tableFullGroupData } = internalData
         const aggregateOpts = computeAggregateOpts.value
@@ -6576,8 +6675,6 @@ export default defineVxeComponent({
       },
       /**
        * 如果有滚动条，则滚动到对应的位置
-       * @param {Number} scrollLeft 左距离
-       * @param {Number} scrollTop 上距离
        */
       scrollTo (scrollLeft, scrollTop) {
         const { elemStore } = internalData
@@ -6591,6 +6688,12 @@ export default defineVxeComponent({
 
         internalData.intoRunScroll = true
 
+        if (scrollLeft) {
+          if (!XEUtils.isNumber(scrollLeft)) {
+            scrollTop = scrollLeft.top
+            scrollLeft = scrollLeft.left
+          }
+        }
         if (XEUtils.isNumber(scrollLeft)) {
           setScrollLeft(xHandleEl, scrollLeft)
           setScrollLeft(bodyScrollElem, scrollLeft)
@@ -7998,7 +8101,7 @@ export default defineVxeComponent({
         evnt.preventDefault()
         const { column } = params
         const { columnStore, overflowX, scrollbarHeight } = reactData
-        const { elemStore, visibleColumn } = internalData
+        const { visibleColumn } = internalData
         const { leftList, rightList } = columnStore
         const resizableOpts = computeResizableOpts.value
         const osbHeight = overflowX ? scrollbarHeight : 0
@@ -8016,25 +8119,30 @@ export default defineVxeComponent({
         const { clientX: dragClientX } = evnt
         const dragBtnElem = evnt.target as HTMLDivElement
         let resizeColumn = column
-        if (column.children && column.children.length) {
+        const isDragGroupCol = column.children && column.children.length
+        if (isDragGroupCol) {
           XEUtils.eachTree(column.children, childColumn => {
             resizeColumn = childColumn
           })
         }
-        const cell = dragBtnElem.parentNode as HTMLTableCellElement
-        const cellParams = Object.assign(params, { cell })
-        let dragLeft = 0
-        const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
-        if (!bodyScrollElem) {
+        let cell = dragBtnElem.parentElement as HTMLTableCellElement | null
+        if (isDragGroupCol) {
+          const trEl = cell ? cell.parentElement as HTMLTableRowElement : null
+          const theadEl = trEl ? trEl.parentElement as HTMLTableElement : null
+          cell = theadEl ? theadEl.querySelector<HTMLTableCellElement>(`.vxe-header--column[colid="${resizeColumn.id}"]`) : null
+        }
+        if (!cell) {
           return
         }
+        const cellParams = XEUtils.assign(params, { cell })
+        let dragLeft = 0
         const tableRect = tableEl.getBoundingClientRect()
         const rightContainerRect = rightContainerElem ? rightContainerElem.getBoundingClientRect() : null
         const cellRect = cell.getBoundingClientRect()
         const dragBtnRect = dragBtnElem.getBoundingClientRect()
 
         const dragBtnWidth = dragBtnElem.clientWidth
-        const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2)
+        const dragBtnOffsetWidth = XEUtils.floor(dragBtnWidth / 2)
         const dragPosLeft = dragBtnRect.x - tableRect.x + dragBtnOffsetWidth
 
         const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth // 列之间的最小间距
@@ -8387,6 +8495,26 @@ export default defineVxeComponent({
       handleRefreshColumnQueue () {
         reactData.reColumnFlag++
       },
+      handleFilterOptions (column) {
+        const { filterStore } = reactData
+        const { filters, filterMultiple, filterRender } = column
+        const compConf = isEnableConf(filterRender) ? renderer.get(filterRender.name) : null
+        const frMethod = column.filterRecoverMethod || (compConf ? (compConf.tableFilterRecoverMethod || compConf.filterRecoverMethod) : null)
+        filterStore.multiple = filterMultiple
+        filterStore.options = filters
+        filterStore.column = column
+        // 复原状态
+        filterStore.options.forEach((option: any) => {
+          const { _checked, checked } = option
+          option._checked = checked
+          if (!checked && _checked !== checked) {
+            if (frMethod) {
+              frMethod({ option, column, $table: $xeTable })
+            }
+          }
+        })
+        $xeTable.checkFilterOptions()
+      },
       preventEvent (evnt, type, args, next, end) {
         let evntList = interceptor.get(type)
 
@@ -9337,8 +9465,8 @@ export default defineVxeComponent({
             $xeTable.handleHeaderCellDragMousedownEvent(evnt, params)
           }
         }
-        if (!triggerDrag && mouseConfig && mouseOpts.area && $xeTable.handleHeaderCellAreaEvent) {
-          $xeTable.handleHeaderCellAreaEvent(evnt, Object.assign({ cell, triggerSort, triggerFilter }, params))
+        if (!triggerDrag && mouseConfig && mouseOpts.area && $xeTable.handleHeaderCellAreaModownEvent) {
+          $xeTable.handleHeaderCellAreaModownEvent(evnt, Object.assign({ cell, triggerSort, triggerFilter }, params))
         }
         $xeTable.focus()
         if ($xeTable.closeMenu) {
@@ -11897,7 +12025,7 @@ export default defineVxeComponent({
         if (rowOpts.height && !props.showOverflow) {
           warnLog('vxe.error.notProp', ['table.show-overflow'])
         }
-        if (!$xeTable.triggerCellAreaMousednEvent) {
+        if (!$xeTable.triggerCellAreaModownEvent) {
           if (props.areaConfig) {
             warnLog('vxe.error.notProp', ['area-config'])
           }
@@ -11935,7 +12063,10 @@ export default defineVxeComponent({
           warnLog('vxe.error.delProp', ['row-group-config.countFields', 'column.agg-func'])
         }
         if (aggregateOpts.aggregateMethod) {
-          warnLog('vxe.error.delProp', ['row-group-config.aggregateMethod', 'aggregate-config.countMethod'])
+          warnLog('vxe.error.delProp', ['row-group-config.aggregateMethod', 'aggregate-config.calcValuesMethod'])
+        }
+        if (aggregateOpts.countMethod) {
+          warnLog('vxe.error.delProp', ['aggregate-config.countMethod', 'aggregate-config.calcValuesMethod'])
         }
         if (props.treeConfig && treeOpts.children) {
           warnLog('vxe.error.delProp', ['tree-config.children', 'tree-config.childrenField'])

package/packages/ui/index.ts

@@ -144,6 +144,7 @@ VxeUI.setConfig({
       // filterMethod: null,
       // destroyOnClose: false,
       // isEvery: false,
+      multiple: true,
       showIcon: true
     },
     aggregateConfig: {