260710_0

B05_wf2_Route/B05_wf2_Route_UI_Page.ts

@@ -17,12 +17,12 @@ import {
   createButton,
   createInputField,
   createSelectField,
-  createWorkflowShell,
   hideLoadingOverlay,
   showLoadingOverlay,
   showToast,
   type InputFieldHandle,
 } from "@ui/ui_template_elements";
+import { createWorkflowLayout } from "@ui/ui_template_workflow_layout";
 import { workflowSteps } from "../A00_Common/b_page_scaffold";
 import {
   confirmRoute,
@@ -71,12 +71,6 @@ function parseNumber(value: string): number | null {
 }
 
 export function renderB05Route(root: HTMLElement): void {
-  const shell = createWorkflowShell({
-    title: L("B05_Route_Title"),
-    steps: workflowSteps(),
-    activeStep: 1,
-  });
-
   /* ---- 좌측: 경로 제어점 ---- */
   const pointsGroup = document.createElement("fieldset");
   pointsGroup.className = "b05-route__group";
@@ -193,7 +187,6 @@ export function renderB05Route(root: HTMLElement): void {
   const leftForm = document.createElement("div");
   leftForm.className = "b05-route__form";
   leftForm.append(pointsGroup, surfaceGroup, constraintGroup, actionRow);
-  shell.leftPanel.append(leftForm);
 
   /* ---- 우측: 결과 ---- */
   const resultTitle = document.createElement("h3");
@@ -240,7 +233,6 @@ export function renderB05Route(root: HTMLElement): void {
   const resultCard = document.createElement("div");
   resultCard.className = "b05-route__result";
   resultCard.append(resultTitle, resultBody);
-  shell.rightArea.append(resultCard);
 
   /* ---- 이벤트 핸들러 ---- */
   function getProjectId(): string | null {
@@ -326,5 +318,12 @@ export function renderB05Route(root: HTMLElement): void {
   }
 
   renderEmptyResult();
-  root.replaceChildren(shell.root);
+  const layout = createWorkflowLayout({
+    title: L("B05_Route_Title"),
+    steps: workflowSteps(),
+    activeStep: 2,
+    leftPanel: leftForm,
+    mainContent: resultCard,
+  });
+  root.replaceChildren(layout.root);
 }