From 41e99b6974ba5b8b615237078c0747bfd2d50630 Mon Sep 17 00:00:00 2001 From: shy3130 <415333856@qq.com> Date: Mon, 17 Aug 2026 13:03:19 +0800 Subject: [PATCH] =?UTF-8?q?feat(regime):=20=E9=98=B6=E6=AE=B5=C3=97?= =?UTF-8?q?=E4=B8=BB=E7=BA=BF=E8=A1=A8=E6=A0=BC=E9=99=90=E9=AB=98=E6=BB=9A?= =?UTF-8?q?=E5=8A=A8=20+=20=E5=90=B8=E9=A1=B6=E8=A1=A8=E5=A4=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 段数多时(2y 范围 50+ 段)表格把页面拉得很长。改为 max-h-420px 内滚动, 表头 sticky 吸顶保证滚动时列名可见。 实现注意: - sticky 必须加在 th 而非 tr (后者在 Chromium 不生效) - 表格改 border-separate border-spacing-0 — Chromium 在 preflight 默认的 border-collapse:collapse 下表格元素 sticky 完全失效 (computed 为 sticky 但不粘, crbug.com/702927); separate 模式下 tr 边框不绘制, 行分隔线 相应从 tr 挪到 td, 视觉不变 验证: tsc 通过; 实测容器 clientH=420/scrollH=1860 (页面少滚 ~1440px), 容器内滚动 1441px 后 th 与容器顶 delta=0 (吸顶生效), 截图确认列名行 固定、数据行正常。截图 gui-test-screenshots/regime-segments-*.png --- frontend/src/pages/Regime.tsx | 43 ++++++++++-------- .../regime-segments-scroll.png | Bin 0 -> 299220 bytes .../regime-segments-sticky-final.png | Bin 0 -> 192643 bytes 3 files changed, 23 insertions(+), 20 deletions(-) create mode 100644 gui-test-screenshots/regime-segments-scroll.png create mode 100644 gui-test-screenshots/regime-segments-sticky-final.png diff --git a/frontend/src/pages/Regime.tsx b/frontend/src/pages/Regime.tsx index e34107e..41e43a9 100644 --- a/frontend/src/pages/Regime.tsx +++ b/frontend/src/pages/Regime.tsx @@ -648,42 +648,45 @@ export function Regime() {
| 阶段 | -区间 | -天数 | -高度 | -2板+ | -晋级率 | -封板率 | -主导主线 | +|||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 阶段 | +区间 | +天数 | +高度 | +2板+ | +晋级率 | +封板率 | +主导主线 | |||||||
| + | ||||||||||||||
| {seg.label} | -+ | {seg.start.slice(5)} ~ {seg.end.slice(5)} | -{seg.days} | -{seg.avg_height} | -{seg.avg_ge2} | -+ | {seg.days} | +{seg.avg_height} | +{seg.avg_ge2} | +{seg.avg_promo != null ? `${(seg.avg_promo * 100).toFixed(0)}%` : '—'} | -+ | {seg.avg_seal_rate != null ? `${(seg.avg_seal_rate * 100).toFixed(0)}%` : '—'} | -+ |
{seg.top_mainlines.length > 0 ? seg.top_mainlines.map(m => (
-5lRY@2(Y-Y0000%T1rd>0D$;+3pxi4`tKq{Bm)8ffZ$n*iYgfZ0Pfi-@%1ub
z!pNb5LBx^aA%-RnA%-O* i?f?;-y5dAO_9tPk_6u?!jU^bV(x1|O338@I=t6U1m&|LpAqGe**fXr|&fUKsb
zzMpy5xBtAL(gsZM^DF}<%MqS^9n5i3UGOF0qxB3KM047Q+rly|j??CtMmAuTOgY{K
z<%PGB+BvftRZVWcTvbRoKtk+s;x3+?9bzO%6Qd}ccxa-oiPahL`JX9sgmj8Nfuv(5
z6FIu@qvM?kk*)Nxs;NS2Dzqt9SgYF9 |