releases 4.7.50

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-table",
-  "version": "4.7.49",
+  "version": "4.7.50",
   "description": "一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -28,7 +28,7 @@
   "style": "lib/style.css",
   "typings": "types/index.d.ts",
   "dependencies": {
-    "vxe-pc-ui": "^4.0.63"
+    "vxe-pc-ui": "^4.0.67"
   },
   "devDependencies": {
     "@types/resize-observer-browser": "^0.1.11",

packages/grid/src/grid.ts

@@ -184,9 +184,9 @@ export default defineComponent({
       const tableProps = Object.assign({}, tableExtendProps)
       if (isZMax) {
         if (tableExtendProps.maxHeight) {
-          tableProps.maxHeight = 'fill'
+          tableProps.maxHeight = '100%'
         } else {
-          tableProps.height = 'fill'
+          tableProps.height = '100%'
         }
       }
       if (proxyConfig && isEnableConf(proxyOpts)) {
@@ -1125,7 +1125,7 @@ export default defineComponent({
         const topWrapper = refTopWrapper.value
         const bottomWrapper = refBottomWrapper.value
         const pagerWrapper = refPagerWrapper.value
-        const parentPaddingSize = isZMax || !(height === 'auto' || height === 'fill') ? 0 : getPaddingTopBottomSize(el.parentNode as HTMLElement)
+        const parentPaddingSize = isZMax || !(height === 'auto' || height === '100%') ? 0 : getPaddingTopBottomSize(el.parentNode as HTMLElement)
         return parentPaddingSize + getPaddingTopBottomSize(el) + getOffsetHeight(formWrapper) + getOffsetHeight(toolbarWrapper) + getOffsetHeight(topWrapper) + getOffsetHeight(bottomWrapper) + getOffsetHeight(pagerWrapper)
       },
       getParentHeight () {

packages/table/src/cell.ts

@@ -6,9 +6,9 @@ import { updateCellTitle } from '../../ui/src/dom'
 import { createColumn, getRowid } from './util'
 import { getSlotVNs } from '../../ui/src/vn'
 
-import type { VxeTableConstructor, VxeTableDefines, VxeTablePrivateMethods, VxeComponentSlotType } from '../../../types'
+import type { VxeTableConstructor, VxeTableDefines, VxeColumnPropTypes, VxeTablePrivateMethods, VxeComponentSlotType } from '../../../types'
 
-const { getI18n, getIcon, renderer } = VxeUI
+const { getI18n, getIcon, renderer, formats } = VxeUI
 
 function renderTitlePrefixIcon (params: VxeTableDefines.CellRenderHeaderParams) {
   const { $table, column } = params
@@ -94,9 +94,28 @@ function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams, con
   ]
 }
 
+function formatFooterLabel (footerFormatter: VxeColumnPropTypes.FooterFormatter, params: {
+  itemValue: any
+  column: VxeTableDefines.ColumnInfo
+  row: any
+  items: any[]
+  _columnIndex: number
+}) {
+  if (XEUtils.isFunction(footerFormatter)) {
+    return footerFormatter(params)
+  }
+  const isArr = XEUtils.isArray(footerFormatter)
+  const gFormatOpts = isArr ? formats.get(footerFormatter[0]) : formats.get(footerFormatter)
+  const footerFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null
+  if (footerFormatMethod) {
+    return isArr ? footerFormatMethod(params, ...footerFormatter.slice(1)) : footerFormatMethod(params)
+  }
+  return ''
+}
+
 function getFooterContent (params: VxeTableDefines.CellRenderFooterParams) {
   const { $table, column, _columnIndex, items, row } = params
-  const { slots, editRender, cellRender } = column
+  const { slots, editRender, cellRender, footerFormatter } = column
   const renderOpts = editRender || cellRender
   const footerSlot = slots ? slots.footer : null
   if (footerSlot) {
@@ -111,11 +130,34 @@ function getFooterContent (params: VxeTableDefines.CellRenderFooterParams) {
       }
     }
   }
+  let itemValue = ''
   // 兼容老模式
   if (XEUtils.isArray(items)) {
-    return [formatText(items[_columnIndex], 1)]
+    itemValue = items[_columnIndex]
+    return [
+      footerFormatter
+        ? formatFooterLabel(footerFormatter, {
+          itemValue,
+          column,
+          row,
+          items,
+          _columnIndex
+        })
+        : formatText(itemValue, 1)
+    ]
   }
-  return [formatText(XEUtils.get(row, column.field), 1)]
+  itemValue = XEUtils.get(row, column.field)
+  return [
+    footerFormatter
+      ? formatFooterLabel(footerFormatter, {
+        itemValue,
+        column,
+        row,
+        items,
+        _columnIndex
+      })
+      : formatText(itemValue, 1)
+  ]
 }
 
 function getDefaultCellLabel (params: VxeTableDefines.CellRenderBodyParams) {

packages/table/src/column.ts

@@ -43,6 +43,8 @@ export const columnProps = {
   footerClassName: [String, Function] as PropType<VxeColumnPropTypes.FooterClassName>,
   // 格式化显示内容
   formatter: [Function, Array, String] as PropType<VxeColumnPropTypes.Formatter<any>>,
+  // 格式化表尾显示内容
+  footerFormatter: [Function, Array, String] as PropType<VxeColumnPropTypes.FooterFormatter>,
   // 是否允许排序
   sortable: Boolean as PropType<VxeColumnPropTypes.Sortable>,
   // 自定义排序的属性

packages/table/src/columnInfo.ts

@@ -73,6 +73,7 @@ export class ColumnInfo {
       headerClassName: _vm.headerClassName,
       footerClassName: _vm.footerClassName,
       formatter: formatter,
+      footerFormatter: _vm.footerFormatter,
       sortable: _vm.sortable,
       sortBy: _vm.sortBy,
       sortType: _vm.sortType,

packages/table/src/table.ts

@@ -890,7 +890,7 @@ export default defineComponent({
       const val = props[key]
       let num = 0
       if (val) {
-        if (val === 'fill' || val === 'auto') {
+        if (val === '100%' || val === 'auto') {
           num = parentHeight
         } else {
           const excludeHeight = $xeTable.getExcludeHeight()