- Mapbox placeholder → VWorld 위성 타일(WMTS) 실제 영상으로 교체
- 완료 항목 클릭 시 해당 지역에 위성 영상 레이어 오버레이
- 선택 지점에 📷 마커 표시
- VWorld API 키 환경변수(VITE_VWORLD_API_KEY) 연동
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 더보기/접기 토글 제거
- 페이지당 5건 표시 + ◀ 1 2 ▶ 페이지 네비게이션
- "총 N건 중 1–5" 현재 범위 표시
- 필터 변경 시 전체 목록 대상 페이징 적용
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 전체 요소 높이 h-7(28px)로 통일
- 상단 패딩 py-2→pt-1, 아이콘 w-8→w-7, 텍스트 13px→12px
- 탭 버튼 py-1.5→h-full, 새요청 py-2→h-7
- 헤더 하단 마진 mb-2 유지
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 헤더(🛰 위성 촬영 요청) + 탭(요청목록/히스토리지도) + 새요청 버튼을 한 줄로 통합
- 지도 뷰 높이 calc(100vh - 160px)로 확대하여 영상 중첩 표시 공간 확보
- 헤더/탭 사이즈 축소로 컴팩트 레이아웃
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 좌상단: 캘린더(date picker) + 촬영 이력 있는 날짜 바로가기 버튼
- 날짜 선택 시 해당일 촬영 내역만 필터링하여 리스트 표시
- 완료 항목 클릭 시 지도에 위성 영상 오버레이 표시 (이미지 레이어)
- 선택된 구역 폴리곤 하이라이트 (두꺼운 테두리 + 진한 채움)
- 하단 상세 정보 바: 구역명, 위성, 해상도, 좌표, 영상 표출 상태
- 요청일자를 2026-03 기준으로 업데이트 + dateKey 필드 추가
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- SatRequest status에 '취소' 상태 추가
- 필터 탭에 '취소' 추가
- 대기/촬영중 상태 모두 취소 가능 (confirm 팝업)
- 취소된 요청은 빨간 ✕ 배지 + 투명도 60%
- satRequests를 상태(state)로 관리하여 실시간 상태 변경
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 모달 높이 85vh 고정 (max-h → height)
- 지도 영역 minHeight 350px 보장
- Optical/SAR/Elevation 탭 전환 시 지도 크기 일정 유지
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 백엔드: GET /api/aerial/satellite/passes — 한국 주변 위성 패스 시뮬레이션
UP42 API 연동 준비 (Workspace ID: b9bc92ae, TODO 주석)
6개 위성 궤도 데이터 (KOMPSAT-3A, Pléiades Neo, Sentinel-1/2, WV-3, SkySat)
- 프론트 API: fetchSatellitePasses() + SatellitePass 인터페이스
- UP42 모달: MapLibre 지도에 위성 궤도 라인 실시간 표시
한국 영역 AOI 점선 박스 + 궤도별 색상 구분
위성 클릭 시 해당 궤도 하이라이트 (나머지 투명)
- 패스 타임라인: 통과 시각, 해상도, 앙각, 상승/하강 방향, 긴급도 표시
- 궤도 범례 오버레이 추가
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 함정: MarineTraffic 스타일 삼각형 (선수 방향 위, 상태색 채움)
- 드론: 쿼드콥터 아이콘 (X자 팔 + 프로펠러 회전 애니메이션 + 카메라 렌즈)
- 함정↔드론 점선 연결선 유지
- 송출중 REC LED 깜빡임, 드론 모델명 라벨
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 함정: 삼각형 아이콘 + 함정명 라벨 (좌하단)
- 드론: 원형 아이콘 (십자 프로펠러 + 본체 + 카메라 렌즈) (우상단)
- 함정↔드론 점선 연결선으로 소속 관계 표시
- 상태별 색상: 송출중(초록), 연결중(시안), 오류(빨강), 대기(회색)
- 송출중 드론 빨간 LED 깜빡임 유지
- 드론 모델명 라벨 (M300/M30T/Mavic3E)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 드론 미선택 시 MapLibre 지도에 드론 위치 표시 (부산/인천/목포)
- 드론 SVG 아이콘 (본체+팔4개+프로펠러+카메라, 상태별 색상)
- 송출중 드론은 빨간 LED 깜빡임 애니메이션
- 드론 클릭 → 다크 팝업 (함정명, 드론모델, IP, 상태)
대기중: "스트림 시작" 버튼 / 송출중: "영상 보기" 버튼
- 스트림 선택 시 자동으로 영상 그리드로 전환
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- KBS 재난안전포탈 CCTV를 iframe에서 HLS 직접 재생으로 전환
- 백엔드 KBS HLS 리졸버 엔드포인트 추가 (/api/aerial/cctv/kbs-hls/:cctvId/stream.m3u8)
- KBS API 3단계 리졸브: 팝업API → loomex API → m3u8 (5분 캐시)
- CCTV 미선택 시 MapLibre 지도에 마커 표시 + 팝업 영상 선택
- 우측 미니맵을 실제 MapLibre 지도로 교체
- KBS API 정확 좌표로 19개 CCTV 업데이트 + 신규 2건 추가 (울산 달동, 제주 도남동)
- PredictionInputSection 중복 className 수정
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
CCTV 실시간 영상:
- CCTVPlayer 컴포넌트 (hls.js 기반 HLS/MJPEG/MP4 재생)
- 백엔드 HLS 프록시 엔드포인트 (CORS 우회, m3u8 URL 재작성)
- KHOA 15개 + KBS 6개 실제 해안 CCTV 연동
- Vite dev proxy, 스트림 타입 자동 감지 유틸리티
HNS 분석:
- HNS 시나리오 저장/불러오기/재계산 기능
- 물질 DB 검색 및 상세 정보 연동
- 좌표/파라미터 입력 UI 개선
- Python 확산 모델 스크립트 (hns_dispersion.py)
공통:
- 3D 지도 토글, 보고서 생성 개선
- useSubMenu 훅, mapUtils 확장
- ESLint set-state-in-effect 수정
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- className 중복 속성 31건 수정 (12파일)
- KOSPS codeBox spread TypeError 해결
- HNS 페놀(C₆H₅OH) 물질 데이터 추가
- ScatRightPanel 280px 우측 패널 신규 구현 (3탭+액션버튼)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
대형 파일 집중 변환:
- SatelliteRequest: 134→66 (hex 색상 일괄 변환)
- IncidentsView: 141→90, MediaModal: 97→38
- HNSScenarioView: 78→38, HNSView: 49→31
- LoginPage, MapView, PredictionInputSection 등 중소 파일 8개
변환 패턴: hex 색상→text-[#hex], CSS 변수→Tailwind 유틸리티,
flex/grid/padding/fontSize/fontWeight/overflow 등 정적 속성 className 이동
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
안전한 패턴 매칭으로 단독 color/background/fontWeight/fontSize/flex 스타일을
Tailwind 유틸리티 클래스로 변환. 혼합 style에서 개별 속성 추출은 제외하여
시각적 회귀 방지.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- TextLayer: characterSet 'auto', NanumSquare 한글 폰트, outline 설정 (MapView, RealtimeDrone)
- 확산분석 탭: 진입 시 데모 궤적/방어선/민감자원 자동 로드 (useEffect + handleSelectAnalysis)
- SensorAnalysis: Vessel/Pollution 3DModel을 requestAnimationFrame 기반 360° 회전으로 전환
- 3D geometry useMemo 생성, Y축 회전 + X축 틸트, depth 기반 크기/밝기
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
항공탐색 탭:
- CctvView 크래시 수정 (cctvCameras → cameras 필드 매핑)
- AerialView 이중 서브메뉴 분기 → 플랫 switch 단순화
- SensorAnalysis SVG 300pt → Canvas 2D 5000/8000pt 고밀도 전환
- RealtimeDrone CSS 시뮬레이션 → MapLibre + deck.gl 실제 지도 전환
확산분석 탭:
- 시뮬레이션 백엔드 미구현 시 클라이언트 데모 궤적 fallback 생성
- AI 방어선 3개(직교차단/U형포위/연안보호) 자동 배치
- 민감자원 5개소(양식장/해수욕장/보호구역) deck.gl 레이어 표시
- 해류 화살표 11x11 그리드 TextLayer 추가
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Board: 매뉴얼 CRUD + 첨부파일 API (012_board_ext.sql)
- HNS: 분석 CRUD 5개 API (013_hns_analysis.sql)
- Prediction: 분석/역추적/오일펜스 7개 API (014_prediction.sql)
- Aerial: 미디어/CCTV/위성 6개 API + PostGIS (015_aerial.sql)
- Rescue: 구난 작전/시나리오 3개 API + JSONB (016_rescue.sql)
- backtrackMockData.ts 삭제
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- 11개 탭 디렉토리 생성: tabs/{prediction,hns,rescue,weather,incidents,aerial,board,reports,assets,scat,admin}/
- 51개 컴포넌트를 역할 기반(views/, analysis/, layout/) → 탭 기반(tabs/) 구조로 이동
- weather 탭에 전용 hooks/, services/ 포함
- incidents 탭에 전용 services/ 포함
- 공통 지도 컴포넌트(MapView, BacktrackReplay)를 common/components/map/으로 이동
- 각 탭에 index.ts 생성하여 View 컴포넌트 re-export
- App.tsx import를 @tabs/ alias 사용으로 변경
- 전체 import 경로 수정 (탭 내부 상대경로, 외부 @common/ alias)
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
