vxe-table 3.11.32 → 3.11.34

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

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Preview',
       operBtn: {

package/packages/locale/lang/es-ES.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Preview',
       operBtn: {

package/packages/locale/lang/fr-FR.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

package/packages/locale/lang/hu-HU.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Előnézet',
       operBtn: {

package/packages/locale/lang/hy-AM.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

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

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Preview',
       operBtn: {

package/packages/locale/lang/ko-KR.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

package/packages/locale/lang/nb-NO.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

package/packages/locale/lang/pt-BR.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Preview',
       operBtn: {

package/packages/locale/lang/ru-RU.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'Предварительный просмотр',
       operBtn: {

package/packages/locale/lang/ug-CN.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: 'كۆرۈش',
       operBtn: {

package/packages/locale/lang/uk-UA.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

package/packages/locale/lang/vi-VN.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '$'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

package/packages/locale/lang/zh-CHT.ts

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '￥'
+    },
     imagePreview: {
       popupTitle: '預覽',
       operBtn: {

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

@@ -289,6 +289,9 @@ export default {
         }
       }
     },
+    numberInput: {
+      currencySymbol: '￥'
+    },
     imagePreview: {
       popupTitle: '预览',
       operBtn: {

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

@@ -869,8 +869,9 @@ export default {
     }
   },
   render (this: any, h: CreateElement) {
-    const { $xetable } = this
-    const { customOpts } = $xetable
+    const $xeTable = this.$xeTable
+
+    const customOpts = $xeTable.computeCustomOpts
     if (['modal', 'drawer', 'popup'].includes(`${customOpts.mode}`)) {
       return renderPopupPanel(h, this)
     }
@@ -953,8 +954,10 @@ export default {
       }
     },
     handleOptionCheck (column: any) {
-      const { $xetable } = this
-      const { customColumnList } = $xetable
+      const $xeTable = this.$xeTable
+      const reactData = $xeTable
+
+      const { customColumnList } = reactData
       const matchObj = XEUtils.findTree(customColumnList, item => item === column) as any
       if (matchObj && matchObj.parent) {
         const { parent } = matchObj
@@ -966,10 +969,10 @@ export default {
       }
     },
     changeCheckboxOption (column: any) {
-      const $xeTable = this.$xetable
+      const $xeTable = this.$xeTable
       const reactData = $xeTable
 
-      const { customOpts } = $xeTable.customOpts
+      const customOpts = $xeTable.computeCustomOpts
       const isChecked = !column.renderVisible
       if (customOpts.immediate) {
         XEUtils.eachTree([column], (item) => {

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

@@ -49,7 +49,7 @@ function getSeq ($xetable: any, cellValue: any, row: any, $rowIndex: any, column
 }
 
 function defaultFilterExportColumn (column: any) {
-  return column.property || ['seq', 'checkbox', 'radio'].indexOf(column.type) > -1
+  return column.field || ['seq', 'checkbox', 'radio'].indexOf(column.type) > -1
 }
 
 function toTableBorder (border: any) {
@@ -220,7 +220,7 @@ function getBooleanValue (cellValue: any) {
 function getHeaderTitle ($xetable: any, opts: any, column: any) {
   const { columnOpts } = $xetable
   const headExportMethod = column.headerExportMethod || columnOpts.headerExportMethod
-  return headExportMethod ? headExportMethod({ column, options: opts, $table: $xetable }) : ((opts.original ? column.property : column.getTitle()) || '')
+  return headExportMethod ? headExportMethod({ column, options: opts, $table: $xetable }) : ((opts.original ? column.field : column.getTitle()) || '')
 }
 
 function getFooterCellValue ($xetable: any, opts: any, row: any, column: any) {
@@ -776,7 +776,7 @@ function parseXML (columns: any, content: any) {
 function checkImportData (columns: any[], fields: any[]) {
   const tableFields: any[] = []
   columns.forEach((column) => {
-    const field = column.property
+    const field = column.field
     if (field) {
       tableFields.push(field)
     }
@@ -1083,13 +1083,13 @@ function handleExportAndPrint ($xetable: any, options: any, isPrint?: any) {
           } else {
             const colid = item.id || item.colId
             const type = item.type
-            const field = item.property || item.field
+            const field = item.field
             if (colid) {
               return column.id === colid
             } else if (field && type) {
-              return column.property === field && column.type === type
+              return column.field === field && column.type === type
             } else if (field) {
-              return column.property === field
+              return column.field === field
             } else if (type) {
               return column.type === type
             }
@@ -1219,13 +1219,26 @@ export default {
       }, exportOpts, {
         print: false
       }, options)
-      const { type, mode, columns, original, beforeExportMethod } = opts
+      const { type, mode, columns, original, beforeExportMethod, excludeFields, includeFields } = opts
       let groups = []
       const customCols = columns && columns.length ? columns : null
       // 如果设置源数据，则默认导出设置了字段的列
       let columnFilterMethod = opts.columnFilterMethod
       if (!customCols && !columnFilterMethod) {
-        columnFilterMethod = original ? ({ column }: any) => column.property : ({ column }: any) => defaultFilterExportColumn(column)
+        columnFilterMethod = ({ column }: any) => {
+          if (excludeFields) {
+            if (XEUtils.includes(excludeFields, column.field)) {
+              return false
+            }
+          }
+          if (includeFields) {
+            if (XEUtils.includes(includeFields, column.field)) {
+              return true
+            }
+            return false
+          }
+          return original ? column.field : defaultFilterExportColumn(column)
+        }
       }
       if (customCols) {
         opts._isCustomColumn = true
@@ -1240,11 +1253,11 @@ export default {
               } else {
                 const colid = item.id || item.colId
                 const type = item.type
-                const field = item.property || item.field
+                const field = item.field
                 if (colid) {
                   targetColumn = this.getColumnById(colid)
                 } else if (field && type) {
-                  targetColumn = tableFullColumn.find((column: any) => column.property === field && column.type === type)
+                  targetColumn = tableFullColumn.find((column: any) => column.field === field && column.type === type)
                 } else if (field) {
                   targetColumn = this.getColumnByField(field)
                 } else if (type) {

package/packages/table/render/index.ts

@@ -589,7 +589,8 @@ renderer.mixin({
     renderTableCell (h, renderOpts, params) {
       const { props = {} } = renderOpts
       const { row, column } = params
-      const digits = props.digits || getConfig().input?.digits || 2
+      const inputConfig = getConfig().input || {}
+      const digits = props.digits || inputConfig.digits || 2
       let cellValue = XEUtils.get(row, column.field)
       if (cellValue) {
         switch (props.type) {
@@ -620,12 +621,17 @@ renderer.mixin({
       const { type } = props
       let cellValue = XEUtils.get(row, column.field)
       if (cellValue) {
+        const numberInputConfig = getConfig().numberInput || {}
         if (type === 'float') {
-          const digits = props.digits || getConfig().numberInput.digits || 1
+          const digits = props.digits || numberInputConfig.digits || 1
           cellValue = XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits)
         } else if (type === 'amount') {
-          const digits = props.digits || getConfig().numberInput.digits || 2
+          const digits = props.digits || numberInputConfig.digits || 2
           cellValue = XEUtils.commafy(XEUtils.toNumber(cellValue), { digits })
+          const showCurrency = props.showCurrency
+          if (XEUtils.isBoolean(showCurrency) ? showCurrency : numberInputConfig.showCurrency) {
+            cellValue = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n('vxe.numberInput.currencySymbol') || ''}${cellValue}`
+          }
         }
       }
       return getCellLabelVNs(h, renderOpts, params, cellValue)
@@ -637,11 +643,12 @@ renderer.mixin({
       // 兼容老模式
       const cellValue = XEUtils.isArray(row) ? row[_columnIndex] : XEUtils.get(row, column.field)
       if (XEUtils.isNumber(cellValue)) {
+        const numberInputConfig = getConfig().numberInput || {}
         if (type === 'float') {
-          const digits = props.digits || getConfig().numberInput.digits || 1
+          const digits = props.digits || numberInputConfig.digits || 1
           return XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits)
         } else if (type === 'amount') {
-          const digits = props.digits || getConfig().numberInput.digits || 2
+          const digits = props.digits || numberInputConfig.digits || 2
           return XEUtils.commafy(XEUtils.toNumber(cellValue), { digits })
         }
       }
@@ -649,7 +656,12 @@ renderer.mixin({
     },
     renderTableDefault: defaultEditRender,
     renderTableFilter: defaultFilterRender,
-    tableFilterDefaultMethod: handleInputFilterMethod
+    tableFilterDefaultMethod: handleInputFilterMethod,
+    tableExportMethod (params) {
+      const { row, column } = params
+      const cellValue = XEUtils.get(row, column.field)
+      return cellValue
+    }
   },
   VxeDatePicker: {
     tableAutoFocus: 'input',

package/packages/table/src/body.ts

@@ -310,6 +310,7 @@ function renderColumn (h: any, _vm: any, $xetable: any, seq: any, rowid: any, fi
       )
     }
   }
+  const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
 
   return h('td', {
     class: [
@@ -323,6 +324,7 @@ function renderColumn (h: any, _vm: any, $xetable: any, seq: any, rowid: any, fi
         'col--tree-node': treeNode,
         'col--edit': isEdit,
         'col--ellipsis': hasEllipsis,
+        'fixed--width': !isAutoCellWidth,
         'fixed--hidden': fixedHiddenColumn,
         'is--drag-cell': isColDragCell,
         'is--drag-disabled': isDisabledDrag,
@@ -345,6 +347,8 @@ function renderColumn (h: any, _vm: any, $xetable: any, seq: any, rowid: any, fi
 }
 
 function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any, tableData: any, tableColumn: any) {
+  const columnOpts = $xeTable.computeColumnOpts
+  const columnDragOpts = $xeTable.computeColumnDragOpts
   const {
     stripe,
     rowKey,
@@ -367,7 +371,6 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
     fullAllDataRowIdData,
     rowOpts,
     pendingRowMaps,
-    columnOpts,
     isDragColMove
   } = $xeTable
   const { transform, seqMode } = treeOpts
@@ -453,7 +456,7 @@ function renderRows (h: CreateElement, _vm: any, $xeTable: any, fixedType: any,
       return renderColumn(h, _vm, $xeTable, seq, rowid, fixedType, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData)
     })
     rows.push(
-      columnOpts.drag
+      columnOpts.drag && columnDragOpts.animation
         ? h('transition-group', {
           props: {
             tag: 'tr',
@@ -578,7 +581,10 @@ export default {
     const $xeTable = this.$parent
 
     const { _e, $parent: $xetable, fixedColumn, fixedType } = this
-    let { $scopedSlots, tId, tableData, tableColumn, visibleColumn, expandColumn, showOverflow: allColumnOverflow, keyboardConfig, keyboardOpts, mergeList, spanMethod, scrollXLoad, scrollYLoad, isAllOverflow, emptyOpts, mouseConfig, mouseOpts, sYOpts, rowOpts, isDragRowMove } = $xetable
+
+    const rowOpts = $xeTable.computeRowOpts
+    const rowDragOpts = $xeTable.computeRowDragOpts
+    let { $scopedSlots, tId, tableData, tableColumn, visibleColumn, expandColumn, showOverflow: allColumnOverflow, keyboardConfig, keyboardOpts, mergeList, spanMethod, scrollXLoad, scrollYLoad, isAllOverflow, emptyOpts, mouseConfig, mouseOpts, sYOpts, isDragRowMove } = $xetable
     // 如果是使用优化模式
     if (fixedType) {
       // 如果存在展开行使用全量渲染
@@ -664,7 +670,7 @@ export default {
         /**
          * 内容
          */
-        rowOpts.drag
+        rowOpts.drag && rowDragOpts.animation
           ? h('transition-group', {
             props: {
               tag: 'tbody',

package/packages/table/src/footer.ts

@@ -120,11 +120,14 @@ function renderRows (h: CreateElement, _vm: any, tableColumn: VxeTableDefines.Co
         attrs.colspan = colspan
       }
     }
+    const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
+
     return h('td', {
       class: ['vxe-footer--column', column.id, {
         [`col--${footAlign}`]: footAlign,
         [`col--${type}`]: type,
         'col--last': $columnIndex === tableColumn.length - 1,
+        'fixed--width': !isAutoCellWidth,
         'fixed--hidden': fixedHiddenColumn,
         'col--ellipsis': hasEllipsis,
         'col--current': currentColumn === column
@@ -153,15 +156,19 @@ function renderRows (h: CreateElement, _vm: any, tableColumn: VxeTableDefines.Co
 }
 
 function renderHeads (h: CreateElement, _vm: any, footerTableData: any[]) {
+  const $xeTable = _vm.$parent
+
+  const columnOpts = $xeTable.computeColumnOpts
+  const columnDragOpts = $xeTable.computeColumnDragOpts
+
   const { $parent: $xetable, fixedType, tableColumn } = _vm
   const { footerRowClassName, footerRowStyle, isDragColMove } = $xetable
-  const columnOpts = $xetable.columnOpts
 
   return footerTableData.map((row: any, $rowIndex: any) => {
     const _rowIndex = $rowIndex
     const rowParams = { $table: $xetable, row, _rowIndex, $rowIndex, fixed: fixedType, type: renderType }
 
-    if (columnOpts.drag) {
+    if (columnOpts.drag && columnDragOpts.animation) {
       return h('transition-group', {
         props: {
           tag: 'tr',

package/packages/table/src/header.ts

@@ -69,6 +69,8 @@ const renderRows = (h: CreateElement, _vm: any, cols: VxeTableDefines.ColumnInfo
         thOns.mouseup = $xeTable.handleHeaderCellDragMouseupEvent
       }
     }
+    const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
+
     return h('th', {
       class: ['vxe-header--column', colid, {
         [`col--${headAlign}`]: headAlign,
@@ -77,6 +79,7 @@ const renderRows = (h: CreateElement, _vm: any, cols: VxeTableDefines.ColumnInfo
         'col--fixed': column.fixed,
         'col--group': isColGroup,
         'col--ellipsis': hasEllipsis,
+        'fixed--width': !isAutoCellWidth,
         'fixed--hidden': fixedHiddenColumn,
         'is--sortable': column.sortable,
         'col--filter': !!column.filters,
@@ -121,18 +124,21 @@ const renderRows = (h: CreateElement, _vm: any, cols: VxeTableDefines.ColumnInfo
 }
 
 function renderHeads (h: CreateElement, _vm: any, headerGroups: any[]) {
-  const { $parent: $xetable } = _vm
-  const tableProps = $xetable
+  const $xeTable = _vm.$parent
+  const tableProps = $xeTable
 
   const { fixedType } = _vm
+
+  const columnOpts = $xeTable.computeColumnOpts
+  const columnDragOpts = $xeTable.computeColumnDragOpts
+
   const { headerRowClassName, headerRowStyle } = tableProps
-  const { isDragColMove } = $xetable
-  const columnOpts = $xetable.columnOpts
+  const { isDragColMove } = $xeTable
 
   return headerGroups.map((cols: any, $rowIndex: any) => {
-    const params = { $table: $xetable, $rowIndex, fixed: fixedType, type: cellType }
+    const params = { $table: $xeTable, $rowIndex, fixed: fixedType, type: cellType }
 
-    if (columnOpts.drag) {
+    if (columnOpts.drag && columnDragOpts.animation) {
       return h('transition-group', {
         props: {
           tag: 'tr',

package/packages/ui/index.ts

@@ -48,10 +48,12 @@ VxeUI.setConfig({
       strict: true
     },
     rowDragConfig: {
-      showIcon: true
+      showIcon: true,
+      animation: true
     },
     columnDragConfig: {
-      showIcon: true
+      showIcon: true,
+      animation: true
     },
     checkboxConfig: {
       // trigger: 'default',

package/styles/components/table.scss

@@ -60,6 +60,96 @@
 }
 
 /*默认的渲染*/
+.vxe-header--column,
+.vxe-footer--column {
+  &.fixed--width {
+    & > .vxe-cell {
+      .vxe-default-input,
+      .vxe-default-textarea,
+      .vxe-default-select {
+        width: 100%;
+      }
+      .vxe-input,
+      .vxe-textarea,
+      .vxe-select,
+      .vxe-tree-select,
+      .vxe-date-picker,
+      .vxe-number-input,
+      .vxe-ico-picker {
+        width: 100%;
+      }
+      .vxe-cell--tree-node {
+        .vxe-input,
+        .vxe-textarea,
+        .vxe-select,
+        .vxe-tree-select,
+        .vxe-date-picker,
+        .vxe-number-input,
+        .vxe-ico-picker {
+          width: 100%;
+        }
+      }
+    }
+  }
+}
+.vxe-body--column {
+  &.fixed--width {
+    & > .vxe-cell {
+      & > .vxe-default-input,
+      & > .vxe-default-textarea,
+      & > .vxe-default-select {
+        width: 100%;
+      }
+      & > .vxe-input,
+      & > .vxe-textarea,
+      & > .vxe-select,
+      & > .vxe-tree-select,
+      & > .vxe-date-picker,
+      & > .vxe-number-input,
+      & > .vxe-ico-picker {
+        width: 100%;
+      }
+      & > .vxe-cell--tree-node {
+        .vxe-input,
+        .vxe-textarea,
+        .vxe-select,
+        .vxe-tree-select,
+        .vxe-date-picker,
+        .vxe-number-input,
+        .vxe-ico-picker {
+          width: 100%;
+        }
+      }
+    }
+  }
+}
+.vxe-table--filter-template {
+  & > .vxe-default-input,
+  & > .vxe-default-textarea,
+  & > .vxe-default-select {
+    width: 100%;
+  }
+  & > .vxe-input,
+  & > .vxe-textarea,
+  & > .vxe-select,
+  & > .vxe-tree-select,
+  & > .vxe-date-picker,
+  & > .vxe-number-input,
+  & > .vxe-ico-picker {
+    width: 100%;
+  }
+  & > .vxe-cell--tree-node {
+    .vxe-input,
+    .vxe-textarea,
+    .vxe-select,
+    .vxe-tree-select,
+    .vxe-date-picker,
+    .vxe-number-input,
+    .vxe-ico-picker {
+      width: 100%;
+    }
+  }
+}
 .vxe-cell,
 .vxe-table--filter-template {
   .vxe-default-input,
@@ -71,7 +161,6 @@
   .vxe-default-select {
     outline: 0;
     padding: 0 2px;
-    width: 100%;
     color: var(--vxe-ui-font-color);
     border-radius: var(--vxe-ui-border-radius);
     border: 1px solid var(--vxe-ui-input-border-color);
@@ -107,15 +196,6 @@
       height: var(--vxe-ui-input-height-default);
     }
   }
-  & > .vxe-input,
-  & > .vxe-textarea,
-  & > .vxe-select,
-  & > .vxe-tree-select,
-  & > .vxe-date-picker,
-  & > .vxe-number-input,
-  & > .vxe-ico-picker {
-    width: 100%;
-  }
   & > .vxe-input > .vxe-input--inner,
   & > .vxe-textarea > .vxe-textarea--inner {
     padding: 0 2px;
@@ -125,15 +205,6 @@
     resize: none;
   }
   & > .vxe-cell--tree-node {
-    .vxe-input,
-    .vxe-textarea,
-    .vxe-select,
-    .vxe-tree-select,
-    .vxe-date-picker,
-    .vxe-number-input,
-    .vxe-ico-picker {
-      width: 100%;
-    }
     .vxe-input > .vxe-input--inner,
     .vxe-textarea > .vxe-textarea--inner {
       padding: 0 2px;