절·성토 균형은 종단 시공계획고로 정해지고 사토장 위치도 계획고를 다시 끌어야 정리되므로, 계획용 유토곡선과 부지 선정을 B05로 옮겼다. B06은 실측 단면적으로 낸 정식 곡선과 확정·B08 인계를 맡는다. B05 계획 유토곡선 - _UI_Profile_MassHaul.ts: 종단면 패널 안 2차 하단 슬라이드. 펼치면 12행 도면 테이블 자리를 곡선이 대신 차지한다. 곡선 SVG를 종단 그래프와 같은 가로 스크롤러 안 형제로 넣고 MassHaulAxis에 LONG_PAD + originOffset을 넘겨 X축을 종단 chainageMapper와 일치시켰다. - computeLongitudinalMassHaul(): 횡단 설계가 없는 계획 단계용 개략 엔진. 표준횡단 노반폭을 전 구간 공통으로 물린다. 종단 기반 토량은 국내 기준상 노선계획 개산용 이므로(2026-08-03 조사) 표준단면까지 씌워 정밀화하지 않는다. 사토장·토취장 자동 선정 - B05_wf2_Route_Engine_Disposal.py + POST /route/disposal-sites: 노선 corridor DEM 격자를 훑어 후보 부지를 추리고 옵션별 점수로 정렬한다. 기준 4가지 — 비용(최단거리+하향 운반), 지형안정성(완경사·계곡 이격), 계곡부(계곡 축 매립), 임내 공간(라이다 수고 기반 공터). 기준값 정의처는 DISPOSAL_SITE_CRITERIA. - _UI_Profile_Disposal.ts: 범례 줄의 [토량 분배]와 [도형 위치 초기화] 사이에 구분기호와 함께 라디오 토글 4개. 부지 카드에 위치·용량·운반거리와 기준별 근거값, 측점·용량 사용자 정의 편집과 복원. 후보 부족으로 남은 토량은 경고로 알린다. - 확정 시 종단 정본의 disposal_sites에 심는다(기준 미선택이면 저장분 삭제). B06 연동 - common_util_mass_haul_sites.ts: 저장된 부지를 정식 곡선의 잔량 위치 기준으로 운반거리를 다시 재 표시하고 mass_haul.disposal_sites로 B08에 넘긴다. 미구현(계획서에 남김): 토취장 토질 판정(지반유형이 B06 산출물), 계곡부 암거 연장. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
122 lines
3.0 KiB
CSS
122 lines
3.0 KiB
CSS
/* =============================================================================
|
|
* B05_wf2_Route_UI_Style_Disposal.css
|
|
* 사토장·토취장 자동 선정 토글과 결과 카드 스타일.
|
|
*
|
|
* 토글은 유토곡선 범례 줄 안에 들어가므로 범례 항목(`b06-masshaul__legend-item`)의
|
|
* 모양을 그대로 물려받고, 여기서는 라디오처럼 보이게 하는 상태 표시만 얹는다.
|
|
* ========================================================================== */
|
|
|
|
/* 다른 기준이 선택돼 잠긴 토글 — 눌리지 않는다는 것이 보여야 한다. */
|
|
.b05-disposal__toggle:disabled {
|
|
cursor: default;
|
|
opacity: 0.45;
|
|
}
|
|
|
|
.b05-disposal__toggle:not(.is-off) {
|
|
border-color: var(--color-primary);
|
|
color: var(--color-primary);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.b05-disposal {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: stretch;
|
|
gap: var(--spacing-8);
|
|
padding: var(--spacing-8) var(--spacing-16);
|
|
border-top: 1px solid var(--color-border);
|
|
}
|
|
|
|
.b05-disposal__note {
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
.b05-disposal__site {
|
|
display: flex;
|
|
min-width: 260px;
|
|
flex-direction: column;
|
|
gap: var(--spacing-4);
|
|
padding: var(--spacing-8);
|
|
border: 1px solid var(--color-border);
|
|
border-left-width: 3px;
|
|
border-radius: var(--radius-small);
|
|
background: var(--color-surface-raised);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
/* 사토(내보내는 흙)와 토취(들여오는 흙)는 방향이 반대라 왼쪽 띠 색으로 갈라 놓는다. */
|
|
.b05-disposal__site--spoil {
|
|
border-left-color: var(--color-warning, #d97706);
|
|
}
|
|
|
|
.b05-disposal__site--borrow {
|
|
border-left-color: var(--color-info, #2563eb);
|
|
}
|
|
|
|
.b05-disposal__head {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
.b05-disposal__badge {
|
|
padding: 0 var(--spacing-4);
|
|
border: 1px solid var(--color-primary);
|
|
border-radius: var(--radius-pills);
|
|
color: var(--color-primary);
|
|
font-size: 11px;
|
|
}
|
|
|
|
.b05-disposal__metrics {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--spacing-4) var(--spacing-8);
|
|
color: var(--color-text-secondary);
|
|
}
|
|
|
|
.b05-disposal__metric {
|
|
display: inline-flex;
|
|
align-items: baseline;
|
|
gap: var(--spacing-4);
|
|
}
|
|
|
|
.b05-disposal__metric strong {
|
|
color: var(--color-text-body);
|
|
}
|
|
|
|
.b05-disposal__edit {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: flex-end;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
.b05-disposal__field {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
color: var(--color-text-secondary);
|
|
}
|
|
|
|
.b05-disposal__field input {
|
|
width: 96px;
|
|
box-sizing: border-box;
|
|
padding: 2px var(--spacing-4);
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-small);
|
|
background: var(--color-surface);
|
|
color: var(--color-text-body);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
.b05-disposal__reset {
|
|
padding: 2px var(--spacing-8);
|
|
border: 1px solid var(--color-border);
|
|
border-radius: var(--radius-pills);
|
|
background: var(--color-surface);
|
|
color: var(--color-text-secondary);
|
|
font-size: 11px;
|
|
cursor: pointer;
|
|
}
|