From 8f56023b4f29584bc619b00bc5a03a0c3bf30494 Mon Sep 17 00:00:00 2001 From: Jinke Li Date: Fri, 29 Nov 2024 17:01:46 +0800 Subject: [PATCH] =?UTF-8?q?fix(tooltip):=20=E4=BF=AE=E5=A4=8D=E6=93=8D?= =?UTF-8?q?=E4=BD=9C=E6=8C=89=E9=92=AE=E7=9A=84=20visible=20=E5=AF=B9?= =?UTF-8?q?=E8=A7=92=E5=A4=B4=E5=92=8C=E6=96=87=E6=9C=AC=E6=BA=A2=E5=87=BA?= =?UTF-8?q?=E5=9C=BA=E6=99=AF=E4=B8=8D=E7=94=9F=E6=95=88=20(#3001)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(tooltip): 修复操作按钮的 visible 对角头和文本溢出场景不生效 * test: 更新单测 --- .../click/corner-cell-click-spec.ts | 5 +++++ .../base-interaction/hover-spec.ts | 5 +++++ .../s2-core/src/interaction/base-event.ts | 20 ++++++++++++++++++- .../click/corner-cell-click.ts | 2 ++ .../base-interaction/click/data-cell-click.ts | 15 -------------- .../click/row-column-click.ts | 15 ++++---------- .../src/interaction/base-interaction/hover.ts | 1 + packages/s2-react/playground/config.tsx | 5 ++++- 8 files changed, 40 insertions(+), 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 index 77df5ac102..3546b41d88 100644 --- 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 index c3bb8d2760..3f573fa2c4 100644 --- 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 index 7e0d2fcf6e..b5e2c66dda 100644 --- 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 index bfefa750ae..344bedab50 100644 --- 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 index 0615e9839f..16b4f45c04 100644 --- 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,7 +8,6 @@ import { } from '../../../common/constant'; import type { TooltipData, - TooltipOperatorOptions, ViewMeta, ViewMetaData, } from '../../../common/interface'; @@ -16,10 +15,6 @@ 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 index 51487aef9e..bfd2d8604c 100644 --- 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,7 +143,7 @@ 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, @@ -155,7 +151,7 @@ export class RowColumnClick extends BaseEvent implements BaseEventImplement { }); } - 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 index 07c66584f1..889c25ed3f 100644 --- 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 index 5e244c93f7..7503c06ee2 100644 --- 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); },