eomsangdonandClaude Opus 5
15c2d81b49
`_UI_Cross_View` 784줄 → 698줄. 도면과 무관한 제목행·하단 정보행을 `_UI_Cross_Card_Chrome` 으로 옮기고, 실효 표시 반폭 계산은 순수 계산이라 `_UI_Cross_View_Metrics` 로, 측점별 줌·팬 상태 맵은 임자인 `_UI_Cross_View_Zoom` 으로 옮겼다. 계산·판정 규칙은 그대로다. 검증 — 공용 브라우저 B06 실측: 카드 65·제목행 65·하단행 65·단면유형 pill 65·사면 미교차 경고 13, 첫 카드 제목행 `0+0.0 / 0.0m / 토사·리핑암·발파암 / 편측 성토 / BP` 로 종전과 동일. pytest 383 passed·17 skipped, typecheck·prettier 통과. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
103 lines
4.6 KiB
TypeScript
103 lines
4.6 KiB
TypeScript
/* =============================================================================
|
|
* B06_Section_UI_Cross_Card_Chrome.ts
|
|
* 횡단 카드의 **껍데기**(제목행·하단 정보행)만 떼어 낸 조립기 (2026-09-03 · 700줄 제한).
|
|
*
|
|
* 카드 본체(`_UI_Cross_View`)는 SVG 도면과 조작을 맡고, 도면과 무관한 머리·꼬리는 여기서
|
|
* 만든다. 여기 있는 것은 전부 **읽어서 붙이는 값**이라 카드 상태(줌·선택)를 건드리지 않는다.
|
|
* ========================================================================== */
|
|
|
|
import type { CrossSection } from "./B06_Section_Api_Fetch";
|
|
import type { RockBoundaryControl } from "./B06_Section_UI_Cross_Design";
|
|
import {
|
|
buildDesignControls,
|
|
buildRockBoundaryControl,
|
|
sectionModeLabel,
|
|
} from "./B06_Section_UI_Cross_Design";
|
|
import { type DesignChangeHandler, L, stationLabel } from "./B06_Section_UI_Section_Common";
|
|
|
|
/**
|
|
* 카드 제목행을 만들어 카드에 붙인다(설계 조작이 있으면 조작 바까지).
|
|
*
|
|
* 1행 구조(E-2/E-3): 측점 위치표기 → 지반유형 → 단면유형 pill → 구조물 → 측점정보.
|
|
*/
|
|
export function appendCardHeader(
|
|
card: HTMLElement,
|
|
section: CrossSection,
|
|
stationInterval: number,
|
|
onDesignChange?: DesignChangeHandler,
|
|
): void {
|
|
const header = document.createElement("header");
|
|
const title = document.createElement("div");
|
|
title.className = "b06-cross-card__title";
|
|
const label = document.createElement("strong");
|
|
label.textContent = stationLabel(section.chainage_m, stationInterval);
|
|
const chainage = document.createElement("span");
|
|
chainage.textContent = `${section.chainage_m.toFixed(1)}m`;
|
|
title.append(label, chainage);
|
|
|
|
// 단면유형 pill(자동 판정, 읽기 전용) — 구조물 pill과 동일 표기, 좌측 배치(E-3).
|
|
const modePill = document.createElement("span");
|
|
modePill.className = "b06-cross-card__mode";
|
|
modePill.textContent = sectionModeLabel(section.design?.section_mode);
|
|
modePill.title = L("B06_Design_Mode_Legend");
|
|
|
|
const meta = document.createElement("div");
|
|
meta.className = "b06-cross-card__meta";
|
|
// 사면이 계산 반폭 끝까지 원지반을 못 만난 측점 — 면적이 거기서 잘려 유토곡선까지
|
|
// 그 값을 쌓는다. 계산은 손대지 않고 사실만 알린다(2026-09-03 사용자 확정).
|
|
if (section.design?.slope_unclosed) {
|
|
const openSlope = document.createElement("span");
|
|
openSlope.className = "b06-cross-card__warning";
|
|
openSlope.textContent = `⚠ ${L("B06_Cross_SlopeUnclosed")}`;
|
|
openSlope.title = L("B06_Cross_SlopeUnclosed_Tip");
|
|
meta.append(openSlope);
|
|
}
|
|
if (section.structure) {
|
|
const structure = document.createElement("span");
|
|
structure.className = "b06-cross-card__structure";
|
|
structure.textContent = section.structure;
|
|
structure.title = `구조물: ${section.structure}`;
|
|
meta.append(structure);
|
|
}
|
|
// 측점 종류는 시·종점(BP/EP)만 적는다 — "일반측점"은 대다수라 정보가 없다(2026-08-02 사용자 지시).
|
|
if (section.kind === "bp" || section.kind === "ep") {
|
|
const kind = document.createElement("span");
|
|
kind.textContent = L(
|
|
section.kind === "ep" ? "B06_Profile_View_Kind_EP" : "B06_Profile_View_Kind_BP",
|
|
);
|
|
meta.append(kind);
|
|
}
|
|
|
|
// 단면유형 pill은 지반유형 우측·우측 맞춤으로 배치(1번). 좌측 구분선은 지반유형 세그먼트에 준다(3번).
|
|
modePill.classList.add("b06-cross-card__mode--right");
|
|
header.append(title);
|
|
if (onDesignChange) {
|
|
const controls = buildDesignControls(section, onDesignChange);
|
|
controls.groundSegment.classList.add("b06-cross-card__ground");
|
|
header.append(controls.groundSegment, modePill, meta);
|
|
card.append(header, controls.bar);
|
|
return;
|
|
}
|
|
header.append(modePill, meta);
|
|
card.append(header);
|
|
}
|
|
|
|
/** 하단 정보행 — 중심고와 (암 지반일 때) 암 경계선 제어. */
|
|
export function appendCardFooter(
|
|
card: HTMLElement,
|
|
section: CrossSection,
|
|
rockBoundary?: RockBoundaryControl,
|
|
): void {
|
|
const footer = document.createElement("footer");
|
|
const center = document.createElement("span");
|
|
center.textContent = `${L("B06_Profile_View_CenterElevation")} ${section.center_z?.toFixed(2) ?? "-"}m`;
|
|
footer.append(center);
|
|
// 암 경계선 제어는 하단 정보 행 가운데(2026-08-02) — 암 지반만.
|
|
if (rockBoundary && section.design?.geometry_preset === "rock") {
|
|
const rockControl = buildRockBoundaryControl(section, rockBoundary);
|
|
rockControl.classList.add("b06-cross-card__rockb");
|
|
footer.append(rockControl);
|
|
}
|
|
card.append(footer);
|
|
}
|