From 3a17089838d76716af1f61bf6dc20a5d66ee0e87 Mon Sep 17 00:00:00 2001 From: jyha00 Date: Wed, 25 Jun 2025 11:24:44 +0900 Subject: [PATCH] =?UTF-8?q?=EC=9E=AC=EC=9D=B4=EC=9A=A9=EC=8B=A4=EC=A0=81?= =?UTF-8?q?=ED=98=84=ED=99=A9=20=EC=B0=A8=ED=8A=B8=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=88=98=EC=A0=95=20=EC=99=84=EB=A3=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../prfmncSttn/pbnstPrfmncSttn/page.tsx | 155 ++++++++++-------- apps/wr/app/store/common/code/index.ts | 16 +- .../prfmncSttn/pbnstPrfmncSttn/index.tsx | 66 +++++--- 3 files changed, 148 insertions(+), 89 deletions(-) diff --git a/apps/wr/app/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx b/apps/wr/app/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx index 8064aa2bb..8130dfbd5 100644 --- a/apps/wr/app/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx +++ b/apps/wr/app/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx @@ -33,6 +33,10 @@ export default function PbnstPrfmncSttn() { const ref = useRef({} as ReturnType); const [swtrmtFcltNm, setSwtrmtFcltNm] = useState(); const [pbnRuseNm, setPbnRuseNm] = useState(""); + + const [searchYear, setSearchYear] = useState( + String(new Date().getFullYear()) + ); const [excelData, setExcelData] = useState([]); const excelClick = useCallback(() => { excelDownload( @@ -43,7 +47,6 @@ export default function PbnstPrfmncSttn() { 2 ); }, [excelData]); - const [chartConfig, setChartConfig] = useState({}); const [chartData, setChartData] = useState([]); const [dnInUsage, setDnInUsage] = useState([]); @@ -138,7 +141,8 @@ export default function PbnstPrfmncSttn() { setPrfData([]); } } - + + const [chartId, setChartId] = useState(); useEffect(() => { // 누적 변수 초기화 let wshwtr = 0, @@ -192,67 +196,69 @@ export default function PbnstPrfmncSttn() { if (rawData) { rawData.forEach((item) => { // 실적 테이블 데이터 - prfTableData(item.prfList, year); + if (chartId){ + if(item.prfList?.[0]?.ym.slice(0, 4) === year && item.prfList?.[0]?.pbnstRuseFcltFk === chartId) + prfTableData(item.prfList, year); + item.prfList.filter((e) => e.ym.slice(0, 4) === year && e.pbnstRuseFcltFk === chartId).forEach((element) => { + // 누적 + wshwtr += element.wshwtr; + coolUswtr += element.coolUswtr; + cleanUswtr += element.cleanUswtr; + drwtUswtr += element.drwtUswtr; + dltnUswtr += element.dltnUswtr; + ithlRswtr += element.ithlRswtr; + ithlEtcUswtr += element.ithlEtcUswtr; + cleanToilUswtr += element.cleanToilUswtr; + resn += element.resn; + lndwtr += element.lndwtr; + hydUswtr += element.hydUswtr; + ugwtChr += element.ugwtChr; + farmUswtr += element.farmUswtr; + rvrKeepUswtr += element.rvrKeepUswtr; + indstUswtr += element.indstUswtr; - item.prfList.filter((e) => e.ym.slice(0, 4) === year).forEach((element) => { - // 누적 - wshwtr += element.wshwtr; - coolUswtr += element.coolUswtr; - cleanUswtr += element.cleanUswtr; - drwtUswtr += element.drwtUswtr; - dltnUswtr += element.dltnUswtr; - ithlRswtr += element.ithlRswtr; - ithlEtcUswtr += element.ithlEtcUswtr; - cleanToilUswtr += element.cleanToilUswtr; - resn += element.resn; - lndwtr += element.lndwtr; - hydUswtr += element.hydUswtr; - ugwtChr += element.ugwtChr; - farmUswtr += element.farmUswtr; - rvrKeepUswtr += element.rvrKeepUswtr; - indstUswtr += element.indstUswtr; + // 월별 합계 + inUsageSum = element.wshwtr + + element.coolUswtr + + element.cleanUswtr + + element.drwtUswtr + + element.dltnUswtr + + element.ithlRswtr + + element.ithlEtcUswtr + + element.cleanToilUswtr + + element.resn; + outUsageSum = element.lndwtr + + element.hydUswtr + + element.ugwtChr + + element.farmUswtr + + element.rvrKeepUswtr + + element.indstUswtr; + inUsageArr.push(inUsageSum); + outUsageArr.push(outUsageSum); - // 월별 합계 - inUsageSum = element.wshwtr - + element.coolUswtr - + element.cleanUswtr - + element.drwtUswtr - + element.dltnUswtr - + element.ithlRswtr - + element.ithlEtcUswtr - + element.cleanToilUswtr - + element.resn; - outUsageSum = element.lndwtr - + element.hydUswtr - + element.ugwtChr - + element.farmUswtr - + element.rvrKeepUswtr - + element.indstUswtr; - inUsageArr.push(inUsageSum); - outUsageArr.push(outUsageSum); + // 막대차트 + const month = Number(element.ym.slice(4, 6)); + barData.push({ label: `${month}월`, "장내용수": inUsageSum, "장외용수": outUsageSum }); - // 막대차트 - const month = Number(element.ym.slice(4, 6)); - barData.push({ label: `${month}월`, "장내용수": inUsageSum, "장외용수": outUsageSum }); + // 라인차트 + wshwtrData.push({ label: `${month}월`, val: element.wshwtr, color: "red" }); + coolUswtrData.push({ label: `${month}월`, val: element.coolUswtr, color: "orange" }); + cleanUswtrData.push({ label: `${month}월`, val: element.cleanUswtr, color: "yellow" }); + drwtUswtrData.push({ label: `${month}월`, val: element.drwtUswtr, color: "pink" }); + dltnUswtrData.push({ label: `${month}월`, val: element.dltnUswtr, color: "purple" }); + ithlRswtrData.push({ label: `${month}월`, val: element.ithlRswtr, color: "green" }); + ithlEtcUswtrData.push({ label: `${month}월`, val: element.ithlEtcUswtr, color: "blue" }); + cleanToilUswtrData.push({ label: `${month}월`, val: element.cleanToilUswtr, color: "magenta" }); + resnData.push({ label: `${month}월`, val: element.resn, color: "skyblue" }); - // 라인차트 - wshwtrData.push({ label: `${month}월`, val: element.wshwtr, color: "red" }); - coolUswtrData.push({ label: `${month}월`, val: element.coolUswtr, color: "orange" }); - cleanUswtrData.push({ label: `${month}월`, val: element.cleanUswtr, color: "yellow" }); - drwtUswtrData.push({ label: `${month}월`, val: element.drwtUswtr, color: "pink" }); - dltnUswtrData.push({ label: `${month}월`, val: element.dltnUswtr, color: "purple" }); - ithlRswtrData.push({ label: `${month}월`, val: element.ithlRswtr, color: "green" }); - ithlEtcUswtrData.push({ label: `${month}월`, val: element.ithlEtcUswtr, color: "blue" }); - cleanToilUswtrData.push({ label: `${month}월`, val: element.cleanToilUswtr, color: "magenta" }); - resnData.push({ label: `${month}월`, val: element.resn, color: "skyblue" }); - - lndwtrData.push({ label: `${month}월`, val: element.lndwtr, color: "red" }); - hydUswtrData.push({ label: `${month}월`, val: element.hydUswtr, color: "orange" }); - ugwtChrData.push({ label: `${month}월`, val: element.ugwtChr, color: "yellow" }); - farmUswtrData.push({ label: `${month}월`, val: element.farmUswtr, color: "green" }); - rvrKeepUswtrData.push({ label: `${month}월`, val: element.rvrKeepUswtr, color: "blue" }); - indstUswtrData.push({ label: `${month}월`, val: element.indstUswtr, color: "purple" }); - }); + lndwtrData.push({ label: `${month}월`, val: element.lndwtr, color: "red" }); + hydUswtrData.push({ label: `${month}월`, val: element.hydUswtr, color: "orange" }); + ugwtChrData.push({ label: `${month}월`, val: element.ugwtChr, color: "yellow" }); + farmUswtrData.push({ label: `${month}월`, val: element.farmUswtr, color: "green" }); + rvrKeepUswtrData.push({ label: `${month}월`, val: element.rvrKeepUswtr, color: "blue" }); + indstUswtrData.push({ label: `${month}월`, val: element.indstUswtr, color: "purple" }); + }); + } }); // 도넛차트 데이터 @@ -316,7 +322,7 @@ export default function PbnstPrfmncSttn() { setDnInUsage(dnInData); setDnOutUsage(dnOutData); } - }, [rawData, year]); + }, [rawData, year, chartId]); useEffect(() => { const newChartConfig = chartData.reduce((config, element) => { @@ -440,24 +446,37 @@ export default function PbnstPrfmncSttn() { }, [outLineData]); useEffect(() => { - if (!pbnstPrfmncSttn.isInit) { - pbnstPrfmncInit("1", "11"); + const returnType: ReturnType = { + sidoValue: "0", + sigunValue: "0", + partValue: "A", + regionValue: "0", + unitWaterShedValue: "", + middleRegionValue: "", + envPartValue: "", + sidoText: "", + sigunText: "" } - }, [pbnstPrfmncSttn.isInit, pbnstPrfmncInit]); + tableHeadMaker(Number(searchYear), Number(searchYear)); + pbnstPrfmncSearch(returnType, "", searchYear, searchYear) + }, []); useEffect(() => { setbdstTable(prfmncRes); }, [prfmncRes]); - const [searchYear, setSearchYear] = useState( - String(new Date().getFullYear()) - ); + useEffect(() => { if (pbnRuseNm.length > 1) pbnNmSearch("1", "23", ref.current, pbnRuseNm, searchYear); }, [pbnRuseNm]); + const cellClick = (index: number | undefined, headId: string) => { + if (index !== undefined && headId !== undefined) { + setChartId(prfmncRes[index].pbnstRuseFcltPk) + } + } return ( <> @@ -551,7 +570,9 @@ export default function PbnstPrfmncSttn() { headlist={pbnstPrfHeadList} pageSize={20} total={10000} - cellClick={() => { }} + cellClick={(index: number | undefined, headId: string) => { + cellClick(index ?? undefined, headId); + }} onPageChange={() => { }} /> diff --git a/apps/wr/app/store/common/code/index.ts b/apps/wr/app/store/common/code/index.ts index 74001b27c..e7fca8180 100644 --- a/apps/wr/app/store/common/code/index.ts +++ b/apps/wr/app/store/common/code/index.ts @@ -181,10 +181,20 @@ export type comCodeType = comCodeState & comCodeActions; export const getSggCd = async (set: any) => { const sgg = await getFetch("common", "/addr/sgg"); - const sggCd = sgg.map((item: any) => ({ + /* const sggCd = sgg.map((item: any) => ({ val: item.adstDstrCd, text: item.gugun, - })); + })); */ + + const sggCd = [ + { text: "전체", val: '0' }, + ...sgg + .map((item: any) => ({ + text: item.gugun || '', + val: String(item.adstDstrCd) || '' + })) + ]; + set((state: comCodeState) => ({ code: { ...state.code, @@ -332,7 +342,7 @@ export const codeActionExport: (set: any) => comCodeActions = (set: any) => { val: item.adstDstrCd, text: item.gugun, })); - + const city = await getFetch("common", "/addr/city"); const cityCd = city.map((item: any) => ({ val: item.adstDstrCd, diff --git a/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/index.tsx b/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/index.tsx index d0e958785..c2cee87d6 100644 --- a/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/index.tsx +++ b/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/index.tsx @@ -75,7 +75,7 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions for (let i = startYear; i <= endYear; i++) { const yearHead = JSON.parse(JSON.stringify(pbnstYearHeadListExport)); if (yearHead) { - yearHead.forEach((item: { id?: number; }) => { + yearHead.forEach((item: { id?: string; }) => { if (item.id) { item.id = i + item.id; @@ -92,6 +92,7 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions return { ...state, pbnstPrfmncSttn: { + ...state.pbnstPrfmncSttn, pbnstPrfHeadList: [...yearHeader], selectYearList: selectList }, @@ -106,7 +107,7 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions pbnstPrfmncSttn: { ...state.pbnstPrfmncSttn, prfmncRes: prfmncRes, - isInit: false, + isInit: true, }, })); } catch (e) { @@ -115,8 +116,7 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions }, pbnstPrfmncSearch: async (returnType: ReturnType, swtrmtFcltNm: string, fromDate: string, toDate: string) => { let searchUrl = ""; - - if (returnType.sigunValue !== undefined) { + if (returnType.sigunValue !== "0") { if (swtrmtFcltNm !== "") { searchUrl = `/prcsFclt/info/1/20/${returnType.partValue}/${returnType.sigunValue}/0/1/SW${'/' + swtrmtFcltNm}`; } else { @@ -134,6 +134,7 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions fetchType.COMMON, searchUrl ); + const bscFctCdList = pbnstRes.map((item: any) => { return item.bscFctCd; }) @@ -147,32 +148,59 @@ export const pbnstPrfmncSttnActionsExport: (set: any) => pbnstPrfmncSttnActions let usageSum = 0; let year = ""; const yearsData = [] + res.data.forEach((item) => { + if (item.prfList.length === 0) { + const year = ""; // 연도 정보가 없으면 빈 문자열, 필요시 item에서 추출 + const yearVal = { year: year, pbnstRuseFcltPk: item.pbnstRuseFcltPk ?? "" }; + yearVal[year + "inUsage"] = 0; + yearVal[year + "outUsage"] = 0; + yearVal[year + "total"] = 0; + yearsData.push(yearVal); + } item.prfList.forEach((acc) => { - year = acc.ym.substring(0, 4); - inUsageSum = acc.wshwtr + acc.coolUswtr + acc.cleanUswtr + acc.drwtUswtr + - acc.dltnUswtr + acc.ithlRswtr + acc.ithlEtcUswtr + acc.cleanToilUswtr + acc.resn; - outUsageSum = acc.lndwtr + acc.hydUswtr + acc.ugwtChr + acc.farmUswtr + acc.rvrKeepUswtr + acc.indstUswtr; - const yearData = yearsData.find(yearItem => yearItem.year === year && yearItem.pbnstRuseFcltPk == acc.pbnstRuseFcltPk) + year = acc.ym?.substring(0, 4) ?? ""; + inUsageSum = + (acc.wshwtr ?? 0) + + (acc.coolUswtr ?? 0) + + (acc.cleanUswtr ?? 0) + + (acc.drwtUswtr ?? 0) + + (acc.dltnUswtr ?? 0) + + (acc.ithlRswtr ?? 0) + + (acc.ithlEtcUswtr ?? 0) + + (acc.cleanToilUswtr ?? 0) + + (acc.resn ?? 0); + outUsageSum = + (acc.lndwtr ?? 0) + + (acc.hydUswtr ?? 0) + + (acc.ugwtChr ?? 0) + + (acc.farmUswtr ?? 0) + + (acc.rvrKeepUswtr ?? 0) + + (acc.indstUswtr ?? 0); + const yearData = yearsData.find( + (yearItem) => + yearItem.year === year && + yearItem.pbnstRuseFcltPk == acc.pbnstRuseFcltPk + ); if (yearData) { - yearData.inUsageSum += inUsageSum; - yearData.outUsageSum += outUsageSum; + yearData[year + "inUsage"] += inUsageSum; + yearData[year + "outUsage"] += outUsageSum; + yearData[year + "total"] += (inUsageSum + outUsageSum); } else { - const yearVal = { year: year, pbnstRuseFcltPk: acc.pbnstRuseFcltFk } - yearVal[year + 'inUsage'] = inUsageSum; - yearVal[year + 'outUsage'] = outUsageSum; - yearVal[year + 'total'] = inUsageSum + outUsageSum; + const yearVal = { year: year, pbnstRuseFcltPk: acc.pbnstRuseFcltFk }; + yearVal[year + "inUsage"] = inUsageSum; + yearVal[year + "outUsage"] = outUsageSum; + yearVal[year + "total"] = inUsageSum + outUsageSum; yearsData.push(yearVal); } - - }) - }) + }); + }); const resData: any[] = [] pbnstRes.forEach((acc) => { let data = yearsData.find((item) => item.pbnstRuseFcltPk.substring(0, 11) === acc.bscFctCd) if (data) { - resData.push({ ...data, ...acc }) + resData.push({ ...acc, ...data }) } }) return set((state: pbnstPrfmncSttnState) => ({