sn: 침수예측현황 지도이동시 도시침수지도 layer점검

2026-08-26 13:11:40 +09:00
parent 0a13f34092
commit c7738a6d6c
4 changed files with 26 additions and 7 deletions
@@ -3606,6 +3606,7 @@ const Map = () => {

        await select.resetSelectedFeature?.();
        const selectedFeatureIds = new Set<string>();
+        let floodLayerVisible = false;
        const selectLoadedGroupFeatures = (source: any) => {
          const features = source?.getFeatures?.() ?? [];
          features.forEach((feature: any) => {
@@ -3633,11 +3634,7 @@ const Map = () => {
              FLOOD_DNGR_MAP_LAYER_TYPE
            )
              return;
-            // 침수예측현황에서 바로 이동한 경우 레이어가 꺼져 있을 수 있으므로 자동 활성화한다.
-            if (layer.getVisible?.() === false) {
-              layer.setVisible?.(true);
-              layer.getSource?.()?.refresh?.();
-            }
+            if (layer.getVisible?.() !== false) floodLayerVisible = true;
            const source = layer.getSource?.();
            if (!source?.getFeatures) return;
            selectLoadedGroupFeatures(source);
@@ -3645,6 +3642,13 @@ const Map = () => {
              selectLoadedGroupFeatures(source),
            );
          });
+        if (!floodLayerVisible) {
+          event.source?.postMessage?.(
+            { type: WINDOW_POPUP_MESSAGE_TYPE.MAP_SEARCH_FLOOD_LAYER_REQUIRED },
+            event.origin,
+          );
+          return;
+        }
        map.getView().fit(extent, {
          duration: 300,
          padding: [50, 50, 50, 50],
@@ -36,7 +36,7 @@

 - 행 선택 시 기존 도시침수지도 group extent API를 호출한다.
 - 부모 창에 기존 `MAP_SEARCH_SHOW_FLOOD_GROUP` 메시지를 보내 범위 이동·레이어 표시를 요청한다.
- 도시침수지도에 없는 빈도는 자동 변환하지 않고 화면 안내를 표시한다.
+- 도시침수지도 빈도는 30년 이하를 `030`, 100년 초과를 `100`으로 보정하고 그 외 미지원 빈도는 안내한다.

 ## 검증

@@ -216,6 +216,21 @@ export default function FldngPredcPrstPopupContent() {
  // 개발 StrictMode에서도 최초 목록 API를 한 번만 호출하기 위한 ref다.
  const didInitialLoadRef = useRef(false);

+  // 부모 지도에서 도시침수지도 레이어가 비활성 상태임을 알려오면 팝업에서 안내한다.
+  useEffect(() => {
+    const handleMapMessage = (event: MessageEvent) => {
+      if (event.origin !== window.location.origin) return;
+      if (
+        event.data?.type ===
+        WINDOW_POPUP_MESSAGE_TYPE.MAP_SEARCH_FLOOD_LAYER_REQUIRED
+      ) {
+        alert("지도의 좌측 도시침수지도를 선택하여야 지도에 보입니다.");
+      }
+    };
+    window.addEventListener("message", handleMapMessage);
+    return () => window.removeEventListener("message", handleMapMessage);
+  }, [alert]);
+
  useEffect(() => {
    if (!ctpv.length) void fetchCtpv();
    if (!sgg.length) void fetchSgg();
@@ -348,7 +363,6 @@ export default function FldngPredcPrstPopupContent() {
        },
        window.location.origin,
      );
-      alert("도시침수지도를 켜고 선택한 도시침수지도의 시군구·빈도로 이동하였습니다.");
      window.opener.focus();
    } catch (error) {
      console.error("침수예측현황 지도 이동 중 오류:", error);
@@ -51,6 +51,7 @@ export const WINDOW_POPUP_MESSAGE_TYPE = {
  MAP_SEARCH_SHOW_MULTIPLE: "sn:popup:mapSearchShowMultiple",
  MAP_SEARCH_FIT_EXTENT: "sn:popup:mapSearchFitExtent",
  MAP_SEARCH_SHOW_FLOOD_GROUP: "sn:popup:mapSearchShowFloodGroup",
+  MAP_SEARCH_FLOOD_LAYER_REQUIRED: "sn:popup:mapSearchFloodLayerRequired",
  GIS_EDIT_SESSION_READY: "sn:popup:gisEditSessionReady",
  GIS_EDIT_SESSION_SYNC: "sn:popup:gisEditSessionSync",
  GIS_EDIT_SESSION_SHOW_INLINE: "sn:popup:gisEditSessionShowInline",