- 상자 화면(포인트 팔레트 · 알고리즘 · 조건 · 숨긴 [최적 경로 계산]) · solveRouteAction · routePoint/circlePoint 를 B05_Profile/Old/B05_Profile_UI_RouteCalc.ts 로 떼어 옮김 - 좌측 패널 등록 · onSolve · 칸 값(algorithm · paved · 곡선반경 · 경사 상하한 · 회피 통과) 끊음 - tsconfig 에서 B05_Profile/Old 제외 · 서버 경로 계산 API · 자동설계 체인은 그대로 - 시험: 좌측 칸 수 1+4+2 · 칸 제목에서 「경로 계산 설정」 뺌 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01W4uKaV4ZBhsJN4GHG7yRj4
60 lines
3.0 KiB
TypeScript
60 lines
3.0 KiB
TypeScript
/* =============================================================================
|
|
* B05_Profile_UI_Panel_Route.ts
|
|
* 좌측 패널의 **노선 쪽 칸 재료** — 계획노선 편집 단추 · 선택 포인트 상세. 칸 틀은
|
|
* `B05_Profile_UI_Panel_Sections.ts` 가 씌운다(등록부). 「경로 계산 설정」은 `Old/` 로 옮김(54-24).
|
|
* `B05_Profile_UI_Panel.ts` 에서 떼어냈다(계획서 24-2b). 본문 로직과 수치는 그대로다.
|
|
* ========================================================================== */
|
|
|
|
import type { PlacedRoutePoint } from "./B05_Profile_UI_Markers";
|
|
import { button, numberField } from "./B05_Profile_UI_Panel_Fields";
|
|
|
|
export interface RoutePartCallbacks {
|
|
/** [계획노선 편집] — 큰 모달을 열어 노선을 고친다(계산은 모달 [확인]에서만 돈다). */
|
|
onEditPlannedRoute: () => void;
|
|
onMovePoint: () => void;
|
|
onDeletePoint: () => void;
|
|
onRadiusChange: (radius: number) => void;
|
|
}
|
|
|
|
export function createRoutePart(callbacks: RoutePartCallbacks) {
|
|
// 계획노선 편집 — 노선을 고치는 유일한 입구(2026-09-06 사용자 확정). 자동탐색
|
|
// (「경로 계산 설정」)은 사용 중단이라 이 자리가 노선을 바꾸는 길이다.
|
|
const plannedRouteBtn = document.createElement("button");
|
|
plannedRouteBtn.type = "button";
|
|
plannedRouteBtn.className = "b05-route__btn";
|
|
plannedRouteBtn.textContent = "계획노선 편집";
|
|
plannedRouteBtn.title = "예상노선 위에서 계획노선을 고칩니다. [확인] 때만 다시 계산합니다.";
|
|
plannedRouteBtn.addEventListener("click", () => callbacks.onEditPlannedRoute());
|
|
|
|
const selectedName = document.createElement("strong");
|
|
const radius = numberField("회피/금지 반경 (m)", "25");
|
|
radius.addEventListener("change", () => callbacks.onRadiusChange(Number(radius.value) || 1));
|
|
const selectedActions = document.createElement("div");
|
|
selectedActions.className = "b05-route__actions";
|
|
selectedActions.append(
|
|
button("위치 이동", callbacks.onMovePoint),
|
|
button("삭제", callbacks.onDeletePoint, "danger"),
|
|
);
|
|
// 칸 뿌리는 등록부가 만든 뒤 알려 준다 — 평소 숨김(포인트를 고를 때만 보인다).
|
|
let selectedRoot: HTMLElement | null = null;
|
|
|
|
return {
|
|
plannedRouteButton: plannedRouteBtn,
|
|
/** 「선택 포인트 상세 설정」 본문 — 화면 순서대로. */
|
|
selectedNodes: [selectedName, radius.wrapper, selectedActions] as HTMLElement[],
|
|
bindSelectedRoot(root: HTMLElement): void {
|
|
selectedRoot = root;
|
|
root.hidden = true;
|
|
},
|
|
setSelected(point: PlacedRoutePoint | null): void {
|
|
if (selectedRoot) selectedRoot.hidden = !point;
|
|
if (!point) return;
|
|
selectedName.textContent = `${point.type.toUpperCase()} (${point.x.toFixed(2)}, ${point.y.toFixed(2)})`;
|
|
radius.wrapper.hidden = point.type !== "ap" && point.type !== "fp";
|
|
radius.value = String(point.radius_m ?? 25);
|
|
},
|
|
};
|
|
}
|
|
|
|
export type RoutePart = ReturnType<typeof createRoutePart>;
|