- 칸이 있는 글자와 그림에 모서리 그립 추가, 모서리를 끌어 칸 크기를 바꾸는 조작 신설 (다른 도면 요소에도 동일 적용) - 기본 도각(00_template_A1)의 글자 24개에 표제란 칸을 계산해 부여 — 칸 기준 가로·세로 가운데 정렬 - 도각 편집 시 도면명·도면번호도 보던 도면 값으로 미리보기 제공 - 복제 시 미리보기 값 유지 (그립 편집 후 자리표가 토큰으로 되돌아가던 문제) - CAD index.html 을 캐시하지 않도록 처리 — 빌드 후에도 옛 화면이 남던 문제 해소 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
198 lines
7.3 KiB
TypeScript
198 lines
7.3 KiB
TypeScript
/**
|
|
* 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,
|
|
frameFields?: Record<string, string>,
|
|
) => void;
|
|
/** CAD에서 현재 편집본을 받아온다. */
|
|
requestCadDrawing: () => Promise<CadDrawing>;
|
|
/** 편집을 마친 뒤 보던 도면으로 돌아간다. */
|
|
restoreDrawing: () => void;
|
|
/** 도각이 바뀌었으니 받아 둔 도면 캐시를 버린다 — 안 버리면 옛 도각이 그대로 보인다. */
|
|
onSaved: () => void;
|
|
/** 지금 보던 도면의 이름·번호 — 자리표 미리보기에 도면명·도면번호로 보여 준다. */
|
|
currentDrawingInfo: () => { label: string; number: string } | null;
|
|
}
|
|
|
|
export function createFrameTemplateEditor(options: Options): FrameTemplateEditor {
|
|
let editing = false;
|
|
// 자리표에 보여 줄 실제 값 — 도각을 열 때 서버에서 받아 캐드에 함께 넘긴다.
|
|
let frameFields: Record<string, string> = {};
|
|
|
|
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, frameFields);
|
|
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);
|
|
// 도면명·도면번호는 도면마다 달라 서버가 담지 않는다 — 보던 도면 값을 견본으로 얹는다.
|
|
const info = options.currentDrawingInfo();
|
|
frameFields = {
|
|
...(response.fields ?? {}),
|
|
...(info ? { 도면명: info.label, 도면번호: info.number } : {}),
|
|
};
|
|
editing = true;
|
|
button.disabled = true;
|
|
banner.hidden = false;
|
|
label.textContent = response.customized
|
|
? "도각 편집 중 — 회사 도각을 고치고 있습니다."
|
|
: "도각 편집 중 — 기본 도각을 고치면 회사 도각으로 저장됩니다.";
|
|
options.sendLoad(response.drawing, null, true, frameFields);
|
|
} 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 };
|
|
}
|