let sessionId = null;

const logEl = document.getElementById("log");
const slotsEl = document.getElementById("slots");
const schemeEl = document.getElementById("scheme");
const metaEl = document.getElementById("meta");
const form = document.getElementById("form");
const input = document.getElementById("input");
const resetBtn = document.getElementById("reset");

function addBubble(role, text) {
  const div = document.createElement("div");
  div.className = `bubble ${role}`;
  div.textContent = text;
  logEl.appendChild(div);
  logEl.scrollTop = logEl.scrollHeight;
}

async function ensureSession() {
  if (sessionId) return sessionId;
  const res = await fetch("/api/sessions", { method: "POST" });
  const data = await res.json();
  sessionId = data.session_id;
  metaEl.textContent = `session: ${sessionId.slice(0, 8)}…`;
  return sessionId;
}

async function sendMessage(message) {
  await ensureSession();
  addBubble("user", message);
  const res = await fetch("/api/chat", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({ session_id: sessionId, message }),
  });
  if (!res.ok) {
    addBubble("sys", `错误：${res.status}`);
    return;
  }
  const data = await res.json();
  addBubble("bot", data.reply);
  slotsEl.textContent = JSON.stringify(data.slots || {}, null, 2);
  schemeEl.textContent = data.scheme
    ? JSON.stringify(data.scheme, null, 2)
    : "尚未生成";
  metaEl.textContent = `session: ${sessionId.slice(0, 8)}… · phase: ${data.phase}`;
}

form.addEventListener("submit", async (e) => {
  e.preventDefault();
  const text = input.value.trim();
  if (!text) return;
  input.value = "";
  form.querySelector("button").disabled = true;
  try {
    await sendMessage(text);
  } finally {
    form.querySelector("button").disabled = false;
    input.focus();
  }
});

resetBtn.addEventListener("click", () => {
  sessionId = null;
  logEl.innerHTML = "";
  slotsEl.textContent = "{}";
  schemeEl.textContent = "尚未生成";
  metaEl.textContent = "";
  addBubble("bot", "新会话已开始。可以直接说场景，例如：「产线检测，偏向 B 类」。");
  input.focus();
});

addBubble("bot", "你好，我是鲜境方案引擎原型。先收集几个关键信息，再给出产品组合草稿。\n试试：「我们在户外做监测，指标还不确定」。");