From 38e41feef27fb0db213b9cf655d437a0af15aa11 Mon Sep 17 00:00:00 2001 From: ljpark Date: Fri, 12 Dec 2025 18:14:53 +0900 Subject: [PATCH 1/4] =?UTF-8?q?cm:=20=EB=8D=94=EB=B3=B4=EA=B8=B0,=20eslint?= =?UTF-8?q?=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/cm/.env.local | 5 +- apps/cm/.env.production | 6 +- apps/cm/eslint.config.mjs | 5 + apps/cm/middleware.ts | 4 +- apps/cm/src/pages/dashboard/api/fo-service.ts | 36 ++- .../pages/dashboard/lib/korea-basin-map.tsx | 223 ++++++++++-------- .../src/pages/dashboard/ui/dashboard-page.tsx | 11 +- .../src/pages/dashboard/ui/fo-fclt-cnt-rt.tsx | 2 +- .../pages/dashboard/ui/fo-wqlt-Infl-effl.tsx | 4 +- .../cm/src/pages/dashboard/ui/reuse-chart.tsx | 6 +- .../src/pages/dashboard/ui/reuse-status.tsx | 6 +- apps/cm/src/pages/dashboard/ui/sn-old-ppl.tsx | 6 +- .../src/pages/dashboard/ui/sn-ppl-status.tsx | 7 +- 13 files changed, 202 insertions(+), 119 deletions(-) diff --git a/apps/cm/.env.local b/apps/cm/.env.local index a042ab706..96f70cf59 100644 --- a/apps/cm/.env.local +++ b/apps/cm/.env.local @@ -7,5 +7,6 @@ NEXT_PUBLIC_SERVER_API_URL=http://dev.onasys.co.kr:8000 NEXT_PUBLIC_LINK_BACKEND_API_HOST=http://rsone.iptime.org:10014 NEXT_PUBLIC_TINY_API_KEY=t9nc4z6inquvvd5pq1vea8wcp7lb01qmqseh6egms9vpaju2 -NEXT_PUBLIC_SERVER_API_URL2=http://con.mind-one.co.kr:11083/ -# NEXT_PUBLIC_SERVER_API_URL2=http://192.168.1.222:8883/ \ No newline at end of file +NEXT_PUBLIC_SERVER_API_URL2=http://con.mind-one.co.kr:11083 +NEXT_PUBLIC_SN=https://devlion.hasuon.co.kr +NEXT_PUBLIC_WR=https://devtiger.hasuon.co.kr diff --git a/apps/cm/.env.production b/apps/cm/.env.production index 9f786831b..070113102 100644 --- a/apps/cm/.env.production +++ b/apps/cm/.env.production @@ -4,4 +4,8 @@ NEXT_PUBLIC_PROXY_HOST=http://localhost:3000 NEXT_PUBLIC_SITE_ID=CS NEXT_PUBLIC_SUB_DOMAIN=http://localhost:3000 NEXT_PUBLIC_SERVER_API_URL=http://192.168.0.102:8000 -NEXT_PUBLIC_TINY_API_KEY=t9nc4z6inquvvd5pq1vea8wcp7lb01qmqseh6egms9vpaju2 \ No newline at end of file +NEXT_PUBLIC_TINY_API_KEY=t9nc4z6inquvvd5pq1vea8wcp7lb01qmqseh6egms9vpaju2 + +NEXT_PUBLIC_SERVER_API_URL2=http://apigateway.iipbs-was.svc.cluster.local:8000 +NEXT_PUBLIC_SN=https://lion.hasuon.co.kr +NEXT_PUBLIC_WR=https://tiger.hasuon.co.kr \ No newline at end of file diff --git a/apps/cm/eslint.config.mjs b/apps/cm/eslint.config.mjs index 9109635e9..c9e490efd 100644 --- a/apps/cm/eslint.config.mjs +++ b/apps/cm/eslint.config.mjs @@ -12,6 +12,11 @@ const compat = new FlatCompat({ const eslintConfig = [ ...compat.extends("next/core-web-vitals", "next/typescript"), { + languageOptions: { + parserOptions: { + tsconfigRootDir: __dirname, + }, + }, rules: { "react-hooks/exhaustive-deps": "off", }, diff --git a/apps/cm/middleware.ts b/apps/cm/middleware.ts index 9ec06daa2..564cab5e8 100644 --- a/apps/cm/middleware.ts +++ b/apps/cm/middleware.ts @@ -58,7 +58,7 @@ export function middleware(req: NextRequest) { const userId = req.cookies.get(AUTH_USER_ID)?.value; // const decodedQuery = toDecodedQueryString(searchParams); - const newUrl = `${serverApiUrl2}${pathname.replace("/server/", "")}${searchParams ? `?${searchParams}` : ""}`; + const newUrl = `${serverApiUrl2}${pathname.replace("/server", "")}${searchParams ? `?${searchParams}` : ""}`; // const newUrl = `${serverApiUrl2}${pathname}`; if (token) requestHeaders.set(CLAIM_NAME, token); @@ -96,7 +96,7 @@ export function middleware(req: NextRequest) { const token = req.cookies.get(CLAIM_NAME)?.value; const userId = req.cookies.get(AUTH_USER_ID)?.value; // const newUrl = `${serverApiUrl2}${pathname.replace("/server/", "")}`; - const newUrl = `${serverApiUrl2}${pathname.replace("/server/", "")}${searchParams ? `?${searchParams}` : ""}`; + const newUrl = `${serverApiUrl2}${pathname.replace("/server", "")}${searchParams ? `?${searchParams}` : ""}`; if (token) requestHeaders.set(CLAIM_NAME, token); if (userId) requestHeaders.set(AUTH_USER_ID, userId); diff --git a/apps/cm/src/pages/dashboard/api/fo-service.ts b/apps/cm/src/pages/dashboard/api/fo-service.ts index 8dc163ffd..a35fedd51 100644 --- a/apps/cm/src/pages/dashboard/api/fo-service.ts +++ b/apps/cm/src/pages/dashboard/api/fo-service.ts @@ -50,14 +50,41 @@ export type OperFcltStateActions = { setOperFcltStatus: (operFcltStatus: OperFcltContent[] | null) => void; }; export type OperFcltStore = OperFcltState & OperFcltStateActions; +const initialOperFclt: OperFcltContent[]= [ + { + "cnt": 710, + "fctCpc": 2911609.0, + "rvbsn": "금강", + "gubun": "R" + }, + { + "cnt": 1032, + "fctCpc": 7506047.0, + "rvbsn": "낙동강", + "gubun": "R" + }, + { + "cnt": 1261, + "fctCpc": 2061610.0, + "rvbsn": "영산강", + "gubun": "R" + }, + { + "cnt": 983, + "fctCpc": 1.3229809E7, + "rvbsn": "한강", + "gubun": "R" + } + ]; export const defaultInitOperFcltState: OperFcltState = { - operFcltStatus: null, + operFcltStatus: initialOperFclt, }; export const createOperFcltStore = (initState: OperFcltState = defaultInitOperFcltState) => createStore()((set) => ({ ...initState, setOperFcltStatus: (operFcltStatus) => set(() => ({ operFcltStatus })), })); +export const operFcltStore = createOperFcltStore(); //수계별 유입ㆍ방류수질 분석 export type OperWqltState = { @@ -87,7 +114,12 @@ const initialWqltData: OperWqltContent[] = [ export const defaultInitOperWqltState: OperWqltState = { operWqltStatus: initialWqltData, }; -export const operFcltStore = createOperFcltStore(); +export const createOperWqltStore = (initState: OperWqltState = defaultInitOperWqltState) => + createStore()((set) => ({ + ...initState, + setOperWqltStatus: (operWqltStatus) => set(() => ({ operWqltStatus })), + })); +export const operWqltStore = createOperWqltStore(); // 물재이용 현황 export type ReuseState = { diff --git a/apps/cm/src/pages/dashboard/lib/korea-basin-map.tsx b/apps/cm/src/pages/dashboard/lib/korea-basin-map.tsx index 1f1ec1ab7..0f1346388 100644 --- a/apps/cm/src/pages/dashboard/lib/korea-basin-map.tsx +++ b/apps/cm/src/pages/dashboard/lib/korea-basin-map.tsx @@ -1,7 +1,18 @@ -import React, { useEffect, useRef } from "react"; +"use client"; +/** + * 유역 지도 + */ +import React, { useEffect, useRef, useState } from "react"; import { useStore } from "zustand"; import styles from "./korea-basin-map.module.css"; // 추가 import { basinStore } from "../api/fo-service"; +// import { operFcltStore } from "../api/fo-service"; +import { + Tabs, + // TabsContent, + TabsList, + TabsTrigger, +} from "@common/components"; const SVG_URL = "/images/region_map.svg"; // public 폴더에 region_map.svg 위치 필요 @@ -77,9 +88,11 @@ export function KoreaBasinMap() { const badgeRef = useRef(null); const rowsRef = useRef(null); const colTitleRef = useRef(null); - + const [tab, setTab] = useState("물재이용"); const { selectedBasin, setSelectedBasin } = useStore(basinStore); + // const { operFcltStatus, setSelectedBasin } = useStore(operFcltStore); const selectedBasinKey = basinKeyMap[selectedBasin]; + // selectedBasinKey prop이 변경될 때 지도를 업데이트하는 useEffect useEffect(() => { if (selectedBasinKey) { @@ -102,12 +115,12 @@ export function KoreaBasinMap() { // console.log("Loading SVG from:", SVG_URL); fetch(SVG_URL) .then((r) => { - console.log("SVG fetch response:", r.status, r.statusText); + // console.log("SVG fetch response:", r.status, r.statusText); if (!r.ok) throw new Error(`HTTP error! status: ${r.status}`); return r.text(); }) .then((txt) => { - console.log("SVG content loaded, length:", txt.length); + // console.log("SVG content loaded, length:", txt.length); if (!svgLayerRef.current) { console.error("svgLayerRef.current is null"); return; @@ -118,7 +131,7 @@ export function KoreaBasinMap() { console.error("SVG element not found in loaded content"); return; } - console.log("SVG element found:", svg); + // console.log("SVG element found:", svg); // viewBox/크기 세팅 if (!svg.hasAttribute("viewBox")) { @@ -138,13 +151,13 @@ export function KoreaBasinMap() { // 1) 지도 그룹 수집 gs = []; - console.log("Looking for basin groups in SVG..."); + // console.log("Looking for basin groups in SVG..."); BASIN_IDS.forEach((item) => { let g: SVGGElement | null = null; for (const id of item.labels) { g = svg!.getElementById(id) as SVGGElement | null; if (g) { - console.log(`Found group for ${item.key} with id '${id}':`, g); + // console.log(`Found group for ${item.key} with id '${id}':`, g); break; } } @@ -167,19 +180,19 @@ export function KoreaBasinMap() { gs.push(g); }); - console.log(`Found ${gs.length} basin groups`); + // console.log(`Found ${gs.length} basin groups`); // 각 유역 그룹의 패스 정보 확인 gs.forEach((g, index) => { const paths = g.querySelectorAll('path'); - console.log(`Group ${index} (${(g as SVGGElement & { dataset: { key: string } }).dataset.key}):`, { - element: g, - pathCount: paths.length, - paths: Array.from(paths).map(p => ({ - className: p.className.baseVal, - d: p.getAttribute('d')?.substring(0, 50) + '...' - })) - }); + // console.log(`Group ${index} (${(g as SVGGElement & { dataset: { key: string } }).dataset.key}):`, { + // element: g, + // pathCount: paths.length, + // paths: Array.from(paths).map(p => ({ + // className: p.className.baseVal, + // d: p.getAttribute('d')?.substring(0, 50) + '...' + // })) + // }); }); // 2) 함수들 먼저 정의 @@ -204,7 +217,7 @@ export function KoreaBasinMap() { // 유역정보 function showFor(g: SVGGElement) { - console.log("showFor called for:", g); + // console.log("showFor called for:", g); const key = (g as SVGGElement & { dataset: { key: string; label: string } }).dataset.key; const data = (BASIN_DATA as Record)[key] || { name: (g as SVGGElement & { dataset: { label: string } }).dataset.label, @@ -230,7 +243,7 @@ export function KoreaBasinMap() { const cx = (r.left + r.right) / 2 - sRect.left; const ty = r.top - sRect.top; - console.log("Popup position:", { cx, ty }); + // console.log("Popup position:", { cx, ty }); if (badgeRef.current) { badgeRef.current.style.left = cx + "px"; @@ -244,7 +257,7 @@ export function KoreaBasinMap() { if (styles.show) { popupRef.current.classList.add(styles.show); } - console.log("Added show class to popup:", popupRef.current.classList.toString()); + // console.log("Added show class to popup:", popupRef.current.classList.toString()); } if (badgeRef.current && styles.show) { badgeRef.current.classList.add(styles.show); @@ -262,7 +275,7 @@ export function KoreaBasinMap() { } function showForWithLabel(g: SVGGElement) { - console.log("showForWithLabel called for:", g); + // console.log("showForWithLabel called for:", g); showFor(g); const idx = gs.indexOf(g); labels.forEach((l) => l.classList.remove("active")); @@ -384,79 +397,103 @@ export function KoreaBasinMap() { // 스타일은 필요에 따라 tailwind, css 등으로 커스터마이즈하세요. return ( -
-
-
-
-
-