vxe-table 4.12.0-beta.26 → 4.12.0-beta.28

package/lib/index.umd.js

@@ -3138,7 +3138,7 @@ function eqEmptyValue(cellValue) {
 ;// ./packages/ui/index.ts
 
 
-const version = "4.12.0-beta.26";
+const version = "4.12.0-beta.28";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -3587,7 +3587,7 @@ var esnext_iterator_some = __webpack_require__(7550);
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"4.12.0-beta.26"}`;
+const log_version = `table v${"4.12.0-beta.28"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// ./packages/table/src/columnInfo.ts
@@ -3608,12 +3608,10 @@ class ColumnInfo {
     renderFooter,
     renderData
   } = {}) {
-    const $xeGrid = $xeTable.xegrid;
+    const tableProps = $xeTable.props;
+    const $xeGrid = $xeTable.xeGrid;
     const formatter = _vm.formatter;
     const visible = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(_vm.visible) ? _vm.visible : true;
-    const {
-      props: tableProps
-    } = $xeTable;
     const types = ['seq', 'checkbox', 'radio', 'expand', 'html'];
     if (_vm.type && types.indexOf(_vm.type) === -1) {
       warnLog('vxe.error.errProp', [`type=${_vm.type}`, types.join(', ')]);
@@ -4951,15 +4949,21 @@ function getFooterContent(params) {
   });
   if (footerFormatter) {
     if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(footerFormatter)) {
-      return `${footerFormatter(footParams)}`;
+      return [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+        class: 'vxe-cell--label'
+      }, `${footerFormatter(footParams)}`)];
     }
     const isArr = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(footerFormatter);
     const gFormatOpts = isArr ? cell_formats.get(footerFormatter[0]) : cell_formats.get(footerFormatter);
     const footerFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
     if (footerFormatMethod) {
-      return `${isArr ? footerFormatMethod(footParams, ...footerFormatter.slice(1)) : footerFormatMethod(footParams)}`;
+      return [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+        class: 'vxe-cell--label'
+      }, `${isArr ? footerFormatMethod(footParams, ...footerFormatter.slice(1)) : footerFormatMethod(footParams)}`)];
     }
-    return '';
+    return [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+      class: 'vxe-cell--label'
+    }, '')];
   }
   if (renderOpts) {
     const compConf = cell_renderer.get(renderOpts.name);
@@ -4970,7 +4974,9 @@ function getFooterContent(params) {
       }
     }
   }
-  return [formatText(itemValue, 1)];
+  return [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+    class: 'vxe-cell--label'
+  }, formatText(itemValue, 1))];
 }
 function getDefaultCellLabel(params) {
   const {
@@ -6339,6 +6345,7 @@ const renderType = 'body';
      * 渲染列
      */
     const renderTdColumn = (seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, columns, items) => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         fullAllDataRowIdData,
         visibleColumn
@@ -6456,7 +6463,7 @@ const renderType = 'body';
       };
       const cellParams = {
         $table: $xeTable,
-        $grid: $xeTable.xegrid,
+        $grid: $xeGrid,
         isEdit: false,
         seq,
         rowid,
@@ -6965,6 +6972,7 @@ const renderType = 'body';
       const {
         slots
       } = tableContext;
+      const $xeGrid = $xeTable.xeGrid;
       const {
         fixedColumn,
         fixedType,
@@ -7069,7 +7077,7 @@ const renderType = 'body';
       if (emptySlot) {
         emptyContent = $xeTable.callSlot(emptySlot, {
           $table: $xeTable,
-          $grid: $xeTable.xegrid
+          $grid: $xeGrid
         });
       } else {
         const compConf = emptyOpts.name ? body_renderer.get(emptyOpts.name) : null;
@@ -7117,7 +7125,10 @@ const renderType = 'body';
       }, renderColumnList.map((column, $columnIndex) => {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('col', {
           name: column.id,
-          key: $columnIndex
+          key: $columnIndex,
+          style: {
+            width: `${column.renderWidth}px`
+          }
         });
       })),
       /**
@@ -7224,6 +7235,7 @@ const header_renderType = 'header';
       headerColumn.value = isGroup ? convertHeaderColumnToRows(props.tableGroupColumn) : [];
     };
     const renderRows = (isGroup, isOptimizeMode, cols, $rowIndex) => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         fixedType
       } = props;
@@ -7291,7 +7303,7 @@ const header_renderType = 'header';
         const _columnIndex = $xeTable.getVTColumnIndex(column);
         const cellParams = {
           $table: $xeTable,
-          $grid: $xeTable.xegrid,
+          $grid: $xeGrid,
           $rowIndex,
           column,
           columnIndex,
@@ -7538,7 +7550,10 @@ const header_renderType = 'header';
       }, renderColumnList.map((column, $columnIndex) => {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('col', {
           name: column.id,
-          key: $columnIndex
+          key: $columnIndex,
+          style: {
+            width: `${column.renderWidth}px`
+          }
         });
       })),
       /**
@@ -7687,6 +7702,7 @@ function mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex) {
     const refFooterTFoot = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refFooterXSpace = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const renderRows = (tableColumn, footerTableData, row, $rowIndex, _rowIndex) => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         fixedType
       } = props;
@@ -7754,7 +7770,7 @@ function mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex) {
         const itemIndex = _columnIndex;
         const cellParams = {
           $table: $xeTable,
-          $grid: $xeTable.xegrid,
+          $grid: $xeGrid,
           row,
           rowIndex: _rowIndex,
           _rowIndex,
@@ -8025,7 +8041,10 @@ function mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex) {
       }, renderColumnList.map((column, $columnIndex) => {
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('col', {
           name: column.id,
-          key: $columnIndex
+          key: $columnIndex,
+          style: {
+            width: `${column.renderWidth}px`
+          }
         });
       })),
       /**
@@ -8854,6 +8873,7 @@ const {
       }, panel_getI18n('vxe.custom.cstmDragTarget', [dragCol && dragCol.type !== 'html' ? dragCol.getTitle() : '']))])])]);
     };
     const renderSimplePanel = () => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         customStore
       } = props;
@@ -8899,7 +8919,7 @@ const {
       }
       const params = {
         $table: $xeTable,
-        $grid: $xeTable.xegrid,
+        $grid: $xeGrid,
         columns: customColumnList,
         isAllChecked,
         isAllIndeterminate,
@@ -9056,6 +9076,7 @@ const {
       }) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_.createCommentVNode)()])]) : null] : []);
     };
     const renderPopupPanel = () => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         customStore
       } = props;
@@ -9108,7 +9129,7 @@ const {
       const isAllIndeterminate = customStore.isIndeterminate;
       const params = {
         $table: $xeTable,
-        $grid: $xeTable.xegrid,
+        $grid: $xeGrid,
         columns: customColumnList,
         isAllChecked,
         isAllIndeterminate,
@@ -9719,6 +9740,7 @@ const {
       });
     };
     const renderVN = () => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         defaultOptions,
         storeData
@@ -9755,7 +9777,7 @@ const {
         default: () => {
           const params = {
             $table: $xeTable,
-            $grid: $xeTable.xegrid,
+            $grid: $xeGrid,
             options: defaultOptions,
             params: defaultOptions.params
           };
@@ -9793,7 +9815,7 @@ const {
         footer() {
           const params = {
             $table: $xeTable,
-            $grid: $xeTable.xegrid,
+            $grid: $xeGrid,
             options: defaultOptions,
             params: defaultOptions.params
           };
@@ -10014,6 +10036,7 @@ const {
       }
     };
     const renderVN = () => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         defaultOptions,
         storeData
@@ -10099,7 +10122,7 @@ const {
         default: () => {
           const params = {
             $table: $xeTable,
-            $grid: $xeTable.xegrid,
+            $grid: $xeGrid,
             options: defaultOptions,
             columns,
             params: defaultOptions.params
@@ -10240,7 +10263,7 @@ const {
         footer() {
           const params = {
             $table: $xeTable,
-            $grid: $xeTable.xegrid,
+            $grid: $xeGrid,
             options: defaultOptions,
             columns,
             params: defaultOptions.params
@@ -11051,7 +11074,7 @@ if(editMode!=='insert'){setCellValue(selected.row,selected.column,null);}$xeTabl
          * 处理显示 tooltip
          * @param {Event} evnt 事件
          * @param {Row} row 行对象
-         */const handleTooltip=(evnt,tdEl,overflowElem,tipElem,params)=>{if(!overflowElem){return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();}params.cell=tdEl;const{tooltipStore}=reactData;const tooltipOpts=computeTooltipOpts.value;const{column,row}=params;const{showAll,contentMethod}=tooltipOpts;const customContent=contentMethod?contentMethod(params):null;const useCustom=contentMethod&&!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(customContent);const content=useCustom?customContent:external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toString(column.type==='html'?overflowElem.innerText:overflowElem.textContent).trim();const isCellOverflow=overflowElem.scrollWidth>overflowElem.clientWidth;if(content&&(showAll||useCustom||isCellOverflow)){Object.assign(tooltipStore,{row,column,visible:true,currOpts:{}});(0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(()=>{const $tooltip=refTooltip.value;if($tooltip&&$tooltip.open){$tooltip.open(isCellOverflow?overflowElem:tipElem||overflowElem,formatText(content));}});}return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();};const callSlot=(slotFunc,params)=>{if(slotFunc){if($xeGrid){return $xeGrid.callSlot(slotFunc,params);}if(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(slotFunc)){return getSlotVNs(slotFunc(params));}}return[];};/**
+         */const handleTooltip=(evnt,tdEl,overflowElem,params)=>{const tipOverEl=overflowElem||tdEl;if(!tipOverEl){return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();}params.cell=tdEl;const{tooltipStore}=reactData;const tooltipOpts=computeTooltipOpts.value;const{column,row}=params;const{showAll,contentMethod}=tooltipOpts;const customContent=contentMethod?contentMethod(params):null;const useCustom=contentMethod&&!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(customContent);const content=useCustom?customContent:external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toString(column.type==='html'?tipOverEl.innerText:tipOverEl.textContent).trim();if(content&&(showAll||useCustom||tipOverEl.scrollWidth>tipOverEl.clientWidth)){Object.assign(tooltipStore,{row,column,visible:true,currOpts:{}});(0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(()=>{const $tooltip=refTooltip.value;if($tooltip&&$tooltip.open){$tooltip.open(tipOverEl,formatText(content));}});}return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();};const callSlot=(slotFunc,params)=>{if(slotFunc){if($xeGrid){return $xeGrid.callSlot(slotFunc,params);}if(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(slotFunc)){return getSlotVNs(slotFunc(params));}}return[];};/**
          * 内部方法
          */tablePrivateMethods={getSetupOptions(){return table_getConfig();},updateAfterDataIndex,callSlot,/**
              * 获取父容器元素
@@ -11107,14 +11130,14 @@ rows.forEach(row=>{const rowid=handleGetRowId(row);if(isForce||!checkMethod||che
              * @deprecated
              */handleSelectRow({row},checked,isForce){$xeTable.handleBatchSelectRows([row],checked,isForce);},triggerHeaderTitleEvent(evnt,iconParams,params){const tipContent=iconParams.content||iconParams.message;if(tipContent){const{tooltipStore}=reactData;const{column}=params;const content=getFuncText(tipContent);handleTargetEnterEvent(true);tooltipStore.row=null;tooltipStore.column=column;tooltipStore.visible=true;tooltipStore.currOpts=iconParams;(0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(()=>{const $tooltip=refTooltip.value;if($tooltip&&$tooltip.open){$tooltip.open(evnt.currentTarget,content);}});}},/**
              * 触发表头 tooltip 事件
-             */triggerHeaderTooltipEvent(evnt,params){const{tooltipStore}=reactData;const{column}=params;handleTargetEnterEvent(true);const titleElem=evnt.currentTarget;if(!titleElem){return;}const cellEl=titleElem.parentElement;if(!cellEl){return;}const thEl=cellEl.parentElement;if(!thEl){return;}if(tooltipStore.column!==column||!tooltipStore.visible){handleTooltip(evnt,thEl,cellEl,null,params);}},/**
+             */triggerHeaderTooltipEvent(evnt,params){const{tooltipStore}=reactData;const{column}=params;handleTargetEnterEvent(true);const titleElem=evnt.currentTarget;if(!titleElem){return;}const cellEl=titleElem.parentElement;if(!cellEl){return;}const thEl=cellEl.parentElement;if(!thEl){return;}if(tooltipStore.column!==column||!tooltipStore.visible){handleTooltip(evnt,thEl,thEl.querySelector('.vxe-cell--title')||cellEl,params);}},/**
              * 触发单元格 tooltip 事件
              */triggerBodyTooltipEvent(evnt,params){const{editConfig}=props;const{editStore}=reactData;const{tooltipStore}=reactData;const editOpts=computeEditOpts.value;const{actived}=editStore;const{row,column}=params;const tdEl=evnt.currentTarget;handleTargetEnterEvent(tooltipStore.column!==column||tooltipStore.row!==row);// 单元格处于编辑状态时不触发提示框
 if(column.editRender&&isEnableConf(editConfig)){// 如果是行编辑模式
 if(editOpts.mode==='row'&&actived.row===row){return;}// 如果是单元格编辑模式
-if(actived.row===row&&actived.column===column){return;}}if(tooltipStore.column!==column||tooltipStore.row!==row||!tooltipStore.visible){handleTooltip(evnt,tdEl,tdEl.querySelector('.vxe-cell--wrapper'),null,params);}},/**
+if(actived.row===row&&actived.column===column){return;}}if(tooltipStore.column!==column||tooltipStore.row!==row||!tooltipStore.visible){handleTooltip(evnt,tdEl,tdEl.querySelector('.vxe-cell--label')||tdEl.querySelector('.vxe-cell--wrapper'),params);}},/**
              * 触发表尾 tooltip 事件
-             */triggerFooterTooltipEvent(evnt,params){const{column}=params;const{tooltipStore}=reactData;const cell=evnt.currentTarget;handleTargetEnterEvent(tooltipStore.column!==column||!!tooltipStore.row);if(tooltipStore.column!==column||!tooltipStore.visible){handleTooltip(evnt,cell,cell.querySelector('.vxe-cell--wrapper')||cell.children[0],null,params);}},handleTargetLeaveEvent(){const tooltipOpts=computeTooltipOpts.value;let $tooltip=refTooltip.value;if($tooltip&&$tooltip.setActived){$tooltip.setActived(false);}if(tooltipOpts.enterable){internalData.tooltipTimeout=setTimeout(()=>{$tooltip=refTooltip.value;if($tooltip&&$tooltip.isActived&&!$tooltip.isActived()){$xeTable.closeTooltip();}},tooltipOpts.leaveDelay);}else{$xeTable.closeTooltip();}},triggerHeaderCellClickEvent(evnt,params){const{_lastResizeTime}=internalData;const sortOpts=computeSortOpts.value;const columnOpts=computeColumnOpts.value;const currentColumnOpts=computeCurrentColumnOpts.value;const{column}=params;const cell=evnt.currentTarget;const triggerResizable=_lastResizeTime&&_lastResizeTime>Date.now()-300;const triggerSort=getEventTargetNode(evnt,cell,'vxe-cell--sort').flag;const triggerFilter=getEventTargetNode(evnt,cell,'vxe-cell--filter').flag;if(sortOpts.trigger==='cell'&&!(triggerResizable||triggerSort||triggerFilter)){$xeTable.triggerSortEvent(evnt,column,getNextSortOrder(column));}dispatchEvent('header-cell-click',Object.assign({triggerResizable,triggerSort,triggerFilter,cell},params),evnt);if((columnOpts.isCurrent||props.highlightCurrentColumn)&&(!currentColumnOpts.trigger||['header','default'].includes(currentColumnOpts.trigger))){$xeTable.triggerCurrentColumnEvent(evnt,params);}},triggerHeaderCellDblclickEvent(evnt,params){dispatchEvent('header-cell-dblclick',Object.assign({cell:evnt.currentTarget},params),evnt);},/**
+             */triggerFooterTooltipEvent(evnt,params){const{column}=params;const{tooltipStore}=reactData;const tdEl=evnt.currentTarget;handleTargetEnterEvent(tooltipStore.column!==column||!!tooltipStore.row);if(tooltipStore.column!==column||!tooltipStore.visible){handleTooltip(evnt,tdEl,tdEl.querySelector('.vxe-cell--label')||tdEl.querySelector('.vxe-cell--wrapper'),params);}},handleTargetLeaveEvent(){const tooltipOpts=computeTooltipOpts.value;let $tooltip=refTooltip.value;if($tooltip&&$tooltip.setActived){$tooltip.setActived(false);}if(tooltipOpts.enterable){internalData.tooltipTimeout=setTimeout(()=>{$tooltip=refTooltip.value;if($tooltip&&$tooltip.isActived&&!$tooltip.isActived()){$xeTable.closeTooltip();}},tooltipOpts.leaveDelay);}else{$xeTable.closeTooltip();}},triggerHeaderCellClickEvent(evnt,params){const{_lastResizeTime}=internalData;const sortOpts=computeSortOpts.value;const columnOpts=computeColumnOpts.value;const currentColumnOpts=computeCurrentColumnOpts.value;const{column}=params;const cell=evnt.currentTarget;const triggerResizable=_lastResizeTime&&_lastResizeTime>Date.now()-300;const triggerSort=getEventTargetNode(evnt,cell,'vxe-cell--sort').flag;const triggerFilter=getEventTargetNode(evnt,cell,'vxe-cell--filter').flag;if(sortOpts.trigger==='cell'&&!(triggerResizable||triggerSort||triggerFilter)){$xeTable.triggerSortEvent(evnt,column,getNextSortOrder(column));}dispatchEvent('header-cell-click',Object.assign({triggerResizable,triggerSort,triggerFilter,cell},params),evnt);if((columnOpts.isCurrent||props.highlightCurrentColumn)&&(!currentColumnOpts.trigger||['header','default'].includes(currentColumnOpts.trigger))){$xeTable.triggerCurrentColumnEvent(evnt,params);}},triggerHeaderCellDblclickEvent(evnt,params){dispatchEvent('header-cell-dblclick',Object.assign({cell:evnt.currentTarget},params),evnt);},/**
              * 列点击事件
              * 如果是单击模式，则激活为编辑状态
              * 如果是双击模式，则单击后选中状态
@@ -12101,13 +12124,14 @@ menu_hook_hooks.add('tableMenuModule', {
        * 快捷菜单点击事件
        */
       ctxMenuLinkEvent(evnt, menu) {
+        const $xeGrid = $xeTable.xeGrid;
         // 如果一级菜单有配置 code 则允许点击，否则不能点击
         if (!menu.disabled && (menu.code || !menu.children || !menu.children.length)) {
           const gMenuOpts = hook_menus.get(menu.code);
           const params = Object.assign({}, internalData._currMenuParams, {
             menu,
             $table: $xeTable,
-            $grid: $xeTable.xegrid,
+            $grid: $xeGrid,
             $event: evnt
           });
           const tmMethod = gMenuOpts ? gMenuOpts.tableMenuMethod || gMenuOpts.menuMethod : null;
@@ -12618,6 +12642,7 @@ edit_hook_hooks.add('tableEditModule', {
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => $xeTable.updateCellAreas());
     };
     const handleEditActive = (params, evnt, isFocus, isPos) => {
+      const $xeGrid = $xeTable.xeGrid;
       const {
         editConfig,
         mouseConfig
@@ -12653,7 +12678,7 @@ edit_hook_hooks.add('tableEditModule', {
             if (!beforeEditMethod || beforeEditMethod({
               ...params,
               $table: $xeTable,
-              $grid: $xeTable.xegrid
+              $grid: $xeGrid
             })) {
               if (mouseConfig) {
                 $xeTable.clearSelected();
@@ -12685,7 +12710,7 @@ edit_hook_hooks.add('tableEditModule', {
                   afterEditMethod({
                     ...params,
                     $table: $xeTable,
-                    $grid: $xeTable.xegrid
+                    $grid: $xeGrid
                   });
                 }
               });
@@ -16149,6 +16174,7 @@ validator_hook_hooks.add('tableValidatorModule', {
        *  trigger=blur|change 触发方式（除非特殊场景，否则默认为空就行）
        */
       validCellRules(validType, row, column, val) {
+        const $xeGrid = $xeTable.xeGrid;
         const {
           editRules
         } = props;
@@ -16180,7 +16206,7 @@ validator_hook_hooks.add('tableValidatorModule', {
                     columnIndex: $xeTable.getColumnIndex(column),
                     field: column.field,
                     $table: $xeTable,
-                    $grid: $xeTable.xegrid
+                    $grid: $xeGrid
                   };
                   let customValid;
                   if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(validator)) {
@@ -16396,7 +16422,7 @@ core_.VxeUI.hooks.add('tableCustomModule', {
     const {
       refElem
     } = $xeTable.getRefMaps();
-    const $xeGrid = $xeTable.xegrid;
+    const $xeGrid = $xeTable.xeGrid;
     const calcMaxHeight = () => {
       const {
         customStore