vxe-table 3.8.23 → 3.9.0-rc.0

package/packages/table/src/column.js

@@ -1,141 +0,0 @@
-import Cell from '../../table/src/cell'
-import UtilTools from '../../tools/utils'
-
-const props = {
-  // 列唯一主键
-  colId: [String, Number],
-  // 渲染类型 seq,radio,checkbox,expand,html
-  type: String,
-  // 列字段名
-  field: String,
-  // 列标题
-  title: String,
-  // 列宽度
-  width: [Number, String],
-  // 列最小宽度，把剩余宽度按比例分配
-  minWidth: [Number, String],
-  // 列最大宽度
-  maxWidth: [Number, String],
-  // 是否允许拖动列宽调整大小
-  resizable: { type: Boolean, default: null },
-  // 将列固定在左侧或者右侧
-  fixed: String,
-  // 列对其方式
-  align: String,
-  // 表头对齐方式
-  headerAlign: String,
-  // 表尾列的对齐方式
-  footerAlign: String,
-  // 当内容过长时显示为省略号
-  showOverflow: { type: [Boolean, String], default: null },
-  // 当表头内容过长时显示为省略号
-  showHeaderOverflow: { type: [Boolean, String], default: null },
-  // 当表尾内容过长时显示为省略号
-  showFooterOverflow: { type: [Boolean, String], default: null },
-  // 给单元格附加 className
-  className: [String, Function],
-  // 给表头单元格附加 className
-  headerClassName: [String, Function],
-  // 给表尾单元格附加 className
-  footerClassName: [String, Function],
-  // 格式化显示内容
-  formatter: [Function, Array, String],
-  // 格式化表尾显示内容
-  footerFormatter: [Function, Array, String],
-  // 是否允许排序
-  sortable: Boolean,
-  // 在 v3 中废弃
-  remoteSort: { type: Boolean, default: null },
-  // 在 v3 中只支持字符串类型
-  sortBy: [String, Function],
-  // 排序的字段类型，比如字符串转数值等
-  sortType: String,
-  // 在 v3 中废弃
-  sortMethod: Function,
-  // 配置筛选条件数组
-  filters: { type: Array, default: null },
-  // 筛选是否允许多选
-  filterMultiple: { type: Boolean, default: true },
-  // 自定义筛选方法
-  filterMethod: Function,
-  // 筛选重置方法
-  filterResetMethod: Function,
-  // 筛选复原方法
-  filterRecoverMethod: Function,
-  // 筛选模板配置项
-  filterRender: Object,
-  // 指定为树节点
-  treeNode: Boolean,
-  // 是否可视
-  visible: { type: Boolean, default: null },
-  // 表头单元格数据导出方法
-  headerExportMethod: Function,
-  // 单元格数据导出方法
-  exportMethod: Function,
-  // 表尾单元格数据导出方法
-  footerExportMethod: Function,
-  // 已废弃，被 titlePrefix 替换
-  titleHelp: Object,
-  // 标题前缀图标配置项
-  titlePrefix: Object,
-  // 标题后缀图标配置项
-  titleSuffix: Object,
-  // 单元格值类型
-  cellType: String,
-  // 单元格渲染配置项
-  cellRender: Object,
-  // 单元格编辑渲染配置项
-  editRender: Object,
-  // 内容渲染配置项
-  contentRender: Object,
-  // 额外的参数
-  params: Object
-}
-
-const watch = {}
-Object.keys(props).forEach(name => {
-  watch[name] = function (value) {
-    this.columnConfig.update(name, value)
-    if (this.$xetable) {
-      if (name === 'filters') {
-        this.$xetable.setFilter(this.columnConfig, value)
-        this.$xetable.handleUpdateDataQueue()
-      } else if (['visible', 'fixed', 'width', 'minWidth', 'maxWidth'].includes(name)) {
-        this.$xetable.handleRefreshColumnQueue()
-      }
-    }
-  }
-})
-
-export default {
-  name: 'VxeColumn',
-  props,
-  provide () {
-    return {
-      $xecolumn: this,
-      $xegrid: null
-    }
-  },
-  inject: {
-    $xetable: {
-      default: null
-    },
-    $xecolumn: {
-      default: null
-    }
-  },
-  watch,
-  created () {
-    this.columnConfig = this.createColumn(this.$xetable, this)
-  },
-  mounted () {
-    UtilTools.assembleColumn(this)
-  },
-  destroyed () {
-    UtilTools.destroyColumn(this)
-  },
-  render (h) {
-    return h('div', this.$slots.default)
-  },
-  methods: Cell
-}

package/packages/table/src/columnInfo.js

@@ -1,168 +0,0 @@
-import XEUtils from 'xe-utils'
-import GlobalConfig from '../../v-x-e-table/src/conf'
-import { formats } from '../../v-x-e-table/src/formats'
-import { toFilters } from './util'
-import { getFuncText } from '../../tools/utils'
-import { warnLog, errLog } from '../../tools/log'
-
-export class ColumnInfo {
-  /* eslint-disable @typescript-eslint/no-use-before-define */
-  constructor ($xetable, _vm, { renderHeader, renderCell, renderFooter, renderData } = {}) {
-    const $xegrid = $xetable.$xegrid
-    const proxyOpts = $xegrid ? $xegrid.proxyOpts : null
-    const formatter = _vm.formatter
-    const visible = XEUtils.isBoolean(_vm.visible) ? _vm.visible : true
-
-    if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
-      const types = ['seq', 'checkbox', 'radio', 'expand', 'html']
-      if (_vm.type && types.indexOf(_vm.type) === -1) {
-        warnLog('vxe.error.errProp', [`type=${_vm.type}`, types.join(', ')])
-      }
-      if (XEUtils.isBoolean(_vm.cellRender) || (_vm.cellRender && !XEUtils.isObject(_vm.cellRender))) {
-        warnLog('vxe.error.errProp', [`column.cell-render=${_vm.cellRender}`, 'column.cell-render={}'])
-      }
-      if (XEUtils.isBoolean(_vm.editRender) || (_vm.editRender && !XEUtils.isObject(_vm.editRender))) {
-        warnLog('vxe.error.errProp', [`column.edit-render=${_vm.editRender}`, 'column.edit-render={}'])
-      }
-      if (_vm.cellRender && _vm.editRender) {
-        warnLog('vxe.error.errConflicts', ['column.cell-render', 'column.edit-render'])
-      }
-      if (_vm.type === 'expand') {
-        if ($xetable.treeConfig && ($xetable.treeOpts.showLine || $xetable.treeOpts.line)) {
-          errLog('vxe.error.errConflicts', ['tree-config.line', 'column.type=expand'])
-        }
-      }
-      if (_vm.remoteSort) {
-        warnLog('vxe.error.delProp', ['column.remote-sort', 'sort-config.remote'])
-      }
-      if (_vm.sortMethod) {
-        warnLog('vxe.error.delProp', ['column.sort-method', 'sort-config.sortMethod'])
-      }
-      if (formatter) {
-        if (XEUtils.isString(formatter)) {
-          const gFormatOpts = formats.get(formatter) || XEUtils[formatter]
-          if (!gFormatOpts || !XEUtils.isFunction(gFormatOpts.cellFormatMethod)) {
-            errLog('vxe.error.notFormats', [formatter])
-          }
-        } else if (XEUtils.isArray(formatter)) {
-          const gFormatOpts = formats.get(formatter[0]) || XEUtils[formatter[0]]
-          if (!gFormatOpts || !XEUtils.isFunction(gFormatOpts.cellFormatMethod)) {
-            errLog('vxe.error.notFormats', [formatter[0]])
-          }
-        }
-      }
-    }
-
-    Object.assign(this, {
-      // 基本属性
-      type: _vm.type,
-      property: _vm.field,
-      field: _vm.field,
-      title: _vm.title,
-      width: _vm.width,
-      minWidth: _vm.minWidth,
-      maxWidth: _vm.maxWidth,
-      resizable: _vm.resizable,
-      fixed: _vm.fixed,
-      align: _vm.align,
-      headerAlign: _vm.headerAlign,
-      footerAlign: _vm.footerAlign,
-      showOverflow: _vm.showOverflow,
-      showHeaderOverflow: _vm.showHeaderOverflow,
-      showFooterOverflow: _vm.showFooterOverflow,
-      className: _vm.className,
-      headerClassName: _vm.headerClassName,
-      footerClassName: _vm.footerClassName,
-      formatter,
-      footerFormatter: _vm.footerFormatter,
-      sortable: _vm.sortable,
-      sortBy: _vm.sortBy,
-      sortType: _vm.sortType,
-      sortMethod: _vm.sortMethod,
-      remoteSort: _vm.remoteSort,
-      filters: toFilters(_vm.filters),
-      filterMultiple: XEUtils.isBoolean(_vm.filterMultiple) ? _vm.filterMultiple : true,
-      filterMethod: _vm.filterMethod,
-      filterResetMethod: _vm.filterResetMethod,
-      filterRecoverMethod: _vm.filterRecoverMethod,
-      filterRender: _vm.filterRender,
-      treeNode: _vm.treeNode,
-      cellType: _vm.cellType,
-      cellRender: _vm.cellRender,
-      editRender: _vm.editRender,
-      contentRender: _vm.contentRender,
-      headerExportMethod: _vm.headerExportMethod,
-      exportMethod: _vm.exportMethod,
-      footerExportMethod: _vm.footerExportMethod,
-      titleHelp: _vm.titleHelp,
-      titlePrefix: _vm.titlePrefix,
-      titleSuffix: _vm.titleSuffix,
-      // 自定义参数
-      params: _vm.params,
-      // 渲染属性
-      id: _vm.colId || XEUtils.uniqueId('col_'),
-      parentId: null,
-      visible,
-      // 内部属性（一旦被使用，将导致不可升级版本）
-      halfVisible: false,
-      defaultVisible: visible,
-      defaultFixed: _vm.fixed,
-      checked: false,
-      halfChecked: false,
-      disabled: false,
-      level: 1,
-      rowSpan: 1,
-      colSpan: 1,
-
-      // 数据排序
-      order: null, // 用于记录排序类型，升序和倒序
-      sortTime: 0, // 用于多列的先后顺序
-
-      // 列排序
-      sortNumber: 0, // 用于记录自定义列顺序
-      renderSortNumber: 0, // 用于记录自定义列顺序
-
-      renderFixed: '',
-      renderVisible: false,
-
-      renderWidth: 0,
-      renderHeight: 0,
-      renderResizeWidth: 0,
-      renderAutoWidth: 0,
-      resizeWidth: 0, // 手动调整
-
-      renderLeft: 0,
-      renderArgs: [], // 渲染参数可用于扩展
-      model: {},
-      renderHeader: renderHeader || _vm.renderHeader,
-      renderCell: renderCell || _vm.renderCell,
-      renderFooter: renderFooter || _vm.renderFooter,
-      renderData,
-      // 单元格插槽，只对 grid 有效
-      slots: _vm.slots
-    })
-    if (proxyOpts && proxyOpts.beforeColumn) {
-      proxyOpts.beforeColumn({ $grid: $xegrid, column: this })
-    }
-  }
-
-  getTitle () {
-    return getFuncText(this.title || (this.type === 'seq' ? GlobalConfig.i18n('vxe.table.seqTitle') : ''))
-  }
-
-  getKey () {
-    const { type } = this
-    return this.field || (type ? `type=${type}` : null)
-  }
-
-  update (name, value) {
-    // 不支持直接修改的属性
-    if (name !== 'filters') {
-      if (name === 'field') {
-        // 兼容旧属性
-        this.property = value
-      }
-      this[name] = value
-    }
-  }
-}

package/packages/table/src/footer.js

@@ -1,293 +0,0 @@
-import XEUtils from 'xe-utils'
-import UtilTools from '../../tools/utils'
-import DomTools from '../../tools/dom'
-
-const cellType = 'footer'
-
-function mergeFooterMethod (mergeFooterList, _rowIndex, _columnIndex) {
-  for (let mIndex = 0; mIndex < mergeFooterList.length; mIndex++) {
-    const { row: mergeRowIndex, col: mergeColIndex, rowspan: mergeRowspan, colspan: mergeColspan } = mergeFooterList[mIndex]
-    if (mergeColIndex > -1 && mergeRowIndex > -1 && mergeRowspan && mergeColspan) {
-      if (mergeRowIndex === _rowIndex && mergeColIndex === _columnIndex) {
-        return { rowspan: mergeRowspan, colspan: mergeColspan }
-      }
-      if (_rowIndex >= mergeRowIndex && _rowIndex < mergeRowIndex + mergeRowspan && _columnIndex >= mergeColIndex && _columnIndex < mergeColIndex + mergeColspan) {
-        return { rowspan: 0, colspan: 0 }
-      }
-    }
-  }
-}
-
-export default {
-  name: 'VxeTableFooter',
-  props: {
-    footerTableData: Array,
-    tableColumn: Array,
-    fixedColumn: Array,
-    fixedType: String,
-    size: String
-  },
-  mounted () {
-    const { $parent: $xetable, $el, $refs, fixedType } = this
-    const { elemStore } = $xetable
-    const prefix = `${fixedType || 'main'}-footer-`
-    elemStore[`${prefix}wrapper`] = $el
-    elemStore[`${prefix}table`] = $refs.table
-    elemStore[`${prefix}colgroup`] = $refs.colgroup
-    elemStore[`${prefix}list`] = $refs.tfoot
-    elemStore[`${prefix}xSpace`] = $refs.xSpace
-  },
-  destroyed () {
-    const { $parent: $xetable, fixedType } = this
-    const { elemStore } = $xetable
-    const prefix = `${fixedType || 'main'}-footer-`
-    elemStore[`${prefix}wrapper`] = null
-    elemStore[`${prefix}table`] = null
-    elemStore[`${prefix}colgroup`] = null
-    elemStore[`${prefix}list`] = null
-    elemStore[`${prefix}xSpace`] = null
-  },
-  render (h) {
-    let { _e, $parent: $xetable, fixedType, fixedColumn, tableColumn, footerTableData } = this
-    const {
-      $listeners: tableListeners,
-      tId,
-      footerRowClassName,
-      footerCellClassName,
-      footerRowStyle,
-      footerCellStyle,
-      footerAlign: allFooterAlign,
-      mergeFooterList,
-      footerSpanMethod,
-      align: allAlign,
-      scrollXLoad,
-      columnKey,
-      columnOpts,
-      showFooterOverflow: allColumnFooterOverflow,
-      currentColumn,
-      overflowX,
-      scrollbarWidth,
-      tooltipOpts,
-      visibleColumn,
-      expandColumn
-    } = $xetable
-    // 如果是使用优化模式
-    if (fixedType) {
-      // 如果存在展开行使用全量渲染
-      if (!expandColumn && (scrollXLoad || allColumnFooterOverflow)) {
-        if (!mergeFooterList.length || !footerSpanMethod) {
-          tableColumn = fixedColumn
-        } else {
-          tableColumn = visibleColumn
-        }
-      } else {
-        tableColumn = visibleColumn
-      }
-    }
-    return h('div', {
-      class: ['vxe-table--footer-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'],
-      attrs: {
-        xid: tId
-      },
-      on: {
-        scroll: this.scrollEvent
-      }
-    }, [
-      fixedType ? _e() : h('div', {
-        class: 'vxe-body--x-space',
-        ref: 'xSpace'
-      }),
-      h('table', {
-        class: 'vxe-table--footer',
-        attrs: {
-          xid: tId,
-          cellspacing: 0,
-          cellpadding: 0,
-          border: 0
-        },
-        ref: 'table'
-      }, [
-        /**
-         * 列宽
-         */
-        h('colgroup', {
-          ref: 'colgroup'
-        }, tableColumn.map((column, $columnIndex) => {
-          return h('col', {
-            attrs: {
-              name: column.id
-            },
-            key: $columnIndex
-          })
-        }).concat(scrollbarWidth ? [
-          h('col', {
-            attrs: {
-              name: 'col_gutter'
-            }
-          })
-        ] : [])),
-        /**
-         * 底部
-         */
-        h('tfoot', {
-          ref: 'tfoot'
-        }, footerTableData.map((list, _rowIndex) => {
-          const $rowIndex = _rowIndex
-          const rowParams = { $table: $xetable, row: list, _rowIndex, $rowIndex, fixed: fixedType, type: cellType }
-          return h('tr', {
-            class: ['vxe-footer--row', footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''],
-            style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
-          }, tableColumn.map((column, $columnIndex) => {
-            const { type, showFooterOverflow, footerAlign, align, footerClassName } = column
-            const showAllTip = tooltipOpts.showAll || tooltipOpts.enabled
-            const isColGroup = column.children && column.children.length
-            const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : column.fixed && overflowX
-            const footOverflow = XEUtils.isUndefined(showFooterOverflow) || XEUtils.isNull(showFooterOverflow) ? allColumnFooterOverflow : showFooterOverflow
-            const footAlign = footerAlign || align || allFooterAlign || allAlign
-            let showEllipsis = footOverflow === 'ellipsis'
-            const showTitle = footOverflow === 'title'
-            const showTooltip = footOverflow === true || footOverflow === 'tooltip'
-            let hasEllipsis = showTitle || showTooltip || showEllipsis
-            const attrs = { colid: column.id }
-            const tfOns = {}
-            const columnIndex = $xetable.getColumnIndex(column)
-            const _columnIndex = $xetable.getVTColumnIndex(column)
-            const itemIndex = _columnIndex
-            const cellParams = {
-              $table: $xetable,
-              $grid: $xetable.xegrid,
-              row: list,
-              _rowIndex,
-              $rowIndex,
-              column,
-              columnIndex,
-              $columnIndex,
-              _columnIndex,
-              itemIndex,
-              items: list,
-              fixed: fixedType,
-              type: cellType,
-              data: footerTableData
-            }
-            // 虚拟滚动不支持动态高度
-            if (scrollXLoad && !hasEllipsis) {
-              showEllipsis = hasEllipsis = true
-            }
-            if (showTitle || showTooltip || showAllTip) {
-              tfOns.mouseenter = evnt => {
-                if (showTitle) {
-                  DomTools.updateCellTitle(evnt.currentTarget, column)
-                } else if (showTooltip || showAllTip) {
-                  $xetable.triggerFooterTooltipEvent(evnt, cellParams)
-                }
-              }
-            }
-            if (showTooltip || showAllTip) {
-              tfOns.mouseleave = evnt => {
-                if (showTooltip || showAllTip) {
-                  $xetable.handleTargetLeaveEvent(evnt)
-                }
-              }
-            }
-            if (tableListeners['footer-cell-click']) {
-              tfOns.click = evnt => {
-                $xetable.emitEvent('footer-cell-click', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt)
-              }
-            }
-            if (tableListeners['footer-cell-dblclick']) {
-              tfOns.dblclick = evnt => {
-                $xetable.emitEvent('footer-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt)
-              }
-            }
-            // 合并行或列
-            if (mergeFooterList.length) {
-              const spanRest = mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex)
-              if (spanRest) {
-                const { rowspan, colspan } = spanRest
-                if (!rowspan || !colspan) {
-                  return null
-                }
-                if (rowspan > 1) {
-                  attrs.rowspan = rowspan
-                }
-                if (colspan > 1) {
-                  attrs.colspan = colspan
-                }
-              }
-            } else if (footerSpanMethod) {
-              // 自定义合并方法
-              const { rowspan = 1, colspan = 1 } = footerSpanMethod(cellParams) || {}
-              if (!rowspan || !colspan) {
-                return null
-              }
-              if (rowspan > 1) {
-                attrs.rowspan = rowspan
-              }
-              if (colspan > 1) {
-                attrs.colspan = colspan
-              }
-            }
-            return h('td', {
-              class: ['vxe-footer--column', column.id, {
-                [`col--${footAlign}`]: footAlign,
-                [`col--${type}`]: type,
-                'col--last': $columnIndex === tableColumn.length - 1,
-                'fixed--hidden': fixedHiddenColumn,
-                'col--ellipsis': hasEllipsis,
-                'col--current': currentColumn === column
-              }, UtilTools.getClass(footerClassName, cellParams), UtilTools.getClass(footerCellClassName, cellParams)],
-              attrs,
-              style: footerCellStyle ? (XEUtils.isFunction(footerCellStyle) ? footerCellStyle(cellParams) : footerCellStyle) : null,
-              on: tfOns,
-              key: columnKey || columnOpts.useKey ? column.id : $columnIndex
-            }, [
-              h('div', {
-                class: ['vxe-cell', {
-                  'c--title': showTitle,
-                  'c--tooltip': showTooltip,
-                  'c--ellipsis': showEllipsis
-                }]
-              }, column.renderFooter(h, cellParams))
-            ])
-          }).concat(scrollbarWidth ? [
-            h('td', {
-              class: 'vxe-footer--gutter col--gutter'
-            })
-          ] : []))
-        }))
-      ])
-    ])
-  },
-  methods: {
-    /**
-     * 滚动处理
-     * 如果存在列固定左侧，同步更新滚动状态
-     * 如果存在列固定右侧，同步更新滚动状态
-     */
-    scrollEvent (evnt) {
-      const { $parent: $xetable, fixedType } = this
-      const { $refs, scrollXLoad, triggerScrollXEvent, lastScrollLeft } = $xetable
-      const { tableHeader, tableBody, tableFooter, validTip } = $refs
-      const headerElem = tableHeader ? tableHeader.$el : null
-      const footerElem = tableFooter ? tableFooter.$el : null
-      const bodyElem = tableBody.$el
-      const scrollLeft = footerElem ? footerElem.scrollLeft : 0
-      const isX = scrollLeft !== lastScrollLeft
-      $xetable.lastScrollLeft = scrollLeft
-      $xetable.lastScrollTime = Date.now()
-      if (headerElem) {
-        headerElem.scrollLeft = scrollLeft
-      }
-      if (bodyElem) {
-        bodyElem.scrollLeft = scrollLeft
-      }
-      if (scrollXLoad && isX) {
-        triggerScrollXEvent(evnt)
-      }
-      if (isX && validTip && validTip.visible) {
-        validTip.updatePlacement()
-      }
-      $xetable.emitEvent('scroll', { type: cellType, fixed: fixedType, scrollTop: bodyElem.scrollTop, scrollLeft, isX, isY: false }, evnt)
-    }
-  }
-}