diff --git a/apps/dm_new/app/(popup-layout)/map/popup/page.tsx b/apps/dm_new/app/(popup-layout)/map/popup/page.tsx
index e410ad2a7..1c625bcac 100644
--- a/apps/dm_new/app/(popup-layout)/map/popup/page.tsx
+++ b/apps/dm_new/app/(popup-layout)/map/popup/page.tsx
@@ -29,10 +29,15 @@ const Map = () => {
ruseUtztnFcltCd: fclt.pbnstRuseFcltId,
}));
+ if (!window.opener || typeof window.opener.postMessage !== "function") {
+ alert("부모 창을 찾을 수 없습니다. 팝업이 'noopener'로 열렸거나, 보안 정책으로 차단되었을 수 있어요.");
+ return;
+ }
+
window.opener.postMessage(
{
type: "SET_SUBS_INFO",
- payload: subsInfoList, // 또는 필요한 데이터
+ payload: subsInfoList, // 배열로 전송 (최대 3개)
},
"*"
);
@@ -52,9 +57,23 @@ const Map = () => {
//하수처리시설코드로 재이용시설 목록 조회
const reuseData = async (ruseFcltPk: any) => {
+ if (!ruseFcltPk) {
+ console.warn("[reuseData] ruseFcltPk가 없습니다.");
+ return;
+ }
try {
+ console.log("[reuseData] API 호출 - ruseFcltPk:", ruseFcltPk);
const response = await mapService.getPbnstRuseFclts(ruseFcltPk);
- const data = response.data || [];
+ console.log("[reuseData] API 응답 전체:", response);
+ // 응답이 배열이면 바로 사용, 객체면 .data 추출
+ const data = Array.isArray(response)
+ ? response
+ : Array.isArray(response?.data)
+ ? response.data
+ : response?.data
+ ? [response.data]
+ : [];
+ console.log("[reuseData] 파싱된 data:", data);
setSelectedFclts((prev) => {
const newItems = data.filter(
(item: any) =>
@@ -62,7 +81,7 @@ const Map = () => {
Object.keys(item).length > 0 &&
!prev.some((f) => f.pbnstRuseFcltId === item.pbnstRuseFcltId)
);
- console.log(newItems);
+ console.log("[reuseData] 추가될 newItems:", newItems);
return [...prev, ...newItems];
});
} catch (error) {
@@ -75,11 +94,45 @@ const Map = () => {
fetchData();
}, []);
+ // 부모창에 초기 선택값 요청 (팝업 열릴 때 기존 선택 목록 받아오기)
+ useEffect(() => {
+ const origin = window.location.origin;
+ if (window.opener) {
+ window.opener.postMessage({ type: "REQUEST_INIT_SUBS_INFO" }, origin);
+ }
+ }, []);
+
+ // 부모창에서 초기 선택값 수신
+ useEffect(() => {
+ const origin = window.location.origin;
+
+ const handler = (event: MessageEvent) => {
+ if (event.origin !== origin) return;
+
+ const data = event.data;
+ if (!data || typeof data !== "object") return;
+
+ if (data.type === "INIT_SUBS_INFO") {
+ const list = Array.isArray(data.payload) ? data.payload : [];
+ setSelectedFclts(
+ list.map((x) => ({
+ ruseUtztnFcltNm: x.ruseUtztnFcltNm ?? "",
+ pbnstRuseFcltId: x.ruseUtztnFcltCd ?? "",
+ }))
+ );
+ }
+ };
+
+ window.addEventListener("message", handler);
+ return () => window.removeEventListener("message", handler);
+ }, []);
+
// 레이어 생성 후 초기화 처리
const onCheckedLayersChange = () => {
//수요처 ID
const urlParams = new URLSearchParams(window.location.search);
const dmdInfoId = urlParams.get("dmdInfoId");
+ console.log("[하이라이트] dmdInfoId:", dmdInfoId);
//수요처 위치로 화면 이동
const maps = gisMaps.current;
@@ -88,22 +141,42 @@ const Map = () => {
const featureId = `${layerNm}.${dmdInfoId}`;
let foundFeature: any = null;
+ // 현재 로드된 레이어 목록 출력
+ const allLayerNames = maps
+ .getLayers()
+ .getArray()
+ .map((l: any) => l.get("lyrTyNm") || l.get("name") || "(unnamed)");
+ console.log("[하이라이트] 전체 레이어 목록:", allLayerNames);
+ console.log("[하이라이트] 탐색 대상 레이어:", layerNm);
+ console.log("[하이라이트] 탐색 대상 featureId:", featureId);
+
maps
.getLayers()
.getArray()
.forEach((layer: any) => {
if (layer.get("lyrTyNm") == layerNm) {
+ console.log("[하이라이트] 레이어 발견:", layerNm);
const source = layer.getSource?.();
if (source?.getFeatureById) {
const feature = source.getFeatureById(String(featureId).trim());
+ console.log("[하이라이트] feature 탐색결과:", feature);
if (feature) {
foundFeature = feature;
return;
- }
+ }
+ // feature 못 찾을 때 소스 내 전체 feature ID 출력
+ if (source?.getFeatures) {
+ const allIds = source.getFeatures().map((f: any) => f.getId());
+ console.log("[하이라이트] 소스 내 전체 feature ID:", allIds);
+ }
}
}
});
+ if (!foundFeature) {
+ console.warn("[하이라이트] feature를 찾지 못했습니다. 위 레이어 목록/ID를 확인하세요.");
+ }
+
if (foundFeature) {
const geometry = foundFeature.getGeometry();
@@ -133,7 +206,7 @@ const Map = () => {
{ width: 30 }
);
} else {
- alert("수요처의 좌표정보를 찾을수 없으므로, 상단 조회조건의 시설명을 입력하여 위치를 조회하시기 바랍니다.");
+ console.warn("수요처의 좌표정보를 찾을 수 없습니다. dmdInfoId:", dmdInfoId);
}
const formatNumber = (val: any) => {
@@ -185,6 +258,7 @@ const Map = () => {
// 검색해서 재이용시설 선택하면 해당 시설로 화면 이동 처리
useEffect(() => {
+ console.warn(selectDataPk);
if (!selectDataPk || Object.keys(selectDataPk).length === 0) return;
const maps = gisMaps.current;
let foundFeature: any = null;
@@ -226,8 +300,12 @@ const Map = () => {
// 재이용시설 클릭 시 선택 시설목록에 추가
const onFeatureSelect = (data: any) => {
+ // feature의 모든 속성 출력 (어떤 키가 있는지 확인)
+ const properties = data.getProperties?.() ?? {};
+ console.log("[onFeatureSelect] feature 속성 전체:", properties);
// 처리시설코드
const swtrmtFcltCd = data.get("swtrmt_fclt_cd");
+ console.log("[onFeatureSelect] swtrmt_fclt_cd:", swtrmtFcltCd);
reuseData(swtrmtFcltCd);
};
diff --git a/apps/dm_new/app/(popup-layout)/map/popup/selectedFcltList.tsx b/apps/dm_new/app/(popup-layout)/map/popup/selectedFcltList.tsx
index bdf4d7e2c..5c742684f 100644
--- a/apps/dm_new/app/(popup-layout)/map/popup/selectedFcltList.tsx
+++ b/apps/dm_new/app/(popup-layout)/map/popup/selectedFcltList.tsx
@@ -22,36 +22,32 @@ export default function SelectedFcltList({
const TableContent = (
<>
-
+
-
시설명
-
- 하수처리량
-
- (㎥/일)
+ 시설명
+
+ 처리량(㎥/일)
-
- 재이용량
-
- (㎥/일)
+
+ 재이용량(㎥/일)
- 삭제
+ 삭제