Skip to content

Commit

Permalink
fix: edge logic
Browse files Browse the repository at this point in the history
  • Loading branch information
@zombieJ
zombieJ committed Aug 18, 2023
1 parent 2db1737 commit 4daf988
Show file tree
Hide file tree
Showing 4 changed files with 117 additions and 81 deletions.
159 changes: 90 additions & 69 deletions docs/examples/virtual.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,27 +18,25 @@ const columns: ColumnsType = [
title: 'title3',
dataIndex: 'c',
key: 'c',
onCell: (_, index) => {
if (index % 4 === 0) {
return {
rowSpan: 3,
};
}
// onCell: (_, index) => {
// if (index % 4 === 0) {
// return {
// rowSpan: 3,
// };
// }

if (index % 4 === 3) {
return {
rowSpan: 1,
colSpan: 3,
};
}
// if (index % 4 === 3) {
// return {
// rowSpan: 1,
// colSpan: 3,
// };
// }

return {
rowSpan: 0,
};
},
// return {
// rowSpan: 0,
// };
// },
},
// { title: 'title4', dataIndex: 'b', key: 'd' },
// { title: 'title5', dataIndex: 'b', key: 'e' },
{
title: 'title4',
key: 'd',
Expand All @@ -47,55 +45,55 @@ const columns: ColumnsType = [
{
title: 'title4-1',
dataIndex: 'b',
onCell: (_, index) => {
if (index % 4 === 0) {
return {
colSpan: 3,
};
}
// onCell: (_, index) => {
// if (index % 4 === 0) {
// return {
// colSpan: 3,
// };
// }

if (index % 4 === 3) {
return {
colSpan: 0,
};
}
},
// if (index % 4 === 3) {
// return {
// colSpan: 0,
// };
// }
// },
},
{
title: 'title4-2',
dataIndex: 'b',
onCell: (_, index) => {
if (index % 4 === 0 || index % 4 === 3) {
return {
colSpan: 0,
};
}
},
// onCell: (_, index) => {
// if (index % 4 === 0 || index % 4 === 3) {
// return {
// colSpan: 0,
// };
// }
// },
},
],
},
{
title: 'title6',
dataIndex: 'b',
key: 'f',
onCell: (_, index) => {
if (index % 4 === 0) {
return {
rowSpan: 0,
colSpan: 0,
};
}
// onCell: (_, index) => {
// if (index % 4 === 0) {
// return {
// rowSpan: 0,
// colSpan: 0,
// };
// }

if (index % 4 === 1) {
return {
rowSpan: 3,
};
}
// if (index % 4 === 1) {
// return {
// rowSpan: 3,
// };
// }

return {
rowSpan: 0,
};
},
// return {
// rowSpan: 0,
// };
// },
},
{
title: (
Expand All @@ -113,30 +111,53 @@ const columns: ColumnsType = [
{
title: 'title8',
dataIndex: 'b',
onCell: (_, index) => {
if (index % 2 === 0) {
return {
rowSpan: 2,
colSpan: 2,
};
}
// onCell: (_, index) => {
// if (index % 2 === 0) {
// return {
// rowSpan: 2,
// colSpan: 2,
// };
// }

return {
rowSpan: 0,
};
},
// return {
// rowSpan: 0,
// };
// },
},
{
title: 'title9 i',
dataIndex: 'b',
key: 'i',
onCell: () => ({
colSpan: 0,
}),
// onCell: () => ({
// colSpan: 0,
// }),
},
{ title: 'title10', dataIndex: 'b', key: 'j' },
{ title: 'title11', dataIndex: 'b', key: 'k', width: 50, fixed: 'right' },
{ title: 'title12', dataIndex: 'b', key: 'l', width: 100, fixed: 'right' },
{
title: 'title11',
dataIndex: 'b',
key: 'k',
width: 50,
fixed: 'right',
onCell: (_, index) => {
return {
rowSpan: index % 4 === 0 ? 4 : 0,
colSpan: 2,
};
},
},
{
title: 'title12',
dataIndex: 'b',
key: 'l',
width: 100,
fixed: 'right',
onCell: () => {
return {
colSpan: 0,
};
},
},
];

const data: RecordType[] = new Array(4 * 10000).fill(null).map((_, index) => ({
Expand Down
2 changes: 1 addition & 1 deletion src/Cell/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -214,9 +214,9 @@ function Cell<RecordType>(props: CellProps<RecordType>) {
}

const mergedStyle = {
...fixedStyle,
...additionalProps.style,
...alignStyle,
...fixedStyle,
...legacyCellProps?.style,
};

Expand Down
22 changes: 14 additions & 8 deletions src/StaticTable/BodyGrid.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,26 +91,32 @@ const Grid = React.forwardRef<GridRef, GridProps>((props, ref) => {
const { start, end, getSize, offsetY } = info;

// Find first rowSpan column
const firstRowSpanColumns = flattenColumns.filter(column => getRowSpan(column, start) === 0);
let firstRowSpanColumns = flattenColumns.filter(
// rowSpan is 0
column => getRowSpan(column, start) === 0,
);

let startIndex = start;
for (let i = start; i >= 0; i -= 1) {
if (firstRowSpanColumns.every(column => getRowSpan(column, i) !== 0)) {
firstRowSpanColumns = firstRowSpanColumns.filter(column => getRowSpan(column, i) === 0);

if (!firstRowSpanColumns.length) {
startIndex = i;
break;
}
}

// Find last rowSpan column
const lastRowSpanColumns = flattenColumns.filter(column => {
const rowSpan = getRowSpan(column, end);
return rowSpan !== 1;
});
let lastRowSpanColumns = flattenColumns.filter(
// rowSpan is not 1
column => getRowSpan(column, end) !== 1,
);

let endIndex = end;

for (let i = end; i < flattenData.length; i += 1) {
if (lastRowSpanColumns.every(column => getRowSpan(column, i) !== 0)) {
lastRowSpanColumns = lastRowSpanColumns.filter(column => getRowSpan(column, i) !== 1);

if (!lastRowSpanColumns.length) {
endIndex = Math.max(i - 1, end);
break;
}
Expand Down
15 changes: 12 additions & 3 deletions src/StaticTable/VirtualCell.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,15 +57,15 @@ function VirtualCell<RecordType extends { index: number } = any>(
const marginOffset = colSpan > 1 ? (colWidth as number) - concatColWidth : 0;

// ========================== Style ===========================
const mergedStyle = {
const mergedStyle: React.CSSProperties = {
...cellStyle,
...style,
'--virtual-width': `${concatColWidth}px`,
['--virtual-width' as any]: `${concatColWidth}px`,
marginRight: marginOffset,
};

// 0 rowSpan or colSpan should not render
if (colSpan === 0 || (rowSpan > 1 && !forceRender)) {
if (colSpan === 0 || rowSpan === 0 || (rowSpan > 1 && !forceRender)) {
mergedStyle.visibility = 'hidden';
}

Expand Down Expand Up @@ -98,6 +98,14 @@ function VirtualCell<RecordType extends { index: number } = any>(
// Virtual should reset `colSpan` & `rowSpan`
rowSpan: 1,
colSpan: 1,

'data-fixed-info': {
rowInfo,
column,
colIndex,
indent,
index,
},
}}
/>
);
Expand Down Expand Up @@ -130,6 +138,7 @@ export function RowSpanVirtualCell<RecordType extends { index: number } = any>(
top,
height,
left,
position: 'absolute',
}}
className={`${prefixCls}-cell-virtual-fixed`}
forceRender
Expand Down

0 comments on commit 4daf988

Please sign in to comment.