vxe-table 3.18.7 → 3.18.8

package/es/table/src/methods.js

@@ -2695,7 +2695,7 @@ function clearRowDragData($xeTable) {
  * @param {Event} evnt 事件
  * @param {Row} row 行对象
  */
-function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
+function handleTooltip($xeTable, evnt, type, tdEl, overflowElem, tipElem, params) {
     const reactData = $xeTable;
     const tipOverEl = overflowElem || tdEl;
     if (!tipOverEl) {
@@ -2711,16 +2711,19 @@ function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
     const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? tipOverEl.innerText : tipOverEl.textContent).trim();
     const isOver = tipOverEl.scrollWidth > tipOverEl.clientWidth;
     if (content && (showAll || useCustom || isOver)) {
+        const tipContent = formatText(content);
         Object.assign(tooltipStore, {
             row,
             column,
             visible: true,
+            content: tipContent,
+            type,
             currOpts: {}
         });
         $xeTable.$nextTick(() => {
             const $tooltip = $xeTable.$refs.refTooltip;
             if ($tooltip && $tooltip.open) {
-                $tooltip.open(isOver ? tipOverEl : tipElem, formatText(content));
+                $tooltip.open(isOver ? tipOverEl : tipElem, tipContent);
             }
         });
     }
@@ -6886,7 +6889,7 @@ const Methods = {
         }
         if (tooltipStore.column !== column || !tooltipStore.visible) {
             const ctEl = thEl.querySelector('.vxe-cell--title');
-            handleTooltip($xeTable, evnt, thEl, (hasClass(thEl, 'col--ellipsis') ? ctEl : cWrapperEl) || cWrapperEl, ctEl || cellEl, params);
+            handleTooltip($xeTable, evnt, 'header', thEl, (hasClass(thEl, 'col--ellipsis') ? ctEl : cWrapperEl) || cWrapperEl, ctEl || cellEl, params);
         }
     },
     /**
@@ -6925,7 +6928,7 @@ const Methods = {
             if (!tipEl) {
                 tipEl = ctEl;
             }
-            handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
+            handleTooltip($xeTable, evnt, 'body', tdEl, ovEl || ctEl, tipEl, params);
         }
     },
     /**
@@ -6948,7 +6951,7 @@ const Methods = {
             if (!tipEl) {
                 tipEl = ctEl;
             }
-            handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
+            handleTooltip($xeTable, evnt, 'footer', tdEl, ovEl || ctEl, tipEl, params);
         }
     },
     openTooltip(target, content) {
@@ -6974,6 +6977,7 @@ const Methods = {
                 column: null,
                 content: null,
                 visible: false,
+                type: null,
                 currOpts: {}
             });
             if (tooltip) {

package/es/table/src/table.js

@@ -631,6 +631,7 @@ export default {
                 column: null,
                 content: null,
                 visible: false,
+                type: null,
                 currOpts: {}
             },
             // 存放数据校验相关信息
@@ -1865,9 +1866,15 @@ export default {
         const reactData = $xeTable;
         const { xID } = $xeTable;
         const { loading, stripe, showHeader, height, treeConfig, mouseConfig, showFooter, highlightCell, highlightHoverRow, highlightHoverColumn, editConfig, editRules } = props;
-        const { isGroup, overflowX, overflowY, scrollXLoad, scrollYLoad, tableData, initStore, isRowGroupStatus, columnStore, filterStore, customStore } = reactData;
+        const { isGroup, overflowX, overflowY, scrollXLoad, scrollYLoad, tableData, initStore, isRowGroupStatus, columnStore, filterStore, customStore, tooltipStore } = reactData;
         const { leftList, rightList } = columnStore;
         const loadingSlot = slots.loading;
+        const tipSlots = {
+            header: slots.headerTooltip || slots['header-tooltip'],
+            body: slots.tooltip,
+            footer: slots.footerTooltip || slots['footer-tooltip']
+        };
+        const currTooltipSlot = tooltipStore.visible && tooltipStore.type ? tipSlots[tooltipStore.type] : null;
         const rowDragOpts = $xeTable.computeRowDragOpts;
         const tableTipConfig = $xeTable.computeTableTipConfig;
         const validTipConfig = $xeTable.computeValidTipConfig;
@@ -2141,8 +2148,39 @@ export default {
                             enterable: tableTipConfig.enterable,
                             enterDelay: tableTipConfig.enterDelay,
                             leaveDelay: tableTipConfig.leaveDelay,
-                            useHTML: tableTipConfig.useHTML
-                        }
+                            useHTML: tableTipConfig.useHTML,
+                            width: tableTipConfig.width,
+                            height: tableTipConfig.height,
+                            minWidth: tableTipConfig.minWidth,
+                            minHeight: tableTipConfig.minHeight,
+                            maxWidth: tableTipConfig.maxWidth,
+                            maxHeight: tableTipConfig.maxHeight
+                        },
+                        scopedSlots: currTooltipSlot
+                            ? {
+                                content: () => {
+                                    const { type, row, column, content: tooltipContent } = tooltipStore;
+                                    if (currTooltipSlot) {
+                                        if (column && type === 'header') {
+                                            return h('div', {
+                                                key: type
+                                            }, currTooltipSlot({ column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
+                                        }
+                                        if (row && column && type === 'body') {
+                                            return h('div', {
+                                                key: type
+                                            }, currTooltipSlot({ row, column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
+                                        }
+                                        if (row && column && type === 'footer') {
+                                            return h('div', {
+                                                key: type
+                                            }, currTooltipSlot({ row, column, tooltipContent, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }));
+                                        }
+                                    }
+                                    return renderEmptyElement($xeTable);
+                                }
+                            }
+                            : {}
                     })
                     : renderEmptyElement($xeTable),
                 /**

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "3.18.7";
+export const version = "3.18.8";
 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${"3.18.7"}`;
+const version = `table v${"3.18.8"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);

package/lib/index.umd.js

@@ -2002,7 +2002,7 @@ function getClass(property, params) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "3.18.7";
+const version = "3.18.8";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -2678,7 +2678,7 @@ function isNodeElement(elem) {
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"3.18.7"}`;
+const log_version = `table v${"3.18.8"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -9067,7 +9067,7 @@ function clearRowDragData($xeTable) {
  * @param {Event} evnt 事件
  * @param {Row} row 行对象
  */
-function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
+function handleTooltip($xeTable, evnt, type, tdEl, overflowElem, tipElem, params) {
   const reactData = $xeTable;
   const tipOverEl = overflowElem || tdEl;
   if (!tipOverEl) {
@@ -9091,16 +9091,19 @@ function handleTooltip($xeTable, evnt, tdEl, overflowElem, tipElem, params) {
   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();
   const isOver = tipOverEl.scrollWidth > tipOverEl.clientWidth;
   if (content && (showAll || useCustom || isOver)) {
+    const tipContent = formatText(content);
     Object.assign(tooltipStore, {
       row,
       column,
       visible: true,
+      content: tipContent,
+      type,
       currOpts: {}
     });
     $xeTable.$nextTick(() => {
       const $tooltip = $xeTable.$refs.refTooltip;
       if ($tooltip && $tooltip.open) {
-        $tooltip.open(isOver ? tipOverEl : tipElem, formatText(content));
+        $tooltip.open(isOver ? tipOverEl : tipElem, tipContent);
       }
     });
   }
@@ -13857,7 +13860,7 @@ const Methods = {
     }
     if (tooltipStore.column !== column || !tooltipStore.visible) {
       const ctEl = thEl.querySelector('.vxe-cell--title');
-      handleTooltip($xeTable, evnt, thEl, (hasClass(thEl, 'col--ellipsis') ? ctEl : cWrapperEl) || cWrapperEl, ctEl || cellEl, params);
+      handleTooltip($xeTable, evnt, 'header', thEl, (hasClass(thEl, 'col--ellipsis') ? ctEl : cWrapperEl) || cWrapperEl, ctEl || cellEl, params);
     }
   },
   /**
@@ -13907,7 +13910,7 @@ const Methods = {
       if (!tipEl) {
         tipEl = ctEl;
       }
-      handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
+      handleTooltip($xeTable, evnt, 'body', tdEl, ovEl || ctEl, tipEl, params);
     }
   },
   /**
@@ -13934,7 +13937,7 @@ const Methods = {
       if (!tipEl) {
         tipEl = ctEl;
       }
-      handleTooltip($xeTable, evnt, tdEl, ovEl || ctEl, tipEl, params);
+      handleTooltip($xeTable, evnt, 'footer', tdEl, ovEl || ctEl, tipEl, params);
     }
   },
   openTooltip(target, content) {
@@ -13964,6 +13967,7 @@ const Methods = {
         column: null,
         content: null,
         visible: false,
+        type: null,
         currOpts: {}
       });
       if (tooltip) {
@@ -30169,6 +30173,7 @@ function renderBody(h, $xeTable) {
         column: null,
         content: null,
         visible: false,
+        type: null,
         currOpts: {}
       },
       // 存放数据校验相关信息
@@ -31539,13 +31544,20 @@ function renderBody(h, $xeTable) {
       isRowGroupStatus,
       columnStore,
       filterStore,
-      customStore
+      customStore,
+      tooltipStore
     } = reactData;
     const {
       leftList,
       rightList
     } = columnStore;
     const loadingSlot = slots.loading;
+    const tipSlots = {
+      header: slots.headerTooltip || slots['header-tooltip'],
+      body: slots.tooltip,
+      footer: slots.footerTooltip || slots['footer-tooltip']
+    };
+    const currTooltipSlot = tooltipStore.visible && tooltipStore.type ? tipSlots[tooltipStore.type] : null;
     const rowDragOpts = $xeTable.computeRowDragOpts;
     const tableTipConfig = $xeTable.computeTableTipConfig;
     const validTipConfig = $xeTable.computeValidTipConfig;
@@ -31782,8 +31794,62 @@ function renderBody(h, $xeTable) {
         enterable: tableTipConfig.enterable,
         enterDelay: tableTipConfig.enterDelay,
         leaveDelay: tableTipConfig.leaveDelay,
-        useHTML: tableTipConfig.useHTML
-      }
+        useHTML: tableTipConfig.useHTML,
+        width: tableTipConfig.width,
+        height: tableTipConfig.height,
+        minWidth: tableTipConfig.minWidth,
+        minHeight: tableTipConfig.minHeight,
+        maxWidth: tableTipConfig.maxWidth,
+        maxHeight: tableTipConfig.maxHeight
+      },
+      scopedSlots: currTooltipSlot ? {
+        content: () => {
+          const {
+            type,
+            row,
+            column,
+            content: tooltipContent
+          } = tooltipStore;
+          if (currTooltipSlot) {
+            if (column && type === 'header') {
+              return h('div', {
+                key: type
+              }, currTooltipSlot({
+                column,
+                tooltipContent,
+                $table: $xeTable,
+                $grid: $xeGrid,
+                $gantt: $xeGantt
+              }));
+            }
+            if (row && column && type === 'body') {
+              return h('div', {
+                key: type
+              }, currTooltipSlot({
+                row,
+                column,
+                tooltipContent,
+                $table: $xeTable,
+                $grid: $xeGrid,
+                $gantt: $xeGantt
+              }));
+            }
+            if (row && column && type === 'footer') {
+              return h('div', {
+                key: type
+              }, currTooltipSlot({
+                row,
+                column,
+                tooltipContent,
+                $table: $xeTable,
+                $grid: $xeGrid,
+                $gantt: $xeGantt
+              }));
+            }
+          }
+          return table_renderEmptyElement($xeTable);
+        }
+      } : {}
     }) : table_renderEmptyElement($xeTable),
     /**
      * 校验提示