const page = CarPassPage;

const APPROVED_STATUSES = new Set(["approved", "verified"]);
const state = {
  centers: [],
  selectedCenterId: null,
};

function selectedCenter() {
  return state.centers.find((item) => item.id === state.selectedCenterId) || null;
}

function statusLabel(status) {
  return {
    pending: "На проверке",
    approved: "Подтверждено",
    verified: "Подтверждено",
    rejected: "Отклонено",
    needs_changes: "Нужны правки",
    draft: "Черновик",
    suspended: "Приостановлено",
  }[status] || status || "Черновик";
}

function setValue(form, name, value) {
  const input = form.elements[name];
  if (input) input.value = Array.isArray(value) ? value.join(", ") : value ?? "";
}

function renderCenters() {
  const root = document.querySelector("#centersList");
  root.innerHTML = state.centers.length
    ? state.centers.map((center) => `
      <button type="button" class="service-list-card ${center.id === state.selectedCenterId ? "active" : ""}" data-center="${center.id}">
        <strong>${page.escapeHtml(center.display_name || center.name)}</strong>
        <small>${page.escapeHtml([statusLabel(center.verification_status), center.city, center.employee_role].filter(Boolean).join(" · "))}</small>
      </button>
    `).join("")
    : `<div class="empty">Заявок СТО пока нет. Заполните форму справа.</div>`;
  root.querySelectorAll("[data-center]").forEach((button) => {
    button.addEventListener("click", () => {
      state.selectedCenterId = Number(button.dataset.center);
      renderCenters();
      fillForm();
    });
  });
}

function fillForm() {
  const form = document.querySelector("#serviceProfileForm");
  const center = selectedCenter();
  form.reset();
  document.querySelector("#centerTitle").textContent = center ? (center.display_name || center.name) : "Новая заявка СТО";
  document.querySelector("#centerHint").textContent = center
    ? [center.city, center.address, center.phone].filter(Boolean).join(" · ") || "Дополните карточку, чтобы клиентам было проще записаться."
    : "Заполните карточку сервиса и отправьте ее на проверку.";
  document.querySelector("#centerStatus").textContent = statusLabel(center?.verification_status);
  document.querySelector("#saveCenterBtn").textContent = center ? "Сохранить профиль" : "Отправить заявку";
  document.querySelector("#openSettingsLink").classList.toggle("hidden", !center || !APPROVED_STATUSES.has(center.verification_status));
  if (!center) return;
  [
    "display_name",
    "legal_name",
    "country",
    "city",
    "address",
    "phone",
    "contact_person",
    "working_hours",
    "specializations",
    "description",
    "business_registration_number",
    "facade_photo_url",
    "document_photo_urls",
    "additional_photo_urls",
  ].forEach((name) => setValue(form, name, center[name]));
}

function payloadFromForm(form) {
  const data = page.formData(form);
  return {
    display_name: data.display_name,
    legal_name: data.legal_name || null,
    country: data.country || null,
    city: data.city || null,
    address: data.address || null,
    phone: data.phone || null,
    contact_person: data.contact_person || null,
    working_hours: data.working_hours || null,
    specializations: page.csvList(data.specializations),
    description: data.description || null,
    business_registration_number: data.business_registration_number || null,
    facade_photo_url: data.facade_photo_url || null,
    document_photo_urls: page.csvList(data.document_photo_urls),
    additional_photo_urls: page.csvList(data.additional_photo_urls),
  };
}

async function loadCenters() {
  state.centers = await page.api("/service-centers/my");
  if (!state.selectedCenterId && state.centers.length) state.selectedCenterId = state.centers[0].id;
  if (state.selectedCenterId && !state.centers.some((item) => item.id === state.selectedCenterId)) {
    state.selectedCenterId = state.centers[0]?.id || null;
  }
  renderCenters();
  fillForm();
}

document.querySelector("#newCenterBtn").addEventListener("click", () => {
  state.selectedCenterId = null;
  renderCenters();
  fillForm();
});

document.querySelector("#serviceProfileForm").addEventListener("submit", async (event) => {
  event.preventDefault();
  const center = selectedCenter();
  await page.runAction(document.querySelector("#saveCenterBtn"), center ? "Сохраняю..." : "Отправляю...", async () => {
    const saved = await page.api(center ? `/service-centers/${center.id}` : "/service-centers", {
      method: center ? "PATCH" : "POST",
      body: JSON.stringify(payloadFromForm(event.currentTarget)),
    });
    state.selectedCenterId = saved.id;
    await loadCenters();
    page.toast(center ? "Профиль СТО обновлен" : "Заявка отправлена на проверку");
  });
});

page.boot(loadCenters);