fix(interaction): support empty data cell & calc count (#209)

antvis · Sep 6, 2021 · 4689280 · 4689280
1 parent dccc14c
commit 4689280
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 21 deletions.
diff --git a/packages/s2-core/src/interaction/brush-selection.ts b/packages/s2-core/src/interaction/brush-selection.ts
@@ -103,10 +103,10 @@ export class BrushSelection extends BaseEvent implements BaseEventImplement {
         this.interaction.addIntercepts([InterceptType.BRUSH_SELECTION]);
         this.hidePrepareSelectMaskShape();
         this.updateSelectedCells();
-        const tooltipData = getActiveCellsTooltipData(this.spreadsheet);
-        if (!isEmpty(tooltipData)) {
-          this.spreadsheet.showTooltipWithInfo(event, tooltipData);
-        }
+        this.spreadsheet.showTooltipWithInfo(
+          event,
+          getActiveCellsTooltipData(this.spreadsheet),
+        );
       }
       this.setBrushSelectionStage(InteractionBrushSelectionStage.UN_DRAGGED);
     });
@@ -203,7 +203,7 @@ export class BrushSelection extends BaseEvent implements BaseEventImplement {
   private getBrushRangeDataCells(): DataCell[] {
     return this.displayedDataCells.filter((cell) => {
       const meta = cell.getMeta();
-      return meta?.data && this.isInBrushRange(meta);
+      return this.isInBrushRange(meta);
     });
   }
 

diff --git a/packages/s2-core/src/interaction/event-controller.ts b/packages/s2-core/src/interaction/event-controller.ts
@@ -227,9 +227,8 @@ export class EventController {
       this.activeResizeArea(event);
       this.spreadsheet.emit(S2Event.GLOBAL_RESIZE_MOUSE_MOVE, event);
       return;
-    } else {
-      this.resetResizeArea();
     }
+    this.resetResizeArea();
 
     const cell = this.spreadsheet.getCell(event.target);
     const cellType = this.spreadsheet.getCellType(event.target);

diff --git a/packages/s2-core/src/interaction/root.ts b/packages/s2-core/src/interaction/root.ts
@@ -1,7 +1,7 @@
 import { clearState, setState } from '@/utils/interaction/state-controller';
 import { isMobile } from '@/utils/is-mobile';
 import { ColHeader, RowHeader } from 'src/facet/header';
-import { includes, isEmpty, concat, merge, forEach } from 'lodash';
+import { includes, isEmpty, concat, merge, forEach, size } from 'lodash';
 import { BrushSelection, DataCellMultiSelection, RowColResize } from './';
 import {
   BaseEvent,
@@ -108,6 +108,10 @@ export class RootInteraction {
     return currentState?.cells || [];
   }
 
+  public getActiveCellsCount() {
+    return size(this.getActiveCells());
+  }
+
   public updateCellStyleByState() {
     const cells = this.getActiveCells();
     cells.forEach((cell) => {

diff --git a/packages/s2-core/src/ui/tooltip/components/summary.tsx b/packages/s2-core/src/ui/tooltip/components/summary.tsx
@@ -1,20 +1,21 @@
 import { TooltipSummaryOptions } from '@/common/interface';
-import * as React from 'react';
+import React from 'react';
 import { i18n } from '@/common/i18n';
 import { TOOLTIP_PREFIX_CLS } from '@/common/constant/tooltip';
 
-const Summary = (props: { summaries: TooltipSummaryOptions[] }) => {
-  const { summaries = [] } = props;
+interface SummaryProps {
+  summaries: TooltipSummaryOptions[];
+  count: number;
+}
 
-  const renderSelected = () => {
-    const selectedCount = summaries?.reduce((pre, next) => {
-      return pre + (next?.selectedData?.length || 0);
-    }, 0);
+const Summary: React.FC<SummaryProps> = React.memo((props) => {
+  const { summaries = [], count = 0 } = props;
 
+  const renderSelected = () => {
     return (
       <div className={`${TOOLTIP_PREFIX_CLS}-summary-item`}>
         <span className={`${TOOLTIP_PREFIX_CLS}-bold`}>
-          {selectedCount} {i18n('项')}
+          {count} {i18n('项')}
         </span>{' '}
         {i18n('已选择')}
       </div>
@@ -24,7 +25,7 @@ const Summary = (props: { summaries: TooltipSummaryOptions[] }) => {
   const renderSummary = () => {
     return summaries?.map((item) => {
       const { name = '', value } = item || {};
-      if(!name && !value) {
+      if (!name && !value) {
         return;
       }
 
@@ -52,6 +53,6 @@ const Summary = (props: { summaries: TooltipSummaryOptions[] }) => {
       {renderSummary()}
     </div>
   );
-};
+});
 
 export default Summary;
diff --git a/packages/s2-core/src/ui/tooltip/index.tsx b/packages/s2-core/src/ui/tooltip/index.tsx
@@ -153,7 +153,12 @@ export class BaseTooltip {
   }
 
   protected renderSummary(summaries: TooltipSummaryOptions[]) {
-    return !isEmpty(summaries) && <TooltipSummary summaries={summaries} />;
+    const count = this.spreadsheet.interaction.getActiveCellsCount();
+    return (
+      !isEmpty(summaries) && (
+        <TooltipSummary summaries={summaries} count={count} />
+      )
+    );
   }
 
   protected renderHeadInfo(headInfo: TooltipHeadInfoType) {

diff --git a/packages/s2-core/src/utils/tooltip.ts b/packages/s2-core/src/utils/tooltip.ts
@@ -437,8 +437,6 @@ export const mergeCellInfo = (cells: S2CellType[]): TooltipData[] => {
   });
 };
 
-// TODO: 待确定 是否可以复用 mergeCellInfo
-
 export const getActiveCellsTooltipData = (
   spreadsheet: SpreadSheet,
 ): TooltipData[] => {