vxe-table 4.7.5 → 4.7.7

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

@@ -4,7 +4,7 @@ import { formatText } from '../../../ui/src/utils'
 import { addClass, removeClass } from '../../../ui/src/dom'
 import XEUtils from 'xe-utils'
 
-import type { VxeTableDefines, VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeColumnPropTypes, VxeModalComponent, VxeButtonComponent, VxeRadioGroupComponent, VxeTooltipComponent } from '../../../../types'
+import type { VxeTableDefines, VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeColumnPropTypes, VxeModalComponent, VxeButtonComponent, VxeRadioGroupComponent, VxeTooltipComponent, VxeInputComponent } from '../../../../types'
 
 const { getI18n, getIcon } = VxeUI
 
@@ -46,10 +46,6 @@ export default defineComponent({
       }, 300)
     }
 
-    const getStoreData = (): VxeTableDefines.CustomStoreData => {
-      return {}
-    }
-
     const handleSaveStore = (type: 'confirm' | 'reset') => {
       const { id } = tableProps
       const customOpts = computeCustomOpts.value
@@ -58,18 +54,35 @@ export default defineComponent({
         updateStore({
           id,
           type,
-          storeData: getStoreData()
+          storeData: $xeTable.getCustomStoreData()
         })
       }
     }
 
     const confirmCustomEvent = (evnt: Event) => {
       const { customColumnList } = reactData
-      customColumnList.forEach((column, index) => {
-        const sortIndex = index + 1
-        column.renderSortNumber = sortIndex
-        column.fixed = column.renderFixed
-        column.visible = column.renderVisible
+      const customOpts = computeCustomOpts.value
+      const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts
+      XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => {
+        if (!parent) {
+          if (allowSort) {
+            const sortIndex = index + 1
+            column.renderSortNumber = sortIndex
+          }
+          if (allowFixed) {
+            column.fixed = column.renderFixed
+          }
+        }
+        if (allowResizable) {
+          if (column.renderVisible && (!column.children || column.children.length)) {
+            if (column.renderResizeWidth !== column.renderWidth) {
+              column.resizeWidth = column.renderResizeWidth
+            }
+          }
+        }
+        if (allowVisible) {
+          column.visible = column.renderVisible
+        }
       })
       $xeTable.closeCustom()
       $xeTable.emitCustomEvent('confirm', evnt)
@@ -80,15 +93,26 @@ export default defineComponent({
       const { customStore } = props
       const { customColumnList } = reactData
       const { oldSortMaps, oldFixedMaps, oldVisibleMaps } = customStore
+      const customOpts = computeCustomOpts.value
+      const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts
       XEUtils.eachTree(customColumnList, column => {
         const colid = column.getKey()
         const visible = !!oldVisibleMaps[colid]
         const fixed = oldFixedMaps[colid] || ''
-        column.renderVisible = visible
-        column.visible = visible
-        column.renderFixed = fixed
-        column.fixed = fixed
-        column.renderSortNumber = oldSortMaps[colid] || 0
+        if (allowVisible) {
+          column.renderVisible = visible
+          column.visible = visible
+        }
+        if (allowFixed) {
+          column.renderFixed = fixed
+          column.fixed = fixed
+        }
+        if (allowSort) {
+          column.renderSortNumber = oldSortMaps[colid] || 0
+        }
+        if (allowResizable) {
+          column.renderResizeWidth = column.renderWidth
+        }
       }, { children: 'children' })
       $xeTable.closeCustom()
       $xeTable.emitCustomEvent('cancel', evnt)
@@ -98,7 +122,7 @@ export default defineComponent({
       $xeTable.resetColumn(true)
       $xeTable.closeCustom()
       $xeTable.emitCustomEvent('reset', evnt)
-      handleSaveStore('confirm')
+      handleSaveStore('reset')
     }
 
     const resetCustomEvent = (evnt: Event) => {
@@ -289,7 +313,7 @@ export default defineComponent({
       const { customColumnList } = reactData
       const customOpts = computeCustomOpts.value
       const { maxHeight } = customStore
-      const { checkMethod, visibleMethod, allowSort, allowFixed, trigger } = customOpts
+      const { checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, trigger, placement } = customOpts
       const isMaxFixedColumn = computeIsMaxFixedColumn.value
       const colVNs: VNode[] = []
       const customWrapperOns: any = {}
@@ -317,23 +341,25 @@ export default defineComponent({
               onDragend: sortDragendEvent,
               onDragover: sortDragoverEvent
             }, [
-              h('div', {
-                class: ['vxe-table-custom--checkbox-option', {
-                  'is--checked': isChecked,
-                  'is--indeterminate': isIndeterminate,
-                  'is--disabled': isDisabled
-                }],
-                title: getI18n('vxe.custom.setting.colVisible'),
-                onClick: () => {
-                  if (!isDisabled) {
-                    changeCheckboxOption(column)
+              allowVisible
+                ? h('div', {
+                  class: ['vxe-table-custom--checkbox-option', {
+                    'is--checked': isChecked,
+                    'is--indeterminate': isIndeterminate,
+                    'is--disabled': isDisabled
+                  }],
+                  title: getI18n('vxe.custom.setting.colVisible'),
+                  onClick: () => {
+                    if (!isDisabled) {
+                      changeCheckboxOption(column)
+                    }
                   }
-                }
-              }, [
-                h('span', {
-                  class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
-                })
-              ]),
+                }, [
+                  h('span', {
+                    class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
+                  })
+                ])
+                : createCommentVNode(),
               allowSort && column.level === 1
                 ? h('div', {
                   class: 'vxe-table-custom--sort-option'
@@ -389,9 +415,14 @@ export default defineComponent({
       return h('div', {
         ref: refElem,
         key: 'simple',
-        class: ['vxe-table-custom-wrapper', {
+        class: ['vxe-table-custom-wrapper', `placement--${placement}`, {
           'is--active': customStore.visible
-        }]
+        }],
+        style: maxHeight && !['left', 'right'].includes(placement as string)
+          ? {
+              maxHeight: `${maxHeight}px`
+            }
+          : {}
       }, customStore.visible
         ? [
             h('ul', {
@@ -400,21 +431,25 @@ export default defineComponent({
               h('li', {
                 class: 'vxe-table-custom--option'
               }, [
-                h('div', {
-                  class: ['vxe-table-custom--checkbox-option', {
-                    'is--checked': isAllChecked,
-                    'is--indeterminate': isAllIndeterminate
-                  }],
-                  title: getI18n('vxe.table.allTitle'),
-                  onClick: allCustomEvent
-                }, [
-                  h('span', {
-                    class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
-                  }),
-                  h('span', {
+                allowVisible
+                  ? h('div', {
+                    class: ['vxe-table-custom--checkbox-option', {
+                      'is--checked': isAllChecked,
+                      'is--indeterminate': isAllIndeterminate
+                    }],
+                    title: getI18n('vxe.table.allTitle'),
+                    onClick: allCustomEvent
+                  }, [
+                    h('span', {
+                      class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
+                    }),
+                    h('span', {
+                      class: 'vxe-checkbox--label'
+                    }, getI18n('vxe.toolbar.customAll'))
+                  ])
+                  : h('span', {
                     class: 'vxe-checkbox--label'
-                  }, getI18n('vxe.toolbar.customAll'))
-                ])
+                  }, getI18n('vxe.table.customTitle'))
               ])
             ]),
             h('div', {
@@ -425,11 +460,6 @@ export default defineComponent({
                 class: 'vxe-table-custom--body',
                 name: 'vxe-table-custom--list',
                 tag: 'ul',
-                style: maxHeight
-                  ? {
-                      maxHeight: `${maxHeight}px`
-                    }
-                  : {},
                 ...customWrapperOns
               }, {
                 default: () => colVNs
@@ -467,7 +497,7 @@ export default defineComponent({
       const { customStore } = props
       const { customColumnList } = reactData
       const customOpts = computeCustomOpts.value
-      const { allowSort, allowFixed, checkMethod, visibleMethod } = customOpts
+      const { allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts
       const columnOpts = computeColumnOpts.value
       const isMaxFixedColumn = computeIsMaxFixedColumn.value
       const trVNs: VNode[] = []
@@ -490,27 +520,29 @@ export default defineComponent({
               onDragend: sortDragendEvent,
               onDragover: sortDragoverEvent
             }, [
-              h('td', {
-                class: 'vxe-table-custom-popup--column-item col--visible'
-              }, [
-                h('div', {
-                  class: ['vxe-table-custom--checkbox-option', {
-                    'is--checked': isChecked,
-                    'is--indeterminate': isIndeterminate,
-                    'is--disabled': isDisabled
-                  }],
-                  title: getI18n('vxe.custom.setting.colVisible'),
-                  onClick: () => {
-                    if (!isDisabled) {
-                      changeCheckboxOption(column)
-                    }
-                  }
+              allowVisible
+                ? h('td', {
+                  class: 'vxe-table-custom-popup--column-item col--visible'
                 }, [
-                  h('span', {
-                    class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
-                  })
+                  h('div', {
+                    class: ['vxe-table-custom--checkbox-option', {
+                      'is--checked': isChecked,
+                      'is--indeterminate': isIndeterminate,
+                      'is--disabled': isDisabled
+                    }],
+                    title: getI18n('vxe.custom.setting.colVisible'),
+                    onClick: () => {
+                      if (!isDisabled) {
+                        changeCheckboxOption(column)
+                      }
+                    }
+                  }, [
+                    h('span', {
+                      class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
+                    })
+                  ])
                 ])
-              ]),
+                : createCommentVNode(),
               allowSort
                 ? h('td', {
                   class: 'vxe-table-custom-popup--column-item col--sort'
@@ -526,7 +558,7 @@ export default defineComponent({
                         class: getIcon().TABLE_CUSTOM_SORT
                       })
                     ])
-                    : null
+                    : h('span', '-')
                 ])
                 : createCommentVNode(),
               h('td', {
@@ -537,12 +569,29 @@ export default defineComponent({
                   title: colTitle
                 }, colTitle)
               ]),
+              allowResizable
+                ? h('td', {
+                  class: 'vxe-table-custom-popup--column-item col--resizable'
+                }, [
+                  !isChecked || (column.children && column.children.length)
+                    ? h('span', '-')
+                    : h(resolveComponent('vxe-input') as VxeInputComponent, {
+                      type: 'integer',
+                      min: 40,
+                      modelValue: column.renderResizeWidth,
+                      'onUpdate:modelValue' (value: any) {
+                        column.renderResizeWidth = Math.max(40, Number(value))
+                      }
+                    })
+                ])
+                : createCommentVNode(),
               allowFixed
                 ? h('td', {
                   class: 'vxe-table-custom-popup--column-item col--fixed'
                 }, [
-                  !parent
-                    ? h(resolveComponent('vxe-radio-group') as VxeRadioGroupComponent, {
+                  parent
+                    ? h('span', '-')
+                    : h(resolveComponent('vxe-radio-group') as VxeRadioGroupComponent, {
                       modelValue: column.renderFixed || '',
                       type: 'button',
                       size: 'mini',
@@ -558,7 +607,6 @@ export default defineComponent({
                       //   changePopupFixedOption(column)
                       // }
                     })
-                    : null
                 ])
                 : createCommentVNode()
             ])
@@ -572,10 +620,10 @@ export default defineComponent({
         className: 'vxe-table-custom-popup-wrapper vxe-table--ignore-clear',
         modelValue: customStore.visible,
         title: getI18n('vxe.custom.cstmTitle'),
-        width: '40vw',
-        minWidth: 520,
-        height: '50vh',
-        minHeight: 300,
+        width: 700,
+        minWidth: 700,
+        height: 400,
+        minHeight: 400,
         mask: true,
         lockView: true,
         showFooter: true,
@@ -596,11 +644,13 @@ export default defineComponent({
             }, [
               h('table', {}, [
                 h('colgroup', {}, [
-                  h('col', {
-                    style: {
-                      width: '80px'
-                    }
-                  }),
+                  allowVisible
+                    ? h('col', {
+                      style: {
+                        width: '80px'
+                      }
+                    })
+                    : createCommentVNode(),
                   allowSort
                     ? h('col', {
                       style: {
@@ -613,6 +663,13 @@ export default defineComponent({
                       minWidth: '120px'
                     }
                   }),
+                  allowResizable
+                    ? h('col', {
+                      style: {
+                        width: '140px'
+                      }
+                    })
+                    : createCommentVNode(),
                   allowFixed
                     ? h('col', {
                       style: {
@@ -623,23 +680,25 @@ export default defineComponent({
                 ]),
                 h('thead', {}, [
                   h('tr', {}, [
-                    h('th', {}, [
-                      h('div', {
-                        class: ['vxe-table-custom--checkbox-option', {
-                          'is--checked': isAllChecked,
-                          'is--indeterminate': isAllIndeterminate
-                        }],
-                        title: getI18n('vxe.table.allTitle'),
-                        onClick: allCustomEvent
-                      }, [
-                        h('span', {
-                          class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
-                        }),
-                        h('span', {
-                          class: 'vxe-checkbox--label'
-                        }, getI18n('vxe.toolbar.customAll'))
+                    allowVisible
+                      ? h('th', {}, [
+                        h('div', {
+                          class: ['vxe-table-custom--checkbox-option', {
+                            'is--checked': isAllChecked,
+                            'is--indeterminate': isAllIndeterminate
+                          }],
+                          title: getI18n('vxe.table.allTitle'),
+                          onClick: allCustomEvent
+                        }, [
+                          h('span', {
+                            class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
+                          }),
+                          h('span', {
+                            class: 'vxe-checkbox--label'
+                          }, getI18n('vxe.toolbar.customAll'))
+                        ])
                       ])
-                    ]),
+                      : createCommentVNode(),
                     allowSort
                       ? h('th', {}, [
                         h('span', {
@@ -658,6 +717,9 @@ export default defineComponent({
                       ])
                       : createCommentVNode(),
                     h('th', {}, getI18n('vxe.custom.setting.colTitle')),
+                    allowResizable
+                      ? h('th', {}, getI18n('vxe.custom.setting.colResizable'))
+                      : createCommentVNode(),
                     allowFixed
                       ? h('th', {}, getI18n('vxe.custom.setting.colFixed', [columnOpts.maxFixedSize || 0]))
                       : createCommentVNode()

package/packages/table/module/edit/hook.ts

@@ -4,10 +4,11 @@ import { VxeUI } from '../../../ui'
 import { isEnableConf } from '../../../ui/src/utils'
 import { getCellValue, setCellValue, getRowid } from '../../src/util'
 import { browse, removeClass, addClass } from '../../../ui/src/dom'
+import { warnLog, errLog } from '../../../ui/src/log'
 
 import type { TableEditMethods, TableEditPrivateMethods } from '../../../../types'
 
-const { getConfig, renderer, hooks, log, getI18n } = VxeUI
+const { getConfig, renderer, hooks, getI18n } = VxeUI
 
 const tableEditMethodKeys: (keyof TableEditMethods)[] = ['insert', 'insertAt', 'insertNextAt', 'remove', 'removeCheckboxRow', 'removeRadioRow', 'removeCurrentRow', 'getRecordset', 'getInsertRecords', 'getRemoveRecords', 'getUpdateRecords', 'getEditRecord', 'getActiveRecord', 'getSelectedCell', 'clearEdit', 'clearActived', 'clearSelected', 'isEditByRow', 'isActiveByRow', 'setEditRow', 'setActiveRow', 'setEditCell', 'setActiveCell', 'setSelectCell']
 
@@ -91,7 +92,7 @@ hooks.add('tableEditModule', {
         } else {
           if (process.env.VUE_APP_VXE_ENV === 'development') {
             if (parentRowId) {
-              log.warn('vxe.error.unableInsert')
+              warnLog('vxe.error.unableInsert')
             }
           }
           afterFullData[funcName](item)
@@ -159,7 +160,7 @@ hooks.add('tableEditModule', {
                 if (process.env.VUE_APP_VXE_ENV === 'development') {
                   if (item[treeOpts.parentField]) {
                     if (parentRow && item[treeOpts.parentField] !== parentRow[rowField]) {
-                      log.err('vxe.error.errProp', [`${treeOpts.parentField}=${item[treeOpts.parentField]}`, `${treeOpts.parentField}=${parentRow[rowField]}`])
+                      errLog('vxe.error.errProp', [`${treeOpts.parentField}=${item[treeOpts.parentField]}`, `${treeOpts.parentField}=${parentRow[rowField]}`])
                     }
                   }
                 }
@@ -190,7 +191,7 @@ hooks.add('tableEditModule', {
               }
             } else {
               if (process.env.VUE_APP_VXE_ENV === 'development') {
-                log.warn('vxe.error.unableInsert')
+                warnLog('vxe.error.unableInsert')
               }
               insertTreeRow(newRecords, true)
             }
@@ -212,7 +213,7 @@ hooks.add('tableEditModule', {
               afIndex = Math.min(afterFullData.length, afIndex + 1)
             }
             if (afIndex === -1) {
-              throw new Error(log.err('vxe.error.unableInsert'))
+              throw new Error(getI18n('vxe.error.unableInsert'))
             }
             afterFullData.splice(afIndex, 0, ...newRecords)
             tableFullData.splice($xeTable.findRowIndexOf(tableFullData, row), 0, ...newRecords)
@@ -481,7 +482,7 @@ hooks.add('tableEditModule', {
       },
       getActiveRecord () {
         if (process.env.VUE_APP_VXE_ENV === 'development') {
-          log.warn('vxe.error.delFunc', ['getActiveRecord', 'getEditRecord'])
+          warnLog('vxe.error.delFunc', ['getActiveRecord', 'getEditRecord'])
         }
         return this.getEditRecord()
       },
@@ -509,7 +510,7 @@ hooks.add('tableEditModule', {
       clearActived (evnt) {
         // 即将废弃
         if (process.env.VUE_APP_VXE_ENV === 'development') {
-          log.warn('vxe.error.delFunc', ['clearActived', 'clearEdit'])
+          warnLog('vxe.error.delFunc', ['clearActived', 'clearEdit'])
         }
         return this.clearEdit(evnt)
       },
@@ -557,7 +558,7 @@ hooks.add('tableEditModule', {
       },
       isActiveByRow (row) {
         if (process.env.VUE_APP_VXE_ENV === 'development') {
-          log.warn('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow'])
+          warnLog('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow'])
         }
         // 即将废弃
         return this.isEditByRow(row)
@@ -572,7 +573,7 @@ hooks.add('tableEditModule', {
       },
       setActiveRow (row) {
         if (process.env.VUE_APP_VXE_ENV === 'development') {
-          log.warn('vxe.error.delFunc', ['setActiveRow', 'setEditRow'])
+          warnLog('vxe.error.delFunc', ['setActiveRow', 'setEditRow'])
         }
         // 即将废弃
         return editMethods.setEditRow(row)
@@ -590,7 +591,7 @@ hooks.add('tableEditModule', {
       },
       setActiveCell (row, fieldOrColumn) {
         if (process.env.VUE_APP_VXE_ENV === 'development') {
-          log.warn('vxe.error.delFunc', ['setActiveCell', 'setEditCell'])
+          warnLog('vxe.error.delFunc', ['setActiveCell', 'setEditCell'])
         }
         // 即将废弃
         return editMethods.setEditCell(row, fieldOrColumn)

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

@@ -4,10 +4,11 @@ import { VxeUI } from '../../../ui'
 import { isColumnInfo, mergeBodyMethod, getCellValue } from '../../src/util'
 import { parseFile, formatText } from '../../../ui/src/utils'
 import { createHtmlPage, getExportBlobByContent } from './util'
+import { warnLog, errLog } from '../../../ui/src/log'
 
 import type { VxeGridConstructor, VxeGridPrivateMethods, TableExportMethods } from '../../../../types'
 
-const { getI18n, hooks, renderer, log } = VxeUI
+const { getI18n, hooks, renderer } = VxeUI
 
 let htmlCellElem: any
 
@@ -897,7 +898,7 @@ hooks.add('tableExportModule', {
             $xeTable.preventEvent(null, 'event.import', { file, options, columns: tableFullColumn }, () => {
               const reader = new FileReader()
               reader.onerror = () => {
-                log.err('vxe.error.notType', [type])
+                errLog('vxe.error.notType', [type])
                 _importReject({ status: false })
               }
               reader.onload = (e: any) => {
@@ -909,7 +910,7 @@ hooks.add('tableExportModule', {
         } else {
           // 不支持的浏览器
           if (process.env.VUE_APP_VXE_ENV === 'development') {
-            log.err('vxe.error.notExp')
+            errLog('vxe.error.notExp')
           }
           _importResolve({ status: true })
         }
@@ -1119,7 +1120,7 @@ hooks.add('tableExportModule', {
         // 检查类型，如果为自定义导出，则不需要校验类型
         if (!opts.exportMethod && !XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)) {
           if (process.env.VUE_APP_VXE_ENV === 'development') {
-            log.err('vxe.error.notType', [type])
+            errLog('vxe.error.notType', [type])
           }
           const params = { status: false }
           return Promise.reject(params)
@@ -1143,7 +1144,7 @@ hooks.add('tableExportModule', {
           } else if (mode === 'all') {
             if (process.env.VUE_APP_VXE_ENV === 'development') {
               if (!$xeGrid) {
-                log.warn('vxe.error.errProp', ['all', 'mode=current,selected'])
+                warnLog('vxe.error.errProp', ['all', 'mode=current,selected'])
               }
             }
 
@@ -1156,7 +1157,7 @@ hooks.add('tableExportModule', {
 
               if (process.env.VUE_APP_VXE_ENV === 'development') {
                 if (!ajaxMethods) {
-                  log.warn('vxe.error.notFunc', ['proxy-config.ajax.queryAll'])
+                  warnLog('vxe.error.notFunc', ['proxy-config.ajax.queryAll'])
                 }
               }
 
@@ -1237,14 +1238,18 @@ hooks.add('tableExportModule', {
         return new Promise((resolve, reject) => {
           if (VxeUI.print) {
             if (opts.content) {
-              resolve(VxeUI.print({
-                content: opts.content
-              }))
+              resolve(
+                VxeUI.print({
+                  title: opts.sheetName,
+                  html: opts.content
+                })
+              )
             } else {
               resolve(
                 exportMethods.exportData(opts).then(({ content }: any) => {
                   return VxeUI.print({
-                    content
+                    title: opts.sheetName,
+                    html: content
                   })
                 })
               )
@@ -1255,6 +1260,23 @@ hooks.add('tableExportModule', {
           }
         })
       },
+      getPrintHtml (options) {
+        const printOpts = computePrintOpts.value
+        const opts = Object.assign({
+          original: false
+          // beforePrintMethod
+        }, printOpts, options, {
+          type: 'html',
+          download: false,
+          remote: false,
+          print: true
+        })
+        return exportMethods.exportData(opts).then(({ content }) => {
+          return {
+            html: content
+          }
+        })
+      },
       openImport (options) {
         const { treeConfig, importConfig } = props
         const { initStore, importStore, importParams } = reactData
@@ -1271,7 +1293,7 @@ hooks.add('tableExportModule', {
           return
         }
         if (!importConfig) {
-          log.err('vxe.error.reqProp', ['import-config'])
+          errLog('vxe.error.reqProp', ['import-config'])
         }
         // 处理类型
         const typeList = types.map((value: any) => {
@@ -1301,7 +1323,7 @@ hooks.add('tableExportModule', {
         const exportOpts = computeExportOpts.value
         if (process.env.VUE_APP_VXE_ENV === 'development') {
           if (!props.exportConfig) {
-            log.err('vxe.error.reqProp', ['export-config'])
+            errLog('vxe.error.reqProp', ['export-config'])
           }
         }
         handleExportAndPrint(Object.assign({}, exportOpts, options))
@@ -1310,7 +1332,7 @@ hooks.add('tableExportModule', {
         const printOpts = computePrintOpts.value
         if (process.env.VUE_APP_VXE_ENV === 'development') {
           if (!props.printConfig) {
-            log.err('vxe.error.reqProp', ['print-config'])
+            errLog('vxe.error.reqProp', ['print-config'])
           }
         }
         handleExportAndPrint(Object.assign({}, printOpts, options), true)