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

package/es/table/src/footer.js

@@ -329,7 +329,10 @@ export default defineComponent({
                         }, renderColumnList.map((column, $columnIndex) => {
                             return h('col', {
                                 name: column.id,
-                                key: $columnIndex
+                                key: $columnIndex,
+                                style: {
+                                    width: `${column.renderWidth}px`
+                                }
                             });
                         })),
                         /**

package/es/table/src/header.js

@@ -290,7 +290,10 @@ export default defineComponent({
                         }, renderColumnList.map((column, $columnIndex) => {
                             return h('col', {
                                 name: column.id,
-                                key: $columnIndex
+                                key: $columnIndex,
+                                style: {
+                                    width: `${column.renderWidth}px`
+                                }
                             });
                         })),
                         /**

package/es/table/src/table.js

@@ -6682,8 +6682,9 @@ export default defineComponent({
          * @param {Event} evnt 事件
          * @param {Row} row 行对象
          */
-        const handleTooltip = (evnt, tdEl, overflowElem, tipElem, params) => {
-            if (!overflowElem) {
+        const handleTooltip = (evnt, tdEl, overflowElem, params) => {
+            const tipOverEl = overflowElem || tdEl;
+            if (!tipOverEl) {
                 return nextTick();
             }
             params.cell = tdEl;
@@ -6693,9 +6694,8 @@ export default defineComponent({
             const { showAll, contentMethod } = tooltipOpts;
             const customContent = contentMethod ? contentMethod(params) : null;
             const useCustom = contentMethod && !XEUtils.eqNull(customContent);
-            const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim();
-            const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth;
-            if (content && (showAll || useCustom || isCellOverflow)) {
+            const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? tipOverEl.innerText : tipOverEl.textContent).trim();
+            if (content && (showAll || useCustom || (tipOverEl.scrollWidth > tipOverEl.clientWidth))) {
                 Object.assign(tooltipStore, {
                     row,
                     column,
@@ -6705,7 +6705,7 @@ export default defineComponent({
                 nextTick(() => {
                     const $tooltip = refTooltip.value;
                     if ($tooltip && $tooltip.open) {
-                        $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content));
+                        $tooltip.open(tipOverEl, formatText(content));
                     }
                 });
             }
@@ -7672,7 +7672,7 @@ export default defineComponent({
                     return;
                 }
                 if (tooltipStore.column !== column || !tooltipStore.visible) {
-                    handleTooltip(evnt, thEl, cellEl, null, params);
+                    handleTooltip(evnt, thEl, thEl.querySelector('.vxe-cell--title') || cellEl, params);
                 }
             },
             /**
@@ -7699,7 +7699,7 @@ export default defineComponent({
                     }
                 }
                 if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
-                    handleTooltip(evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper'), null, params);
+                    handleTooltip(evnt, tdEl, tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
                 }
             },
             /**
@@ -7708,10 +7708,10 @@ export default defineComponent({
             triggerFooterTooltipEvent(evnt, params) {
                 const { column } = params;
                 const { tooltipStore } = reactData;
-                const cell = evnt.currentTarget;
+                const tdEl = 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);
+                    handleTooltip(evnt, tdEl, tdEl.querySelector('.vxe-cell--label') || tdEl.querySelector('.vxe-cell--wrapper'), params);
                 }
             },
             handleTargetLeaveEvent() {

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "4.12.0-beta.26";
+export const version = "4.12.0-beta.27";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({

package/es/ui/src/log.js

@@ -1,5 +1,5 @@
 import { VxeUI } from '@vxe-ui/core';
 const { log } = VxeUI;
-const version = `table v${"4.12.0-beta.26"}`;
+const version = `table v${"4.12.0-beta.27"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);

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.27";
 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.27"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// ./packages/table/src/columnInfo.ts
@@ -4951,15 +4951,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 +4976,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 {
@@ -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`
+          }
         });
       })),
       /**
@@ -7538,7 +7549,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`
+          }
         });
       })),
       /**
@@ -8025,7 +8039,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`
+          }
         });
       })),
       /**
@@ -11051,7 +11068,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 +11124,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);},/**
              * 列点击事件
              * 如果是单击模式，则激活为编辑状态
              * 如果是双击模式，则单击后选中状态