diff --git a/apps/wr/app/ruseFcltMng/fcltReg/pbnstReg/page.tsx b/apps/wr/app/ruseFcltMng/fcltReg/pbnstReg/page.tsx index afa4f77a2..8cae406f3 100644 --- a/apps/wr/app/ruseFcltMng/fcltReg/pbnstReg/page.tsx +++ b/apps/wr/app/ruseFcltMng/fcltReg/pbnstReg/page.tsx @@ -10,14 +10,18 @@ import { useWrStore } from "../../../store"; import { PbnstBuseForm } from "@/components/ui/form/fcltReg/pbnstReg/buseReg/component"; import { Tabs, TabsList, TabsTrigger, TabsContent } from "@common/components"; import { PbnstMngForm} from "@/components/ui/form/fcltReg/pbnstReg/mngReg/component"; -import { useState } from "react"; +import { useEffect, useState } from "react"; +import type { ruseFcltType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg"; export default function PublicReuseFaciltyInsert() { - const { pubFac } = useWrStore((state) => state); + const { pubFac , pubMng,mngMainValue} = useWrStore((state) => state); const { pubFacHeadList, publicReuseFacilityData } = pubFac; + const { ruseFclt } = pubMng; + + const [currentTab, setCurrentTab] = useState('mng'); + const [fcltMng, setFcltMng] = useState(); - const [swtrmtFcltFk, setSwtrmtFcltFk] = useState() const searchDiv = "하수재이용시설 "; const selectBox = [ { text: "서울하수처리시설", val: "1_hasu" }, @@ -31,10 +35,20 @@ export default function PublicReuseFaciltyInsert() { console.log(val); }; const cellClick=(val:number)=>{ + let data + if(publicReuseFacilityData[val]) { + data =ruseFclt.filter((item)=> item.swtrmtFcltFk===publicReuseFacilityData[val]?.swtrmtFcltFk) + setFcltMng(data); - if(publicReuseFacilityData[val])setSwtrmtFcltFk(publicReuseFacilityData[val]?.swtrmtFcltFk) - + } } +const resetContents = () => { + setFcltMng([]); // 빈 배열로 설정하여 신규 모드로 전환 + }; + + const handleTabChange = (value: string) => { + setCurrentTab(value); + }; return ( <> @@ -71,15 +85,22 @@ export default function PublicReuseFaciltyInsert() {
- - - - 운영정보 - 시설현황 - - + + +
+ + 운영정보 + 시설현황 + + +
+ - + diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx index d589e7ab9..72a83b81a 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx @@ -24,7 +24,7 @@ export type publicReuseFacilityType = { register?: string; swtrmtFcltFk: string; }; -type fcltOperInfoType = { +export type fcltOperInfoType = { mng: string; subCo: string; startDay: string; @@ -32,12 +32,14 @@ type fcltOperInfoType = { pbnstRuseFcltPk: string; }; -type ruseFcltType = { +export type ruseFcltType = { swtrmtFcltFk: string; pbnstRuseFcltPk:string; fcltNm:string; fcltCpct: number; swtrmtCpct: number; + ruseCpct:number; + splyExtraCpct:number; }; const selectLabel: selectLabel[] = [{ text: "test", val: "1" }]; @@ -53,11 +55,11 @@ const pubFacHeadList: TableProps[] = [ ]; const ruseFclt: ruseFcltType[] = [ - { swtrmtFcltFk: "a", fcltCpct: 1000000, swtrmtCpct: 1000000 ,pbnstRuseFcltPk:'aa',fcltNm:'하수1'}, - { swtrmtFcltFk: "a", fcltCpct: 1300000, swtrmtCpct: 1300000 ,pbnstRuseFcltPk:'ab',fcltNm:'하수2'}, + { swtrmtFcltFk: "a", fcltCpct: 1000000, swtrmtCpct: 1000000 ,pbnstRuseFcltPk:'aa',fcltNm:'하수1',ruseCpct: 1, splyExtraCpct: 2 }, + { swtrmtFcltFk: "a", fcltCpct: 1300000, swtrmtCpct: 1300000 ,pbnstRuseFcltPk:'ab',fcltNm:'하수2',ruseCpct: 3, splyExtraCpct: 4 }, - { swtrmtFcltFk: "b", fcltCpct: 2000000, swtrmtCpct: 2000000 ,pbnstRuseFcltPk:'bb',fcltNm:'재이용1'}, - { swtrmtFcltFk: "b", fcltCpct: 2300000, swtrmtCpct: 2300000 ,pbnstRuseFcltPk:'ba',fcltNm:'재이용2'}, + { swtrmtFcltFk: "b", fcltCpct: 2000000, swtrmtCpct: 2000000 ,pbnstRuseFcltPk:'bb',fcltNm:'재이용1',ruseCpct: 1, splyExtraCpct: 2 }, + { swtrmtFcltFk: "b", fcltCpct: 2300000, swtrmtCpct: 2300000 ,pbnstRuseFcltPk:'ba',fcltNm:'재이용2' ,ruseCpct: 3, splyExtraCpct: 4 }, ]; const pubMngUpHeadList: TableUpperProps[] = [ { id: "mng", title: "운영방식" }, @@ -173,6 +175,8 @@ export type pubFacState = { rprcsCd: selectLabel[]; buseMet: selectLabel[]; rprcLoCd: selectLabel[]; + + ruseFclt:ruseFcltType[]; }; pubMng:{ //isInit:boolean; @@ -202,6 +206,7 @@ export const pubFacStateExport: pubFacState = { rprcsCd: rprcsCd, buseMet: buseMet, rprcLoCd: rprcLoCd, + ruseFclt:ruseFclt, }, pubMng:{ // isInit: false, @@ -229,7 +234,11 @@ export const pubFacActionsExport: (set: any) => pubFacActions = (set: any) => { pubMng:{ ...state.pubMng, - ruseFclt:state.pubMng.ruseFclt.filter((item)=>item.swtrmtFcltFk===swtrmtFcltFk) + ruseFclt:state.pubMng.ruseFclt.filter((item)=> + + item.swtrmtFcltFk===swtrmtFcltFk + + ) } } }), diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/component.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/component.tsx index 7fab0087e..41977cc83 100644 --- a/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/component.tsx @@ -32,7 +32,7 @@ const formSchema = z.object({ } export function PbnstBuseForm() { const { pubFac } = useWrStore((state) => state); - const { pubMngUpHeadList, pubMngFacData,erctUswtrCd,cyclCd,seCd,buseCd,rprcsCd,buseMet,rprcLoCd} = pubFac; + const { pubMngUpHeadList, erctUswtrCd,cyclCd,seCd,buseCd,rprcsCd,buseMet,rprcLoCd} = pubFac; const nodeList = headMakeColSpan(pubMngUpHeadList); diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/component.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/component.tsx index dd15691ba..a493a7981 100644 --- a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/component.tsx @@ -2,7 +2,6 @@ import { SelectBox } from "@common/business_components"; import { - DatePicker, FileUpload, FormUi, UiTable, @@ -18,74 +17,67 @@ import { selectClass, type TableUpperProps, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; +import type { fcltOperInfoType, ruseFcltType } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg"; -interface mainData { - swtrmtFcltFk: string; -} +const formSchema = z.object({ + fcltNm: z.string().min(2).max(50), + psysScdg: z.string(), + designScdg: z.string(), + fcltCpct: z.number(), + swtrmtCpct: z.number(), + ruseCpct: z.number(), + splyExtraCpct: z.number(), +}); -export function PbnstMngForm(swtrmtFcltFk: mainData) { - const { pubFac, pubMng, mngMainValue, mngTableValue } = useWrStore((state) => state); + + +export function PbnstMngForm({ data }: { data: ruseFcltType[] }) { + const { pubFac, pubMng } = useWrStore((state) => state); const { pubMngUpHeadList, isInit } = pubFac; - const { fcltOperInfo, ruseFclt } = pubMng; - const [fcltSwtrm, setFcltSwtrm] = useState({ - text: "", - val: "", - fcltCpct: 0, - swtrmtCpct: 0, - }); - - const fcltNmArr = ruseFclt.map((item) => ({ - text: item.fcltNm, - val: item.pbnstRuseFcltPk, - })); - - useEffect(() => { - const cell = swtrmtFcltFk; - const ruseFcltData = ruseFclt.find( - (el) => el.swtrmtFcltFk === cell?.swtrmtFcltFk - ); - if (ruseFcltData !== undefined) - setFcltSwtrm({ - text: ruseFcltData.fcltNm, - val: ruseFcltData.pbnstRuseFcltPk, - fcltCpct: ruseFcltData.fcltCpct, - swtrmtCpct: ruseFcltData.swtrmtCpct, - }); - else setFcltSwtrm({ text: "", val: "", fcltCpct: 0, swtrmtCpct: 0 }); - }, [swtrmtFcltFk]); - - const formSchema = z.object({ - fcltNm: z.string().min(2).max(50), - psysScdg: z.string(), - designScdg: z.string(), - fcltCpct: z.number(), - swtrmtCpct: z.number(), - ruseCpct: z.number(), - splyExtraCpct: z.number(), - }); + const { fcltOperInfo } = pubMng; + const [ruseOperData, setRuseOperData] = useState(); + const [files, setFiles] = useState(null); const form = useForm>({ resolver: zodResolver(formSchema), defaultValues: { - fcltNm: "", - psysScdg: "", - designScdg: "", + fcltNm: '', + psysScdg: '', + designScdg: '', fcltCpct: 0, swtrmtCpct: 0, ruseCpct: 0, splyExtraCpct: 0, }, }); + + const selectOptions = data?.map((item) => ({text: item.fcltNm, val: item.pbnstRuseFcltPk})) || [{text:'없음', val:'1'}]; + const onSelectValue = (val: string) => { + const selectedData = data?.find((item) => item.pbnstRuseFcltPk === val); + if (selectedData) { + form.reset(selectedData); + setRuseOperData(fcltOperInfo.filter((item) => item.pbnstRuseFcltPk === val)); + } + }; + + const newReuseFclt = () => { + form.reset(); + setRuseOperData([{}] as fcltOperInfoType[]); + }; + + useEffect(() => { + if (isInit) { + form.reset(); + setRuseOperData([{}] as fcltOperInfoType[]); + } + }, [isInit]); + + // 2. Define a submit handler. function onSubmit(values: z.infer) { console.log(values); } - const onSelectValue = (val: string) => { - console.log(val); - mngTableValue(val); - }; - const headMakeColSpan = (upHeadList: TableUpperProps[]) => { return ( <> @@ -112,10 +104,7 @@ export function PbnstMngForm(swtrmtFcltFk: mainData) { ); }; - const nodeList = headMakeColSpan(pubMngUpHeadList); - const newReuseFclt = () => {}; - const [files, setFiles] = useState(null); return (
@@ -130,23 +119,23 @@ export function PbnstMngForm(swtrmtFcltFk: mainData) { name="fcltNm" render={({ field }) => ( - + {data.length === 0 ? ( + + ) : ( + + )} )} />
-
-
+ > )} /> @@ -173,7 +162,7 @@ export function PbnstMngForm(swtrmtFcltFk: mainData) { files={files} setFiles={setFiles} fileTypes="PDF" - /> + > )} /> @@ -182,11 +171,11 @@ export function PbnstMngForm(swtrmtFcltFk: mainData) {

○ 재이용시설 운영정보

- +
-

○ 재이용수 공급 가능량

@@ -206,34 +194,22 @@ export function PbnstMngForm(swtrmtFcltFk: mainData) { name="fcltCpct" render={({ field }) => ( - + )} />
-
( - + )} />
-