Merge remote-tracking branch 'origin/sub_laptop_3' into sub_laptop_1

This commit is contained in:
2026-09-21 23:29:28 +09:00
7 changed files with 742 additions and 8 deletions
+314
View File
@@ -0,0 +1,314 @@
/* =============================================================================
* M01_MasterData_UI_Combo.ts
* 일위대가 조합 화면 — 왼쪽 컨테이너(구분 · 상세구분 거름) / 오른쪽 목록 · 상세
* 상세 = 이름·구분·단위·비고 + 담은 로직 표(차례 · 키 · 이름 · 결과 단위 · 메모 · 순서) + 미리 보기
* 저장·지우기는 서버 조합 마스터(`일위대가조합.json` · 키 UA) — 길은 `Combo_Api` 한 곳
* ========================================================================== */
import {
createButton,
createInputField,
el,
showConfirmDialog,
showToast,
} from "@ui/ui_template_elements";
import { fetchLogics, type LogicSummary } from "./M01_MasterData_UI_Logic_Api";
import {
deleteCombo,
fetchCombo,
fetchCombos,
saveCombo,
type Combo,
type ComboSummary,
} from "./M01_MasterData_UI_Combo_Api";
import { openLogicPicker } from "./M01_MasterData_UI_Combo_Pick";
import { buildPreview } from "./M01_MasterData_UI_Combo_Preview";
import { tc } from "./M01_MasterData_UI_Combo_Text";
import type { SideHandle } from "./M01_MasterData_UI_Side";
import "./M01_MasterData_UI_Logic_Style.css";
import "./M01_MasterData_UI_LogicLab_Style.css";
const FILTER_ID = "조합|";
const blankCombo = (): Combo => ({
: "",
: "",
: "",
: "",
: "",
: "",
: [],
});
export interface ComboHandle {
/** 컨테이너를 펼칠 때 — 목록을 새로 받아 그림 */
show: () => Promise<void>;
}
export function mountM01Combo(
host: HTMLElement,
side: SideHandle,
onOpenLogic: (key: string) => void,
): ComboHandle {
let items: ComboSummary[] = [];
let logics = new Map<string, LogicSummary>();
let pick = { sub: "", detail: "" };
const filterHost = el("div");
side.comboHost.replaceChildren(filterHost);
const view = el("div", { className: "m01-logic__editor" });
host.replaceChildren(view);
const load = async (): Promise<void> => {
try {
const [combos, all] = await Promise.all([fetchCombos(), fetchLogics()]);
items = combos;
logics = new Map(all.map((x) => [x., x]));
} catch (error) {
showToast(error instanceof Error ? error.message : tc("Load_Failed"), "error");
}
drawFilter();
drawList();
};
/* --- 왼쪽 거름 --- */
const drawFilter = (): void => {
const subs = [...new Set(items.map((x) => x.).filter(Boolean))].map((name) => ({
name,
book: null,
details: [...new Set(items.filter((x) => x. === name).map((x) => x.))].filter(
Boolean,
),
}));
filterHost.replaceChildren(
side.filter({
id: FILTER_ID,
store: "m01.filter.조합",
subs,
total: items.length,
subLabel: tc("Sub"),
detailLabel: tc("Detail"),
onPick: (sub, detail) => {
pick = { sub, detail };
drawList();
},
}),
);
};
/* --- 목록 --- */
const toolbar = (...more: HTMLElement[]): HTMLElement =>
el("div", {
className: "m01-logic__section-head",
children: [
createButton({ label: tc("New"), variant: "filled", onClick: () => draw(blankCombo()) }),
...more,
],
});
const drawList = (): void => {
const shown = items.filter(
(x) => (!pick.sub || x. === pick.sub) && (!pick.detail || x. === pick.detail),
);
const heads = [
tc("Head_Key"),
tc("Head_Name"),
tc("Sub"),
tc("Detail"),
tc("Head_Unit"),
tc("Head_Count"),
];
const rows = shown.map((x) => {
const tr = el("tr", {
className: "m01-master__table-row",
attrs: { "data-combo-key": x. },
children: [x., x., x., x., x., String(x.)].map((v) =>
el("td", { text: v }),
),
});
tr.addEventListener("click", () => void open(x.));
return tr;
});
view.replaceChildren(
toolbar(),
shown.length
? el("div", {
className: "m01-master__grid-wrap",
children: [
el("table", {
className: "m01-master__grid",
children: [
el("thead", {
children: [el("tr", { children: heads.map((t) => el("th", { text: t })) })],
}),
el("tbody", { children: rows }),
],
}),
],
})
: el("p", { className: "m01-logic__muted", text: tc("Empty") }),
);
};
const open = async (key: string): Promise<void> => {
try {
draw(await fetchCombo(key));
} catch (error) {
showToast(error instanceof Error ? error.message : tc("Load_Failed"), "error");
}
};
/* --- 상세 --- */
const draw = (combo: Combo): void => {
const field = (label: string, name: "이름" | "구분" | "상세구분" | "단위" | "비고") => {
const f = createInputField({ type: "text", label });
f.input.value = combo[name];
f.input.setAttribute("data-combo-field", name);
f.input.addEventListener("input", () => (combo[name] = f.input.value));
return f.root;
};
const preview = buildPreview(() => combo.);
const table = el("div");
const drawTable = (): void => {
const move = (i: number, d: number): void => {
const j = i + d;
if (j < 0 || j >= combo..length) return;
[combo.[i], combo.[j]] = [combo.[j], combo.[i]];
drawTable();
};
const trs = combo..map((row, i) => {
const info = logics.get(row.);
const memo = createInputField({ type: "text" });
memo.input.value = row.;
memo.input.addEventListener("input", () => (row. = memo.input.value));
const name = el("button", {
className: "ui-btn ui-btn--ghost",
text: info?.이름 ?? row.,
attrs: { type: "button", title: tc("Open") },
});
name.addEventListener("click", () => onOpenLogic(row.));
const btns = el("div", {
className: "m01-logic__chips",
children: [
createButton({ label: tc("Up"), variant: "ghost", onClick: () => move(i, -1) }),
createButton({ label: tc("Down"), variant: "ghost", onClick: () => move(i, 1) }),
createButton({
label: tc("Remove"),
variant: "ghost",
onClick: () => {
combo..splice(i, 1);
drawTable();
},
}),
],
});
return el("tr", {
attrs: { "data-combo-logic": row. },
children: [
el("td", { text: String(i + 1) }),
el("td", { text: row.키 }),
el("td", { children: [name] }),
el("td", { text: info?.결과단위 ?? "" }),
el("td", { children: [memo.root] }),
el("td", { children: [btns] }),
],
});
});
const heads = [
tc("Col_Order"),
tc("Col_Key"),
tc("Col_Name"),
tc("Col_Unit"),
tc("Col_Memo"),
tc("Col_Move"),
];
table.replaceChildren(
el("table", {
className: "m01-master__grid",
children: [
el("thead", {
children: [el("tr", { children: heads.map((t) => el("th", { text: t })) })],
}),
el("tbody", { children: trs }),
],
}),
...(trs.length ? [] : [el("p", { className: "m01-logic__muted", text: tc("NoLogic") })]),
);
void preview.redraw();
};
const add = createButton({
label: tc("AddLogic"),
variant: "filled",
onClick: () =>
openLogicPicker((x) => {
if (!logics.has(x.)) logics.set(x., x);
combo..push({ : x.키, : "", : {} });
drawTable();
}),
});
const save = createButton({
label: tc("Save"),
variant: "filled",
onClick: async () => {
if (!combo..trim()) return showToast(tc("NeedName"), "error");
try {
const saved = await saveCombo(combo);
showToast(tc("Saved"), "success");
await load();
draw(saved);
} catch (error) {
showToast(error instanceof Error ? error.message : tc("Load_Failed"), "error");
}
},
});
const remove = createButton({
label: tc("Delete"),
variant: "ghost",
onClick: async () => {
if (!combo. || !(await showConfirmDialog(tc("DeleteAsk")))) return;
try {
await deleteCombo(combo.);
showToast(tc("Deleted"), "success");
await load();
} catch (error) {
showToast(error instanceof Error ? error.message : tc("Load_Failed"), "error");
}
},
});
const back = createButton({ label: "←", variant: "ghost", onClick: () => drawList() });
view.replaceChildren(
el("div", {
className: "m01-logic__section-head",
children: [back, el("h3", { text: combo.키 || tc("New") }), remove, save],
}),
el("section", {
className: "m01lab__box m01-logic__section",
children: [
el("div", {
className: "m01lab__info",
children: [
field(tc("Head_Name"), "이름"),
field(tc("Sub"), "구분"),
field(tc("Detail"), "상세구분"),
field(tc("Head_Unit"), "단위"),
field(tc("Head_Note"), "비고"),
],
}),
],
}),
el("section", {
className: "m01lab__box m01-logic__section",
children: [
el("div", {
className: "m01-logic__section-head",
children: [el("h3", { text: tc("Logics_Title") }), add],
}),
table,
],
}),
preview.root,
);
drawTable();
};
return { show: load };
}
@@ -0,0 +1,56 @@
/* =============================================================================
* M01_MasterData_UI_Combo_Api.ts
* 일위대가 조합 화면이 부르는 서버 길 — 조합 마스터 `일위대가조합.json`(키 UA)
* 길 이름은 계약(PLAN 4-2)이 오면 이 파일만 맞춤 · 미리 보기는 로직마다 `/calc` 를 불러 화면에서 합침
* ========================================================================== */
import { API_BASE_URL } from "@config/config_frontend";
import { ApiError } from "./M01_MasterData_UI_Logic_Api";
/** 조합에 담은 로직 한 줄 — 입력 = 그 로직을 셀 때 넣을 값 */
export interface ComboLogic {
: string;
메모: string;
입력: Record<string, string>;
}
export interface Combo {
: string;
이름: string;
구분: string;
상세구분: string;
단위: string;
비고: string;
로직: ComboLogic[];
}
export interface ComboSummary {
: string;
이름: string;
구분: string;
상세구분: string;
단위: string;
로직수: number;
}
async function request<T>(path: string, body?: unknown): Promise<T> {
const response = await fetch(`${API_BASE_URL}/m01${path}`, {
method: body === undefined ? "GET" : "POST",
credentials: "include",
headers: { "Content-Type": "application/json" },
body: body === undefined ? undefined : JSON.stringify(body),
});
const data = (await response.json().catch(() => ({}))) as { detail?: unknown } & T;
if (!response.ok) throw new ApiError(response.status, data.detail ?? response.statusText);
return data;
}
export const fetchCombos = (): Promise<ComboSummary[]> =>
request<{ combos: ComboSummary[] }>("/combos").then((d) => d.combos);
export const fetchCombo = (key: string): Promise<Combo> =>
request<{ combo: Combo }>(`/combo?key=${encodeURIComponent(key)}`).then((d) => d.combo);
/** 키가 비면 새 조합 — 서버가 다음 번호(UA…)를 줌 */
export const saveCombo = (combo: Combo): Promise<Combo> =>
request<{ combo: Combo }>("/combo/save", { combo }).then((d) => d.combo);
export const deleteCombo = (key: string): Promise<unknown> => request("/combo/delete", { key });
@@ -0,0 +1,116 @@
/* =============================================================================
* M01_MasterData_UI_Combo_Pick.ts
* [로직 더하기] 창 — 구분 → 상세구분 → 찾기로 사용자가 로직을 하나씩 고름(자동 추천 없음)
* ========================================================================== */
import {
createButton,
createInputField,
createSelectField,
el,
showToast,
} from "@ui/ui_template_elements";
import { t as L } from "@ui/ui_template_locale";
import {
fetchLogics,
fetchLogicSubs,
type LogicSummary,
type SubBrief,
} from "./M01_MasterData_UI_Logic_Api";
import { tc } from "./M01_MasterData_UI_Combo_Text";
const opts = (values: string[]): { value: string; text: string }[] =>
[L("M01_All"), ...values].map((v, i) => ({ value: i ? v : "", text: v }));
export function openLogicPicker(done: (logic: LogicSummary) => void): void {
const subs: SubBrief[] = [];
let all: LogicSummary[] = [];
const sub = createSelectField({ options: opts([]), compact: true, label: tc("Sub") });
const detail = createSelectField({ options: opts([]), compact: true, label: tc("Detail") });
detail.select.disabled = true;
const searchField = createInputField({ type: "search", placeholder: tc("Pick_Search") });
const list = el("div", { className: "m01-logic__pick-list" });
const hint = el("p", { className: "m01-logic__muted", text: tc("Pick_Hint") });
const close = (): void => backdrop.remove();
const find = (): void => {
const q = searchField.input.value.trim().toLowerCase();
const found = all.filter(
(x) =>
(!sub.select.value || x. === sub.select.value) &&
(!detail.select.value || x. === detail.select.value) &&
(!q || `${x.} ${x.}`.toLowerCase().includes(q)),
);
hint.textContent = found.length ? `${found.length} / ${all.length}` : tc("Pick_None");
list.replaceChildren(
...found.slice(0, 100).map((x) => {
const row = el("button", {
className: "m01-logic__pick-row m01-logic__pick-row--button",
attrs: { type: "button", "data-pick": x. },
children: [
el("div", {
className: "m01-logic__stack",
children: [
el("strong", { text: x.이름 }),
el("span", {
className: "m01-logic__muted",
text: `${x.} · ${x.} ${x.}`.trim(),
}),
],
}),
el("span", { text: `${x.}${x.blocked ? ` · ${tc("Pick_Blocked")}` : ""}` }),
],
});
row.addEventListener("click", () => {
close();
done(x);
});
return row;
}),
);
};
sub.select.addEventListener("change", () => {
const d = subs.find((s) => s.name === sub.select.value)?.details ?? [];
detail.setOptions(opts(d), "");
detail.select.disabled = d.length === 0;
});
const dialog = el("div", {
className: "m01-logic__pick",
attrs: { role: "dialog", "aria-label": tc("Pick_Title") },
children: [
el("div", {
className: "m01-logic__section-head",
children: [
el("h3", { text: tc("Pick_Title") }),
createButton({ label: tc("Pick_Close"), variant: "ghost", onClick: close }),
],
}),
el("div", {
className: "m01-logic__filters",
children: [
sub.root,
detail.root,
searchField.root,
createButton({ label: tc("Pick_Find"), variant: "filled", onClick: find }),
],
}),
hint,
list,
],
});
const backdrop = el("div", { className: "m01-logic__backdrop", children: [dialog] });
backdrop.addEventListener("click", (ev) => ev.target === backdrop && close());
backdrop.addEventListener("keydown", (ev) => ev.key === "Escape" && close());
document.body.append(backdrop);
void Promise.all([fetchLogicSubs(), fetchLogics()])
.then(([s, l]) => {
subs.push(...s);
all = l;
sub.setOptions(opts(s.map((x) => x.name)), "");
})
.catch((error) =>
showToast(error instanceof Error ? error.message : tc("Load_Failed"), "error"),
);
}
@@ -0,0 +1,148 @@
/* =============================================================================
* M01_MasterData_UI_Combo_Preview.ts
* 조합 미리 보기 — 담은 로직 저마다 입력값으로 `/calc` 를 불러 노무비·재료비·경비로 갈라 합침(보기만 · 저장 없음)
* ========================================================================== */
import { createInputField, createSelectField, el } from "@ui/ui_template_elements";
import { fetchLogic, runCalc, type LogicInput } from "./M01_MasterData_UI_Logic_Api";
import type { ComboLogic } from "./M01_MasterData_UI_Combo_Api";
import { tc, type ComboTextKey } from "./M01_MasterData_UI_Combo_Text";
const COSTS = ["노무비", "재료비", "경비"] as const;
type Costs = Record<(typeof COSTS)[number], number>;
const LABEL: Record<(typeof COSTS)[number], ComboTextKey> = {
: "Prev_Labor",
: "Prev_Material",
: "Prev_Expense",
};
const num = (v: string): number | string => (v.trim() !== "" && !isNaN(Number(v)) ? Number(v) : v);
const fmt = (n: number): string => n.toLocaleString("ko-KR", { maximumFractionDigits: 4 });
const total = (c: Costs): number => c. + c. + c.;
const blank = (): Costs => ({ 노무비: 0, 재료비: 0, 경비: 0 });
/** 로직 입력 정의 → 처음 값(고르기 첫째 · 범위 아래끝) */
const initial = (i: LogicInput): string => String(i.?.[0] ?? i.?.[0] ?? "");
/** 입력 칸 — 바꾸면 그 줄의 입력에 바로 적음(조합과 함께 저장됨) */
function inputCell(input: LogicInput, row: ComboLogic): HTMLElement {
const value = row.[input.] ?? initial(input);
row.[input.] = value;
const choices = input.?.map((v) => ({ value: String(v), text: String(v) }));
const field = choices
? createSelectField({ options: choices, value, compact: true, label: input.이름 })
: createInputField({ type: "text", label: input.이름 });
const control = "select" in field ? field.select : field.input;
control.value = value;
control.setAttribute("data-input", `${row.}|${input.}`);
control.addEventListener("input", () => (row.[input.] = control.value));
control.addEventListener("change", () => (row.[input.] = control.value));
return field.root;
}
export interface PreviewHandle {
root: HTMLElement;
/** 담은 로직이 바뀐 뒤 입력 칸을 다시 그림 */
redraw: () => Promise<void>;
}
export function buildPreview(rows: () => ComboLogic[]): PreviewHandle {
const inputs = el("div", { className: "m01-logic__stack" });
const out = el("div", { attrs: { "data-combo": "preview" } });
const rowOf = (cells: string[], note = "", bold = false): HTMLElement =>
el("tr", {
className: bold ? "m01lab__subtotal" : "",
children: cells.map((t, i) => el("td", { text: i === 0 && note ? `${t}${note}` : t })),
});
const run = async (): Promise<void> => {
out.replaceChildren(el("p", { className: "m01-logic__muted", text: "…" }));
const sum = blank();
const trs: HTMLElement[] = [];
for (const row of rows()) {
const cost = blank();
let name = row.;
let note = "";
try {
const one = await fetchLogic(row.);
name = one.logic.;
const values: Record<string, unknown> = {};
for (const i of one.logic.) {
const raw = row.[i.] ?? initial(i);
if (raw.trim() === "") continue; // 빈 칸은 안 보냄(로직 화면과 같음)
values[i.] = i.?.find((o) => String(o) === raw) ?? num(raw);
}
const got = await runCalc({ key: row.키, inputs: values });
if (got.ok) {
for (const line of got.lines ?? []) for (const c of COSTS) cost[c] += line.?.[c] ?? 0;
} else note = `${tc("Prev_Fail")}: ${got.reason}`;
} catch (error) {
note = `${tc("Prev_Fail")}: ${error instanceof Error ? error.message : ""}`;
}
for (const c of COSTS) sum[c] += cost[c];
trs.push(
rowOf([`${row.} ${name}`, ...COSTS.map((c) => fmt(cost[c])), fmt(total(cost))], note),
);
}
trs.push(rowOf([tc("Prev_Sum"), ...COSTS.map((c) => fmt(sum[c])), fmt(total(sum))], "", true));
const heads = [tc("Prev_Row"), ...COSTS.map((c) => tc(LABEL[c])), tc("Prev_Sum")];
out.replaceChildren(
el("table", {
className: "m01-master__grid",
children: [
el("thead", {
children: [el("tr", { children: heads.map((t) => el("th", { text: t })) })],
}),
el("tbody", { children: trs }),
],
}),
);
};
const button = el("button", {
className: "ui-btn ui-btn--filled",
text: tc("Prev_Run"),
attrs: { type: "button", "data-combo": "run" },
});
button.addEventListener("click", () => void run());
const redraw = async (): Promise<void> => {
const blocks: HTMLElement[] = [];
for (const row of rows()) {
try {
const one = await fetchLogic(row.);
blocks.push(
el("div", {
className: "m01lab__info",
children: [
el("strong", {
className: "m01lab__cell--wide",
text: `${row.} ${one.logic.}`,
}),
...one.logic..map((i) => inputCell(i, row)),
],
}),
);
} catch {
/* 못 읽은 로직은 계산 때 까닭이 뜸 */
}
}
inputs.replaceChildren(...blocks);
out.replaceChildren(el("p", { className: "m01-logic__muted", text: tc("Prev_Wait") }));
};
const root = el("section", {
className: "m01lab__box m01-logic__section",
children: [
el("div", {
className: "m01-logic__section-head",
children: [el("h3", { text: tc("Prev_Title") })],
}),
el("h4", { text: tc("Prev_Inputs") }),
inputs,
button,
out,
],
});
return { root, redraw };
}
@@ -0,0 +1,67 @@
/* =============================================================================
* M01_MasterData_UI_Combo_Text.ts
* 일위대가 조합 화면 글자 — [한국어, 영어]
* ========================================================================== */
import { currentLanguageIndex } from "@ui/ui_template_locale";
const TEXT = {
Title: ["일위대가 조합", "Unit-price combination"],
Sub: ["구분", "Category"],
Detail: ["상세구분", "Detail"],
All: ["전체", "All"],
Empty: ["조합이 없음 — [새 조합]으로 만듦", "No combinations — press [New combination]"],
New: ["새 조합", "New combination"],
Delete: ["지우기", "Delete"],
Save: ["저장", "Save"],
DeleteAsk: ["이 조합을 지울까요?", "Delete this combination?"],
Saved: ["저장함", "Saved"],
Deleted: ["지움", "Deleted"],
NeedName: ["이름을 적어야 저장됨", "A name is required"],
Load_Failed: ["불러오지 못함", "Load failed"],
Head_Key: ["키", "Key"],
Head_Name: ["이름", "Name"],
Head_Unit: ["단위", "Unit"],
Head_Note: ["비고", "Note"],
Head_Count: ["로직 수", "Logics"],
Logics_Title: ["담은 로직", "Logics in it"],
Col_Order: ["차례", "No."],
Col_Key: ["로직 키", "Logic key"],
Col_Name: ["이름", "Name"],
Col_Unit: ["결과 단위", "Result unit"],
Col_Memo: ["메모", "Memo"],
Col_Move: ["순서", "Move"],
Up: ["올리기", "Up"],
Down: ["내리기", "Down"],
Remove: ["빼기", "Remove"],
AddLogic: ["로직 더하기", "Add logic"],
NoLogic: ["담은 로직 없음", "No logics yet"],
Open: ["열기", "Open"],
Pick_Title: ["로직 고르기", "Pick a logic"],
Pick_Search: ["이름·키로 찾기", "Search by name or key"],
Pick_Find: ["찾기", "Find"],
Pick_Hint: [
"구분 → 상세구분을 고르고 [찾기]를 누름 — 하나씩 직접 고름",
"Choose category, detail, then Find — pick one by one",
],
Pick_None: ["찾은 로직 없음", "No logics found"],
Pick_Close: ["닫기", "Close"],
Pick_Blocked: ["막힘", "Blocked"],
Prev_Title: ["미리 보기 (보기만 · 저장 안 함)", "Preview (view only)"],
Prev_Inputs: ["넣을 값", "Inputs"],
Prev_Run: ["미리 보기 계산", "Run preview"],
Prev_Labor: ["노무비", "Labor"],
Prev_Material: ["재료비", "Material"],
Prev_Expense: ["경비", "Expense"],
Prev_Sum: ["합계", "Total"],
Prev_Row: ["로직", "Logic"],
Prev_Fail: ["못 셈", "Failed"],
Prev_Wait: ["미리 보기 계산을 누르면 값이 나옴", "Press the button to see values"],
} as const satisfies Record<string, readonly [string, string]>;
export type ComboTextKey = keyof typeof TEXT;
export function tc(key: ComboTextKey): string {
const entry = TEXT[key];
return entry[currentLanguageIndex as 0 | 1] ?? entry[0];
}
+24 -4
View File
@@ -1,6 +1,6 @@
/* =============================================================================
* M01_MasterData_UI_Page.ts
* 마스터 요소 화면 — 좌측 도킹 패널(컨테이너: 인력·재료·기계·소요량·계수·환율·요율·단가산출 로직·로직 테스트)
* 마스터 요소 화면 — 좌측 도킹 패널(컨테이너: 인력·재료·기계·소요량·계수·환율·요율·단가산출 로직·일위대가 조합·로직 테스트)
* / 우측 요소 표 · 표 목록 · 로직 편집
*
* 시스템 관리자만. 고친 것은 초안(sessionStorage)에 쌓이고 [저장] 한 번에 서버로 —
@@ -34,6 +34,7 @@ import {
} from "./M01_MasterData_UI_Side";
import { renderTables } from "./M01_MasterData_UI_Tables";
import type { LogicHandle } from "./M01_MasterData_UI_Logic_Page";
import type { ComboHandle } from "./M01_MasterData_UI_Combo";
import "./M01_MasterData_UI_Style.css";
const TABLE_GROUPS = ["소요량", "계수"];
@@ -55,6 +56,7 @@ function buildPage(): HTMLElement {
let dispose = (): void => {};
let logicMounted = false;
let labMounted = false;
let comboHandle: ComboHandle | null = null;
/* --- 우측: 머리(제목·찾기·저장) + 알림 + 본문 --- */
const title = el("h2", { className: "m01-master__title", text: L("M01_PickFile") });
@@ -71,6 +73,7 @@ function buildPage(): HTMLElement {
});
const logicHost = el("div", { className: "m01-master__logic", attrs: { hidden: "" } });
const labHost = el("div", { className: "m01-master__logic", attrs: { hidden: "" } });
const comboHost = el("div", { className: "m01-master__logic", attrs: { hidden: "" } });
const elementView = el("div", {
className: "m01-master__elements",
children: [head, notice, body],
@@ -88,9 +91,10 @@ function buildPage(): HTMLElement {
onDraftChange(refreshBar);
refreshBar();
const showMode = (mode: "elements" | "logic" | "lab"): void => {
const showMode = (mode: "elements" | "logic" | "lab" | "combo"): void => {
logicHost.hidden = mode !== "logic";
labHost.hidden = mode !== "lab";
comboHost.hidden = mode !== "combo";
elementView.hidden = mode !== "elements";
};
@@ -207,8 +211,24 @@ function buildPage(): HTMLElement {
void import("./M01_MasterData_UI_LogicLab").then((m) => m.mountM01LogicLab(labHost, side));
};
/** 「일위대가 조합」 — 목록을 새로 받아 그림 · 로직 줄을 누르면 단가산출 로직 탭으로 */
const openComboTab = (): void => {
dispose();
dispose = (): void => {};
current = null;
showMode("combo");
if (comboHandle) {
void comboHandle.show();
return;
}
void import("./M01_MasterData_UI_Combo").then((m) => {
comboHandle = m.mountM01Combo(comboHost, side, (key) => openLogicTab(key));
void comboHandle.show();
});
};
/* --- 좌측: 컨테이너 --- */
const side = buildSide(openFile, () => openLogicTab(), openLabTab);
const side = buildSide(openFile, () => openLogicTab(), openLabTab, openComboTab);
const layout = el("div", { className: "ui-workflow-layout m01-master" });
const main = el("main", {
@@ -216,7 +236,7 @@ function buildPage(): HTMLElement {
children: [
el("div", {
className: "m01-master__panel",
children: [elementView, logicHost, labHost],
children: [elementView, logicHost, labHost, comboHost],
}),
],
});
+17 -4
View File
@@ -1,7 +1,7 @@
/* =============================================================================
* M01_MasterData_UI_Side.ts
* 왼쪽 패널 — 공용 접기 컨테이너(`ui-collapsible ui-sidebar-section`) 여덟
* 인력 · 재료 · 기계 · 소요량 · 계수 · 환율 · 요율 · 단가산출 로직
* 왼쪽 패널 — 공용 접기 컨테이너(`ui-collapsible ui-sidebar-section`) 아홉
* 인력 · 재료 · 기계 · 소요량 · 계수 · 환율 · 요율 · 단가산출 로직 · 일위대가 조합
* 펼치면 하위 목록(거름 · 파일) · 환율/요율은 누르면 바로 표 · 로직은 안에 로직 목록
* ========================================================================== */
@@ -10,6 +10,7 @@ import { attachCollapsible } from "@ui/ui_template_collapsible";
import { t as L } from "@ui/ui_template_locale";
import { fetchFiles, fetchSubsAll, type FileInfo, type SubInfo } from "./M01_MasterData_Api_Fetch";
import { tx } from "./M01_MasterData_UI_Logic_Text";
import { tc } from "./M01_MasterData_UI_Combo_Text";
import { renderTree, type MakeRow } from "./M01_MasterData_UI_Tree";
/** 컨테이너마다 기억하는 화면 상태 — 찾기 글 · 쪽 · 소요량·계수 표의 용도 대상 거름 (거름은 `m01.filter.*`) */
@@ -75,6 +76,8 @@ export interface SideHandle {
root: HTMLElement;
/** 단가산출 로직 컨테이너 안(로직 목록이 들어갈 자리) */
logicHost: HTMLElement;
/** 일위대가 조합 컨테이너 안(구분 · 상세구분 거름이 들어갈 자리) */
comboHost: HTMLElement;
/** 「로직 개선 시험」 컨테이너 안 */
labHost: HTMLElement;
/** 그룹의 파일 판본을 다시 받음(저장 뒤) — 돌려받는 것 = 새 목록 */
@@ -133,11 +136,13 @@ const LEAF: Group[] = ["환율", "요율"];
const FILTERED: Group[] = ["인력", "기계", "소요량", "계수"];
const LOGIC_ID = "로직|";
const LAB_ID = "로직시험|";
const COMBO_ID = "조합|";
export function buildSide(
onOpen: (pick: Pick) => void,
onLogic: () => void,
onLab: () => void,
onCombo: () => void = () => {},
): SideHandle {
const lists = new Map<Group, FileInfo[]>();
const bodies = new Map<Group, HTMLElement>();
@@ -427,6 +432,14 @@ export function buildSide(
onLogic();
});
const comboHost = el("div", { className: "m01-side__items" });
const combo = section(tc("Title"), comboHost);
combo.querySelector(".ui-collapsible__title")?.addEventListener("click", () => {
if (!combo.classList.contains("is-collapsed")) return;
setActive(buttons.has(COMBO_ID) ? COMBO_ID : null);
onCombo();
});
const labHost = el("div", { className: "m01-side__items" });
const lab = section(tx("Lab_Title"), labHost);
lab.querySelector(".ui-collapsible__title")?.addEventListener("click", () => {
@@ -435,7 +448,7 @@ export function buildSide(
onLab();
});
const root = el("div", { className: "m01-side", children: [...groups, logic, lab] });
const root = el("div", { className: "m01-side", children: [...groups, logic, combo, lab] });
attachCollapsible(root);
void Promise.all(GROUPS.map(refresh)).catch((error) =>
showToast(error instanceof Error ? error.message : L("M01_LoadFailed"), "error"),
@@ -443,5 +456,5 @@ export function buildSide(
const setOnPicked = (fn: () => void): void => {
onPicked = fn;
};
return { root, logicHost, labHost, refresh, setActive, setOnPicked, filter };
return { root, logicHost, comboHost, labHost, refresh, setActive, setOnPicked, filter };
}