feat: PC 表头改为居右对齐

This commit is contained in:
hzm
2026-03-19 22:29:19 +08:00
parent e0f6d61aaa
commit 0ce7d18585

View File

@@ -48,6 +48,7 @@ const NON_FROZEN_COLUMN_IDS = [
'latestNav', 'latestNav',
'estimateNav', 'estimateNav',
]; ];
const COLUMN_HEADERS = { const COLUMN_HEADERS = {
relatedSector: '关联板块', relatedSector: '关联板块',
latestNav: '最新净值', latestNav: '最新净值',
@@ -466,7 +467,7 @@ export default function PcFundTable({
while (queue.length) { while (queue.length) {
const item = queue.shift(); const item = queue.shift();
if (item == null) continue; if (item == null) continue;
// eslint-disable-next-line no-await-in-loop
results.push(await worker(item)); results.push(await worker(item));
} }
}); });
@@ -1046,19 +1047,22 @@ export default function PcFundTable({
const isNameColumn = const isNameColumn =
header.column.id === 'fundName' || header.column.id === 'fundName' ||
header.column.columnDef?.accessorKey === 'fundName'; header.column.columnDef?.accessorKey === 'fundName';
const align = isNameColumn ? '' : 'text-center'; const isRightAligned = NON_FROZEN_COLUMN_IDS.includes(header.column.id);
const align = isNameColumn ? '' : isRightAligned ? 'text-right' : 'text-center';
return ( return (
<div <div
key={header.id} key={header.id}
className={`table-header-cell ${align}`} className={`table-header-cell ${align}`}
style={style} style={style}
> >
<div style={{ paddingRight: isRightAligned ? '20px' : '0' }}>
{header.isPlaceholder {header.isPlaceholder
? null ? null
: flexRender( : flexRender(
header.column.columnDef.header, header.column.columnDef.header,
header.getContext(), header.getContext(),
)} )}
</div>
{!forPortal && ( {!forPortal && (
<div <div
onMouseDown={header.column.getCanResize() ? header.getResizeHandler() : undefined} onMouseDown={header.column.getCanResize() ? header.getResizeHandler() : undefined}
@@ -1201,19 +1205,9 @@ export default function PcFundTable({
{row.getVisibleCells().map((cell) => { {row.getVisibleCells().map((cell) => {
const columnId = cell.column.id || cell.column.columnDef?.accessorKey; const columnId = cell.column.id || cell.column.columnDef?.accessorKey;
const isNameColumn = columnId === 'fundName'; const isNameColumn = columnId === 'fundName';
const rightAlignedColumns = new Set([
'latestNav',
'estimateNav',
'yesterdayChangePercent',
'estimateChangePercent',
'totalChangePercent',
'holdingAmount',
'todayProfit',
'holdingProfit',
]);
const align = isNameColumn const align = isNameColumn
? '' ? ''
: rightAlignedColumns.has(columnId) : NON_FROZEN_COLUMN_IDS.includes(columnId)
? 'text-right' ? 'text-right'
: 'text-center'; : 'text-center';
const cellClassName = const cellClassName =
@@ -1281,13 +1275,15 @@ export default function PcFundTable({
const isNameColumn = const isNameColumn =
header.column.id === 'fundName' || header.column.id === 'fundName' ||
header.column.columnDef?.accessorKey === 'fundName'; header.column.columnDef?.accessorKey === 'fundName';
const align = isNameColumn ? '' : 'text-center'; const isRightAligned = NON_FROZEN_COLUMN_IDS.includes(header.column.id);
const align = isNameColumn ? '' : isRightAligned ? 'text-right' : 'text-center';
return ( return (
<div <div
key={header.id} key={header.id}
className={`table-header-cell ${align}`} className={`table-header-cell ${align}`}
style={style} style={style}
> >
<div style={{ paddingRight: isRightAligned ? '20px' : '0' }}>
{header.isPlaceholder {header.isPlaceholder
? null ? null
: flexRender( : flexRender(
@@ -1295,6 +1291,7 @@ export default function PcFundTable({
header.getContext(), header.getContext(),
)} )}
</div> </div>
</div>
); );
})} })}
</div> </div>