.claude/workflow-version.json

@@ -1,6 +1,6 @@
 {
   "applied_global_version": "1.6.1",
-  "applied_date": "2026-03-25",
+  "applied_date": "2026-03-24",
   "project_type": "react-ts",
   "gitea_url": "https://gitea.gc-si.dev",
   "custom_pre_commit": true

backend/src/monitor/monitorRouter.ts

@@ -1,20 +0,0 @@
-import { Router } from 'express'
-import { requireAuth } from '../auth/authMiddleware.js'
-import { getNumericalDataStatus } from './monitorService.js'
-
-const router = Router()
-
-router.use(requireAuth)
-
-// GET /api/monitor/numerical — 수치예측자료 다운로드 상태 조회
-router.get('/numerical', async (_req, res) => {
-  try {
-    const data = await getNumericalDataStatus()
-    res.json(data)
-  } catch (err) {
-    console.error('[monitor] 수치예측자료 상태 조회 오류:', err)
-    res.status(500).json({ error: '수치예측자료 상태를 조회할 수 없습니다.' })
-  }
-})
-
-export default router

backend/src/monitor/monitorService.ts

@@ -1,121 +0,0 @@
-export interface NumericalDataStatus {
-  modelName: string;
-  jobName: string;
-  lastStatus: 'COMPLETED' | 'FAILED' | 'STARTED' | 'UNKNOWN';
-  lastDataDate: string | null;     // 데이터 기준일 (YYYY-MM-DD)
-  lastDownloadedAt: string | null; // 마지막 실행 완료 시각 (ISO)
-  nextScheduledAt: string | null;  // Quartz 다음 예정 시각 (ISO)
-  durationSec: number | null;      // 소요 시간 (초)
-  consecutiveFailures: number;     // 연속 실패 횟수
-}
-
-// ============================================================
-// Mock 데이터 (Spring Batch/Quartz DB 연동 전)
-// DB 연동 준비 완료 후 getMockNumericalDataStatus → getActualNumericalDataStatus 교체
-// ============================================================
-const MOCK_DATA: NumericalDataStatus[] = [
-  {
-    modelName: 'HYCOM',
-    jobName: 'downloadHycomJob',
-    lastStatus: 'COMPLETED',
-    lastDataDate: '2026-03-25',
-    lastDownloadedAt: '2026-03-25T06:12:34',
-    nextScheduledAt: '2026-03-25T12:00:00',
-    durationSec: 342,
-    consecutiveFailures: 0,
-  },
-  {
-    modelName: 'GFS',
-    jobName: 'downloadGfsJob',
-    lastStatus: 'COMPLETED',
-    lastDataDate: '2026-03-25',
-    lastDownloadedAt: '2026-03-25T06:48:11',
-    nextScheduledAt: '2026-03-25T12:00:00',
-    durationSec: 518,
-    consecutiveFailures: 0,
-  },
-  {
-    modelName: 'WW3',
-    jobName: 'downloadWw3Job',
-    lastStatus: 'FAILED',
-    lastDataDate: '2026-03-24',
-    lastDownloadedAt: '2026-03-25T07:03:55',
-    nextScheduledAt: '2026-03-25T13:00:00',
-    durationSec: null,
-    consecutiveFailures: 2,
-  },
-  {
-    modelName: 'KOAST POS_WIND',
-    jobName: 'downloadKoastWindJob',
-    lastStatus: 'COMPLETED',
-    lastDataDate: '2026-03-25',
-    lastDownloadedAt: '2026-03-25T07:21:05',
-    nextScheduledAt: '2026-03-25T13:00:00',
-    durationSec: 127,
-    consecutiveFailures: 0,
-  },
-  {
-    modelName: 'KOAST POS_HYDR',
-    jobName: 'downloadKoastHydrJob',
-    lastStatus: 'COMPLETED',
-    lastDataDate: '2026-03-25',
-    lastDownloadedAt: '2026-03-25T07:35:48',
-    nextScheduledAt: '2026-03-25T13:00:00',
-    durationSec: 183,
-    consecutiveFailures: 0,
-  },
-  {
-    modelName: 'KOAST POS_WAVE',
-    jobName: 'downloadKoastWaveJob',
-    lastStatus: 'COMPLETED',
-    lastDataDate: '2026-03-25',
-    lastDownloadedAt: '2026-03-25T07:52:19',
-    nextScheduledAt: '2026-03-25T13:00:00',
-    durationSec: 156,
-    consecutiveFailures: 0,
-  },
-];
-
-export async function getNumericalDataStatus(): Promise<NumericalDataStatus[]> {
-  // TODO: Spring Batch + Quartz DB 테이블 생성 후 아래 실제 쿼리로 교체
-  //
-  // import { wingDb } from '../db/wingDb.js'
-  //
-  // -- 각 Job의 최신 실행 결과 조회 (BATCH_JOB_EXECUTION)
-  // SELECT
-  //   ji.JOB_NAME,
-  //   je.START_TIME, je.END_TIME,
-  //   je.STATUS, je.EXIT_CODE, je.EXIT_MESSAGE,
-  //   jep.STRING_VAL AS data_date,
-  //   EXTRACT(EPOCH FROM (je.END_TIME - je.START_TIME))::INT AS duration_sec
-  // FROM BATCH_JOB_EXECUTION je
-  // JOIN BATCH_JOB_INSTANCE ji ON je.JOB_INSTANCE_ID = ji.JOB_INSTANCE_ID
-  // LEFT JOIN BATCH_JOB_EXECUTION_PARAMS jep
-  //   ON je.JOB_EXECUTION_ID = jep.JOB_EXECUTION_ID
-  //   AND jep.KEY_NAME = 'data_date'
-  // WHERE je.JOB_EXECUTION_ID IN (
-  //   SELECT MAX(je2.JOB_EXECUTION_ID)
-  //   FROM BATCH_JOB_EXECUTION je2
-  //   GROUP BY je2.JOB_INSTANCE_ID
-  // )
-  // ORDER BY je.START_TIME DESC;
-  //
-  // -- Quartz 다음 실행 예정 시각 (NEXT_FIRE_TIME은 epoch milliseconds)
-  // SELECT JOB_NAME, to_timestamp(NEXT_FIRE_TIME / 1000) AS next_fire_time
-  // FROM QRTZ_TRIGGERS;
-  //
-  // -- 연속 실패 횟수 집계 (최근 실행부터 COMPLETED 전까지 카운트)
-  // SELECT ji.JOB_NAME, COUNT(*) AS consecutive_failures
-  // FROM BATCH_JOB_EXECUTION je
-  // JOIN BATCH_JOB_INSTANCE ji ON je.JOB_INSTANCE_ID = ji.JOB_INSTANCE_ID
-  // WHERE je.STATUS = 'FAILED'
-  //   AND je.JOB_EXECUTION_ID > (
-  //     SELECT COALESCE(MAX(je2.JOB_EXECUTION_ID), 0)
-  //     FROM BATCH_JOB_EXECUTION je2
-  //     WHERE je2.JOB_INSTANCE_ID = je.JOB_INSTANCE_ID
-  //       AND je2.STATUS = 'COMPLETED'
-  //   )
-  // GROUP BY ji.JOB_NAME;
-
-  return MOCK_DATA;
-}

backend/src/prediction/predictionRouter.ts

@@ -46,7 +46,7 @@ router.get('/analyses/:acdntSn', requireAuth, requirePermission('prediction', 'R
   }
 });
 
-// GET /api/prediction/analyses/:acdntSn/trajectory — 예측 결과 조회 (predRunSn으로 특정 실행 지정 가능)
+// GET /api/prediction/analyses/:acdntSn/trajectory — 최신 OpenDrift 결과 조회
 router.get('/analyses/:acdntSn/trajectory', requireAuth, requirePermission('prediction', 'READ'), async (req, res) => {
   try {
     const acdntSn = parseInt(req.params.acdntSn as string, 10);
@@ -54,8 +54,7 @@ router.get('/analyses/:acdntSn/trajectory', requireAuth, requirePermission('pred
       res.status(400).json({ error: '유효하지 않은 사고 번호' });
       return;
     }
-    const predRunSn = req.query.predRunSn ? parseInt(req.query.predRunSn as string, 10) : undefined;
-    const result = await getAnalysisTrajectory(acdntSn, predRunSn);
+    const result = await getAnalysisTrajectory(acdntSn);
     if (!result) {
       res.json({ trajectory: null, summary: null });
       return;

backend/src/prediction/predictionService.ts

@@ -19,8 +19,6 @@ interface PredictionAnalysis {
   analyst: string;
   officeName: string;
   acdntSttsCd: string;
-  predRunSn: number | null;
-  runDtm: string | null;
 }
 
 interface PredictionDetail {
@@ -144,26 +142,21 @@ export async function listAnalyses(input: ListAnalysesInput): Promise<Prediction
       S.SPIL_QTY,
       S.SPIL_UNIT_CD,
       S.FCST_HR,
-      P.PRED_RUN_SN,
-      P.RUN_DTM,
       P.KOSPS_STATUS,
       P.POSEIDON_STATUS,
       P.OPENDRIFT_STATUS,
       B.BACKTRACK_STATUS
     FROM ACDNT A
-    INNER JOIN (
+    LEFT JOIN SPIL_DATA S ON S.ACDNT_SN = A.ACDNT_SN
+    LEFT JOIN (
       SELECT
         ACDNT_SN,
-        PRED_RUN_SN,
-        MIN(BGNG_DTM) AS RUN_DTM,
-        MIN(SPIL_DATA_SN) AS SPIL_DATA_SN,
         MAX(CASE WHEN ALGO_CD = 'KOSPS' THEN EXEC_STTS_CD END) AS KOSPS_STATUS,
         MAX(CASE WHEN ALGO_CD = 'POSEIDON' THEN EXEC_STTS_CD END) AS POSEIDON_STATUS,
         MAX(CASE WHEN ALGO_CD = 'OPENDRIFT' THEN EXEC_STTS_CD END) AS OPENDRIFT_STATUS
       FROM PRED_EXEC
-      GROUP BY ACDNT_SN, PRED_RUN_SN
+      GROUP BY ACDNT_SN
     ) P ON P.ACDNT_SN = A.ACDNT_SN
-    LEFT JOIN SPIL_DATA S ON S.SPIL_DATA_SN = P.SPIL_DATA_SN
     LEFT JOIN (
       SELECT
         ACDNT_SN,
@@ -172,7 +165,7 @@ export async function listAnalyses(input: ListAnalysesInput): Promise<Prediction
       GROUP BY ACDNT_SN
     ) B ON B.ACDNT_SN = A.ACDNT_SN
     ${whereClause}
-    ORDER BY A.OCCRN_DTM DESC, P.RUN_DTM DESC NULLS LAST
+    ORDER BY A.OCCRN_DTM DESC
   `;
 
   const { rows } = await wingPool.query(sql, params);
@@ -196,8 +189,6 @@ export async function listAnalyses(input: ListAnalysesInput): Promise<Prediction
     analyst: String(row['analyst_nm'] ?? ''),
     officeName: String(row['office_nm'] ?? ''),
     acdntSttsCd: String(row['acdnt_stts_cd'] ?? 'ACTIVE'),
-    predRunSn: row['pred_run_sn'] != null ? Number(row['pred_run_sn']) : null,
-    runDtm: row['run_dtm'] ? String(row['run_dtm']) : null,
   }));
 }
 
@@ -548,27 +539,16 @@ function transformTrajectoryResult(rawResult: TrajectoryTimeStep[], model: strin
   return { trajectory, summary, stepSummaries, centerPoints, windData, hydrData };
 }
 
-export async function getAnalysisTrajectory(acdntSn: number, predRunSn?: number): Promise<TrajectoryResult | null> {
+export async function getAnalysisTrajectory(acdntSn: number): Promise<TrajectoryResult | null> {
   // 완료된 모든 모델(OPENDRIFT, POSEIDON) 결과 조회
-  // predRunSn이 있으면 해당 실행의 결과만, 없으면 최신 결과
-  const sql = predRunSn != null
-    ? `
-      SELECT ALGO_CD, RSLT_DATA, CMPL_DTM FROM wing.PRED_EXEC
-      WHERE ACDNT_SN = $1
-        AND PRED_RUN_SN = $2
-        AND ALGO_CD IN ('OPENDRIFT', 'POSEIDON')
-        AND EXEC_STTS_CD = 'COMPLETED'
-      ORDER BY CMPL_DTM DESC
-    `
-    : `
-      SELECT ALGO_CD, RSLT_DATA, CMPL_DTM FROM wing.PRED_EXEC
-      WHERE ACDNT_SN = $1
-        AND ALGO_CD IN ('OPENDRIFT', 'POSEIDON')
-        AND EXEC_STTS_CD = 'COMPLETED'
-      ORDER BY CMPL_DTM DESC
-    `;
-  const params = predRunSn != null ? [acdntSn, predRunSn] : [acdntSn];
-  const { rows } = await wingPool.query(sql, params);
+  const sql = `
+    SELECT ALGO_CD, RSLT_DATA, CMPL_DTM FROM wing.PRED_EXEC
+    WHERE ACDNT_SN = $1
+      AND ALGO_CD IN ('OPENDRIFT', 'POSEIDON')
+      AND EXEC_STTS_CD = 'COMPLETED'
+    ORDER BY CMPL_DTM DESC
+  `;
+  const { rows } = await wingPool.query(sql, [acdntSn]);
   if (rows.length === 0) return null;
 
   // 모든 모델의 파티클을 하나의 배열로 병합

backend/src/routes/simulation.ts

@@ -210,21 +210,14 @@ router.post('/run', requireAuth, async (req: Request, res: Response) => {
     if (resolvedAcdntSn && !resolvedSpilDataSn) {
       try {
         const spilRes = await wingPool.query(
-          `INSERT INTO wing.SPIL_DATA (ACDNT_SN, OIL_TP_CD, SPIL_QTY, SPIL_UNIT_CD, SPIL_TP_CD, FCST_HR, REG_DTM)
-           VALUES ($1, $2, $3, $4, $5, $6, NOW())
-           RETURNING SPIL_DATA_SN`,
-          [
-            resolvedAcdntSn,
-            OIL_DB_CODE_MAP[matTy as string] ?? 'BUNKER_C',
-            matVol ?? 0,
-            UNIT_MAP[spillUnit as string] ?? 'KL',
-            SPIL_TYPE_MAP[spillTypeCd as string] ?? 'CONTINUOUS',
-            runTime,
-          ]
+          `SELECT SPIL_DATA_SN FROM wing.SPIL_DATA WHERE ACDNT_SN = $1 ORDER BY SPIL_DATA_SN DESC LIMIT 1`,
+          [resolvedAcdntSn]
         )
-        resolvedSpilDataSn = spilRes.rows[0].spil_data_sn as number
+        if (spilRes.rows.length > 0) {
+          resolvedSpilDataSn = spilRes.rows[0].spil_data_sn as number
+        }
       } catch (dbErr) {
-        console.error('[simulation] SPIL_DATA INSERT 실패:', dbErr)
+        console.error('[simulation] SPIL_DATA 조회 실패:', dbErr)
       }
     }
 
@@ -552,47 +545,30 @@ router.post('/run-model', requireAuth, async (req: Request, res: Response) => {
     if (resolvedAcdntSn && !resolvedSpilDataSn) {
       try {
         const spilRes = await wingPool.query(
-          `INSERT INTO wing.SPIL_DATA (ACDNT_SN, OIL_TP_CD, SPIL_QTY, SPIL_UNIT_CD, SPIL_TP_CD, FCST_HR, REG_DTM)
-           VALUES ($1, $2, $3, $4, $5, $6, NOW())
-           RETURNING SPIL_DATA_SN`,
-          [
-            resolvedAcdntSn,
-            OIL_DB_CODE_MAP[matTy as string] ?? 'BUNKER_C',
-            matVol ?? 0,
-            UNIT_MAP[spillUnit as string] ?? 'KL',
-            SPIL_TYPE_MAP[spillTypeCd as string] ?? 'CONTINUOUS',
-            runTime,
-          ]
+          `SELECT SPIL_DATA_SN FROM wing.SPIL_DATA WHERE ACDNT_SN = $1 ORDER BY SPIL_DATA_SN DESC LIMIT 1`,
+          [resolvedAcdntSn]
         )
-        resolvedSpilDataSn = spilRes.rows[0].spil_data_sn as number
+        if (spilRes.rows.length > 0) {
+          resolvedSpilDataSn = spilRes.rows[0].spil_data_sn as number
+        }
       } catch (dbErr) {
-        console.error('[simulation/run-model] SPIL_DATA INSERT 실패:', dbErr)
+        console.error('[simulation/run-model] SPIL_DATA 조회 실패:', dbErr)
       }
     }
 
     const odMatTy = matTy !== undefined ? (OIL_TYPE_MAP[matTy as string] ?? (matTy as string)) : undefined
     const execNmBase = `EXPC_${Date.now()}`
 
-    // 이번 예측 실행을 식별하는 그룹 SN 생성
-    let predRunSn: number
-    try {
-      const runSnRes = await wingPool.query("SELECT nextval('wing.PRED_RUN_SN_SEQ') AS pred_run_sn")
-      predRunSn = runSnRes.rows[0].pred_run_sn as number
-    } catch (dbErr) {
-      console.error('[simulation/run-model] PRED_RUN_SN_SEQ 조회 실패:', dbErr)
-      return res.status(500).json({ error: '실행 SN 생성 실패' })
-    }
-
     // KOSPS: PRED_EXEC INSERT(PENDING)만 수행
     const execSns: Array<{ model: string; execSn: number }> = []
     if (requestedModels.includes('KOSPS')) {
       try {
         const kospsExecNm = `${execNmBase}_KOSPS`
         const insertRes = await wingPool.query(
-          `INSERT INTO wing.PRED_EXEC (ACDNT_SN, SPIL_DATA_SN, ALGO_CD, EXEC_STTS_CD, EXEC_NM, PRED_RUN_SN, BGNG_DTM)
-           VALUES ($1, $2, 'KOSPS', 'PENDING', $3, $4, NOW())
+          `INSERT INTO wing.PRED_EXEC (ACDNT_SN, SPIL_DATA_SN, ALGO_CD, EXEC_STTS_CD, EXEC_NM, BGNG_DTM)
+           VALUES ($1, $2, 'KOSPS', 'PENDING', $3, NOW())
            RETURNING PRED_EXEC_SN`,
-          [resolvedAcdntSn, resolvedSpilDataSn, kospsExecNm, predRunSn]
+          [resolvedAcdntSn, resolvedSpilDataSn, kospsExecNm]
         )
         execSns.push({ model: 'KOSPS', execSn: insertRes.rows[0].pred_exec_sn as number })
       } catch (dbErr) {
@@ -626,10 +602,10 @@ router.post('/run-model', requireAuth, async (req: Request, res: Response) => {
         let predExecSn: number
         try {
           const insertRes = await wingPool.query(
-            `INSERT INTO wing.PRED_EXEC (ACDNT_SN, SPIL_DATA_SN, ALGO_CD, EXEC_STTS_CD, EXEC_NM, PRED_RUN_SN, BGNG_DTM)
-             VALUES ($1, $2, $3, 'PENDING', $4, $5, NOW())
+            `INSERT INTO wing.PRED_EXEC (ACDNT_SN, SPIL_DATA_SN, ALGO_CD, EXEC_STTS_CD, EXEC_NM, BGNG_DTM)
+             VALUES ($1, $2, $3, 'PENDING', $4, NOW())
              RETURNING PRED_EXEC_SN`,
-            [resolvedAcdntSn, resolvedSpilDataSn, algoCd, execNm, predRunSn]
+            [resolvedAcdntSn, resolvedSpilDataSn, algoCd, execNm]
           )
           predExecSn = insertRes.rows[0].pred_exec_sn as number
         } catch (dbErr) {
@@ -737,7 +713,6 @@ router.post('/run-model', requireAuth, async (req: Request, res: Response) => {
     res.json({
       success: true,
       acdntSn: resolvedAcdntSn,
-      predRunSn,
       execSns: [...execSns, ...modelResults.map(({ model, execSn }) => ({ model, execSn }))],
       results: modelResults,
     })

backend/src/server.ts

@@ -23,7 +23,6 @@ import predictionRouter from './prediction/predictionRouter.js'
 import aerialRouter from './aerial/aerialRouter.js'
 import rescueRouter from './rescue/rescueRouter.js'
 import mapBaseRouter from './map-base/mapBaseRouter.js'
-import monitorRouter from './monitor/monitorRouter.js'
 import {
   sanitizeBody,
   sanitizeQuery,
@@ -171,7 +170,6 @@ app.use('/api/prediction', predictionRouter)
 app.use('/api/aerial', aerialRouter)
 app.use('/api/rescue', rescueRouter)
 app.use('/api/map-base', mapBaseRouter)
-app.use('/api/monitor', monitorRouter)
 
 // 헬스 체크
 app.get('/health', (_req, res) => {

database/migration/028_pred_run_sn.sql

@@ -1,25 +0,0 @@
--- Migration 028: PRED_EXEC에 실행 그룹 식별자(PRED_RUN_SN) 추가
--- 같은 시점에 여러 모델로 실행된 PRED_EXEC 레코드를 하나의 "예측 실행"으로 묶는다.
--- 목록 화면에서 사고당 예측 실행 횟수만큼 행을 표시하기 위한 기반 구조.
-
--- 1. 컬럼 추가
-ALTER TABLE wing.PRED_EXEC ADD COLUMN IF NOT EXISTS PRED_RUN_SN INTEGER;
-
--- 2. 기존 데이터 마이그레이션
--- 같은 ACDNT_SN + 시작 시각 60초 이내의 레코드를 동일 실행 그룹으로 묶는다.
--- MIN(PRED_EXEC_SN)을 그룹 대표 키로 사용한다.
-UPDATE wing.PRED_EXEC pe1
-SET PRED_RUN_SN = (
-  SELECT MIN(pe2.PRED_EXEC_SN)
-  FROM wing.PRED_EXEC pe2
-  WHERE pe2.ACDNT_SN = pe1.ACDNT_SN
-    AND ABS(EXTRACT(EPOCH FROM (
-      COALESCE(pe2.BGNG_DTM, NOW()) - COALESCE(pe1.BGNG_DTM, NOW())
-    ))) < 60
-)
-WHERE pe1.PRED_RUN_SN IS NULL;
-
--- 3. 시퀀스 생성 (신규 실행용 — 기존 최대값보다 충분히 높은 값에서 시작)
-CREATE SEQUENCE IF NOT EXISTS wing.PRED_RUN_SN_SEQ
-  START WITH 10000
-  INCREMENT BY 1;

docs/RELEASE-NOTES.md

@@ -4,14 +4,6 @@
 
 ## [Unreleased]
 
-### 추가
-- 예측: 실행 이력 선택 기능 (predRunSn 기반 특정 예측 결과 조회)
-- DB: PRED_RUN_SN 마이그레이션 추가 (028_pred_run_sn)
-- 관리자: 수치예측자료 연계 모니터링 패널 추가 (HYCOM·GFS·WW3·KOAST POS_WIND/HYDR/WAVE)
-
-### 변경
-- 보고서: 기능 개선 (TemplateEditPage, ReportGenerator, hwpxExport 등)
-
 ## [2026-03-24]
 
 ### 추가

frontend/src/tabs/admin/components/AdminView.tsx

@@ -15,7 +15,6 @@ import LayerPanel from './LayerPanel';
 import SensitiveLayerPanel from './SensitiveLayerPanel';
 import DispersingZonePanel from './DispersingZonePanel';
 import MonitorRealtimePanel from './MonitorRealtimePanel';
-import MonitorForecastPanel from './MonitorForecastPanel';
 import VesselMaterialsPanel from './VesselMaterialsPanel';
 
 /** 기존 패널이 있는 메뉴 ID 매핑 */
@@ -37,7 +36,6 @@ const PANEL_MAP: Record<string, () => JSX.Element> = {
   'dispersant-zone': () => <DispersingZonePanel />,
   'vessel-materials': () => <VesselMaterialsPanel />,
   'monitor-realtime': () => <MonitorRealtimePanel />,
-  'monitor-forecast': () => <MonitorForecastPanel />,
 };
 
 export function AdminView() {

frontend/src/tabs/admin/components/MonitorForecastPanel.tsx

@@ -1,273 +0,0 @@
-import { useState, useEffect, useCallback } from 'react';
-import {
-  getNumericalDataStatus,
-  type NumericalDataStatus,
-} from '../services/monitorApi';
-
-type TabId = 'all' | 'ocean' | 'koast';
-
-const TABS: { id: TabId; label: string }[] = [
-  { id: 'all', label: '전체' },
-  { id: 'ocean', label: '기상·해양 모델' },
-  { id: 'koast', label: 'KOAST' },
-];
-
-const OCEAN_MODELS = ['HYCOM', 'GFS', 'WW3'];
-const KOAST_MODELS = ['KOAST POS_WIND', 'KOAST POS_HYDR', 'KOAST POS_WAVE'];
-
-function filterByTab(rows: NumericalDataStatus[], tab: TabId): NumericalDataStatus[] {
-  if (tab === 'ocean') return rows.filter((r) => OCEAN_MODELS.includes(r.modelName));
-  if (tab === 'koast') return rows.filter((r) => KOAST_MODELS.includes(r.modelName));
-  return rows;
-}
-
-function formatDuration(sec: number | null): string {
-  if (sec == null) return '-';
-  const m = Math.floor(sec / 60);
-  const s = sec % 60;
-  return m > 0 ? `${m}분 ${s}초` : `${s}초`;
-}
-
-function formatDatetime(iso: string | null): string {
-  if (!iso) return '-';
-  const d = new Date(iso);
-  const mm = String(d.getMonth() + 1).padStart(2, '0');
-  const dd = String(d.getDate()).padStart(2, '0');
-  const hh = String(d.getHours()).padStart(2, '0');
-  const min = String(d.getMinutes()).padStart(2, '0');
-  return `${mm}-${dd} ${hh}:${min}`;
-}
-
-function formatTime(iso: string | null): string {
-  if (!iso) return '-';
-  const d = new Date(iso);
-  const hh = String(d.getHours()).padStart(2, '0');
-  const min = String(d.getMinutes()).padStart(2, '0');
-  return `${hh}:${min}`;
-}
-
-function StatusCell({ row }: { row: NumericalDataStatus }) {
-  if (row.lastStatus === 'COMPLETED') {
-    return <span className="text-emerald-400 text-xs">정상</span>;
-  }
-  if (row.lastStatus === 'FAILED') {
-    return (
-      <span className="text-red-400 text-xs">
-        오류{row.consecutiveFailures > 0 ? ` (${row.consecutiveFailures}회 연속)` : ''}
-      </span>
-    );
-  }
-  if (row.lastStatus === 'STARTED') {
-    return (
-      <span className="inline-flex items-center gap-1 text-cyan-400 text-xs">
-        <span className="w-1.5 h-1.5 rounded-full bg-cyan-400 animate-pulse" />
-        실행 중
-      </span>
-    );
-  }
-  return <span className="text-t3 text-xs">-</span>;
-}
-
-function StatusBadge({
-  loading,
-  errorCount,
-  total,
-}: {
-  loading: boolean;
-  errorCount: number;
-  total: number;
-}) {
-  if (loading) {
-    return (
-      <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs bg-bg-2 text-t2">
-        <span className="w-1.5 h-1.5 rounded-full bg-cyan-400 animate-pulse" />
-        조회 중...
-      </span>
-    );
-  }
-  if (errorCount === total && total > 0) {
-    return (
-      <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs bg-red-500/10 text-red-400">
-        <span className="w-1.5 h-1.5 rounded-full bg-red-400" />
-        연계 오류
-      </span>
-    );
-  }
-  if (errorCount > 0) {
-    return (
-      <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs bg-yellow-500/10 text-yellow-400">
-        <span className="w-1.5 h-1.5 rounded-full bg-yellow-400" />
-        일부 오류 ({errorCount}/{total})
-      </span>
-    );
-  }
-  return (
-    <span className="inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs bg-emerald-500/10 text-emerald-400">
-      <span className="w-1.5 h-1.5 rounded-full bg-emerald-400" />
-      정상
-    </span>
-  );
-}
-
-const TABLE_HEADERS = [
-  '모델명',
-  '데이터 기준일',
-  '마지막 다운로드',
-  '상태',
-  '소요 시간',
-  '다음 예정',
-];
-
-function ForecastTable({
-  rows,
-  loading,
-}: {
-  rows: NumericalDataStatus[];
-  loading: boolean;
-}) {
-  return (
-    <div className="overflow-auto">
-      <table className="w-full text-xs border-collapse">
-        <thead>
-          <tr className="bg-bg-2 text-t3 uppercase tracking-wide">
-            {TABLE_HEADERS.map((h) => (
-              <th
-                key={h}
-                className="px-3 py-2 text-left font-medium border-b border-border-1 whitespace-nowrap"
-              >
-                {h}
-              </th>
-            ))}
-          </tr>
-        </thead>
-        <tbody>
-          {loading && rows.length === 0
-            ? Array.from({ length: 6 }).map((_, i) => (
-                <tr key={i} className="border-b border-border-1 animate-pulse">
-                  {TABLE_HEADERS.map((_, j) => (
-                    <td key={j} className="px-3 py-2">
-                      <div className="h-3 bg-bg-2 rounded w-16" />
-                    </td>
-                  ))}
-                </tr>
-              ))
-            : rows.map((row) => (
-                <tr key={row.jobName} className="border-b border-border-1 hover:bg-bg-1/50">
-                  <td className="px-3 py-2 font-medium text-t1 whitespace-nowrap">
-                    {row.modelName}
-                  </td>
-                  <td className="px-3 py-2 text-t2">{row.lastDataDate ?? '-'}</td>
-                  <td className="px-3 py-2 text-t2">{formatDatetime(row.lastDownloadedAt)}</td>
-                  <td className="px-3 py-2">
-                    <StatusCell row={row} />
-                  </td>
-                  <td className="px-3 py-2 text-t2">{formatDuration(row.durationSec)}</td>
-                  <td className="px-3 py-2 text-t2">{formatTime(row.nextScheduledAt)}</td>
-                </tr>
-              ))}
-        </tbody>
-      </table>
-    </div>
-  );
-}
-
-export default function MonitorForecastPanel() {
-  const [activeTab, setActiveTab] = useState<TabId>('all');
-  const [rows, setRows] = useState<NumericalDataStatus[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [lastUpdate, setLastUpdate] = useState<Date | null>(null);
-
-  const fetchData = useCallback(async () => {
-    setLoading(true);
-    try {
-      const data = await getNumericalDataStatus();
-      setRows(data);
-      setLastUpdate(new Date());
-    } catch {
-      // 오류 시 기존 데이터 유지
-    } finally {
-      setLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    void fetchData();
-  }, [fetchData]);
-
-  const visibleRows = filterByTab(rows, activeTab);
-  const errorCount = visibleRows.filter(
-    (r) => r.lastStatus === 'FAILED'
-  ).length;
-  const totalCount = visibleRows.length;
-
-  return (
-    <div className="flex flex-col h-full overflow-hidden">
-      {/* 헤더 */}
-      <div className="flex items-center justify-between px-5 py-3 border-b border-border-1 shrink-0">
-        <h2 className="text-sm font-semibold text-t1">수치예측자료 모니터링</h2>
-        <div className="flex items-center gap-3">
-          {lastUpdate && (
-            <span className="text-xs text-t3">
-              갱신:{' '}
-              {lastUpdate.toLocaleTimeString('ko-KR', {
-                hour: '2-digit',
-                minute: '2-digit',
-                second: '2-digit',
-              })}
-            </span>
-          )}
-          <button
-            onClick={() => void fetchData()}
-            disabled={loading}
-            className="flex items-center gap-1.5 px-3 py-1.5 text-xs rounded bg-bg-2 hover:bg-bg-3 text-t2 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
-          >
-            <svg
-              className={`w-3.5 h-3.5 ${loading ? 'animate-spin' : ''}`}
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke="currentColor"
-            >
-              <path
-                strokeLinecap="round"
-                strokeLinejoin="round"
-                strokeWidth={2}
-                d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
-              />
-            </svg>
-            새로고침
-          </button>
-        </div>
-      </div>
-
-      {/* 탭 */}
-      <div className="flex gap-0 border-b border-border-1 shrink-0 px-5">
-        {TABS.map((tab) => (
-          <button
-            key={tab.id}
-            onClick={() => setActiveTab(tab.id)}
-            className={`px-4 py-2.5 text-xs font-medium border-b-2 transition-colors ${
-              activeTab === tab.id
-                ? 'border-cyan-400 text-cyan-400'
-                : 'border-transparent text-t3 hover:text-t2'
-            }`}
-          >
-            {tab.label}
-          </button>
-        ))}
-      </div>
-
-      {/* 상태 표시줄 */}
-      <div className="flex items-center gap-3 px-5 py-2 shrink-0 border-b border-border-1 bg-bg-0">
-        <StatusBadge loading={loading} errorCount={errorCount} total={totalCount} />
-        {!loading && totalCount > 0 && (
-          <span className="text-xs text-t3">모델 {totalCount}개</span>
-        )}
-      </div>
-
-      {/* 테이블 */}
-      <div className="flex-1 overflow-auto p-5">
-        <ForecastTable rows={visibleRows} loading={loading} />
-      </div>
-    </div>
-  );
-}

frontend/src/tabs/admin/services/monitorApi.ts

@@ -1,17 +0,0 @@
-import { api } from '@common/services/api';
-
-export interface NumericalDataStatus {
-  modelName: string;
-  jobName: string;
-  lastStatus: 'COMPLETED' | 'FAILED' | 'STARTED' | 'UNKNOWN';
-  lastDataDate: string | null;
-  lastDownloadedAt: string | null;
-  nextScheduledAt: string | null;
-  durationSec: number | null;
-  consecutiveFailures: number;
-}
-
-export async function getNumericalDataStatus(): Promise<NumericalDataStatus[]> {
-  const res = await api.get<NumericalDataStatus[]>('/monitor/numerical');
-  return res.data;
-}

frontend/src/tabs/prediction/components/AnalysisListTable.tsx

@@ -153,7 +153,6 @@ export function AnalysisListTable({ onTabChange, onSelectAnalysis }: AnalysisLis
               <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">번호</th>
               <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">사고명</th>
               <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">사고일시</th>
-              <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">예측 실행</th>
               <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">예측시간</th>
               <th className="px-4 py-3 text-left text-xs font-bold text-text-3 uppercase tracking-wider">유종</th>
               <th className="px-4 py-3 text-right text-xs font-bold text-text-3 uppercase tracking-wider">유출량</th>
@@ -168,7 +167,7 @@ export function AnalysisListTable({ onTabChange, onSelectAnalysis }: AnalysisLis
           <tbody className="divide-y divide-border">
             {currentAnalyses.map((analysis) => (
               <tr
-                key={analysis.predRunSn ?? analysis.acdntSn}
+                key={analysis.acdntSn}
                 className="hover:bg-bg-2 transition-colors cursor-pointer group"
               >
                 <td className="px-4 py-3 text-sm text-text-2 font-mono">{analysis.acdntSn}</td>
@@ -189,7 +188,6 @@ export function AnalysisListTable({ onTabChange, onSelectAnalysis }: AnalysisLis
                   </div>
                 </td>
                 <td className="px-4 py-3 text-sm text-text-2 font-mono">{analysis.occurredAt ? new Date(analysis.occurredAt).toLocaleString('ko-KR', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) : '—'}</td>
-                <td className="px-4 py-3 text-sm text-text-2 font-mono">{analysis.runDtm ? new Date(analysis.runDtm).toLocaleString('ko-KR', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' }) : '—'}</td>
                 <td className="px-4 py-3 text-sm text-text-2 font-mono">{analysis.duration}</td>
                 <td className="px-4 py-3 text-sm text-text-2">{analysis.oilType}</td>
                 <td className="px-4 py-3 text-sm text-text-1 font-mono text-right font-semibold">

frontend/src/tabs/prediction/components/OilSpillView.tsx

@@ -519,7 +519,7 @@ export function OilSpillView() {
       analysis.opendriftStatus === 'completed' || analysis.poseidonStatus === 'completed';
     if (hasCompletedModel) {
       try {
-        const { trajectory, summary, centerPoints: cp, windDataByModel: wdByModel, hydrDataByModel: hdByModel, summaryByModel: sbModel, stepSummariesByModel: stepSbModel } = await fetchAnalysisTrajectory(analysis.acdntSn, analysis.predRunSn ?? undefined)
+        const { trajectory, summary, centerPoints: cp, windDataByModel: wdByModel, hydrDataByModel: hdByModel, summaryByModel: sbModel, stepSummariesByModel: stepSbModel } = await fetchAnalysisTrajectory(analysis.acdntSn)
         if (trajectory && trajectory.length > 0) {
           setOilTrajectory(trajectory)
           if (summary) setSimulationSummary(summary)
@@ -1264,13 +1264,7 @@ export function OilSpillView() {
       {activeSubTab === 'analysis' && (
         <RightPanel
           onOpenBacktrack={handleOpenBacktrack}
-          onOpenRecalc={() => {
-            if (!selectedAnalysis) {
-              alert('선택된 사고가 없습니다.\n분석 목록에서 사고를 선택해주세요.');
-              return;
-            }
-            setRecalcModalOpen(true);
-          }}
+          onOpenRecalc={() => setRecalcModalOpen(true)}
           onOpenReport={handleOpenReport}
           detail={analysisDetail}
           summary={stepSummariesByModel[windHydrModel]?.[currentStep] ?? summaryByModel[windHydrModel] ?? simulationSummary}
@@ -1318,7 +1312,6 @@ export function OilSpillView() {
       <RecalcModal
         isOpen={recalcModalOpen}
         onClose={() => setRecalcModalOpen(false)}
-        incidentName={selectedAnalysis?.acdntNm || incidentName}
         oilType={oilType}
         spillAmount={spillAmount}
         spillType={spillType}

frontend/src/tabs/prediction/components/RecalcModal.tsx

@@ -4,7 +4,6 @@ import type { PredictionModel } from './OilSpillView'
 interface RecalcModalProps {
   isOpen: boolean
   onClose: () => void
-  incidentName: string
   oilType: string
   spillAmount: number
   spillType: string
@@ -25,14 +24,11 @@ type RecalcPhase = 'editing' | 'running' | 'done'
 
 const OIL_TYPES = ['벙커C유', '원유(중질)', '원유(경질)', '디젤유(경유)', '휘발유', '등유', '윤활유', 'HFO 380', 'HFO 180']
 const SPILL_TYPES = ['연속', '순간', '점진적']
-const PREDICTION_TIMES = [6, 12, 24, 48, 72, 96, 120]
-const snapToValidTime = (t: number): number =>
-  PREDICTION_TIMES.includes(t) ? t : (PREDICTION_TIMES.find(h => h >= t) ?? PREDICTION_TIMES[0])
+const PREDICTION_TIMES = [12, 24, 48, 72, 96, 120]
 
 export function RecalcModal({
   isOpen,
   onClose,
-  incidentName,
   oilType: initOilType,
   spillAmount: initSpillAmount,
   spillType: initSpillType,
@@ -47,7 +43,7 @@ export function RecalcModal({
   const [spillAmount, setSpillAmount] = useState(initSpillAmount)
   const [spillUnit, setSpillUnit] = useState<'kl' | 'ton' | 'bbl'>('kl')
   const [spillType, setSpillType] = useState(initSpillType)
-  const [predictionTime, setPredictionTime] = useState(() => snapToValidTime(initPredictionTime))
+  const [predictionTime, setPredictionTime] = useState(initPredictionTime)
   const [lat, setLat] = useState(initCoord.lat)
   const [lon, setLon] = useState(initCoord.lon)
   const [models, setModels] = useState<Set<PredictionModel>>(new Set(initModels))
@@ -60,7 +56,7 @@ export function RecalcModal({
       setOilType(initOilType)
       setSpillAmount(initSpillAmount)
       setSpillType(initSpillType)
-      setPredictionTime(snapToValidTime(initPredictionTime))
+      setPredictionTime(initPredictionTime)
       setLat(initCoord.lat)
       setLon(initCoord.lon)
       setModels(new Set(initModels))
@@ -167,7 +163,7 @@ export function RecalcModal({
               현재 분석 정보
             </div>
             <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '4px' }} className="text-[9px]">
-              <InfoItem label="사고명" value={incidentName} />
+              <InfoItem label="사고명" value="여수 앞바다 유류오염" />
               <InfoItem label="유종" value={initOilType} />
               <InfoItem label="유출량" value={`${initSpillAmount} kl`} />
               <InfoItem label="예측시간" value={`${initPredictionTime}시간`} />
@@ -269,26 +265,30 @@ export function RecalcModal({
           <FieldGroup label="예측 모델 선택">
             <div className="flex flex-wrap gap-1.5">
               {([
-                { model: 'KOSPS' as PredictionModel, color: 'var(--cyan)', ready: false },
-                { model: 'POSEIDON' as PredictionModel, color: 'var(--red)', ready: true },
-                { model: 'OpenDrift' as PredictionModel, color: 'var(--blue)', ready: true },
-              ]).map(({ model, color, ready }) => (
+                { model: 'KOSPS' as PredictionModel, color: '#3b82f6' },
+                { model: 'POSEIDON' as PredictionModel, color: '#22c55e' },
+                { model: 'OpenDrift' as PredictionModel, color: '#f97316' },
+              ]).map(({ model, color }) => (
                 <button
                   key={model}
                   className={`prd-mc ${models.has(model) ? 'on' : ''}`}
-                  onClick={() => {
-                    if (!ready) {
-                      alert(`${model} 모델은 현재 준비중입니다.`)
-                      return
-                    }
-                    toggleModel(model)
-                  }}
+                  onClick={() => toggleModel(model)}
                   style={{ fontSize: '11px', padding: '5px 10px' }}
                 >
                   <span className="prd-md" style={{ background: color }} />
                   {model}
                 </button>
               ))}
+              <button
+                className={`prd-mc ${models.size === 3 ? 'on' : ''}`}
+                onClick={() => {
+                  if (models.size === 3) setModels(new Set(['KOSPS']))
+                  else setModels(new Set(['KOSPS', 'POSEIDON', 'OpenDrift']))
+                }}
+                style={{ fontSize: '11px', padding: '5px 10px' }}
+              >
+                앙상블
+              </button>
             </div>
           </FieldGroup>
         </div>

frontend/src/tabs/prediction/components/RightPanel.tsx

@@ -63,11 +63,10 @@ export function RightPanel({
   const [insuranceExpanded, setInsuranceExpanded] = useState(false)
 
   const weatheringStatus = useMemo(() => {
-    const zero = { surface: 0, evaporation: 0, dispersion: 0, boom: 0, beached: 0 };
-    if (!summary) return zero;
+    if (!summary) return null;
     const total = summary.remainingVolume + summary.evaporationVolume
       + summary.dispersionVolume + summary.beachedVolume + boomBlockedVolume;
-    if (total <= 0) return zero;
+    if (total <= 0) return null;
     const pct = (v: number) => Math.round((v / total) * 100);
     return {
       surface: pct(summary.remainingVolume),
@@ -289,13 +288,17 @@ export function RightPanel({
         {/* 유출유 풍화 상태 */}
         <Section title="유출유 풍화 상태">
           <div className="flex flex-col gap-[3px] text-[8px]">
-            <>
-              <ProgressBar label="수면잔류" value={weatheringStatus.surface}     color="var(--blue)" />
-              <ProgressBar label="증발"     value={weatheringStatus.evaporation} color="var(--cyan)" />
-              <ProgressBar label="분산"     value={weatheringStatus.dispersion}  color="var(--green)" />
-              <ProgressBar label="펜스차단" value={weatheringStatus.boom}        color="var(--boom)" />
-              <ProgressBar label="해안도달" value={weatheringStatus.beached}     color="var(--red)" />
-            </>
+            {weatheringStatus ? (
+              <>
+                <ProgressBar label="수면잔류" value={weatheringStatus.surface}     color="var(--blue)" />
+                <ProgressBar label="증발"     value={weatheringStatus.evaporation} color="var(--cyan)" />
+                <ProgressBar label="분산"     value={weatheringStatus.dispersion}  color="var(--green)" />
+                <ProgressBar label="펜스차단" value={weatheringStatus.boom}        color="var(--boom)" />
+                <ProgressBar label="해안도달" value={weatheringStatus.beached}     color="var(--red)" />
+              </>
+            ) : (
+              <p className="text-[9px] text-text-3 font-korean text-center py-2">시뮬레이션 실행 후 표시됩니다</p>
+            )}
           </div>
         </Section>
 

frontend/src/tabs/prediction/services/predictionApi.ts

@@ -19,8 +19,6 @@ export interface PredictionAnalysis {
   analyst: string;
   officeName: string;
   acdntSttsCd: string;
-  predRunSn: number | null;
-  runDtm: string | null;
 }
 
 export interface PredictionDetail {
@@ -218,11 +216,8 @@ export interface TrajectoryResponse {
   stepSummariesByModel?: Record<string, SimulationSummary[]>;
 }
 
-export const fetchAnalysisTrajectory = async (acdntSn: number, predRunSn?: number): Promise<TrajectoryResponse> => {
-  const response = await api.get<TrajectoryResponse>(
-    `/prediction/analyses/${acdntSn}/trajectory`,
-    predRunSn != null ? { params: { predRunSn } } : undefined,
-  );
+export const fetchAnalysisTrajectory = async (acdntSn: number): Promise<TrajectoryResponse> => {
+  const response = await api.get<TrajectoryResponse>(`/prediction/analyses/${acdntSn}/trajectory`);
   return response.data;
 };
 

frontend/src/tabs/reports/components/ReportGenerator.tsx

@@ -68,7 +68,7 @@ function ReportGenerator({ onSave }: ReportGeneratorProps) {
 
   const handleSave = async () => {
     const report = createEmptyReport()
-    report.reportType = activeCat === 0 ? '유출유 보고' : activeCat === 1 ? '종합보고서' : '초기보고서'
+    report.reportType = activeCat === 0 ? '예측보고서' : activeCat === 1 ? '종합보고서' : '초기보고서'
     report.analysisCategory = activeCat === 0 ? '유출유 확산예측' : activeCat === 1 ? 'HNS 대기확산' : '긴급구난'
     report.title = cat.reportName
     report.status = '완료'

frontend/src/tabs/reports/components/ReportsView.tsx

@@ -21,7 +21,6 @@ import {
 import type { TemplateType } from './reportTypes';
 import TemplateFormEditor from './TemplateFormEditor'
 import ReportGenerator from './ReportGenerator'
-import TemplateEditPage from './TemplateEditPage'
 
 // ─── Main ReportsView ────────────────────────────────────
 export function ReportsView() {
@@ -217,19 +216,8 @@ export function ReportsView() {
 
         {/* ──── 수정 ──── */}
         {view.screen === 'edit' && (
-          <div className="flex-1 overflow-hidden flex flex-col">
-            {view.data.reportType === '유출유 보고' ? (
-              <div className="flex-1 overflow-auto px-4 py-4">
-                <OilSpillReportTemplate mode="edit" initialData={view.data} onSave={handleSave} onBack={() => { setView({ screen: 'list' }); setActiveSubTab('report-list'); refreshList() }} />
-              </div>
-            ) : (
-              <TemplateEditPage
-                reportType={view.data.reportType}
-                initialData={view.data}
-                onSave={handleSave}
-                onBack={() => { setView({ screen: 'list' }); setActiveSubTab('report-list'); refreshList() }}
-              />
-            )}
+          <div className="flex-1 overflow-auto px-4 py-4">
+            <OilSpillReportTemplate mode="edit" initialData={view.data} onSave={handleSave} onBack={() => { setView({ screen: 'list' }); setActiveSubTab('report-list'); refreshList() }} />
           </div>
         )}
 
@@ -295,8 +283,7 @@ export function ReportsView() {
                 <div className="text-center font-korean mb-0.5 text-[9px] text-text-3">문서 저장</div>
                 <button
                   onClick={() => {
-                    const lookupType = previewReport.reportType === '유출유 보고' ? '예측보고서' : previewReport.reportType
-                    const tpl = templateTypes.find(t => t.id === lookupType)
+                    const tpl = templateTypes.find(t => t.id === previewReport.reportType)
                     if (tpl) {
                       const getVal = buildReportGetVal(previewReport)
                       const html = generateReportHTML(tpl.label, { writeTime: previewReport.incident.writeTime, author: previewReport.author, jurisdiction: previewReport.jurisdiction }, tpl.sections, getVal)
@@ -309,24 +296,18 @@ export function ReportsView() {
                   <span>📄</span> PDF 저장
                 </button>
                 <button
-                  onClick={async () => {
-                    const lookupType = previewReport.reportType === '유출유 보고' ? '예측보고서' : previewReport.reportType
-                    const tpl = templateTypes.find(t => t.id === lookupType) as TemplateType | undefined
+                  onClick={() => {
+                    const tpl = templateTypes.find(t => t.id === previewReport.reportType) as TemplateType | undefined
                     if (tpl) {
-                      try {
-                        const getVal = buildReportGetVal(previewReport)
-                        const meta = { writeTime: previewReport.incident.writeTime, author: previewReport.author, jurisdiction: previewReport.jurisdiction }
-                        const filename = previewReport.title || tpl.label
-                        await exportAsHWP(tpl.label, meta, tpl.sections, getVal, filename, {
-                          step3: previewReport.step3MapImage || undefined,
-                          step6: previewReport.step6MapImage || undefined,
-                          sensitiveMap: previewReport.sensitiveMapImage || undefined,
-                          sensitivityMap: previewReport.sensitivityMapImage || undefined,
-                        })
-                      } catch (err) {
-                        console.error('[reports] HWPX 저장 오류:', err)
-                        alert('HWPX 저장 중 오류가 발생했습니다.')
-                      }
+                      const getVal = buildReportGetVal(previewReport)
+                      const meta = { writeTime: previewReport.incident.writeTime, author: previewReport.author, jurisdiction: previewReport.jurisdiction }
+                      const filename = previewReport.title || tpl.label
+                      exportAsHWP(tpl.label, meta, tpl.sections, getVal, filename, {
+                        step3: previewReport.step3MapImage || undefined,
+                        step6: previewReport.step6MapImage || undefined,
+                        sensitiveMap: previewReport.sensitiveMapImage || undefined,
+                        sensitivityMap: previewReport.sensitivityMapImage || undefined,
+                      })
                     }
                   }}
                   className="w-full flex items-center justify-center gap-1.5 font-korean text-[12px] font-bold cursor-pointer rounded-md py-[11px]"

frontend/src/tabs/reports/components/TemplateEditPage.tsx

@@ -1,396 +0,0 @@
-import { useState, useEffect, useCallback } from 'react';
-import { type OilSpillReportData, type ReportType } from './OilSpillReportTemplate';
-import { templateTypes, type TemplateType, ANALYSIS_SEP, ANALYSIS_FIELD_ORDER } from './reportTypes';
-import { saveReport } from '../services/reportsApi';
-
-interface TemplateEditPageProps {
-  reportType: ReportType;
-  initialData: OilSpillReportData;
-  onSave: () => void;
-  onBack: () => void;
-}
-
-// ── Textarea-type keys that map to analysis field ──────────
-const ANALYSIS_KEYS = new Set([
-  'initialResponse', 'futurePlan',
-  'responseStatus', 'suggestions',
-  'spreadSummary', 'responseDetail', 'damageReport', 'futurePlanDetail',
-  'spreadAnalysis', 'analysis',
-])
-
-
-function getInitialValue(key: string, data: OilSpillReportData, reportType: ReportType): string {
-  if (key.startsWith('incident.')) {
-    const field = key.slice('incident.'.length) as keyof OilSpillReportData['incident'];
-    return (data.incident as Record<string, string>)[field] ?? '';
-  }
-  if (key === 'author') return data.author;
-  if (ANALYSIS_KEYS.has(key)) {
-    const fields = ANALYSIS_FIELD_ORDER[reportType];
-    if (fields) {
-      const idx = fields.indexOf(key);
-      if (idx < 0) return '';
-      const analysis = data.analysis || '';
-      if (!analysis.includes(ANALYSIS_SEP)) {
-        // 레거시 데이터: 첫 번째 필드에만 배분
-        return idx === 0 ? analysis : '';
-      }
-      const parts = analysis.split(ANALYSIS_SEP);
-      return parts[idx] || '';
-    }
-    return data.analysis || '';
-  }
-  if (key.startsWith('__')) return '';
-  return '';
-}
-
-function buildAnalysis(reportType: ReportType, formData: Record<string, string>): string {
-  const fields = ANALYSIS_FIELD_ORDER[reportType];
-  if (fields) {
-    return fields.map(k => formData[k] || '').join(ANALYSIS_SEP);
-  }
-  switch (reportType) {
-    case '예측보고서':
-      return formData['analysis'] || '';
-    default:
-      return '';
-  }
-}
-
-// ── Section content renderer ────────────────────────────────
-interface SectionBlockProps {
-  section: TemplateType['sections'][number];
-  getVal: (key: string) => string;
-  setVal: (key: string, val: string) => void;
-}
-
-function SectionBlock({ section, getVal, setVal }: SectionBlockProps) {
-  return (
-    <div style={{
-      position: 'relative',
-      background: 'var(--bg1)',
-      padding: '28px 36px',
-      marginBottom: '16px',
-      borderRadius: '6px',
-      border: '1px solid var(--bd)',
-    }}>
-      <div style={{ position: 'absolute', top: 10, right: 16, fontSize: '9px', color: 'var(--t3)', fontWeight: 600 }}>
-        해양오염방제지원시스템
-      </div>
-
-      {/* Section header */}
-      <div style={{
-        background: 'rgba(6,182,212,0.12)', color: 'var(--cyan)', padding: '8px 16px',
-        fontSize: '13px', fontWeight: 700, marginBottom: '16px', borderRadius: '4px',
-        border: '1px solid rgba(6,182,212,0.2)',
-      }}>
-        {section.title}
-      </div>
-
-      {/* Fields table */}
-      <table style={{ width: '100%', tableLayout: 'fixed', borderCollapse: 'collapse', fontSize: '11px' }}>
-        <colgroup>
-          <col style={{ width: '160px' }} />
-          <col />
-        </colgroup>
-        <tbody>
-          {section.fields.map((field, fIdx) => {
-            // ── Read-only auto-calculated keys ──
-            if (field.key.startsWith('__')) {
-              return (
-                <tr key={fIdx}>
-                  <td
-                    colSpan={2}
-                    style={{ border: '1px solid var(--bd)', padding: '12px 14px' }}
-                  >
-                    <span style={{ color: 'var(--t3)', fontStyle: 'italic', fontSize: '11px' }}>
-                      {section.title} — 자동 계산 데이터 (확인 전용)
-                    </span>
-                  </td>
-                </tr>
-              );
-            }
-
-            // ── Textarea (no label = full-width, or labeled textarea) ──
-            if (field.type === 'textarea' || !field.label) {
-              return (
-                <tr key={fIdx}>
-                  {field.label && (
-                    <td style={{
-                      background: 'var(--bg3)', border: '1px solid var(--bd)',
-                      padding: '8px 14px', fontWeight: 600, color: 'var(--t2)',
-                      verticalAlign: 'top', fontSize: '11px',
-                    }}>
-                      {field.label}
-                    </td>
-                  )}
-                  <td
-                    colSpan={field.label ? 1 : 2}
-                    style={{ border: '1px solid var(--bd)', padding: '6px' }}
-                  >
-                    <textarea
-                      value={getVal(field.key)}
-                      onChange={e => setVal(field.key, e.target.value)}
-                      placeholder="내용을 입력하세요..."
-                      style={{
-                        width: '100%', minHeight: '110px',
-                        background: 'var(--bg0)', border: '1px solid var(--bdL)',
-                        borderRadius: '3px', padding: '8px 12px',
-                        fontSize: '12px', outline: 'none', resize: 'vertical',
-                        color: 'var(--t1)', fontFamily: 'inherit',
-                      }}
-                    />
-                  </td>
-                </tr>
-              );
-            }
-
-            // ── Checkbox group ──
-            if (field.type === 'checkbox-group' && field.options) {
-              return (
-                <tr key={fIdx}>
-                  <td style={{
-                    background: 'var(--bg3)', border: '1px solid var(--bd)',
-                    padding: '8px 14px', fontWeight: 600, color: 'var(--t2)',
-                    verticalAlign: 'middle', fontSize: '11px',
-                  }}>
-                    {field.label}
-                  </td>
-                  <td style={{ border: '1px solid var(--bd)', padding: '8px 14px' }}>
-                    <div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap' }}>
-                      {field.options.map(opt => (
-                        <label key={opt} style={{
-                          display: 'flex', alignItems: 'center', gap: '6px',
-                          fontSize: '11px', color: 'var(--t2)', cursor: 'pointer',
-                        }}>
-                          <input type="checkbox" style={{ accentColor: '#06b6d4' }} />
-                          {opt}
-                        </label>
-                      ))}
-                    </div>
-                  </td>
-                </tr>
-              );
-            }
-
-            // ── Default: text input ──
-            return (
-              <tr key={fIdx}>
-                <td style={{
-                  background: 'var(--bg3)', border: '1px solid var(--bd)',
-                  padding: '8px 14px', fontWeight: 600, color: 'var(--t2)',
-                  verticalAlign: 'middle', fontSize: '11px',
-                }}>
-                  {field.label}
-                </td>
-                <td style={{ border: '1px solid var(--bd)', padding: '5px 10px' }}>
-                  <input
-                    value={getVal(field.key)}
-                    onChange={e => setVal(field.key, e.target.value)}
-                    placeholder={`${field.label} 입력`}
-                    style={{
-                      width: '100%', background: 'transparent', border: 'none',
-                      fontSize: '11px', outline: 'none', color: 'var(--t1)', padding: '2px 0',
-                    }}
-                  />
-                </td>
-              </tr>
-            );
-          })}
-        </tbody>
-      </table>
-    </div>
-  );
-}
-
-// ── Main Component ──────────────────────────────────────────
-export default function TemplateEditPage({ reportType, initialData, onSave, onBack }: TemplateEditPageProps) {
-  const template = templateTypes.find(t => t.id === reportType)!;
-  const sections = template.sections;
-
-  const buildInitialFormData = useCallback(() => {
-    const init: Record<string, string> = {};
-    sections.forEach(sec => {
-      sec.fields.forEach(f => {
-        init[f.key] = getInitialValue(f.key, initialData, reportType);
-      });
-    });
-    return init;
-  }, [sections, initialData, reportType]);
-
-  const [formData, setFormData] = useState<Record<string, string>>(buildInitialFormData);
-  const [title, setTitle] = useState(initialData.title || '');
-  const [currentPage, setCurrentPage] = useState(0);
-  const [viewMode, setViewMode] = useState<'page' | 'all'>('page');
-
-  useEffect(() => {
-    // eslint-disable-next-line react-hooks/set-state-in-effect
-    setFormData(buildInitialFormData());
-    setTitle(initialData.title || '');
-    setCurrentPage(0);
-  }, [initialData, buildInitialFormData]);
-
-  const getVal = (key: string) => formData[key] ?? '';
-  const setVal = (key: string, val: string) => setFormData(p => ({ ...p, [key]: val }));
-
-  const handleSave = useCallback(async () => {
-    const updated: OilSpillReportData = {
-      ...initialData,
-      title: title || formData['incident.name'] || `${reportType} ${new Date().toLocaleDateString('ko-KR')}`,
-      author: formData['author'] || initialData.author,
-      analysis: buildAnalysis(reportType, formData),
-      incident: {
-        ...initialData.incident,
-        name:          formData['incident.name']         ?? initialData.incident.name,
-        writeTime:     formData['incident.writeTime']    ?? initialData.incident.writeTime,
-        shipName:      formData['incident.shipName']     ?? initialData.incident.shipName,
-        occurTime:     formData['incident.occurTime']    ?? initialData.incident.occurTime,
-        location:      formData['incident.location']     ?? initialData.incident.location,
-        lat:           formData['incident.lat']          ?? initialData.incident.lat,
-        lon:           formData['incident.lon']          ?? initialData.incident.lon,
-        accidentType:  formData['incident.accidentType'] ?? initialData.incident.accidentType,
-        pollutant:     formData['incident.pollutant']    ?? initialData.incident.pollutant,
-        spillAmount:   formData['incident.spillAmount']  ?? initialData.incident.spillAmount,
-        depth:         formData['incident.depth']        ?? initialData.incident.depth,
-        seabed:        formData['incident.seabed']       ?? initialData.incident.seabed,
-        agent:         formData['agent']                 ?? initialData.incident.agent,
-      },
-    };
-    try {
-      await saveReport(updated);
-      onSave();
-    } catch (err) {
-      console.error('[reports] 저장 오류:', err);
-      alert('보고서 저장 중 오류가 발생했습니다.');
-    }
-  }, [formData, title, initialData, reportType, onSave]);
-
-  return (
-    <div className="flex flex-col h-full overflow-hidden bg-bg-0">
-
-      {/* ── Toolbar ── */}
-      <div className="flex items-center justify-between px-5 py-3 border-b border-border bg-bg-1 shrink-0 flex-wrap gap-2">
-        <div className="flex items-center gap-3">
-          <button
-            onClick={onBack}
-            className="text-[12px] font-semibold text-text-2 hover:text-text-1 transition-colors whitespace-nowrap"
-          >
-            ← 돌아가기
-          </button>
-          <input
-            value={title}
-            onChange={e => setTitle(e.target.value)}
-            placeholder="보고서 제목 입력"
-            className="text-[17px] font-bold bg-bg-0 border border-[var(--bdL)] rounded px-2.5 py-1 outline-none w-[380px] max-w-[480px]"
-          />
-          <span
-            className="px-2.5 py-[3px] text-[10px] font-semibold rounded border whitespace-nowrap"
-            style={{ background: 'rgba(251,191,36,0.15)', color: '#f59e0b', borderColor: 'rgba(251,191,36,0.3)' }}
-          >
-            편집 중
-          </span>
-        </div>
-        <div className="flex items-center gap-2">
-          <button
-            onClick={() => setViewMode('all')}
-            className="px-3.5 py-1.5 text-[11px] font-semibold rounded cursor-pointer"
-            style={{
-              border: viewMode === 'all' ? '1px solid var(--cyan)' : '1px solid var(--bd)',
-              background: viewMode === 'all' ? 'rgba(6,182,212,0.1)' : 'var(--bg2)',
-              color: viewMode === 'all' ? 'var(--cyan)' : 'var(--t3)',
-            }}
-          >
-            전체 보기
-          </button>
-          <button
-            onClick={() => setViewMode('page')}
-            className="px-3.5 py-1.5 text-[11px] font-semibold rounded cursor-pointer"
-            style={{
-              border: viewMode === 'page' ? '1px solid var(--cyan)' : '1px solid var(--bd)',
-              background: viewMode === 'page' ? 'rgba(6,182,212,0.1)' : 'var(--bg2)',
-              color: viewMode === 'page' ? 'var(--cyan)' : 'var(--t3)',
-            }}
-          >
-            페이지별
-          </button>
-          <button
-            onClick={handleSave}
-            className="px-4 py-1.5 text-[11px] font-bold rounded cursor-pointer border border-[#22c55e] bg-[rgba(34,197,94,0.15)] text-status-green"
-          >
-            저장
-          </button>
-          <button
-            onClick={() => window.print()}
-            className="px-3.5 py-1.5 text-[11px] font-semibold rounded cursor-pointer border border-[var(--red)] bg-[rgba(239,68,68,0.1)] text-status-red"
-          >
-            인쇄 / PDF
-          </button>
-        </div>
-      </div>
-
-      {/* ── Section Tabs (page mode) ── */}
-      {viewMode === 'page' && (
-        <div className="flex gap-1 px-5 py-2 border-b border-border bg-bg-1 flex-wrap shrink-0">
-          {sections.map((sec, i) => (
-            <button
-              key={i}
-              onClick={() => setCurrentPage(i)}
-              className="px-3 py-1.5 text-[11px] font-semibold rounded cursor-pointer"
-              style={{
-                border: currentPage === i ? '1px solid var(--cyan)' : '1px solid var(--bd)',
-                background: currentPage === i ? 'rgba(6,182,212,0.15)' : 'transparent',
-                color: currentPage === i ? 'var(--cyan)' : 'var(--t3)',
-              }}
-            >
-              {sec.title}
-            </button>
-          ))}
-        </div>
-      )}
-
-      {/* ── Content ── */}
-      <div className="flex-1 overflow-auto px-5 py-5">
-        <div id="report-print-area" className="w-full">
-          {viewMode === 'all' ? (
-            sections.map((sec, i) => (
-              <SectionBlock key={i} section={sec} getVal={getVal} setVal={setVal} />
-            ))
-          ) : (
-            <div>
-              <SectionBlock section={sections[currentPage]} getVal={getVal} setVal={setVal} />
-
-              {/* ── Pagination ── */}
-              <div className="flex justify-center items-center gap-3 mt-5">
-                <button
-                  onClick={() => setCurrentPage(p => Math.max(0, p - 1))}
-                  disabled={currentPage === 0}
-                  className="px-5 py-2 text-[12px] font-semibold rounded border border-border bg-bg-2 cursor-pointer"
-                  style={{ color: currentPage === 0 ? 'var(--t3)' : 'var(--t1)', opacity: currentPage === 0 ? 0.4 : 1 }}
-                >
-                  이전
-                </button>
-                <span className="px-4 py-2 text-[12px] text-text-2">
-                  {currentPage + 1} / {sections.length}
-                </span>
-                <button
-                  onClick={() => setCurrentPage(p => Math.min(sections.length - 1, p + 1))}
-                  disabled={currentPage === sections.length - 1}
-                  className="px-5 py-2 text-[12px] font-semibold rounded cursor-pointer"
-                  style={{
-                    border: '1px solid var(--cyan)',
-                    background: 'rgba(6,182,212,0.1)',
-                    color: currentPage === sections.length - 1 ? 'var(--t3)' : 'var(--cyan)',
-                    opacity: currentPage === sections.length - 1 ? 0.4 : 1,
-                  }}
-                >
-                  다음
-                </button>
-              </div>
-            </div>
-          )}
-        </div>
-      </div>
-
-    </div>
-  );
-}

frontend/src/tabs/reports/components/hwpxExport.ts

@@ -640,11 +640,8 @@ function buildHwpxFromHtmlTableElement(table: Element): string {
  * <table> → hp:tbl, <p> → buildPara, 복합 구조도 처리
  */
 function htmlContentToHwpx(html: string): string {
-  // <img> 태그 제거: HWPX 이미지는 buildPicParagraph로 별도 처리됨
-  // DOMParser에 대용량 base64 data URL 전달 방지
-  const cleanHtml = html.replace(/<img\b[^>]*>/gi, '');
   const parser = new DOMParser();
-  const doc = parser.parseFromString(`<div>${cleanHtml}</div>`, 'text/html');
+  const doc = parser.parseFromString(`<div>${html}</div>`, 'text/html');
   const container = doc.body.firstElementChild;
   if (!container) return buildPara('-', 0);
 
@@ -894,7 +891,7 @@ export async function exportAsHWPX(
     extraManifestItems += `<opf:item id="${fileId}" href="${filePath}" media-type="${mediaType}"/>`;
     // inMemory="NO": 데이터는 ZIP 내 파일로 저장, 요소 내용은 파일 경로
     binDataListXml +=
-      `<hh:binData id="${binId}" isSameDocData="0" compress="NO" inMemory="NO" ` +
+      `<hh:binData id="${binId}" isSameDocData="0" compress="YES" inMemory="NO" ` +
       `doNotCompressFile="0" blockDecompress="0" limitWidth="0" limitHeight="0">${filePath}</hh:binData>`;
     binCount++;
   };
@@ -921,15 +918,15 @@ export async function exportAsHWPX(
     processImage(images.sensitivityMap, 4, 'image4');
   }
 
-  // header.xml: binDataList를 hh:refList 뒤에 삽입 (HWPML 스펙 준수)
+  // header.xml: binDataList를 hh:refList 내부에 삽입 (HWPML 스펙 준수)
   let headerXml = HEADER_XML;
   if (binCount > 0) {
     const binDataList =
       `<hh:binDataList itemCnt="${binCount}">` +
       binDataListXml +
       '</hh:binDataList>';
-    // refList 닫힘 태그 직후에 삽입 (binDataList는 head의 직접 자식)
-    headerXml = HEADER_XML.replace('</hh:refList>', '</hh:refList>' + binDataList);
+    // refList 닫힘 태그 직전에 삽입해야 함 (binDataList는 refList의 자식)
+    headerXml = HEADER_XML.replace('</hh:refList>', binDataList + '</hh:refList>');
   }
 
   // Contents

frontend/src/tabs/reports/components/reportTypes.ts

@@ -222,15 +222,6 @@ export const templateTypes: TemplateType[] = [
   },
 ]
 
-// ─── 분석 필드 구분자 (다중 필드 → analysis 단일 컬럼 저장) ──────────
-export const ANALYSIS_SEP = '\n\n<<<SEP>>>\n\n';
-
-export const ANALYSIS_FIELD_ORDER: Partial<Record<ReportType, string[]>> = {
-  '초기보고서': ['initialResponse', 'futurePlan'],
-  '지휘부 보고': ['responseStatus', 'suggestions'],
-  '종합보고서': ['spreadSummary', 'responseDetail', 'damageReport', 'futurePlanDetail'],
-};
-
 // ─── Report Generator types & data ────────────────────────
 export interface ReportSection {
   id: string

frontend/src/tabs/reports/components/reportUtils.ts

@@ -1,6 +1,5 @@
 import { sanitizeHtml } from '@common/utils/sanitize';
 import type { OilSpillReportData } from './OilSpillReportTemplate';
-import { ANALYSIS_SEP, ANALYSIS_FIELD_ORDER } from './reportTypes';
 
 // ─── Report Export Helpers ──────────────────────────────
 export function generateReportHTML(
@@ -230,18 +229,6 @@ export function buildReportGetVal(report: OilSpillReportData) {
     if (key === '__vessels')   return formatVesselsTable(report.vessels)
     if (key === '__recovery')  return formatRecoveryTable(report.recovery)
     if (key === '__result')    return formatResultTable(report.result)
-    // 분석 필드 키 처리 (ANALYSIS_FIELD_ORDER에 정의된 키들 → report.analysis에서 split)
-    for (const fields of Object.values(ANALYSIS_FIELD_ORDER)) {
-      if (fields && fields.includes(key)) {
-        const idx = fields.indexOf(key);
-        const analysis = report.analysis || '';
-        if (!analysis.includes(ANALYSIS_SEP)) {
-          return idx === 0 ? analysis : '';
-        }
-        const parts = analysis.split(ANALYSIS_SEP);
-        return parts[idx] || '';
-      }
-    }
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     return (report as any)[key] || ''
   }