vxe-table 3.5.8 → 3.5.9-beta.10

package/packages/edit/src/mixin.js

@@ -3,7 +3,7 @@ import VXETable from '../../v-x-e-table'
 import UtilTools, { isEnableConf } from '../../tools/utils'
 import { getRowid } from '../../table/src/util'
 import DomTools, { browse } from '../../tools/dom'
-import { warnLog, errLog } from '../../tools/log'
+import { warnLog, errLog, getLog } from '../../tools/log'
 
 function insertTreeRow (_vm, newRecords, isAppend) {
   const { tableFullTreeData, afterFullData, fullDataRowIdData, fullAllDataRowIdData, treeOpts } = _vm
@@ -130,7 +130,7 @@ export default {
             }
           } else {
             if (treeConfig) {
-              throw new Error(UtilTools.getLog('vxe.error.noTree', ['insert']))
+              throw new Error(getLog('vxe.error.noTree', ['insert']))
             }
             let afIndex = -1
             // 如果是可视索引
@@ -189,7 +189,7 @@ export default {
       const { afterFullData, tableFullData, tableFullTreeData, treeConfig, mergeList, editStore, checkboxOpts, selection, isInsertByRow, treeOpts } = this
       const { transform } = treeOpts
       const { actived, removeList, insertList } = editStore
-      const { checkField: property } = checkboxOpts
+      const { checkField } = checkboxOpts
       let rest = []
       if (!rows) {
         rows = tableFullData
@@ -203,7 +203,7 @@ export default {
         }
       })
       // 如果绑定了多选属性，则更新状态
-      if (!property) {
+      if (!checkField) {
         rows.forEach(row => {
           const sIndex = selection.indexOf(row)
           if (sIndex > -1) {
@@ -380,16 +380,17 @@ export default {
      */
     handleActived (params, evnt) {
       const { editStore, editOpts, tableColumn, editConfig, mouseConfig } = this
-      const { mode, activeMethod } = editOpts
+      const { mode } = editOpts
       const { actived } = editStore
       const { row, column } = params
       const { editRender } = column
       const cell = params.cell = (params.cell || this.getCell(row, column))
+      const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod
       if (isEnableConf(editConfig) && isEnableConf(editRender) && cell) {
         if (actived.row !== row || (mode === 'cell' ? actived.column !== column : false)) {
           // 判断是否禁用编辑
           let type = 'edit-disabled'
-          if (!activeMethod || activeMethod({ ...params, $table: this })) {
+          if (!beforeEditMethod || beforeEditMethod({ ...params, $table: this })) {
             if (mouseConfig) {
               this.clearSelected(evnt)
               this.clearCellAreas(evnt)
@@ -542,18 +543,21 @@ export default {
       const { editRender } = column
       if (isEnableConf(editRender)) {
         const compRender = VXETable.renderer.get(editRender.name)
-        const { autofocus, autoselect } = editRender
+        let { autofocus, autoselect } = editRender
         let inputElem
+        if (!autofocus && compRender) {
+          autofocus = compRender.autofocus
+        }
         // 如果指定了聚焦 class
-        if (autofocus) {
+        if (XEUtils.isFunction(autofocus)) {
+          inputElem = autofocus.call(this, params)
+        } else if (autofocus) {
           inputElem = cell.querySelector(autofocus)
-        }
-        // 渲染器的聚焦处理
-        if (!inputElem && compRender && compRender.autofocus) {
-          inputElem = cell.querySelector(compRender.autofocus)
+          if (inputElem) {
+            inputElem.focus()
+          }
         }
         if (inputElem) {
-          inputElem.focus()
           if (autoselect) {
             inputElem.select()
           } else {

package/packages/export/src/mixin.js

@@ -4,7 +4,7 @@ import VXETable from '../../v-x-e-table'
 import UtilTools from '../../tools/utils'
 import { mergeBodyMethod, isColumnInfo } from '../../table/src/util'
 import { browse } from '../../tools/dom'
-import { warnLog, errLog } from '../../tools/log'
+import { warnLog, errLog, getLog } from '../../tools/log'
 
 const { formatText } = UtilTools
 
@@ -576,7 +576,7 @@ export function saveLocalFile (options) {
     }
     return Promise.resolve()
   }
-  return Promise.reject(new Error(UtilTools.getLog('vxe.error.notExp')))
+  return Promise.reject(new Error(getLog('vxe.error.notExp')))
 }
 
 function downloadFile ($xetable, opts, content) {

package/packages/filter/src/mixin.js

@@ -130,13 +130,13 @@ export default {
           filterStore.maxHeight = maxHeight
         })
       }
-      this.emitEvent('filter-visible', { column, property: column.property, filterList: this.getCheckedFilters(), visible: filterStore.visible }, evnt)
+      this.emitEvent('filter-visible', { column, field: column.field, property: column.field, filterList: this.getCheckedFilters(), visible: filterStore.visible }, evnt)
     },
     _getCheckedFilters () {
       const { tableFullColumn } = this
       const filterList = []
       tableFullColumn.filter(column => {
-        const { property, filters } = column
+        const { field, filters } = column
         const valueList = []
         const dataList = []
         if (filters && filters.length) {
@@ -147,7 +147,7 @@ export default {
             }
           })
           if (valueList.length) {
-            filterList.push({ column, property, values: valueList, datas: dataList })
+            filterList.push({ column, field, property: field, values: valueList, datas: dataList })
           }
         }
       })
@@ -161,7 +161,7 @@ export default {
     confirmFilterEvent (evnt) {
       const { filterStore, filterOpts, scrollXLoad: oldScrollXLoad, scrollYLoad: oldScrollYLoad } = this
       const { column } = filterStore
-      const { property } = column
+      const { field } = column
       const values = []
       const datas = []
       column.filters.forEach(item => {
@@ -176,7 +176,7 @@ export default {
         this.handleTableData(true)
         this.checkSelectionStatus()
       }
-      this.emitEvent('filter-change', { column, property, values, datas, filters: filterList, filterList }, evnt)
+      this.emitEvent('filter-change', { column, field, property: field, values, datas, filters: filterList, filterList }, evnt)
       this.closeFilter()
       this.updateFooter().then(() => {
         const { scrollXLoad, scrollYLoad } = this

package/packages/filter/src/panel.js

@@ -16,15 +16,22 @@ export default {
   },
   render (h) {
     const { $parent: $xetable, filterStore } = this
-    const { column } = filterStore
+    const { args, column } = filterStore
     const filterRender = column ? column.filterRender : null
     const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null
+    const filterClassName = compConf ? compConf.filterClassName : ''
     return h('div', {
-      class: ['vxe-table--filter-wrapper', 'filter--prevent-default', compConf && compConf.className ? compConf.className : '', {
-        'is--animat': $xetable.animat,
-        'is--multiple': filterStore.multiple,
-        'is--active': filterStore.visible
-      }],
+      class: [
+        'vxe-table--filter-wrapper',
+        'filter--prevent-default',
+        compConf && compConf.className ? compConf.className : '',
+        UtilTools.getClass(filterClassName, Object.assign({ $panel: this, $table: $xetable }, args)),
+        {
+          'is--animat': $xetable.animat,
+          'is--multiple': filterStore.multiple,
+          'is--active': filterStore.visible
+        }
+      ],
       style: filterStore.style
     }, filterStore.visible ? this.renderOptions(h, filterRender, compConf).concat(this.renderFooter(h)) : [])
   },

package/packages/form/src/form-config-item.js

@@ -30,6 +30,7 @@ const VxeFormConfigItem = {
     const { rules, data, collapseAll, validOpts, titleAlign: allTitleAlign, titleWidth: allTitleWidth, titleColon: allTitleColon, titleAsterisk: allTitleAsterisk, titleOverflow: allTitleOverflow } = $xeform
     const { slots, title, folding, visible, visibleMethod, field, collapseNode, itemRender, showError, errRule, className, titleOverflow, children } = item
     const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null
+    const itemClassName = compConf ? compConf.itemClassName : ''
     const span = item.span || $xeform.span
     const align = item.align || $xeform.align
     const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign
@@ -88,15 +89,22 @@ const VxeFormConfigItem = {
       mouseleave: $xeform.handleTitleTipLeaveEvent
     } : {}
     return h('div', {
-      class: ['vxe-form--item', item.id, span ? `vxe-col--${span} is--span` : null, className ? (XEUtils.isFunction(className) ? className(params) : className) : '', {
-        'is--title': title,
-        'is--colon': titleColon,
-        'is--asterisk': titleAsterisk,
-        'is--required': isRequired,
-        'is--hidden': folding && collapseAll,
-        'is--active': !itemVisibleMethod || itemVisibleMethod(params),
-        'is--error': showError
-      }],
+      class: [
+        'vxe-form--item',
+        item.id,
+        span ? `vxe-col--${span} is--span` : null,
+        className ? (XEUtils.isFunction(className) ? className(params) : className) : '',
+        itemClassName ? (XEUtils.isFunction(itemClassName) ? itemClassName(params) : className) : '',
+        {
+          'is--title': title,
+          'is--colon': titleColon,
+          'is--asterisk': titleAsterisk,
+          'is--required': isRequired,
+          'is--hidden': folding && collapseAll,
+          'is--active': !itemVisibleMethod || itemVisibleMethod(params),
+          'is--error': showError
+        }
+      ],
       props: {
         itemConfig: item
       },

package/packages/form/src/form-item.js

@@ -44,6 +44,7 @@ const renderItem = (h, _vm, item, slots) => {
   const { rules, data, collapseAll, validOpts, titleOverflow: allTitleOverflow } = _vm
   const { title, folding, visible, visibleMethod, field, collapseNode, itemRender, showError, errRule, className, titleOverflow } = item
   const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null
+  const itemClassName = compConf ? compConf.itemClassName : ''
   const span = item.span || _vm.span
   const align = item.align || _vm.align
   const titleAlign = item.titleAlign || _vm.titleAlign
@@ -54,7 +55,7 @@ const renderItem = (h, _vm, item, slots) => {
   const showTitle = itemOverflow === 'title'
   const showTooltip = itemOverflow === true || itemOverflow === 'tooltip'
   const hasEllipsis = showTitle || showTooltip || showEllipsis
-  const params = { data, property: field, item, $form: _vm }
+  const params = { data, field, property: field, item, $form: _vm }
   let isRequired
   if (!itemVisibleMethod && compConf && compConf.itemVisibleMethod) {
     itemVisibleMethod = compConf.itemVisibleMethod
@@ -82,13 +83,20 @@ const renderItem = (h, _vm, item, slots) => {
     mouseleave: _vm.handleTitleTipLeaveEvent
   } : {}
   return h('div', {
-    class: ['vxe-form--item', item.id, span ? `vxe-col--${span} is--span` : null, className ? (XEUtils.isFunction(className) ? className(params) : className) : '', {
-      'is--title': title,
-      'is--required': isRequired,
-      'is--hidden': visible === false || (folding && collapseAll),
-      'is--active': !itemVisibleMethod || itemVisibleMethod(params),
-      'is--error': showError
-    }]
+    class: [
+      'vxe-form--item',
+      item.id,
+      span ? `vxe-col--${span} is--span` : '',
+      className ? (XEUtils.isFunction(className) ? className(params) : className) : '',
+      itemClassName ? (XEUtils.isFunction(itemClassName) ? itemClassName(params) : itemClassName) : '',
+      {
+        'is--title': title,
+        'is--required': isRequired,
+        'is--hidden': visible === false || (folding && collapseAll),
+        'is--active': !itemVisibleMethod || itemVisibleMethod(params),
+        'is--error': showError
+      }
+    ]
   }, [
     h('div', {
       class: 'vxe-form--item-inner'

package/packages/form/src/form.js

@@ -7,6 +7,7 @@ import DomTools, { browse } from '../../tools/dom'
 import { createItem, handleFieldOrItem } from './util'
 import { errLog } from '../../tools/log'
 import VxeFormConfigItem from './form-config-item'
+import VxeLoading from '../../loading/index'
 
 class Rule {
   constructor (rule) {
@@ -166,15 +167,15 @@ export default {
         class: 'vxe-form-slots',
         ref: 'hideItem'
       }, customLayout ? [] : (defaultSlot ? defaultSlot.call(this, h, {}) : [])),
-      h('div', {
-        class: ['vxe-loading', {
-          'is--visible': loading
-        }]
-      }, [
-        h('div', {
-          class: 'vxe-loading--spinner'
-        })
-      ]),
+      /**
+       * 加载中
+       */
+      h(VxeLoading, {
+        class: 'vxe-form--loading',
+        props: {
+          loading
+        }
+      }),
       /**
        * 工具提示
        */

package/packages/form/src/render.js

@@ -26,7 +26,7 @@ export function renderTitle (h, _vm, item) {
   const { data, tooltipOpts } = _vm
   const { slots, field, itemRender, titlePrefix, titleSuffix } = item
   const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null
-  const params = { data, property: field, item, $form: _vm }
+  const params = { data, field, property: field, item, $form: _vm }
   const contVNs = []
   const titVNs = []
   if (titlePrefix) {

package/packages/grid/src/grid.js

@@ -173,7 +173,7 @@ export default {
       tZindex: 0,
       tablePage: {
         total: 0,
-        pageSize: 10,
+        pageSize: GlobalConfig.pager.pageSize || 10,
         currentPage: 1
       }
     }
@@ -226,7 +226,7 @@ export default {
         }
       }
       if (editConfig) {
-        tableProps.editConfig = Object.assign({}, editConfig, { activeMethod: this.handleActiveMethod })
+        tableProps.editConfig = Object.assign({}, editConfig, { beforeEditMethod: this.handleBeforeEditMethod })
       }
       return tableProps
     }
@@ -266,7 +266,7 @@ export default {
         warnLog('vxe.error.errProp', [`grid.toolbar-config=${this.toolbarConfig}`, 'grid.toolbar-config={}'])
       }
     }
-
+    this.initPages()
     GlobalEvent.on(this, 'keydown', this.handleGlobalKeydownEvent)
   },
   mounted () {
@@ -274,7 +274,6 @@ export default {
       this.loadColumn(this.columns)
     }
     this.initToolbar()
-    this.initPages()
     this.initProxy()
   },
   destroyed () {
@@ -400,10 +399,13 @@ export default {
       clss.push(rowClassName ? (XEUtils.isFunction(rowClassName) ? rowClassName(params) : rowClassName) : '')
       return clss
     },
-    handleActiveMethod (params) {
+    handleBeforeEditMethod (params) {
       const { editConfig } = this
-      const activeMethod = editConfig ? editConfig.activeMethod : null
-      return this.pendingRecords.indexOf(params.row) === -1 && (!activeMethod || activeMethod({ ...params, $grid: this }))
+      const beforeEditMethod = editConfig ? (editConfig.beforeEditMethod || editConfig.activeMethod) : null
+      if (this.pendingRecords.indexOf(params.row) === -1) {
+        return !beforeEditMethod || beforeEditMethod({ ...params, $grid: this })
+      }
+      return false
     },
     initToolbar () {
       this.$nextTick(() => {

package/packages/input/src/input.js

@@ -647,8 +647,10 @@ export default {
 
     // date、week、month、year
     dateConfig: Object,
-    minDate: { type: [String, Number, Date], default: () => GlobalConfig.input.minDate },
-    maxDate: { type: [String, Number, Date], default: () => GlobalConfig.input.maxDate },
+    startDate: { type: [String, Number, Date], default: () => GlobalConfig.input.startDate },
+    endDate: { type: [String, Number, Date], default: () => GlobalConfig.input.endDate },
+    minDate: [String, Number, Date],
+    maxDate: [String, Number, Date],
     // 已废弃 startWeek，被 startDay 替换
     startWeek: Number,
     startDay: { type: [String, Number], default: () => GlobalConfig.input.startDay },
@@ -725,24 +727,24 @@ export default {
       return this.clearable && (this.isPawdType || this.isNumType || this.isDatePickerType || this.type === 'text' || this.type === 'search')
     },
     isDisabledPrevDateBtn () {
-      const { selectMonth, dateMinTime } = this
+      const { selectMonth, dateStartTime } = this
       if (selectMonth) {
-        return selectMonth <= dateMinTime
+        return selectMonth <= dateStartTime
       }
       return false
     },
     isDisabledNextDateBtn () {
-      const { selectMonth, dateMaxTime } = this
+      const { selectMonth, dateEndTime } = this
       if (selectMonth) {
-        return selectMonth >= dateMaxTime
+        return selectMonth >= dateEndTime
       }
       return false
     },
-    dateMinTime () {
-      return this.minDate ? XEUtils.toStringDate(this.minDate) : null
+    dateStartTime () {
+      return this.startDate ? XEUtils.toStringDate(this.startDate) : null
     },
-    dateMaxTime () {
-      return this.maxDate ? XEUtils.toStringDate(this.maxDate) : null
+    dateEndTime () {
+      return this.endDate ? XEUtils.toStringDate(this.endDate) : null
     },
     supportMultiples () {
       return ['date', 'week', 'month', 'quarter', 'year'].includes(this.type)
@@ -948,9 +950,9 @@ export default {
         const selMonth = selectMonth.getMonth()
         const selDay = selectMonth.getDay()
         const prevOffsetDate = -weekDatas.indexOf(selDay)
-        const startDate = new Date(XEUtils.getWhatDay(selectMonth, prevOffsetDate).getTime() + hmsTime)
+        const startDayDate = new Date(XEUtils.getWhatDay(selectMonth, prevOffsetDate).getTime() + hmsTime)
         for (let index = 0; index < 42; index++) {
-          const date = XEUtils.getWhatDay(startDate, index)
+          const date = XEUtils.getWhatDay(startDayDate, index)
           const itemFullYear = date.getFullYear()
           const itemMonth = date.getMonth()
           const itemDate = date.getDate()
@@ -1652,7 +1654,9 @@ export default {
       this.dateTimeChangeEvent(evnt)
     },
     dateConfirmEvent () {
-      this.dateChange(this.dateValue || this.currentDate)
+      if (this.isDateTimeType || this.multiple) {
+        this.dateChange(this.dateValue || this.currentDate)
+      }
       this.hidePanel()
     },
     dateMinuteEvent (evnt, item) {

package/packages/list/src/list.js

@@ -4,6 +4,7 @@ import vSize from '../../mixins/size'
 import { createResizeEvent } from '../../tools/resize'
 import { GlobalEvent } from '../../tools/event'
 import { browse } from '../../tools/dom'
+import VxeLoading from '../../loading/index'
 
 export default {
   name: 'VxeList',
@@ -113,15 +114,15 @@ export default {
           }
         }, $scopedSlots.default ? $scopedSlots.default.call(this, { items, $list: this }, h) : [])
       ]),
-      h('div', {
-        class: ['vxe-list--loading vxe-loading', {
-          'is--visible': loading
-        }]
-      }, [
-        h('div', {
-          class: 'vxe-loading--spinner'
-        })
-      ])
+      /**
+       * 加载中
+       */
+      h(VxeLoading, {
+        class: 'vxe-list--loading',
+        props: {
+          loading
+        }
+      })
     ])
   },
   methods: {

package/packages/loading/index.js

@@ -0,0 +1,9 @@
+import VxeLoading from './src/loading'
+
+export const Loading = Object.assign(VxeLoading, {
+  install (Vue) {
+    Vue.component(VxeLoading.name, VxeLoading)
+  }
+})
+
+export default VxeLoading

package/packages/loading/src/loading.js

@@ -0,0 +1,31 @@
+import GlobalConfig from '../../v-x-e-table/src/conf'
+
+export default {
+  name: 'VxeLoading',
+  props: {
+    loading: Boolean
+  },
+  render (h) {
+    const icon = GlobalConfig.icon.LOADING
+    const loadingText = GlobalConfig.loadingText
+    const text = loadingText === null ? loadingText : GlobalConfig.i18n('vxe.loading.text')
+    return h('div', {
+      class: ['vxe-loading', {
+        'is--visible': this.loading
+      }]
+    }, [
+      h('div', {
+        class: 'vxe-loading--chunk'
+      }, [
+        icon ? h('i', {
+          class: icon
+        }) : h('div', {
+          class: 'vxe-loading--spinner'
+        }),
+        text ? h('div', {
+          class: 'vxe-loading--text'
+        }, `${text}`) : null
+      ])
+    ])
+  }
+}

package/packages/locale/lang/en-US.js

@@ -1,5 +1,8 @@
 export default {
   vxe: {
+    loading: {
+      text: 'Loading'
+    },
     error: {
       groupFixed: 'If you use group headers, the fixed columns must be set by group.',
       groupMouseRange: 'Grouping headers and "{0}" cannot be used at the same time, which may cause errors.',
@@ -146,6 +149,8 @@ export default {
       operError: 'Error occurred, operation failed!'
     },
     select: {
+      search: 'Search',
+      loadingText: 'Loading',
       emptyText: 'No Data'
     },
     pager: {

package/packages/locale/lang/ja-JP.js

@@ -1,5 +1,8 @@
 export default {
   vxe: {
+    loading: {
+      text: 'Loading'
+    },
     error: {
       groupFixed: 'グループのヘッダを使用すると、固定列はグループで設定しなければなりません',
       groupMouseRange: 'グループ化ヘッダーと「{0}」は同時に使用できません。これによりエラーが発生する可能性があります',
@@ -146,6 +149,8 @@ export default {
       operError: 'エラーが発生しました。操作が失敗しました'
     },
     select: {
+      search: 'Search',
+      loadingText: 'Loading',
       emptyText: 'データがありません'
     },
     pager: {

package/packages/locale/lang/zh-CN.js

@@ -1,5 +1,8 @@
 export default {
   vxe: {
+    loading: {
+      text: '加载中'
+    },
     error: {
       groupFixed: '如果使用分组表头，固定列必须按组设置',
       groupMouseRange: '分组表头与 "{0}" 不能同时使用，这可能会出现错误',
@@ -146,6 +149,8 @@ export default {
       operError: '发生错误，操作失败！'
     },
     select: {
+      search: '搜索',
+      loadingText: '加载中',
       emptyText: '暂无数据'
     },
     pager: {

package/packages/locale/lang/zh-TC.js

@@ -1,5 +1,8 @@
 export default {
   vxe: {
+    loading: {
+      text: '加載中'
+    },
     error: {
       groupFixed: '如果使用分組表頭，固定列必須按組設定',
       groupMouseRange: '分组表頭與 "{0}" 不能同時使用，這可能會出現錯誤',
@@ -146,6 +149,8 @@ export default {
       operError: '發生錯誤，操作失敗！'
     },
     select: {
+      search: '蒐索',
+      loadingText: '加載中',
       emptyText: '暫無資料'
     },
     pager: {