- `docs/` 를 .gitignore 에서 빼 git 추적 대상으로 전환 (위키·완료 이력·검증 기록) - `docs/raw/PLAN.md` · `docs/raw/OWNERS.md` 를 저장소 최상위로 이동 후 .gitignore 에 등록 — 창끼리 공유하되 저장소에는 안 올리는 장부 - 살아 있는 경로 참조 7개 파일 정정 (아카이브 107건은 그때 사실이라 그대로 둠) - graphify 날짜별 산출물(`docs/wiki/graphify-out/20*/`) 제외 — `graphify update` 가 다시 만듦 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
12 KiB
12 KiB
type, status, page_id, related_pages, last_updated, source
| type | status | page_id | related_pages | last_updated | source | |||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| page-frontend | stable | B06_Section |
|
2026-08-22 |
|
B06_Section — Frontend
B05 일반 구조물 정본과 STALE 경계는 B05_Profile/B05_structures에 구현됐다. 배수관 횡단도 세트는 B06_Section/B06_culvert_set에 완료 반영했으며, 나머지 구조물 표현은
docs/raw/PLAN.md의 통합 표를 다음 입력으로 사용한다.
파일 구성
| 파일 | 위키 명세 문서 | 역할 |
|---|---|---|
B06_Section_UI_Page.ts |
[[B06_Section/frontend/B06_Section_UI_Page]] |
결과 요약 및 종횡단 변경 감지 자동재계산(reconcileStaleDesigns), B07 자동 이동 |
B06_Section_UI_Section_View.ts |
[[B06_Section/frontend/B06_Section_UI_Section_View]] |
0_old SVG 도면 이식, 반응형 열 수 정합, 패널 접기 손잡이 B05 방식으로 맞춤, 휠 가로 스크롤 |
B06_Section_UI_Cross_Design.ts |
[[B06_Section/frontend/B06_Section_UI_Cross_Design]] |
횡단 측점별 컨트롤, 암 경계선 ▲/▼ hold-repeat 타이머, 측구 미생성 시 비활성화 |
B06_Section_UI_Cross_Culvert_Geom.ts |
[[B06_Section/B06_culvert_set]] |
배관·기슭막이/집수정·보호공 기하와 계획선 트림 계산 |
B06_Section_UI_Cross_Culvert.ts |
[[B06_Section/B06_culvert_set]] |
배수관 세트 SVG 표시와 기하 모듈 재수출 |
B06_Section_UI_Cross_Areas.ts |
[[B06_Section/frontend/B06_Section_UI_Cross_Areas]] |
[신설/2026-08-02] EA/RR/BR 2x4 면적표 렌더링, 밴드 하이라이트 및 버블링 방지 |
B06_Section_UI_MassHaul.ts |
[[B06_Section/frontend/B06_Section_UI_MassHaul]] |
[신설/2026-08-02] 유토곡선 토사/암반 다짐률 순토량/누가토량 계산 엔진 |
| B06_Section_UI_MassHaul_View.ts | B06_Section/frontend/B06_Section_UI_MassHaul_View | 유토곡선 SVG 렌더러. 구간 물량 말풍선화(SVG), Y축 자동 스케일링, 0선 눈금 표시 |
| B06_Section_UI_MassHaul_Balance.ts | B06_Section/frontend/B06_Section_UI_MassHaul_Balance | [신설/2026-08-02] 평형선 순차 탐색 및 장비 띠(HaulBand) 분할 엔진 (526줄) |
| B06_Section_UI_MassHaul_Balance_View.ts | B06_Section/frontend/B06_Section_UI_MassHaul_Balance_View | [신설/2026-08-02] 운반 띠 반투명 다각형 렌더러 및 띠 아웃라인 클램핑 |
| B06_Section_UI_MassHaul_Balloon.ts | B06_Section/frontend/B06_Section_UI_MassHaul_Balloon | [신설/2026-08-02] 육각 balloon 배치(링 탐색 findSlot), 지시선 정렬, 드래그 및 오프셋 보관 |
| B06_Section_UI_MassHaul_Curve.ts | B06_Section/frontend/B06_Section_UI_MassHaul_Curve | [신설/2026-08-02] 포물선/직선 보간 연산 및 2차 베지에 궤적 드로잉 보조 |
| B06_Section_UI_MassHaul_Settle.ts | B06_Section/frontend/B06_Section_UI_MassHaul_Settle | [신설/2026-08-02] 잉여/부족 장거리 상쇄(HaulTransfer) 및 수량 항등식 검산 칩 연산 |
B06_Section_UI_Standard_Diagram.ts |
[[B06_Section/frontend/B06_Section_UI_Standard_Diagram]] |
세로형 인라인 SVG 표준단면 모식도 컴포넌트 |
B06_Section_UI_Standard_Panel.ts |
[[B06_Section/frontend/B06_Section_UI_Standard_Panel]] |
[전체 반영] 버튼, 타 프로젝트 설정 불러오기 |
B06_Section_Api_Fetch.ts |
[[B06_Section/frontend/B06_Section_Api_Fetch]] |
API 통신 클라이언트 (sections, regenerate, crossDesignOne 등) |
B06_Section_UI_Style.css |
(스타일시트) | 종횡단 전체 레이아웃 및 sticky 스크롤 스타일 |
| B06_Section_UI_Style_Cross.css | (스타일시트) | 횡단 십자선 마커, 구조물 세로 파선 독립 CSS 모듈 |
| B06_Section_UI_Style_Cross_Areas.css | (스타일시트) | [신설/2026-08-02] 면적 테이블 및 지반 밴드 하이라이트 스타일 CSS 모듈 |
B06_Section_UI_Style_MassHaul.css |
(스타일시트) | 유토곡선 범례 및 차트 레이아웃 스타일 독립 CSS 모듈 |
화면·workflow (조회 및 확정 전용)
| 항목 | 위치 | 역할 |
|---|---|---|
renderB06ProfileCross() |
B06_Section_UI_Page.ts:57 |
엔지니어링 레이아웃(createWorkflowLayout) 적용. 좌측 사이드바 routeGroup 아래 resultGroup에 결과 3개 메트릭 카드를 밀착 배치. [재계산] 버튼 신설 및 변경된 입력값(횡단 반폭)이 실제 적용된 값과 다른 stale 상태일 때만 [재계산] 버튼을 활성화하고 [확정] 버튼은 비활성화하는 상태 가드 연동. |
| 종횡단 확정 | B06_Section_UI_Page.ts:233 |
route별 종횡단을 confirmSections()로 확정 (미지정 측점은 기본값 토사+좌절토로 일괄 계산/저장 후 CONFIRMED 승격 및 성공 시 goToWorkflowStage를 통해 B07 자동 이동) |
| workflow 상태 조회 | B06_Section_UI_Page.ts:259 |
단계 상태와 진입 가능 단계 조회 |
| workflow layout 구성 | B06_Section_UI_Page.ts:271 |
공통 단계·경로·상태 표시 |
SVG 렌더러 및 유틸리티
| 항목 | 위치 | 역할 |
|---|---|---|
createLongitudinalProfile |
B06_Section_UI_Section_View.ts |
Vanilla TS와 createElementNS 기반 종단 지반고 폴리라인, 종단 계획선(design_profiles) 및 절성토 음영 렌더링. X축 제목을 상단으로 올려 하단을 측점 라벨용으로 비워두고 유토곡선과 공유하는 연출. |
createMassHaulChart |
B06_Section_UI_MassHaul_View.ts |
[신설/2026-08-02] 수직 정렬된 유토곡선 차트 렌더러. 0선 눈금값 "0" 표기, 선택 측점의 구간 물량 말풍선화(SVG), Y축 데이터 기반 동적 자동 스케일링, 가로 스크롤 및 줌 동기화. |
createCrossSectionCard |
B06_Section_UI_Section_View.ts |
개별 횡단 카드 렌더러: 중심선 계획고 기준 십자선 마커. [2026-08-02 개선] 절성토 EA/RR/BR 2x4 면적표(Cross_Areas) 렌더링 및 지반 밴드 하이라이트 클릭 연동, 버블링 차단(event.stopPropagation). |
calculateYScale |
B06_Section_UI_Section_View.ts |
종/횡단 표고 범위를 통일하는 Y스케일 계산 유틸리티 (지반고와 계획고 표고 범위를 합계해 잘림 방지). |
designElevationAt |
B06_Section_UI_Section_View.ts |
측점 chainage_m 기반 선형 보간 계획고 계산 헬퍼 (부재 시 지반고 폴백). |
| 마커 선택 연동 | B06_Section_UI_Page.ts |
종단도 측점 마커 클릭 시 대상 횡단도 카드로 스크롤 및 빨강 강조 아웃라인 연동. 히트 영역(14px)을 구성하여 마우스 클릭성 보완. |
stationLabel |
B06_Section_UI_Section_View.ts |
측점 라벨 표기 규칙 통일: "STA" 접두사를 제거하고 측점번호+잔여거리 형식(예: 4+0.0)으로 표기를 통일하며 소수점 첫째 자리까지 표기. |
API 클라이언트
| 항목 | 위치 | 역할 |
|---|---|---|
getSections() |
B06_Section_Api_Fetch.ts:93 |
route별 결과 요약 조회 |
confirmSections() |
B06_Section_Api_Fetch.ts:103 |
생성 결과 확정 요청 |
getSectionsDetail() |
B06_Section_Api_Fetch.ts:114 |
종단 결과 및 다수 횡단면 데이터 일괄 조회 요청 (SectionDetailResponse 매핑) |
regenerateSections() |
B06_Section_Api_Fetch.ts:125 |
횡단 반폭 재생성 요청 (SectionRegenerateRequest 매핑) |
crossDesignOne() |
B06_Section_Api_Fetch.ts |
[신설] 측점별 지반유형/단면유형 온디맨드 즉시 계산/저장 요청 (CrossDesignRequest 매핑) |
입력 옵션 (표시 옵션 및 횡단 반폭 제어)
- 측점/횡단 옵션 (3개 필드) B05로 이관: 기존의
station_interval_m,cross_sample_interval_m,long_sample_interval_m옵션은 노선 설계 단계인 [B05_Profile](file:///C:/Program_coding/임도설계 및 견적자동화 프로그램 개발/docs/wiki/pages/B05_Profile/B05_frontend.md)로 이관되었습니다. - B06 이관 및 신설 옵션:
cross_half_width_m(횡단 반폭): 기존 B05에서 제어하던 필드를 B06 좌측 사이드바로 이관하여 횡단도 폭 결정용으로 신설하였습니다.- 지반유형·단면유형 컨트롤 (측점별): 토사/리핑암/발파암 지반 3종, 좌절/우절/양절/양성 단면 4종, 측구위치(좌/우). 선택 시 즉시 단면적 계산 및 미리보기 차트에 반영. 미지정 측점은 확정 시 토사+좌절토 기본값으로 자동 일괄 계산/저장.
- 단일 소스화 초기값 연동: 도면 데이터를 로드할 때
summaryData?.options에 저장된 이전 반폭 정보를 1순위로 채택하여 화면 초기값으로 복원하며, 데이터 스냅샷이 존재하지 않는 레코드에 대해서만 폴백으로 측점 최대 offset 추정치를 사용합니다. - 값 변경 시
[재계산]버튼이 활성화되어, 이를 클릭 시 백엔드 재생성 API를 트리거하고 성공하면appliedHalfWidth를 갱신해 화면을 재렌더링하고[확정]버튼을 재활성화합니다.
- 남은 표시 옵션:
vertical_exaggeration: 종단/횡단도 SVG 렌더링용 실시간 Y축 배율 (사이드바의 "표시 옵션" 그룹으로 구성, 로컬 즉시 재렌더)route_id: 확정된 B05 경로 자동 연동 (B05에서 계산 완료된 상태에서만 진입 가능)
UI 패널 크기 및 리사이저 규칙 (2026-08-02 신설)
- 상하 리사이저 부착: 하단의 종단+유토곡선 패널 세로 크기를 조절할 수 있는 리사이저(
createPanelResizer)를 패널 하단 경계에 부착하고sessionStorage에 크기를 저장합니다. - 높이 분배 공식 (
chartHeights):- 총 패널 높이가 기본 높이
H0이상일 때: 종단도는220px로 높이가 고정되며, 유토곡선 SVG 영역이 늘어난 높이 몫을 전부 흡수합니다. - 총 패널 높이가
H0미만으로 축소될 때: 종단도와 유토곡선 영역의 높이가 동일한 비율로 축소됩니다.
- 총 패널 높이가 기본 높이
기술부채 (해결됨)
2026-08-22 파일 한계 정리
기능 변경 없이 책임을 분리했다. 현재 줄 수는 Style_Cross.css 564, Section_View.ts 672, Cross_Culvert_Geom.ts 700, Cross_View.ts 626, Page.ts 693, Cross_Design.ts 644로 모두 700줄 이하이다. TypeScript 검사와 Vite 빌드 통과 기록이 있으며 Git 작업은 하지 않았다.