总览汇总改为单行 KPI + sim/live 对比表,去掉重复卡片。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-10-03 03:41:27 +08:00
parent 3f805534fb
commit faf9af91e8
3 changed files with 101 additions and 32 deletions
+49 -11
View File
@@ -330,14 +330,9 @@ button, .btn {
.overview-summary { .overview-summary {
display: grid; display: grid;
gap: 12px; gap: 10px;
margin: 0 0 14px; margin: 0 0 14px;
} }
.overview-kpi-split {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.overview-kpi-block { .overview-kpi-block {
padding: 12px 14px; padding: 12px 14px;
border-radius: var(--radius); border-radius: var(--radius);
@@ -346,12 +341,9 @@ button, .btn {
box-shadow: var(--shadow); box-shadow: var(--shadow);
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
} }
.overview-kpi-block--sim { .overview-kpi-block--main {
border-color: rgba(56, 189, 248, 0.28); border-color: rgba(56, 189, 248, 0.28);
} }
.overview-kpi-block--live {
border-color: rgba(52, 211, 153, 0.28);
}
.overview-kpi-head { .overview-kpi-head {
display: flex; display: flex;
align-items: baseline; align-items: baseline;
@@ -388,11 +380,57 @@ button, .btn {
} }
.overview-kpi-value.status-on { color: var(--ok); } .overview-kpi-value.status-on { color: var(--ok); }
.overview-kpi-value.status-off { color: var(--bad); } .overview-kpi-value.status-off { color: var(--bad); }
.overview-mode-wrap {
overflow-x: auto;
border-radius: var(--radius);
border: 1px solid var(--line);
background: var(--panel);
box-shadow: var(--shadow);
}
.overview-mode-table {
width: 100%;
border-collapse: collapse;
font-size: 0.88rem;
}
.overview-mode-table th,
.overview-mode-table td {
padding: 10px 12px;
text-align: center;
border-bottom: 1px solid rgba(56, 189, 248, 0.1);
font-variant-numeric: tabular-nums;
}
.overview-mode-table tr:last-child td { border-bottom: 0; }
.overview-mode-table th {
color: var(--muted);
font-weight: 600;
font-size: 0.78rem;
background: rgba(5, 12, 22, 0.45);
}
.overview-mode-table td:first-child,
.overview-mode-table th:first-child {
text-align: left;
white-space: nowrap;
}
.overview-mode-tag {
display: inline-block;
padding: 2px 8px;
border-radius: 999px;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.03em;
}
.overview-mode-tag--sim {
color: #7dd3fc;
background: rgba(56, 189, 248, 0.14);
}
.overview-mode-tag--live {
color: #6ee7b7;
background: rgba(52, 211, 153, 0.14);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.overview-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .overview-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
} }
@media (max-width: 800px) { @media (max-width: 800px) {
.overview-kpi-split { grid-template-columns: 1fr; }
.overview-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .overview-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
} }
.pos-brief { .pos-brief {
+51 -20
View File
@@ -427,31 +427,62 @@
return; return;
} }
const s = summarizeOverview(list); const s = summarizeOverview(list);
function modeRow(label, tag, bucket) {
return (
"<tr>" +
'<td><span class="overview-mode-tag overview-mode-tag--' +
tag +
'">' +
escapeHtml(label) +
"</span> <span class=\"muted\">" +
bucket.machines +
" 台</span></td>" +
'<td class="status-on">' +
bucket.online +
"</td>" +
'<td class="' +
(bucket.offline > 0 ? "status-off" : "") +
'">' +
bucket.offline +
"</td>" +
"<td>" +
escapeHtml(
bucket.positions > 0
? bucket.positions +
" 笔" +
(bucket.sheets > 0 ? " / " + Math.round(bucket.sheets) + " 张" : "")
: "0"
) +
"</td>" +
'<td class="' +
(bucket.hasPnl ? pnlClass(bucket.pnl) : "") +
'">' +
escapeHtml(bucket.hasPnl ? fmtPnl(bucket.pnl) : "—") +
"</td>" +
"<td>" +
escapeHtml(fmtMoneyPlain(bucket.premium, bucket.hasPremium)) +
"</td>" +
"<td>" +
escapeHtml(fmtMoneyPlain(bucket.cash, bucket.hasCash)) +
"</td>" +
"</tr>"
);
}
box.hidden = false; box.hidden = false;
box.innerHTML = box.innerHTML =
'<div class="overview-kpi-block">' + '<div class="overview-kpi-block overview-kpi-block--main">' +
'<div class="overview-kpi-head"><strong>全部</strong><span class="muted">' + '<div class="overview-kpi-head"><strong>实时汇总</strong><span class="muted">仅统计在线机资金与仓位</span></div>' +
s.all.machines +
" 台</span></div>" +
'<div class="overview-kpi-grid">' + '<div class="overview-kpi-grid">' +
renderAggCards(s.all) + renderAggCards(s.all) +
"</div></div>" + "</div></div>" +
'<div class="overview-kpi-split">' + '<div class="overview-mode-wrap">' +
'<div class="overview-kpi-block overview-kpi-block--sim">' + '<table class="overview-mode-table">' +
'<div class="overview-kpi-head"><strong>模拟 sim</strong><span class="muted">' + "<thead><tr>" +
s.sim.machines + "<th>模式</th><th>在线</th><th>离线</th><th>仓位</th><th>浮盈</th><th>权利金</th><th>余额</th>" +
" 台</span></div>" + "</tr></thead><tbody>" +
'<div class="overview-kpi-grid">' + modeRow("模拟", "sim", s.sim) +
renderAggCards(s.sim) + modeRow("实盘", "live", s.live) +
"</div></div>" + "</tbody></table></div>";
'<div class="overview-kpi-block overview-kpi-block--live">' +
'<div class="overview-kpi-head"><strong>实盘 live</strong><span class="muted">' +
s.live.machines +
" 台</span></div>" +
'<div class="overview-kpi-grid">' +
renderAggCards(s.live) +
"</div></div>" +
"</div>";
} }
async function refresh() { async function refresh() {
+1 -1
View File
@@ -14,6 +14,6 @@
<div id="overview-grid"></div> <div id="overview-grid"></div>
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
<script src="{{ url_for('static', filename='hub.js') }}?v=4"></script> <script src="{{ url_for('static', filename='hub.js') }}?v=5"></script>
<script>HubOverview.boot();</script> <script>HubOverview.boot();</script>
{% endblock %} {% endblock %}