From faf9af91e84ad69796e4c49a940716f2ce1b0d00 Mon Sep 17 00:00:00 2001
From: dekun <dekun@local>
Date: Sat, 3 Oct 2026 03:41:27 +0800
Subject: [PATCH] =?UTF-8?q?=E6=80=BB=E8=A7=88=E6=B1=87=E6=80=BB=E6=94=B9?=
 =?UTF-8?q?=E4=B8=BA=E5=8D=95=E8=A1=8C=20KPI=20+=20sim/live=20=E5=AF=B9?=
 =?UTF-8?q?=E6=AF=94=E8=A1=A8=EF=BC=8C=E5=8E=BB=E6=8E=89=E9=87=8D=E5=A4=8D?=
 =?UTF-8?q?=E5=8D=A1=E7=89=87=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 static/hub.css           | 60 ++++++++++++++++++++++++++-------
 static/hub.js            | 71 +++++++++++++++++++++++++++++-----------
 templates/dashboard.html |  2 +-
 3 files changed, 101 insertions(+), 32 deletions(-)

diff --git a/static/hub.css b/static/hub.css
index dac44d5..d000ee5 100644
--- a/static/hub.css
+++ b/static/hub.css
@@ -330,14 +330,9 @@ button, .btn {
 
 .overview-summary {
   display: grid;
-  gap: 12px;
+  gap: 10px;
   margin: 0 0 14px;
 }
-.overview-kpi-split {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 12px;
-}
 .overview-kpi-block {
   padding: 12px 14px;
   border-radius: var(--radius);
@@ -346,12 +341,9 @@ button, .btn {
   box-shadow: var(--shadow);
   backdrop-filter: blur(10px);
 }
-.overview-kpi-block--sim {
+.overview-kpi-block--main {
   border-color: rgba(56, 189, 248, 0.28);
 }
-.overview-kpi-block--live {
-  border-color: rgba(52, 211, 153, 0.28);
-}
 .overview-kpi-head {
   display: flex;
   align-items: baseline;
@@ -388,11 +380,57 @@ button, .btn {
 }
 .overview-kpi-value.status-on { color: var(--ok); }
 .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) {
   .overview-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
 }
 @media (max-width: 800px) {
-  .overview-kpi-split { grid-template-columns: 1fr; }
   .overview-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 }
 .pos-brief {
diff --git a/static/hub.js b/static/hub.js
index 8eb1bd4..30a4aa7 100644
--- a/static/hub.js
+++ b/static/hub.js
@@ -427,31 +427,62 @@
       return;
     }
     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.innerHTML =
-      '<div class="overview-kpi-block">' +
-      '<div class="overview-kpi-head"><strong>全部</strong><span class="muted">' +
-      s.all.machines +
-      " 台</span></div>" +
+      '<div class="overview-kpi-block overview-kpi-block--main">' +
+      '<div class="overview-kpi-head"><strong>实时汇总</strong><span class="muted">仅统计在线机资金与仓位</span></div>' +
       '<div class="overview-kpi-grid">' +
       renderAggCards(s.all) +
       "</div></div>" +
-      '<div class="overview-kpi-split">' +
-      '<div class="overview-kpi-block overview-kpi-block--sim">' +
-      '<div class="overview-kpi-head"><strong>模拟 sim</strong><span class="muted">' +
-      s.sim.machines +
-      " 台</span></div>" +
-      '<div class="overview-kpi-grid">' +
-      renderAggCards(s.sim) +
-      "</div></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>";
+      '<div class="overview-mode-wrap">' +
+      '<table class="overview-mode-table">' +
+      "<thead><tr>" +
+      "<th>模式</th><th>在线</th><th>离线</th><th>仓位</th><th>浮盈</th><th>权利金</th><th>余额</th>" +
+      "</tr></thead><tbody>" +
+      modeRow("模拟", "sim", s.sim) +
+      modeRow("实盘", "live", s.live) +
+      "</tbody></table></div>";
   }
 
   async function refresh() {
diff --git a/templates/dashboard.html b/templates/dashboard.html
index 93951bd..0d24f82 100644
--- a/templates/dashboard.html
+++ b/templates/dashboard.html
@@ -14,6 +14,6 @@
 <div id="overview-grid"></div>
 {% endblock %}
 {% 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>
 {% endblock %}