From 2dd88767b8d6686ea281e526c10a8eb2e76deef9 Mon Sep 17 00:00:00 2001 From: lijinke666 Date: Mon, 30 Sep 2024 15:19:22 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=8B=96=E6=8B=BD?= =?UTF-8?q?=E5=88=97=E5=AE=BD=E5=90=8E,=20=E9=BB=98=E8=AE=A4=E7=9A=84?= =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E5=88=97=E5=AE=BD=E5=A4=B1=E6=95=88?= =?UTF-8?q?=20close=20#2910?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../row-column-resize-spec.ts.snap | 34 +++++++++++++----- .../interaction/row-column-resize-spec.ts | 35 +++++++++++++++++-- .../src/interaction/row-column-resize.ts | 10 +++--- s2-site/docs/common/interaction.zh.md | 4 +-- 4 files changed, 66 insertions(+), 17 deletions(-) diff --git a/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap b/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap index 67e7c97998..f836cf3c9f 100644 --- a/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap +++ b/packages/s2-core/__tests__/unit/interaction/__snapshots__/row-column-resize-spec.ts.snap @@ -20,7 +20,7 @@ Object { "heightByField": null, "maxLines": 1, "textOverflow": "ellipsis", - "width": null, + "width": undefined, "widthByField": Object { "testFieldId": 5, }, @@ -34,7 +34,7 @@ Object { "heightByField": null, "maxLines": 1, "textOverflow": "ellipsis", - "width": null, + "width": undefined, "widthByField": Object { "testField": 5, }, @@ -48,9 +48,10 @@ Object { "heightByField": null, "maxLines": 1, "textOverflow": "ellipsis", - "width": null, + "width": undefined, "widthByField": Object { - "testFieldId": 5, + "test-cell-a": 5, + "test-cell-b": 5, }, "wordWrap": true, } @@ -62,7 +63,7 @@ Object { "heightByField": null, "maxLines": 1, "textOverflow": "ellipsis", - "width": null, + "width": undefined, "widthByField": Object { "test-cell-a": 5, "test-cell-b": 5, @@ -73,7 +74,7 @@ Object { exports[`Interaction Row Column Resize Tests should get multiple vertical filed resize style by field for selected resize type 1`] = ` Object { - "height": null, + "height": undefined, "heightByField": Object { "test-cell-a": 2, "test-cell-b": 2, @@ -123,7 +124,7 @@ Object { exports[`Interaction Row Column Resize Tests should get vertical filed resize style by field for current resize type 1`] = ` Object { - "height": null, + "height": undefined, "heightByField": Object { "testFieldId": 2, }, @@ -137,9 +138,10 @@ Object { exports[`Interaction Row Column Resize Tests should get vertical filed resize style by field for selected resize type 1`] = ` Object { - "height": null, + "height": undefined, "heightByField": Object { - "testFieldId": 2, + "test-cell-a": 2, + "test-cell-b": 2, }, "maxLines": 1, "showTreeLeafNodeAlignDot": false, @@ -163,6 +165,20 @@ Object { } `; +exports[`Interaction Row Column Resize Tests should not effect default resize style by field for selected resize type 1`] = ` +Object { + "height": 30, + "heightByField": null, + "maxLines": 1, + "textOverflow": "ellipsis", + "width": 50, + "widthByField": Object { + "testFieldId": 5, + }, + "wordWrap": true, +} +`; + exports[`Interaction Row Column Resize Tests should rerender by resize col cell 1`] = ` Object { "height": 30, diff --git a/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts b/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts index 49d0664cda..a1e069dd0e 100644 --- a/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts +++ b/packages/s2-core/__tests__/unit/interaction/row-column-resize-spec.ts @@ -160,10 +160,12 @@ describe('Interaction Row Column Resize Tests', () => { s2.hideTooltip = jest.fn(); s2.interaction.reset = jest.fn(); s2.interaction.getActiveRowCells = () => [ - createMockCellInfo('test-row-cell').mockCell, + createMockCellInfo('test-row-cell-a').mockCell, + createMockCellInfo('test-row-cell-b').mockCell, ]; s2.interaction.getActiveColCells = () => [ - createMockCellInfo('test-col-cell').mockCell, + createMockCellInfo('test-col-cell-a').mockCell, + createMockCellInfo('test-col-cell-b').mockCell, ]; // 模拟多选 @@ -823,6 +825,10 @@ describe('Interaction Row Column Resize Tests', () => { }, }); + jest + .spyOn(s2.interaction, 'isSelectedState') + .mockImplementationOnce(() => true); + emitResize(ResizeDirectionType.Horizontal, ResizeAreaEffect.Cell); expect(s2.options.style!.colCell).toMatchSnapshot(); @@ -839,6 +845,10 @@ describe('Interaction Row Column Resize Tests', () => { }, }); + jest + .spyOn(s2.interaction, 'isSelectedState') + .mockImplementationOnce(() => true); + emitResize(ResizeDirectionType.Vertical, ResizeAreaEffect.Cell); expect(s2.options.style!.rowCell).toMatchSnapshot(); @@ -895,4 +905,25 @@ describe('Interaction Row Column Resize Tests', () => { expect(s2.options.style!.colCell).toMatchSnapshot(); }); + + // https://github.com/antvis/S2/issues/2910 + test('should not effect default resize style by field for selected resize type', () => { + s2.setOptions({ + style: { + colCell: { + width: 50, + }, + }, + interaction: { + resize: { + rowResizeType: ResizeType.CURRENT, + colResizeType: ResizeType.CURRENT, + }, + }, + }); + + emitResize(ResizeDirectionType.Horizontal, ResizeAreaEffect.Cell); + + expect(s2.options.style!.colCell).toMatchSnapshot(); + }); }); diff --git a/packages/s2-core/src/interaction/row-column-resize.ts b/packages/s2-core/src/interaction/row-column-resize.ts index 0d63ba518e..c0f0bbf8bc 100644 --- a/packages/s2-core/src/interaction/row-column-resize.ts +++ b/packages/s2-core/src/interaction/row-column-resize.ts @@ -303,8 +303,8 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement { // 非多选: 正常设置即可 if ( - !this.isEffectRowOf(ResizeType.SELECTED) || - !this.isEffectColOf(ResizeType.SELECTED) || + (!this.isEffectRowOf(ResizeType.SELECTED) && + !this.isEffectColOf(ResizeType.SELECTED)) || !isMultiSelected ) { return { @@ -360,7 +360,9 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement { eventType: S2Event.LAYOUT_RESIZE_COL_WIDTH, style: { colCell: { - width: !this.isEffectColOf(ResizeType.ALL) ? null : displayWidth, + width: !this.isEffectColOf(ResizeType.ALL) + ? undefined + : displayWidth, widthByField: this.getCellStyleByField(displayWidth), }, }, @@ -398,7 +400,7 @@ export class RowColumnResize extends BaseEvent implements BaseEventImplement { style: { rowCell: { height: !this.isEffectRowOf(ResizeType.ALL) - ? null + ? undefined : displayHeight, heightByField: this.getCellStyleByField(displayHeight), }, diff --git a/s2-site/docs/common/interaction.zh.md b/s2-site/docs/common/interaction.zh.md index 0a614389c7..209fbac516 100644 --- a/s2-site/docs/common/interaction.zh.md +++ b/s2-site/docs/common/interaction.zh.md @@ -68,8 +68,8 @@ interface ScrollSpeedRatio { | cornerCellHorizontal | 是否开启角头水平方向 resize 热区 | `boolean` | true | | | colCellHorizontal | 是否开启列头水平方向 resize 热区 | `boolean` | true | | | colCellVertical | 是否开启列头垂直方向 resize 热区 （列头隐藏时该配置无效） | `boolean` | true | | -| rowResizeType | 用于控制行高 resize 时的生效范围
1. `all`: 对所有单元格生效，2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | | -| colResizeType | 用于控制列宽 resize 时的生效范围
1. `all`: 对所有单元格生效，2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | | +| rowResizeType | 用于控制行高 resize 时的生效范围
1. `all`: 对所有单元格生效（会覆盖默认的行高配置），2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | | +| colResizeType | 用于控制列宽 resize 时的生效范围
1. `all`: 对所有单元格生效（会覆盖默认的列宽配置），2. `current`: 对当前单元格生效，3. `selected`: 对当前单元格生效，如果单元格是多选状态，调整任意选中单元格，对所有选中的生效。| `all`\| `current` \| `selected` | `current` | | | disable | 用于控制行高 resize 是否生效。[查看示例](/examples/interaction/advanced/#resize-disable) | (resizeInfo: [S2CellType](/docs/api/components/sheet-component#resizeinfo)) => boolean | | | | visible | 自定义当前单元格是否显示 resize 热区 | (cell: [S2CellType](/docs/api/basic-class/base-cell)) => boolean | | | | minCellWidth | 单元格可拖拽最小宽度 | `number`| 20 | |