/**
 * 实例数据看板:拉 /api/instance/dashboard 渲染只读表格.
 * 各区块无数据时不展示;有数据按表格展示.
 */
(function (global) {
  const SECTION_ORDER = ["orders", "keys", "strategy", "options", "hedge_plan"];
  let loading = false;
  let localDashVersion = 0;
  let dashEventSource = null;
  let dashReconnectTimer = null;
  let booted = false;

  function root() {
    const active = document.querySelector('.embed-tab-pane.is-active-pane [data-inst-dashboard="1"]');
    if (active) return active;
    return document.getElementById("instance-dashboard");
  }

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

  function fmtNum(v) {
    if (v == null || v === "") return "—";
    const n = Number(v);
    if (!Number.isFinite(n)) return escapeHtml(v);
    return String(n);
  }

  function fmtPnl(v) {
    if (v == null || v === "") return "—";
    const n = Number(v);
    if (!Number.isFinite(n)) return "—";
    const cls = n > 0 ? "pos-pnl-profit" : n < 0 ? "pos-pnl-loss" : "";
    const sign = n > 0 ? "+" : "";
    return '<span class="' + cls + '">' + sign + n.toFixed(2) + "U</span>";
  }

  function fmtPnlPlain(v) {
    if (v == null || v === "") return "—";
    const n = Number(v);
    if (!Number.isFinite(n)) return "—";
    const cls = n > 0 ? "pos-pnl-profit" : n < 0 ? "pos-pnl-loss" : "";
    return '<span class="' + cls + '">' + n.toFixed(2) + "</span>";
  }

  function dirCell(it) {
    const d = String(it.direction || "").toLowerCase();
    const label = it.direction_label || (d === "short" ? "做空" : d === "long" ? "做多" : "-");
    const cls = d === "short" ? "inst-dash-dir-short" : d === "long" ? "inst-dash-dir-long" : "";
    return '<td class="' + cls + '">' + escapeHtml(label) + "</td>";
  }

  function fmtExpiry(ms) {
    const n = Number(ms);
    if (!Number.isFinite(n) || n <= 0) return "—";
    let fallback = "—";
    try {
      const d = new Date(n);
      if (!Number.isNaN(d.getTime())) {
        const pad = function (x) {
          return String(x).padStart(2, "0");
        };
        fallback =
          d.getFullYear() +
          "-" +
          pad(d.getMonth() + 1) +
          "-" +
          pad(d.getDate()) +
          " " +
          pad(d.getHours()) +
          ":" +
          pad(d.getMinutes());
      }
    } catch (_) {}
    return (
      '<span class="opt-expiry-cd" data-opt-exp-ms="' +
      escapeHtml(String(Math.floor(n))) +
      '">' +
      escapeHtml(fallback) +
      "</span>"
    );
  }

  function goTab(tab) {
    if (!tab) return;
    if (global.InstanceEmbed && typeof global.InstanceEmbed.loadTab === "function") {
      global.InstanceEmbed.loadTab(tab);
      return;
    }
    const pathMap = {
      trade: "/trade",
      key_monitor: "/key_monitor",
      strategy: "/strategy",
      options: "/options",
      hedge_plan: "/hedge-plan",
    };
    const path = pathMap[tab] || "/" + tab;
    location.href = path;
  }

  function tableWrap(headers, rowsHtml) {
    return (
      '<div class="inst-dash-table-wrap">' +
      '<table class="inst-dash-table">' +
      "<thead><tr>" +
      headers
        .map(function (h) {
          return "<th>" + escapeHtml(h) + "</th>";
        })
        .join("") +
      "</tr></thead>" +
      "<tbody>" +
      rowsHtml +
      "</tbody></table></div>"
    );
  }

  function rowClickAttrs(tab) {
    return ' class="inst-dash-row" data-dash-tab="' + escapeHtml(tab || "") + '" role="link" tabindex="0"';
  }

  function renderOrdersTable(items) {
    const rows = items
      .map(function (it) {
        const sym = it.symbol || "-";
        const mark =
          it.mark_display != null && it.mark_display !== ""
            ? escapeHtml(it.mark_display)
            : fmtNum(it.mark_price);
        const tpProfit =
          it.tp_profit != null && Number.isFinite(Number(it.tp_profit))
            ? '<span class="pos-tp-profit">' + Number(it.tp_profit).toFixed(2) + "U</span>"
            : "—";
        return (
          "<tr" +
          rowClickAttrs(it.tab || "trade") +
          ">" +
          '<td class="td-symbol"><span class="inst-dash-sym-link">' +
          escapeHtml(sym) +
          "</span></td>" +
          dirCell(it) +
          "<td>" +
          fmtNum(it.entry) +
          "</td>" +
          "<td>" +
          mark +
          "</td>" +
          "<td>" +
          fmtNum(it.contracts) +
          "</td>" +
          "<td>" +
          tpProfit +
          "</td>" +
          "<td>" +
          fmtPnlPlain(it.float_pnl) +
          "</td>" +
          "<td>—</td>" +
          "</tr>"
        );
      })
      .join("");
    return tableWrap(
      ["合约", "方向", "开仓价", "标记价", "张数", "盈利金额", "浮盈", "操作"],
      rows
    );
  }

  function renderKeysTable(items) {
    const rows = items
      .map(function (it) {
        return (
          "<tr" +
          rowClickAttrs(it.tab || "key_monitor") +
          ">" +
          "<td>" +
          escapeHtml(it.symbol || "-") +
          "</td>" +
          dirCell(it) +
          "<td>" +
          escapeHtml(it.subtitle || "—") +
          "</td>" +
          "<td>" +
          fmtNum(it.upper) +
          "</td>" +
          "<td>" +
          fmtNum(it.lower) +
          "</td>" +
          "</tr>"
        );
      })
      .join("");
    return tableWrap(["合约", "方向", "信号", "上沿", "下沿"], rows);
  }

  function renderStrategyTable(items) {
    const rows = items
      .map(function (it) {
        const kindLabel = it.kind === "roll" ? "顺势加仓" : it.kind === "trend" ? "趋势回调" : "策略";
        return (
          "<tr" +
          rowClickAttrs(it.tab || "strategy") +
          ">" +
          "<td>" +
          escapeHtml(kindLabel) +
          "</td>" +
          "<td>" +
          escapeHtml(it.symbol || "-") +
          "</td>" +
          dirCell(it) +
          "<td>" +
          escapeHtml(it.status || "—") +
          "</td>" +
          "<td>" +
          fmtNum(it.entry) +
          "</td>" +
          "</tr>"
        );
      })
      .join("");
    return tableWrap(["类型", "合约", "方向", "状态", "入场"], rows);
  }

  function renderOptionsTable(items) {
    const rows = items
      .map(function (it) {
        const opt = it.opt_type_label ||
          (String(it.opt_type || "").toUpperCase() === "C"
            ? "Call"
            : String(it.opt_type || "").toUpperCase() === "P"
              ? "Put"
              : it.opt_type || "—");
        return (
          "<tr" +
          rowClickAttrs(it.tab || "options") +
          ">" +
          "<td>" +
          escapeHtml(it.inst_id || it.title || "-") +
          "</td>" +
          "<td>" +
          escapeHtml(it.source_label || "纯期权") +
          "</td>" +
          "<td>" +
          escapeHtml(opt) +
          "</td>" +
          "<td>" +
          fmtNum(it.pos) +
          "</td>" +
          "<td>" +
          fmtExpiry(it.exp_time_ms) +
          "</td>" +
          "<td>" +
          escapeHtml(it.target_monitor || "—") +
          "</td>" +
          "<td>" +
          fmtPnl(it.pnl) +
          "</td>" +
          "</tr>"
        );
      })
      .join("");
    return tableWrap(["合约", "来源", "类型", "张数", "到期时间", "目标监控", "净盈亏"], rows);
  }

  function renderHedgeTable(items) {
    const rows = items
      .map(function (it) {
        const stCls = it.status_active ? "inst-dash-status-active" : "";
        const stText = it.status_label || (it.status_active ? "进行中" : it.status || "—");
        return (
          "<tr" +
          rowClickAttrs(it.tab || "hedge_plan") +
          ">" +
          "<td>#" +
          escapeHtml(it.id != null ? it.id : "—") +
          "</td>" +
          "<td>" +
          escapeHtml(it.underlying || "-") +
          "</td>" +
          "<td>" +
          escapeHtml(it.plan_type_label || it.plan_type || "—") +
          "</td>" +
          '<td class="' +
          stCls +
          '">' +
          escapeHtml(stText) +
          "</td>" +
          "<td>" +
          escapeHtml(it.contracts_summary || it.subtitle || "—") +
          "</td>" +
          "</tr>"
        );
      })
      .join("");
    return tableWrap(["ID", "标的", "计划类型", "状态", "说明"], rows);
  }

  function renderTable(key, items) {
    if (key === "orders") return renderOrdersTable(items);
    if (key === "keys") return renderKeysTable(items);
    if (key === "strategy") return renderStrategyTable(items);
    if (key === "options") return renderOptionsTable(items);
    if (key === "hedge_plan") return renderHedgeTable(items);
    return "";
  }

  function sectionHasData(sec) {
    if (!sec) return false;
    const count = Number(sec.count);
    if (Number.isFinite(count) && count > 0) return true;
    return Array.isArray(sec.items) && sec.items.length > 0;
  }

  function renderSection(key, sec) {
    if (!sectionHasData(sec)) return "";
    const items = sec.items || [];
    const count = Number(sec.count) || items.length;
    return (
      '<section class="inst-dash-section" data-dash-section="' +
      escapeHtml(key) +
      '">' +
      '<div class="inst-dash-section-head">' +
      "<h3>" +
      escapeHtml(sec.title || key) +
      ' <span class="inst-dash-count">' +
      count +
      "</span></h3>" +
      '<button type="button" class="btn-sm inst-dash-goto" data-dash-tab="' +
      escapeHtml(sec.tab || "") +
      '">打开</button>' +
      "</div>" +
      renderTable(key, items) +
      "</section>"
    );
  }

  function bindClicks(el) {
    if (!el) return;
    el.querySelectorAll("[data-dash-tab]").forEach(function (node) {
      const handler = function () {
        goTab(node.getAttribute("data-dash-tab"));
      };
      node.addEventListener("click", handler);
      node.addEventListener("keydown", function (ev) {
        if (ev.key === "Enter" || ev.key === " ") {
          ev.preventDefault();
          handler();
        }
      });
    });
  }

  async function load(opts) {
    const el = root();
    if (!el) return;
    const status = el.querySelector("#inst-dash-status") || document.getElementById("inst-dash-status");
    const sections = el.querySelector("#inst-dash-sections") || document.getElementById("inst-dash-sections");
    const updated = el.querySelector("#inst-dash-updated") || document.getElementById("inst-dash-updated");
    const options = opts || {};
    if (loading && !options.force) return;
    loading = true;
    if (status && !options.silent) status.textContent = "同步中…";
    try {
      const dashRes = await fetch("/api/instance/dashboard", { credentials: "same-origin" });
      if (dashRes.status === 401) {
        location.href = "/login?next=" + encodeURIComponent(location.pathname);
        return;
      }
      const data = await dashRes.json().catch(function () {
        return {};
      });
      if (!dashRes.ok || !data.ok) {
        if (
          data.aggregating ||
          (data.msg && String(data.msg).indexOf("尚未就绪") >= 0)
        ) {
          if (status) status.textContent = "后台聚合中…";
          return;
        }
        throw new Error(data.msg || data.error || dashRes.statusText || "加载失败");
      }
      const ver = Number(data.dashboard_version) || 0;
      if (ver) localDashVersion = ver;
      if (data.orders && Array.isArray(data.orders.items)) {
        data.orders.count = data.orders.items.length;
      }
      if (updated) updated.textContent = "更新 " + (data.updated_at || "—");
      if (sections) {
        const html = SECTION_ORDER.map(function (k) {
          return renderSection(k, data[k]);
        }).join("");
        sections.innerHTML =
          html || '<p class="inst-dash-empty muted">当前无活跃监控与持仓</p>';
        bindClicks(sections);
        if (global.OptionsExpiryCountdown) {
          if (typeof global.OptionsExpiryCountdown.tick === "function") {
            global.OptionsExpiryCountdown.tick(sections);
          }
          if (typeof global.OptionsExpiryCountdown.ensureTimer === "function") {
            global.OptionsExpiryCountdown.ensureTimer();
          }
        }
      }
      const sec = Number(data.poll_interval_sec) || 5;
      if (status) {
        status.textContent = options.silent
          ? "SSE 已连接 · 后台每 " + sec + "s 聚合"
          : "已更新 · 后台每 " + sec + "s 聚合";
      }
    } catch (e) {
      if (status) status.textContent = e.message || "加载失败";
    } finally {
      loading = false;
    }
  }

  function closeDashboardStream() {
    if (dashEventSource) {
      dashEventSource.close();
      dashEventSource = null;
    }
    if (dashReconnectTimer) {
      clearTimeout(dashReconnectTimer);
      dashReconnectTimer = null;
    }
  }

  function connectDashboardStream() {
    const el = root();
    if (!el) return;
    closeDashboardStream();
    dashEventSource = new EventSource("/api/instance/dashboard/stream");
    dashEventSource.addEventListener("dashboard", function (ev) {
      try {
        const st = JSON.parse(ev.data || "{}");
        const ver = Number(st.dashboard_version) || 0;
        if (ver && ver !== localDashVersion) {
          load({ silent: true });
        } else if (st.aggregating) {
          const status = el.querySelector("#inst-dash-status") || document.getElementById("inst-dash-status");
          if (status) status.textContent = "后台聚合中…";
        }
      } catch (_) {}
    });
    dashEventSource.onerror = function () {
      closeDashboardStream();
      const status = el.querySelector("#inst-dash-status") || document.getElementById("inst-dash-status");
      if (status) status.textContent = "SSE 断开,8s 后重连…";
      dashReconnectTimer = setTimeout(function () {
        if (booted) {
          connectDashboardStream();
          load({ silent: true });
        }
      }, 8000);
    };
  }

  async function requestDashboardRefresh() {
    try {
      await fetch("/api/instance/dashboard/refresh", {
        method: "POST",
        credentials: "same-origin",
      });
    } catch (_) {}
    load({ force: true });
  }

  function stopAuto() {
    closeDashboardStream();
  }

  function init(force) {
    const el = root();
    if (!el) return;
    if (!force && el.getAttribute("data-dash-booted") === "1") {
      booted = true;
      load({ silent: true });
      connectDashboardStream();
      return;
    }
    el.setAttribute("data-dash-booted", "1");
    booted = true;
    const btn = el.querySelector("#inst-dash-refresh") || document.getElementById("inst-dash-refresh");
    if (btn && !btn.getAttribute("data-bound")) {
      btn.setAttribute("data-bound", "1");
      btn.addEventListener("click", function () {
        requestDashboardRefresh();
      });
    }
    load({});
    connectDashboardStream();
  }

  function refreshSoft(opts) {
    load(Object.assign({ silent: true }, opts || {}));
  }

  global.InstanceDashboard = {
    init: init,
    refreshSoft: refreshSoft,
    load: load,
    stopAuto: stopAuto,
  };
})(window);