vxe-table 4.19.4 → 4.19.6

package/dist/all.esm.js

@@ -44,7 +44,7 @@ function eqEmptyValue(cellValue) {
     return cellValue === '' || XEUtils.eqNull(cellValue);
 }
 
-const version$1 = "4.19.4";
+const version$1 = "4.19.6";
 VxeUI.version = version$1;
 VxeUI.tableVersion = version$1;
 VxeUI.setConfig({
@@ -556,7 +556,7 @@ const modal = {
 const defineVxeComponent = defineComponent;
 
 const { log } = VxeUI;
-const version = `table v${"4.19.4"}`;
+const version = `table v${"4.19.6"}`;
 const warnLog = log.create('warn', version);
 const errLog = log.create('error', version);
 
@@ -568,16 +568,13 @@ class ColumnInfo {
         const $xeGrid = $xeTable.xeGrid;
         const $xeGantt = $xeTable.xeGantt;
         const $xeGGWrapper = $xeGrid || $xeGantt;
-        const { field, editRender, filterRender, headerFormatter } = _vm;
+        const { field, editRender, filterRender } = _vm;
         const colId = _vm.colId || XEUtils.uniqueId('col_');
         const formatter = _vm.formatter;
         const visible = XEUtils.isBoolean(_vm.visible) ? _vm.visible : true;
         const flCompConf = isEnableConf(filterRender) ? renderer$b.get(filterRender.name) : null;
         const ctFilterOptions = flCompConf ? flCompConf.createTableFilterOptions : null;
         const filters = toFilters(_vm.filters, colId);
-        if (headerFormatter) {
-            errLog('vxe.error.notProp', ['header-formatter']);
-        }
         const types = ['seq', 'checkbox', 'radio', 'expand', 'html'];
         if (_vm.type && types.indexOf(_vm.type) === -1) {
             warnLog('vxe.error.errProp', [`type=${_vm.type}`, types.join(', ')]);
@@ -1016,6 +1013,7 @@ function createInternalData$3() {
         // 数据集（仅可视）
         visibleDataRowIdData: {},
         keepUpdateFieldMaps: {},
+        headerFullDataColData: {},
         footerFullDataRowData: {},
         // 渲染中缓存数据
         sourceDataRowIdData: {},
@@ -1619,17 +1617,54 @@ function getCalcHeight(height) {
     }
     return height || 0;
 }
+/**
+ * 列宽拖动最大宽度
+ */
+function getColReMaxWidth(params) {
+    const { $table, column, cell } = params;
+    const internalData = $table.internalData;
+    const { elemStore } = internalData;
+    const { computeColumnOpts, computeResizableOpts } = $table.getComputeMaps();
+    const resizableOpts = computeResizableOpts.value;
+    const columnOpts = computeColumnOpts.value;
+    const { maxWidth: reMaxWidth } = resizableOpts;
+    const colMaxWidth = column.maxWidth || columnOpts.maxWidth;
+    // 如果自定义调整宽度逻辑
+    if (reMaxWidth) {
+        const customMaxWidth = XEUtils.isFunction(reMaxWidth) ? reMaxWidth(params) : reMaxWidth;
+        if (customMaxWidth !== 'auto') {
+            return Math.max(1, XEUtils.toNumber(customMaxWidth));
+        }
+    }
+    const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8);
+    const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'));
+    const mWidth = minTitleWidth + paddingLeftRight;
+    // 如果设置最小宽
+    if (colMaxWidth) {
+        const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
+        if (bodyScrollElem) {
+            if (isScale(colMaxWidth)) {
+                const bodyWidth = bodyScrollElem.clientWidth - 1;
+                const meanWidth = bodyWidth / 100;
+                return Math.max(mWidth, Math.floor(XEUtils.toInteger(colMaxWidth) * meanWidth));
+            }
+            else if (isPx(colMaxWidth)) {
+                return Math.max(mWidth, XEUtils.toInteger(colMaxWidth));
+            }
+        }
+    }
+    return -1;
+}
 /**
  * 列宽拖动最小宽度
- * @param params
- * @returns
  */
 function getColReMinWidth(params) {
     const { $table, column, cell } = params;
     const tableProps = $table.props;
     const internalData = $table.internalData;
-    const { computeResizableOpts } = $table.getComputeMaps();
+    const { computeColumnOpts, computeResizableOpts } = $table.getComputeMaps();
     const resizableOpts = computeResizableOpts.value;
+    const columnOpts = computeColumnOpts.value;
     const { minWidth: reMinWidth } = resizableOpts;
     // 如果自定义调整宽度逻辑
     if (reMinWidth) {
@@ -1640,7 +1675,8 @@ function getColReMinWidth(params) {
     }
     const { elemStore } = internalData;
     const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps;
-    const { showHeaderOverflow, minWidth: colMinWidth } = column;
+    const { showHeaderOverflow } = column;
+    const colMinWidth = column.minWidth || columnOpts.minWidth;
     const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
     const showEllipsis = headOverflow === 'ellipsis';
     const showTitle = headOverflow === 'title';
@@ -2300,7 +2336,7 @@ const Cell = {
                 }
             }
         }
-        return renderTitleContent(params, formatText(column.getTitle(), 1));
+        return renderTitleContent(params, $table.getHeaderCellLabel(column));
     },
     renderDefaultHeader(params) {
         return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params));
@@ -2312,7 +2348,7 @@ const Cell = {
         const tableInternalData = $table.internalData;
         const { isRowGroupStatus } = tableReactData;
         const { editConfig } = tableProps;
-        const { field, slots, editRender, cellRender, rowGroupNode, aggFunc, formatter } = column;
+        const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column;
         const isEnableEdit = editConfig && isEnableConf(editConfig);
         const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
         const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null;
@@ -2388,8 +2424,9 @@ const Cell = {
                 return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params));
             }
             const renderOpts = editRenderOpts || cellRenderOpts;
-            // formatter > (renderTableCell | renderTableDefault)
-            if (renderOpts && !formatter) {
+            // 如果是编辑表格：renderTableCell > formatter
+            // 如果是查看表格：renderTableDefault > formatter
+            if (renderOpts) {
                 const compConf = renderer$a.get(renderOpts.name);
                 if (compConf) {
                     const renderFn = editRenderOpts ? (compConf.renderTableCell || compConf.renderCell) : (compConf.renderTableDefault || compConf.renderDefault);
@@ -2560,7 +2597,7 @@ const Cell = {
         const { $table, column } = params;
         const { slots } = column;
         const headerSlot = slots ? slots.header : null;
-        return renderHeaderCellBaseVNs(params, renderTitleContent(params, headerSlot ? $table.callSlot(headerSlot, params) : formatText(column.getTitle(), 1)));
+        return renderHeaderCellBaseVNs(params, renderTitleContent(params, headerSlot ? $table.callSlot(headerSlot, params) : $table.getHeaderCellLabel(column)));
     },
     renderSeqCell(params) {
         const { $table, column } = params;
@@ -2595,7 +2632,7 @@ const Cell = {
             : [
                 h('span', {
                     class: 'vxe-radio--label'
-                }, titleSlot ? $table.callSlot(titleSlot, params) : formatText(column.getTitle(), 1))
+                }, titleSlot ? $table.callSlot(titleSlot, params) : $table.getHeaderCellLabel(column))
             ]));
     },
     renderRadioCell(params) {
@@ -2664,7 +2701,7 @@ const Cell = {
         const titleSlot = slots ? slots.title : null;
         const checkboxOpts = computeCheckboxOpts.value;
         const { checkStrictly, showHeader, headerTitle } = checkboxOpts;
-        const colTitle = column.getTitle();
+        const colTitle = $table.getHeaderCellLabel(column);
         const ons = {};
         if (!isHidden) {
             ons.onClick = (evnt) => {
@@ -3836,6 +3873,7 @@ const tableEmits = [
     'cell-area-selection-all-end',
     'cell-area-arrows-start',
     'cell-area-arrows-end',
+    'cell-area-fill-copy',
     'active-cell-change-start',
     'active-cell-change-end'
 ];
@@ -10415,7 +10453,7 @@ hooks$4.add('tableExportModule', {
         function getHeaderTitle(opts, column) {
             const columnOpts = computeColumnOpts.value;
             const headExportMethod = column.headerExportMethod || columnOpts.headerExportMethod;
-            return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.isTitle ? column.getTitle() : column.field) || '');
+            return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.isTitle ? $xeTable.getHeaderCellLabel(column) : column.field) || '');
         }
         const toBooleanValue = (cellValue) => {
             return XEUtils.isBoolean(cellValue) ? (cellValue ? 'TRUE' : 'FALSE') : cellValue;
@@ -11069,12 +11107,12 @@ hooks$4.add('tableExportModule', {
             const tableTitleMaps = {};
             tableFullColumn.forEach((column) => {
                 const field = column.field;
-                const title = column.getTitle();
+                const title = $xeTable.getHeaderCellLabel(column);
                 if (field) {
                     tableFieldMaps[field] = column;
                 }
                 if (title) {
-                    tableTitleMaps[column.getTitle()] = column;
+                    tableTitleMaps[title] = column;
                 }
             });
             const tableConf = {
@@ -16451,6 +16489,7 @@ var VxeTableComponent = defineVxeComponent({
             if (!xHandleEl) {
                 return;
             }
+            const columnOpts = computeColumnOpts.value;
             let tWidth = 0;
             const minCellWidth = 40; // 列宽最少限制 40px
             const bodyWidth = bodyWrapperElem.clientWidth;
@@ -16459,39 +16498,73 @@ var VxeTableComponent = defineVxeComponent({
             const { fit } = props;
             const { columnStore } = reactData;
             const { resizeList, pxMinList, autoMinList, pxList, scaleList, scaleMinList, autoList, remainList } = columnStore;
+            const parseColumnMaxWidth = (column) => {
+                const maxWidth = column.maxWidth || columnOpts.maxWidth;
+                if (maxWidth && maxWidth !== 'auto') {
+                    if (isScale(maxWidth)) {
+                        return Math.floor(XEUtils.toInteger(maxWidth) * meanWidth);
+                    }
+                    return XEUtils.toInteger(maxWidth);
+                }
+                return 0;
+            };
             // 最小宽
             pxMinList.forEach((column) => {
-                const minWidth = XEUtils.toInteger(column.minWidth);
-                tWidth += minWidth;
-                column.renderWidth = minWidth;
+                let miWidth = XEUtils.toInteger(column.minWidth);
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    miWidth = Math.min(miWidth, mxWidth);
+                }
+                tWidth += miWidth;
+                column.renderWidth = miWidth;
             });
             // 最小自适应
             autoMinList.forEach((column) => {
-                const caWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
+                let caWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    caWidth = Math.min(caWidth, mxWidth);
+                }
                 tWidth += caWidth;
                 column.renderWidth = caWidth;
             });
             // 最小百分比
             scaleMinList.forEach((column) => {
-                const smWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth);
+                let smWidth = Math.floor(XEUtils.toInteger(column.minWidth) * meanWidth);
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    smWidth = Math.min(smWidth, mxWidth);
+                }
                 tWidth += smWidth;
                 column.renderWidth = smWidth;
             });
             // 固定百分比
             scaleList.forEach((column) => {
-                const sfWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth);
+                let sfWidth = Math.floor(XEUtils.toInteger(column.width) * meanWidth);
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    sfWidth = Math.min(sfWidth, mxWidth);
+                }
                 tWidth += sfWidth;
                 column.renderWidth = sfWidth;
             });
             // 固定宽
             pxList.forEach((column) => {
-                const pWidth = XEUtils.toInteger(column.width);
+                let pWidth = XEUtils.toInteger(column.width);
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    pWidth = Math.min(pWidth, mxWidth);
+                }
                 tWidth += pWidth;
                 column.renderWidth = pWidth;
             });
             // 自适应宽
             autoList.forEach((column) => {
-                const aWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
+                let aWidth = Math.max(60, XEUtils.toInteger(column.renderAutoWidth));
+                const mxWidth = parseColumnMaxWidth(column);
+                if (mxWidth) {
+                    aWidth = Math.min(aWidth, mxWidth);
+                }
                 tWidth += aWidth;
                 column.renderWidth = aWidth;
             });
@@ -16501,11 +16574,12 @@ var VxeTableComponent = defineVxeComponent({
                 tWidth += reWidth;
                 column.renderWidth = reWidth;
             });
+            const zoomColumnList = scaleMinList.concat(pxMinList).concat(autoMinList).filter(column => !parseColumnMaxWidth(column));
             remainWidth -= tWidth;
-            meanWidth = remainWidth > 0 ? Math.floor(remainWidth / (scaleMinList.length + pxMinList.length + autoMinList.length + remainList.length)) : 0;
+            meanWidth = remainWidth > 0 ? Math.floor(remainWidth / (zoomColumnList.length + remainList.length)) : 0;
             if (fit) {
                 if (remainWidth > 0) {
-                    scaleMinList.concat(pxMinList).concat(autoMinList).forEach((column) => {
+                    zoomColumnList.forEach((column) => {
                         tWidth += meanWidth;
                         column.renderWidth += meanWidth;
                     });
@@ -16524,8 +16598,9 @@ var VxeTableComponent = defineVxeComponent({
                 /**
                  * 偏移量算法
                  * 如果所有列足够放的情况下，从最后动态列开始分配
+                 * 排除已设置 max-width
                  */
-                const dynamicList = scaleList.concat(scaleMinList).concat(pxMinList).concat(autoMinList).concat(remainList);
+                const dynamicList = scaleList.concat(scaleMinList).concat(pxMinList).concat(autoMinList).concat(remainList).filter(column => !parseColumnMaxWidth(column));
                 let dynamicSize = dynamicList.length - 1;
                 if (dynamicSize > 0) {
                     let i = bodyWidth - tWidth;
@@ -18671,6 +18746,7 @@ var VxeTableComponent = defineVxeComponent({
                         loadScrollXData();
                     }
                 });
+                $xeTable.clearHeaderFormatterCache();
                 $xeTable.clearMergeCells();
                 $xeTable.clearMergeFooterItems();
                 $xeTable.handleTableData(true);
@@ -19912,6 +19988,77 @@ var VxeTableComponent = defineVxeComponent({
                 }
                 return nextTick();
             },
+            getHeaderCellLabel(fieldOrColumn) {
+                const column = handleFieldOrColumn($xeTable, fieldOrColumn);
+                if (!column) {
+                    return null;
+                }
+                const { headerFormatter } = column;
+                const _columnIndex = $xeTable.getVTColumnIndex(column);
+                let cellLabel = column.getTitle();
+                if (headerFormatter) {
+                    const { headerFullDataColData } = internalData;
+                    const colid = column.id;
+                    let colRest = headerFullDataColData[colid];
+                    if (!colRest) {
+                        colRest = headerFullDataColData[colid] = {};
+                    }
+                    const formatObj = colRest.formatObj;
+                    if (formatObj && formatObj.value === cellLabel) {
+                        return formatObj.label;
+                    }
+                    const headFormatParams = {
+                        $table: $xeTable,
+                        cellTitle: cellLabel,
+                        cellValue: cellLabel,
+                        column,
+                        _columnIndex,
+                        columnIndex: $xeTable.getColumnIndex(column)
+                    };
+                    if (XEUtils.isString(headerFormatter)) {
+                        const gFormatOpts = formats.get(headerFormatter);
+                        const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
+                        cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams) : '');
+                    }
+                    else if (XEUtils.isArray(headerFormatter)) {
+                        const gFormatOpts = formats.get(headerFormatter[0]);
+                        const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
+                        cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams, ...headerFormatter.slice(1)) : '');
+                    }
+                    else {
+                        cellLabel = XEUtils.toValueString(headerFormatter(headFormatParams));
+                    }
+                }
+                return cellLabel;
+            },
+            updateHeaderCellLabel(fieldOrColumn) {
+                const column = handleFieldOrColumn($xeTable, fieldOrColumn);
+                if (!column) {
+                    return '';
+                }
+                const { headerFullDataColData } = internalData;
+                const colid = column.id;
+                const colRest = headerFullDataColData[colid];
+                if (colRest) {
+                    colRest.formatObj = undefined;
+                }
+                return $xeTable.getHeaderCellLabel(column);
+            },
+            clearHeaderFormatterCache(isUpdate) {
+                const { tableColumn } = reactData;
+                const { headerFullDataColData } = internalData;
+                XEUtils.each(headerFullDataColData, (colRest) => {
+                    if (colRest.formatObj) {
+                        colRest.formatObj = undefined;
+                    }
+                });
+                if (isUpdate) {
+                    tableColumn.forEach(column => {
+                        $xeTable.getHeaderCellLabel(column);
+                    });
+                }
+                return nextTick();
+            },
             getFooterCellLabel(row, fieldOrColumn) {
                 const column = handleFieldOrColumn($xeTable, fieldOrColumn);
                 if (!column) {
@@ -22123,6 +22270,7 @@ var VxeTableComponent = defineVxeComponent({
                     footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }) : [];
                 }
                 reactData.footerTableData = footData;
+                $xeTable.clearFooterFormatterCache();
                 $xeTable.handleUpdateFooterMerge();
                 $xeTable.dispatchEvent('footer-data-change', {
                     visibleColumn: internalData.visibleColumn,
@@ -23932,6 +24080,7 @@ var VxeTableComponent = defineVxeComponent({
                 const dragBtnOffsetWidth = XEUtils.floor(dragBtnWidth / 2);
                 const dragPosLeft = dragBtnRect.x - tableRect.x + dragBtnOffsetWidth;
                 const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth; // 列之间的最小间距
+                const maxInterval = getColReMaxWidth(cellParams); // 列之间的最大间距
                 const dragMinLeft = isRightFixed ? 0 : (cellRect.x - tableRect.x + dragBtnWidth + minInterval);
                 const dragMaxLeft = cellRect.x - tableRect.x + cell.clientWidth - minInterval;
                 let fixedLeftRemainWidth = 0;
@@ -23971,6 +24120,10 @@ var VxeTableComponent = defineVxeComponent({
                         left = Math.min(left, dragMaxLeft);
                     }
                     dragLeft = Math.max(left, dragMinLeft);
+                    // 最大宽
+                    if (maxInterval > 1) {
+                        dragLeft = Math.min(dragLeft, maxInterval + dragMinLeft - minInterval);
+                    }
                     const resizeBarLeft = Math.max(1, dragLeft);
                     resizeBarElem.style.left = `${resizeBarLeft}px`;
                     resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`;
@@ -24051,6 +24204,7 @@ var VxeTableComponent = defineVxeComponent({
                     const cell = dragBtnElem.parentNode;
                     const cellParams = Object.assign(params, { cell, $table: $xeTable });
                     const colMinWidth = getColReMinWidth(cellParams);
+                    const colMaxWidth = getColReMaxWidth(cellParams);
                     el.setAttribute('data-calc-col', 'Y');
                     let resizeWidth = calcColumnAutoWidth(resizeColumn, el);
                     el.removeAttribute('data-calc-col');
@@ -24058,6 +24212,9 @@ var VxeTableComponent = defineVxeComponent({
                         resizeWidth = Math.max(resizeWidth, colRest.width);
                     }
                     resizeWidth = Math.max(colMinWidth, resizeWidth);
+                    if (colMaxWidth > 1) {
+                        resizeWidth = Math.min(colMaxWidth, resizeWidth);
+                    }
                     const resizeParams = Object.assign(Object.assign({}, params), { resizeWidth, resizeColumn });
                     reactData.isDragResize = false;
                     internalData._lastResizeTime = Date.now();