fix(tooltip): 修复操作按钮的 visible 对角头和文本溢出场景不生效 (#3001)

* fix(tooltip): 修复操作按钮的 visible 对角头和文本溢出场景不生效 * test: 更新单测
antvis · Nov 29, 2024 · 8f56023 · 8f56023
1 parent 6204839
commit 8f56023
Show file tree

Hide file tree

Showing 8 changed files with 40 additions and 28 deletions.
diff --git a/packages/s2-core/__tests__/unit/interaction/base-interaction/click/corner-cell-click-spec.ts b/packages/s2-core/__tests__/unit/interaction/base-interaction/click/corner-cell-click-spec.ts
@@ -69,6 +69,11 @@ describe('Interaction Corner Cell Click Tests', () => {
         [],
         {
           data: { summaries: [{ name: '', selectedData: [], value: null }] },
+          operator: {
+            menu: {
+              items: [],
+            },
+          },
         },
       );
       expect(s2.interaction.getState()).toEqual({

diff --git a/packages/s2-core/__tests__/unit/interaction/base-interaction/hover-spec.ts b/packages/s2-core/__tests__/unit/interaction/base-interaction/hover-spec.ts
@@ -36,6 +36,11 @@ describe('Interaction Hover Tests', () => {
       hideSummary: true,
       isTotals: undefined,
       onlyShowCellText: true,
+      operator: {
+        menu: {
+          items: [],
+        },
+      },
     },
   ];
 

diff --git a/packages/s2-core/src/interaction/base-event.ts b/packages/s2-core/src/interaction/base-event.ts
@@ -2,9 +2,14 @@ import type {
   FederatedPointerEvent as CanvasEvent,
   DisplayObject,
 } from '@antv/g';
-import { type CellAppendInfo } from '../common';
+import {
+  type CellAppendInfo,
+  type TooltipOperatorMenuItems,
+  type TooltipOperatorOptions,
+} from '../common';
 import type { SpreadSheet } from '../sheet-type';
 import { getAppendInfo } from '../utils/interaction/common';
+import { getTooltipOptions, getTooltipVisibleOperator } from '../utils/tooltip';
 
 export interface BaseEventImplement {
   bindEvents: () => void;
@@ -30,6 +35,19 @@ export abstract class BaseEvent {
     return cellAppendInfo?.isLinkFieldText;
   };
 
+  protected getTooltipOperator(
+    event: CanvasEvent,
+    defaultMenus: TooltipOperatorMenuItems = [],
+  ): TooltipOperatorOptions {
+    const cell = this.spreadsheet.getCell(event.target)!;
+    const { operation } = getTooltipOptions(this.spreadsheet, event)!;
+
+    return getTooltipVisibleOperator(operation!, {
+      defaultMenus,
+      cell,
+    });
+  }
+
   public reset() {}
 
   public abstract bindEvents(): void;

diff --git a/packages/s2-core/src/interaction/base-interaction/click/corner-cell-click.ts b/packages/s2-core/src/interaction/base-interaction/click/corner-cell-click.ts
@@ -154,8 +154,10 @@ export class CornerCellClick extends BaseEvent implements BaseEventImplement {
   private showTooltip(event: CanvasEvent) {
     // 角头的选中是维值, 不需要计算数值总和, 显示 [`xx 项已选中`] 即可
     const selectedData = this.spreadsheet.interaction.getActiveCells();
+    const operator = this.getTooltipOperator(event);
 
     this.spreadsheet.showTooltipWithInfo(event, [], {
+      operator,
       data: {
         summaries: [
           {

diff --git a/packages/s2-core/src/interaction/base-interaction/click/data-cell-click.ts b/packages/s2-core/src/interaction/base-interaction/click/data-cell-click.ts
@@ -8,18 +8,13 @@ import {
 } from '../../../common/constant';
 import type {
   TooltipData,
-  TooltipOperatorOptions,
   ViewMeta,
   ViewMetaData,
 } from '../../../common/interface';
 import {
   afterSelectDataCells,
   getCellMeta,
 } from '../../../utils/interaction/select-event';
-import {
-  getTooltipOptions,
-  getTooltipVisibleOperator,
-} from '../../../utils/tooltip';
 import { BaseEvent, type BaseEventImplement } from '../../base-event';
 
 export class DataCellClick extends BaseEvent implements BaseEventImplement {
@@ -94,16 +89,6 @@ export class DataCellClick extends BaseEvent implements BaseEventImplement {
     });
   }
 
-  private getTooltipOperator(event: CanvasEvent): TooltipOperatorOptions {
-    const cell = this.spreadsheet.getCell(event.target)!;
-    const { operation } = getTooltipOptions(this.spreadsheet, event)!;
-
-    return getTooltipVisibleOperator(operation!, {
-      defaultMenus: [],
-      cell,
-    });
-  }
-
   private showTooltip(event: CanvasEvent, meta: ViewMeta) {
     const { data, isTotals = false, fieldValue, valueField } = meta;
     const onlyShowCellText = this.spreadsheet.isTableMode();

diff --git a/packages/s2-core/src/interaction/base-interaction/click/row-column-click.ts b/packages/s2-core/src/interaction/base-interaction/click/row-column-click.ts
@@ -26,11 +26,7 @@ import {
   isMouseEventWithMeta,
   isMultiSelectionKey,
 } from '../../../utils/interaction/select-event';
-import {
-  getTooltipOptions,
-  getTooltipVisibleOperator,
-  mergeCellInfo,
-} from '../../../utils/tooltip';
+import { getTooltipOptions, mergeCellInfo } from '../../../utils/tooltip';
 import type { ViewMeta } from './../../../common/interface/basic';
 
 export class RowColumnClick extends BaseEvent implements BaseEventImplement {
@@ -147,15 +143,15 @@ export class RowColumnClick extends BaseEvent implements BaseEventImplement {
       ? mergeCellInfo(interaction.getActiveCells())
       : [];
 
-    const operator = this.getTooltipOperator(event, operation!);
+    const operator = this.getHeaderTooltipOperator(event, operation!);
 
     this.spreadsheet.showTooltipWithInfo(event, cellInfos, {
       onlyShowCellText: true,
       operator,
     });
   }
 
-  protected getTooltipOperator(
+  protected getHeaderTooltipOperator(
     event: CanvasEvent,
     operation: TooltipOperation,
   ): TooltipOperatorOptions {
@@ -185,10 +181,7 @@ export class RowColumnClick extends BaseEvent implements BaseEventImplement {
 
     const menus = enableHiddenColumnOperator ? [hiddenColumnsMenu] : [];
 
-    return getTooltipVisibleOperator(operation, {
-      defaultMenus: menus,
-      cell,
-    });
+    return this.getTooltipOperator(event, menus);
   }
 
   protected bindTableColExpand() {

diff --git a/packages/s2-core/src/interaction/base-interaction/hover.ts b/packages/s2-core/src/interaction/base-interaction/hover.ts
@@ -128,6 +128,7 @@ export class HoverEvent extends BaseEvent implements BaseEventImplement {
       hideSummary: true,
       onlyShowCellText: true,
       enableFormat: true,
+      operator: this.getTooltipOperator(event),
     };
     const data = this.getCellData(meta, options.onlyShowCellText);
 

diff --git a/packages/s2-react/playground/config.tsx b/packages/s2-react/playground/config.tsx
@@ -2,6 +2,7 @@
 /* eslint-disable no-console */
 import { PlusCircleFilled } from '@ant-design/icons';
 import {
+  DataCell,
   EMPTY_PLACEHOLDER,
   customMerge,
   getBaseSheetComponentOptions,
@@ -309,7 +310,9 @@ export const S2TooltipOptions: SheetComponentOptions['tooltip'] = {
           key: 'custom-c',
           label: '操作3',
           icon: 'EyeOutlined',
-          visible: false,
+          visible: (cell) => {
+            return cell instanceof DataCell;
+          },
           onClick: (info, cell) => {
             console.log('操作3点击:', info, cell);
           },