vxe-table 3.22.2 → 3.22.3

package/lib/index.umd.js

@@ -3311,7 +3311,7 @@ function getClass(property, params) {
 /* unused harmony import specifier */ var VxeUI;
 
 
-const version = "3.22.2";
+const version = "3.22.3";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -3378,6 +3378,7 @@ core_.VxeUI.setConfig({
       strict: true
     },
     tooltipConfig: {
+      mode: 'tooltip',
       enterable: true,
       defaultPlacement: 'top'
     },
@@ -4086,7 +4087,7 @@ function wheelScrollTopTo(diffNum, cb) {
 const {
   log: log_log
 } = core_.VxeUI;
-const tableVersion = `table v${"3.22.2"}`;
+const tableVersion = `table v${"3.22.3"}`;
 function createComponentLog(name) {
   const uiVersion = core_.VxeUI.uiVersion ? `ui v${core_.VxeUI.uiVersion}` : '';
   const ganttVersion = core_.VxeUI.ganttVersion ? `gantt v${core_.VxeUI.ganttVersion}` : '';
@@ -4733,6 +4734,7 @@ function createReactData() {
     mergeBodyFlag: 1,
     mergeFootFlag: 1,
     rowHeightStore: {
+      xlarge: 54,
       large: 52,
       default: 48,
       medium: 44,
@@ -8900,7 +8902,7 @@ function renderTdColumn(h, $xeTable, seq, rowid, fixedType, isOptimizeMode, rowL
   const cellOverflow = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(showOverflow) ? allShowOverflow : showOverflow;
   const showEllipsis = cellOverflow === 'ellipsis';
   const showTitle = cellOverflow === 'title';
-  const showTooltip = cellOverflow === true || cellOverflow === 'tooltip';
+  const showTooltip = cellOverflow === true ? tooltipOpts.mode === 'tooltip' : cellOverflow === 'tooltip';
   const hasEllipsis = isAllOverflow || showTitle || showTooltip || showEllipsis;
   const showResizable = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(column.resizable) ? column.resizable : columnOpts.resizable || allResizable;
   const isCsHeight = !!customCellHeight;
@@ -9767,6 +9769,7 @@ function header_renderRows(h, _vm, isGroup, isOptimizeMode, headerGroups, _rowIn
   const virtualXOpts = $xeTable.computeVirtualXOpts;
   const columnOpts = $xeTable.computeColumnOpts;
   const columnDragOpts = $xeTable.computeColumnDragOpts;
+  const headerTooltipOpts = $xeTable.computeHeaderTooltipOpts;
   const cellOpts = $xeTable.computeCellOpts;
   const defaultRowHeight = $xeTable.computeDefaultRowHeight;
   const headerCellOpts = $xeTable.computeHeaderCellOpts;
@@ -9800,7 +9803,7 @@ function header_renderRows(h, _vm, isGroup, isOptimizeMode, headerGroups, _rowIn
     const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
     const showEllipsis = headOverflow === 'ellipsis';
     const showTitle = headOverflow === 'title';
-    const showTooltip = headOverflow === true || headOverflow === 'tooltip';
+    const showTooltip = headOverflow === true ? headerTooltipOpts.mode === 'tooltip' : headOverflow === 'tooltip';
     const hasEllipsis = showTitle || showTooltip || showEllipsis;
     let hasFilter = false;
     let firstFilterOption = null;
@@ -9976,6 +9979,7 @@ function renderFilterRows(h, _vm, isOptimizeMode, cols) {
   const {
     fullColumnIdData
   } = tableInternalData;
+  const headerTooltipOpts = $xeTable.computeHeaderTooltipOpts;
   const cellOpts = $xeTable.computeCellOpts;
   const defaultRowHeight = $xeTable.computeDefaultRowHeight;
   const headerCellOpts = $xeTable.computeHeaderCellOpts;
@@ -10010,7 +10014,7 @@ function renderFilterRows(h, _vm, isOptimizeMode, cols) {
     const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
     const showEllipsis = headOverflow === 'ellipsis';
     const showTitle = headOverflow === 'title';
-    const showTooltip = headOverflow === true || headOverflow === 'tooltip';
+    const showTooltip = headOverflow === true ? headerTooltipOpts.mode === 'tooltip' : headOverflow === 'tooltip';
     const hasEllipsis = showTitle || showTooltip || showEllipsis;
     let hasFilter = false;
     let firstFilterOption = null;
@@ -10443,7 +10447,7 @@ function footer_renderRows(h, _vm, isOptimizeMode, tableColumn, footerTableData,
     const footAlign = footerAlign || (compConf ? compConf.tableFooterCellAlign : '') || allFooterAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
     const showEllipsis = footOverflow === 'ellipsis';
     const showTitle = footOverflow === 'title';
-    const showTooltip = footOverflow === true || footOverflow === 'tooltip';
+    const showTooltip = footOverflow === true ? footerTooltipOpts.mode === 'tooltip' : footOverflow === 'tooltip';
     const hasEllipsis = showTitle || showTooltip || showEllipsis;
     const showResizable = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(column.resizable) ? column.resizable : columnOpts.resizable || allResizable;
     const attrs = {
@@ -13280,6 +13284,18 @@ const {
   },
   computed: {
     ...{},
+    computeColWidthModeOptions() {
+      return [{
+        value: '',
+        label: export_panel_getI18n('vxe.export.wdModes.default')
+      }, {
+        value: 'auto',
+        label: export_panel_getI18n('vxe.export.wdModes.auto')
+      }, {
+        value: 'scale',
+        label: export_panel_getI18n('vxe.export.wdModes.scale')
+      }];
+    },
     computeCheckedAll() {
       const $xeExportPanel = this;
       const props = $xeExportPanel;
@@ -13483,6 +13499,11 @@ const {
       });
     },
     renderVN(h) {
+      const VxeUIModalComponent = core_.VxeUI.getComponent('VxeModal');
+      const VxeUIButtonComponent = core_.VxeUI.getComponent('VxeButton');
+      const VxeUISelectComponent = core_.VxeUI.getComponent('VxeSelect');
+      const VxeUIInputComponent = core_.VxeUI.getComponent('VxeInput');
+      const VxeUICheckboxComponent = core_.VxeUI.getComponent('VxeCheckbox');
       const $xeExportPanel = this;
       const props = $xeExportPanel;
       const reactData = $xeExportPanel.reactData;
@@ -13513,6 +13534,7 @@ const {
       const showSheet = $xeExportPanel.computeShowSheet;
       const supportMerge = $xeExportPanel.computeSupportMerge;
       const supportStyle = $xeExportPanel.computeSupportStyle;
+      const colWidthModeOptions = $xeExportPanel.computeColWidthModeOptions;
       // const supportGroup = $xeExportPanel.computeSupportGroup
       const slots = defaultOptions.slots || {};
       const topSlot = slots.top;
@@ -13556,7 +13578,7 @@ const {
           class: 'vxe-checkbox--label'
         }, colTitle)]));
       });
-      return h('vxe-modal', {
+      return VxeUIModalComponent ? h(VxeUIModalComponent, {
         ref: 'modal',
         props: {
           id: 'VXE_EXPORT_MODAL',
@@ -13604,7 +13626,7 @@ const {
                 cellpadding: 0,
                 border: 0
               }
-            }, [h('tbody', [[isPrint ? export_panel_renderEmptyElement($xeTable) : h('tr', [h('td', export_panel_getI18n('vxe.export.expName')), h('td', [h('vxe-input', {
+            }, [h('tbody', [[isPrint ? export_panel_renderEmptyElement($xeTable) : h('tr', [h('td', export_panel_getI18n('vxe.export.expName')), h('td', [VxeUIInputComponent ? h(VxeUIInputComponent, {
               ref: 'filename',
               props: {
                 value: defaultOptions.filename,
@@ -13617,7 +13639,7 @@ const {
                   defaultOptions.filename = value;
                 }
               }
-            })])]), isPrint ? export_panel_renderEmptyElement($xeTable) : h('tr', [h('td', export_panel_getI18n('vxe.export.expType')), h('td', [h('vxe-select', {
+            }) : export_panel_renderEmptyElement($xeTable)])]), isPrint ? export_panel_renderEmptyElement($xeTable) : h('tr', [h('td', export_panel_getI18n('vxe.export.expType')), h('td', [h('vxe-select', {
               props: {
                 value: defaultOptions.type,
                 options: storeData.typeList
@@ -13627,7 +13649,7 @@ const {
                   defaultOptions.type = value;
                 }
               }
-            })])]), isPrint || showSheet ? h('tr', [h('td', export_panel_getI18n('vxe.export.expSheetName')), h('td', [h('vxe-input', {
+            })])]), isPrint || showSheet ? h('tr', [h('td', export_panel_getI18n('vxe.export.expSheetName')), h('td', [VxeUIInputComponent ? h(VxeUIInputComponent, {
               ref: 'sheetname',
               props: {
                 value: defaultOptions.sheetName,
@@ -13640,7 +13662,7 @@ const {
                   defaultOptions.sheetName = value;
                 }
               }
-            })])]) : export_panel_renderEmptyElement($xeTable), h('tr', [h('td', export_panel_getI18n('vxe.export.expMode')), h('td', [h('vxe-select', {
+            }) : export_panel_renderEmptyElement($xeTable)])]) : export_panel_renderEmptyElement($xeTable), h('tr', [h('td', export_panel_getI18n('vxe.export.expMode')), h('td', [h(VxeUISelectComponent, {
               props: {
                 value: defaultOptions.mode,
                 options: storeData.modeList
@@ -13671,11 +13693,21 @@ const {
               class: 'vxe-checkbox--label'
             }, export_panel_getI18n('vxe.export.expCurrentColumn'))])]), h('ul', {
               class: 'vxe-table-export--panel-column-body'
-            }, colVNs)])])]), h('tr', [h('td', export_panel_getI18n('vxe.export.expOpts')), parameterSlot ? h('td', [h('div', {
+            }, colVNs)])])]), isPrint ? h('tr', [h('td', export_panel_getI18n('vxe.export.widthMode')), h('td', [VxeUISelectComponent ? h(VxeUISelectComponent, {
+              props: {
+                value: defaultOptions.widthMode,
+                options: colWidthModeOptions
+              },
+              on: {
+                modelValue(value) {
+                  defaultOptions.widthMode = value;
+                }
+              }
+            }) : export_panel_renderEmptyElement($xeTable)])]) : export_panel_renderEmptyElement($xeTable), h('tr', [h('td', export_panel_getI18n('vxe.export.expOpts')), parameterSlot ? h('td', [h('div', {
               class: 'vxe-table-export--panel-option-row'
             }, $xeTable.callSlot(parameterSlot, params, h))]) : h('td', [h('div', {
               class: 'vxe-table-export--panel-option-row'
-            }, [h('vxe-checkbox', {
+            }, VxeUICheckboxComponent ? [h(VxeUICheckboxComponent, {
               props: {
                 value: hasEmptyData || isHeader,
                 disabled: hasEmptyData,
@@ -13687,7 +13719,7 @@ const {
                   defaultOptions.isHeader = value;
                 }
               }
-            }), h('vxe-checkbox', {
+            }), h(VxeUICheckboxComponent, {
               props: {
                 value: defaultOptions.isFooter,
                 disabled: !storeData.hasFooter,
@@ -13699,7 +13731,7 @@ const {
                   defaultOptions.isFooter = value;
                 }
               }
-            }), h('vxe-checkbox', {
+            }), h(VxeUICheckboxComponent, {
               props: {
                 value: isHeader ? defaultOptions.isTitle : false,
                 disabled: !isHeader,
@@ -13711,7 +13743,7 @@ const {
                   defaultOptions.isTitle = value;
                 }
               }
-            }), h('vxe-checkbox', {
+            }), h(VxeUICheckboxComponent, {
               props: {
                 value: isHeader && hasColgroup && supportMerge ? defaultOptions.isColgroup : false,
                 disabled: !isHeader || !hasColgroup || !supportMerge,
@@ -13723,9 +13755,9 @@ const {
                   defaultOptions.isColgroup = value;
                 }
               }
-            })]), h('div', {
+            })] : []), h('div', {
               class: 'vxe-table-export--panel-option-row'
-            }, [h('vxe-checkbox', {
+            }, VxeUICheckboxComponent ? [h(VxeUICheckboxComponent, {
               props: {
                 value: hasEmptyData ? false : defaultOptions.original,
                 disabled: hasEmptyData,
@@ -13737,7 +13769,7 @@ const {
                   defaultOptions.original = value;
                 }
               }
-            }), h('vxe-checkbox', {
+            }), h(VxeUICheckboxComponent, {
               props: {
                 value: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false,
                 disabled: hasEmptyData || !hasMerge || !supportMerge || !checkedAll,
@@ -13749,7 +13781,7 @@ const {
                   defaultOptions.isMerge = value;
                 }
               }
-            }), isPrint ? export_panel_renderEmptyElement($xeTable) : h('vxe-checkbox', {
+            }), isPrint ? export_panel_renderEmptyElement($xeTable) : h(VxeUICheckboxComponent, {
               props: {
                 value: supportStyle ? defaultOptions.useStyle : false,
                 disabled: !supportStyle,
@@ -13761,9 +13793,9 @@ const {
                   defaultOptions.useStyle = value;
                 }
               }
-            })]), h('div', {
+            })] : []), h('div', {
               class: 'vxe-table-export--panel-option-row'
-            }, [h('vxe-checkbox', {
+            }, VxeUICheckboxComponent ? [h(VxeUICheckboxComponent, {
               props: {
                 value: hasTree ? defaultOptions.isTreeAllExpanded : false,
                 disabled: hasEmptyData || !hasTree,
@@ -13775,7 +13807,7 @@ const {
                   defaultOptions.isTreeAllExpanded = value;
                 }
               }
-            }), h('vxe-checkbox', {
+            }), h(VxeUICheckboxComponent, {
               props: {
                 value: hasRowGroup ? defaultOptions.isRowGroupAllExpanded : false,
                 disabled: hasEmptyData || !hasRowGroup,
@@ -13787,7 +13819,7 @@ const {
                   defaultOptions.isRowGroupAllExpanded = value;
                 }
               }
-            })])])])]])])]), bottomSlot ? h('div', {
+            })] : [])])])]])])]), bottomSlot ? h('div', {
               class: 'vxe-table-export--panel-bottom'
             }, $xeTable.callSlot(bottomSlot, params, h)) : export_panel_renderEmptyElement($xeTable)]);
           },
@@ -13804,14 +13836,14 @@ const {
               class: 'vxe-table-export--panel-footer'
             }, footerSlot ? $xeTable.callSlot(footerSlot, params, h) : [h('div', {
               class: 'vxe-table-export--panel-btns'
-            }, [h('vxe-button', {
+            }, [VxeUIButtonComponent ? h(VxeUIButtonComponent, {
               props: {
                 content: export_panel_getI18n('vxe.export.expCancel')
               },
               on: {
                 click: $xeExportPanel.cancelEvent
               }
-            }), h('vxe-button', {
+            }) : export_panel_renderEmptyElement($xeTable), VxeUIButtonComponent ? h(VxeUIButtonComponent, {
               ref: 'confirmBtn',
               props: {
                 status: 'primary',
@@ -13820,10 +13852,10 @@ const {
               on: {
                 click: $xeExportPanel.confirmEvent
               }
-            })])]);
+            }) : export_panel_renderEmptyElement($xeTable)])]);
           }
         }
-      });
+      }) : export_panel_renderEmptyElement($xeTable);
     }
   },
   render(h) {
@@ -16435,7 +16467,7 @@ function handleEditCell($xeTable, row, fieldOrColumn, options) {
 });
 ;// ./packages/table/module/export/util.ts
 // 默认导出或打印的 HTML 样式
-const defaultHtmlStyle = 'body{margin:0;padding: 0 1px;color:#333333;font-size:14px;font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table:not(.is--print){table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{border-color:#D0D0D0;border-style:solid;border-width:0}.vxe-table.is--print{width:100%}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:.5em .4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table:not(.is--print) .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}';
+const defaultHtmlStyle = 'body{padding:0;color:rgba(0,0,0,0.7);font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu;}body *{-webkit-box-sizing:border-box;box-sizing:border-box;}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0;}.vxe-table.is--default-width,.vxe-table.is--auto-width{width:100%;}.vxe-table.is--scale-width{table-layout:fixed;}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{word-break:break-all;border-color:#D0D0D0;border-style:solid;border-width:0;}.border--default,.border--full,.border--outer{border-top-width:1px;}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px;}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px;}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9;}.vxe-table td>div,.vxe-table th>div{padding:0.5em 0.4em;}.col--center{text-align:center;}.col--right{text-align:right;}.vxe-table .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all;}.vxe-table--tree-node{text-align:left;}.vxe-table--tree-node-wrapper{position:relative;}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:0.5em;border-right-color:transparent;border-bottom-color:transparent;}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent;}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599;}.vxe-table--tree-cell{display:block;padding-left:1.5em;}.vxe-table input[type="checkbox"]{margin:0;}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}';
 function getExportBlobByContent(content, options) {
   return new Blob([content], {
     type: `text/${options.type};charset=utf-8;`
@@ -17030,6 +17062,9 @@ function hasEllipsis($xeTable, column, property, allColumnOverflow) {
   }
   return isEllipsis;
 }
+function getCustomColKey(conf) {
+  return `${conf.field || ''}:${conf.type || ''}`;
+}
 function toHtml($xeTable, opts, columns, datas) {
   const props = $xeTable;
   const reactData = $xeTable;
@@ -17055,42 +17090,113 @@ function toHtml($xeTable, opts, columns, datas) {
   const treeOpts = $xeTable.computeTreeOpts;
   const {
     print: isPrint,
+    widthMode,
     isHeader,
     isFooter,
     isColgroup,
     isMerge,
     colgroups,
+    _columnConfs,
     original
   } = opts;
-  const allCls = 'check-all';
-  const clss = ['vxe-table', `border--${toTableBorder(border)}`, isPrint ? 'is--print' : '', isHeader ? 'is--header' : ''].filter(cls => cls);
-  const tables = [`<table class="${clss.join(' ')}" border="0" cellspacing="0" cellpadding="0">`, `<colgroup>${columns.map(column => `<col style="width:${column.renderWidth}px">`).join('')}</colgroup>`];
-  if (isHeader) {
-    tables.push('<thead>');
-    if (isColgroup && !original) {
+  const isAutoWidth = widthMode === 'auto';
+  const isScaleWidth = widthMode === 'scale';
+  const isDefaultWidth = !isAutoWidth && !isScaleWidth;
+  const customWidthMaps = {};
+  if (_columnConfs) {
+    _columnConfs.forEach(conf => {
+      if (!isColumnInfo(conf)) {
+        if ((conf.field || conf.type) && conf.width) {
+          customWidthMaps[getCustomColKey(conf)] = conf.width;
+        }
+      }
+    });
+  }
+  // 计算宽度
+  const colWidthMaps = {};
+  const printWidthMaps = {};
+  if (isPrint) {
+    let tableWidth = 0;
+    columns.forEach(column => {
+      tableWidth += column.renderWidth;
+    });
+    if (colgroups) {
       colgroups.forEach(cols => {
-        tables.push(`<tr>${cols.map(column => {
-          const headAlign = column.headerAlign || column.align || allHeaderAlign || allAlign;
-          const classNames = hasEllipsis($xeTable, column, 'showHeaderOverflow', allColumnHeaderOverflow) ? ['col--ellipsis'] : [];
-          const cellTitle = getHeaderTitle($xeTable, opts, column);
+        cols.forEach(column => {
+          if (!column.childNodes || !column.childNodes.length) {
+            return;
+          }
           let childWidth = 0;
           let countChild = 0;
           external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree([column], item => {
             if (!item.childNodes || !column.childNodes.length) {
               countChild++;
             }
-            childWidth += item.renderWidth;
+            const ptWidth = printWidthMaps[item.id];
+            childWidth += ptWidth || 0;
           }, {
             children: 'childNodes'
           });
-          const cellWidth = childWidth - countChild;
+          const colWidth = childWidth - countChild;
+          colWidthMaps[column.id] = colWidth;
+          printWidthMaps[column.id] = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(colWidth / tableWidth * 180, 2);
+        });
+      });
+    }
+    columns.forEach(column => {
+      const colWidth = column.renderWidth;
+      if (column.width) {
+        colWidthMaps[column.id] = colWidth;
+      }
+      printWidthMaps[column.id] = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().floor(colWidth / tableWidth * 180, 2);
+    });
+  }
+  const getHeaderWidthStyle = column => {
+    const cmColKey = getCustomColKey(column);
+    const cmWidthMaps = customWidthMaps[cmColKey];
+    if (cmWidthMaps) {
+      return 'width:' + toCssUnit(cmWidthMaps);
+    }
+    if (isAutoWidth) {
+      return '';
+    }
+    if (isScaleWidth) {
+      return printWidthMaps[column.id] ? 'width:' + printWidthMaps[column.id] + 'mm' : '';
+    }
+    return colWidthMaps[column.id] ? 'width:' + toCssUnit(colWidthMaps[column.id]) : '';
+  };
+  const getCellWidthStyle = column => {
+    const cmColKey = getCustomColKey(column);
+    const cmWidthMaps = customWidthMaps[cmColKey];
+    if (cmWidthMaps) {
+      return 'width:' + toCssUnit(cmWidthMaps);
+    }
+    if (isAutoWidth || isDefaultWidth) {
+      return '';
+    }
+    if (isScaleWidth) {
+      return printWidthMaps[column.id] ? 'width:' + printWidthMaps[column.id] + 'mm' : '';
+    }
+    return colWidthMaps[column.id] ? 'width:' + toCssUnit(colWidthMaps[column.id]) : '';
+  };
+  const allCls = 'check-all';
+  const clss = ['vxe-table', `border--${toTableBorder(border)}`, isPrint ? 'is--print' : '', isAutoWidth ? 'is--auto-width' : '', isScaleWidth ? 'is--scale-width' : '', isDefaultWidth ? 'is--default-width' : '', isHeader ? 'is--header' : ''].filter(cls => cls);
+  const tables = [`<table class="${clss.join(' ')}" border="0" cellspacing="0" cellpadding="0">`, `<colgroup>${columns.map(column => `<col style="${getHeaderWidthStyle(column)}">`).join('')}</colgroup>`];
+  if (isHeader) {
+    tables.push('<thead>');
+    if (isColgroup && !original) {
+      colgroups.forEach(cols => {
+        tables.push(`<tr>${cols.map(column => {
+          const headAlign = column.headerAlign || column.align || allHeaderAlign || allAlign;
+          const classNames = hasEllipsis($xeTable, column, 'showHeaderOverflow', allColumnHeaderOverflow) ? ['col--ellipsis'] : [];
+          const cellTitle = getHeaderTitle($xeTable, opts, column);
           if (headAlign) {
             classNames.push(`col--${headAlign}`);
           }
           if (column.type === 'checkbox') {
-            return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}"><div ${isPrint ? '' : `style="width: ${cellWidth}px"`}><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
+            return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
           }
-          return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}" title="${cellTitle}"><div ${isPrint ? '' : `style="width: ${cellWidth}px"`}><span>${formatText(cellTitle, true)}</span></div></th>`;
+          return `<th class="${classNames.join(' ')}" colspan="${column._colSpan}" rowspan="${column._rowSpan}" title="${cellTitle}"><div style="${getCellWidthStyle(column)}"><span>${formatText(cellTitle, true)}</span></div></th>`;
         }).join('')}</tr>`);
       });
     } else {
@@ -17102,9 +17208,9 @@ function toHtml($xeTable, opts, columns, datas) {
           classNames.push(`col--${headAlign}`);
         }
         if (column.type === 'checkbox') {
-          return `<th class="${classNames.join(' ')}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
+          return `<th class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" class="${allCls}" ${isAllSelected ? 'checked' : ''}><span>${cellTitle}</span></div></th>`;
         }
-        return `<th class="${classNames.join(' ')}" title="${cellTitle}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><span>${formatText(cellTitle, true)}</span></div></th>`;
+        return `<th class="${classNames.join(' ')}" title="${cellTitle}"><div style="${getCellWidthStyle(column)}"><span>${formatText(cellTitle, true)}</span></div></th>`;
       }).join('')}</tr>`);
     }
     tables.push('</thead>');
@@ -17127,18 +17233,18 @@ function toHtml($xeTable, opts, columns, datas) {
             }
             classNames.push('vxe-table--tree-node');
             if (column.type === 'radio') {
-              return `<td class="${classNames.join(' ')}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></div></div></td>`;
+              return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></div></div></td>`;
             } else if (column.type === 'checkbox') {
-              return `<td class="${classNames.join(' ')}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></div></div></td>`;
+              return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></div></div></td>`;
             }
-            return `<td class="${classNames.join(' ')}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell">${cellValue}</div></div></div></td>`;
+            return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}"><div class="vxe-table--tree-node-wrapper" style="padding-left: ${item._level * treeOpts.indent}px"><div class="vxe-table--tree-icon-wrapper">${treeIcon}</div><div class="vxe-table--tree-cell">${cellValue}</div></div></div></td>`;
           }
           if (column.type === 'radio') {
-            return `<td class="${classNames.join(' ')}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
+            return `<td class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
           } else if (column.type === 'checkbox') {
-            return `<td class="${classNames.join(' ')}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
+            return `<td class="${classNames.join(' ')}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
           }
-          return `<td class="${classNames.join(' ')}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}>${formatText(cellValue, true)}</div></td>`;
+          return `<td class="${classNames.join(' ')}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
         }).join('') + '</tr>');
       });
     } else {
@@ -17174,11 +17280,11 @@ function toHtml($xeTable, opts, columns, datas) {
             classNames.push(`col--${cellAlign}`);
           }
           if (column.type === 'radio') {
-            return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
+            return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div style="${getCellWidthStyle(column)}"><input type="radio" name="radio_${id}" ${item._radioDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._radioLabel}</span></div></td>`;
           } else if (column.type === 'checkbox') {
-            return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
+            return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}"><div style="${getCellWidthStyle(column)}"><input type="checkbox" ${item._checkboxDisabled ? 'disabled ' : ''}${getBooleanValue(cellValue) ? 'checked' : ''}><span>${item._checkboxLabel}</span></div></td>`;
           }
-          return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}>${formatText(cellValue, true)}</div></td>`;
+          return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
         }).join('') + '</tr>');
       });
     }
@@ -17221,7 +17327,7 @@ function toHtml($xeTable, opts, columns, datas) {
           if (footAlign) {
             classNames.push(`col--${footAlign}`);
           }
-          return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div ${isPrint ? '' : `style="width: ${column.renderWidth}px"`}>${formatText(cellValue, true)}</div></td>`;
+          return `<td class="${classNames.join(' ')}" rowspan="${rowSpan}" colspan="${colSpan}" title="${cellValue}"><div style="${getCellWidthStyle(column)}">${formatText(cellValue, true)}</div></td>`;
         }).join('')}</tr>`);
       });
       tables.push('</tfoot>');
@@ -17230,7 +17336,7 @@ function toHtml($xeTable, opts, columns, datas) {
   // 是否半选状态
   const script = !isAllSelected && isIndeterminate ? `<script>(function(){var a=document.querySelector(".${allCls}");if(a){a.indeterminate=true}})()</script>` : '';
   tables.push('</table>', script);
-  return isPrint ? tables.join('') : createHtmlPage(opts, tables.join(''));
+  return isAutoWidth ? tables.join('') : createHtmlPage(opts, tables.join(''));
 }
 function toXML($xeTable, opts, columns, datas) {
   const reactData = $xeTable;
@@ -17911,6 +18017,9 @@ function handleExportAndPrint($xeTable, options, isPrint) {
   if (!typeList.some(item => item.value === type)) {
     exportParams.type = typeList[0].value;
   }
+  if (!exportParams.widthMode) {
+    exportParams.widthMode = '';
+  }
   initStore.export = true;
   return $xeTable.$nextTick();
 }
@@ -18074,7 +18183,8 @@ const convertToRows = originColumns => {
       }
       const handleOptions = Object.assign({}, opts, {
         filename: '',
-        sheetName: ''
+        sheetName: '',
+        _columnConfs: columns
       });
       // 如果设置源数据，则默认导出设置了字段的列
       if (!isCustomCol && !columnFilterMethod) {
@@ -22559,33 +22669,39 @@ function renderBody(h, $xeTable) {
       // 使用已安装的组件，如果未安装则不渲染
       const VxeUILoadingComponent = core_.VxeUI.getComponent('VxeLoading');
       const VxeUITooltipComponent = core_.VxeUI.getComponent('VxeTooltip');
+      const {
+        showOverflow,
+        showHeaderOverflow,
+        showFooterOverflow
+      } = props;
+      const tooltipOpts = $xeTable.computeTooltipOpts;
+      const headerTooltipOpts = $xeTable.computeHeaderTooltipOpts;
+      const footerTooltipOpts = $xeTable.computeFooterTooltipOpts;
       if (props.loading) {
         if (!VxeUILoadingComponent && !this.$scopedSlots.loading) {
-          table_errLog('vxe.error.errProp', ['loading=true', 'loading=false | <template #loading>...</template>']);
           table_errLog('vxe.error.reqComp', ['vxe-loading']);
+          table_errLog('vxe.error.errProp', ['loading=true', 'loading=false | <template #loading>...</template>']);
         }
       }
-      if (props.showOverflow === true || props.showOverflow === 'tooltip' || props.showHeaderOverflow === true || props.showHeaderOverflow === 'tooltip' || props.showFooterOverflow === true || props.showFooterOverflow === 'tooltip') {
-        if (!VxeUITooltipComponent) {
-          if (props.showOverflow === true) {
-            table_errLog('vxe.error.errProp', ['show-overflow=true', 'show-overflow=title']);
-          }
-          if (props.showOverflow === 'tooltip') {
-            table_errLog('vxe.error.errProp', ['show-overflow=tooltip', 'show-overflow=title']);
-          }
-          if (props.showHeaderOverflow === true) {
-            table_errLog('vxe.error.errProp', ['show-header-overflow=true', 'show-header-overflow=title']);
-          }
-          if (props.showHeaderOverflow === 'tooltip') {
-            table_errLog('vxe.error.errProp', ['show-header-overflow=tooltip', 'show-header-overflow=title']);
-          }
-          if (props.showFooterOverflow === true) {
-            table_errLog('vxe.error.errProp', ['show-footer-overflow=true', 'show-footer-overflow=title']);
-          }
-          if (props.showFooterOverflow === 'tooltip') {
-            table_errLog('vxe.error.errProp', ['show-footer-overflow=tooltip', 'show-footer-overflow=title']);
-          }
-          table_errLog('vxe.error.reqComp', ['vxe-tooltip']);
+      if (!VxeUITooltipComponent) {
+        table_errLog('vxe.error.reqComp', ['vxe-tooltip']);
+        if (showOverflow === 'tooltip') {
+          table_errLog('vxe.error.errProp', ['show-overflow=' + showOverflow, 'show-overflow=false,title,ellipsis']);
+        }
+        if (showOverflow === true && tooltipOpts.mode === 'tooltip') {
+          table_errLog('vxe.error.notSupportProp', ['show-overflow=' + showOverflow, 'tooltip-config.mode=tooltip', 'tooltip-config.mode=title,ellipsis']);
+        }
+        if (showHeaderOverflow === 'tooltip') {
+          table_errLog('vxe.error.errProp', ['show-header-overflow=' + showHeaderOverflow, 'show-header-overflow=false,title,ellipsis']);
+        }
+        if (showHeaderOverflow === true && headerTooltipOpts.mode === 'tooltip') {
+          table_errLog('vxe.error.notSupportProp', ['show-header-overflow=' + showHeaderOverflow, 'header-tooltip-config.mode=tooltip', 'header-tooltip-config.mode=title,ellipsis']);
+        }
+        if (showFooterOverflow === 'tooltip') {
+          table_errLog('vxe.error.errProp', ['show-footer-overflow=' + showFooterOverflow, 'show-footer-overflow=false,title,ellipsis']);
+        }
+        if (showFooterOverflow === true && footerTooltipOpts.mode === 'tooltip') {
+          table_errLog('vxe.error.notSupportProp', ['show-footer-overflow=' + showFooterOverflow, 'footer-tooltip-config.mode=tooltip', 'footer-tooltip-config.mode=title,ellipsis']);
         }
       }
       if (this.autoResize) {
@@ -28321,6 +28437,13 @@ const Toolbar = VxeToolbar;
       expMode: '选择数据',
       expCurrentColumn: '全部字段',
       expColumn: '选择字段',
+      widthMode: '列宽方式',
+      wModeTitle: '设置打印时列宽的渲染方式',
+      wdModes: {
+        default: '默认',
+        auto: '自适应（根据内容自适应列宽）',
+        scale: '等比例（根据页面比例渲染列宽）'
+      },
       expOpts: '参数设置',
       expOptHeader: '表头',
       expHeaderTitle: '是否需要表头',