eomsangdonandClaude Opus 5.5
eb64bf64ac
- 공용 줄 쌓기 화면: 페이지가 저장을 맡는 꼴(`page`)을 M02 단가산출 화면에도 — 탭 위 [고침 버림] · [수식 저장] 걷음 · M02 사본 [단가 갱신] · [재생성] · 「M01 새 판」 배지는 그대로 · 「줄 쌓기에서 못 고치는 칸」 안내 줄 걷음(금액 줄 기호 = 율 줄이 앞 줄 금액을 부르는 속 이름 · 화면에서 고칠 값 아님 · 보존 그대로) - M02 머리 단추 = [초기화] · [삭제] · [되돌림] · [저장] — 단가산출 상세는 [새로고침] 숨김 · [되돌림] · [저장] = 고침 있을 때만(기본정보 + 수식) · [저장] 한 번 = 수식 먼저 저장(새 판 · 수식 칸 받음) → 단가산출 문서 저장 · [되돌림] · 버리고 떠남 = 수식 캐시도 비움 - 보기 고르기(수식 · 단가산출 상세) = M01 처럼 머리 줄 · [항목 추가] · [율 줄 추가] 걷음(줄 더하기 = 수식 탭 [+] 단가산출 · 일위대가 복사) · 일위대가 줄 모달 안 상세는 그대로 - 머리 단추 줄 맞춤(부품 상자 `fitButtonRow`): 단추가 아래로 떨어지거나 제목이 여러 줄이면 아이콘 단추는 아이콘만(글 = 풍선 도움말) · M01 단추 다섯 · M02 단추 넷 아이콘 · 단가산출 상세 긴 이름은 제목 안에서 줄바꿈 - 사본 할일 막힘 알림 글 = [저장] 또는 [되돌림] 먼저 - 시험: test_804_7 에 M02 단추 · 저장 한 번 · 줄 맞춤 지킴 더함 · test_804_4 권한 시험에 수식 저장 판 = 페이지 저장 판 이어 씀 확인 더함 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
39 lines
1.9 KiB
TypeScript
39 lines
1.9 KiB
TypeScript
/* =============================================================================
|
|
* M01_MasterData_UI_Head.ts
|
|
* 마스터 화면 머리 공용 조각 — 제목 줄(제목 왼쪽 · 단추 오른쪽) + 찾기 줄.
|
|
* 인력 · 재료 · 유가·전력 · 기계 · 소요량 · 계수 · 환율 · 요율 상세와 「단가산출 로직」 화면이 같은 조각을 써
|
|
* 제목 크기 · 자리 · 단추 차례 · 공용 단추 크기 · 찾기 칸 꼴이 한 벌로 같음.
|
|
* ========================================================================== */
|
|
|
|
import { fitButtonRow } from "@ui/ui_template_button";
|
|
import { el } from "@ui/ui_template_elements";
|
|
import "./M01_MasterData_UI_Head.css";
|
|
|
|
export interface HeadOptions {
|
|
/** 제목 앞에 놓을 것(예: ← 목록 단추) */
|
|
lead?: HTMLElement[];
|
|
/** 제목 — 글이면 h2 를 만듦 */
|
|
title: HTMLElement | string;
|
|
/** 제목 바로 뒤 · 단추 앞 알림(고친 개수 등) */
|
|
status?: HTMLElement[];
|
|
/** 오른쪽 단추 — 차례 그대로(공용 단추 · 크기를 덮지 않음) */
|
|
buttons: HTMLElement[];
|
|
}
|
|
|
|
/** 제목 줄 — 제목은 18px · 왼쪽 · 남는 자리를 차지해 단추를 오른쪽으로 밂 · 넘치면 아이콘 단추는 아이콘만(804-8) */
|
|
export function buildHeadBar(opts: HeadOptions): { root: HTMLElement; title: HTMLElement } {
|
|
const title = typeof opts.title === "string" ? el("h2", { text: opts.title }) : opts.title;
|
|
title.classList.add("m01-head__title");
|
|
const root = el("div", {
|
|
className: "m01-head",
|
|
children: [...(opts.lead ?? []), title, ...(opts.status ?? []), ...opts.buttons],
|
|
});
|
|
fitButtonRow(root);
|
|
return { root, title };
|
|
}
|
|
|
|
/** 찾기 줄 — 찾기 칸 · 거름 · 쪽 넘기기를 위에서 아래로 쌓음 */
|
|
export function buildHeadFilters(children: HTMLElement[]): HTMLElement {
|
|
return el("div", { className: "m01-head__filters", children });
|
|
}
|