feat: expand market discovery and auction workflow
This commit is contained in:
+149
-6
@@ -101,6 +101,9 @@
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="performanceView" title="涨停表现"><i data-lucide="chart-no-axes-combined"></i><span>涨停表现</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="ladderView" title="市场天梯"><i data-lucide="layers-3"></i><span>市场天梯</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="rotationView" title="板块轮动"><i data-lucide="refresh-cw"></i><span>板块轮动</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="auctionView" title="集合竞价"><i data-lucide="timer-reset"></i><span>集合竞价</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="themeLibraryView" title="题材库"><i data-lucide="library-big"></i><span>题材库</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="popularityView" title="人气热榜"><i data-lucide="chart-no-axes-column-increasing"></i><span>人气热榜</span></button>
|
||||
<button class="module-tab market-sub-tab" type="button" data-view="dragonView" title="龙虎榜"><i data-lucide="list-tree"></i><span>龙虎榜</span></button>
|
||||
</div>
|
||||
<div class="nav-group tool-nav-group">
|
||||
@@ -128,6 +131,9 @@
|
||||
<option value="performanceView">涨停表现</option>
|
||||
<option value="ladderView">市场天梯</option>
|
||||
<option value="rotationView">板块轮动</option>
|
||||
<option value="auctionView">集合竞价</option>
|
||||
<option value="themeLibraryView">题材库</option>
|
||||
<option value="popularityView">人气热榜</option>
|
||||
<option value="dragonView">龙虎榜</option>
|
||||
</select>
|
||||
<i data-lucide="chevron-down" aria-hidden="true"></i>
|
||||
@@ -889,6 +895,131 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="auctionView" class="workspace-view">
|
||||
<div class="section-toolbar">
|
||||
<div class="section-title-group">
|
||||
<h2>集合竞价中心</h2>
|
||||
<span id="auctionDateLabel" class="section-subtitle">--</span>
|
||||
</div>
|
||||
<div class="toolbar-controls">
|
||||
<button id="auctionRefreshButton" class="button" type="button" hidden><i data-lucide="refresh-cw"></i>刷新竞价</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="auctionPhaseNotice" class="auction-phase-notice" data-phase="archive" role="status" aria-live="polite">
|
||||
<span class="auction-phase-marker" aria-hidden="true"></span>
|
||||
<div><strong id="auctionPhaseTitle">竞价状态</strong><span id="auctionPhaseDetail">正在确认当前竞价阶段</span></div>
|
||||
<time id="auctionPhaseTime">--</time>
|
||||
</div>
|
||||
<div id="auctionSummary" class="market-feature-summary" aria-live="polite"></div>
|
||||
<div class="auction-workspace-layout">
|
||||
<section class="auction-main-workspace" aria-labelledby="auctionWorkspaceTitle">
|
||||
<div class="auction-candidate-heading">
|
||||
<div class="section-title-group"><h3 id="auctionWorkspaceTitle">重点异动</h3><span id="auctionWorkspaceSubtitle" class="section-subtitle">优先查看市场核心与显著预期差</span></div>
|
||||
<label class="search-field"><span class="visually-hidden">搜索竞价候选</span><input id="auctionSearch" type="search" placeholder="代码、名称或行业"></label>
|
||||
</div>
|
||||
<div class="auction-dataset-bar">
|
||||
<div class="segmented auction-dataset-segments" role="tablist" aria-label="竞价数据集">
|
||||
<button class="segment active" type="button" role="tab" aria-selected="true" data-auction-dataset="focus">重点异动 <strong id="auctionFocusCount">0</strong></button>
|
||||
<button class="segment" type="button" role="tab" aria-selected="false" data-auction-dataset="onePrice">竞价一字 <strong id="auctionOnePriceCount">0</strong></button>
|
||||
<button class="segment" type="button" role="tab" aria-selected="false" data-auction-dataset="watchlist">我的自选 <strong id="auctionWatchlistCount">0</strong></button>
|
||||
<button class="segment" type="button" role="tab" aria-selected="false" data-auction-dataset="all">全部候选 <strong id="auctionAllCount">0</strong></button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="auctionExpectationFilterbar" class="auction-expectation-filterbar">
|
||||
<span>预期筛选</span>
|
||||
<div class="segmented market-feature-segments auction-expectation-segments" role="group" aria-label="竞价预期差筛选">
|
||||
<button class="segment active" type="button" data-auction-filter="all">全部</button>
|
||||
<button class="segment" type="button" data-auction-filter="above">超预期 <strong id="auctionAboveCount">0</strong></button>
|
||||
<button class="segment" type="button" data-auction-filter="matched">符合预期 <strong id="auctionMatchedCount">0</strong></button>
|
||||
<button class="segment" type="button" data-auction-filter="below">低于预期 <strong id="auctionBelowCount">0</strong></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-frame auction-unified-table-frame">
|
||||
<table class="data-table auction-table">
|
||||
<thead><tr><th>股票</th><th>方向与来源</th><th>市场身份</th><th class="number">关注分</th><th>预期判断</th><th class="number">竞价涨幅</th><th class="number">竞价量能</th></tr></thead>
|
||||
<tbody id="auctionTableBody"></tbody>
|
||||
</table>
|
||||
<div id="auctionEmpty" class="empty-state" hidden>没有符合条件的竞价候选</div>
|
||||
</div>
|
||||
</section>
|
||||
<aside class="auction-evidence-rail" aria-label="竞价旁证">
|
||||
<section class="auction-evidence-section" aria-labelledby="auctionThemeTitle">
|
||||
<div class="auction-insight-heading">
|
||||
<div><span class="metric-label">题材承接</span><h3 id="auctionThemeTitle">昨日强势方向</h3></div>
|
||||
<span id="auctionThemeBaseline" class="section-subtitle">--</span>
|
||||
</div>
|
||||
<div id="auctionThemeCarry" class="auction-theme-list"></div>
|
||||
<div class="auction-new-theme-line"><strong>今日新线索</strong><div id="auctionNewThemes" class="auction-theme-chips"></div></div>
|
||||
</section>
|
||||
<section class="auction-evidence-section" aria-labelledby="auctionAmountTitle">
|
||||
<div class="auction-insight-heading">
|
||||
<div><span class="metric-label">市场量能</span><h3 id="auctionAmountTitle">竞价成交额</h3></div>
|
||||
<strong id="auctionAmountValue" class="auction-amount-value">--</strong>
|
||||
</div>
|
||||
<div id="auctionAmountTrend" class="auction-amount-trend" aria-label="近十个交易日集合竞价成交额"></div>
|
||||
<div id="auctionAmountCompare" class="auction-amount-compare"></div>
|
||||
</section>
|
||||
<section class="auction-news-entry" aria-labelledby="auctionNewsTitle">
|
||||
<i data-lucide="newspaper"></i>
|
||||
<div><h3 id="auctionNewsTitle">隔夜消息反馈</h3><p id="auctionNewsMessage">待稳定数据接入后开放</p></div>
|
||||
<span class="disabled-status">暂不可用</span>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="themeLibraryView" class="workspace-view">
|
||||
<div class="section-toolbar">
|
||||
<div class="section-title-group"><h2>题材库</h2><span id="themeDateLabel" class="section-subtitle">--</span></div>
|
||||
<div class="toolbar-controls">
|
||||
<label class="search-field"><span class="visually-hidden">搜索题材</span><input id="themeSearch" type="search" placeholder="搜索题材名称或代码"></label>
|
||||
<button id="themeRefreshButton" class="button" type="button"><i data-lucide="refresh-cw"></i>刷新题材</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="themeSummary" class="market-feature-summary" aria-live="polite"></div>
|
||||
<div class="theme-library-layout">
|
||||
<section class="theme-directory-panel" aria-label="题材列表">
|
||||
<div class="theme-directory-heading"><strong>全部题材</strong><span id="themeResultCount">0 个</span></div>
|
||||
<div id="themeDirectory" class="theme-directory"></div>
|
||||
</section>
|
||||
<section class="theme-detail-panel" aria-live="polite">
|
||||
<div id="themeDetailEmpty" class="empty-state theme-detail-empty">选择题材查看走势与成分股</div>
|
||||
<div id="themeDetailContent" hidden>
|
||||
<header class="theme-detail-heading">
|
||||
<div><span class="metric-label">题材详情</span><h3 id="themeDetailName">--</h3><small id="themeDetailCode">--</small></div>
|
||||
<strong id="themeDetailChange">--</strong>
|
||||
</header>
|
||||
<div id="themeDetailMetrics" class="theme-detail-metrics"></div>
|
||||
<div class="theme-chart-shell"><canvas id="themeDetailChart" aria-label="题材日K图"></canvas></div>
|
||||
<div class="theme-members-heading"><h3>成分股</h3><span id="themeMemberCount">0 只</span></div>
|
||||
<div class="table-frame theme-members-frame">
|
||||
<table class="data-table"><thead><tr><th>#</th><th>代码</th><th>股票名称</th><th class="number">涨跌幅</th><th class="number">收盘价</th><th class="number">成交额</th></tr></thead><tbody id="themeMemberTableBody"></tbody></table>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="popularityView" class="workspace-view">
|
||||
<div class="section-toolbar">
|
||||
<div class="section-title-group"><h2>人气热榜</h2><span id="popularityDateLabel" class="section-subtitle">--</span></div>
|
||||
<div class="toolbar-controls"><button id="popularityRefreshButton" class="button" type="button"><i data-lucide="refresh-cw"></i>刷新热榜</button></div>
|
||||
</div>
|
||||
<div id="popularitySummary" class="market-feature-summary" aria-live="polite"></div>
|
||||
<div class="market-feature-filterbar">
|
||||
<div class="segmented market-feature-segments" role="tablist" aria-label="热榜来源">
|
||||
<button class="segment active" type="button" role="tab" aria-selected="true" data-popularity-source="combined">双榜综合</button>
|
||||
<button class="segment" type="button" role="tab" aria-selected="false" data-popularity-source="ths">同花顺</button>
|
||||
<button class="segment" type="button" role="tab" aria-selected="false" data-popularity-source="dc">东方财富</button>
|
||||
</div>
|
||||
<label class="search-field"><span class="visually-hidden">搜索热榜股票</span><input id="popularitySearch" type="search" placeholder="代码、名称或概念"></label>
|
||||
</div>
|
||||
<div class="table-frame market-feature-table-frame">
|
||||
<table class="data-table popularity-table"><thead><tr><th>#</th><th>代码</th><th>股票名称</th><th class="number">涨跌幅</th><th class="number">最新价</th><th class="number">同花顺</th><th class="number">东方财富</th><th class="number">排名变化</th><th>热门概念</th><th>榜单状态</th></tr></thead><tbody id="popularityTableBody"></tbody></table>
|
||||
<div id="popularityEmpty" class="empty-state" hidden>暂无符合条件的人气数据</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="dragonView" class="workspace-view">
|
||||
<div class="section-toolbar">
|
||||
<div class="section-title-group">
|
||||
@@ -1109,10 +1240,16 @@
|
||||
</div>
|
||||
<section class="stock-chart-section">
|
||||
<div class="detail-section-heading">
|
||||
<h3>日 K 与成交量</h3>
|
||||
<span id="entityDetailDate">--</span>
|
||||
<h3>行情走势</h3>
|
||||
<div class="chart-heading-controls">
|
||||
<div class="segmented chart-mode-toggle" role="group" aria-label="详情图表周期">
|
||||
<button class="segment active" type="button" data-entity-detail-chart="daily" aria-pressed="true">日K</button>
|
||||
<button class="segment" type="button" data-entity-detail-chart="intraday" aria-pressed="false">分时</button>
|
||||
</div>
|
||||
<span id="entityDetailDate">--</span>
|
||||
</div>
|
||||
</div>
|
||||
<canvas id="entityDetailChart" class="price-chart" width="680" height="300" aria-label="日 K 线与成交量图"></canvas>
|
||||
<canvas id="entityDetailChart" class="price-chart" width="680" height="300" aria-label="行情走势图"></canvas>
|
||||
</section>
|
||||
<section class="detail-section">
|
||||
<h3>交易数据</h3>
|
||||
@@ -1140,10 +1277,16 @@
|
||||
</div>
|
||||
<section class="stock-chart-section">
|
||||
<div class="detail-section-heading">
|
||||
<h3>日 K 与成交量</h3>
|
||||
<span id="chartSource">--</span>
|
||||
<h3>行情走势</h3>
|
||||
<div class="chart-heading-controls">
|
||||
<div class="segmented chart-mode-toggle" role="group" aria-label="股票图表周期">
|
||||
<button class="segment active" type="button" data-stock-detail-chart="daily" aria-pressed="true">日K</button>
|
||||
<button class="segment" type="button" data-stock-detail-chart="intraday" aria-pressed="false">分时</button>
|
||||
</div>
|
||||
<span id="chartSource">--</span>
|
||||
</div>
|
||||
</div>
|
||||
<canvas id="priceChart" class="price-chart" width="680" height="300" aria-label="股票日K线图"></canvas>
|
||||
<canvas id="priceChart" class="price-chart" width="680" height="300" aria-label="股票行情走势图"></canvas>
|
||||
</section>
|
||||
<section class="detail-section moneyflow-section">
|
||||
<h3>当日资金流</h3>
|
||||
|
||||
Reference in New Issue
Block a user