|
|
<!DOCTYPE html><html lang="zh-CN"><head>
|
|
|
<meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
|
<title>掘金动量分析系统 - Demo</title>
|
|
|
<script src="https://cdn.jsdelivr.net/npm/echarts@4.9.0/dist/echarts.min.js"></script>
|
|
|
<style>:root{--bg0:#0d1117;--bg1:#161b22;--bg2:#1c2333;--bg3:#2a3040;--bd:#30363d;--t1:#e6edf3;--t2:#8b949e;--tm:#6e7681;--red:#f85149;--grn:#3fb950;--org:#d29922;--blu:#58a6ff}
|
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
|
body{font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg0);color:var(--t1);line-height:1.5}
|
|
|
.app{display:flex;min-height:100vh}
|
|
|
.side{width:180px;background:var(--bg1);border-right:1px solid var(--bd);position:fixed;top:0;bottom:0;left:0;z-index:100;display:flex;flex-direction:column}
|
|
|
.slogo{padding:12px 14px;border-bottom:1px solid var(--bd);display:flex;align-items:center;gap:8px}
|
|
|
.slogo .ico{width:24px;height:24px;background:linear-gradient(135deg,var(--red),var(--org));border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:12px}
|
|
|
.slogo b{font-size:13px}
|
|
|
.snav{flex:1;padding:8px 0}
|
|
|
.ng{padding:6px 14px 3px;font-size:9px;color:var(--tm);text-transform:uppercase;letter-spacing:.5px}
|
|
|
.ni{display:flex;align-items:center;gap:7px;padding:6px 14px;color:var(--t2);cursor:pointer;font-size:11px;border-left:3px solid transparent;transition:all .1s}
|
|
|
.ni:hover{background:var(--bg3);color:var(--t1)}.ni.on{background:rgba(88,166,255,.1);color:var(--blu);border-left-color:var(--blu)}
|
|
|
.ni .badge{margin-left:auto;background:var(--red);color:#fff;font-size:8px;padding:0 4px;border-radius:6px;line-height:16px}
|
|
|
.marea{margin-left:180px;flex:1;display:flex;flex-direction:column}
|
|
|
.topbar{height:40px;background:var(--bg1);border-bottom:1px solid var(--bd);display:flex;align-items:center;padding:0 16px;gap:10px;position:sticky;top:0;z-index:50}
|
|
|
.topbar .bc{font-size:11px;color:var(--t2)}.topbar .bc b{color:var(--t1)}.topbar-r{margin-left:auto;display:flex;align-items:center;gap:8px}
|
|
|
.topbar-r input{background:var(--bg2);border:1px solid var(--bd);color:var(--t1);padding:2px 6px;border-radius:4px;font-size:10px;width:110px}
|
|
|
.cnt{padding:12px 16px;flex:1}
|
|
|
.card{background:var(--bg2);border:1px solid var(--bd);border-radius:7px;overflow:hidden;margin-bottom:12px}
|
|
|
.chd{padding:8px 12px;border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between}
|
|
|
.cht{font-size:12px;font-weight:600;display:flex;align-items:center;gap:5px}.cht .dot{width:6px;height:6px;border-radius:50%}
|
|
|
.cbd{padding:10px 12px}
|
|
|
.btn{padding:3px 8px;border-radius:3px;border:1px solid var(--bd);background:var(--bg2);color:var(--t1);font-size:9px;cursor:pointer}.btn:hover{background:var(--bg3)}
|
|
|
.mfilter{display:flex;align-items:center;gap:6px;margin-bottom:10px;padding:8px 12px;background:var(--bg1);border:1px solid var(--bd);border-radius:6px;flex-wrap:wrap}
|
|
|
.mtab{padding:4px 12px;font-size:10px;color:var(--t2);cursor:pointer;border-radius:4px;border:1px solid transparent;background:transparent;transition:all .12s}
|
|
|
.mtab:hover{background:var(--bg3);color:var(--t1)}.mtab.on{background:rgba(88,166,255,.1);color:var(--blu);border-color:var(--blu)}
|
|
|
.ministats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}
|
|
|
.ministat{background:var(--bg2);border:1px solid var(--bd);border-radius:5px;padding:8px 12px}
|
|
|
.ministat .lbl{font-size:9px;color:var(--tm);margin-bottom:2px}.ministat .val{font-size:20px;font-weight:700}.ministat .sub{font-size:9px;color:var(--t2);margin-top:1px}
|
|
|
.sentrow{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}
|
|
|
.sentcard{background:var(--bg2);border:1px solid var(--bd);border-radius:6px;padding:10px 12px;position:relative;overflow:hidden}
|
|
|
.sentcard::before{content:"";position:absolute;top:0;left:0;right:0;height:2px}
|
|
|
.sentcard.hot::before{background:linear-gradient(90deg,#ff8a65,#f44336)}
|
|
|
.sentcard.warm::before{background:linear-gradient(90deg,#ffd54f,#ff8a65)}
|
|
|
.sentcard.neutral::before{background:linear-gradient(90deg,#66bb6a,#ffd54f)}
|
|
|
.sentcard.cool::before{background:linear-gradient(90deg,#4fc3f7,#66bb6a)}
|
|
|
.sentcard .snm{font-size:11px;color:var(--t2);margin-bottom:4px}
|
|
|
.sentcard .sval{font-size:28px;font-weight:700;line-height:1}.sentcard .slabel{font-size:10px;margin-top:2px}
|
|
|
.sentcard .sbar{margin-top:8px;height:4px;background:var(--bg3);border-radius:2px;overflow:hidden}
|
|
|
.sentcard .sbar .sf{height:100%;border-radius:2px}
|
|
|
.sentcard .smeta{margin-top:6px;display:flex;justify-content:space-between;font-size:8px;color:var(--tm)}
|
|
|
.shot{color:#f44336}.swarm{color:#ff8a65}.sneutral{color:#ffd54f}.scool{color:#66bb6a}
|
|
|
.sf-h{background:linear-gradient(90deg,#ff8a65,#f44336)}.sf-w{background:linear-gradient(90deg,#ffd54f,#ff8a65)}
|
|
|
.sf-n{background:linear-gradient(90deg,#66bb6a,#ffd54f)}.sf-c{background:linear-gradient(90deg,#4fc3f7,#66bb6a)}
|
|
|
.bchart{display:flex;align-items:flex-end;justify-content:space-around;height:140px;padding:4px 0;border-bottom:1px solid var(--bd)}
|
|
|
.bgrp{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1}
|
|
|
.bar{width:18px;border-radius:2px 2px 0 0}.bar.r{background:var(--red)}.bar.g{background:var(--grn)}.bar.gr{background:var(--tm)}
|
|
|
.blbl{font-size:7px;color:var(--tm)}.bval{font-size:7px;color:var(--t2)}
|
|
|
table{width:100%;border-collapse:collapse;font-size:10px}
|
|
|
th{background:var(--bg1);padding:5px 8px;text-align:left;font-weight:600;color:var(--t2);border-bottom:1px solid var(--bd);position:sticky;top:0}
|
|
|
td{padding:5px 8px;border-bottom:1px solid var(--bd)}
|
|
|
tr:hover td{background:var(--bg3)}.tw{overflow-x:auto}
|
|
|
.rb{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:4px;font-size:9px;font-weight:700}
|
|
|
.r1{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}
|
|
|
.r2{background:linear-gradient(135deg,#ffa502,#e17009);color:#fff}
|
|
|
.r3{background:linear-gradient(135deg,#e3b341,#d29922);color:#fff}
|
|
|
.ro{background:var(--bg1);color:var(--t2)}
|
|
|
.vr{color:var(--red)}.vg{color:var(--grn)}
|
|
|
.sig{display:inline-flex;padding:1px 5px;border-radius:8px;font-size:9px;font-weight:600}
|
|
|
.sig-u{background:rgba(248,81,73,.12);color:var(--red)}
|
|
|
.sig-o{background:rgba(210,153,34,.12);color:var(--org)}
|
|
|
.sig-n{background:var(--bg3);color:var(--tm)}
|
|
|
.page{display:none}.page.on{display:block}
|
|
|
::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-thumb{background:var(--bd);border-radius:2px}
|
|
|
.demo-note{background:rgba(88,166,255,.1);border:1px solid var(--blu);border-radius:5px;padding:8px 12px;margin-bottom:12px;font-size:10px;color:var(--blu)}
|
|
|
.drow1{display:grid;grid-template-columns:300px 1fr;gap:12px}.drow2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
|
|
|
.modal-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:200;display:none;align-items:center;justify-content:center}
|
|
|
.modal-ov.show{display:flex}
|
|
|
.modal{background:var(--bg1);border:1px solid var(--bd);border-radius:8px;width:92%;max-width:980px;max-height:85vh;display:flex;flex-direction:column;overflow:hidden}
|
|
|
.mhd{padding:10px 14px;border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between}.mhd h3{font-size:13px}
|
|
|
.mcl{width:22px;height:22px;border-radius:4px;border:none;background:var(--bg2);color:var(--t2);cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center}
|
|
|
.mcl:hover{background:var(--red);color:#fff}
|
|
|
.mbd{flex:1;overflow-y:auto;padding:12px}
|
|
|
.detailrow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
|
|
|
.stat-card{background:var(--bg1);border:1px solid var(--bd);border-radius:5px;padding:8px 12px}
|
|
|
.stat-card .sl{font-size:9px;color:var(--tm);margin-bottom:2px}.stat-card .sv{font-size:22px;font-weight:700}
|
|
|
.fbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
|
|
|
.fbar label{font-size:10px;color:var(--t2)}.fbar select,.fbar input{background:var(--bg2);border:1px solid var(--bd);color:var(--t1);padding:3px 6px;border-radius:3px;font-size:10px}
|
|
|
.hmc{overflow-x:auto}
|
|
|
.hmt{border-collapse:collapse;min-width:100%}
|
|
|
.hmt th{background:var(--bg1);padding:4px 5px;font-size:9px;text-align:center;color:var(--t2);border:1px solid var(--bd)}
|
|
|
.hmt td{padding:0;border:1px solid var(--bd);text-align:center}
|
|
|
.hcell{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 2px;min-width:44px;cursor:pointer;transition:transform .1s,box-shadow .1s}
|
|
|
.hcell:hover{transform:scale(1.06);z-index:2;box-shadow:0 0 0 2px var(--blu)}
|
|
|
.hcell .hrk{font-size:11px;font-weight:700}
|
|
|
.h1{background:linear-gradient(135deg,#ff4444,#cc0000);color:#fff}
|
|
|
.h2{background:linear-gradient(135deg,#ff6b6b,#e04040);color:#fff}
|
|
|
.h3{background:linear-gradient(135deg,#ff9a76,#d94f4f);color:#fff}
|
|
|
.h4{background:linear-gradient(135deg,#ffa502,#c77f00);color:#fff}
|
|
|
.h5{background:linear-gradient(135deg,#e3b341,#b8911a);color:#333}
|
|
|
.h6{background:linear-gradient(135deg,#e6d34a,#c4b538);color:#333}
|
|
|
.h7{background:linear-gradient(135deg,#8bda5e,#5fb32e);color:#fff}
|
|
|
.h8{background:linear-gradient(135deg,#4dd08b,#28a360);color:#fff}
|
|
|
.h9{background:linear-gradient(135deg,#36b37e,#1e8c5e);color:#fff}
|
|
|
.h10{background:linear-gradient(135deg,#2d9cdb,#1a7ab5);color:#fff}
|
|
|
.hd{background:var(--bg2);color:var(--t2)}
|
|
|
.hnc{background:var(--bg2);padding:4px 8px;text-align:left;font-size:10px;font-weight:500;min-width:64px;position:sticky;left:0;z-index:1}
|
|
|
.mode-switch{display:flex;gap:0;margin-bottom:10px;border:1px solid var(--bd);border-radius:6px;overflow:hidden;width:fit-content}
|
|
|
.mode-btn{padding:6px 16px;font-size:11px;color:var(--t2);cursor:pointer;background:var(--bg2);border:none;border-right:1px solid var(--bd);transition:all .1s}
|
|
|
.mode-btn:hover{color:var(--t1);background:var(--bg3)}.mode-btn.on{color:var(--blu);background:rgba(88,166,255,.1)}
|
|
|
.view-hm,.view-tb{display:none}.view-hm.on,.view-tb.on{display:block}
|
|
|
.enhanced-tbl{width:100%;border-collapse:collapse;font-size:11px}
|
|
|
.enhanced-tbl th{background:var(--bg1);padding:6px 8px;text-align:left;font-weight:600;color:var(--t2);border-bottom:1px solid var(--bd);position:sticky;top:0}
|
|
|
.enhanced-tbl td{padding:6px 8px;border-bottom:1px solid var(--bd)}
|
|
|
.enhanced-tbl tr:hover td{background:var(--bg3)}
|
|
|
.change-item{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid var(--bd)}
|
|
|
.change-item:last-child{border-bottom:none}
|
|
|
.change-item .name{flex:1;font-size:11px}.change-item .rk{font-size:10px;color:var(--t2);min-width:60px}.change-item .delta{font-size:10px;font-weight:600;min-width:50px;text-align:right}
|
|
|
.arrow-up{color:var(--red)}.arrow-down{color:var(--grn)}
|
|
|
.hmlabel{padding:8px 12px;display:flex;align-items:center;gap:8px;font-size:9px;color:var(--t2);flex-wrap:wrap}
|
|
|
.hmlabel-item{display:flex;align-items:center;gap:3px}.hmlabel-c{width:12px;height:12px;border-radius:2px}
|
|
|
.kline-container{width:100%;height:180px}</style></head><body><div class="app">
|
|
|
<div class="side">
|
|
|
<div class="slogo"><div class="ico">DJ</div><b>掘金动量</b></div>
|
|
|
<nav class="snav"><div class="ng">核心</div>
|
|
|
<div class="ni on" onclick="go('dashboard',this)">行情总览</div>
|
|
|
<div class="ni" onclick="go('heatmap',this)">趋势热力</div>
|
|
|
<div class="ng">个股</div><div class="ni">动量个股</div>
|
|
|
<div class="ni">强势股池<span class="badge">23</span></div>
|
|
|
<div class="ni">涨停池<span class="badge">17</span></div>
|
|
|
<div class="ni">跌停池</div>
|
|
|
<div class="ng">数据</div><div class="ni">基础数据</div><div class="ni">行情数据</div>
|
|
|
<div class="ng">交易</div><div class="ni">交易记账</div><div class="ni">系统设置</div>
|
|
|
</nav></div>
|
|
|
<div class="marea">
|
|
|
<div class="topbar"><div class="bc">掘金动量 / <b id="bp">行情总览</b></div>
|
|
|
<div class="topbar-r"><span style="font-size:10px;color:var(--tm)">交易日：</span><input type="date" value="2025-04-22"><button class="btn" onclick="refreshData()">刷新</button></div></div>
|
|
|
<div class="cnt page on" id="pg-dashboard">
|
|
|
<div class="demo-note">Demo模式 - 数据为模拟展示，点击任意详情可查看详情弹窗</div>
|
|
|
<div class="mfilter"><span class="mlbl">市场范围</span>
|
|
|
<div class="mtab on" onclick="switchMarket(this)">全A</div>
|
|
|
<div class="mtab" onclick="switchMarket(this)">上证</div>
|
|
|
<div class="mtab" onclick="switchMarket(this)">深证</div>
|
|
|
<div class="mtab" onclick="switchMarket(this)">创业板</div>
|
|
|
<div class="mtab" onclick="switchMarket(this)">科创板</div>
|
|
|
<div class="mtab" onclick="switchMarket(this)">中证1000</div>
|
|
|
</div>
|
|
|
<div class="ministats">
|
|
|
<div class="ministat"><div class="lbl">上涨家数</div><div class="val vr">2,618</div><div class="sub">占比 50.2%</div></div>
|
|
|
<div class="ministat"><div class="lbl">下跌家数</div><div class="val vg">2,318</div><div class="sub">占比 44.4%</div></div>
|
|
|
<div class="ministat"><div class="lbl">涨停家数</div><div class="val vr">67</div><div class="sub">较昨日 +12</div></div>
|
|
|
<div class="ministat"><div class="lbl">跌停家数</div><div class="val vg">18</div><div class="sub">较昨日 -5</div></div>
|
|
|
</div>
|
|
|
<div class="sentrow">
|
|
|
<div class="sentcard hot"><div class="snm">全A情绪</div><div class="sval shot">72</div><div class="slabel shot">偏热</div><div class="sbar"><div class="sf sf-h" style="width:72%"></div></div><div class="smeta"><span>涨停 67</span><span>跌停 18</span><span>涨跌比 1.13</span></div></div>
|
|
|
<div class="sentcard warm"><div class="snm">中证1000</div><div class="sval swarm">68</div><div class="slabel swarm">偏热</div><div class="sbar"><div class="sf sf-w" style="width:68%"></div></div><div class="smeta"><span>涨停 45</span><span>跌停 12</span><span>涨跌比 1.21</span></div></div>
|
|
|
<div class="sentcard neutral"><div class="snm">创业板</div><div class="sval sneutral">52</div><div class="slabel sneutral">中性</div><div class="sbar"><div class="sf sf-n" style="width:52%"></div></div><div class="smeta"><span>涨停 28</span><span>跌停 8</span><span>涨跌比 0.95</span></div></div>
|
|
|
<div class="sentcard cool"><div class="snm">科创板</div><div class="sval scool">38</div><div class="slabel scool">偏冷</div><div class="sbar"><div class="sf sf-c" style="width:38%"></div></div><div class="smeta"><span>涨停 8</span><span>跌停 5</span><span>涨跌比 0.82</span></div></div>
|
|
|
</div><div class="drow1">
|
|
|
<div class="card"><div class="chd"><div class="cht"><div class="dot" style="background:var(--red)"></div>涨跌分布</div></div>
|
|
|
<div class="cbd" style="padding:4px 8px 8px"><div class="bchart">
|
|
|
<div class="bgrp"><div class="bval">67</div><div class="bar r" style="height:12px"></div><div class="blbl">+10%</div></div>
|
|
|
<div class="bgrp"><div class="bval">47</div><div class="bar r" style="height:9px"></div><div class="blbl">7-10%</div></div>
|
|
|
<div class="bgrp"><div class="bval">89</div><div class="bar r" style="height:14px"></div><div class="blbl">5-7%</div></div>
|
|
|
<div class="bgrp"><div class="bval">230</div><div class="bar r" style="height:24px"></div><div class="blbl">3-5%</div></div>
|
|
|
<div class="bgrp"><div class="bval">2056</div><div class="bar r" style="height:82px"></div><div class="blbl">0-3%</div></div>
|
|
|
<div class="bgrp"><div class="bval">207</div><div class="bar gr" style="height:17px"></div><div class="blbl">平</div></div>
|
|
|
<div class="bgrp"><div class="bval">2174</div><div class="bar g" style="height:87px"></div><div class="blbl">0-3%</div></div>
|
|
|
<div class="bgrp"><div class="bval">218</div><div class="bar g" style="height:18px"></div><div class="blbl">3-5%</div></div>
|
|
|
<div class="bgrp"><div class="bval">49</div><div class="bar g" style="height:8px"></div><div class="blbl">5-7%</div></div>
|
|
|
<div class="bgrp"><div class="bval">28</div><div class="bar g" style="height:6px"></div><div class="blbl">-7%</div></div>
|
|
|
<div class="bgrp"><div class="bval">18</div><div class="bar g" style="height:4px"></div><div class="blbl">-10%</div></div>
|
|
|
</div></div></div>
|
|
|
<div class="card"><div class="chd"><div class="cht"><div class="dot" style="background:var(--blu)"></div>趋势板块 TOP 10</div></div>
|
|
|
<div class="cbd" style="padding:0"><div class="tw" style="max-height:230px;overflow-y:auto">
|
|
|
<table><thead><tr><th style="width:28px">#</th><th>板块</th><th style="text-align:center">动量</th><th style="text-align:center">涨停</th><th style="text-align:center">新高</th><th></th></tr></thead><tbody>
|
|
|
<tr><td><span class="rb r1">1</span></td><td><b>零售</b></td><td style="text-align:center"><span class="sig-u">Rank 7</span></td><td style="text-align:center" class="vr">7</td><td style="text-align:center" class="vr">4</td><td><button class="btn" onclick="showDetail('零售')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb r2">2</span></td><td><b>化学制药</b></td><td style="text-align:center"><span class="sig-u">Rank 6</span></td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">5</td><td><button class="btn" onclick="showDetail('化学制药')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb r3">3</span></td><td><b>食品</b></td><td style="text-align:center"><span class="sig-o">Rank 4</span></td><td style="text-align:center" class="vr">6</td><td style="text-align:center" class="vr">4</td><td><button class="btn" onclick="showDetail('食品')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">4</span></td><td>畜牧业</td><td style="text-align:center"><span class="sig-o">Rank 2</span></td><td style="text-align:center" class="">2</td><td style="text-align:center" class="">3</td><td><button class="btn" onclick="showDetail('畜牧业')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">5</span></td><td>贵金属</td><td style="text-align:center"><span class="sig-n">Rank 5</span></td><td style="text-align:center" class="">3</td><td style="text-align:center" class="">4</td><td><button class="btn" onclick="showDetail('贵金属')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">6</span></td><td>生物医药</td><td style="text-align:center"><span class="sig-n">Rank 1</span></td><td style="text-align:center" class="">1</td><td style="text-align:center" class="vr">8</td><td><button class="btn" onclick="showDetail('生物医药')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">7</span></td><td>物流</td><td style="text-align:center"><span class="sig-n">Rank 7</span></td><td style="text-align:center" class="vr">7</td><td style="text-align:center" class="">4</td><td><button class="btn" onclick="showDetail('物流')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">8</span></td><td>半导体</td><td style="text-align:center"><span class="sig-n">Rank 2</span></td><td style="text-align:center" class="">2</td><td style="text-align:center" class="">2</td><td><button class="btn" onclick="showDetail('半导体')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">9</span></td><td>化学制品</td><td style="text-align:center"><span class="sig-n">Rank 7</span></td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">6</td><td><button class="btn" onclick="showDetail('化学制品')">详情</button></td></tr>
|
|
|
<tr><td><span class="rb ro">10</span></td><td>商业物业</td><td style="text-align:center"><span class="sig-n">Rank 1</span></td><td style="text-align:center" class="">1</td><td style="text-align:center" class="">0</td><td><button class="btn" onclick="showDetail('商业物业')">详情</button></td></tr>
|
|
|
</tbody></table></div></div></div></div>
|
|
|
<div class="drow2">
|
|
|
<div class="card"><div class="chd"><div class="cht"><div class="dot" style="background:var(--org)"></div>趋势变化榜</div></div><div class="cbd">
|
|
|
<div class="change-item"><div class="name">物流</div><div class="rk">排名 7</div><div class="delta arrow-up">上升 5位</div></div>
|
|
|
<div class="change-item"><div class="name">零售</div><div class="rk">排名 1</div><div class="delta arrow-up">上升 4位</div></div>
|
|
|
<div class="change-item"><div class="name">化学制药</div><div class="rk">排名 2</div><div class="delta arrow-up">上升 3位</div></div>
|
|
|
<div class="change-item"><div class="name">食品</div><div class="rk">排名 3</div><div class="delta arrow-up">上升 2位</div></div>
|
|
|
<div class="change-item"><div class="name">软件开发</div><div class="rk">排名 35</div><div class="delta arrow-down">下降 8位</div></div>
|
|
|
<div class="change-item"><div class="name">新能源</div><div class="rk">排名 42</div><div class="delta arrow-down">下降 6位</div></div>
|
|
|
</div></div>
|
|
|
<div class="card"><div class="chd"><div class="cht"><div class="dot" style="background:var(--grn)"></div>强势板块连续统计</div></div>
|
|
|
<div class="cbd" style="padding:0"><table><thead><tr><th>板块</th><th style="text-align:center">连续天数</th><th style="text-align:center">当前排名</th><th style="text-align:center">平均排名</th></tr></thead><tbody>
|
|
|
<tr><td><b>零售</b></td><td style="text-align:center"><span class="sig sig-u">5天</span></td><td style="text-align:center">1</td><td style="text-align:center">2.4</td></tr>
|
|
|
<tr><td><b>食品</b></td><td style="text-align:center"><span class="sig sig-u">4天</span></td><td style="text-align:center">3</td><td style="text-align:center">3.2</td></tr>
|
|
|
<tr><td><b>化学制药</b></td><td style="text-align:center"><span class="sig sig-o">3天</span></td><td style="text-align:center">2</td><td style="text-align:center">4.0</td></tr>
|
|
|
<tr><td><b>物流</b></td><td style="text-align:center"><span class="sig sig-o">3天</span></td><td style="text-align:center">7</td><td style="text-align:center">12.0</td></tr>
|
|
|
<tr><td><b>贵金属</b></td><td style="text-align:center"><span class="sig sig-n">2天</span></td><td style="text-align:center">5</td><td style="text-align:center">8.5</td></tr>
|
|
|
</tbody></table></div></div></div></div></div><div class="cnt page" id="pg-heatmap">
|
|
|
<div class="fbar"><label>动量周期：</label><select>
|
|
|
<option>1日</option>
|
|
|
<option>3日</option>
|
|
|
<option>5日</option>
|
|
|
<option>10日</option>
|
|
|
<option>15日</option>
|
|
|
<option selected>20日</option>
|
|
|
<option>30日</option>
|
|
|
</select><label>日期：</label><input type="date" value="2025-04-22"><button class="btn">刷新</button></div>
|
|
|
<div class="mode-switch">
|
|
|
<div class="mode-btn on" onclick="switchMode(this,'hm')">热力矩阵</div>
|
|
|
<div class="mode-btn" onclick="switchMode(this,'tb')">增强表格</div></div>
|
|
|
<div class="view-hm on" id="view-hm"><div class="hmc"><table class="hmt"><thead>
|
|
|
<tr><th style="width:80px;text-align:left;padding:4px 10px;font-size:10px">2级行业</th>
|
|
|
<th>04-22</th>
|
|
|
<th>04-21</th>
|
|
|
<th>04-18</th>
|
|
|
<th>04-17</th>
|
|
|
<th>04-16</th>
|
|
|
<th>04-15</th>
|
|
|
<th>04-14</th>
|
|
|
<th>04-11</th>
|
|
|
<th>04-10</th>
|
|
|
<th>04-09</th>
|
|
|
</tr></thead><tbody>
|
|
|
<tr><td class="hnc">零售</td><td><div class="hcell h1" onclick="showDetail('零售')"><div class="hrk">1</div></div></td><td><div class="hcell h1" onclick="showDetail('零售')"><div class="hrk">1</div></div></td><td><div class="hcell h1" onclick="showDetail('零售')"><div class="hrk">1</div></div></td><td><div class="hcell h3" onclick="showDetail('零售')"><div class="hrk">3</div></div></td><td><div class="hcell h8" onclick="showDetail('零售')"><div class="hrk">8</div></div></td><td><div class="hcell h10" onclick="showDetail('零售')"><div class="hrk">10</div></div></td><td><div class="hcell h2" onclick="showDetail('零售')"><div class="hrk">2</div></div></td><td><div class="hcell h5" onclick="showDetail('零售')"><div class="hrk">5</div></div></td><td><div class="hcell h8" onclick="showDetail('零售')"><div class="hrk">8</div></div></td><td><div class="hcell h8" onclick="showDetail('零售')"><div class="hrk">8</div></div></td></tr>
|
|
|
<tr><td class="hnc">化学制药</td><td><div class="hcell h2" onclick="showDetail('化学制药')"><div class="hrk">2</div></div></td><td><div class="hcell h4" onclick="showDetail('化学制药')"><div class="hrk">4</div></div></td><td><div class="hcell h5" onclick="showDetail('化学制药')"><div class="hrk">5</div></div></td><td><div class="hcell h5" onclick="showDetail('化学制药')"><div class="hrk">5</div></div></td><td><div class="hcell h6" onclick="showDetail('化学制药')"><div class="hrk">6</div></div></td><td><div class="hcell h2" onclick="showDetail('化学制药')"><div class="hrk">2</div></div></td><td><div class="hcell h3" onclick="showDetail('化学制药')"><div class="hrk">3</div></div></td><td><div class="hcell h3" onclick="showDetail('化学制药')"><div class="hrk">3</div></div></td><td><div class="hcell h7" onclick="showDetail('化学制药')"><div class="hrk">7</div></div></td><td><div class="hcell hd" onclick="showDetail('化学制药')"><div class="hrk">11</div></div></td></tr>
|
|
|
<tr><td class="hnc">食品</td><td><div class="hcell h3" onclick="showDetail('食品')"><div class="hrk">3</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td><td><div class="hcell h1" onclick="showDetail('食品')"><div class="hrk">1</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td><td><div class="hcell h5" onclick="showDetail('食品')"><div class="hrk">5</div></div></td><td><div class="hcell h5" onclick="showDetail('食品')"><div class="hrk">5</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td><td><div class="hcell h2" onclick="showDetail('食品')"><div class="hrk">2</div></div></td></tr>
|
|
|
<tr><td class="hnc">畜牧业</td><td><div class="hcell h4" onclick="showDetail('畜牧业')"><div class="hrk">4</div></div></td><td><div class="hcell h3" onclick="showDetail('畜牧业')"><div class="hrk">3</div></div></td><td><div class="hcell h9" onclick="showDetail('畜牧业')"><div class="hrk">9</div></div></td><td><div class="hcell h4" onclick="showDetail('畜牧业')"><div class="hrk">4</div></div></td><td><div class="hcell h4" onclick="showDetail('畜牧业')"><div class="hrk">4</div></div></td><td><div class="hcell h1" onclick="showDetail('畜牧业')"><div class="hrk">1</div></div></td><td><div class="hcell h4" onclick="showDetail('畜牧业')"><div class="hrk">4</div></div></td><td><div class="hcell h7" onclick="showDetail('畜牧业')"><div class="hrk">7</div></div></td><td><div class="hcell h5" onclick="showDetail('畜牧业')"><div class="hrk">5</div></div></td><td><div class="hcell h3" onclick="showDetail('畜牧业')"><div class="hrk">3</div></div></td></tr>
|
|
|
<tr><td class="hnc">贵金属</td><td><div class="hcell h5" onclick="showDetail('贵金属')"><div class="hrk">5</div></div></td><td><div class="hcell h6" onclick="showDetail('贵金属')"><div class="hrk">6</div></div></td><td><div class="hcell h4" onclick="showDetail('贵金属')"><div class="hrk">4</div></div></td><td><div class="hcell h2" onclick="showDetail('贵金属')"><div class="hrk">2</div></div></td><td><div class="hcell h3" onclick="showDetail('贵金属')"><div class="hrk">3</div></div></td><td><div class="hcell h6" onclick="showDetail('贵金属')"><div class="hrk">6</div></div></td><td><div class="hcell h10" onclick="showDetail('贵金属')"><div class="hrk">10</div></div></td><td><div class="hcell h1" onclick="showDetail('贵金属')"><div class="hrk">1</div></div></td><td><div class="hcell h6" onclick="showDetail('贵金属')"><div class="hrk">6</div></div></td><td><div class="hcell h6" onclick="showDetail('贵金属')"><div class="hrk">6</div></div></td></tr>
|
|
|
<tr><td class="hnc">生物医药</td><td><div class="hcell h6" onclick="showDetail('生物医药')"><div class="hrk">6</div></div></td><td><div class="hcell h5" onclick="showDetail('生物医药')"><div class="hrk">5</div></div></td><td><div class="hcell h6" onclick="showDetail('生物医药')"><div class="hrk">6</div></div></td><td><div class="hcell h7" onclick="showDetail('生物医药')"><div class="hrk">7</div></div></td><td><div class="hcell h5" onclick="showDetail('生物医药')"><div class="hrk">5</div></div></td><td><div class="hcell h4" onclick="showDetail('生物医药')"><div class="hrk">4</div></div></td><td><div class="hcell h1" onclick="showDetail('生物医药')"><div class="hrk">1</div></div></td><td><div class="hcell h4" onclick="showDetail('生物医药')"><div class="hrk">4</div></div></td><td><div class="hcell h3" onclick="showDetail('生物医药')"><div class="hrk">3</div></div></td><td><div class="hcell h5" onclick="showDetail('生物医药')"><div class="hrk">5</div></div></td></tr>
|
|
|
<tr><td class="hnc">物流</td><td><div class="hcell h7" onclick="showDetail('物流')"><div class="hrk">7</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">12</div></div></td><td><div class="hcell h10" onclick="showDetail('物流')"><div class="hrk">10</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('物流')"><div class="hrk">15</div></div></td></tr>
|
|
|
<tr><td class="hnc">半导体</td><td><div class="hcell h8" onclick="showDetail('半导体')"><div class="hrk">8</div></div></td><td><div class="hcell h7" onclick="showDetail('半导体')"><div class="hrk">7</div></div></td><td><div class="hcell h7" onclick="showDetail('半导体')"><div class="hrk">7</div></div></td><td><div class="hcell h6" onclick="showDetail('半导体')"><div class="hrk">6</div></div></td><td><div class="hcell h7" onclick="showDetail('半导体')"><div class="hrk">7</div></div></td><td><div class="hcell h3" onclick="showDetail('半导体')"><div class="hrk">3</div></div></td><td><div class="hcell h6" onclick="showDetail('半导体')"><div class="hrk">6</div></div></td><td><div class="hcell h8" onclick="showDetail('半导体')"><div class="hrk">8</div></div></td><td><div class="hcell h4" onclick="showDetail('半导体')"><div class="hrk">4</div></div></td><td><div class="hcell h4" onclick="showDetail('半导体')"><div class="hrk">4</div></div></td></tr>
|
|
|
<tr><td class="hnc">化学制品</td><td><div class="hcell h9" onclick="showDetail('化学制品')"><div class="hrk">9</div></div></td><td><div class="hcell h8" onclick="showDetail('化学制品')"><div class="hrk">8</div></div></td><td><div class="hcell h3" onclick="showDetail('化学制品')"><div class="hrk">3</div></div></td><td><div class="hcell h8" onclick="showDetail('化学制品')"><div class="hrk">8</div></div></td><td><div class="hcell h10" onclick="showDetail('化学制品')"><div class="hrk">10</div></div></td><td><div class="hcell h8" onclick="showDetail('化学制品')"><div class="hrk">8</div></div></td><td><div class="hcell h3" onclick="showDetail('化学制品')"><div class="hrk">3</div></div></td><td><div class="hcell h6" onclick="showDetail('化学制品')"><div class="hrk">6</div></div></td><td><div class="hcell h9" onclick="showDetail('化学制品')"><div class="hrk">9</div></div></td><td><div class="hcell h9" onclick="showDetail('化学制品')"><div class="hrk">9</div></div></td></tr>
|
|
|
<tr><td class="hnc">商业物业</td><td><div class="hcell h10" onclick="showDetail('商业物业')"><div class="hrk">10</div></div></td><td><div class="hcell h9" onclick="showDetail('商业物业')"><div class="hrk">9</div></div></td><td><div class="hcell h8" onclick="showDetail('商业物业')"><div class="hrk">8</div></div></td><td><div class="hcell h10" onclick="showDetail('商业物业')"><div class="hrk">10</div></div></td><td><div class="hcell h9" onclick="showDetail('商业物业')"><div class="hrk">9</div></div></td><td><div class="hcell h7" onclick="showDetail('商业物业')"><div class="hrk">7</div></div></td><td><div class="hcell h7" onclick="showDetail('商业物业')"><div class="hrk">7</div></div></td><td><div class="hcell hd" onclick="showDetail('商业物业')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('商业物业')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('商业物业')"><div class="hrk">12</div></div></td></tr>
|
|
|
<tr><td class="hnc">软件开发</td><td><div class="hcell hd" onclick="showDetail('软件开发')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('软件开发')"><div class="hrk">12</div></div></td><td><div class="hcell h10" onclick="showDetail('软件开发')"><div class="hrk">10</div></div></td><td><div class="hcell h9" onclick="showDetail('软件开发')"><div class="hrk">9</div></div></td><td><div class="hcell hd" onclick="showDetail('软件开发')"><div class="hrk">11</div></div></td><td><div class="hcell h9" onclick="showDetail('软件开发')"><div class="hrk">9</div></div></td><td><div class="hcell h8" onclick="showDetail('软件开发')"><div class="hrk">8</div></div></td><td><div class="hcell h9" onclick="showDetail('软件开发')"><div class="hrk">9</div></div></td><td><div class="hcell h10" onclick="showDetail('软件开发')"><div class="hrk">10</div></div></td><td><div class="hcell h10" onclick="showDetail('软件开发')"><div class="hrk">10</div></div></td></tr>
|
|
|
<tr><td class="hnc">新能源</td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">11</div></div></td><td><div class="hcell h9" onclick="showDetail('新能源')"><div class="hrk">9</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('新能源')"><div class="hrk">13</div></div></td></tr>
|
|
|
<tr><td class="hnc">传媒</td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('传媒')"><div class="hrk">14</div></div></td></tr>
|
|
|
<tr><td class="hnc">银行</td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">12</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('银行')"><div class="hrk">11</div></div></td></tr>
|
|
|
<tr><td class="hnc">房地产</td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('房地产')"><div class="hrk">16</div></div></td></tr>
|
|
|
<tr><td class="hnc">汽车</td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">14</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">15</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('汽车')"><div class="hrk">18</div></div></td></tr>
|
|
|
<tr><td class="hnc">电子器件</td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">11</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">16</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('电子器件')"><div class="hrk">17</div></div></td></tr>
|
|
|
<tr><td class="hnc">饮料</td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">11</div></div></td><td><div class="hcell h10" onclick="showDetail('饮料')"><div class="hrk">10</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">13</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">18</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">17</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">17</div></div></td><td><div class="hcell hd" onclick="showDetail('饮料')"><div class="hrk">19</div></div></td></tr>
|
|
|
<tr><td class="hnc">建筑装饰</td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">19</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">19</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('建筑装饰')"><div class="hrk">20</div></div></td></tr>
|
|
|
<tr><td class="hnc">通信</td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">30</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">28</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">28</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">22</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">20</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">25</div></div></td><td><div class="hcell hd" onclick="showDetail('通信')"><div class="hrk">22</div></div></td></tr>
|
|
|
</tbody></table></div>
|
|
|
<div class="hmlabel"><span>排名：</span>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h1"></div><span>1</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h2"></div><span>2</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h3"></div><span>3</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h4"></div><span>4</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h5"></div><span>5</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h6"></div><span>6</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h7"></div><span>7</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h8"></div><span>8</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h9"></div><span>9</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c h10"></div><span>10</span></div>
|
|
|
<div class="hmlabel-item"><div class="hmlabel-c hd"></div><span>>10</span></div></div></div>
|
|
|
<div class="view-tb" id="view-tbl"><div class="card"><div class="cbd" style="padding:0"><div class="tw" style="max-height:500px;overflow-y:auto">
|
|
|
<table class="enhanced-tbl"><thead><tr><th>板圱</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th style="text-align:center">排名</th>
|
|
|
<th>趋势</th></tr></thead><tbody>
|
|
|
<tr><td><b>零售</b></td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">8</td><td class="arrow-down">下降 7位</td></tr>
|
|
|
<tr><td><b>化学制药</b></td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">11</td><td class="arrow-down">下降 9位</td></tr>
|
|
|
<tr><td><b>食品</b></td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">2</td><td class="arrow-up">上升 1位</td></tr>
|
|
|
<tr><td><b>畜牧业</b></td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="vr">3</td><td class="arrow-up">上升 1位</td></tr>
|
|
|
<tr><td><b>贵金属</b></td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">2</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">6</td><td class="arrow-down">下降 1位</td></tr>
|
|
|
<tr><td><b>生物医药</b></td><td style="text-align:center" class="">6</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="vr">5</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">1</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="vr">5</td><td class="arrow-up">上升 1位</td></tr>
|
|
|
<tr><td><b>物流</b></td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="vg">15</td><td class="arrow-down">下降 8位</td></tr>
|
|
|
<tr><td><b>半导体</b></td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="vr">4</td><td style="text-align:center" class="vr">4</td><td class="arrow-up">上升 4位</td></tr>
|
|
|
<tr><td><b>化学制品</b></td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="vr">3</td><td style="text-align:center" class="">6</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">9</td><td class="arrow-down">下降 0位</td></tr>
|
|
|
<tr><td><b>商业物业</b></td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="">7</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">12</td><td class="arrow-down">下降 2位</td></tr>
|
|
|
<tr><td><b>软件开发</b></td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">8</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">10</td><td class="arrow-up">上升 5位</td></tr>
|
|
|
<tr><td><b>新能源</b></td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">9</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">13</td><td class="arrow-up">上升 7位</td></tr>
|
|
|
<tr><td><b>传媒</b></td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">14</td><td class="arrow-up">上升 11位</td></tr>
|
|
|
<tr><td><b>银行</b></td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">12</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="">11</td><td class="arrow-up">上升 1位</td></tr>
|
|
|
<tr><td><b>房地产</b></td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">14</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">16</td><td class="arrow-up">上升 2位</td></tr>
|
|
|
<tr><td><b>汽车</b></td><td style="text-align:center" class="">14</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="vg">15</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">18</td><td class="arrow-down">下降 4位</td></tr>
|
|
|
<tr><td><b>电子器件</b></td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">16</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">17</td><td class="arrow-down">下降 1位</td></tr>
|
|
|
<tr><td><b>饮料</b></td><td style="text-align:center" class="">11</td><td style="text-align:center" class="">10</td><td style="text-align:center" class="">13</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">18</td><td style="text-align:center" class="vg">17</td><td style="text-align:center" class="vg">17</td><td style="text-align:center" class="vg">19</td><td class="arrow-down">下降 8位</td></tr>
|
|
|
<tr><td><b>建筑装饰</b></td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">19</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">19</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">20</td><td class="arrow-up">上升 2位</td></tr>
|
|
|
<tr><td><b>通信</b></td><td style="text-align:center" class="vg">30</td><td style="text-align:center" class="vg">28</td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">28</td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">22</td><td style="text-align:center" class="vg">20</td><td style="text-align:center" class="vg">25</td><td style="text-align:center" class="vg">22</td><td class="arrow-up">上升 8位</td></tr>
|
|
|
</tbody></table></div></div></div></div><div class="modal-ov" id="modal"><div class="modal">
|
|
|
<div class="mhd"><h3 id="mtl">板圱详情</h3>
|
|
|
<button class="mcl" onclick="closeModal()">X</button></div>
|
|
|
<div class="mbd">
|
|
|
<div class="detailrow">
|
|
|
<div class="stat-card"><div class="sl">当前动量</div><div class="sv">12.34</div></div>
|
|
|
<div class="stat-card"><div class="sl">近5日趋势</div><div class="sv">持续上升</div></div>
|
|
|
<div class="stat-card"><div class="sl">涨停家数</div><div class="sv">3</div></div>
|
|
|
<div class="stat-card"><div class="sl">创新高</div><div class="sv">7</div></div>
|
|
|
<div class="stat-card"><div class="sl">连续天数</div><div class="sv">5天</div></div>
|
|
|
<div class="stat-card"><div class="sl">平均排名</div><div class="sv">2.4</div></div>
|
|
|
</div>
|
|
|
<div class="klinebox"><div id="detail-kline" class="kline-container"></div></div>
|
|
|
<div class="detail-tabs">
|
|
|
<div class="detail-tab on">概见</div>
|
|
|
<div class="detail-tab">排名趋势</div>
|
|
|
<div class="detail-tab">成分股</div>
|
|
|
<div class="detail-tab">历史数据</div>
|
|
|
</div>
|
|
|
<div class="detail-view on" id="dt-1">
|
|
|
<p style="font-size:11px;color:var(--t2)">该板块近20日动量排名第1，连续5天位列前三，内有7只涨停股、4只创新高，强势明显。</p>
|
|
|
</div>
|
|
|
<div class="detail-view" id="dt-2"><div id="detail-rank-chart"></div></div>
|
|
|
<div class="detail-view" id="dt-3">
|
|
|
<table><thead><tr><th>股票</th><th>涨幅</th><th>排名</th></tr></thead><tbody>
|
|
|
<tr><td>某股A</td><td class="vr">+10.01%</td><td>1</td></tr>
|
|
|
<tr><td>某股B</td><td class="vr">+9.98%</td><td>2</td></tr>
|
|
|
<tr><td>某股C</td><td class="vr">+8.50%</td><td>3</td></tr>
|
|
|
<tr><td>某股D</td><td class="vr">+7.20%</td><td>4</td></tr>
|
|
|
<tr><td>某股E</td><td class="vr">+6.80%</td><td>5</td></tr>
|
|
|
</tbody></table></div>
|
|
|
<div class="detail-view" id="dt-4"><p style="font-size:11px;color:var(--t2)">历史数据展示区域...</p></div>
|
|
|
</div></div></div>
|
|
|
<script>
|
|
|
function go(p,el){document.querySelectorAll(".page").forEach(function(x){x.classList.remove("on")});document.querySelectorAll(".ni").forEach(function(x){x.classList.remove("on")});document.getElementById("pg-"+p).classList.add("on");el.classList.add("on");document.getElementById("bp").textContent=p==="dashboard"?"行情总览":"趋势热力"}
|
|
|
function switchMarket(el){document.querySelectorAll(".mtab").forEach(function(x){x.classList.remove("on")});el.classList.add("on");alert("切换到 "+el.textContent+"市场")}
|
|
|
function switchMode(el,m){document.querySelectorAll(".mode-btn").forEach(function(x){x.classList.remove("on")});el.classList.add("on");document.getElementById("view-hm").classList.toggle("on",m==="hm");document.getElementById("view-tbl").classList.toggle("on",m==="tb")}
|
|
|
function showDetail(nm){document.getElementById("mtl").textContent=nm+"板块详情";document.getElementById("modal").classList.add("show")}
|
|
|
function closeModal(){document.getElementById("modal").classList.remove("show")}
|
|
|
function refreshData(){alert("数据刷新中...");setTimeout(function(){alert("刷新完成！")},500)}
|
|
|
document.getElementById("modal").addEventListener("click",function(e){if(e.target===this)closeModal()})
|
|
|
// ECharts kline init
|
|
|
setTimeout(function(){
|
|
|
if(typeof echarts!=="undefined"){
|
|
|
var chart=echarts.init(document.getElementById("detail-kline"));
|
|
|
chart.setOption({title:{text:"K线示意",textStyle:{color:"#e6edf3",fontSize:11}},grid:{left:50,right:20,top:30,bottom:20},xAxis:{data:["04-01","04-02","04-03","04-04","04-05","04-08","04-09","04-10","04-11","04-14","04-15","04-16","04-17","04-18","04-21","04-22"],axisLine:{lineStyle:{color:"#30363d"}},axisLabel:{color:"#8b949e"}},yAxis:{splitLine:{lineStyle:{color:"#21262d"}},axisLabel:{color:"#8b949e"}},series:[{type:"candlestick",data:[[10,11,9.5,10.5],[10.5,11.5,10,11],[11,12,10.5,11.5],[11.5,12.5,11,12],[12,13,11.5,12.5],[12.5,13.5,12,13],[13,14,12.5,13.5],[13.5,14.5,13,14],[14,15,13.5,14.5],[14.5,15.5,14,15],[15,16,14.5,15.5],[15.5,16.5,15,16],[16,17,15.5,16.5],[16.5,17.5,16,17],[17,18,16.5,17.5],[17.5,18.5,17,18]]}]});
|
|
|
var rankChart=echarts.init(document.getElementById("detail-rank-chart"));
|
|
|
rankChart.setOption({title:{text:"20日排名趋势",textStyle:{color:"#e6edf3",fontSize:11}},grid:{left:40,right:20,top:30,bottom:20},xAxis:{data:["04-01","04-05","04-10","04-15","04-22"],axisLine:{lineStyle:{color:"#30363d"}},axisLabel:{color:"#8b949e"}},yAxis:{inverse:true,splitLine:{lineStyle:{color:"#21262d"}},axisLabel:{color:"#8b949e"}},series:[{type:"line",data:[5,3,2,1,1],smooth:true,itemStyle:{color:"#f85149"},areaStyle:{color:"rgba(248,81,73,0.2)"}}]});
|
|
|
}});
|
|
|
</script>
|
|
|
</body></html> |
