Merge branch 'iipbs/sn/dev' of https://www.onasys.co.kr:3000/ONAANDALL/frontend into iipbs/sn/dev

# Conflicts: # apps/sn/app/(map-layout)/map/components/popupComponent/featureClickEventPopup.tsx
2026-08-28 10:00:36 +09:00
parent 70efdc9db5 36549e7281
commit 884dd71ca7
16 changed files with 422 additions and 58 deletions
@@ -0,0 +1,7 @@
+# SFR-011-008 침수예측지도 격자 표시 검증계획
+
+- 침수예측현황 행 클릭 시 기존 지도 extent 이동 확인
+- `grid-map` API의 시군구·분석시각 파라미터와 WFS `latc_cd` 필터 확인
+- 각 격자 중앙 `latc_cd`·침수위험도·현재/예측 누적강우 표시 확인
+- 행 재선택 시 기존 overlay 제거 및 신규 격자 갱신 확인
+- BE 단위 테스트·컴파일 및 SN 브라우저 콘솔 오류 확인
@@ -31,6 +31,9 @@
 - `ListDiv` 내부에서 최소 테이블 폭과 가로 스크롤을 제공한다.
 - Excel은 현재 적용 검색조건을 동일하게 전달한다.
 - 신규 파일과 함수에 화면/API 역할 한글 주석을 작성한다.
+- 결과표는 `시도, 시군구, 분석시각, 강우시작시각, 관측 누적강수량, 예측시간, 예측 누적강수량, 초과 빈도(년), 침수위험도` 순서로 표시한다.
+- 예측시간은 `N시간 후`, 관측·예측 누적강수량은 소수점 한 자리로 표시한다.
+- 지도화면 분석도구는 공용 분석시각 범위와 `위험` 조건의 count API를 조회하여 `침수예측현황(x건)`으로 표시한다.

 ## 지도 연계

@@ -0,0 +1,23 @@
+# SFR-011-008 침수예측지도 중앙 오버레이 표시 FE 작업계획
+
+## 목적
+
+침수예측현황 선택행으로 지도 이동 시 선택한 도시침수지도 중앙에 사각 HTML table 단일 오버레이를 표시한다. 제목은 `[시도] [시군구] 침수예측` 두 열 병합이며, 본문은 분석시각, 강우시작시각, 관측 누적강수량(mm), 예측시각, 예측 누적강수량(mm), 초과 빈도(년), 침수위험도 순서다. 격자별 라벨과 위치 마커는 표시하지 않는다.
+
+## 구현 방법
+
+- 현황 팝업 메시지에 `analysisDateTime`을 추가한다.
+- 지도 페이지에서 BE `grid-map` API를 호출한다.
+- 기존 도시침수지도 extent 중심 좌표에 위 9개 표시 항목을 table 행으로 렌더링한다.
+- 초단기예보격자망 WFS 폴리곤은 기존 레이어 표현을 유지한다.
+- 다음 선택 시 전용 중앙 overlay를 삭제하고 새 응답으로 갱신한다.
+
+현재·예측 누적강우는 FE에서 격자별로 계산하지 않는다. BE가 반환하는 선택 시군구 분석행의 `obsrvn_acml_rn`, `predc_acml_rn`을 사용하며, 선택 도시침수지도 중앙의 단일 table overlay에 표시한다.
+
+## 검증
+
+- 슬라이드 4의 선택 시군구 도시침수지도 중앙 정보 배치
+- 다른 행 선택 시 중앙 overlay 교체
+- 닫기 버튼 클릭 시 overlay 제거
+- 기존 지도 extent 이동·침수위험 레이어 선택 유지
+- API 오류 시 기존 지도 이동 기능 유지
@@ -0,0 +1,28 @@
+# SFR-011-009 FE 침수흔적도-깊이도 연계 작업계획
+
+## 1. 상태
+
+- 승인 대기
+- 구현 전 계획 문서
+- 범위: `apps/sn` 내부
+
+## 2. 화면 계획
+
+- 기존 침수흔적도 기본정보 상세 영역 우측에 침수깊이지도 연도 버튼 목록을 추가한다.
+- 버튼은 투명 배경, 테두리만 있는 라운드 형태로 기존 상세정보 UI와 조화되게 구현한다.
+- 선택 연도의 깊이도 항목은 기본정보 아래 별도 div와 table로 표시한다.
+- 상세 div 우측 상단에 `X` 닫기 버튼을 둔다.
+- 지도 시설물 클릭과 침수발생이력 선택에서 동일 상태 모델을 사용한다.
+- 현재 표시 중인 연도 버튼은 파란색으로 표시한다.
+- 연도가 많으면 좌우 화살표로 연도 버튼 목록을 가로 스크롤한다.
+- 연도 선택 시 해당 침수흔적도-깊이 feature를 지도에서 선택 상태로 표시한다.
+
+## 3. 구현 후보
+
+- `app/(map-layout)/map/components/popupComponent/featureClickEventPopup.tsx`
+- `app/(map-layout)/map/components/fldngHstry/**`
+- 관련 침수흔적도 타입/API 호출부
+
+## 4. 검증
+
+- 연도 중복 제거·정렬, 선택 연도 파란색 상태, 좌우 스크롤, 연도 전환, 닫기, 빈 데이터, 지도 feature 선택, 양쪽 진입 경로 및 기존 상세정보 회귀를 브라우저에서 확인한다.
@@ -82,5 +82,6 @@
 - 관로분석 메시지 처리 함수에 두었던 한정 보강을 제거하고 `FeatureClickEventPopup`의 하수관로 상세 공통 로딩 흐름으로 이동했다.
 - 지도 피처 클릭, 정보검색/관로현황 연계 등 진입 경로와 관계없이 시설관리번호·관리기관코드가 유효하면 `v1/fclts?includeFlowDirectionBasis=true` 한 건을 조회한다.
 - 기존 피처 정보와 자체입력정보를 먼저 병합한 뒤 유하방향 응답을 최종 병합해 기존 상세 필드를 잃지 않도록 했다.
+- 동일 관로의 상세 효과가 개발 모드에서 반복 실행돼도 시설관리번호·관리기관코드별 요청 Promise를 재사용해 중복 API 호출을 막는다. 실패한 요청은 캐시에서 제거해 재시도를 허용한다.
 - 대상 관로 `2015303665`의 화면 표출값은 `시종점 관저고`이며, 계산코드는 `DEPTH`이다.
 - 수정 파일은 `app/(map-layout)/map/components/popupComponent/featureClickEventPopup.tsx`이며, `map/page.tsx`는 관로 선택 행을 그대로 상세 컴포넌트에 전달한다.
@@ -0,0 +1,17 @@
+# SFR-011-008 침수예측지도 격자 표시 FE 구현기록
+
+## 구현 내용
+
+- 침수예측현황 선택행의 `analysisDateTime`을 지도 이동 메시지에 포함했다.
+- BE `grid-map` 응답의 `latcCd`를 GeoServer `tb_ms_shtm_frcst_latc_info` WFS CQL 필터로 사용한다.
+- 격자 폴리곤 내부점에 `latc_cd`, 침수위험도, 현재·예측 누적강우 라벨을 표시한다.
+- `SN_FLDNG_PREDICTION_GRID_LABEL` 전용 레이어로 재선택 시 오버레이를 교체한다.
+
+## 설계 변경 대기
+
+사용자 확인에 따라 최종 구현 대상은 격자별 라벨이 아니라 선택한 도시침수지도 중앙의 단일 오버레이로 변경되었다. 기존 격자별 구현은 중앙 오버레이 구현으로 교체한다.
+
+## 기준
+
+- `침수예측.pptx` 4페이지
+- 요구사항 `SFR-011-008`