fix(layout): 修复存在多列头多数值且数值置于行头时,列总计单元格高度不对 close #1715 #2049

packages/s2-core/__tests__/bugs/issue-1715-spec.ts

@@ -0,0 +1,89 @@
+/**
+ * @name Multi Values GrandTotal Height Test
+ * @description spec for issues #1715,#2049
+ * https://github.com/antvis/S2/issues/1715
+ * https://github.com/antvis/S2/issues/2049
+ */
+import { getContainer } from '../util/helpers';
+import * as mockDataConfig from '../data/mock-dataset.json';
+import type { S2DataConfig, S2Options, SpreadSheet } from '../../src';
+import { PivotSheet } from '@/sheet-type';
+
+const s2Options: S2Options = {
+  width: 800,
+  height: 600,
+  style: {
+    colCfg: {
+      hideMeasureColumn: false,
+    },
+  },
+  totals: {
+    row: {
+      showGrandTotals: true,
+      showSubTotals: true,
+      reverseLayout: true,
+      reverseSubLayout: true,
+    },
+    col: {
+      showGrandTotals: true,
+      showSubTotals: true,
+      reverseLayout: true,
+      reverseSubLayout: true,
+    },
+  },
+};
+
+const fields: S2DataConfig['fields'] = {
+  rows: ['province'],
+  columns: ['type', 'city'],
+  values: ['number', 'sub_type'],
+  valueInCols: false,
+};
+
+describe('Multi Values GrandTotal Height Test', () => {
+  let s2: SpreadSheet;
+
+  beforeEach(() => {
+    s2 = new PivotSheet(getContainer(), mockDataConfig, s2Options);
+
+    s2.setDataCfg({
+      ...mockDataConfig,
+      fields,
+    });
+    s2.render();
+  });
+
+  test('should get correctly grand total node height if value in rows', () => {
+    const grandTotalsNode = s2
+      .getColumnNodes()
+      .find((node) => node.isGrandTotals);
+
+    expect(s2.facet.layoutResult.colsHierarchy.height).toBe(60);
+    expect(grandTotalsNode.height).toEqual(60);
+  });
+
+  test('should get correctly grand total node height if value in columns', () => {
+    s2.setDataCfg({
+      ...mockDataConfig,
+      fields: {
+        ...fields,
+        valueInCols: true,
+      },
+    });
+    s2.setOptions({
+      style: {
+        colCfg: {
+          hideMeasureColumn: true,
+        },
+      },
+    });
+    s2.render(true);
+
+    const grandTotalsNode = s2
+      .getColumnNodes()
+      .find((node) => node.isGrandTotals);
+
+    expect(s2.facet.layoutResult.colsHierarchy.height).toBe(60);
+    expect(grandTotalsNode.height).toEqual(30);
+  });
+});

packages/s2-core/src/facet/pivot-facet.ts

@@ -175,7 +175,6 @@ export class PivotFacet extends BaseFacet {
     rowLeafNodes: Node[],
     rowHeaderWidth: number,
   ) {
-    const { spreadsheet } = this.cfg;
     let preLeafNode = Node.blankNode();
     const allNodes = colsHierarchy.getNodes();
     for (const levelSample of colsHierarchy.sampleNodesForAllLevels) {
@@ -207,11 +206,15 @@ export class PivotFacet extends BaseFacet {
         );
         currentNode.y = preLevelSample?.y + preLevelSample?.height ?? 0;
       }
-      currentNode.height = this.getColNodeHeight(currentNode);
+      // 数值置于行头时, 列头的总计即叶子节点, 此时应该用列高: https://github.com/antvis/S2/issues/1715
+      currentNode.height =
+        currentNode.isGrandTotals && currentNode.isLeaf
+          ? colsHierarchy.height
+          : this.getColNodeHeight(currentNode);
       layoutCoordinate(this.cfg, null, currentNode);
     }
     this.autoCalculateColNodeWidthAndX(colLeafNodes);
-    if (!isEmpty(spreadsheet.options.totals?.col)) {
+    if (!isEmpty(this.spreadsheet.options.totals?.col)) {
       this.adjustTotalNodesCoordinate(colsHierarchy);
       this.adjustSubTotalNodesCoordinate(colsHierarchy);
     }

packages/s2-react/playground/config.ts

@@ -51,18 +51,6 @@ export const s2Options: SheetComponentOptions = {
   width: 600,
   height: 400,
   showSeriesNumber: false,
-  customSVGIcons: [
-    {
-      name: 'test',
-      svg: 'https://gw.alipayobjects.com/zos/antfincdn/zBWAjRerGK/filter_sort.svg',
-    },
-  ],
-  headerActionIcons: [
-    {
-      iconNames: ['test'],
-      belongsCell: 'rowCell',
-    },
-  ],
   interaction: {
     enableCopy: true,
     // 防止 mac 触摸板横向滚动触发浏览器返回, 和移动端下拉刷新