4a90c32fcc
- 新增 5 档强度色 token（日/夜两套，含渐变填充与光晕 alpha），tokens.css - 板块轮动卡片改为 heat-tier-1..5，固定阈值 <65/65-74/75-84/85-94/95+ 映射青/蓝/紫/橙/红，9 个日期列共用同一套映射，与涨跌无关 - 悬停/选中/追踪三态用 --tier-* 局部变量统一驱动，选中态（当次点击格） 用渐变实色+2px 亮边+光晕，追踪态（其余同名格）保留档位底色+2px 描边 +圆点标记，不新增业务状态；修复 hover 规则与 selected 同优先级导致 悬停会覆盖选中/追踪样式的层叠顺序问题（:hover 增加 :not(.selected)） - 图例改为 5 档 + “颜色＝强度档位，与涨跌无关” 说明，禁止对普通卡使用绿色 - 侧栏/品牌区去掉独立色块：.module-nav 融入页面 --canvas， 品牌区与顶栏同层（--header-bg），收起侧栏整行透明；仅作用于 非移动端且非「问天」路由，问天页面零改动 - 清理死代码：未生效的 .selected 旧规则与引用未定义变量的 --rotation-heat 声明 - 更新 e2e 断言以匹配新 tier 类名；重新生成 architecture-inventory.json Co-authored-by: Cursor <cursoragent@cursor.com> Co-authored-by: multica-agent <github@multica.ai>
58 lines
3.2 KiB
HTML
58 lines
3.2 KiB
HTML
<section id="rotationView" class="workspace-view page redesigned-rotation-view">
|
||
<header class="rotation-page-head lad-head">
|
||
<div>
|
||
<h2>板块轮动</h2>
|
||
<p id="rotationHistoryRange">最近 9 个交易日 · 由远到近，右侧为最新交易日</p>
|
||
</div>
|
||
<div class="rotation-head-actions">
|
||
<div id="rotationOrderControl" class="rotation-order-control" role="group" aria-label="轮动日期排序">
|
||
<button class="active" type="button" data-rotation-order="oldest">由远到近</button>
|
||
<button type="button" data-rotation-order="latest">由近到远</button>
|
||
</div>
|
||
<button id="rotationExportButton" class="rotation-export-button" type="button">导出 CSV</button>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="rotation-trajectory-card card" aria-labelledby="rotationTrajectoryTitle">
|
||
<header class="rotation-card-head card-h">
|
||
<div>
|
||
<h3 id="rotationTrajectoryTitle">热点轨迹</h3>
|
||
<span id="rotationSelectionHint">点击任意板块追踪其连续性</span>
|
||
</div>
|
||
<span class="rotation-top-tag">每日 Top 12 热点</span>
|
||
</header>
|
||
<div class="rotation-legend" aria-label="板块强度图例">
|
||
<span><i class="rotation-swatch tier-1"></i>低·青（<65）</span>
|
||
<span><i class="rotation-swatch tier-2"></i>中低·蓝（65–74）</span>
|
||
<span><i class="rotation-swatch tier-3"></i>中高·紫（75–84）</span>
|
||
<span><i class="rotation-swatch tier-4"></i>高·橙（85–94）</span>
|
||
<span><i class="rotation-swatch tier-5"></i>最高·红（95+）</span>
|
||
<span class="rotation-legend-note">颜色＝强度档位，与涨跌无关</span>
|
||
</div>
|
||
<div id="rotationTracker" class="rotation-tracker" hidden></div>
|
||
<div id="rotationHistory" class="rotation-history"><div class="empty-state">正在读取轮动历史</div></div>
|
||
</section>
|
||
|
||
<section class="rotation-detail-card card" aria-labelledby="rotationDetailTitle">
|
||
<header class="rotation-card-head card-h">
|
||
<div>
|
||
<h3 id="rotationDetailTitle">板块成分股</h3>
|
||
<span>点击上方板块，查看目标交易日有效申万成分与行情</span>
|
||
</div>
|
||
<span id="rotationDetailMeta" class="rotation-top-tag">--</span>
|
||
</header>
|
||
<div class="rotation-table-frame tbl-wrap">
|
||
<table id="rotationTable" class="data-table tbl rotation-table">
|
||
<thead><tr>
|
||
<th class="row-number">序号</th><th>代码</th><th>股票</th>
|
||
<th class="number num" data-auto-sort="true" title="涨跌幅：点击排序">涨跌幅（%）</th>
|
||
<th class="number num">开盘价（元）</th><th class="number num">收盘价（元）</th>
|
||
<th class="number num" data-auto-sort="true" title="成交额：点击排序">成交额（亿）</th><th>行情状态</th>
|
||
</tr></thead>
|
||
<tbody id="rotationTableBody"></tbody>
|
||
</table>
|
||
<div id="rotationMembersEmpty" class="empty-state">点击上方任意板块查看成分股</div>
|
||
</div>
|
||
</section>
|
||
</section>
|