Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: 修复拖拽列宽后, 默认的自定义列宽失效 close #2910 #2915

Merged
merged 2 commits into from
Oct 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
"width": null,
"width": undefined,
"widthByField": Object {
"testFieldId": 5,
},
Expand All @@ -34,7 +34,7 @@ Object {
"heightByField": null,
"maxLines": 1,
"textOverflow": "ellipsis",
"width": null,
"width": undefined,
"widthByField": Object {
"testField": 5,
},
Expand All @@ -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,
}
Expand All @@ -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,
Expand All @@ -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,
Expand Down Expand Up @@ -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,
},
Expand All @@ -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,
Expand All @@ -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,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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,
];

// 模拟多选
Expand Down Expand Up @@ -823,6 +825,10 @@ describe('Interaction Row Column Resize Tests', () => {
},
});

jest
wjgogogo marked this conversation as resolved.
Show resolved Hide resolved
.spyOn(s2.interaction, 'isSelectedState')
.mockImplementationOnce(() => true);

emitResize(ResizeDirectionType.Horizontal, ResizeAreaEffect.Cell);

expect(s2.options.style!.colCell).toMatchSnapshot();
Expand All @@ -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();
Expand Down Expand Up @@ -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();
});
});
10 changes: 6 additions & 4 deletions packages/s2-core/src/interaction/row-column-resize.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand Down Expand Up @@ -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),
},
},
Expand Down Expand Up @@ -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),
},
Expand Down
4 changes: 2 additions & 2 deletions s2-site/docs/common/interaction.zh.md
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,8 @@ interface ScrollSpeedRatio {
| cornerCellHorizontal | 是否开启角头水平方向 resize 热区 | `boolean` | true | |
| colCellHorizontal | 是否开启列头水平方向 resize 热区 | `boolean` | true | |
| colCellVertical | 是否开启列头垂直方向 resize 热区 (列头隐藏时该配置无效) | `boolean` | true | |
| rowResizeType | 用于控制行高 resize 时的生效范围 <br/> 1. `all`: 对所有单元格生效,2. `current`: 对当前单元格生效,3. `selected`: 对当前单元格生效,如果单元格是多选状态,调整任意选中单元格,对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
| colResizeType | 用于控制列宽 resize 时的生效范围 <br/> 1. `all`: 对所有单元格生效,2. `current`: 对当前单元格生效,3. `selected`: 对当前单元格生效,如果单元格是多选状态,调整任意选中单元格,对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
| rowResizeType | 用于控制行高 resize 时的生效范围 <br/> 1. `all`: 对所有单元格生效(会覆盖默认的行高配置),2. `current`: 对当前单元格生效,3. `selected`: 对当前单元格生效,如果单元格是多选状态,调整任意选中单元格,对所有选中的生效。| `all`\| `current` \| `selected` | `current` | |
| colResizeType | 用于控制列宽 resize 时的生效范围 <br/> 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 | |
Expand Down
Loading