# 검증 보고서: B05 사이드바/레이아웃 정비 및 후속 과제 검증 - **검증 일시**: 2026-07-24 - **검증 대상**: B05 사이드바 레이아웃 정비, B05 후속 2(캐럿/하이라이트 통일/공사 시작 오프셋), B05/B06/B07 후속 과제 일체 - **검증 상태**: **PASS** (모든 계획서 항목 구현 완료 확인) --- ## 1. 개요 본 보고서는 `docs/raw/PLAN.md`에 추가 수립된 B05 레이아웃 정비 및 후속 개선 항목들이 소스코드 상에 올바르게 적용되었는지를 검증한 결과입니다. 공용 UI 컴포넌트 추출과 측점 오프셋 연동 등 아키텍처 정합성을 정밀하게 유지한 채 완료되었음을 보증합니다. --- ## 2. 기능 체크리스트 및 검증 결과 ### 2.1. [B05] 사이드바 제목/레이아웃 정비 - [x] **워크플로 상단 제목 `"노선 설계"` → `"종단 설계"`** - **검증**: `B05_wf2_Route_UI_Page.ts`의 `createWorkflowLayout` 호출 인수 중 `title` 속성이 `"종단 설계"`로 정확히 변경되었습니다. - [x] **`측점·횡단 옵션` → `측점 및 샘플링 설정` 다국어 적용** - **검증**: `ui_template/ui_template_locale.ts`의 `B05_Route_Group_SectionOptions` 키값이 `"측점 및 샘플링 설정"`으로 업데이트 완료되었습니다. - [x] **`계획선(시공계획고) 설계` → `종단 설계 기준`** - **검증**: `B05_wf2_Route_UI_Panel.ts`에서 해당 섹션 생성 타이틀이 `"종단 설계 기준"`으로 대체되었습니다. - [x] **`이어 공사 시작 기준` → `공사 시작점`** - **검증**: `B05_wf2_Route_UI_Panel.ts`에서 섹션 생성 타이틀이 `"공사 시작점"`으로 변경되었습니다. - [x] **`공사 시작점` 2열×2행 레이아웃 배치** - **검증**: `B05_wf2_Route_UI_Panel.ts`에 `b05-route__field-row` 컨테이너가 추가되고 하위 입력 필드(`시작 측점`·`시작 누가거리`)가 내포되었습니다. `B05_wf2_Route_UI_Style.css`에 `grid-template-columns: repeat(2, minmax(0, 1fr))` 그리드가 정상 선언되어 2열 구조를 형성합니다. - [x] **`비정규 측점 (구조물)` → `구조물 배치`** - **검증**: `B05_wf2_Route_UI_IrregularStations.ts`의 타이틀이 `"구조물 배치"`로 변경 완료되었습니다. ### 2.2. [B05 후속 2] 캐럿/하이라이트 통일/시작측점 - [x] **접기 캐럿 크게** - **검증**: `ui_template/ui_template_theme.css`의 `.ui-collapsible__title::after` 가상 요소의 `font-size`가 `1.7em`으로 최대 확장되었으며, `margin-block: -0.4em`과 조합하여 행 높이에 영향을 주지 않으면서 크게 표시되도록 조정되었습니다. - [x] **선택 하이라이트를 오버레이 방식으로 통일** - **검증**: `B05_wf2_Route_UI_Profile_Table.ts`에서 기존 비정규 측점용 `buildIrregularColumn` 함수가 규칙 측점도 대응할 수 있도록 `buildSelectedColumn` 공용 함수로 일반화되었습니다. - **종점 처리**: 종점의 수평 밀림 현상을 보정하기 위해 규칙 측점 렌더링 시에는 `centers[index]`를, 비정규 측점 렌더링 시에는 `x(chainage)`를 `centerX`로 받아 물리적 정렬을 정확히 맞췄습니다. - [x] **공사 시작 측점/누가거리 오프셋 연동** - **검증**: `B05_wf2_Route_UI_Panel.ts`에서 반환하는 `stationDisplayOffset` 값이 `B05_wf2_Route_UI_Page.ts` 및 하단 패널에 `setStationDisplay`로 전달됩니다. - **오프셋 렌더링**: `Profile_Table.ts`의 `buildStationRows` 및 `buildSelectedColumn`에서 누가거리 표시 시 `display.cumulative`를 더하고, 측점 라벨 생성 시 `displayStationLabel`로 정수형 오프셋을 결합하도록 수정되었습니다. `B06_..._UI_Longitudinal.ts`의 SVG 그래프 측점 라벨 렌더링 시에도 오프셋이 정상 전달되어 표시 오프셋 이동이 완벽히 연동됩니다. ### 2.3. [B05/B06/B07 후속] 기능성/구조성 추가 개선 - [x] **규칙 측점 선택 시 테이블 하이라이트** - **검증**: `B05_wf2_Route_UI_Profile_Table.ts`에서 `selectedRegularIndex >= 0`일 때도 공용 오버레이인 `buildSelectedColumn`를 호출하여 테이블 행들을 세로로 하이라이트하도록 구성되었습니다. - [x] **비정규 측점 구조물 → B06 횡단도 카드에 표시** - **검증**: `B06_wf3_ProfileCross_UI_Cross_View.ts`에서 `section.structure`가 존재하는 경우 `b06-cross-card__structure` 클래스를 가진 요소를 생성해 kind 라벨 좌측에 추가하고 툴팁 타이틀을 주도록 구현되었습니다. - [x] **충돌 시 규칙 측점 우선 + 구조물 유지** - **검증**: Python 백엔드 `B05_wf2_Route_Engine_Sections_Core.py`에서 비정규 측점이 규칙 격자 chainage에 중복되어도 `kind`는 `regular` 우선권을 갖도록 `regular_rounded` 셋을 통한 충돌 분기를 설정하였으며, 구조물 데이터인 `station["structure"] = extras[rounded]`는 정상적으로 부착되도록 구조적으로 격리 구현되었습니다. - [x] **컨테이너 접기 트리거를 제목 전체로 확대 + B07 재활용** - **검증**: `ui_template/ui_template_collapsible.ts` 유틸에 `.ui-collapsible__title`을 래핑하는 공용 `attachCollapsible` 함수가 선언되었습니다. `B05_wf2_Route_UI_Panel.ts` 및 `B07_wf4_DesignDetail_UI_Page.ts`에서 `attachCollapsible(panel)` 형태로 재사용을 진행하고 있어 제목 전체 클릭만으로 섹션이 유기적으로 토글됩니다. --- ## 3. 결론 추가 계획된 B05 UI 리팩토링 및 다각적 연동 버그 개선 등 복합 후속 태스크(A~D)가 코드 상에 고품질로 반영되었습니다. 이로써 검증 과정을 통과하고 완료 계획을 역사적 이력으로 이관 보존합니다.