feat(713-3): M01 로직 목록 묶음 접기 — 같은 절 · 작업량 로직은 머리 줄 밑으로 접음(접기 순수 함수 logic/list_fold) · 찾는 중엔 펼침 · 「관련」 열 = 비고가 가리키는 로직 링크(계산 밖) · 서버 덧칸 인재경 줄 수(712-1 master_bundle) · 지킴 시험

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-11-01 16:47:28 +09:00
co-authored by Claude Opus 5.5
parent 1e6092fad8
commit c0f3d21908
5 changed files with 212 additions and 21 deletions
+85 -19
View File
@@ -3,13 +3,18 @@
* 로직 목록 — 가운데 표 · 왼쪽 「전체」 + 구분 → 상세구분 거름이 고른 범위 + 이름 찾기
* 파일을 가로질러 한 목록 · 쪽 나눔 · 막힘(⛔)·고침(●) 표시 · 거르기는 화면에서(목록은 한 번 받음)
* 「별칭」 열(208-1) — 이름 옆 · 고치면 `onAlias`(캐시에 쌓고 [저장] 때 나감) · 찾기는 공용 `matchLogic`
* 묶음 접기(713-3) — 같은 절 · 작업량 로직은 머리 줄 밑으로 접음(`logic/…_list_fold`) · 찾는 중엔 펼침
* 「관련」 열 = 비고가 가리키는 로직 링크(계산 밖) · 덧칸은 서버 `/logics` 가 줌(정본 그대로)
* ========================================================================== */
import { createBadge } from "@ui/ui_template_badge";
import { createButton, createIconButton } from "@ui/ui_template_button";
import { createInputField, el } from "@ui/ui_template_elements";
import { aliasText, matchLogic } from "@ui/ui_template_logic_find";
import { buildPager } from "./M01_MasterData_UI_Cells";
import { pageKeepFirst, watchFit } from "@ui/ui_template_pager";
import type { LogicSummary } from "./M01_MasterData_UI_Logic_Api";
import { foldRows, type FoldRow } from "./logic/M01_MasterData_logic_list_fold";
import { tx } from "./M01_MasterData_UI_Logic_Text";
import "./M01_MasterData_UI_Head.css";
@@ -28,6 +33,18 @@ export interface ListItem {
source: string;
blocked: boolean;
reasons: string[];
/** 묶음 열쇠(파일 + 원문번호) · 작업량이면 부르는 로직 · 비고가 가리키는 로직(713-3) */
group?: string;
parents?: string[];
related?: string[];
}
/** `/logics` 덧칸(713-3 · `M01_MasterData_Store_List`) */
interface ListExtra {
묶음?: string;
작업량?: boolean;
부모?: string[];
관련?: string[];
}
export interface ListHandle {
@@ -52,6 +69,7 @@ const COLS = [
"별칭",
"결과 단위",
"출처",
tx("List_Related"),
"",
] as const;
@@ -66,6 +84,7 @@ export function buildList(
const aliasOf = (x: ListItem): string => aliases.get(x.id) ?? x.alias;
let page = 1;
let size = DEFAULT_SIZE;
const open = new Set<string>(); // 펼친 머리 줄 키
const pick = { sub: "", detail: "" };
const searchField = createInputField({ type: "search", placeholder: tx("List_Search") });
const search = searchField.input;
@@ -86,9 +105,10 @@ export function buildList(
별칭: aliasOf(x),
}).ok,
);
page = Math.min(page, Math.max(1, Math.ceil(shown.length / size)));
const rows = shown.slice((page - 1) * size, page * size).map(line);
pager.replaceWith((pager = buildPager(shown.length, size, page, go)));
const folded = foldRows(shown, open, q.trim() !== "");
page = Math.min(page, Math.max(1, Math.ceil(folded.length / size)));
const rows = folded.slice((page - 1) * size, page * size).map(line);
pager.replaceWith((pager = buildPager(folded.length, size, page, go)));
grid.replaceChildren(
el("table", {
className: "ui-table m01-master__grid",
@@ -105,7 +125,7 @@ export function buildList(
page = p;
draw();
};
const line = (item: ListItem): HTMLElement => {
const line = ({ item, depth, hidden, open: isOpen }: FoldRow<ListItem>): HTMLElement => {
const mark = marks.get(item.id);
const state = [
item.blocked ? `⛔ ${tx("List_Blocked")}` : "",
@@ -119,9 +139,13 @@ export function buildList(
const tr = el("tr", {
className: `m01-master__table-row${mark ? " is-changed" : ""}`,
children: [
...[item.key, item.number, item.sub, item.detail, item.name].map(cell),
keyCell(item, hidden, isOpen),
...[item.number, item.sub, item.detail].map(cell),
cell(depth ? `└ ${item.name}` : item.name),
aliasCell(item, mark === "deleted"),
...[item.unit, item.source, state].map(cell),
...[item.unit, item.source].map(cell),
relatedCell(item),
cell(state),
],
});
if (item.blocked) tr.title = item.reasons.join("\n");
@@ -129,6 +153,42 @@ export function buildList(
return tr;
};
/** 키 칸 — 묶음 머리면 접기 단추 + 접힌 줄 수 · 단추는 로직을 안 엶 */
const keyCell = (item: ListItem, hidden?: number, isOpen?: boolean): HTMLElement => {
if (!hidden) return el("td", { text: item.key, attrs: { title: item.key } });
const toggle = createIconButton({
icon: isOpen ? "chevronDown" : "chevronRight",
title: isOpen ? tx("List_Unfold") : tx("List_Fold", { n: hidden }),
size: 18,
pressed: Boolean(isOpen),
onClick: (e) => {
e.stopPropagation();
if (open.has(item.key)) open.delete(item.key);
else open.add(item.key);
draw();
},
});
const count = createBadge(`+${hidden}`, "neutral", { size: 18 });
return el("td", { children: [toggle, item.key, " ", count], attrs: { title: item.key } });
};
/** 관련 칸 — 비고가 가리키는 로직 키 링크(계산 밖) · 누르면 그 로직이 열림 */
const relatedCell = (item: ListItem): HTMLElement => {
const links = (item.related ?? []).map((key) =>
createButton({
label: key,
variant: "link",
size: 18,
onClick: (e) => {
e.stopPropagation();
const found = items.find((x) => x.key === key);
if (found) onOpen(found);
},
}),
);
return el("td", { children: links, attrs: { title: tx("List_RelatedTip") } });
};
/** 별칭 칸 — 눌러도 로직이 안 열림 · 고친 글은 「a, b」 꼴로 */
const aliasCell = (item: ListItem, locked: boolean): HTMLElement => {
const input = el("input", {
@@ -172,19 +232,25 @@ export function buildList(
return {
root,
setItems: (logics) => {
items = logics.map((x) => ({
id: logicId(x.구분, x.키),
sub: x.구분,
detail: x.상세구분,
key: x.키,
number: x.원문번호,
name: x.이름,
alias: x.별칭 ?? "",
unit: x.결과단위,
source: x.출처,
blocked: x.blocked,
reasons: x.reasons,
}));
items = logics.map((one) => {
const x = one as LogicSummary & ListExtra;
return {
id: logicId(x.구분, x.키),
sub: x.구분,
detail: x.상세구분,
key: x.키,
number: x.원문번호,
name: x.이름,
alias: x.별칭 ?? "",
unit: x.결과단위,
source: x.출처,
blocked: x.blocked,
reasons: x.reasons,
group: x.묶음 ? `${x.file}|${x.묶음}` : "",
parents: x.작업량 ? (x.부모 ?? []) : [],
related: x.관련 ?? [],
};
});
draw();
},
setMarks: (next, more, edited) => {