Add OKX options expiry and close breakeven to hub monitor and dashboard.

Expose bePx-based expiry balance and mark-to-close breakeven on positions so monitor and dashboard can show both labels per contract.

Co-authored-by: Cursor <cursoragent@cursor.com>

manual_trading_hub/static/dashboard.js

@@ -118,9 +118,50 @@
     return chips;
   }
 
+  function renderDashboardOptionsTable(positions) {
+    const pos = Array.isArray(positions) ? positions : [];
+    if (!pos.length) return "";
+    const rows = pos
+      .map((p) => {
+        const optType =
+          (p.opt_type || "").toUpperCase() === "C"
+            ? "Call"
+            : (p.opt_type || "").toUpperCase() === "P"
+              ? "Put"
+              : p.opt_type || "—";
+        return `<tr>
+          <td title="${esc(p.inst_id || "")}">${esc(shortDashInst(p.inst_id))}</td>
+          <td>${esc(optType)}</td>
+          <td>${p.idx_px != null ? fmt(p.idx_px, 0) : "—"}</td>
+          <td>${p.expiry_be_px != null ? fmt(p.expiry_be_px, 0) : "—"}</td>
+          <td>${p.close_be_px != null ? fmt(p.close_be_px, 0) : "—"}</td>
+          <td class="${pnlClass(p.upl)}">${p.upl != null ? pnlSigned(p.upl, 2) : "—"}</td>
+        </tr>`;
+      })
+      .join("");
+    return `<div class="dash-options-block">
+      <div class="dash-ac-section-label">期权持仓</div>
+      <div class="dash-table-wrap dash-options-table-wrap">
+        <table class="dash-table dash-options-table">
+          <thead><tr>
+            <th>合约</th><th>类型</th><th>指数</th><th>到期平衡</th><th>平掉回本</th><th>浮盈</th>
+          </tr></thead>
+          <tbody>${rows}</tbody>
+        </table>
+      </div>
+    </div>`;
+  }
+
+  function shortDashInst(instId) {
+    const s = String(instId || "");
+    if (s.length <= 18) return s;
+    return s.slice(0, 8) + "…" + s.slice(-6);
+  }
+
   function renderAccountDetail(ac) {
     const counts = (ac && ac.monitor_counts) || {};
     const positions = Array.isArray(ac && ac.position_lines) ? ac.position_lines : [];
+    const optionsPositions = Array.isArray(ac && ac.options_positions) ? ac.options_positions : [];
     const issues = Array.isArray(ac && ac.issues) ? ac.issues : [];
     const exId = ac && ac.id != null ? String(ac.id) : "";
     const chips = renderMonitorCountChips(counts);
@@ -134,8 +175,11 @@
         ? `<div class="dash-ac-monitor-row">${chips.join("")}${expandBtn}</div>`
         : "";
     let posHtml = "";
-    if (positions.length) {
-      posHtml = positions
+    const perpLines = ac && ac.options_layout
+      ? positions.filter((ln) => (ln && ln.kind) !== "options")
+      : positions;
+    if (perpLines.length) {
+      posHtml = perpLines
         .map((ln) => {
           const text = esc((ln && ln.text) || "");
           if (ln.pnl != null && Number.isFinite(Number(ln.pnl))) {
@@ -149,13 +193,14 @@
           return `<div class="dash-ac-remark-line dash-ac-remark-pos">${text}</div>`;
         })
         .join("");
-    } else if (!chips.length && !issues.length) {
+    } else if (!chips.length && !issues.length && !(ac && ac.options_layout && optionsPositions.length)) {
       posHtml = `<div class="dash-ac-remark-line dash-ac-remark-empty">无持仓</div>`;
     }
     const issueHtml = issues
       .map((text) => `<div class="dash-ac-remark-line dash-ac-remark-issue">${esc(text)}</div>`)
       .join("");
-    return `<div class="dash-ac-remark">${monitorRow}<div class="dash-ac-positions">${posHtml}</div>${issueHtml}</div>`;
+    const optionsHtml = ac && ac.options_layout ? renderDashboardOptionsTable(optionsPositions) : "";
+    return `<div class="dash-ac-remark">${monitorRow}<div class="dash-ac-positions">${posHtml}</div>${optionsHtml}${issueHtml}</div>`;
   }
 
   function bindDashboardExpand() {