GroupedMarketTable 单选时区时隐藏分组标题行
groups.length === 1 时直接展示扁平表格,多时区(ALL)时保留可折叠分组。
This commit is contained in:
@@ -47,6 +47,7 @@ export function GroupedMarketTable({
|
|||||||
|
|
||||||
const labelActive = isEn ? "Active" : "活跃";
|
const labelActive = isEn ? "Active" : "活跃";
|
||||||
const labelWatch = isEn ? "Watch" : "观察";
|
const labelWatch = isEn ? "Watch" : "观察";
|
||||||
|
const showHeaders = groups.length > 1;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="overflow-auto h-full">
|
<div className="overflow-auto h-full">
|
||||||
@@ -65,12 +66,12 @@ export function GroupedMarketTable({
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{groups.map((group) => {
|
{groups.flatMap((group) => {
|
||||||
const isExpanded = !collapsed.has(group.key);
|
const isExpanded = !collapsed.has(group.key);
|
||||||
const label = isEn ? group.labelEn : group.labelZh;
|
const rows = showHeaders && !isExpanded ? [] : group.rows;
|
||||||
return (
|
return (
|
||||||
<Fragment key={group.key}>
|
<Fragment key={group.key}>
|
||||||
{/* Group header row */}
|
{showHeaders && (
|
||||||
<tr className="border-b border-slate-200 bg-[#eef2f6]">
|
<tr className="border-b border-slate-200 bg-[#eef2f6]">
|
||||||
<td colSpan={9} className="p-0">
|
<td colSpan={9} className="p-0">
|
||||||
<button
|
<button
|
||||||
@@ -82,7 +83,7 @@ export function GroupedMarketTable({
|
|||||||
{isExpanded ? <ChevronDown size={12} /> : <ChevronRight size={12} />}
|
{isExpanded ? <ChevronDown size={12} /> : <ChevronRight size={12} />}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-[11px] font-black uppercase tracking-wide text-slate-600">
|
<span className="text-[11px] font-black uppercase tracking-wide text-slate-600">
|
||||||
{label}
|
{isEn ? group.labelEn : group.labelZh}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-[10px] text-slate-400">
|
<span className="text-[10px] text-slate-400">
|
||||||
{group.rows.length} · {labelActive} {group.activeCount} · {labelWatch} {group.watchCount}
|
{group.rows.length} · {labelActive} {group.activeCount} · {labelWatch} {group.watchCount}
|
||||||
@@ -92,9 +93,8 @@ export function GroupedMarketTable({
|
|||||||
</button>
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
{/* Data rows */}
|
)}
|
||||||
{isExpanded &&
|
{rows.map((row) => {
|
||||||
group.rows.map((row) => {
|
|
||||||
const signal = getSignalState(row);
|
const signal = getSignalState(row);
|
||||||
const gapColor = GAP_COLOR_MAP[getGapColor(row)];
|
const gapColor = GAP_COLOR_MAP[getGapColor(row)];
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user