// 外部系统连接管理：凭据字段由系统定义声明，只提交、不回显。
import { $ } from "./dom.js";
import { api } from "./api.js";
import { escapeHtml, fmtTime } from "./format.js";
import { dialogConfirm, message } from "./dialog.js";

let editingId = "";
let providerReady = false;
let definitions = [];
let systemsById = new Map();

function selectedDefinition() {
  return definitions.find(x => x.definition_id === $("ext-definition").value);
}

function renderCredentialFields(fields = []) {
  $("ext-credential-fields").innerHTML = fields.map(field => `
    <label>${escapeHtml(field.label)}<input
      data-credential-name="${escapeHtml(field.name)}"
      type="${field.secret ? "password" : "text"}"
      autocomplete="${escapeHtml(field.autocomplete || "off")}" required></label>
  `).join("");
}

function renderDefinitionOptions(items) {
  $("ext-definition").innerHTML = items.map(item =>
    `<option value="${escapeHtml(item.definition_id)}">${escapeHtml(item.name)}${item.host ? " · " + escapeHtml(item.host) : ""}</option>`
  ).join("");
}

function unconnectedDefinitions() {
  const connectedIds = new Set(Array.from(systemsById.values()).map(item => item.definition_id));
  return definitions.filter(item => !connectedIds.has(item.definition_id));
}

function resetForm() {
  editingId = "";
  $("ext-form-title").textContent = "新建外部系统连接";
  $("ext-name").disabled = false;
  $("ext-definition").disabled = false;
  $("ext-err").textContent = "";
  $("ext-save").textContent = "连接并验证";
  const available = unconnectedDefinitions();
  renderDefinitionOptions(available);
  const selected = available[0];
  $("ext-name").value = selected ? selected.name : "";
  renderCredentialFields((selected || {}).credential_fields || []);
}

function closeConnectionModal() {
  $("external-connection-modal").classList.remove("show");
  editingId = "";
}

function openConnectionModal(system = null) {
  if (!providerReady) return;
  resetForm();
  if (system) {
    editingId = system.external_system_id;
    $("ext-form-title").textContent = `更新凭据：${system.system_name || system.name}`;
    $("ext-name").value = system.name;
    $("ext-name").disabled = true;
    renderDefinitionOptions(definitions.filter(item => item.definition_id === system.definition_id));
    $("ext-definition").disabled = true;
    $("ext-save").textContent = "验证并更新";
    renderCredentialFields(system.credential_fields || []);
  }
  $("external-connection-modal").classList.add("show");
  $("ext-credential-fields").querySelector("input")?.focus();
}

export function closeExternalSystemsModal() {
  closeConnectionModal();
  $("external-modal").classList.remove("show");
}

async function openExternalSystemsModal() {
  $("external-modal").classList.add("show");
  await loadExternalSystems();
}

function connectorBadgeHtml(connector) {
  if (connector === "mcp") {
    return `<span class="ext-connector ext-connector-mcp" title="MCP 连接">
      <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M5 2v3M11 2v3M3.5 5h9v2.5A4.5 4.5 0 0 1 8 12v2M6 14h4"/></svg>
      MCP
    </span>`;
  }
  return `<span class="ext-connector ext-connector-openapi" title="OpenAPI 连接">
    <svg viewBox="0 0 16 16" aria-hidden="true"><circle cx="3" cy="8" r="1.5"/><circle cx="13" cy="4" r="1.5"/><circle cx="13" cy="12" r="1.5"/><path d="M4.5 7.4 11.5 4.6M4.5 8.6l7 2.8"/></svg>
    OpenAPI
  </span>`;
}

function cardHtml(item) {
  const good = item.status === "active";
  const badge = good
    ? "已连接"
    : (item.status === "disabled"
      ? "系统已停用"
      : (item.status === "needs_reverify" ? "需重新验证" : "需更新凭据"));
  const checked = item.last_verified_at ? fmtTime(item.last_verified_at) : "尚未验证";
  return `<div class="ext-card" data-id="${escapeHtml(item.external_system_id)}">
    <div class="ext-card-head"><span class="ext-card-name">${escapeHtml(item.name)}</span>${connectorBadgeHtml(item.connector)}<span class="sk-badge">${badge}</span></div>
    <div class="meta">${escapeHtml(item.system_name || "外部系统")} · ${escapeHtml(item.username_masked || "***")} · 最近验证 ${escapeHtml(checked)}</div>
    <div class="ext-actions">
      <button type="button" class="small" data-ext-test>测试连接</button>
      <button type="button" class="small" data-ext-edit>更新凭据</button>
      <button type="button" class="small danger" data-ext-delete>断开</button>
    </div>
  </div>`;
}

async function loadExternalSystems() {
  const provider = $("ext-provider");
  const list = $("ext-list");
  provider.textContent = "加载中…";
  list.innerHTML = '<div class="muted">加载中…</div>';
  try {
    const [catalog, response] = await Promise.all([
      api("GET", "/v1/external-system-providers"),
      api("GET", "/v1/external-systems"),
    ]);
    const providers = catalog.providers || [];
    definitions = providers.flatMap(item => item.definitions || []);
    providerReady = definitions.length > 0 && providers.some(item => item.configured);
    const rows = response.results || [];
    systemsById = new Map(rows.map(item => [item.external_system_id, item]));
    provider.textContent = providerReady
      ? `管理员已配置 ${definitions.length} 个外部系统，请选择后填写自己的访问凭据`
      : `暂没有可连接的外部系统${providers.find(item => item.reason)?.reason ? "：" + providers.find(item => item.reason).reason : "，请联系管理员配置"}`;
    const hasAvailableDefinition = unconnectedDefinitions().length > 0;
    $("ext-add").disabled = !providerReady || !hasAvailableDefinition;
    $("ext-add").title = hasAvailableDefinition ? "" : "所有可用外部系统均已连接";
    list.innerHTML = rows.length
      ? rows.map(cardHtml).join("")
      : '<div class="sk-empty">还没有外部系统连接。点击“新建连接”后，助手即可按你的权限查询。</div>';
  } catch (error) {
    providerReady = false;
    provider.textContent = "加载失败";
    list.innerHTML = `<div class="err">${escapeHtml(error.message)}</div>`;
    $("ext-add").disabled = true;
  }
}

$("hd-external").onclick = openExternalSystemsModal;
$("ext-close").onclick = closeExternalSystemsModal;
$("ext-add").onclick = () => openConnectionModal();
$("ext-form-close").onclick = closeConnectionModal;
$("ext-form-cancel").onclick = closeConnectionModal;
$("external-modal").addEventListener("click", event => {
  if (event.target.id === "external-modal") closeExternalSystemsModal();
});
$("external-connection-modal").addEventListener("click", event => {
  if (event.target.id === "external-connection-modal") closeConnectionModal();
});
$("external-connection-modal").addEventListener("keydown", event => {
  if (event.key === "Escape") closeConnectionModal();
});
$("ext-definition").onchange = () => {
  const selected = selectedDefinition();
  if (selected) $("ext-name").value = selected.name;
  renderCredentialFields((selected || {}).credential_fields || []);
};

$("ext-form").addEventListener("submit", async event => {
  event.preventDefault();
  if (!providerReady) return;
  const name = $("ext-name").value.trim();
  const definitionId = $("ext-definition").value;
  const credentials = Object.fromEntries(
    Array.from($("ext-credential-fields").querySelectorAll("[data-credential-name]"))
      .map(input => [input.dataset.credentialName, input.value]),
  );
  if (Object.values(credentials).some(value => !value.trim()) || (!editingId && (!name || !definitionId))) {
    $("ext-err").textContent = "请填写连接名称和全部访问凭据";
    return;
  }
  const button = $("ext-save");
  const wasEditing = Boolean(editingId);
  button.disabled = true;
  button.textContent = "正在验证…";
  $("ext-err").textContent = "";
  try {
    if (wasEditing) {
      await api("PUT", `/v1/external-systems/${editingId}/credentials`, { credentials });
      message("外部系统已重新连接，凭据已更新", "success");
    } else {
      await api("POST", "/v1/external-systems", { definition_id: definitionId, name, credentials });
      message("外部系统已连接；下一轮对话即可使用", "success");
    }
    closeConnectionModal();
    await loadExternalSystems();
  } catch (error) {
    $("ext-err").textContent = error.message;
  } finally {
    button.disabled = false;
    button.textContent = wasEditing ? "验证并更新" : "连接并验证";
  }
});

$("ext-list").addEventListener("click", async event => {
  const card = event.target.closest(".ext-card");
  if (!card) return;
  const id = card.dataset.id;

  if (event.target.closest("[data-ext-test]")) {
    const button = event.target.closest("button");
    button.disabled = true;
    try {
      const result = await api("POST", `/v1/external-systems/${id}/test`);
      message(result.ok ? `连接正常，可用接口 ${result.operation_count || 0} 个` : `连接失败：${result.error}`, result.ok ? "success" : "error");
      await loadExternalSystems();
    } catch (error) { message("测试失败：" + error.message, "error"); }
    finally { button.disabled = false; }
    return;
  }
  if (event.target.closest("[data-ext-delete]")) {
    const name = card.querySelector(".ext-card-name").textContent;
    if (!await dialogConfirm({ title:"断开外部系统", message:`断开「${name}」？保存的密文凭据和连接配置将被清除。`, okText:"断开", danger:true })) return;
    try {
      await api("DELETE", `/v1/external-systems/${id}`);
      message("外部系统已断开", "success");
      await loadExternalSystems();
    } catch (error) { message("断开失败：" + error.message, "error"); }
    return;
  }
  openConnectionModal(systemsById.get(id));
});