Files
Aislo/B06_Section/B06_Section_UI_Page_Panel.ts
eomsangdonandClaude Sonnet 5.5 2c520537b6 refactor(B05·B06): 좌측 칸을 등록부로 · 아래 단추 넷 · B05 Panel 나눔(24-2b)
- B05 좌측 패널(714줄)을 Fields · Settings · Route · View · Sections 로 나누고 createRoutePanel 은 등록부로 세움
- B06 좌측 칸(횡단 보기 설정 · 표준 횡단면 설정)을 등록부로 · 페이지는 createDesignPanel 만 부름
- 「구조물 배치」는 design_sections 한 정의로 두 보기
- 아래 단추 [초기화][저장][확정][보기 전환] — B05 [확정]은 저장 흐름 이음 전까지 꺼 둠
- [초기화] 는 design_reset 한 함수를 두 보기가 부름
- 칸 DOM 은 고치기 전과 같음(전후 DOM 대조)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01EauA2ATmqNRbeV48s9CcBr
2026-09-29 20:17:35 +09:00

71 lines
2.9 KiB
TypeScript

/* =============================================================================
* B06_Section_UI_Page_Panel.ts
* 횡단 보기 좌측 패널의 **칸 정의**(등록부 `registerPanelSection`)와 그 재료 — 횡단 보기 설정 ·
* 표준 횡단면 설정. 「구조물 배치」는 두 보기 공용이라 `design_sections.ts` 에 있다.
*
* 칸 차례(2026-08-29 사용자 지시): 구조물 배치(최상단) > 횡단 보기 설정 > 표준 횡단면 설정 >
* 아래 고정 영역. 페이지(`B06_Section_UI_Page.ts`)는 칸도 단추도 직접 만들지 않고 여기 재료와
* `createDesignPanel` 만 쓴다(계획서 24-2b · 시험 `test_design_view_parity.py`).
* ========================================================================== */
import "../A00_Common/design/design_sections";
import { createSectionFrame, part, registerPanelSection } from "../A00_Common/design/design_panel";
import { createButton, createInputField } from "@ui/ui_template_elements";
import { L } from "./B06_Section_UI_Page_Common";
/** 「횡단 보기 설정」 재료 — 반폭 입력 + 자체 [보기 반폭 적용] 한 줄.
*
* 횡단 반폭은 **자체 컨테이너 + 자체 [보기 반폭 적용] 버튼**이다(2026-08-23 사용자 지시) — 표준
* 횡단면 설정의 [전체 측점 반영]에 물려 있어 반폭만 바꿔도 전 측점 설계 재계산을 기다려야 했다. */
export function createCrossViewPart(onApply: () => void) {
const field = createInputField({
label: L("B05_Route_Field_CrossHalfWidth"),
type: "number",
});
field.input.min = "0.1";
field.input.step = "0.1";
const applyButton = createButton({
label: L("B06_View_Apply"),
variant: "filled",
onClick: onApply,
});
applyButton.title = L("B06_View_Apply_Tip");
// 반폭 입력 + [적용]은 한 줄(2026-08-23 사용자 지시).
const row = document.createElement("div");
row.className = "b06-profile__field-row";
row.append(field.root, applyButton);
return { field, row };
}
export type CrossViewPart = ReturnType<typeof createCrossViewPart>;
/** 「표준 횡단면 설정」 패널이 들어갈 자리 — context 를 받은 뒤 패널을 채운다. */
export function createStandardSlot(): HTMLElement {
return document.createElement("div");
}
registerPanelSection({
id: "cross-view",
title: L("B06_View_Title"),
views: ["cross"],
order: 20,
build: (ctx, view) => {
const frame = createSectionFrame(view, L("B06_View_Title"));
frame.body.append(part<CrossViewPart>(ctx, "crossView").row);
return frame.root;
},
});
registerPanelSection({
id: "standard-cross",
title: L("B06_Std_Title"),
views: ["cross"],
order: 30,
build: (ctx, view) => {
// 표준 횡단면 설정은 기본 접힘(2026-08-23 사용자 지시) — 자주 여는 칸이 아니다.
const frame = createSectionFrame(view, L("B06_Std_Title"), true);
frame.body.append(part<HTMLElement>(ctx, "standardSlot"));
return frame.root;
},
});