Aislo/B07_DesignDetail/B07_DesignDetail_UI_FrameEdit.ts

/**
 * B07 도각 편집 모드 — 캐드 화면에서 도각(양식)만 따로 열어 고치고 [완료]로 한 번에 반영한다.
 *
 * 정본(`resources/template_2dDrawing/00_template_A1.json`)은 프로그램 기본 도각이라
 * 건드리지 않는다. 고친 도각은 **회사 도각**(`storage/{회사}/templates/`)으로 저장되고,
 * 이후 그리는 도면이 그것을 쓴다 (2026-09-01 사용자 확정).
 *
 * 이미 확정한 도면은 저장본을 그대로 쓰므로 옛 도각을 유지한다 — 확정을 풀면 다시 그려진다.
 */

import { createButton, showToast } from "@ui/ui_template_elements";
import {
  type CadDrawing,
  fetchFrameTemplate,
  importFrameTemplate,
  resetFrameTemplate,
  saveFrameTemplate,
} from "./B07_DesignDetail_Api_Fetch";

export interface FrameTemplateEditor {
  /** 도면 목록 아래에 놓는 「도각 편집」 버튼. */
  button: HTMLButtonElement;
  /** 편집 중임을 알리는 띠 — 도면 목록 하단 액션 칸의 1행 (평소엔 숨김). */
  banner: HTMLElement;
  /** 편집 중인가 — 도면 변경 알림(확정 해제)을 이 동안 막는 데 쓴다. */
  isEditing: () => boolean;
}

interface Options {
  projectId: string;
  /** CAD에 도면을 싣는다 (meta null이면 수량 패널을 숨긴다).
   *  frameEdit 을 켜면 캐드 안 자리표 패널이 함께 뜬다. */
  sendLoad: (drawing: CadDrawing, meta: null, frameEdit?: boolean) => void;
  /** CAD에서 현재 편집본을 받아온다. */
  requestCadDrawing: () => Promise<CadDrawing>;
  /** 편집을 마친 뒤 보던 도면으로 돌아간다. */
  restoreDrawing: () => void;
  /** 도각이 바뀌었으니 받아 둔 도면 캐시를 버린다 — 안 버리면 옛 도각이 그대로 보인다. */
  onSaved: () => void;
}

export function createFrameTemplateEditor(options: Options): FrameTemplateEditor {
  let editing = false;

  const banner = document.createElement("div");
  banner.className = "b07-frame-edit";
  banner.hidden = true;
  const label = document.createElement("span");
  label.className = "b07-frame-edit__label";
  banner.append(label);

  const finishButton = createButton({
    label: "완료",
    variant: "filled",
    onClick: () => void finish(),
  });
  /**
   * 회사 도각을 지우고 프로그램 기본 도각으로 되돌린다 (2026-09-01 신설).
   * 되돌릴 길이 없으면 도각을 한 번 잘못 저장한 것만으로 도면이 열리지 않는다.
   */
  const resetButton = createButton({
    label: "기본 도각으로",
    variant: "ghost",
    onClick: () => void resetToDefault(),
  });
  /**
   * 회사가 쓰던 도각을 파일로 들인다 (2026-09-06 사용자 지시). DWG 는 서버에 변환기가
   * 있을 때만 읽고, 없으면 「DXF 로 저장해 달라」는 안내가 뜬다. 불러온 도각은 아직
   * 저장되지 않는다 — 자리표를 놓고 [완료]를 눌러야 회사 도각이 된다.
   */
  const fileInput = document.createElement("input");
  fileInput.type = "file";
  fileInput.accept = ".dxf,.dwg";
  fileInput.hidden = true;
  fileInput.addEventListener("change", () => void importFile());

  const importButton = createButton({
    label: "파일 불러오기",
    variant: "ghost",
    onClick: () => fileInput.click(),
  });

  const cancelButton = createButton({
    label: "취소",
    variant: "ghost",
    onClick: () => leave(),
  });
  const bannerButtons = document.createElement("div");
  bannerButtons.className = "b07-frame-edit__buttons";
  bannerButtons.append(finishButton, importButton, resetButton, cancelButton);
  banner.append(bannerButtons, fileInput);

  const button = createButton({
    label: "도각 편집",
    variant: "ghost",
    onClick: () => void enter(),
  });

  const leave = (): void => {
    editing = false;
    banner.hidden = true;
    button.disabled = false;
    options.restoreDrawing();
  };

  async function importFile(): Promise<void> {
    const file = fileInput.files?.[0];
    fileInput.value = "";
    if (!file) return;
    importButton.disabled = true;
    try {
      const response = await importFrameTemplate(options.projectId, file);
      options.sendLoad(response.drawing, null, true);
      label.textContent = `${file.name} 을(를) 불러왔습니다 — 자리표를 놓고 [완료]를 누르십시오.`;
      showToast(`도형 ${response.entity_count}개를 불러왔습니다.`, "success");
    } catch (error) {
      showToast(
        error instanceof Error ? error.message : "도각 파일을 불러오지 못했습니다.",
        "error",
      );
    } finally {
      importButton.disabled = false;
    }
  }

  async function enter(): Promise<void> {
    try {
      const response = await fetchFrameTemplate(options.projectId);
      editing = true;
      button.disabled = true;
      banner.hidden = false;
      label.textContent = response.customized
        ? "도각 편집 중 — 회사 도각을 고치고 있습니다."
        : "도각 편집 중 — 기본 도각을 고치면 회사 도각으로 저장됩니다.";
      options.sendLoad(response.drawing, null, true);
    } catch (error) {
      showToast(error instanceof Error ? error.message : "도각을 불러오지 못했습니다.", "error");
    }
  }

  async function resetToDefault(): Promise<void> {
    if (
      !window.confirm(
        "회사 도각을 지우고 프로그램 기본 도각으로 되돌립니다.\n" +
          "확정하지 않은 도면부터 기본 도각으로 나옵니다. 계속할까요?",
      )
    )
      return;
    resetButton.disabled = true;
    try {
      await resetFrameTemplate(options.projectId);
      options.onSaved();
      showToast("기본 도각으로 되돌렸습니다.", "success");
      leave();
    } catch (error) {
      showToast(
        error instanceof Error ? error.message : "기본 도각으로 되돌리지 못했습니다.",
        "error",
      );
    } finally {
      resetButton.disabled = false;
    }
  }

  async function finish(): Promise<void> {
    if (!editing) return;
    finishButton.disabled = true;
    try {
      const drawing = await options.requestCadDrawing();
      await saveFrameTemplate(options.projectId, drawing);
      options.onSaved();
      showToast("도각을 저장했습니다. 확정하지 않은 도면부터 새 도각으로 나옵니다.", "success");
      leave();
    } catch (error) {
      showToast(error instanceof Error ? error.message : "도각을 저장하지 못했습니다.", "error");
    } finally {
      finishButton.disabled = false;
    }
  }

  return { button, banner, isEditing: () => editing };
}