ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

우리동네가뭄 시도 시군구 selectBox 오류 수정, 재이용실적현황 차트 색 변경

Browse Source
This commit is contained in:
jyha00
2025-07-02 14:27:33 +09:00
parent 751ce5bff9
commit f6f03a62cb
2 changed files with 105 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/app/matMng/coMng/drgtSttn/page.tsx
+31 -10
View File
@@ -53,8 +53,7 @@ export default function DrgtSttn() {
useEffect(() => {
let resData = Array.isArray(drgtRes) ? drgtRes : [drgtRes];
resData = resData.map((item) => {
console.log("item", item);
if(item.sggNm === '세종시'){
if (item.sggNm === '세종시') {
return {
...item,
ctpvCd: '세종특별자치시',
@@ -64,7 +63,7 @@ export default function DrgtSttn() {
return {
...item,
ctpvCd: code.cityCd.find(ct => (ct.text == item.sggNm || (code.sggCd.find(sgg => sgg.text == item.sggNm)?.val.substring(0,2) == ct.val)))?.text,
ctpvCd: code.cityCd.find(ct => (ct.text == item.sggNm || (code.sggCd.find(sgg => sgg.text == item.sggNm)?.val.substring(0, 2) == ct.val)))?.text,
sggNm: code.sggCd.find(sgg => sgg.text == item.sggNm)?.text
}
})
@@ -91,13 +90,24 @@ export default function DrgtSttn() {
}, [drgtMoRes]);
const getSelCity = (val: string | number) => {
const cityValue = String(val); // Ensure val is treated as a string
const data = getCity(cityValue, code.sggCd);
setSelectSgg(data);
setObjSearch({ city: cityValue, sgg: "" });
const cityValue = String(val);
if (cityValue === "0") {
setSelectSgg([]);
setSelectedSgg('');
setObjSearch({ city: cityValue, sgg: '' });
} else {
const data = getCity(cityValue, code.sggCd);
setSelectSgg(data);
const firstSggVal = data.find(item => item.val === "0")?.val || (data[0]?.val ?? "");
setSelectedSgg(firstSggVal);
setObjSearch({ city: cityValue, sgg: firstSggVal });
}
};
const getSgg = (val: string | number) => {
setSelectedSgg(String(val));
setObjSearch({ ...objSearch, sgg: String(val) });
};
@@ -191,13 +201,24 @@ export default function DrgtSttn() {
sggText = code.sggCd.find((item) => item.val === objSearch?.sgg)?.text ?? '';
} else {
sggText = code.sggCd.filter((item) => item.val.substring(0, 2) === objSearch?.city).map((item) => item.text);
}
if (sidoText === '전체') { sidoText = '' }
if (sidoText === '세종특별자치시') {
sidoText = '세종시';
sggText = sidoText;
}
drgtSearch(fromDate ?? "", toDate ?? "", [sidoText, ...sggText])
const searchArr = [];
if (sidoText) searchArr.push(sidoText);
if (Array.isArray(sggText)) {
searchArr.push(...sggText);
} else if (sggText) {
searchArr.push(sggText);
}
drgtSearch(fromDate ?? "", toDate ?? "", searchArr)
}}
>
조회
@@ -246,7 +267,7 @@ export default function DrgtSttn() {
setDrgtModal({ ...drgtModal, isOpen: !drgtModal.isOpen });
}}
bodyClass={"w-[50vw] max-w-none h-[80vh]"}
body={<DrgtDetailModal data={drgtModal.data}/>}
body={<DrgtDetailModal data={drgtModal.data} />}
/>
<Toaster position="top-center" />
</ContentsDiv>
apps/wr/app/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx
+74 -48
View File
@@ -8,9 +8,11 @@ import { excelDownload, yearOptions } from "@/components/lib/func/commom";
import SearchInputText from "@/components/ui/searchInput/searchInput";
import { CHART_FORM, ContentsDiv, MainChart, ScrollArea, SearchBaseForm, SearchInput, SelectBox, Title, UiTable, type ChartConfig, type ReturnType } from "@common/business_components";
import ListDiv from "@common/business_components/ui/list_div";
import { Button, Label } from "@common/components/ui";
import { Button, Label, Table, TableBody, TableHeader } from "@common/components/ui";
import { useCallback, useEffect, useRef, useState } from "react";
import toast, { Toaster } from "react-hot-toast";
import { headMakeprfmnc } from "../../prfmncReg/chkgdnReg/TableHead";
import { InputTableBody } from "@/components/lib/func/TableData";
export default function PbnstPrfmncSttn() {
const {
@@ -34,9 +36,9 @@ export default function PbnstPrfmncSttn() {
const [swtrmtFcltNm, setSwtrmtFcltNm] = useState<string>();
const [pbnRuseNm, setPbnRuseNm] = useState<string>("");
const [searchYear, setSearchYear] = useState<string>(
String(new Date().getFullYear())
);
const [searchYear, setSearchYear] = useState<string>(
String(new Date().getFullYear())
);
const [excelData, setExcelData] = useState<any[]>([]);
const excelClick = useCallback(() => {
excelDownload(
@@ -83,15 +85,20 @@ export default function PbnstPrfmncSttn() {
type lineChartDataProps = { label: string, val: number, color: string };
const prfTableData = (prfList: PrfType[], year: string) => {
const inUsageData = structuredClone(initValInUsage);
const outUsageData = structuredClone(initValOutUsage);
const inSubtotal = structuredClone(subTotalObj);
const outSubtotal = structuredClone(subTotalObj);
const inUsageData = structuredClone(initValInUsage).map(row => ({
...row,
구분: "장내용수",
}));
const outUsageData = structuredClone(initValOutUsage).map(row => ({
...row,
구분: "장외용수",
}));
const inSubtotal = { ...structuredClone(subTotalObj), 구분: "장내용수" };
const outSubtotal = { ...structuredClone(subTotalObj), 구분: "장외용수" };
const prfFilter = prfList?.filter((e) => e.ym.slice(0, 4) === year)
if (prfList && prfFilter.length > 0) {
prfList?.forEach((prfItem) => {
const month = Number(prfItem?.ym?.slice(4)); // "MM"
const monthKey = `${month}월`;
@@ -142,7 +149,7 @@ export default function PbnstPrfmncSttn() {
setPrfData([]);
}
}
const [chartId, setChartId] = useState<string>();
useEffect(() => {
// 누적 변수 초기화
@@ -198,8 +205,8 @@ export default function PbnstPrfmncSttn() {
prfTableData([], year)
rawData.forEach((item) => {
// 실적 테이블 데이터
if (chartId){
if(item.prfList?.[0]?.ym.slice(0, 4) === year && item.prfList?.[0]?.pbnstRuseFcltFk === chartId){
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) => {
@@ -265,40 +272,40 @@ export default function PbnstPrfmncSttn() {
});
// 도넛차트 데이터
dnData.push({ label: "세척수", val: wshwtr, fill: "red" });
dnData.push({ label: "냉각수", val: coolUswtr, fill: "orange" });
dnData.push({ label: "청소수", val: cleanUswtr, fill: "yellow" });
dnData.push({ label: "식수대", val: drwtUswtr, fill: "green" });
dnData.push({ label: "희석용수", val: dltnUswtr, fill: "skyblue" });
dnData.push({ label: "중수도", val: ithlRswtr, fill: "blue" });
dnData.push({ label: "기타", val: ithlEtcUswtr, fill: "purple" });
dnData.push({ label: "청소화장실용수", val: cleanToilUswtr, fill: "red" });
dnData.push({ label: "세척살수용수", val: resn, fill: "orange" });
dnData.push({ label: "조경용수", val: lndwtr, fill: "yellow" });
dnData.push({ label: "친수용수", val: hydUswtr, fill: "green" });
dnData.push({ label: "지하수충전", val: ugwtChr, fill: "skyblue" });
dnData.push({ label: "농업용수", val: farmUswtr, fill: "blue" });
dnData.push({ label: "하천등유지용수", val: rvrKeepUswtr, fill: "purple" });
dnData.push({ label: "공업용수", val: indstUswtr, fill: "black" });
dnData.push({ label: "세척수", val: wshwtr, fill: "#F7CFD8" });
dnData.push({ label: "냉각수", val: coolUswtr, fill: "#F4F8D3" });
dnData.push({ label: "청소수", val: cleanUswtr, fill: "#A6D6D6" });
dnData.push({ label: "식수대", val: drwtUswtr, fill: "#8E7DBE" });
dnData.push({ label: "희석용수", val: dltnUswtr, fill: "#FF8383" });
dnData.push({ label: "중수도", val: ithlRswtr, fill: "#FFF574" });
dnData.push({ label: "기타", val: ithlEtcUswtr, fill: "#A1D6CB" });
dnData.push({ label: "청소화장실용수", val: cleanToilUswtr, fill: "#A19AD3" });
dnData.push({ label: "세척살수용수", val: resn, fill: "#B1F0F7" });
dnData.push({ label: "조경용수", val: lndwtr, fill: "#81BFDA" });
dnData.push({ label: "친수용수", val: hydUswtr, fill: "#F5F0CD" });
dnData.push({ label: "지하수충전", val: ugwtChr, fill: "#FADA7A" });
dnData.push({ label: "농업용수", val: farmUswtr, fill: "#A6AEBF" });
dnData.push({ label: "하천등유지용수", val: rvrKeepUswtr, fill: "#C5D3E8" });
dnData.push({ label: "공업용수", val: indstUswtr, fill: "#D0E8C5" });
// 장내용수 도넛
dnInData.push({ label: "세척수", val: wshwtr, fill: "yellow" });
dnInData.push({ label: "냉각수", val: coolUswtr, fill: "green" });
dnInData.push({ label: "청소수", val: cleanUswtr, fill: "yellow" });
dnInData.push({ label: "식수대", val: drwtUswtr, fill: "green" });
dnInData.push({ label: "희석용수", val: dltnUswtr, fill: "yellow" });
dnInData.push({ label: "중수도", val: ithlRswtr, fill: "green" });
dnInData.push({ label: "기타", val: ithlEtcUswtr, fill: "yellow" });
dnInData.push({ label: "청소화장실용수", val: cleanToilUswtr, fill: "green" });
dnInData.push({ label: "세척살수용수", val: resn, fill: "yellow" });
dnInData.push({ label: "세척수", val: wshwtr, fill: "#F7CFD8" });
dnInData.push({ label: "냉각수", val: coolUswtr, fill: "#F4F8D3" });
dnInData.push({ label: "청소수", val: cleanUswtr, fill: "#A6D6D6" });
dnInData.push({ label: "식수대", val: drwtUswtr, fill: "#8E7DBE" });
dnInData.push({ label: "희석용수", val: dltnUswtr, fill: "#FF8383" });
dnInData.push({ label: "중수도", val: ithlRswtr, fill: "#FFF574" });
dnInData.push({ label: "기타", val: ithlEtcUswtr, fill: "#A1D6CB" });
dnInData.push({ label: "청소화장실용수", val: cleanToilUswtr, fill: "#A19AD3" });
dnInData.push({ label: "세척살수용수", val: resn, fill: "#B1F0F7" });
// 장외용수 도넛
dnOutData.push({ label: "조경용수", val: lndwtr, fill: "yellow" });
dnOutData.push({ label: "친수용수", val: hydUswtr, fill: "black" });
dnOutData.push({ label: "지하수충전", val: ugwtChr, fill: "yellow" });
dnOutData.push({ label: "농업용수", val: farmUswtr, fill: "black" });
dnOutData.push({ label: "하천등유지용수", val: rvrKeepUswtr, fill: "yellow" });
dnOutData.push({ label: "공업용수", val: indstUswtr, fill: "black" });
dnOutData.push({ label: "조경용수", val: lndwtr, fill: "#81BFDA" });
dnOutData.push({ label: "친수용수", val: hydUswtr, fill: "#F5F0CD" });
dnOutData.push({ label: "지하수충전", val: ugwtChr, fill: "#FADA7A" });
dnOutData.push({ label: "농업용수", val: farmUswtr, fill: "#A6AEBF" });
dnOutData.push({ label: "하천등유지용수", val: rvrKeepUswtr, fill: "#C5D3E8" });
dnOutData.push({ label: "공업용수", val: indstUswtr, fill: "#D0E8C5" });
// 라인차트 데이터
setInLineData({
@@ -466,7 +473,7 @@ export default function PbnstPrfmncSttn() {
useEffect(() => {
setbdstTable(prfmncRes);
if(prfmncRes?.[0]?.pbnstRuseFcltPk) setChartId(prfmncRes[0].pbnstRuseFcltPk)
if (prfmncRes?.[0]?.pbnstRuseFcltPk) setChartId(prfmncRes[0].pbnstRuseFcltPk)
}, [prfmncRes]);
@@ -619,12 +626,12 @@ export default function PbnstPrfmncSttn() {
</div>
<h1 className="">하수재이용실적 현황</h1>
<ListDiv className="col-span-8 pr-6 ">
<ScrollArea className="h-[60vh]">
<div className="card-header">
{/* <ScrollArea className="h-[60vh]"> */}
{/* <div className="card-header">
<h3 className="text-2xl font-medium text-label">
{"하수처리수재이용 실적(m3) 등록결과"}
</h3>
</div>
</div> */}
<UiTable
headName={undefined}
@@ -637,7 +644,26 @@ export default function PbnstPrfmncSttn() {
throw new Error("Function not implemented.");
}}>
</UiTable>
</ScrollArea>
{/* <ListDiv className="col-span-8 pr-6 ">
<ScrollArea className="h-[60vh]">
<div className="card-header">
<h3 className="text-2xl font-medium text-label">
{"하수처리수재이용 실적(m3) 등록결과"}
</h3>
</div>
<Table variant="secondary">
<TableHeader className="font-bold">
{headMakeprfmnc(monthHeadList, [])}
</TableHeader>
<TableBody>
{InputTableBody(prfData ?? [], monthHeadList, setPrfData)}
</TableBody>
</Table>
</ScrollArea>
</ListDiv> */}
{/* </ScrollArea> */}
</ListDiv>
</ListDiv>