feat(종단보기): 346-3 [노선 반영] 없앰 — [저장]이 노선부터(POST /route/replan · draft = 계약 RouteDraft · 안 바뀌면 안 보냄) · 뒤 차례는 새 노선 · 횡단 초안 측점 열쇠로 넘김 · 결과 한 줄

- design_save 차례 = 노선 → 관 → 구조물 → 계획고(옛 노선 칸 → 새 노선) → 암거 옵션 → 상단측 → 횡단(carryStationDrafts 뒤 저장) · 잠금 막 = [저장] 하나 · 실패 = 멈춤 · 초안 그대로 · 오류 한 줄
- [확정] 중 노선이 바뀌면 노선만 저장하고 다시 세움(새 노선으로 다시 [확정])
- _RouteEdit_Apply = 노선 저장 이음(편집기 등록부 · pendingRouteSave · saveRouteDraft · carryAfterRouteSave · routeSaveSummary · rebuildAfterRouteSave) · 단추 듣기 없음
- 결과 한 줄 = 관 지킴 · 새 교차 관 · 오목 보충 · 구조물 옮김 · 멀어짐 · 노선 밖 고침(서버 cross_dropped + 화면) · 배수유역 낡음
- RE_Chrome [노선 반영] 지움 · [반영 전으로] → [저장 전으로] · replanRoute 본문 = RouteSaveBody
- 시험: test_design_store_save 차례 넷 더함 · 꼴 시험 셋 고쳐 씀 · 323_9 대역

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01VmC34fsxxbweEG3RUjs3Mn
This commit is contained in:
2026-10-16 12:14:22 +09:00
co-authored by Claude Opus 5.5
parent 6757d1dcb8
commit 47366d3740
10 changed files with 388 additions and 117 deletions
+25 -13
View File
@@ -3,7 +3,7 @@
* 계획노선 두 벌(예상노선·계획노선) 읽기와 노선 갈아 끼우기 요청.
*
* GET /projects/{id}/route/plan → 예상노선·계획노선 정점(사업지 좌표계 m)
* POST /projects/{id}/route/replan → 고친 계획노선으로 갈아 끼우고 재계산
* POST /projects/{id}/route/replan → 노선 초안 저장(346-3 · draft = 계약 RouteDraft · as_initial)
* POST /projects/{id}/route/replan/reset → 계획노선을 예상노선으로 되돌리고 재계산
* POST /projects/{id}/route/profile-preview → 지금 노드의 균형 종단(편집 창 종단 띠)
* GET /projects/{id}/route/terrain-sources → 고를 수 있는 분석 지형(라이다 · 수치지형도)
@@ -19,6 +19,7 @@ import { API_BASE_URL } from "@config/config_frontend";
import { readState, writeState } from "../A00_Common/b_page_state";
import { heightAt } from "../common_util/common_util_surface_sampler";
import { loadDesignTerrainGrid } from "./B05_Profile_Api_TerrainGrid";
import type { RouteDraft } from "../A00_Common/design/design_pipeline_types";
/** 편집 창 분석 지형 — las = 확정 지표면(라이다) · sheet = 수치지형도 서피스. */
export type AnalysisTerrain = "las" | "sheet";
@@ -115,7 +116,23 @@ export interface RouteReplanResponse {
project_id: string;
route_id: number | null;
total_length_m: number | null;
vertex_count: number;
vertex_count?: number;
/** 노선 저장 결과(346-3 · 서버 `B05_Profile_Route_Save` 머리) — 관 지킴 · 새 교차 · 오목 보충. */
pipes?: { kept: number; crossing: number; concave: number };
structures?: { moved: number; far: number };
/** 새 노선에 못 넘긴 횡단 고침(측점이 사라짐) 수. */
cross_dropped?: number;
/** 배수유역 저장분이 새 노선과 안 맞음(다시 안 셈). */
drainage_stale?: boolean;
initial_refreshed?: boolean;
}
/** 노선 저장 본문 — `draft` 는 계약 `RouteDraft` 그대로 · `as_initial` = 추천 [적용](초기값 다시 뜸). */
export interface RouteSaveBody {
draft: RouteDraft;
initial?: unknown;
balanced_profile?: boolean;
as_initial?: boolean;
}
export async function requestJson<T>(
@@ -159,23 +176,18 @@ export interface RouteReplanVertex {
radius_m?: number | null;
}
/** 고친 계획노선으로 갈아 끼우고 배수유역부터 다시 계산한다.
/** 노선 초안을 정본으로 저장한다(346-3) — 서버가 노선 → 관 · 구조물 따라감 → 종횡단 → 계획고 옮김 →
* 횡단 이월 → B06 확정까지 돈다. 실패(409)면 서버가 옛 노선으로 되살리고 오류 글을 낸다.
*
* 편집 세 가지가 모두 이 한 목록으로 나간다(2026-09-07 사용자 지시) —
* **직선 삭제·추가**는 점을 빼거나 더하는 것, **곡선 삭제·추가**는 `curve` 를 끄고 켜는 것,
* **반지름 변경**은 `radius_m` 을 주는 것. */
* 편집 세 가지가 모두 초안 한 벌로 나간다(2026-09-07 사용자 지시) — **직선 삭제·추가**는 노드를 빼거나
* 더하는 것, **곡선 삭제·추가**는 `curveOn` 을 끄고 켜는 것, **반지름 변경**은 `curveRadius`. */
export async function replanRoute(
projectId: string,
vertices: Array<[number, number]> | RouteReplanVertex[],
/** 함께 실어 보낼 값 — 지금은 마지막에 적용한 초기노선 갈래(`initial`, 계획서 20). */
extra: Record<string, unknown> = {},
body: RouteSaveBody,
): Promise<RouteReplanResponse> {
const payload = (vertices as Array<[number, number] | RouteReplanVertex>).map((vertex) =>
Array.isArray(vertex) ? { x: vertex[0], y: vertex[1] } : vertex,
);
return requestJson<RouteReplanResponse>(
`/projects/${projectId}/route/replan`,
{ method: "POST", body: JSON.stringify({ ...extra, vertices: payload }) },
{ method: "POST", body: JSON.stringify(body) },
REPLAN_TIMEOUT_MS,
);
}
+173 -77
View File
@@ -1,105 +1,201 @@
/* =============================================================================
* B05_Profile_UI_RouteEdit_Apply.ts
* 계획노선 편집(평면)의 **[노선 반영]**(옛 [확인] · 346-3 까지 남김) — 무거운 재계산과 대기 표시.
* 노선 편집(평면)의 **노선 저장 이음**(346-3) — [노선 반영] 단추는 없앰.
*
* 다시 계산은 **노선이 바뀐 뒤 [노선 반영]에서만** 돈다(계획서 20 ④). 노선이 마지막 반영 그대로면
* 계산하지 않는다. [초기화](옛 「예상노선으로」)는 편집값만 되돌린다(`_Initial`). 끝나면 부른 쪽이
* 페이지를 새로고침 없이 다시 세운다(`onApplied`).
*
* 누르면 서버가 배수유역부터 종·횡단·유토곡선까지 전 단계를 다시 돈다(약 90초). 중간 취소는
* 만들지 않기로 했으므로(계획서 0-2, 2026-09-09) **얼마나 지났는지**를 초로 보여 사람이
* 멈춘 것인지 도는 것인지 알 수 있게 한다.
* · 페이지 [저장](`design_save`)이 맨 앞에서 `pendingRouteSave` 로 지금 노선 초안을 받아 `saveRouteDraft`
* (`POST /route/replan` · draft = 계약 `RouteDraft`)로 보낸다 — 노선이 마지막 저장 그대로면 null(안 보냄).
* · 저장 뒤 `carryAfterRouteSave` 가 세션 횡단 초안을 측점 열쇠로 새 노선에 넘기고(`carryStationDrafts`)
* 넘긴 고침을 저장 · 결과 한 줄 · 페이지는 새로고침 없이 다시 세운다(`rebuildAfterRouteSave`).
* · 추천 [적용] = `saveRecommendedRoute` — `as_initial: true` 로 바로 저장(초기값 = 추천 노선 · 사용자 확정).
* 편집기가 살아 있는 동안 여기 등록부에 「지금 초안」 · 「다시 세우기」를 건다(프로젝트 하나에 하나).
* 실패하면 서버가 옛 노선으로 되살리고 화면 초안은 그대로 남는다(오류 한 줄은 부르는 쪽).
* ========================================================================== */
import { clearDrafts, clearResults } from "../A00_Common/b_page_state";
import { showToast } from "@ui/ui_template_elements";
import { replanRoute } from "./B05_Profile_Api_Replan";
import type { RouteDraft } from "../A00_Common/design/design_pipeline_types";
import { useDesignStore } from "../A00_Common/design/design_store";
import { currentRoute, remountRoute } from "../A00_Common/router";
import { hideLoadingOverlay, showLoadingOverlay, showToast } from "@ui/ui_template_elements";
import {
invalidateSectionDetail,
loadSectionDetail,
saveCachedCrossPatches,
} from "../B06_Section/B06_Section_Section_Store";
import { carryStationDrafts, useStationKeys } from "../B06_Section/B06_Section_Station_Keys";
import { clearRouteLatestCache } from "./B05_Profile_Api_Fetch";
import {
replanRoute,
type RouteReplanResponse,
type RouteSaveBody,
} from "./B05_Profile_Api_Replan";
type Vertex = [number, number];
type RouteNodes = { planned: Vertex[]; curveOn: boolean[]; curveRadius: Array<number | null> };
export interface RouteApplyParams {
overlay: HTMLElement;
/** 화면 전체를 덮는 대기 막. 안에 `<span>` 한 개가 글을 받는다. */
busy: HTMLElement;
/** 옛 [노선 반영] 자리(단추 · 대기 막) — 346-3 부터 안 씀(대기는 페이지 잠금 막 하나). */
overlay?: HTMLElement;
busy?: HTMLElement;
projectId: string;
/** 지금 편집값 — 누른 순간에 읽는다. */
nodes: () => { planned: Vertex[]; curveOn: boolean[]; curveRadius: Array<number | null> };
/** 마지막 반영 뒤 노선이 바뀌었나 — 안 바뀌었으면 다시 계산하지 않는다. */
/** 지금 편집값 — 저장하는 순간에 읽는다. */
nodes: () => RouteNodes;
/** 마지막 저장 뒤 노선이 바뀌었나 — 안 바뀌었으면 보내지 않는다. */
changed: () => boolean;
/** 설계 지형으로 보낼 분석 지형(PLAN 133-2) — 고르기가 안 보이면 null(지금 설계 지형 그대로). */
terrain: () => string | null;
/** [측점 스냅] 켬끔(요구 224-2) — 곡선표에 적혀 측점 셈이 읽음. */
stationSnap: () => boolean;
/** 초기노선 갈래 — [확인]에 지금 초기값을 싣고, 결과 캐시를 비운 뒤 다시 적는다. */
/** 초기노선 갈래 — 저장에 지금 추천을 싣고, 결과 캐시를 비운 뒤 다시 적는다. */
initial: {
current: () => unknown;
keep: () => void;
};
/** 종단 띠 — 응답을 기다려 띠에 보인 계획선(균형 종단 · 지반고)을 그대로 적용한다(PLAN 75-1). */
profileShown: () => Promise<boolean>;
/** 성공하면 화면을 다시 세운다(대기 막은 다시 세울 때까지 남음). */
/** 저장이 끝나면 페이지를 새로고침 없이 다시 세운다. */
onApplied: () => void | Promise<void>;
}
/** [노선 반영]을 붙인다. 리스너는 편집기와 수명이 같다. */
interface RouteSource {
pending: () => Promise<RouteSaveBody | null>;
settings: () => { stationSnap: boolean; terrain: string | null };
saved: () => void;
rebuild: () => void | Promise<void>;
}
const sources = new Map<string, RouteSource>();
/** 노드 · 곡선 편집값 → 계약 `RouteDraft`(붙든 값은 서버가 안 씀 · 칸 길이만 맞춤). */
export function routeDraftOf(
nodes: RouteNodes,
settings: { stationSnap: boolean; terrain: string | null },
): RouteDraft {
return {
rev: 0,
nodes: nodes.planned.map(([x, y]): Vertex => [x, y]),
curveOn: nodes.planned.map((_, index) => nodes.curveOn[index] !== false),
curveRadius: nodes.planned.map((_, index) => nodes.curveRadius[index] ?? null),
curveLock: nodes.planned.map(() => null),
curveArc: nodes.planned.map(() => null),
stationSnap: settings.stationSnap,
terrain: settings.terrain,
};
}
/** 편집기를 등록부에 건다 — 같은 프로젝트에 새 편집기가 서면 그쪽으로 바뀐다. */
export function bindRouteApply(params: RouteApplyParams): void {
const { overlay, busy, projectId } = params;
async function runHeavy(label: string, task: () => Promise<unknown>): Promise<void> {
busy.hidden = false;
// ⚠ 「몇 분」은 옛 값이었다 — 0-11 로 **약 90초**가 됐다(2026-09-09 실측 네 번:
// 87.3 · 90.0 · 93.9 · 95.4초).
const message = busy.querySelector("span")!;
const started = Date.now();
const tick = (): void => {
const seconds = Math.round((Date.now() - started) / 1000);
message.textContent = `${label} — 배수유역부터 다시 계산 중입니다. 1분 반쯤 걸립니다 (${seconds}초 지남).`;
};
tick();
const timer = window.setInterval(tick, 1000);
try {
await task();
// 노선이 바뀌면 세션 초안·조회 캐시는 옛 노선 것이라 남기지 않는다(PLAN 0-7 확정 5).
clearDrafts(projectId);
clearResults(projectId);
params.initial.keep(); // 초기값은 새 노선의 출발점 — 옛 노선 결과와 함께 버리지 않는다.
showToast("노선을 다시 계산했습니다.", "success");
await params.onApplied();
} catch (error) {
busy.hidden = true;
showToast(error instanceof Error ? error.message : "노선 재계산에 실패했습니다.", "error");
} finally {
window.clearInterval(timer); // 성공·실패·닫힘 어느 쪽이든 멈춘다
}
}
overlay.querySelector('[data-act="apply"]')!.addEventListener("click", () => {
const { planned, curveOn, curveRadius } = params.nodes();
if (planned.length < 2) {
showToast("노선은 노드가 2개 이상이어야 합니다.", "error");
return;
}
if (!params.changed()) {
showToast("노선이 그대로라 다시 계산하지 않았습니다.", "info");
return;
}
void runHeavy("계획노선 반영", async () =>
replanRoute(
projectId,
planned.map(([x, y], index) => ({
x,
y,
curve: curveOn[index] !== false,
radius_m: curveRadius[index] ?? null,
})),
{
initial: params.initial.current(),
// 띠 응답 전에 눌렀으면 기다린다 — 서버는 같은 노선 · 같은 셈으로 띠 계획선을 다시 낸다.
balanced_profile: await params.profileShown(),
terrain: params.terrain(),
station_snap: params.stationSnap(),
},
),
);
const settings = () => ({ stationSnap: params.stationSnap(), terrain: params.terrain() });
sources.set(params.projectId, {
pending: async () => {
const nodes = params.nodes();
if (nodes.planned.length < 2 || !params.changed()) return null;
return {
draft: routeDraftOf(nodes, settings()),
initial: params.initial.current(),
// 띠 응답 전이면 기다린다 — 서버는 같은 노선 · 같은 셈으로 띠 계획선을 다시 낸다.
balanced_profile: await params.profileShown(),
};
},
settings,
saved: () => params.initial.keep(),
rebuild: params.onApplied,
});
}
/** 지금 보낼 노선 초안 — 편집기가 있으면 그것(안 바뀌었으면 null) · 없으면 가게 `routeDraft`. */
export async function pendingRouteSave(projectId: string): Promise<RouteSaveBody | null> {
const source = sources.get(projectId);
if (source) return source.pending();
const draft = useDesignStore(projectId, null).get("routeDraft");
return draft && draft.nodes.length >= 2 ? { draft } : null;
}
/** 노선 초안 저장 — 실패하면 throw(서버가 되살림 · 화면 초안 그대로). 새 노선 번호 · 결과를 돌려줌. */
export async function saveRouteDraft(
projectId: string,
body: RouteSaveBody,
): Promise<RouteReplanResponse> {
const saved = await replanRoute(projectId, body);
useDesignStore(projectId, null).set("routeDraft", null);
// 노선이 바뀌면 조회 결과 캐시는 옛 노선 것 — 추천은 새 노선의 출발점이라 다시 적는다.
clearResults(projectId);
sources.get(projectId)?.saved();
return saved;
}
/** 저장 결과 한 줄 — 관 지킴 · 새 교차 관 · 구조물 옮김 · 멀어짐 · 노선 밖 고침 · 배수유역 낡음. */
export function routeSaveSummary(saved: RouteReplanResponse, outside = 0): string {
const parts = [
`관 지킴 ${saved.pipes?.kept ?? 0}`,
`새 교차 관 ${saved.pipes?.crossing ?? 0}`,
`구조물 옮김 ${saved.structures?.moved ?? 0}`,
`멀어짐 ${saved.structures?.far ?? 0}`,
];
if (saved.pipes?.concave) parts.splice(2, 0, `오목 보충 관 ${saved.pipes.concave}`);
const dropped = (saved.cross_dropped ?? 0) + outside;
if (dropped) parts.push(`노선 밖 고침 ${dropped} 건`);
if (saved.drainage_stale) parts.push("배수유역 낡음");
return `노선 저장 — ${parts.join(" · ")}`;
}
/**
* 노선 저장 뒤 세션 횡단 초안(옛 노선 측점 열쇠) → 새 노선으로 넘기고 그 고침을 저장 — 초안을 통째로
* 지우지 않는다. 사라진 측점 고침은 버림(수를 돌려줌 · 서버 `cross_dropped` 와 한 줄로).
*/
export async function carryAfterRouteSave(
projectId: string,
fromRouteId: number,
toRouteId: number,
): Promise<number> {
invalidateSectionDetail(projectId, toRouteId);
const detail = await loadSectionDetail(projectId, toRouteId);
useStationKeys(projectId, toRouteId, detail);
const outside = carryStationDrafts(projectId, fromRouteId, toRouteId);
await saveCachedCrossPatches(projectId, toRouteId);
return outside;
}
/** 저장 뒤 페이지를 새로고침 없이 다시 세운다 — 편집기가 걸어 둔 길(옛 노선 캐시 비움 포함) · 없으면 라우터. */
export async function rebuildAfterRouteSave(projectId: string): Promise<void> {
const source = sources.get(projectId);
if (source) return source.rebuild();
clearRouteLatestCache(projectId);
invalidateSectionDetail(projectId);
remountRoute(currentRoute());
}
/**
* 추천 [적용] — 받은 노드로 서버 노선을 바로 저장하고(`as_initial` · 초기값 = 추천 노선) 페이지를 다시
* 세운다. 잠금 막 = 「노선 재탐색」 자리 하나. 새 초기값에서 다시 시작하므로 초안은 비운다([초기화]와 같음).
* 실패하면 false — 서버가 옛 노선으로 되살렸고 화면 노선은 그대로.
*/
export async function saveRecommendedRoute(
projectId: string,
nodes: RouteNodes,
initial: unknown,
balancedProfile: boolean,
): Promise<boolean> {
const settings = sources.get(projectId)?.settings() ?? { stationSnap: false, terrain: null };
showLoadingOverlay();
try {
await saveRouteDraft(projectId, {
draft: routeDraftOf(nodes, settings),
initial,
balanced_profile: balancedProfile,
as_initial: true,
});
clearDrafts(projectId);
sources.get(projectId)?.saved();
showToast("추천 노선을 저장했습니다 — 새 초기값입니다.", "success");
await rebuildAfterRouteSave(projectId);
return true;
} catch (error) {
showToast(
`추천 노선 저장에 실패했습니다.${error instanceof Error ? ` ${error.message}` : ""}`,
"error",
);
return false;
} finally {
hideLoadingOverlay();
}
}
@@ -13,7 +13,8 @@ import { bindFootprintToggle } from "./B05_Profile_UI_RouteEdit_Footprint";
* 아래. 메인 창은 왼쪽으로 밀고 오른쪽 세로 칸에 횡단 두 판이 앉는다.
*
* 자리(345-3) — 모달이 아니라 종단 보기 가운데 위 본문(옛 3D 자리)에 붙는다. 덮개 · 전체 화면 ·
* 닫기 단추는 걷었다 · [취소] → [반영 전으로] · [확인] → [노선 반영] · 오른쪽 횡단 칸은 접는 칸.
* 닫기 단추는 걷었다 · [취소] → [저장 전으로] · [확인] · [노선 반영]은 없앰(346-3 — 노선은 페이지 [저장]이
* 맨 앞에서 보냄) · 오른쪽 횡단 칸은 접는 칸.
* 머리 `tools` 자리에 부른 쪽 단추([3D])가 앉는다. [노선 추천] · 현재 추천 · [초기화]는 좌측
* 「노선 추천」 칸으로 옮겼다(345-4 · `_Panel_Recommend`).
* ========================================================================== */
@@ -72,7 +73,7 @@ export function createRouteEditChrome(
title="노선 위 두 점을 눌러 거리·기울기를 잽니다 (Shift+클릭도 같음)">거리 재기</button>
<button type="button" class="ui-btn ui-btn--ghost" data-act="station-snap"
aria-pressed="false"
title="곡선(호) 안 측점 하나를 곡선 중점(MC)으로 옮깁니다 — [확인] 때 저장">측점 스냅</button>
title="곡선(호) 안 측점 하나를 곡선 중점(MC)으로 옮깁니다 — [저장] 때 저장">측점 스냅</button>
<button type="button" class="ui-btn ui-btn--ghost" data-act="footprint"
title="도로 끝 · 비탈 끝(깎기 붉음 · 쌓기 파랑)을 평면에 겹칩니다">발자국</button>
<i class="b05-routeedit__divider" aria-hidden="true"></i>
@@ -81,9 +82,7 @@ export function createRouteEditChrome(
<button type="button" class="ui-btn ui-btn--ghost" data-act="redo"
title="다시하기 (Ctrl+Y)" disabled>↷ 다시하기</button>
<button type="button" class="ui-btn ui-btn--ghost" data-act="cancel"
title="마지막 [노선 반영] 뒤 고친 노선을 버리고 그때 노선으로 되돌립니다 — 되돌리기로 다시 살릴 수 있습니다">반영 전으로</button>
<button type="button" class="ui-btn ui-btn--filled" data-act="apply"
title="이 노선으로 배수유역부터 다시 계산합니다 — 결과가 새 초기값이 되고 종횡단 · 구조물 · 관 옵션 편집은 새 노선 기본값으로 바뀝니다">노선 반영</button>
title="마지막 [저장] 뒤 고친 노선을 버리고 그때 노선으로 되돌립니다 — 되돌리기로 다시 살릴 수 있습니다">저장 전으로</button>
</span>
</div>
<div class="b05-routeedit__canvas-wrap">