中控增加条件单

2026-05-24 07:35:48 +08:00
parent 19ac702e5a
commit a3218f4fbd
7 changed files with 685 additions and 21 deletions
@@ -136,11 +136,124 @@
        btn.onclick = () =>
          closeOnePosition(btn.dataset.exId, btn.dataset.symbol, btn.dataset.side);
      });
+      box.querySelectorAll(".btn-cancel-order").forEach((btn) => {
+        btn.onclick = () =>
+          cancelOneOrder(
+            btn.dataset.exId,
+            btn.dataset.symbol,
+            btn.dataset.orderId,
+            btn.dataset.channel
+          );
+      });
+      box.querySelectorAll(".btn-cancel-cond-all").forEach((btn) => {
+        btn.onclick = () =>
+          cancelSymbolOrders(btn.dataset.exId, btn.dataset.symbol, "conditional");
+      });
    } catch (e) {
      box.innerHTML = `<div class="err">${esc(e)}</div>`;
    }
  }

+  function renderOrderRows(exchangeId, symbol, orders, kind) {
+    if (!orders || !orders.length) {
+      const hint =
+        kind === "conditional"
+          ? "暂无条件单（止盈/止损等）"
+          : "暂无普通委托";
+      return `<div class="order-empty">${hint}</div>`;
+    }
+    const symAttr = esc(symbol || "").replace(/"/g, "&quot;");
+    const rows = orders
+      .map((o) => {
+        const oidAttr = esc(o.id || "").replace(/"/g, "&quot;");
+        const chAttr = esc(o.channel || "regular").replace(/"/g, "&quot;");
+        const trig =
+          o.trigger_price != null ? fmt(o.trigger_price, 4) : o.price != null ? fmt(o.price, 4) : "—";
+        return `<tr>
+          <td>${esc(o.label || o.type || "委托")}</td>
+          <td>${fmt(o.amount, 4)}</td>
+          <td>${trig}</td>
+          <td class="td-actions"><button type="button" class="btn-cancel-order ghost" data-ex-id="${esc(exchangeId)}" data-symbol="${symAttr}" data-order-id="${oidAttr}" data-channel="${chAttr}">撤单</button></td>
+        </tr>`;
+      })
+      .join("");
+    return `<table class="data-table data-table-sub"><thead><tr><th>类型</th><th>数量</th><th>触发/价格</th><th>操作</th></tr></thead><tbody>${rows}</tbody></table>`;
+  }
+
+  function renderPositionBlock(exchangeId, x) {
+    const symAttr = esc(x.symbol || "").replace(/"/g, "&quot;");
+    const sideAttr = esc((x.side || "").toLowerCase()).replace(/"/g, "&quot;");
+    const cond = Array.isArray(x.conditional_orders) ? x.conditional_orders : [];
+    const reg = Array.isArray(x.regular_orders) ? x.regular_orders : [];
+    const condAllBtn =
+      cond.length > 0
+        ? `<button type="button" class="btn-cancel-cond-all ghost" data-ex-id="${esc(exchangeId)}" data-symbol="${symAttr}">撤销全部条件单</button>`
+        : "";
+    return `<div class="pos-block">
+      <table class="data-table"><thead><tr><th>合约</th><th>方向</th><th>张数</th><th>浮盈</th><th>操作</th></tr></thead><tbody>
+        <tr>
+          <td>${esc(x.symbol)}</td>
+          <td>${esc(x.side)}</td>
+          <td>${fmt(x.contracts, 4)}</td>
+          <td class="${pnlCls(x.unrealized_pnl)}">${fmt(x.unrealized_pnl, 4)}</td>
+          <td class="td-actions"><button type="button" class="btn-close-pos danger" data-ex-id="${esc(exchangeId)}" data-symbol="${symAttr}" data-side="${sideAttr}">平仓</button></td>
+        </tr>
+      </tbody></table>
+      <div class="pos-orders">
+        <div class="pos-orders-head">
+          <span class="pos-orders-title">条件单 · ${cond.length}</span>
+          ${condAllBtn}
+        </div>
+        ${renderOrderRows(exchangeId, x.symbol, cond, "conditional")}
+        <div class="pos-orders-head" style="margin-top:10px">
+          <span class="pos-orders-title">普通委托 · ${reg.length}</span>
+        </div>
+        ${renderOrderRows(exchangeId, x.symbol, reg, "limit")}
+      </div>
+    </div>`;
+  }
+
+  async function cancelOneOrder(exchangeId, symbol, orderId, channel) {
+    if (!confirm(`撤销委托 ${symbol} #${orderId}？`)) return;
+    try {
+      const r = await apiFetch("/api/orders/" + encodeURIComponent(exchangeId) + "/cancel", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ symbol, order_id: orderId, channel: channel || "regular" }),
+      });
+      const j = await r.json();
+      const pl = j.payload || {};
+      const ok = j.ok && pl.ok !== false;
+      showToast(ok ? "已撤单" : pl.error || JSON.stringify(j), !ok);
+      loadMonitorBoard();
+    } catch (e) {
+      showToast(String(e), true);
+    }
+  }
+
+  async function cancelSymbolOrders(exchangeId, symbol, scope) {
+    const label = scope === "conditional" ? "全部条件单" : "全部委托";
+    if (!confirm(`确认撤销 ${symbol} 的${label}？`)) return;
+    try {
+      const r = await apiFetch(
+        "/api/orders/" + encodeURIComponent(exchangeId) + "/cancel-symbol",
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ symbol, scope }),
+        }
+      );
+      const j = await r.json();
+      const pl = j.payload || {};
+      const ok = j.ok && pl.ok !== false;
+      const n = pl.cancelled_count != null ? pl.cancelled_count : "?";
+      showToast(ok ? `已撤销 ${n} 笔` : pl.error || JSON.stringify(j), !ok);
+      loadMonitorBoard();
+    } catch (e) {
+      showToast(String(e), true);
+    }
+  }
+
  function renderMonitorCard(row) {
    const ag = row.agent || {};
    const pos = Array.isArray(ag.positions) ? ag.positions : [];
@@ -168,20 +281,7 @@
      </div>`;
      inner += `<div class="section-title">交易所持仓</div>`;
      if (pos.length) {
-        const posRows = pos
-          .map((x) => {
-            const symAttr = esc(x.symbol || "").replace(/"/g, "&quot;");
-            const sideAttr = esc((x.side || "").toLowerCase()).replace(/"/g, "&quot;");
-            return `<tr>
-              <td>${esc(x.symbol)}</td>
-              <td>${esc(x.side)}</td>
-              <td>${fmt(x.contracts, 4)}</td>
-              <td class="${pnlCls(x.unrealized_pnl)}">${fmt(x.unrealized_pnl, 4)}</td>
-              <td class="td-actions"><button type="button" class="btn-close-pos danger" data-ex-id="${esc(row.id)}" data-symbol="${symAttr}" data-side="${sideAttr}">平仓</button></td>
-            </tr>`;
-          })
-          .join("");
-        inner += `<table class="data-table"><thead><tr><th>合约</th><th>方向</th><th>张数</th><th>浮盈</th><th>操作</th></tr></thead><tbody>${posRows}</tbody></table>`;
+        inner += pos.map((x) => renderPositionBlock(row.id, x)).join("");
      } else {
        inner += `<div class="empty-hint">无持仓</div>`;
      }