577 lines
26 KiB
TypeScript
577 lines
26 KiB
TypeScript
"use client"
|
|
import { useFoStore } from "@/app/store";
|
|
import type { FacilityWaterQltyProps, modalExcelType } from "@/app/store/facilityWaterQlty";
|
|
import { downloadExcel, UITab, UiTable } from "@common/business_components/ui";
|
|
import { Button, TabsContent } from "@common/components/ui";
|
|
import { useCallback, useEffect, useRef, useState } from "react";
|
|
import type { ReturnType } from "../../../../components/common/FacilityTermModalHeader";
|
|
import FacilityTermModalHeader from "../../../../components/common/FacilityTermModalHeader";
|
|
import { HeadMakeColSpan } from "../HeadMakeColSpan";
|
|
|
|
type ModalProps ={
|
|
fcltyName: string;
|
|
facilityCd : string;
|
|
searchYear : string;
|
|
}
|
|
|
|
const tabList1 = [
|
|
{ value: 'tab_num1', label: '처리시설 수질현황' },
|
|
{ value: 'tab_num2', label: '총인설비 수질현황' },
|
|
];
|
|
|
|
const tabList2 = [
|
|
{ value: 'tab_term_year', label: '연간' },
|
|
{ value: 'tab_term_summer', label: '하절기' },
|
|
{ value: 'tab_term_winter', label: '동절기' },
|
|
{ value: 'tab_term_chuncheon', label: '청천시' },
|
|
{ value: 'tab_term_rain', label: '강우시' }
|
|
];
|
|
|
|
const tabList3 = [
|
|
{ value: 'tab_term_year_chongin', label: '연간' },
|
|
{ value: 'tab_term_summer_chongin', label: '하절기' },
|
|
{ value: 'tab_term_winter_chongin', label: '동절기' }
|
|
];
|
|
|
|
export default function WaterQualityModal({fcltyName='', facilityCd='', searchYear=new Date().getFullYear().toString()} : ModalProps) {
|
|
// 그리드 관련
|
|
const {FacilityWaterQltyModal,
|
|
searchFacilityWaterQltyListHist,
|
|
Common
|
|
} = useFoStore((state) => state);
|
|
const {btnClass} = Common;
|
|
const {
|
|
upHeadListModalYear,
|
|
facilityWaterQltyYearList,
|
|
upHeadListModalTms,
|
|
tmsList,
|
|
msrmtDate,
|
|
upHeadListModalChongIn,
|
|
} = FacilityWaterQltyModal;
|
|
|
|
const prevExcelListRef = useRef<modalExcelType[] | null>(null);
|
|
|
|
// 필터링 된 후 최대, 최소, 평균 값 계산
|
|
const setFilterAfterData = (filteredData: FacilityWaterQltyProps[]) => {
|
|
// 쉼표가 포함된 문자열을 숫자로 변환하는 함수
|
|
const parseNumber = (value: string | number | null | undefined): number => {
|
|
if (value === null || value === undefined || value === '') return 0;
|
|
if (typeof value === 'number') return value;
|
|
return Number(value.replace(/,/g, ''));
|
|
};
|
|
|
|
let maxEfflWqltBod = 0;
|
|
let maxEfflWqltTn = 0;
|
|
let maxEfflWqltTp = 0;
|
|
let maxefflWqltToc = 0;
|
|
let maxEfflWqltSs = 0;
|
|
|
|
let maxinflAssctBfrWqltBod = 0;
|
|
let maxinflAssctBfrWqltTn = 0;
|
|
let maxInflAssctBfrWqltTp = 0;
|
|
let maxinflAssctBfrWqltToc = 0;
|
|
let maxinflAssctBfrWqltSs = 0;
|
|
|
|
let maxTpInflWqltBod = 0;
|
|
let maxTpInflWqltTp = 0;
|
|
let maxInfoRnDay = 0;
|
|
|
|
// 초기값 설정
|
|
let minEfflWqltBod = filteredData.length > 0 ? parseNumber(filteredData[0]?.efflWqltBod) : 0;
|
|
let minEfflWqltTn = filteredData.length > 0 ? parseNumber(filteredData[0]?.efflWqltTn) : 0;
|
|
let minEfflWqltTp = filteredData.length > 0 ? parseNumber(filteredData[0]?.efflWqltTp) : 0;
|
|
let minefflWqltToc = filteredData.length > 0 ? parseNumber(filteredData[0]?.efflWqltToc) : 0;
|
|
let minEfflWqltSs = filteredData.length > 0 ? parseNumber(filteredData[0]?.efflWqltSs) : 0;
|
|
|
|
let mininflAssctBfrWqltBod = filteredData.length > 0 ? parseNumber(filteredData[0]?.inflAssctBfrWqltBod) : 0;
|
|
let mininflAssctBfrWqltTn = filteredData.length > 0 ? parseNumber(filteredData[0]?.inflAssctBfrWqltTn) : 0;
|
|
let minInflAssctBfrWqltTp = filteredData.length > 0 ? parseNumber(filteredData[0]?.inflAssctBfrWqltTp) : 0;
|
|
let mininflAssctBfrWqltToc = filteredData.length > 0 ? parseNumber(filteredData[0]?.inflAssctBfrWqltToc) : 0;
|
|
let mininflAssctBfrWqltSs = filteredData.length > 0 ? parseNumber(filteredData[0]?.inflAssctBfrWqltSs) : 0;
|
|
|
|
let minTpInflWqltBod = filteredData.length > 0 ? parseNumber(filteredData[0]?.tpInflWqltBod) : 0;
|
|
let minTpInflWqltTp = filteredData.length > 0 ? parseNumber(filteredData[0]?.tpInflWqltTp) : 0;
|
|
|
|
let minInfoRnDay = filteredData.length > 0 ? parseNumber(filteredData[0]?.infoRnDay) : 0;
|
|
|
|
let avgEfflWqltBod = 0;
|
|
let avgEfflWqltTn = 0;
|
|
let avgEfflWqltTp = 0;
|
|
let avgefflWqltToc = 0;
|
|
let avgEfflWqltSs = 0;
|
|
|
|
let avginflAssctBfrWqltBod = 0;
|
|
let avginflAssctBfrWqltTn = 0;
|
|
let avgInflAssctBfrWqltTp = 0;
|
|
let avginflAssctBfrWqltToc = 0;
|
|
let avginflAssctBfrWqltSs = 0;
|
|
|
|
let avgTpInflWqltBod = 0;
|
|
let avgTpInflWqltTp = 0;
|
|
|
|
let avgInfoRnDay = 0;
|
|
|
|
filteredData.forEach((item: FacilityWaterQltyProps) => {
|
|
const efflWqltBod = parseNumber(item.efflWqltBod);
|
|
const efflWqltTn = parseNumber(item.efflWqltTn);
|
|
const efflWqltTp = parseNumber(item.efflWqltTp);
|
|
const efflWqltToc = parseNumber(item.efflWqltToc);
|
|
const efflWqltSs = parseNumber(item.efflWqltSs);
|
|
|
|
const inflAssctBfrWqltBod = parseNumber(item.inflAssctBfrWqltBod);
|
|
const inflAssctBfrWqltTn = parseNumber(item.inflAssctBfrWqltTn);
|
|
const inflAssctBfrWqltTp = parseNumber(item.inflAssctBfrWqltTp);
|
|
const inflAssctBfrWqltToc = parseNumber(item.inflAssctBfrWqltToc);
|
|
const inflAssctBfrWqltSs = parseNumber(item.inflAssctBfrWqltSs);
|
|
|
|
|
|
const tpInflWqltBod = parseNumber(item.tpInflWqltBod);
|
|
const tpInflWqltTp = parseNumber(item.tpInflWqltTp);
|
|
|
|
const infoRnDay = parseNumber(item.infoRnDay);
|
|
|
|
maxEfflWqltBod = Math.max(maxEfflWqltBod, efflWqltBod);
|
|
maxEfflWqltTn = Math.max(maxEfflWqltTn, efflWqltTn);
|
|
maxEfflWqltTp = Math.max(maxEfflWqltTp, efflWqltTp);
|
|
maxefflWqltToc = Math.max(maxefflWqltToc, efflWqltToc);
|
|
maxEfflWqltSs = Math.max(maxEfflWqltSs, efflWqltSs);
|
|
|
|
maxinflAssctBfrWqltBod = Math.max(maxinflAssctBfrWqltBod, inflAssctBfrWqltBod);
|
|
maxinflAssctBfrWqltTn = Math.max(maxinflAssctBfrWqltTn, inflAssctBfrWqltTn);
|
|
maxInflAssctBfrWqltTp = Math.max(maxInflAssctBfrWqltTp, inflAssctBfrWqltTp);
|
|
maxinflAssctBfrWqltToc = Math.max(maxinflAssctBfrWqltToc, inflAssctBfrWqltToc);
|
|
maxinflAssctBfrWqltSs = Math.max(maxinflAssctBfrWqltSs, inflAssctBfrWqltSs);
|
|
|
|
maxTpInflWqltBod = Math.max(maxTpInflWqltBod, tpInflWqltBod);
|
|
maxTpInflWqltTp = Math.max(maxTpInflWqltTp, tpInflWqltTp);
|
|
|
|
maxInfoRnDay = Math.max(maxInfoRnDay, infoRnDay);
|
|
|
|
minEfflWqltBod = Math.min(minEfflWqltBod, efflWqltBod);
|
|
minEfflWqltTn = Math.min(minEfflWqltTn, efflWqltTn);
|
|
minEfflWqltTp = Math.min(minEfflWqltTp, efflWqltTp);
|
|
minefflWqltToc = Math.min(minefflWqltToc, efflWqltToc);
|
|
minEfflWqltSs = Math.min(minEfflWqltSs, efflWqltSs);
|
|
|
|
mininflAssctBfrWqltBod = Math.min(mininflAssctBfrWqltBod, inflAssctBfrWqltBod);
|
|
mininflAssctBfrWqltTn = Math.min(mininflAssctBfrWqltTn, inflAssctBfrWqltTn);
|
|
minInflAssctBfrWqltTp = Math.min(minInflAssctBfrWqltTp, inflAssctBfrWqltTp);
|
|
mininflAssctBfrWqltToc = Math.min(mininflAssctBfrWqltToc, inflAssctBfrWqltToc);
|
|
mininflAssctBfrWqltSs = Math.min(mininflAssctBfrWqltSs, inflAssctBfrWqltSs);
|
|
|
|
minTpInflWqltBod = Math.min(minTpInflWqltBod, tpInflWqltBod);
|
|
minTpInflWqltTp = Math.min(minTpInflWqltTp, tpInflWqltTp);
|
|
|
|
minInfoRnDay = Math.min(minInfoRnDay, infoRnDay);
|
|
|
|
avgEfflWqltBod += efflWqltBod;
|
|
avgEfflWqltTn += efflWqltTn;
|
|
avgEfflWqltTp += efflWqltTp;
|
|
avgefflWqltToc += efflWqltToc;
|
|
avgEfflWqltSs += efflWqltSs;
|
|
|
|
avginflAssctBfrWqltBod += inflAssctBfrWqltBod;
|
|
avginflAssctBfrWqltTn += inflAssctBfrWqltTn;
|
|
avgInflAssctBfrWqltTp += inflAssctBfrWqltTp;
|
|
avginflAssctBfrWqltToc += inflAssctBfrWqltToc;
|
|
avginflAssctBfrWqltSs += inflAssctBfrWqltSs;
|
|
|
|
avgTpInflWqltBod += tpInflWqltBod;
|
|
avgTpInflWqltTp += tpInflWqltTp;
|
|
|
|
avgInfoRnDay += infoRnDay;
|
|
});
|
|
|
|
const newFilteredData = [
|
|
{
|
|
msrDt: '평균',
|
|
efflWqltBod: filteredData.length==0?'0.0':(Math.round(avgEfflWqltBod / filteredData.length * 10) / 10).toFixed(1),
|
|
efflWqltToc: filteredData.length==0?'0.0':(Math.round(avgefflWqltToc / filteredData.length * 10) / 10).toFixed(1),
|
|
efflWqltSs: filteredData.length==0?'0.0':(Math.round(avgEfflWqltSs / filteredData.length * 10) / 10).toFixed(1),
|
|
efflWqltTn: filteredData.length==0?'0.000':(Math.round(avgEfflWqltTn / filteredData.length * 1000) / 1000).toFixed(3),
|
|
efflWqltTp: filteredData.length==0?'0.000':(Math.round(avgEfflWqltTp / filteredData.length * 1000) / 1000).toFixed(3),
|
|
inflAssctBfrWqltBod: filteredData.length==0?'0.0':(Math.round(avginflAssctBfrWqltBod / filteredData.length * 10) / 10).toFixed(1),
|
|
inflAssctBfrWqltTn: filteredData.length==0?'0.000':(Math.round(avginflAssctBfrWqltTn / filteredData.length * 1000) / 1000).toFixed(3),
|
|
inflAssctBfrWqltTp: filteredData.length==0?'0.000':(Math.round(avgInflAssctBfrWqltTp / filteredData.length * 1000) / 1000).toFixed(3),
|
|
inflAssctBfrWqltToc: filteredData.length==0?'0.0':(Math.round(avginflAssctBfrWqltToc / filteredData.length * 10) / 10).toFixed(1),
|
|
inflAssctBfrWqltSs: filteredData.length==0?'0.0':(Math.round(avginflAssctBfrWqltSs / filteredData.length * 10) / 10).toFixed(1),
|
|
bscFctCd: "",
|
|
bscFctNm: "",
|
|
lclgvrnmntNm: "",
|
|
sidoNm: "",
|
|
sggNm: "",
|
|
addr: "",
|
|
fctCpc: 0,
|
|
infoRnDay: filteredData.length==0?'0.0':(Math.round(avgInfoRnDay / filteredData.length * 10) / 10).toFixed(1),
|
|
tpInflWqltBod: filteredData.length==0?'0.0':(Math.round(avgTpInflWqltBod / filteredData.length * 10) / 10).toFixed(1),
|
|
tpInflWqltTp: filteredData.length==0?'0.000':(Math.round(avgTpInflWqltTp / filteredData.length * 1000) / 1000).toFixed(3)
|
|
},
|
|
{
|
|
msrDt : '최대',
|
|
efflWqltBod : Math.round(maxEfflWqltBod * 10) / 10?(Math.round(maxEfflWqltBod * 10) / 10).toFixed(1):'0.0',
|
|
efflWqltToc : Math.round(maxefflWqltToc * 10) / 10?(Math.round(maxefflWqltToc * 10) / 10).toFixed(1):'0.0',
|
|
efflWqltSs : Math.round(maxEfflWqltSs * 10) / 10?(Math.round(maxEfflWqltSs * 10) / 10).toFixed(1):'0.0',
|
|
efflWqltTn : Math.round(maxEfflWqltTn * 1000) / 1000?(Math.round(maxEfflWqltTn * 1000) / 1000).toFixed(3):'0.000',
|
|
efflWqltTp : Math.round(maxEfflWqltTp * 1000) / 1000?(Math.round(maxEfflWqltTp * 1000) / 1000).toFixed(3):'0.000',
|
|
inflAssctBfrWqltBod : Math.round(maxinflAssctBfrWqltBod * 10) / 10?(Math.round(maxinflAssctBfrWqltBod * 10) / 10).toFixed(1):'0.0',
|
|
inflAssctBfrWqltTn : Math.round(maxinflAssctBfrWqltTn * 1000) / 1000?(Math.round(maxinflAssctBfrWqltTn * 1000) / 1000).toFixed(3):'0.000',
|
|
inflAssctBfrWqltTp : Math.round(maxInflAssctBfrWqltTp * 1000) / 1000?(Math.round(maxInflAssctBfrWqltTp * 1000) / 1000).toFixed(3):'0.000',
|
|
inflAssctBfrWqltToc : Math.round(maxinflAssctBfrWqltToc * 10) / 10?(Math.round(maxinflAssctBfrWqltToc * 10) / 10).toFixed(1):'0.0',
|
|
inflAssctBfrWqltSs : Math.round(maxinflAssctBfrWqltSs * 10) / 10?(Math.round(maxinflAssctBfrWqltSs * 10) / 10).toFixed(1):'0.0',
|
|
bscFctCd: "",
|
|
bscFctNm: "",
|
|
lclgvrnmntNm: "",
|
|
sidoNm: "",
|
|
sggNm: "",
|
|
addr: "",
|
|
fctCpc: 0,
|
|
infoRnDay: 0,
|
|
tpInflWqltBod: Math.round(maxTpInflWqltBod * 10) / 10?(Math.round(maxTpInflWqltBod * 10) / 10).toFixed(1):'0.0',
|
|
tpInflWqltTp: Math.round(maxTpInflWqltTp * 1000) / 1000?(Math.round(maxTpInflWqltTp * 1000) / 1000).toFixed(3):'0.000'
|
|
},
|
|
{
|
|
msrDt : '최소',
|
|
efflWqltBod : Math.round(minEfflWqltBod * 10) / 10?(Math.round(minEfflWqltBod?minEfflWqltBod:0 * 10) / 10).toFixed(1) : '0.0',
|
|
efflWqltToc : Math.round(minefflWqltToc * 10) / 10?(Math.round(minefflWqltToc?minefflWqltToc:0 * 10) / 10).toFixed(1) : '0.0',
|
|
efflWqltSs : Math.round(minEfflWqltSs * 10) / 10?(Math.round(minEfflWqltSs * 10) / 10).toFixed(1) : '0.0',
|
|
efflWqltTn : Math.round(minEfflWqltTn * 1000) / 1000?(Math.round(minEfflWqltTn * 1000) / 1000).toFixed(3) : '0.000',
|
|
efflWqltTp : Math.round(minEfflWqltTp * 1000) / 1000?(Math.round(minEfflWqltTp * 1000) / 1000).toFixed(3) : '0.000',
|
|
inflAssctBfrWqltBod : Math.round(mininflAssctBfrWqltBod * 10) / 10?(Math.round(mininflAssctBfrWqltBod * 10) / 10).toFixed(1) : '0.0',
|
|
inflAssctBfrWqltTn : Math.round(mininflAssctBfrWqltTn * 1000) / 1000?(Math.round(mininflAssctBfrWqltTn * 1000) / 1000).toFixed(3) : '0.000',
|
|
inflAssctBfrWqltTp : Math.round(minInflAssctBfrWqltTp * 1000) / 1000?(Math.round(minInflAssctBfrWqltTp * 1000) / 1000).toFixed(3) : '0.000',
|
|
inflAssctBfrWqltToc : Math.round(mininflAssctBfrWqltToc * 10) / 10?(Math.round(mininflAssctBfrWqltToc * 10) / 10).toFixed(1) : '0.0',
|
|
inflAssctBfrWqltSs : Math.round(mininflAssctBfrWqltSs * 10) / 10?(Math.round(mininflAssctBfrWqltSs * 10) / 10).toFixed(1) : '0.0',
|
|
bscFctCd: "",
|
|
bscFctNm: "",
|
|
lclgvrnmntNm: "",
|
|
sidoNm: "",
|
|
sggNm: "",
|
|
addr: "",
|
|
fctCpc: 0,
|
|
infoRnDay: 0,
|
|
tpInflWqltBod: Math.round(minTpInflWqltBod * 10) / 10?'0.0':(Math.round(minTpInflWqltBod * 10) / 10).toFixed(1),
|
|
tpInflWqltTp: Math.round(minTpInflWqltTp * 1000) / 1000?'0.000':(Math.round(minTpInflWqltTp * 1000) / 1000).toFixed(3)
|
|
},
|
|
...filteredData
|
|
];
|
|
return newFilteredData;
|
|
}
|
|
|
|
// 날짜 필터링 관련 상태
|
|
const [copyYearList, setCopyYearList] = useState<FacilityWaterQltyProps[]>([]);
|
|
const [chongInWaterQltyYearList, setChongInWaterQltyYearList] = useState<FacilityWaterQltyProps[]>([]);
|
|
|
|
useEffect(() => {
|
|
searchFacilityWaterQltyListHist(searchYear, facilityCd);
|
|
}, [searchYear, facilityCd, searchFacilityWaterQltyListHist]);
|
|
|
|
useEffect(() => {
|
|
const filteredYearData = setFilterAfterData(facilityWaterQltyYearList);
|
|
setCopyYearList(filteredYearData as FacilityWaterQltyProps[]);
|
|
setChongInWaterQltyYearList(filteredYearData as FacilityWaterQltyProps[]);
|
|
}, [facilityWaterQltyYearList]);
|
|
|
|
const yesterDay = new Date();
|
|
yesterDay.setDate(yesterDay.getDate() - 1);
|
|
const yesterDayStr = yesterDay.toISOString().split('T')[0];
|
|
|
|
const ref = useRef<ReturnType<FacilityWaterQltyProps>>({
|
|
startDate: new Date(),
|
|
endDate: new Date(),
|
|
tabName: '',
|
|
filteredList: [],
|
|
});
|
|
|
|
const filterData = useCallback((returnType: ReturnType<FacilityWaterQltyProps>) => {
|
|
const filteredData = setFilterAfterData(returnType.filteredList);
|
|
setCopyYearList(filteredData as FacilityWaterQltyProps[]);
|
|
}, []);
|
|
|
|
const excelDownload = () => {
|
|
const excelDownList: modalExcelType[] = [];
|
|
if(copyYearList.length > 0){
|
|
copyYearList.forEach((item) => {
|
|
excelDownList.push({
|
|
날짜: item.msrDt,
|
|
"유입BOD(mg/L)": item.inflAssctBfrWqltBod,
|
|
"유입TOC(COD)(mg/L)": item.inflAssctBfrWqltToc,
|
|
"유입SS(mg/L)": item.inflAssctBfrWqltSs,
|
|
"유입TN(mg/L)": item.inflAssctBfrWqltTn,
|
|
"유입TP(mg/L)": item.inflAssctBfrWqltTp,
|
|
"유출BOD(mg/L)": item.efflWqltBod,
|
|
"유출TOC(COD)(mg/L)": item.efflWqltToc,
|
|
"유출SS(mg/L)": item.efflWqltSs,
|
|
"유출TN(mg/L)": item.efflWqltTn,
|
|
"유출TP(mg/L)": item.efflWqltTp,
|
|
/* "강우량(mm/일)": item.infoRnDay?item.infoRnDay.toString():"0.0", */
|
|
});
|
|
});
|
|
}
|
|
if (excelDownList && excelDownList.length > 0) {
|
|
downloadExcel({ data: JSON.parse(JSON.stringify(excelDownList)), fileName: searchYear+'년 '+fcltyName + ' 수질현황', sheetNameArray: [fcltyName + ' 수질현황'], headerRange: 'A1:K1' });
|
|
} else if (prevExcelListRef.current && prevExcelListRef.current.length > 0) {
|
|
alert('다운받을 데이터가 없습니다.');
|
|
}
|
|
prevExcelListRef.current = excelDownList;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<UITab tabList={tabList1} defaultValue="tab_num1">
|
|
<Button className={btnClass} style={{float: 'right'}} color="green" onClick={excelDownload}>
|
|
{"엑셀다운로드"}
|
|
</Button>
|
|
{/* 처리시설 수질현황 */}
|
|
<TabsContent value="tab_num1">
|
|
<UITab tabList={tabList2} defaultValue="tab_term_year">
|
|
<TabsContent value="tab_term_year">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={facilityWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName={"tab_term_year"}
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[350px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalYear}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[310px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalYear} layoutNum={3} />
|
|
</UiTable>
|
|
</div>
|
|
<div className="card-header">
|
|
<h3 className="text-2xl font-medium text-label">수질 TMS</h3>
|
|
{/*<h3 className="text-2xl font-medium text-label text-right">({msrmtDate?msrmtDate.substring(0,4)+'-'+msrmtDate.substring(4,6)+'-'+msrmtDate.substring(6,8):yesterDayStr})</h3> */}
|
|
</div>
|
|
<div className="overflow-y-auto h-[250px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={tmsList}
|
|
headlist={upHeadListModalTms}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalTms} layoutNum={4} />
|
|
</UiTable>
|
|
{msrmtDate != yesterDayStr?.replaceAll('-','')?<h3 className="text-2xl text-left text-gray-500">※전날 데이터 결측으로 인해 가장 최근 데이터 표출함</h3> : ''}
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_summer">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={facilityWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_summer"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalYear}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => { } }
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalYear} layoutNum={3} />
|
|
</UiTable>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_winter">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={facilityWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_winter"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalYear}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalYear} layoutNum={3} />
|
|
</UiTable>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_chuncheon">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={facilityWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_chuncheon"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalYear}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalYear} layoutNum={3} />
|
|
</UiTable>
|
|
</div>
|
|
<div className="mt-14">
|
|
<span className="text-2xl font-bold text-gray-500">☞ 청천시 : 강우량이 3mm미만의 날</span>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_rain">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={facilityWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_rain"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalYear}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalYear} layoutNum={3} />
|
|
</UiTable>
|
|
</div>
|
|
<div className="mt-14">
|
|
<span className="text-2xl font-bold text-gray-500">☞ 강우량 3mm 이상만 날과 강우영향일(강우일+2일)의 날</span>
|
|
</div>
|
|
</TabsContent>
|
|
</UITab>
|
|
</TabsContent>
|
|
|
|
{/* 총인설비 수질현황 */}
|
|
<TabsContent value="tab_num2">
|
|
<UITab tabList={tabList3} defaultValue="tab_term_year_chongin">
|
|
<TabsContent value="tab_term_year_chongin">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={chongInWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_year"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalChongIn}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalChongIn} layoutNum={5} />
|
|
</UiTable>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_summer_chongin">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={chongInWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_summer"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalChongIn}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalChongIn} layoutNum={5} />
|
|
</UiTable>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="tab_term_winter_chongin">
|
|
<FacilityTermModalHeader<FacilityWaterQltyProps>
|
|
searchList={chongInWaterQltyYearList}
|
|
fcltyCd={facilityCd}
|
|
fcltyName={fcltyName}
|
|
tabName="tab_term_winter"
|
|
searchYear={searchYear}
|
|
ref={ref}
|
|
queryClick={filterData}
|
|
/>
|
|
<div className="overflow-y-auto h-[550px]">
|
|
<UiTable
|
|
headName={undefined}
|
|
tableData={copyYearList}
|
|
headlist={upHeadListModalChongIn}
|
|
pageSize={0}
|
|
total={0}
|
|
cellClick={undefined}
|
|
onPageChange={() => {}}
|
|
className="h-[500px]"
|
|
boldArray={[0,1,2]}
|
|
>
|
|
<HeadMakeColSpan upHeadList={upHeadListModalChongIn} layoutNum={5} />
|
|
</UiTable>
|
|
</div>
|
|
</TabsContent>
|
|
</UITab>
|
|
</TabsContent>
|
|
</UITab>
|
|
</>
|
|
);
|
|
} |