Lay out plan as strategy left and stacked position cards right.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-25 09:39:04 +08:00
parent 8a148f8c2b
commit 12a6365fc9
2 changed files with 128 additions and 94 deletions
@@ -171,82 +171,86 @@ export default function PlanPage() {
        {busy ? <span className="meta">{busy}…</span> : null}
      </div>

-      <div className="card plan-summary" style={{ marginBottom: 12 }}>
-        <div className="plan-metrics">
-        <div className="kv">
-          <span>策略</span>
-          <span>
-            {plan?.running ? (
-              <span className="status-running">启动中</span>
-            ) : (
-              <span className="status-stopped">已停</span>
-            )}
-            <span className="mono">
-              {" "}
-              · {phaseLabel} · 已完成 {plan?.rounds_done ?? 0} 组
-            </span>
-          </span>
-        </div>
-        <div className="kv">
-          <span>选约条件</span>
-          <span className="mono">
-            剩余≥{fmt(plan?.min_option_hours, 0)}h · 期权杠杆≥{fmt(plan?.min_option_leverage, 0)}x
-          </span>
-        </div>
-        <div className="kv">
-          <span>休息</span>
-          <span className="mono">
-            {plan?.rest_left_sec ? `${plan.rest_left_sec}s / ${plan.rest_seconds}s` : "—"}
-          </span>
-        </div>
-        <div className="kv">
-          <span>权益 / 杠杆</span>
-          <span className="mono">
-            {fmt(plan?.ledger?.equity)} / 可用 {fmt(plan?.ledger?.available)} ·{" "}
-            {fmt(plan?.leverage, 0)}x
-          </span>
-        </div>
-        <div className="kv">
-          <span>当前组</span>
-          <span className="mono">{pos?.group_id || "—"}</span>
-        </div>
-        <div className="kv">
-          <span>信号方向</span>
-          <span className="mono">{biasTag}</span>
-        </div>
-        <div className="kv">
-          <span>出场规则</span>
-          <span className="mono">{exitRuleLabel}</span>
-        </div>
-        <div className="kv">
-          <span>净盈利 / 目标</span>
-          <span className="mono">
-            <span className={pnlClass(open ? netPnl : null)}>
-              {open ? fmt(netPnl) : "—"}
-            </span>
-            {" / "}
-            {open || exitMode === "fixed_usdt" ? fmt(exitTarget) : "—"}
-          </span>
-        </div>
-        <div className="kv">
-          <span>永续浮盈</span>
-          <span className={`mono ${pnlClass(pos?.perp_upl)}`}>{fmt(pos?.perp_upl)}</span>
-        </div>
-        <div className="kv">
-          <span>期权浮盈</span>
-          <span className={`mono ${pnlClass(pos?.option_upl)}`}>{fmt(pos?.option_upl)}</span>
-        </div>
-        {plan?.last_error ? (
-          <div className="kv kv-span">
-            <span>最近错误</span>
-            <span className="err" style={{ margin: 0 }}>
-              {plan.last_error}
-            </span>
+      <div className="plan-board">
+        <div className="card plan-strategy">
+          <h3 className="plan-panel-title">策略</h3>
+          <div className="plan-metrics">
+            <div className="kv">
+              <span>状态</span>
+              <span>
+                {plan?.running ? (
+                  <span className="status-running">启动中</span>
+                ) : (
+                  <span className="status-stopped">已停</span>
+                )}
+                <span className="mono">
+                  {" "}
+                  · {phaseLabel} · 已完成 {plan?.rounds_done ?? 0} 组
+                </span>
+              </span>
+            </div>
+            <div className="kv">
+              <span>选约条件</span>
+              <span className="mono">
+                剩余≥{fmt(plan?.min_option_hours, 0)}h · 期权杠杆≥
+                {fmt(plan?.min_option_leverage, 0)}x
+              </span>
+            </div>
+            <div className="kv">
+              <span>休息</span>
+              <span className="mono">
+                {plan?.rest_left_sec ? `${plan.rest_left_sec}s / ${plan.rest_seconds}s` : "—"}
+              </span>
+            </div>
+            <div className="kv">
+              <span>权益 / 杠杆</span>
+              <span className="mono">
+                {fmt(plan?.ledger?.equity)} / 可用 {fmt(plan?.ledger?.available)} ·{" "}
+                {fmt(plan?.leverage, 0)}x
+              </span>
+            </div>
+            <div className="kv">
+              <span>当前组</span>
+              <span className="mono">{pos?.group_id || "—"}</span>
+            </div>
+            <div className="kv">
+              <span>信号方向</span>
+              <span className="mono">{biasTag}</span>
+            </div>
+            <div className="kv">
+              <span>出场规则</span>
+              <span className="mono">{exitRuleLabel}</span>
+            </div>
+            <div className="kv">
+              <span>净盈利 / 目标</span>
+              <span className="mono">
+                <span className={pnlClass(open ? netPnl : null)}>
+                  {open ? fmt(netPnl) : "—"}
+                </span>
+                {" / "}
+                {open || exitMode === "fixed_usdt" ? fmt(exitTarget) : "—"}
+              </span>
+            </div>
+            <div className="kv">
+              <span>永续浮盈</span>
+              <span className={`mono ${pnlClass(pos?.perp_upl)}`}>{fmt(pos?.perp_upl)}</span>
+            </div>
+            <div className="kv">
+              <span>期权浮盈</span>
+              <span className={`mono ${pnlClass(pos?.option_upl)}`}>{fmt(pos?.option_upl)}</span>
+            </div>
+            {plan?.last_error ? (
+              <div className="kv">
+                <span>最近错误</span>
+                <span className="err" style={{ margin: 0 }}>
+                  {plan.last_error}
+                </span>
+              </div>
+            ) : null}
          </div>
-        ) : null}
        </div>

-        <div className="pos-embed-grid">
+        <div className="plan-positions">
          {open ? (
            <>
              <div className="pos-card">