260710_1

B04_wf1_Surface/B04_wf1_Surface_UI_Page.ts

@@ -34,6 +34,7 @@ import {
 } from "./B04_wf1_Surface_Api_Fetch";
 import { createWorkflowLayout } from "@ui/ui_template_workflow_layout";
 import { createSurfacePointCloudViewer } from "./B04_wf1_Surface_UI_Viewer";
+import { createSurfaceTerrainViewer } from "./B04_wf1_Surface_UI_TerrainViewer";
 import "./B04_wf1_Surface_UI_Style.css";
 
 /** locale 헬퍼 */
@@ -105,6 +106,7 @@ export function renderB04Surface(root: HTMLElement): void {
   const statsList = document.createElement("div");
   statsList.className = "b04-surface__stats";
   const viewer = createSurfacePointCloudViewer();
+  const terrainViewer = createSurfaceTerrainViewer();
 
   const filterGroup = buildCheckboxGroup(L("B04_Surface_Group_Filters"), SOURCE_FILTERS, [
     "grid_min_z",
@@ -148,6 +150,8 @@ export function renderB04Surface(root: HTMLElement): void {
     filterGroup.root,
     methodGroup.root,
     forceLabel,
+    viewer.controlsGroup,
+    viewer.optionsGroup,
     analyzeButton,
     refreshButton,
   );
@@ -156,24 +160,35 @@ export function renderB04Surface(root: HTMLElement): void {
   workspace.className = "b04-surface__workspace";
   const topbar = document.createElement("div");
   topbar.className = "b04-surface__topbar";
+
+  const titleWrap = document.createElement("div");
+  titleWrap.style.display = "flex";
+  titleWrap.style.alignItems = "baseline";
+  titleWrap.style.gap = "var(--spacing-12)";
+
   const title = document.createElement("h3");
   title.textContent = L("B04_Surface_PointCloud_Title");
-  topbar.append(title, statusBox);
+  titleWrap.append(title, viewer.statusSpan);
+
+  topbar.append(titleWrap, statusBox);
 
   const bottom = document.createElement("div");
   bottom.className = "b04-surface__bottom";
+
   const statsSection = document.createElement("section");
   statsSection.className = "b04-surface__section";
   const statsTitle = document.createElement("h3");
   statsTitle.textContent = L("B04_Surface_GroundStats_Title");
   statsSection.append(statsTitle, statsList);
+
   const modelsSection = document.createElement("section");
   modelsSection.className = "b04-surface__section";
   const modelsTitle = document.createElement("h3");
   modelsTitle.textContent = L("B04_Surface_Result_Title");
   modelsSection.append(modelsTitle, modelList);
+
   bottom.append(statsSection, modelsSection);
-  workspace.append(topbar, viewer.root, bottom);
+  workspace.append(topbar, viewer.root, terrainViewer.root, bottom);
 
   const layout = createWorkflowLayout({
     title: L("B04_Surface_Title"),
@@ -240,6 +255,10 @@ export function renderB04Surface(root: HTMLElement): void {
 
   function renderModels(models: readonly SurfaceModelSummary[]): void {
     modelList.replaceChildren();
+    const projectId = getProjectId();
+    if (projectId) {
+      terrainViewer.render(projectId, models);
+    }
     if (models.length === 0) {
       const empty = document.createElement("p");
       empty.className = "b04-surface__empty";