crypto_okx_hub/static/hub.js

(function (global) {
  function fmtPnl(v) {
    if (v == null || v === "") return "—";
    const n = Number(v);
    if (!Number.isFinite(n)) return "—";
    return (n > 0 ? "+" : "") + n.toFixed(2) + " U";
  }

  function pnlClass(v) {
    const n = Number(v);
    if (!Number.isFinite(n) || n === 0) return "pnl-flat";
    return n > 0 ? "pnl-up" : "pnl-down";
  }

  function fmtPnlHtml(v) {
    return '<span class="' + pnlClass(v) + '">' + escapeHtml(fmtPnl(v)) + "</span>";
  }

  function escapeHtml(s) {
    return String(s)
      .replace(/&/g, "&amp;")
      .replace(/</g, "&lt;")
      .replace(/>/g, "&gt;")
      .replace(/"/g, "&quot;");
  }

  function positionSummary(brief) {
    const list = brief || [];
    if (!list.length) return '<span class="muted">暂无持仓</span>';
    const items = list.slice(0, 8).map(function (p) {
      const id = escapeHtml(p.inst_id || "");
      const sheets = escapeHtml(String(p.sheets != null ? p.sheets : "—"));
      return "<li>" + id + " · " + sheets + "张 · " + fmtPnlHtml(p.pnl_usdt) + "</li>";
    });
    const more =
      list.length > 8
        ? '<li class="muted">…共 ' + list.length + " 笔</li>"
        : "";
    return "<ul class=\"pos-brief\">" + items.join("") + more + "</ul>";
  }

  function renderRow(row) {
    const snap = row.snapshot || {};
    const inst = snap.instance || {};
    const pnl =
      snap.pnl && snap.pnl.unrealized_usdt != null
        ? snap.pnl.unrealized_usdt
        : snap.upl_total_usdc;
    const brief = snap.positions_brief || snap.positions || [];
    const online = !!row.online;
    const status = online
      ? '<span class="status-on">在线</span>'
      : '<span class="status-off">离线</span>';
    const err = row.error
      ? '<div class="muted">错误: ' + escapeHtml(row.error) + "</div>"
      : "";
    return (
      "<tr>" +
      "<td><strong>" +
      escapeHtml(row.name || "") +
      "</strong>" +
      err +
      "</td>" +
      "<td>" +
      status +
      "</td>" +
      "<td>" +
      escapeHtml(inst.mode || "—") +
      "</td>" +
      "<td>" +
      fmtPnlHtml(pnl) +
      "</td>" +
      "<td>" +
      positionSummary(brief) +
      "</td>" +
      '<td class="muted">' +
      escapeHtml(row.pulled_at || "—") +
      "</td>" +
      '<td><div class="overview-actions">' +
      '<a class="btn" href="/desk?id=' +
      encodeURIComponent(row.id) +
      '">内嵌打开</a>' +
      '<button type="button" class="btn" data-open-tab="' +
      encodeURIComponent(row.id) +
      '">新标签</button>' +
      "</div></td>" +
      "</tr>"
    );
  }

  async function refresh() {
    const status = document.getElementById("overview-status");
    const grid = document.getElementById("overview-grid");
    if (!grid) return;
    if (status) status.textContent = "刷新中…";
    try {
      const r = await fetch("/api/overview");
      const d = await r.json();
      if (!d.ok) throw new Error(d.msg || "失败");
      const list = d.instances || [];
      if (!list.length) {
        grid.innerHTML =
          '<p class="muted">暂无启用实例,请先到「实例」添加.</p>';
      } else {
        grid.innerHTML =
          '<div class="overview-table-wrap"><table class="overview-table">' +
          "<thead><tr>" +
          "<th>名称</th><th>状态</th><th>模式</th><th>浮盈</th><th>持仓</th><th>拉取时间</th><th>操作</th>" +
          "</tr></thead><tbody>" +
          list.map(renderRow).join("") +
          "</tbody></table></div>";
        grid.querySelectorAll("[data-open-tab]").forEach(function (btn) {
          btn.addEventListener("click", async function () {
            const id = btn.getAttribute("data-open-tab");
            const rr = await fetch("/api/instances/" + id + "/open_url");
            const dd = await rr.json();
            if (dd.ok && dd.url) window.open(dd.url, "_blank", "noopener");
            else alert(dd.msg || "无法打开");
          });
        });
      }
      if (status) status.textContent = "已更新 · 共 " + list.length + " 台";
    } catch (e) {
      if (status) status.textContent = e.message || "加载失败";
    }
  }

  function boot() {
    const btn = document.getElementById("btn-refresh");
    if (btn) btn.addEventListener("click", refresh);
    refresh();
    setInterval(refresh, 10000);
  }

  global.HubOverview = { boot: boot, refresh: refresh };
})(window);