110 lines
3.7 KiB
TypeScript
110 lines
3.7 KiB
TypeScript
import { useWrStore } from "@/app/store";
|
|
import { btnClass } from "@/app/store/common/code";
|
|
import { pbnMapTableSize } from "@/app/store/map/pbnstMap";
|
|
import type { pubHasuType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type";
|
|
import { tableData } from "@/components/lib/func/commom";
|
|
import {
|
|
ContentsDiv,
|
|
SearchBaseForm,
|
|
SearchInput,
|
|
Title,
|
|
UiTable,
|
|
type ReturnType,
|
|
} from "@common/business_components/ui";
|
|
import { Label } from "@common/components/ui";
|
|
import { useEffect, useRef, useState } from "react";
|
|
|
|
export function HasuFacility({rtnFeature}:{rtnFeature:(feature:any)=>void } ) {
|
|
const { code, pbnMap, pbnMapInit } = useWrStore((state) => state);
|
|
const [hasuTable, setHasuTable] = useState<pubHasuType[]>();
|
|
const [isReset, setIsReset] = useState(false);
|
|
const [pbnRuseNm, setPbnRuseNm] = useState<string>("");
|
|
const ref = useRef<ReturnType>({} as ReturnType);
|
|
const { pbnMapHeadList, pbnMapRes, pbnMapCount } = pbnMap;
|
|
|
|
useEffect(() => {
|
|
if (!pbnMap.isInit) {
|
|
pbnMapInit(1, pbnMapTableSize, ref.current);
|
|
}
|
|
}, [pbnMap.isInit, pbnMapInit]);
|
|
|
|
useEffect(() => {
|
|
if (code.sggCd.length && pbnMapRes.length > 0) {
|
|
setHasuTable(tableData(pbnMapRes, { code }));
|
|
}
|
|
}, [code, pbnMapRes]);
|
|
|
|
const hasuCellClick = (index: number | undefined) => {
|
|
if (index !== undefined && pbnMapRes !== undefined) {
|
|
rtnFeature(pbnMapRes[index])
|
|
}
|
|
};
|
|
return (
|
|
<>
|
|
<ContentsDiv>
|
|
<div className="grid grid-cols-2 gap-4 ">
|
|
<div className="col-span-2">
|
|
<Title title="하수처리시설 현황" />
|
|
<SearchBaseForm
|
|
selectSidoData={code.cityCd}
|
|
selectSigunData={code.sggCd}
|
|
selectRegionData={code.rvbsnCd}
|
|
selectUnitWaterShedData={code.lgbsnCd}
|
|
selectMiddleRegionData={code.mdmbsnCd}
|
|
selectEnvPartData={code.lclgvrnmntCd}
|
|
buttonOrder={["query", "init", "excel"]}
|
|
rightClassName="ml-auto mr-6 flex items-center space-x-1"
|
|
leftClassName="flex gap-5 w-9/12 m-4"
|
|
leftSelectClassName="w-1/4"
|
|
rightChildren={<></>}
|
|
leftChildren={
|
|
<div className="col-span-3 flex items-center">
|
|
<Label className="w-full mt-2 ml-4 text-xl text-gray-600">
|
|
{"하수처리시설명"}
|
|
</Label>
|
|
<SearchInput
|
|
className={"text-2xl w-full"}
|
|
label=""
|
|
textValue={pbnRuseNm || ""}
|
|
setText={(e) => {
|
|
setPbnRuseNm(e || "");
|
|
}}
|
|
/>
|
|
</div>
|
|
}
|
|
queryClick={() => {
|
|
setIsReset(true);
|
|
}}
|
|
initClick={function (): void {
|
|
setPbnRuseNm("");
|
|
}}
|
|
btnClass={btnClass}
|
|
ref={ref}
|
|
isAdmin={false}
|
|
excelClick={function (returnType: ReturnType): void {
|
|
console.log("pbnstSttnSearch ", returnType);
|
|
}}
|
|
/>
|
|
</div>
|
|
<div className="col-span-6">
|
|
{/* 높이 조정 */}
|
|
<UiTable
|
|
tableData={hasuTable || []}
|
|
headlist={pbnMapHeadList}
|
|
pageSize={pbnMapTableSize}
|
|
total={pbnMapCount || 0}
|
|
headName={""}
|
|
cellClick={hasuCellClick}
|
|
onPageChange={(page) => {
|
|
pbnMapInit(page, pbnMapTableSize, ref.current);
|
|
setIsReset(false);
|
|
}}
|
|
resetPageNo={isReset}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</ContentsDiv>
|
|
</>
|
|
);
|
|
}
|