From a764bde89949bba57514e73d979c9961a323c53f Mon Sep 17 00:00:00 2001 From: YangJinSoo94 Date: Thu, 27 Mar 2025 16:34:41 +0900 Subject: [PATCH 01/11] =?UTF-8?q?modal=20=EC=88=98=EC=A0=95=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/ui/alert_dialog_ui/index.tsx | 71 ++++++++++++------- 1 file changed, 45 insertions(+), 26 deletions(-) diff --git a/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx b/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx index 58b69cff6..27c67458d 100644 --- a/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx +++ b/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx @@ -1,33 +1,52 @@ -import { Button, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components"; +import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components"; - -type ModalType={ - bodyClass:string - butNm:string - title:string - body:React.ReactNode +type ModalType = { + bodyClass: string; + butNm: string; + title: string; + body: React.ReactNode; + open?: boolean; + onOpenChange?: (open: boolean) => void; } -export function UiModal({bodyClass,butNm,title ,body}:ModalType ) { + +export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: ModalType) { + const dialogProps = open !== undefined && onOpenChange !== undefined + ? { open, onOpenChange } + : {}; + return ( <> - - - - - - - {title} - - - - {body} - - - - - - - + {!open && ( + + + + + + + {title} + + + + {body} + + + + + )} + {open && ( + + + + {title} + + + + {body} + + + + + )} ); } From 2919d7d637fb983c58b5e3cf47f4257320ba763e Mon Sep 17 00:00:00 2001 From: YangJinSoo94 Date: Thu, 27 Mar 2025 16:36:41 +0900 Subject: [PATCH 02/11] =?UTF-8?q?alert=20dialog=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/ui/alert_dialog_ui/index.tsx | 53 +++++++++++++++++++ 1 file changed, 53 insertions(+) create mode 100644 packages/common/business_components/src/ui/alert_dialog_ui/index.tsx diff --git a/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx b/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx new file mode 100644 index 000000000..8437c87a8 --- /dev/null +++ b/packages/common/business_components/src/ui/alert_dialog_ui/index.tsx @@ -0,0 +1,53 @@ +import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components"; +import React from "react"; + +type ModalType = { + bodyClass: string; + butNm: string; + title: string; + body: React.ReactNode; + open?: boolean; + onOpenChange?: (open: boolean) => void; +} + +export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: ModalType) { + const dialogProps = open !== undefined && onOpenChange !== undefined + ? { open, onOpenChange } + : {}; + + return ( + <> + {!open && ( + + + + + + + {title} + + + + {body} + + + + + )} + {open && ( + + + + {title} + + + + {body} + + + + + )} + + ); +} From fa9f97122680712c7b1fdbbca541cec1fefe3d8d Mon Sep 17 00:00:00 2001 From: YangJinSoo94 Date: Fri, 28 Mar 2025 11:34:08 +0900 Subject: [PATCH 03/11] =?UTF-8?q?dialog=20=EC=83=81=EB=8B=A8=20=EC=A0=9C?= =?UTF-8?q?=EB=AA=A9=20=EC=97=86=EC=9C=BC=EB=A9=B4=20=EC=A0=9C=EB=AA=A9?= =?UTF-8?q?=EC=97=86=EC=9D=B4=20=EB=AA=A8=EB=8B=AC=20=EC=B6=9C=EB=A0=A5?= =?UTF-8?q?=EB=90=98=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../business_components/src/ui/dialog_ui/index.tsx | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/packages/common/business_components/src/ui/dialog_ui/index.tsx b/packages/common/business_components/src/ui/dialog_ui/index.tsx index 27c67458d..7609e2908 100644 --- a/packages/common/business_components/src/ui/dialog_ui/index.tsx +++ b/packages/common/business_components/src/ui/dialog_ui/index.tsx @@ -1,17 +1,17 @@ -import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@common/components"; +import { Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTrigger } from "@common/components"; type ModalType = { bodyClass: string; butNm: string; - title: string; + title: string | undefined; body: React.ReactNode; open?: boolean; onOpenChange?: (open: boolean) => void; } export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: ModalType) { - const dialogProps = open !== undefined && onOpenChange !== undefined - ? { open, onOpenChange } + const dialogProps = open !== undefined && onOpenChange !== undefined && title !== undefined + ? { open, onOpenChange, title } : {}; return ( @@ -23,7 +23,6 @@ export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: M - {title} @@ -37,7 +36,6 @@ export function UiModal({ bodyClass, butNm, title, body, open, onOpenChange }: M - {title} From ca30fc9a331d48dac831c1611f3fc2364a563d1d Mon Sep 17 00:00:00 2001 From: leedj312 Date: Fri, 28 Mar 2025 18:00:56 +0900 Subject: [PATCH 04/11] =?UTF-8?q?=EA=B1=B4=EC=B6=95=EB=AC=BC=20=EB=93=B1?= =?UTF-8?q?=EB=A1=9D=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EA=B0=9C=EB=B0=9C?= =?UTF-8?q?=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ruseFcltMng/fcltReg/bdstReg/index.tsx | 88 +++++++++++++++++++ apps/wr/app/store/store.tsx | 9 +- .../ui/form/fcltReg/bdstReg/component.tsx | 84 +++++++++++++++++- .../ui/form/fcltReg/rainReg/component.tsx | 2 +- .../components/ui/modal/bdstReg/component.tsx | 69 ++++++++++----- 5 files changed, 225 insertions(+), 27 deletions(-) create mode 100644 apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx new file mode 100644 index 000000000..966d415b3 --- /dev/null +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx @@ -0,0 +1,88 @@ +import { getFectch } from "@/components/lib/api"; + +type bdstType={ + bdstInfoPk: number, + ctpvCd: number, + sggCd: number, + daddr: string, + bdstNm: string, + frstArchPrmsnDt: string, + archArea : number +} + + +type TableUpperProps = { + id: string; + title: string; + upName?: string; + upSequnce?: number; + }; + const moUpHeadList: TableUpperProps[] = [ + { id: "cityText", title: "시도" }, + { id: "sggText", title: "시군구" }, + { id: "bdstNm", title: "시설명" }, + { id: "daddr", title: "위치" }, + { id: "frstArchPrmsnDt", title: "최초건축허가일" }, + { id: "archArea", title: "건축면적", }, + { id: "archChgYn", title: "여부", upName: "upChangeRe", upSequnce: 1 }, + { id: "archChgPrmsnDt", title: "허가일", upName: "upChangeRe", upSequnce: 2 }, + { id: "archChgArea", title: "면적", upName: "upChangeRe", upSequnce: 3 }, + ]; + +const bdstBase: bdstType[] = []; + +export type bdstFulType = bdstState & bdstActions; + + +export type bdstState = { + bdst: { + bdstBase: bdstType[]; + moUpHeadList:TableUpperProps[] + }; +}; + +type bdstActions = { + findBdst: (val: string) => Promise; + }; + + + +export const bdstStateExport: bdstState = { + bdst: { + bdstBase: bdstBase, // Updated to match the array type + moUpHeadList:moUpHeadList, + }, +}; + + + + + + + +export const bdstActionsExport: (set: any) => bdstActions = ( + set: any +) => { + return { + findBdst: async(val:string) =>{ + try { + console.log(" val ", val); + // (val!=='' ?"/"+val:'') + const res = await getFectch('wr', "/reuseFc/building/42" +(val!=='' ?"/"+val:'')); + console.log("res ", res) + // 여기서 상태 업데이트 + return set((state: bdstState) => ({ + bdst: { + ...state.bdst, + bdstBase:res, + } + })); + } catch (error) { + console.log('error', error); + } finally { + console.log('finally'); + } + }, + + }; +}; diff --git a/apps/wr/app/store/store.tsx b/apps/wr/app/store/store.tsx index 4a94a03fa..91f795ea4 100644 --- a/apps/wr/app/store/store.tsx +++ b/apps/wr/app/store/store.tsx @@ -30,26 +30,30 @@ import { type htdflFacType, } from "./ruseFcltMng/fcltReg/htdflReg"; import { codeActionExport, comCodeStateExport, getCityCd, getSggCd, type comCodeState, type comCodeType } from "./common/code"; +import { bdstActionsExport, bdstStateExport, type bdstFulType, type bdstState } from "./ruseFcltMng/fcltReg/bdstReg"; export type WrStore = comCodeType& pubFacType & rainFacType & rswtFacType & matDmdType & - htdflFacType; + htdflFacType& + bdstFulType; export const StoreZus = ( initState: comCodeState& rainFacState & pubFacState & rswtFacState & matDmdState & - htdflFacState = { + htdflFacState & + bdstState= { ...comCodeStateExport, ...pubFacStateExport, ...rainFacStateExport, ...rswtFacStateExport, ...matDmdStateExport, ...htdflFacStateExport, + ...bdstStateExport, } ) => { return createStore()((set) => { @@ -63,6 +67,7 @@ export const StoreZus = ( ...matDmdActionsExport(set), ...htdflFacActionsExport(set), ...codeActionExport(set), + ...bdstActionsExport(set) }; }); }; diff --git a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx index 0a13b41fa..2cafa0973 100644 --- a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx @@ -2,12 +2,32 @@ import { useWrStore } from "@/app/store"; import { selectClass } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { FormField, FormUi, SelectBox } from "@common/business_components"; import { Button, Input } from "@common/components"; +import { useFieldArray } from "react-hook-form"; export default function BdstReg(form: any) { const { code } = useWrStore((state) => { return state; }); + const { fields, append, remove } = useFieldArray({ + control: form.control, + name: "history" + }); + + const plusHist = () => { + append({ + bdstNm: '', + daddr: '', + bdstUsgCd: '' + }); + }; + + const removeLastItem = () => { + if (fields.length > 0) { + remove(fields.length - 1); + } + }; + return ( <> @@ -165,10 +185,68 @@ export default function BdstReg(form: any) {

중축, 개축, 증축

-
- +
+ +
-
+ + {fields.map((field, index) => ( +
+
+ ( + + { + field.onChange(val); + }} + value={field.value} + /> + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ ))} +
); } diff --git a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx index 98d0e28a9..088c7fd43 100644 --- a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx @@ -27,7 +27,6 @@ export function RainRegForm({ data: rainRuseBd[]; isModal: boolean; }) { - console.log(isModal); const formSchema = isModal ? z.object({ ...rainZod, ...bdstZod }) : z.object(rainZod); @@ -35,6 +34,7 @@ export function RainRegForm({ const { rain, code } = useWrStore((state) => state); const { rainFcltCd } = code; useEffect(() => { + // console.log( " data ", data) if (data && data.length > 0) { console.log(data); const selectedOption = rainFcltCd.find( diff --git a/apps/wr/components/ui/modal/bdstReg/component.tsx b/apps/wr/components/ui/modal/bdstReg/component.tsx index d2693cd35..9fbfd4333 100644 --- a/apps/wr/components/ui/modal/bdstReg/component.tsx +++ b/apps/wr/components/ui/modal/bdstReg/component.tsx @@ -4,6 +4,7 @@ import { useWrStore } from "@/app/store"; import { selectClass, type bdstType, + type selectArray, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { ScrollArea, SearchInput, SelectBox, UiTable } from "@common/business_components"; import { Button, Input } from "@common/components"; @@ -11,41 +12,69 @@ import { useEffect, useState } from "react"; import { RainRegForm } from "../../form/fcltReg/rainReg/component"; export function BdstReg() { - const { rain, code, init } = useWrStore((state) => { + const { rain, code, bdst, findBdst } = useWrStore((state) => { return state; }); const [bdstTable, setbdstTable] = useState(); - const [rainBdstForm, setRainBdstForm] = useState<[]>(); + const [rainBdstForm, setRainBdstForm] = useState(); const { bdstObj, rainRuseObj } = rain; - const getCity = (val: string | number) => { - console.log(val); + const [selectSgg, setSelectSgg] = useState() + const [searchTxt, setSearchTxt] = useState() + + const getCity = (val: string ) => { + + + const data = code.sggCd + .filter((item) => String(item.val).substring(0, 2) === val) + .map((item) => ({ ...item, val: String(item.val) })); // Ensure 'val' is a string + setSelectSgg(data); }; const getSgg = (val: string | number) => { console.log(val); }; + + + useEffect(()=>{ + + // console.log("searchTxt ", searchTxt) + findBdst(searchTxt) + },[searchTxt]) + useEffect(() => { if (code.sggCd.length > 0) { - const table = bdstObj.map((item) => { + const table = bdst?.bdstBase?.map((item) => { const sggText = code.sggCd.find( - (cd) => cd.val.toString() === item.sggCd + (cd) => cd.val === Number(item.sggCd) )?.text; const cityText = code.cityCd.find( - (cd) => cd.val.toString() === item.ctpvCd + (cd) => cd.val === Number(item.ctpvCd) )?.text; return { ...item, sggText: sggText, cityText: cityText }; }); + + setbdstTable(table); } - }, [code, bdstObj]); + }, [code, bdst]); - const cellClick = () => {}; - const nodeList = headMakeColSpan(rain.upHeadList); + const tableClick: (val: number | undefined) => void = (val) => { + + console.log("val , " ,val) + console.log("bdst , " ,bdst?.bdstBase[val]) + if(val!==undefined && bdst?.bdstBase.length>0){ + const data =bdst?.bdstBase[val] + console.log("data ", [data]) + setRainBdstForm([data]); + } + } + + const nodeList = headMakeColSpan(bdst.moUpHeadList); return ( <> -
+
{" "} @@ -67,33 +96,31 @@ export function BdstReg() {
+
{nodeList}
-
- +
-
); From 554ad2c5a893fde561e65e91003d1d2efa71f99c Mon Sep 17 00:00:00 2001 From: leedj312 Date: Fri, 28 Mar 2025 18:02:13 +0900 Subject: [PATCH 05/11] =?UTF-8?q?searInput=20=EC=98=A4=EB=A5=98=20?= =?UTF-8?q?=EC=9D=BC=EB=8B=A8=20=EC=88=98=EC=A0=95=20=EB=B0=8F=20=ED=85=8C?= =?UTF-8?q?=EC=9D=B4=EB=B8=94=20=ED=97=A4=EB=8D=94=20=3F=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/ui/search_input/index.tsx | 19 ++++++++++++++++--- .../src/ui/table/index.tsx | 2 +- 2 files changed, 17 insertions(+), 4 deletions(-) diff --git a/packages/common/business_components/src/ui/search_input/index.tsx b/packages/common/business_components/src/ui/search_input/index.tsx index 0da6cffdc..bd634aa21 100644 --- a/packages/common/business_components/src/ui/search_input/index.tsx +++ b/packages/common/business_components/src/ui/search_input/index.tsx @@ -3,13 +3,26 @@ import React from "react"; const SearchInput = React.forwardRefvoid}>(({className, label, textValue, setText}, ref) => { const changeText=(e:React.ChangeEvent)=>{ - if(e?.target?.value) setText(e.target.value) - } + + if(e?.target?.value){ + + setText(e.target.value) + } + + + + } + + const keyUp=(e:any)=>{ + if(e.keyCode===8 && e.target.value.length==1){ + setText('') + } + } return (
{label && } - +
) }); diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx index b8c2706bc..9635a7e21 100644 --- a/packages/common/business_components/src/ui/table/index.tsx +++ b/packages/common/business_components/src/ui/table/index.tsx @@ -36,7 +36,7 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa {tableData?.map((el: { [key: string]: string | number | boolean }, index) => ( - {headlist.map((head) => ( + {headlist?.map((head) => ( cellClick && cellClick(index)} key={head.id + index}>{el[head.id]} ))} From 5afc8da9a8022ccdaf34261dff99842d3bdf333b Mon Sep 17 00:00:00 2001 From: YangJinSoo94 Date: Tue, 1 Apr 2025 11:23:46 +0900 Subject: [PATCH 06/11] =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EB=84=A4?= =?UTF-8?q?=EC=9D=B4=EC=85=98=20=EB=A6=AC=EC=8A=A4=ED=8A=B8=EA=B0=80=20?= =?UTF-8?q?=EB=A7=8E=EC=95=84=EB=8F=84=2010=EA=B0=9C=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=EB=84=98=EB=B2=84=EB=A1=9C=20=EB=8B=A4=EC=9D=8C,?= =?UTF-8?q?=EC=9D=B4=EC=A0=84=EC=9C=BC=EB=A1=9C=20=EB=84=98=EC=96=B4?= =?UTF-8?q?=EA=B0=80=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/ui/table/index.tsx | 112 +++++++++++------- 1 file changed, 70 insertions(+), 42 deletions(-) diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx index 9635a7e21..99199d163 100644 --- a/packages/common/business_components/src/ui/table/index.tsx +++ b/packages/common/business_components/src/ui/table/index.tsx @@ -1,50 +1,78 @@ -import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@common/components"; -import UiPageNations from "./uiPageNations"; +'use client'; -type UiTableProps = { - headName: React.ReactNode | undefined; - tableData: { [key: string]: string | number | boolean }[]; - headlist: UiHeadProps[]; - pageSize: number; +import { useEffect, useState } from "react"; +import { + Pagination, + PaginationContent, + PaginationItem, + PaginationPrevious, + PaginationLink, + PaginationNext +} from "./lib/pagination"; + +interface CommonPageNationsProps { total: number; - children: React.ReactNode | undefined; - cellClick : ((index:number|undefined)=>void) | undefined; + cur: number; + pageSize: number; } -type UiHeadProps = { - id: string; - title: string; -} +export default function UiPageNations(commonPageNationsProps: CommonPageNationsProps) { + const [pageProps, setPageProps] = useState(commonPageNationsProps); -export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick }: UiTableProps) { - const cur = 1; + useEffect(() => { + setPageProps(commonPageNationsProps); + }, [commonPageNationsProps]); + + const totalPages = Math.ceil(pageProps.total / pageProps.pageSize); + const pagesPerGroup = 10; + const currentGroup = Math.floor((pageProps.cur - 1) / pagesPerGroup); + const startPage = currentGroup * pagesPerGroup + 1; + const endPage = Math.min(startPage + pagesPerGroup - 1, totalPages); + + const handlePageChange = (page: number) => { + setPageProps({ ...pageProps, cur: page }); + }; return ( - <> - {headName ?
-

{headName}

-
: <>} -
- - - {children ? <>{children} : - {headlist?.map((head) => ( - {head.title} - ))} - } - - - {tableData?.map((el: { [key: string]: string | number | boolean }, index) => ( - - {headlist?.map((head) => ( - cellClick && cellClick(index)} key={head.id + index}>{el[head.id]} - ))} - - ))} - -
- {total <= 0 ? <> : } -
- + + + + {/* 이전 그룹으로 이동 */} + + { + if (startPage > 1) handlePageChange(startPage - 1); + }} + /> + + + {/* 현재 그룹 페이지들 표시 */} + { + Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i).map((pageNum) => ( + + handlePageChange(pageNum)} + > + {pageNum} + + + )) + } + + {/* 다음 그룹으로 이동 */} + + { + if (endPage < totalPages) handlePageChange(endPage + 1); + }} + /> + + + + ); -} +} \ No newline at end of file From b8d93f1b8b107ab308430fc30995e9028d9dab12 Mon Sep 17 00:00:00 2001 From: leedj312 Date: Tue, 1 Apr 2025 11:25:58 +0900 Subject: [PATCH 07/11] temp --- .../app/ruseFcltMng/fcltReg/rainReg/page.tsx | 27 ++- apps/wr/app/store/common/code/index.ts | 8 + .../ruseFcltMng/fcltReg/bdstReg/index.tsx | 17 -- .../ruseFcltMng/fcltReg/rainReg/index.tsx | 219 +++++++----------- .../lib/type/zod/fcltReg/controlZod.ts | 110 ++++++--- .../ui/form/fcltReg/bdstReg/component.tsx | 30 ++- .../ui/form/fcltReg/rainReg/component.tsx | 206 ++++++++++++---- .../components/ui/modal/bdstReg/component.tsx | 55 +++-- 8 files changed, 386 insertions(+), 286 deletions(-) diff --git a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx index 47c09d40c..d348a07d5 100644 --- a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx +++ b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx @@ -1,6 +1,6 @@ 'use client' import { useWrStore } from "@/app/store"; -import type { bdstType, rainRuseBd, TableUpperProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg" +import type { RainyInfoResponse, TableUpperProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg" import { RainRegForm } from "@/components/ui/form/fcltReg/rainReg/component"; import { BdstReg } from "@/components/ui/modal/bdstReg/component"; import { ContentsDiv, ScrollArea, SearchDiv, SearchFormLeft, SearchFormRight, SearchInput, Title, UiModal, UiTable } from "@common/business_components"; @@ -22,25 +22,26 @@ export const headMakeColSpan = (upHeadList: TableUpperProps[]) => { ) } export default function Home() { - const { rain, code,init } = useWrStore((state) => { + const { rain, code,init } = useWrStore((state) => { return state }); - const {bdstObj, rainRuseObj } =rain - const [rinBdstForm, setRinBdstForm] = useState (); - const [bdstTable, setbdstTable] = useState (); + const {bdstObj, rainRes } =rain + const [rainForm, setRainForm] = useState (); + const [bdstTable, setbdstTable] = useState (); const nodeList = headMakeColSpan(rain.upHeadList); - useEffect(() => { if (!rain.isInit) { + init(); } }, [rain.isInit,init]); useEffect ( () => { + if(code.sggCd.length>0){ - const table= bdstObj.map((item) => { + const table = rainRes.map((item) => { const sggText= code.sggCd.find((cd)=>cd.val.toString() === item.sggCd )?.text; const cityText= code.cityCd.find((cd)=>cd.val.toString() === item.ctpvCd )?.text; return( @@ -49,15 +50,13 @@ export default function Home() { cityText:cityText }) }) + setbdstTable(table) } -}, [code,bdstObj]); - const cellClick: (val: number | undefined) => void = (val) => { - - let data +}, [code,rainRes]); + const cellClick: (val: number ) => void = (val) => { if((bdstTable ?? []).length > 0) { - data =rainRuseObj.filter((item)=> item.bdstInfoFk===bdstTable?.[val]?.bdstInfoPk) - setRinBdstForm(data) + setRainForm(rainRes[val]) } } @@ -113,7 +112,7 @@ export default function Home() { diff --git a/apps/wr/app/store/common/code/index.ts b/apps/wr/app/store/common/code/index.ts index 2bc1784a3..dc92e0863 100644 --- a/apps/wr/app/store/common/code/index.ts +++ b/apps/wr/app/store/common/code/index.ts @@ -6,6 +6,12 @@ type selectArray = { val: string | number; }; +export const yn :selectArray[]=[ + {val:'Y', text:'Y'}, + {val:'N', text:'N'}, +] + + export const bdstUsgCd: selectArray[] = [ { val: 1, text: "운동장" }, { val: 2, text: "체육관" }, @@ -45,6 +51,7 @@ export type comCodeState = { bdstUsgCd: selectArray[]; cityCd: selectArray[]; sggCd: selectArray[]; + yn:selectArray[]; }; }; @@ -84,6 +91,7 @@ export const comCodeStateExport: comCodeState = { bdstUsgCd: bdstUsgCd, cityCd: [], sggCd: [], + yn:yn }, }; diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx index 966d415b3..20cf4cdb6 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx @@ -1,16 +1,5 @@ import { getFectch } from "@/components/lib/api"; -type bdstType={ - bdstInfoPk: number, - ctpvCd: number, - sggCd: number, - daddr: string, - bdstNm: string, - frstArchPrmsnDt: string, - archArea : number -} - - type TableUpperProps = { id: string; title: string; @@ -54,12 +43,6 @@ export const bdstStateExport: bdstState = { }, }; - - - - - - export const bdstActionsExport: (set: any) => bdstActions = ( set: any ) => { diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx index 7624a4ee9..e3442dc3d 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx @@ -1,46 +1,47 @@ import { bdstUsgCd, comCodeStateExport } from "@/app/store/common/code"; -import { getFectch } from "@/components/lib/api"; +import { getFectch, postFectch, putFectch } from "@/components/lib/api"; -type RainyInfoResponse = { +export type RainyInfoResponse = { ctpvCd: string; sggCd: string; bdstNm: string; daddr: string; - bdstUsgCd: string; frstArchPrmsnDt: string; archArea: string; - lawTrgtYn: string; archChgArea: string; bdstInfoPk: number; - reuseBuilding: Array<{ - bdstUsgCd: any; - bdstRuseFcltPk: number; - bdstInfoFk: number; - operMngCd: number | null; - anlOperCst: number | null; - instlCmptnDt: string | null; - instlCst: number | null; - archChgPrmsnDt: string | null; - instlCstSprtYn: string | null; - instlCstSprtAmt: number | null; - grntchBdstCertYn: string | null; - grntchBdstCertNo: string | null; - grntchBdstCertGrd: string | null; - grntchBdstCertYr: string | null; - rainyObj: { - bdstReuseFcltFk:number|null; - pntfColKnd: string | null; - pntfColArea: number | null; - dtfcltCpct:number|null; - filtrTrtmfctCpct: number | null; - filtrTrtmfctYn: string | null; - filtrTrtmfctPrs: number | null; - annRnwtQty:number|null; - oilqMeasMthd:string|null - } | null; - }>; + reuseBuilding:reuseBuilding }; +export type reuseBuilding= Array<{ + lawTrgtYn: string; + bdstUsgCd: string; + bdstRuseFcltPk: number; + bdstInfoFk: number; + operMngCd: number ; + anlOperCst: number ; + instlCmptnDt: Date ; + instlCst: number ; + archChgPrmsnDt: string ; + instlCstSprtYn: string ; + instlCstSprtAmt: number + grntchBdstCertYn: string + grntchBdstCertNo: string + grntchBdstCertGrd: string + grntchBdstCertYr: string + rainyObj:rainyObj| null +}>; +export type rainyObj= { + bdstReuseFcltFk:number + pntfColKnd: string | undefined + pntfColArea: number | undefined + dtfcltCpct:number + filtrTrtmfctCpct: number | undefined + filtrTrtmfctYn: string| undefined + filtrTrtmfctPrs: string | undefined + annRnwtQty:number + oilqMeasMthd:string| undefined +}; export type TableUpperProps = { id: string; @@ -50,74 +51,19 @@ export type TableUpperProps = { }; -export type rainRuseBd={ - bdstRuseFcltPk: number, // 건축물 재이용시설 기본키 - bdstInfoFk: number, // 건축물 정보 외부키 - operMngCd:number|null, // 운영관리 코드 tb_wr_bdst_ruse_fclt 삭제 요망 - anlOperCst: number|null, // 연간운영비용 tb_wr_bdst_ruse_fclt 삭제 요망 - instlCmptnDt: Date|null, // 설치완료 일시 tb_wr_bdst_ruse_fclt 1 - instlCst: number|null, // 설치 비용 tb_wr_bdst_ruse_fclt 2 - instlCstSprtAmt: number|null, // 설치비용지원금액 tb_wr_bdst_ruse_fclt 8 - grntchBdstCertYn: string|null, // 녹색 기술 건축물 인증여부 tb_wr_bdst_ruse_fclt 9 - grntchBdstCertNo: string|null, // 녹색 기술 건축물 인증번호 tb_wr_bdst_ruse_fclt 10 - grntchBdstCertGrd: string|null, // 녹색 기술 건축물 인증등급 tb_wr_bdst_ruse_fclt 11 - grntchBdstCertYr: string|null, // 녹색 기술 건축물 인증년도 tb_wr_bdst_ruse_fclt 12 - - bdstReuseFcltFk:number|null; - dtfcltCpct:number|null, // 저류오 용량 tb_wr_rnwtr_utztn_fclt 3-1 - pntfColKnd: string|null, // 접수지점 종류 tb_wr_rnwtr_utztn_fclt 3 - pntfColArea: number|null, // 접수지점 지역 tb_wr_rnwtr_utztn_fclt 4 - filtrTrtmfctCpct: number|null, // 여과 처리시설 용량 tb_wr_rnwtr_utztn_fclt 5 - filtrTrtmfctYn: string|null, // 여과 처리시설 유무 tb_wr_rnwtr_utztn_fclt 6 - filtrTrtmfctPrs: number|null, // 여과 처리시설 공정 tb_wr_rnwtr_utztn_fclt 7 - - annRnwtQty:number|null; //연간 빗물량 - oilqMeasMthd:string|null // 유량측정 방법 -} - - export type reuseBuilding = { - bdstRuseFcltPk: number, // 건축물 재이용시설 기본키 - bdstInfoFk: number, // 건축물 정보 외부키 - operMngCd:number|null, // 운영관리 코드 tb_wr_bdst_ruse_fclt 삭제 요망 - anlOperCst: number|null, // 연간운영비용 tb_wr_bdst_ruse_fclt 삭제 요망 - instlCmptnDt: Date|null, // 설치완료 일시 tb_wr_bdst_ruse_fclt 1 - instlCst: number|null, // 설치 비용 tb_wr_bdst_ruse_fclt 2 - instlCstSprtAmt: number|null, // 설치비용지원금액 tb_wr_bdst_ruse_fclt 8 - grntchBdstCertYn: string|null, // 녹색 기술 건축물 인증여부 tb_wr_bdst_ruse_fclt 9 - grntchBdstCertNo: string|null, // 녹색 기술 건축물 인증번호 tb_wr_bdst_ruse_fclt 10 - grntchBdstCertGrd: string|null, // 녹색 기술 건축물 인증등급 tb_wr_bdst_ruse_fclt 11 - grntchBdstCertYr: string|null, // 녹색 기술 건축물 인증년도 tb_wr_bdst_ruse_fclt 12 - rainyObj:rainyObj - } - - export type rainyObj ={ - bdstReuseFcltFk:number|null; - dtfcltCpct:number|null, // 저류오 용량 tb_wr_rnwtr_utztn_fclt 3-1 - pntfColKnd: string|null, // 접수지점 종류 tb_wr_rnwtr_utztn_fclt 3 - pntfColArea: number|null, // 접수지점 지역 tb_wr_rnwtr_utztn_fclt 4 - filtrTrtmfctCpct: number|null, // 여과 처리시설 용량 tb_wr_rnwtr_utztn_fclt 5 - filtrTrtmfctYn: string|null, // 여과 처리시설 유무 tb_wr_rnwtr_utztn_fclt 6 - filtrTrtmfctPrs: number|null, // 여과 처리시설 공정 tb_wr_rnwtr_utztn_fclt 7 - - annRnwtQty:number|null; //연간 빗물량 - oilqMeasMthd:string|null // 유량측정 방법 - } - - - -export type bdstType = { - ctpvCd: string; // 시도 - sggCd: string; // 시군구 - daddr: string; // 위치 - bdstUsgCd: string; // 건축물용도 - frstArchPrmsnDt: string; // 최초건축허가일 - archArea: string; // 건축면적 - lawTrgtYn: string; // 법적의무대상여부 - archChgPrmsnDt: string; // 건축변경 허가일시 - archChgArea: string; // 변경 면적 - bdstInfoPk: number; - bdstNm: string; -}; +// export type bdstType = { +// ctpvCd: string; // 시도 +// sggCd: string; // 시군구 +// daddr: string; // 위치 +// bdstUsgCd: string; // 건축물용도 +// frstArchPrmsnDt: string; // 최초건축허가일 +// archArea: string; // 건축면적 +// lawTrgtYn: string; // 법적의무대상여부 +// archChgPrmsnDt: string; // 건축변경 허가일시 +// archChgArea: string; // 변경 면적 +// bdstInfoPk: number; +// bdstNm: string; +// }; export const upHeadList: TableUpperProps[] = [ { id: "cityText", title: "시도" }, @@ -133,6 +79,8 @@ export const upHeadList: TableUpperProps[] = [ { id: "archChgArea", title: "면적", upName: "upChangeRe", upSequnce: 3 }, ]; +const rainRes: RainyInfoResponse[] = [] + const bdstObj: bdstType[] =[] const rainRuseObj: rainRuseBd[] = [] @@ -153,11 +101,14 @@ export type rainFacState = { rainRuseObj: rainRuseBd[]; bdstObj: bdstType[]; selectYN: selectArray[]; + rainRes:RainyInfoResponse[]; }; }; type rainFacSActions = { init: () => void; - dataInit:( )=>void; + dataInit: () => void; + rainReg: (data: RainyInfoResponse) => void; + rainUpdate: (data: RainyInfoResponse) => void; }; @@ -166,27 +117,13 @@ export type rainFacType = rainFacState & rainFacSActions; export const rainFacStateExport: rainFacState = { rain: { isInit: false, + rainRes:rainRes, upHeadList: upHeadList, rainRuseObj: rainRuseObj, bdstObj: bdstObj, selectYN: selectYN, }, }; -console.log(comCodeStateExport.code.sggCd) - -const chBdstUsgCd =(value:string|number)=>{ - const data = bdstUsgCd.find((item)=>item.val===value)?.text - - return data; -} - - -const chCityCd =(value:string|number)=>{ - const data = bdstUsgCd.find((item)=>item.val===value)?.text - - return data; -} - export const rainFacActionsExport: (set: any) => rainFacSActions = ( set: any @@ -195,32 +132,13 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( init: async() =>{ try { // 파라이터 수정 통합관리자 =0, 시관리자=시코드, 시군구 관리자= 시군구 코드 를 세번째 파라미터로 지정 / 건축물 서치가 있을경우 4번째 파라미터로 던지기 즉 1/20/42(서울시)/영현빌딩 이런식으로) - const res = await getFectch('wr', "/reuseFc/rainyInfoList/1/20/42"); - const result = res.flatMap(({ reuseBuilding = [] as RainyInfoResponse["reuseBuilding"], ...item }) => - reuseBuilding.map(rb => { - const { bdstUsgCd, archChgPrmsnDt, rainyObj, ...restRb } = rb; - const bdstObj = { - ...item, - bdstUsgCd: bdstUsgCd ? chBdstUsgCd(bdstUsgCd) ?? '' : '', - archChgPrmsnDt: archChgPrmsnDt ?? '' - } as bdstType; - - const rainRuseObj = { - ...restRb, - ...rainyObj - } as rainRuseBd; - - return { bdstObj, rainRuseObj }; - }) - ); - + const rainRes = await getFectch('wr', "/reuseFc/rainyInfoList/1/20/42"); // 여기서 상태 업데이트 return set((state: rainFacState) => ({ ...state, rain: { ...state.rain, - bdstObj: result.map((item: { bdstObj: any; }) => item.bdstObj), - rainRuseObj: result.map((item: { rainRuseObj: any; }) => item.rainRuseObj), + rainRes:rainRes, isInit: false } })); @@ -238,8 +156,35 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( ...state.rain, isInit: false, - }, + }, }) }), + + rainReg:(data:RainyInfoResponse)=> + set(async(state:rainFacState) =>{ + try{ + const res= postFectch('/reuseFc/rainyInfo' , data) + + }catch (e){ + alert('등록이 오류입니다.') + }finally{ + alert('등록이 완료되었습니다.') + } + } + ), + rainUpdate:(data:RainyInfoResponse)=> + set(async(state:rainFacState) =>{ + try{ + const res= putFectch('/reuseFc/rainyInfo' , data) + + }catch (e){ + alert('업데이트 오류입니다.') + }finally{ + alert('업데이트가 완료되었습니다.') + } + + + } + ), }; }; diff --git a/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts b/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts index 9c49e56cd..796167e91 100644 --- a/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts +++ b/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts @@ -1,67 +1,101 @@ import { z } from "zod"; -export const rainZod = { - instlCmptnDt: z.date(), - instlCst: z.number(), - pntfColKnd: z.string(), - pntfColArea: z.number(), - filtrTrtmfctPrs: z.string(), - filtrTrtmfctYn: z.string(), - filtrTrtmfctCpct: z.string(), - instlCstSprtYn: z.string(), - instlCstSprtAmt: z.string(), - grntchCstSprtYn: z.string(), - grntchCstSprtCst: z.string(), - grntchBdstCertYn: z.string(), - grntchBdstCertYr: z.string(), - grntchBdstCertNo: z.string(), - grntchBdstCertGrd: z.string(), +export const rainZod = +{ ctpvCd: z.string(), + sggCd: z.string(), + bdstNm: z.string(), + daddr: z.string(), + frstArchPrmsnDt: z.date(), + archArea: z.number(), + archChgArea: z.string(), + bdstInfoPk: z.number(), + + lawTrgtYn: z.string(), + bdstUsgCd: z.string(), + bdstRuseFcltPk: z.number(), + bdstInfoFk: z.number(), + operMngCd: z.number(), + anlOperCst: z.number(), + instlCmptnDt: z.date(), + instlCst: z.number(), + archChgPrmsnDt: z.string(), + instlCstSprtYn: z.string(), + instlCstSprtAmt: z.number(), + grntchBdstCertYn: z.string(), + grntchBdstCertNo: z.string(), + grntchBdstCertGrd: z.string(), + grntchBdstCertYr: z.string(), + + bdstReuseFcltFk:z.number(), + pntfColKnd: z.string(), + pntfColArea: z.number(), + dtfcltCpct:z.number(), + filtrTrtmfctCpct: z.number(), + filtrTrtmfctYn: z.string(), + filtrTrtmfctPrs: z.string(), + annRnwtQty:z.number(), + oilqMeasMthd:z.string(), } +// = { +// instlCmptnDt: z.date(), +// instlCst: z.number(), +// pntfColKnd: z.string(), +// pntfColArea: z.number(), +// filtrTrtmfctPrs: z.string(), +// filtrTrtmfctYn: z.string(), +// filtrTrtmfctCpct: z.number(), +// instlCstSprtYn: z.string(), +// instlCstSprtAmt: z.number(), +// grntchCstSprtYn: z.string(), +// // grntchCstSprtCst: z.string(), +// grntchBdstCertYn: z.string(), +// grntchBdstCertYr: z.string(), +// grntchBdstCertNo: z.string(), +// grntchBdstCertGrd: z.string(), +// } export const rainDefZod= { instlCmptnDt: new Date(), instlCst: 0, pntfColKnd: "", pntfColArea: 0, - filtrTrtmfctYn: "N", - filtrTrtmfctCpct: "", + filtrTrtmfctYn: "Y", + filtrTrtmfctCpct: 0, filtrTrtmfctPrs: "", instlCstSprtYn: "", - instlCstSprtAmt: "", + instlCstSprtAmt: 0, grntchCstSprtYn: "", - grntchCstSprtCst: "", + // grntchCstSprtCst: "", grntchBdstCertYn: "", grntchBdstCertYr: "", grntchBdstCertNo: "", grntchBdstCertGrd: "", } -export const bdstZod ={ - ctpvCd: z.string(), // 시도 - sggCd: z.string(), // 시군구 - daddr: z.string(), // 위치 - bdstUsgCd: z.string(), // 건축물용도 - frstArchPrmsnDt: z.string(), // 최초건축허가일 - archArea: z.string(), // 건축면적 - lawTrgtYn: z.string(), // 법적의무대상여부 - archChgPrmsnDt: z.string(), // 건축변경 허가일시 - archChgArea: z.string(), // 변경 면적 - //bdstInfoPk: number; - bdstNm: z.string(), - } +// export const bdstZod ={ +// ctpvCd: z.string(), // 시도 +// sggCd: z.string(), // 시군구 +// daddr: z.string(), // 위치 +// bdstUsgCd: z.string(), // 건축물용도 +// frstArchPrmsnDt: z.date(), // 최초건축허가일 +// archArea: z.number(), // 건축면적 +// lawTrgtYn: z.string(), // 법적의무대상여부 +// // archChgPrmsnDt: z.string(), // 건축변경 허가일시 +// // archChgArea: z.number(), // 변경 면적 +// bdstNm: z.string(), +// } export const bdstDefZod={ ctpvCd: '', // 시도 sggCd: '', // 시군구 daddr: '', // 위치 bdstUsgCd: '', // 건축물용도 - frstArchPrmsnDt: '', // 최초건축허가일 - archArea: '', // 건축면적 + frstArchPrmsnDt: new Date(), // 최초건축허가일 + archArea: 0, // 건축면적 lawTrgtYn: '', // 법적의무대상여부 - archChgPrmsnDt: '', // 건축변경 허가일시 - archChgArea: '', // 변경 면적 - //bdstInfoPk: number; + // archChgPrmsnDt: '', // 건축변경 허가일시 + // archChgArea: 0, // 변경 면적 bdstNm: '', } diff --git a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx index 2cafa0973..7445af885 100644 --- a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx @@ -4,7 +4,7 @@ import { FormField, FormUi, SelectBox } from "@common/business_components"; import { Button, Input } from "@common/components"; import { useFieldArray } from "react-hook-form"; -export default function BdstReg(form: any) { +export default function BdstReg(form: any ) { const { code } = useWrStore((state) => { return state; }); @@ -34,7 +34,7 @@ export default function BdstReg(form: any) {

건축물 시설 정보

-
+
{ field.onChange(val); }} @@ -119,7 +119,7 @@ export default function BdstReg(form: any) { className={""} selectClass={selectClass} label={""} - selectArray={code.cityCd} + selectArray={code.bdstUsgCd} onSelectValue={(val) => { field.onChange(val); }} @@ -136,10 +136,16 @@ export default function BdstReg(form: any) { render={({ field }) => ( + field.onChange( + e.target.value ? new Date(e.target.value) : undefined + ) + } + value={ + field.value ? field?.value.toISOString().split("T")[0] : "" + } /> )} @@ -155,7 +161,11 @@ export default function BdstReg(form: any) { className="" placeholder="1,000,000" type="number" - {...field} + {... field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === '' ? '' : Number(value)); + }} /> )} @@ -171,7 +181,7 @@ export default function BdstReg(form: any) { className={""} selectClass={selectClass} label={""} - selectArray={code.cityCd} + selectArray={code.yn} onSelectValue={(val) => { field.onChange(val); }} diff --git a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx index 088c7fd43..b2ea6404f 100644 --- a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx @@ -9,73 +9,143 @@ import { FormUi } from "@common/business_components"; import { useWrStore } from "@/app/store"; import { selectClass, - type rainRuseBd, + type RainyInfoResponse, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { useEffect } from "react"; import { bdstDefZod, - bdstZod, rainDefZod, rainZod, } from "@/components/lib/type/zod/fcltReg/controlZod"; import BdstReg from "../bdstReg/component"; +import { DatePicker } from "@common/business_components"; export function RainRegForm({ - data, + rainForm, isModal, }: { - data: rainRuseBd[]; + rainForm: RainyInfoResponse | undefined; isModal: boolean; }) { - const formSchema = isModal - ? z.object({ ...rainZod, ...bdstZod }) - : z.object(rainZod); - - const { rain, code } = useWrStore((state) => state); - const { rainFcltCd } = code; - useEffect(() => { - // console.log( " data ", data) - if (data && data.length > 0) { - console.log(data); - const selectedOption = rainFcltCd.find( - (item) => item.val === String(data[0]?.pntfColKnd ?? "") - ); - const formData = { - ...data[0], - pntfColKnd: selectedOption ? selectedOption.val : "", - instlCmptnDt: data[0]?.instlCmptnDt - ? new Date(data[0].instlCmptnDt) - : undefined, - }; - form.reset(formData); - } - }, [data, rainFcltCd]); - + const formSchema = z.object(rainZod); const form = useForm>({ resolver: zodResolver(formSchema), defaultValues: isModal - ? { ...rainDefZod, ...bdstDefZod } - : { ...rainDefZod }, + ? { + ...rainDefZod, + ...bdstDefZod, + } + : { + ...rainDefZod, + }, }); + const { rain, code, rainReg, rainUpdate, init } = useWrStore( + (state) => state + ); + const { rainFcltCd } = code; + + useEffect(() => { + // console.log( " data ", data) + if (rainForm != null) { + const data = rainForm; + + const selectedOption = rainFcltCd.find( + (item) => + item.val === + String(data?.reuseBuilding?.at(0)?.rainyObj?.pntfColKnd ?? "") + ); + let formData; + if (data?.reuseBuilding?.at(0)) { + const rb = data.reuseBuilding?.at(0); + formData = { + ...rb?.rainyObj, + ...data.reuseBuilding?.at(0), + pntfColKnd: selectedOption ? String(selectedOption.val) : undefined, + }; + form.reset(formData); + } else { + formData = { + ctpvCd: data.ctpvCd, + sggCd: data.sggCd, + bdstNm: data.bdstNm, + daddr: data.daddr, + frstArchPrmsnDt: new Date(data.frstArchPrmsnDt), + }; + form.reset(formData); + } + } + }, [rainForm, rainFcltCd]); + // form 값이 변경될 때마다 로그 출력 useEffect(() => { - const subscription = form.watch((value) => { - console.log("form values changed:", value); - }); + const subscription = form.watch((value) => {}); return () => subscription.unsubscribe(); }, [form]); - // 2. Define a submit handler. function onSubmit(values: z.infer) { - // Do something with the form values. - // ✅ This will be type-safe and validated. + console.log("valuesd"); console.log(values); + let regRainForm = { ...rainForm }; + const raw = values; + const rawVal = { + ctpvCd: raw?.ctpvCd, + sggCd: raw?.sggCd, + daddr: raw?.daddr, + bdstNm: raw?.bdstNm, + frstArchPrmsnDt: raw?.frstArchPrmsnDt.toISOString(), + archArea: raw?.archArea + "", + }; + // 1. 기본 정보 정리 + if (isModal) + regRainForm = {...rawVal}; + + if(regRainForm?.reuseBuilding?.at(0)?.rainyObj){ + const rainObj = regRainForm?.reuseBuilding?.at(0)?.rainyObj; + regRainForm.reuseBuilding[0].rainyObj = { + ...rainObj, + pntfColKnd: raw.pntfColKnd || rainObj?.pntfColKnd, + pntfColArea: raw.pntfColArea || rainObj?.pntfColArea, + filtrTrtmfctCpct: raw.filtrTrtmfctCpct || rainObj?.filtrTrtmfctCpct, + filtrTrtmfctYn: raw.filtrTrtmfctYn || rainObj?.filtrTrtmfctYn, + filtrTrtmfctPrs: raw.filtrTrtmfctPrs || rainObj?.filtrTrtmfctPrs, + oilqMeasMthd: rainObj?.oilqMeasMthd, + }; + regRainForm.reuseBuilding[0] = { + ...rainForm.reuseBuilding[0], + instlCmptnDt: raw.instlCmptnDt, + instlCst: raw.instlCst || rainForm.reuseBuilding[0]?.instlCst, + instlCstSprtYn: + raw.instlCstSprtYn || rainForm.reuseBuilding[0]?.instlCstSprtYn, + instlCstSprtAmt: + raw.instlCstSprtAmt || rainForm.reuseBuilding[0]?.instlCstSprtAmt, + grntchBdstCertYn: + raw.grntchBdstCertYn || rainForm.reuseBuilding[0]?.grntchBdstCertYn, + grntchBdstCertYr: + raw.grntchBdstCertYr || rainForm.reuseBuilding[0]?.grntchBdstCertYr, + grntchBdstCertNo: + raw.grntchBdstCertNo || rainForm.reuseBuilding[0]?.grntchBdstCertNo, + grntchBdstCertGrd: + raw.grntchBdstCertGrd || rainForm.reuseBuilding[0]?.grntchBdstCertGrd, + bdstUsgCd: raw.bdstUsgCd || rainForm.reuseBuilding[0]?.bdstUsgCdd, + lawTrgtYn: raw.lawTrgtYn || rainForm.lawTrgtYn, + }; + } + + + if (isModal) { + rainReg(regRainForm); + } else { + rainUpdate(regRainForm); + } + + init(); } - const onSelectValue = (val: string) => { - console.log(val); - }; + useEffect(() => { + console.log("form errors:", form.formState.errors); + }, [form.formState.errors]); + return (
@@ -86,11 +156,19 @@ export function RainRegForm({

{isModal ? "○건축물 운영정보" : "○ 빗물이용시설 운영정보"}

- +
{isModal ? : <>} - {isModal ?

○ 빗물이용시설 운영정보

: <>} + {isModal ? ( +

+ ○ 빗물이용시설 운영정보{" "} +

+ ) : ( + <> + )}

기본정보

@@ -102,7 +180,7 @@ export function RainRegForm({ name="instlCmptnDt" render={({ field }) => ( - @@ -111,9 +189,20 @@ export function RainRegForm({ ) } value={ - field.value ? field?.value.toString().split("T")[0] : "" + field.value + ? field?.value.toISOString().split("T")[0] + : "" } - /> + /> */} + + field.onChange(date), + }} + selectClass={selectClass} + > )} /> @@ -130,6 +219,10 @@ export function RainRegForm({ placeholder="1,000,000" type="" {...field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === "" ? "" : Number(value)); + }} /> )} @@ -158,7 +251,6 @@ export function RainRegForm({ selectArray={rainFcltCd} onSelectValue={(val) => { field.onChange(val); - onSelectValue(val); }} value={field.value} /> @@ -177,6 +269,10 @@ export function RainRegForm({ placeholder="1,000,000" type="" {...field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === "" ? "" : Number(value)); + }} /> )} @@ -198,8 +294,8 @@ export function RainRegForm({ className={""} selectClass={selectClass} label={""} - selectArray={rain.selectYN} - onSelectValue={onSelectValue} + selectArray={code.yn} + onSelectValue={field.onChange} {...field} /> @@ -217,6 +313,10 @@ export function RainRegForm({ placeholder="1,000,000" type="" {...field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === "" ? "" : Number(value)); + }} /> )} @@ -258,8 +358,8 @@ export function RainRegForm({ className={""} selectClass={selectClass} label={""} - selectArray={rain.selectYN} - onSelectValue={onSelectValue} + selectArray={code.yn} + onSelectValue={field.onChange} value={field.value} /> @@ -277,6 +377,10 @@ export function RainRegForm({ placeholder="1,000,000" type="" {...field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === "" ? "" : Number(value)); + }} /> )} @@ -298,8 +402,8 @@ export function RainRegForm({ className={""} selectClass={selectClass} label={""} - selectArray={rain.selectYN} - onSelectValue={onSelectValue} + selectArray={code.yn} + onSelectValue={field.onChange} value={field.value} /> diff --git a/apps/wr/components/ui/modal/bdstReg/component.tsx b/apps/wr/components/ui/modal/bdstReg/component.tsx index 9fbfd4333..aba76c7f9 100644 --- a/apps/wr/components/ui/modal/bdstReg/component.tsx +++ b/apps/wr/components/ui/modal/bdstReg/component.tsx @@ -4,10 +4,11 @@ import { useWrStore } from "@/app/store"; import { selectClass, type bdstType, + type RainyInfoResponse, type selectArray, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { ScrollArea, SearchInput, SelectBox, UiTable } from "@common/business_components"; -import { Button, Input } from "@common/components"; +import { Button, Input, Label } from "@common/components"; import { useEffect, useState } from "react"; import { RainRegForm } from "../../form/fcltReg/rainReg/component"; @@ -16,33 +17,49 @@ export function BdstReg() { return state; }); - const [bdstTable, setbdstTable] = useState(); - const [rainBdstForm, setRainBdstForm] = useState(); + type objSearchType = { + sgg: string; + city: string; + }; + const [bdstTable, setbdstTable] = useState(); + const [rainBdstForm, setRainBdstForm] = useState(); const { bdstObj, rainRuseObj } = rain; const [selectSgg, setSelectSgg] = useState() const [searchTxt, setSearchTxt] = useState() + const [objSearch, setObjSearch] = useState({sgg:"",city:""}); - const getCity = (val: string ) => { - - - const data = code.sggCd + const getCity = (val: string) => { + const data = code.sggCd .filter((item) => String(item.val).substring(0, 2) === val) - .map((item) => ({ ...item, val: String(item.val) })); // Ensure 'val' is a string + .map((item) => ({ + val: String(item.val), + text: item.text // 한국어 텍스트 + })); setSelectSgg(data); + + setObjSearch({ city:val , sgg:''}) }; const getSgg = (val: string | number) => { console.log(val); + setObjSearch({...objSearch,sgg: String(val)}) }; + const searchBdst=()=>{ + if(objSearch.sgg===""){ + alert('시도조건은 필수 입니다.') + } + } + useEffect(()=>{ - // console.log("searchTxt ", searchTxt) - findBdst(searchTxt) + findBdst(searchTxt || "") },[searchTxt]) + + useEffect(() => { if (code.sggCd.length > 0) { const table = bdst?.bdstBase?.map((item) => { @@ -62,11 +79,8 @@ export function BdstReg() { const tableClick: (val: number | undefined) => void = (val) => { - console.log("val , " ,val) - console.log("bdst , " ,bdst?.bdstBase[val]) if(val!==undefined && bdst?.bdstBase.length>0){ const data =bdst?.bdstBase[val] - console.log("data ", [data]) setRainBdstForm([data]); } } @@ -74,9 +88,9 @@ export function BdstReg() { const nodeList = headMakeColSpan(bdst.moUpHeadList); return ( <> -
+
{" "} - 건축물명 + setSearchTxt(e.target.value)}/> + {/* + /> */} +
@@ -118,7 +135,7 @@ export function BdstReg() {
- +
From f88e582b5e36b6a15871ca5b5ad48926e5d9fa22 Mon Sep 17 00:00:00 2001 From: YangJinSoo94 Date: Tue, 1 Apr 2025 11:37:00 +0900 Subject: [PATCH 08/11] =?UTF-8?q?=ED=85=8C=EC=9D=B4=EB=B8=94=20=EC=9E=98?= =?UTF-8?q?=EB=AA=BB=20commit=EC=9B=90=EB=B3=B5,=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=EB=84=A4=EC=9D=B4=EC=85=98=20=EC=9E=AC=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/ui/table/index.tsx | 112 +++++++----------- .../src/ui/table/uiPageNations.tsx | 96 ++++++++++----- 2 files changed, 106 insertions(+), 102 deletions(-) diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx index 99199d163..9635a7e21 100644 --- a/packages/common/business_components/src/ui/table/index.tsx +++ b/packages/common/business_components/src/ui/table/index.tsx @@ -1,78 +1,50 @@ -'use client'; +import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@common/components"; +import UiPageNations from "./uiPageNations"; -import { useEffect, useState } from "react"; -import { - Pagination, - PaginationContent, - PaginationItem, - PaginationPrevious, - PaginationLink, - PaginationNext -} from "./lib/pagination"; - -interface CommonPageNationsProps { - total: number; - cur: number; +type UiTableProps = { + headName: React.ReactNode | undefined; + tableData: { [key: string]: string | number | boolean }[]; + headlist: UiHeadProps[]; pageSize: number; + total: number; + children: React.ReactNode | undefined; + cellClick : ((index:number|undefined)=>void) | undefined; } -export default function UiPageNations(commonPageNationsProps: CommonPageNationsProps) { - const [pageProps, setPageProps] = useState(commonPageNationsProps); +type UiHeadProps = { + id: string; + title: string; +} - useEffect(() => { - setPageProps(commonPageNationsProps); - }, [commonPageNationsProps]); - - const totalPages = Math.ceil(pageProps.total / pageProps.pageSize); - const pagesPerGroup = 10; - const currentGroup = Math.floor((pageProps.cur - 1) / pagesPerGroup); - const startPage = currentGroup * pagesPerGroup + 1; - const endPage = Math.min(startPage + pagesPerGroup - 1, totalPages); - - const handlePageChange = (page: number) => { - setPageProps({ ...pageProps, cur: page }); - }; +export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick }: UiTableProps) { + const cur = 1; return ( - - - - {/* 이전 그룹으로 이동 */} - - { - if (startPage > 1) handlePageChange(startPage - 1); - }} - /> - - - {/* 현재 그룹 페이지들 표시 */} - { - Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i).map((pageNum) => ( - - handlePageChange(pageNum)} - > - {pageNum} - - - )) - } - - {/* 다음 그룹으로 이동 */} - - { - if (endPage < totalPages) handlePageChange(endPage + 1); - }} - /> - - - - + <> + {headName ?
+

{headName}

+
: <>} +
+ + + {children ? <>{children} : + {headlist?.map((head) => ( + {head.title} + ))} + } + + + {tableData?.map((el: { [key: string]: string | number | boolean }, index) => ( + + {headlist?.map((head) => ( + cellClick && cellClick(index)} key={head.id + index}>{el[head.id]} + ))} + + ))} + +
+ {total <= 0 ? <> : } +
+ ); -} \ No newline at end of file +} diff --git a/packages/common/business_components/src/ui/table/uiPageNations.tsx b/packages/common/business_components/src/ui/table/uiPageNations.tsx index a7b788d71..99199d163 100644 --- a/packages/common/business_components/src/ui/table/uiPageNations.tsx +++ b/packages/common/business_components/src/ui/table/uiPageNations.tsx @@ -1,46 +1,78 @@ -'use client' - +'use client'; import { useEffect, useState } from "react"; -import { Pagination, PaginationContent, PaginationItem, PaginationPrevious, PaginationLink, PaginationNext } from "./lib/pagination"; - +import { + Pagination, + PaginationContent, + PaginationItem, + PaginationPrevious, + PaginationLink, + PaginationNext +} from "./lib/pagination"; interface CommonPageNationsProps { - total: number; - cur: number; - pageSize: number; + total: number; + cur: number; + pageSize: number; } export default function UiPageNations(commonPageNationsProps: CommonPageNationsProps) { - - const [pageProps, setPageProps] = useState(commonPageNationsProps); + const [pageProps, setPageProps] = useState(commonPageNationsProps); + useEffect(() => { + setPageProps(commonPageNationsProps); + }, [commonPageNationsProps]); - useEffect(() => { - setPageProps(commonPageNationsProps); - } ,[commonPageNationsProps]); + const totalPages = Math.ceil(pageProps.total / pageProps.pageSize); + const pagesPerGroup = 10; + const currentGroup = Math.floor((pageProps.cur - 1) / pagesPerGroup); + const startPage = currentGroup * pagesPerGroup + 1; + const endPage = Math.min(startPage + pagesPerGroup - 1, totalPages); + const handlePageChange = (page: number) => { + setPageProps({ ...pageProps, cur: page }); + }; - return( - - - - - + return ( + + + + {/* 이전 그룹으로 이동 */} + + { + if (startPage > 1) handlePageChange(startPage - 1); + }} + /> + + + {/* 현재 그룹 페이지들 표시 */} { - Array.from({length:Math.ceil(commonPageNationsProps.total/commonPageNationsProps.pageSize)},(_,i)=>i+1).map((el,index)=>( - - {el} - - )) - } - - + Array.from({ length: endPage - startPage + 1 }, (_, i) => startPage + i).map((pageNum) => ( + + handlePageChange(pageNum)} + > + {pageNum} + - - - - - - ); + )) + } + + {/* 다음 그룹으로 이동 */} + + { + if (endPage < totalPages) handlePageChange(endPage + 1); + }} + /> + + + + + ); } \ No newline at end of file From 54f47afaee46668776df085b71fa39761d35539b Mon Sep 17 00:00:00 2001 From: truthwing Date: Tue, 1 Apr 2025 13:11:49 +0900 Subject: [PATCH 09/11] =?UTF-8?q?type=20=EC=97=90=EB=9F=AC=20=EC=A0=95?= =?UTF-8?q?=EB=A6=AC.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/ruseFcltMng/fcltReg/rainReg/page.tsx | 121 +++++++------ .../ruseFcltMng/fcltReg/rainReg/index.tsx | 163 ++++++++---------- .../ui/form/fcltReg/rainReg/component.tsx | 45 +++-- 3 files changed, 162 insertions(+), 167 deletions(-) diff --git a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx index d348a07d5..d5ebba35f 100644 --- a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx +++ b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx @@ -1,65 +1,88 @@ -'use client' +"use client"; import { useWrStore } from "@/app/store"; -import type { RainyInfoResponse, TableUpperProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg" +import type { + RainyBuilding, + TableUpperProps, +} from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { RainRegForm } from "@/components/ui/form/fcltReg/rainReg/component"; import { BdstReg } from "@/components/ui/modal/bdstReg/component"; -import { ContentsDiv, ScrollArea, SearchDiv, SearchFormLeft, SearchFormRight, SearchInput, Title, UiModal, UiTable } from "@common/business_components"; +import { + ContentsDiv, + ScrollArea, + SearchDiv, + SearchFormLeft, + SearchFormRight, + SearchInput, + Title, + UiModal, + UiTable, +} from "@common/business_components"; import ListDiv from "@common/business_components/ui/list_div"; import { Button, TableHead, TableRow } from "@common/components"; -import { useEffect, useState } from "react"; +import { useEffect, useState } from "react"; export const headMakeColSpan = (upHeadList: TableUpperProps[]) => { - return (<> - { - upHeadList.map((head: TableUpperProps) => - (!head.upSequnce ? {head.title} : - head.upName === 'upChangeRe' && head.upSequnce === 1 ? {'중축 개축 증축 '} : null))} - - - {upHeadList.map((head: TableUpperProps) => - (head.upName === 'upChangeRe' ? {head.title} : null))} - - ) -} + return ( + <> + + {upHeadList.map((head: TableUpperProps) => + !head.upSequnce ? ( + + {head.title} + + ) : head.upName === "upChangeRe" && head.upSequnce === 1 ? ( + + {"중축 개축 증축 "} + + ) : null + )} + + + {upHeadList.map((head: TableUpperProps) => + head.upName === "upChangeRe" ? ( + {head.title} + ) : null + )} + + + ); +}; export default function Home() { - const { rain, code,init } = useWrStore((state) => { - return state + const { rain, code, init } = useWrStore((state) => { + return state; }); - const {bdstObj, rainRes } =rain - const [rainForm, setRainForm] = useState (); - const [bdstTable, setbdstTable] = useState (); + const { rainRes } = rain; + const [rainForm, setRainForm] = useState(); + const [bdstTable, setbdstTable] = useState(); const nodeList = headMakeColSpan(rain.upHeadList); useEffect(() => { - - if (!rain.isInit) { - + if (!rain.isInit) { init(); - - } - }, [rain.isInit,init]); - - useEffect ( () => { - - if(code.sggCd.length>0){ - const table = rainRes.map((item) => { - const sggText= code.sggCd.find((cd)=>cd.val.toString() === item.sggCd )?.text; - const cityText= code.cityCd.find((cd)=>cd.val.toString() === item.ctpvCd )?.text; - return( - {...item, - sggText:sggText, - cityText:cityText - }) - }) - - setbdstTable(table) } -}, [code,rainRes]); - const cellClick: (val: number ) => void = (val) => { - if((bdstTable ?? []).length > 0) { - setRainForm(rainRes[val]) - } - } + }, [rain.isInit, init]); + useEffect(() => { + if (code.sggCd.length > 0) { + const table = rainRes.map((item) => { + const sggText = code.sggCd.find( + (cd) => cd.val.toString() === item.sggCd + )?.text; + const cityText = code.cityCd.find( + (cd) => cd.val.toString() === item.ctpvCd + )?.text; + return { ...item, sggText: sggText, cityText: cityText }; + }); + + setbdstTable(table); + } + }, [code, rainRes]); + const cellClick: (val: number | undefined) => void = (val) => { + if ((bdstTable ?? []).length > 0 && val !== undefined) { + { + setRainForm(rainRes[val]); + } + } + }; return ( <> @@ -73,7 +96,7 @@ export default function Home() { className="col-span-3 my-7" label="건물명" textValue={""} - setText={function (val: string): void { + setText={function (): void { throw new Error("Function not implemented."); }} /> diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx index e3442dc3d..9268edcb5 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx @@ -1,7 +1,6 @@ -import { bdstUsgCd, comCodeStateExport } from "@/app/store/common/code"; import { getFectch, postFectch, putFectch } from "@/components/lib/api"; -export type RainyInfoResponse = { +export type RainyBuilding = { ctpvCd: string; sggCd: string; bdstNm: string; @@ -10,37 +9,37 @@ export type RainyInfoResponse = { archArea: string; archChgArea: string; bdstInfoPk: number; - reuseBuilding:reuseBuilding + reuseBuilding: reuseBuilding[]; }; -export type reuseBuilding= Array<{ - lawTrgtYn: string; - bdstUsgCd: string; +export type reuseBuilding = { + lawTrgtYn: string|undefined; + bdstUsgCd: string|undefined; bdstRuseFcltPk: number; bdstInfoFk: number; - operMngCd: number ; - anlOperCst: number ; - instlCmptnDt: Date ; - instlCst: number ; - archChgPrmsnDt: string ; - instlCstSprtYn: string ; - instlCstSprtAmt: number - grntchBdstCertYn: string - grntchBdstCertNo: string - grntchBdstCertGrd: string - grntchBdstCertYr: string - rainyObj:rainyObj| null -}>; -export type rainyObj= { - bdstReuseFcltFk:number - pntfColKnd: string | undefined - pntfColArea: number | undefined - dtfcltCpct:number - filtrTrtmfctCpct: number | undefined - filtrTrtmfctYn: string| undefined - filtrTrtmfctPrs: string | undefined - annRnwtQty:number - oilqMeasMthd:string| undefined + operMngCd: number; + anlOperCst: number; + instlCmptnDt: Date; + instlCst: number|undefined; + archChgPrmsnDt: string; + instlCstSprtYn: string|undefined; + instlCstSprtAmt: number|undefined; + grntchBdstCertYn: string|undefined; + grntchBdstCertNo: string|undefined; + grntchBdstCertGrd: string|undefined; + grntchBdstCertYr: string|undefined; + rainyObj: rainyObj | null; +}; +export type rainyObj = { + bdstReuseFcltFk: number; + pntfColKnd: string | undefined; + pntfColArea: number | undefined; + dtfcltCpct: number; + filtrTrtmfctCpct: number | undefined; + filtrTrtmfctYn: string | undefined; + filtrTrtmfctPrs: string | undefined; + annRnwtQty: number; + oilqMeasMthd: string | undefined; }; export type TableUpperProps = { @@ -50,21 +49,6 @@ export type TableUpperProps = { upSequnce?: number; }; - -// export type bdstType = { -// ctpvCd: string; // 시도 -// sggCd: string; // 시군구 -// daddr: string; // 위치 -// bdstUsgCd: string; // 건축물용도 -// frstArchPrmsnDt: string; // 최초건축허가일 -// archArea: string; // 건축면적 -// lawTrgtYn: string; // 법적의무대상여부 -// archChgPrmsnDt: string; // 건축변경 허가일시 -// archChgArea: string; // 변경 면적 -// bdstInfoPk: number; -// bdstNm: string; -// }; - export const upHeadList: TableUpperProps[] = [ { id: "cityText", title: "시도" }, { id: "sggText", title: "시군구" }, @@ -72,17 +56,14 @@ export const upHeadList: TableUpperProps[] = [ { id: "daddr", title: "위치" }, { id: "bdstUsgCd", title: "건축물용도" }, { id: "frstArchPrmsnDt", title: "최초건축허가일" }, - { id: "archArea", title: "건축면적", }, - { id: "lawTrgtYn", title: "법적의무대상여부", }, + { id: "archArea", title: "건축면적" }, + { id: "lawTrgtYn", title: "법적의무대상여부" }, { id: "archChgYn", title: "여부", upName: "upChangeRe", upSequnce: 1 }, { id: "archChgPrmsnDt", title: "허가일", upName: "upChangeRe", upSequnce: 2 }, { id: "archChgArea", title: "면적", upName: "upChangeRe", upSequnce: 3 }, ]; -const rainRes: RainyInfoResponse[] = [] - - const bdstObj: bdstType[] =[] - const rainRuseObj: rainRuseBd[] = [] +const rainRes: RainyBuilding[] = []; export type selectArray = { text: string; @@ -98,29 +79,24 @@ export type rainFacState = { rain: { isInit: boolean; upHeadList: TableUpperProps[]; - rainRuseObj: rainRuseBd[]; - bdstObj: bdstType[]; selectYN: selectArray[]; - rainRes:RainyInfoResponse[]; + rainRes: RainyBuilding[]; }; }; type rainFacSActions = { init: () => void; dataInit: () => void; - rainReg: (data: RainyInfoResponse) => void; - rainUpdate: (data: RainyInfoResponse) => void; + rainReg: (data: RainyBuilding) => void; + rainUpdate: (data: RainyBuilding) => void; }; - export type rainFacType = rainFacState & rainFacSActions; export const rainFacStateExport: rainFacState = { rain: { isInit: false, - rainRes:rainRes, + rainRes: rainRes, upHeadList: upHeadList, - rainRuseObj: rainRuseObj, - bdstObj: bdstObj, selectYN: selectYN, }, }; @@ -129,62 +105,59 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( set: any ) => { return { - init: async() =>{ + init: async () => { try { // 파라이터 수정 통합관리자 =0, 시관리자=시코드, 시군구 관리자= 시군구 코드 를 세번째 파라미터로 지정 / 건축물 서치가 있을경우 4번째 파라미터로 던지기 즉 1/20/42(서울시)/영현빌딩 이런식으로) - const rainRes = await getFectch('wr', "/reuseFc/rainyInfoList/1/20/42"); + const rainRes = await getFectch("wr", "/reuseFc/rainyInfoList/1/20/42"); // 여기서 상태 업데이트 return set((state: rainFacState) => ({ ...state, rain: { ...state.rain, - rainRes:rainRes, - isInit: false - } + rainRes: rainRes, + isInit: false, + }, })); } catch (error) { - console.log('error', error); + console.log("error", error); } finally { - console.log('finally'); + console.log("finally"); } }, dataInit: () => set(async (state: rainFacState) => { - console.log(" state ", state.rain.bdstObj) - return ({ + console.log(" state ", state.rain); + return { rain: { ...state.rain, - isInit: false, - }, - }) + }, + }; }), - rainReg:(data:RainyInfoResponse)=> - set(async(state:rainFacState) =>{ - try{ - const res= postFectch('/reuseFc/rainyInfo' , data) - - }catch (e){ - alert('등록이 오류입니다.') - }finally{ - alert('등록이 완료되었습니다.') - } + rainReg: (data: RainyBuilding) => + set(async () => { + try { + const res = postFectch("/reuseFc/rainyInfo", data); + console.log("res", res); + } catch (e) { + console.log("e", e); + alert("등록이 오류입니다."); + } finally { + alert("등록이 완료되었습니다."); } - ), - rainUpdate:(data:RainyInfoResponse)=> - set(async(state:rainFacState) =>{ - try{ - const res= putFectch('/reuseFc/rainyInfo' , data) - - }catch (e){ - alert('업데이트 오류입니다.') - }finally{ - alert('업데이트가 완료되었습니다.') - } - - + }), + rainUpdate: (data: RainyBuilding) => + set(async () => { + try { + const res = putFectch("/reuseFc/rainyInfo", data); + console.log("res", res); + } catch (e) { + console.log("e", e); + alert("업데이트 오류입니다."); + } finally { + alert("업데이트가 완료되었습니다."); } - ), + }), }; }; diff --git a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx index b2ea6404f..a8591ff4a 100644 --- a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx @@ -1,30 +1,29 @@ "use client"; -import { Form, FormField, SelectBox } from "@common/business_components/ui"; -import { Button, Input } from "@common/components/ui"; -import { zodResolver } from "@hookform/resolvers/zod"; -import { useForm } from "react-hook-form"; -import { z } from "zod"; -import { FormUi } from "@common/business_components"; import { useWrStore } from "@/app/store"; import { selectClass, - type RainyInfoResponse, + type RainyBuilding, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; -import { useEffect } from "react"; import { bdstDefZod, rainDefZod, rainZod, } from "@/components/lib/type/zod/fcltReg/controlZod"; +import { DatePicker, FormUi } from "@common/business_components"; +import { Form, FormField, SelectBox } from "@common/business_components/ui"; +import { Button, Input } from "@common/components/ui"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { useEffect } from "react"; +import { useForm } from "react-hook-form"; +import { z } from "zod"; import BdstReg from "../bdstReg/component"; -import { DatePicker } from "@common/business_components"; export function RainRegForm({ rainForm, isModal, }: { - rainForm: RainyInfoResponse | undefined; + rainForm: RainyBuilding | undefined; isModal: boolean; }) { const formSchema = z.object(rainZod); @@ -40,7 +39,7 @@ export function RainRegForm({ }, }); - const { rain, code, rainReg, rainUpdate, init } = useWrStore( + const { code, rainReg, rainUpdate, init } = useWrStore( (state) => state ); const { rainFcltCd } = code; @@ -112,31 +111,31 @@ export function RainRegForm({ oilqMeasMthd: rainObj?.oilqMeasMthd, }; regRainForm.reuseBuilding[0] = { - ...rainForm.reuseBuilding[0], + ...rainForm?.reuseBuilding[0], instlCmptnDt: raw.instlCmptnDt, - instlCst: raw.instlCst || rainForm.reuseBuilding[0]?.instlCst, + instlCst: raw.instlCst || rainForm?.reuseBuilding[0]?.instlCst, instlCstSprtYn: - raw.instlCstSprtYn || rainForm.reuseBuilding[0]?.instlCstSprtYn, + raw.instlCstSprtYn || rainForm?.reuseBuilding[0]?.instlCstSprtYn, instlCstSprtAmt: - raw.instlCstSprtAmt || rainForm.reuseBuilding[0]?.instlCstSprtAmt, + raw.instlCstSprtAmt || rainForm?.reuseBuilding[0]?.instlCstSprtAmt, grntchBdstCertYn: - raw.grntchBdstCertYn || rainForm.reuseBuilding[0]?.grntchBdstCertYn, + raw.grntchBdstCertYn || rainForm?.reuseBuilding[0]?.grntchBdstCertYn, grntchBdstCertYr: - raw.grntchBdstCertYr || rainForm.reuseBuilding[0]?.grntchBdstCertYr, + raw.grntchBdstCertYr || rainForm?.reuseBuilding[0]?.grntchBdstCertYr, grntchBdstCertNo: - raw.grntchBdstCertNo || rainForm.reuseBuilding[0]?.grntchBdstCertNo, + raw.grntchBdstCertNo || rainForm?.reuseBuilding[0]?.grntchBdstCertNo, grntchBdstCertGrd: - raw.grntchBdstCertGrd || rainForm.reuseBuilding[0]?.grntchBdstCertGrd, - bdstUsgCd: raw.bdstUsgCd || rainForm.reuseBuilding[0]?.bdstUsgCdd, - lawTrgtYn: raw.lawTrgtYn || rainForm.lawTrgtYn, + raw.grntchBdstCertGrd || rainForm?.reuseBuilding[0]?.grntchBdstCertGrd, + bdstUsgCd: raw.bdstUsgCd || rainForm?.reuseBuilding[0]?.bdstUsgCd, + lawTrgtYn: raw.lawTrgtYn || rainForm?.reuseBuilding[0]?.lawTrgtYn, }; } if (isModal) { - rainReg(regRainForm); + rainReg(raw); } else { - rainUpdate(regRainForm); + rainUpdate(raw); } init(); From 05b3b0675f59e3e2fe19d4c740561bbc48c739fd Mon Sep 17 00:00:00 2001 From: truthwing Date: Tue, 1 Apr 2025 13:12:17 +0900 Subject: [PATCH 10/11] =?UTF-8?q?=ED=85=8C=EC=9D=B4=EB=B8=94=EC=97=90=20ob?= =?UTF-8?q?ject=20=ED=83=80=EC=9E=85=EB=8F=84=20=EB=B0=9B=EC=9D=84=20?= =?UTF-8?q?=EC=88=98=20=EC=9E=88=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/common/business_components/src/ui/table/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx index 9635a7e21..d536a1f2f 100644 --- a/packages/common/business_components/src/ui/table/index.tsx +++ b/packages/common/business_components/src/ui/table/index.tsx @@ -3,7 +3,7 @@ import UiPageNations from "./uiPageNations"; type UiTableProps = { headName: React.ReactNode | undefined; - tableData: { [key: string]: string | number | boolean }[]; + tableData: { [key: string]: string | number | boolean | object}[]; headlist: UiHeadProps[]; pageSize: number; total: number; @@ -34,7 +34,7 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa } - {tableData?.map((el: { [key: string]: string | number | boolean }, index) => ( + {tableData?.map((el: { [key: string]: string | number | boolean | object}, index) => ( {headlist?.map((head) => ( cellClick && cellClick(index)} key={head.id + index}>{el[head.id]} From 801966059375d5544bccf627269d124a71a7a6fa Mon Sep 17 00:00:00 2001 From: leedj312 Date: Wed, 2 Apr 2025 13:02:53 +0900 Subject: [PATCH 11/11] =?UTF-8?q?=EB=B9=97=EB=AC=BC=EC=9E=AC=EC=9D=B4?= =?UTF-8?q?=EC=9A=A9=20=EB=93=B1=EB=A1=9D=20=EC=88=98=EC=A0=95=20=EC=A1=B0?= =?UTF-8?q?=ED=9A=8C=20=20=EA=B8=B0=EB=8A=A5=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../app/ruseFcltMng/fcltReg/rainReg/page.tsx | 19 +- apps/wr/app/store/common/code/index.ts | 13 +- .../ruseFcltMng/fcltReg/bdstReg/index.tsx | 50 +- .../ruseFcltMng/fcltReg/rainReg/index.tsx | 246 ++++++++-- apps/wr/components/lib/api/index.ts | 3 +- apps/wr/components/lib/config/api.ts | 0 apps/wr/components/lib/config/env.ts | 11 - apps/wr/components/lib/config/index.ts | 12 +- apps/wr/components/lib/func/commom.ts | 16 + .../lib/type/zod/fcltReg/controlZod.ts | 101 ---- .../ui/form/fcltReg/bdstReg/component.tsx | 442 ++++++++++-------- .../ui/form/fcltReg/rainReg/component.tsx | 174 +++---- .../components/ui/modal/bdstReg/component.tsx | 70 ++- 13 files changed, 665 insertions(+), 492 deletions(-) delete mode 100644 apps/wr/components/lib/config/api.ts delete mode 100644 apps/wr/components/lib/config/env.ts create mode 100644 apps/wr/components/lib/func/commom.ts delete mode 100644 apps/wr/components/lib/type/zod/fcltReg/controlZod.ts diff --git a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx index d5ebba35f..789b74ab9 100644 --- a/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx +++ b/apps/wr/app/ruseFcltMng/fcltReg/rainReg/page.tsx @@ -87,8 +87,8 @@ export default function Home() { return ( <> -
-
+
+
<SearchDiv> <SearchFormLeft> @@ -100,8 +100,6 @@ export default function Home() { throw new Error("Function not implemented."); }} /> - {/* <div className='w-4/5 grid grid-cols-12 gap-1 mx-4'> - </div> */} </SearchFormLeft> <SearchFormRight> <Button className="mr-4 rounded-lg">조회</Button> @@ -111,13 +109,12 @@ export default function Home() { body={<BdstReg></BdstReg>} bodyClass="sm:max-w-7xl" /> - {/* <Button className='mr-4 rounded-lg' onClick={()=>bdstRegModal('ㅁ',divTest())}>신규등록</Button> */} </SearchFormRight> - {/* <div className='w-1/5 flex items-center justify-end'> - </div> */} </SearchDiv> </div> - <div className="colsapn-1"> + </div> + <div className="grid grid-cols-6 gap-4 "> + <div className="col-span-4"> <ListDiv> <UiTable tableData={bdstTable || []} @@ -131,16 +128,18 @@ export default function Home() { </UiTable> </ListDiv> </div> - <div className="colsapn-1 max-h-full ovreflow-y-scroll"> + <div className="col-span-2 max-h-full ovreflow-y-scroll"> <ListDiv> <ScrollArea> <RainRegForm - rainForm={rainForm || null} + rainForm={rainForm || undefined} isModal={false} ></RainRegForm> </ScrollArea> </ListDiv> </div> + + </div> </ContentsDiv> </> diff --git a/apps/wr/app/store/common/code/index.ts b/apps/wr/app/store/common/code/index.ts index dc92e0863..3d1250119 100644 --- a/apps/wr/app/store/common/code/index.ts +++ b/apps/wr/app/store/common/code/index.ts @@ -1,7 +1,7 @@ import { getFectch } from "@/components/lib/api"; // Description: 공통코드 -type selectArray = { +export type selectArray = { text: string; val: string | number; }; @@ -44,9 +44,18 @@ export const rainFcltCd = [ { val: "10", text: "확인불가" }, ]; +export const chBuCd = [ + { val: "1", text: "증축" }, + { val: "2", text: "개축" }, + { val: "3", text: "재축" }, +] + + + export type comCodeState = { code: { isInit: boolean; + chBuCd:selectArray[] rainFcltCd: selectArray[]; bdstUsgCd: selectArray[]; cityCd: selectArray[]; @@ -89,6 +98,7 @@ export const comCodeStateExport: comCodeState = { isInit: false, rainFcltCd: rainFcltCd, bdstUsgCd: bdstUsgCd, + chBuCd:chBuCd, cityCd: [], sggCd: [], yn:yn @@ -126,6 +136,7 @@ export const codeActionExport: (set: any) => comCodeActions = (set: any) => { }, })); }, + divCityCd: async(cd: number) => { set((state: comCodeState) => ({ code: { diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx index 20cf4cdb6..ffa920f39 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/bdstReg/index.tsx @@ -1,4 +1,5 @@ import { getFectch } from "@/components/lib/api"; +import type { RainyBuilding } from "../rainReg"; type TableUpperProps = { id: string; @@ -18,24 +19,30 @@ type TableUpperProps = { { id: "archChgArea", title: "면적", upName: "upChangeRe", upSequnce: 3 }, ]; -const bdstBase: bdstType[] = []; +const bdstBase: RainyBuilding[] = []; + + export type bdstFulType = bdstState & bdstActions; export type bdstState = { bdst: { - bdstBase: bdstType[]; + bdstBase: RainyBuilding[]; moUpHeadList:TableUpperProps[] }; }; type bdstActions = { - findBdst: (val: string) => Promise<void>; + findBdst: (sggCd:string, searchTxt:string) => void ; }; - + const findBdstInfo = async(sggCd:string, searchTxt:string)=>{ + return await getFectch('wr', `/reuseFc/building/${sggCd}`+(searchTxt?`/${searchTxt}`:'')) + + } + export const bdstStateExport: bdstState = { bdst: { bdstBase: bdstBase, // Updated to match the array type @@ -47,24 +54,25 @@ export const bdstActionsExport: (set: any) => bdstActions = ( set: any ) => { return { - findBdst: async(val:string) =>{ - try { - console.log(" val ", val); - // (val!=='' ?"/"+val:'') - const res = await getFectch('wr', "/reuseFc/building/42" +(val!=='' ?"/"+val:'')); - console.log("res ", res) - // 여기서 상태 업데이트 - return set((state: bdstState) => ({ - bdst: { - ...state.bdst, - bdstBase:res, + + findBdst: async(sggCd:string, searchTxt:string) =>{ + try{ + + const bdst = await findBdstInfo(sggCd, searchTxt); + return set((state:bdstState) =>({ + ...state, + bdst:{ + ...state.bdst, + bdstBase:bdst + } + + })) + }catch(error1){ + console.log("error ", error1) + + }finally{ + } - })); - } catch (error) { - console.log('error', error); - } finally { - console.log('finally'); - } }, }; diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx index 9268edcb5..2e06ebe8a 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx @@ -1,27 +1,119 @@ +import type { selectArray } from "@/app/store/common/code"; import { getFectch, postFectch, putFectch } from "@/components/lib/api"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { useForm } from "react-hook-form"; +import { z } from "zod"; + + + + +export const rainZod = +{ ctpvCd: z.number(), + sggCd: z.number(), + bdstNm: z.string(), + daddr: z.string(), + frstArchPrmsnDt: z.date(), + archArea: z.number(), + bdstInfoPk: z.number().nullish() , + lawTrgtYn: z.string().nullish(), + bdstUsgCd: z.number(), + bdstRuseFcltPk: z.number().nullish(), + bdstInfoFk: z.number().nullish(), + operMngCd: z.number().nullish(), + anlOperCst: z.number().nullish(), + instlCmptnDt: z.date(), + instlCst: z.number(), + instlCstSprtYn: z.string(), + instlCstSprtAmt: z.number(), + grntchBdstCertYn: z.string(), + grntchBdstCertNo: z.string(), + grntchBdstCertGrd: z.string(), + grntchBdstCertYr: z.string(), + bdstReuseFcltFk:z.number().nullish(), + pntfColKnd: z.string(), + pntfColArea: z.number(), + dtfcltCpct:z.number().nullish(), + filtrTrtmfctCpct: z.number(), + filtrTrtmfctYn: z.string(), + filtrTrtmfctPrs: z.string(), + annRnwtQty:z.number().nullish(), + oilqMeasMthd:z.string().nullish(), + + chgBuilding: z.array( + z.object({ + archChgPrmsnDt: z.date().nullish(), + archChgArea: z.number().nullish(), + bdstChgNm: z.string().nullish(), + }) + ).default([]), // + + } + + +export const rainDefZod= { + instlCmptnDt: new Date(), + instlCst: 0, + pntfColKnd: "", + pntfColArea: 0, + filtrTrtmfctYn: "Y", + filtrTrtmfctCpct: 0, + filtrTrtmfctPrs: "", + instlCstSprtYn: "", + instlCstSprtAmt: 0, + grntchBdstCertYn: "", + grntchBdstCertYr: "", + grntchBdstCertNo: "", + grntchBdstCertGrd: "", +} + + +export const bdstDefZod={ + ctpvCd: 0, // 시도 + sggCd: 0, // 시군구 + daddr: '', // 위치 + bdstUsgCd: 0, // 건축물용도 + frstArchPrmsnDt: new Date(), // 최초건축허가일 + archArea: 0, // 건축면적 + lawTrgtYn: '', // 법적의무대상여부 + bdstNm: '', + + bdstChgnm:'', + archChgPrmsnDt: new Date(), // 건축변경 허가일시 + archChgArea: 0, // 변경 면적 +} + + +export type chgBuilding={ + bdstInfoFk: number, + archChgPrmsnDt: Date, + archChgArea: number, + bdstChgNm: string +} + export type RainyBuilding = { - ctpvCd: string; - sggCd: string; + ctpvCd: number; + sggCd: number; bdstNm: string; daddr: string; - frstArchPrmsnDt: string; + frstArchPrmsnDt: Date; archArea: string; - archChgArea: string; + archChgArea: number; bdstInfoPk: number; reuseBuilding: reuseBuilding[]; + chgBuilding:chgBuilding[] }; export type reuseBuilding = { lawTrgtYn: string|undefined; - bdstUsgCd: string|undefined; + bdstUsgCd: number|undefined; bdstRuseFcltPk: number; bdstInfoFk: number; operMngCd: number; anlOperCst: number; - instlCmptnDt: Date; + instlCmptnDt: Date|undefined; instlCst: number|undefined; - archChgPrmsnDt: string; + //archChgPrmsnDt: string; instlCstSprtYn: string|undefined; instlCstSprtAmt: number|undefined; grntchBdstCertYn: string|undefined; @@ -65,11 +157,56 @@ export const upHeadList: TableUpperProps[] = [ const rainRes: RainyBuilding[] = []; -export type selectArray = { - text: string; - val: string; + + const regRainForm:RainyBuilding = { + ctpvCd: 0, + sggCd: 0, + bdstNm: "", + daddr: "", + frstArchPrmsnDt:new Date(), + archArea: "", + archChgArea: 0, + bdstInfoPk: 0, + reuseBuilding: [{ + rainyObj: { + bdstReuseFcltFk: 0, + pntfColKnd: undefined, + pntfColArea: undefined, + dtfcltCpct: 0, + filtrTrtmfctCpct: undefined, + filtrTrtmfctYn: undefined, + filtrTrtmfctPrs: undefined, + annRnwtQty: 0, + oilqMeasMthd: undefined + }, + lawTrgtYn: undefined, + bdstUsgCd: undefined, + bdstRuseFcltPk: 0, + bdstInfoFk: 0, + operMngCd: 0, + anlOperCst: 0, + instlCmptnDt: undefined, + instlCst: undefined, + // archChgPrmsnDt: "", + instlCstSprtYn: undefined, + instlCstSprtAmt: undefined, + grntchBdstCertYn: undefined, + grntchBdstCertNo: undefined, + grntchBdstCertGrd: undefined, + grntchBdstCertYr: undefined + }], + //추가됨 + chgBuilding:[{ + bdstInfoFk: 0, + archChgPrmsnDt: new Date(), + archChgArea: 0, + bdstChgNm: "" + + }] }; + + export const selectClass = "w-full h-full text-2xl"; const selectYN = [ { text: "Y", val: "1" }, @@ -81,6 +218,8 @@ export type rainFacState = { upHeadList: TableUpperProps[]; selectYN: selectArray[]; rainRes: RainyBuilding[]; + regRainForm:RainyBuilding, + }; }; type rainFacSActions = { @@ -98,9 +237,19 @@ export const rainFacStateExport: rainFacState = { rainRes: rainRes, upHeadList: upHeadList, selectYN: selectYN, + regRainForm:regRainForm, + }, }; +const findBdstInfo = async(sggCd:string, searchTxt:string)=>{ + return await getFectch('wr', `/reuseFc/building/${sggCd}/${searchTxt}`) + +} + +const initFetch = async () => { + return await getFectch("wr", "/reuseFc/rainyInfoList/1/20/41"); +}; export const rainFacActionsExport: (set: any) => rainFacSActions = ( set: any ) => { @@ -108,7 +257,7 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( init: async () => { try { // 파라이터 수정 통합관리자 =0, 시관리자=시코드, 시군구 관리자= 시군구 코드 를 세번째 파라미터로 지정 / 건축물 서치가 있을경우 4번째 파라미터로 던지기 즉 1/20/42(서울시)/영현빌딩 이런식으로) - const rainRes = await getFectch("wr", "/reuseFc/rainyInfoList/1/20/42"); + const rainRes = await initFetch(); // 여기서 상태 업데이트 return set((state: rainFacState) => ({ ...state, @@ -125,7 +274,7 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( } }, dataInit: () => - set(async (state: rainFacState) => { + set((state: rainFacState) => { console.log(" state ", state.rain); return { rain: { @@ -134,30 +283,51 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = ( }, }; }), + rainReg: async (data: RainyBuilding) => { + try { + const res = await postFectch("/reuseFc/rainyInfo", data); + const rainRes = await initFetch(); + set((state: rainFacState) => ({ + ...state, + rain: { + ...state.rain, + rainRes: rainRes, + isInit: false, + }, + })); + } catch (e) { + console.log("e", e); + alert("등록 오류입니다."); + } finally { + alert("등록이 완료되었습니다."); + } + }, + rainUpdate: async (data: RainyBuilding) => { + try { + console.log("data ", data) + const res = await putFectch("/reuseFc/rainyInfo", data); + console.log('rainUpdate', res); + if(res.ok){ + alert(" 수정이 완료되었습니다.") + } + + const rainRes = await initFetch(); + set((state: rainFacState) => ({ + ...state, + rain: { + ...state.rain, + rainRes: rainRes, + isInit: false, + }, + })); + } catch (e) { + console.log("e", e); + alert("업데이트 오류입니다."); + } finally { + } + } + }} + + + - rainReg: (data: RainyBuilding) => - set(async () => { - try { - const res = postFectch("/reuseFc/rainyInfo", data); - console.log("res", res); - } catch (e) { - console.log("e", e); - alert("등록이 오류입니다."); - } finally { - alert("등록이 완료되었습니다."); - } - }), - rainUpdate: (data: RainyBuilding) => - set(async () => { - try { - const res = putFectch("/reuseFc/rainyInfo", data); - console.log("res", res); - } catch (e) { - console.log("e", e); - alert("업데이트 오류입니다."); - } finally { - alert("업데이트가 완료되었습니다."); - } - }), - }; -}; diff --git a/apps/wr/components/lib/api/index.ts b/apps/wr/components/lib/api/index.ts index ff690f411..0f7e6c0ee 100644 --- a/apps/wr/components/lib/api/index.ts +++ b/apps/wr/components/lib/api/index.ts @@ -1,6 +1,6 @@ //8880 -import { DEV_URL_COMMON, DEV_URL_WR } from "../config/env"; +import { DEV_URL_COMMON, DEV_URL_WR } from "../config/"; @@ -36,6 +36,7 @@ export const postFectch = async (url: string, params: any) => { export const putFectch = async (url: string, params: any) => { + const response = await fetch(DEV_URL_WR+url, { method: "PUT", headers: { diff --git a/apps/wr/components/lib/config/api.ts b/apps/wr/components/lib/config/api.ts deleted file mode 100644 index e69de29bb..000000000 diff --git a/apps/wr/components/lib/config/env.ts b/apps/wr/components/lib/config/env.ts deleted file mode 100644 index 24352c2f3..000000000 --- a/apps/wr/components/lib/config/env.ts +++ /dev/null @@ -1,11 +0,0 @@ - -const LOCAL_PORT = "3000"; -const DEV_PORT = "8880"; - - -const DEV_PORT_COMMON = "8881"; // common - -export const LOCAL_URL_WR = `http://localhost:${LOCAL_PORT}/api/v1`; -export const DEV_URL_WR = `http://192.168.1.193:${DEV_PORT}/api/v1`; - -export const DEV_URL_COMMON = `http:///192.168.1.193:${DEV_PORT_COMMON}/api/v1`; diff --git a/apps/wr/components/lib/config/index.ts b/apps/wr/components/lib/config/index.ts index e7f55b887..24352c2f3 100644 --- a/apps/wr/components/lib/config/index.ts +++ b/apps/wr/components/lib/config/index.ts @@ -1 +1,11 @@ -export * from './env'; \ No newline at end of file + +const LOCAL_PORT = "3000"; +const DEV_PORT = "8880"; + + +const DEV_PORT_COMMON = "8881"; // common + +export const LOCAL_URL_WR = `http://localhost:${LOCAL_PORT}/api/v1`; +export const DEV_URL_WR = `http://192.168.1.193:${DEV_PORT}/api/v1`; + +export const DEV_URL_COMMON = `http:///192.168.1.193:${DEV_PORT_COMMON}/api/v1`; diff --git a/apps/wr/components/lib/func/commom.ts b/apps/wr/components/lib/func/commom.ts new file mode 100644 index 000000000..0351f2fc9 --- /dev/null +++ b/apps/wr/components/lib/func/commom.ts @@ -0,0 +1,16 @@ +import type { selectArray } from "@/app/store/common/code"; + + + + + +export const getCity = (val: string, sggCd: selectArray[]) => { + const data = sggCd + .filter((item) => String(item.val).substring(0, 2) === val) + .map((item) => ({ + val: String(item.val), + text: item.text // 한국어 텍스트 + })); + return data + + }; diff --git a/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts b/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts deleted file mode 100644 index 796167e91..000000000 --- a/apps/wr/components/lib/type/zod/fcltReg/controlZod.ts +++ /dev/null @@ -1,101 +0,0 @@ -import { z } from "zod"; - - -export const rainZod = -{ ctpvCd: z.string(), - sggCd: z.string(), - bdstNm: z.string(), - daddr: z.string(), - frstArchPrmsnDt: z.date(), - archArea: z.number(), - archChgArea: z.string(), - bdstInfoPk: z.number(), - - lawTrgtYn: z.string(), - bdstUsgCd: z.string(), - bdstRuseFcltPk: z.number(), - bdstInfoFk: z.number(), - operMngCd: z.number(), - anlOperCst: z.number(), - instlCmptnDt: z.date(), - instlCst: z.number(), - archChgPrmsnDt: z.string(), - instlCstSprtYn: z.string(), - instlCstSprtAmt: z.number(), - grntchBdstCertYn: z.string(), - grntchBdstCertNo: z.string(), - grntchBdstCertGrd: z.string(), - grntchBdstCertYr: z.string(), - - bdstReuseFcltFk:z.number(), - pntfColKnd: z.string(), - pntfColArea: z.number(), - dtfcltCpct:z.number(), - filtrTrtmfctCpct: z.number(), - filtrTrtmfctYn: z.string(), - filtrTrtmfctPrs: z.string(), - annRnwtQty:z.number(), - oilqMeasMthd:z.string(), -} - -// = { -// instlCmptnDt: z.date(), -// instlCst: z.number(), -// pntfColKnd: z.string(), -// pntfColArea: z.number(), -// filtrTrtmfctPrs: z.string(), -// filtrTrtmfctYn: z.string(), -// filtrTrtmfctCpct: z.number(), -// instlCstSprtYn: z.string(), -// instlCstSprtAmt: z.number(), -// grntchCstSprtYn: z.string(), -// // grntchCstSprtCst: z.string(), -// grntchBdstCertYn: z.string(), -// grntchBdstCertYr: z.string(), -// grntchBdstCertNo: z.string(), -// grntchBdstCertGrd: z.string(), -// } - -export const rainDefZod= { - instlCmptnDt: new Date(), - instlCst: 0, - pntfColKnd: "", - pntfColArea: 0, - filtrTrtmfctYn: "Y", - filtrTrtmfctCpct: 0, - filtrTrtmfctPrs: "", - instlCstSprtYn: "", - instlCstSprtAmt: 0, - grntchCstSprtYn: "", - // grntchCstSprtCst: "", - grntchBdstCertYn: "", - grntchBdstCertYr: "", - grntchBdstCertNo: "", - grntchBdstCertGrd: "", -} -// export const bdstZod ={ -// ctpvCd: z.string(), // 시도 -// sggCd: z.string(), // 시군구 -// daddr: z.string(), // 위치 -// bdstUsgCd: z.string(), // 건축물용도 -// frstArchPrmsnDt: z.date(), // 최초건축허가일 -// archArea: z.number(), // 건축면적 -// lawTrgtYn: z.string(), // 법적의무대상여부 -// // archChgPrmsnDt: z.string(), // 건축변경 허가일시 -// // archChgArea: z.number(), // 변경 면적 -// bdstNm: z.string(), -// } - -export const bdstDefZod={ - ctpvCd: '', // 시도 - sggCd: '', // 시군구 - daddr: '', // 위치 - bdstUsgCd: '', // 건축물용도 - frstArchPrmsnDt: new Date(), // 최초건축허가일 - archArea: 0, // 건축면적 - lawTrgtYn: '', // 법적의무대상여부 - // archChgPrmsnDt: '', // 건축변경 허가일시 - // archChgArea: 0, // 변경 면적 - bdstNm: '', -} - diff --git a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx index 7445af885..277c1f0cf 100644 --- a/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/bdstReg/component.tsx @@ -1,24 +1,28 @@ import { useWrStore } from "@/app/store"; -import { selectClass } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; -import { FormField, FormUi, SelectBox } from "@common/business_components"; +import type { selectArray } from "@/app/store/common/code"; +import { selectClass, type RainyBuilding } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; +import { getCity } from "@/components/lib/func/commom"; +import type { objSearchType } from "@/components/ui/modal/bdstReg/component"; +import { FormField, FormUi, DatePicker, SelectBox } from "@common/business_components"; import { Button, Input } from "@common/components"; +import { useEffect, useRef, useState } from "react"; import { useFieldArray } from "react-hook-form"; -export default function BdstReg(form: any ) { +export default function BdstReg({ form, ud }: { form: any, ud: RainyBuilding }) { const { code } = useWrStore((state) => { return state; }); const { fields, append, remove } = useFieldArray({ - control: form.control, - name: "history" + name: "chgBuilding", + control: form?.control, // Provide a fallback to avoid errors }); const plusHist = () => { append({ - bdstNm: '', - daddr: '', - bdstUsgCd: '' + bdstNm: "", + daddr: "", + bdstUsgCd: "", }); }; @@ -26,193 +30,260 @@ export default function BdstReg(form: any ) { if (fields.length > 0) { remove(fields.length - 1); } - }; + }; + const [selectSgg, setSelectSgg] = useState<selectArray[] | undefined>() + const [objSearch, setObjSearch] = useState<objSearchType>({sgg:"",city:""}); + + const getSelCity = (val: string) => { + const data= getCity(val,code.sggCd) + setSelectSgg(data); + const sgg =form.getValues('sggCd') + + setObjSearch({ city:val , sgg:''}) + + }; + + const getSgg = (val: string | number) => { + + const sgg =form.getValues('sggCd') + setObjSearch({...objSearch,sgg: val!=''?String(val):sgg }) + }; + + // useEffect(()=>{ + // console.log("18", ud); + // console.log("form", form.getValues()); + // const city =form?.getValues('ctpvCd') + // const sgg =form?.getValues('sggCd') + // console.log('city ㄴㄴㄴ ', city) + // console.log('sgg ', sgg) + // if(city>0 && sgg>0){ + // console.log(' if city ', city) + + // // form?.setValue('ctpvCd' , city) + // //form?.setValue('sggCd' , sgg) + // //setSelectSgg(getCity(city,code.sggCd)) + // } + // },[ud]) + useEffect(()=>{ + const city =form.getValues('ctpvCd') + const sgg =form.getValues('sggCd') + setObjSearch({city:city , sgg:sgg }) + + }, [selectSgg]) + + useEffect(() => { + const subscription = form.form?.watch((value) => { + console.log('vale', value) + }); + + return () => subscription?.unsubscribe(); + }, [form]); + + + const safeDate = (value: any): Date | undefined => { + const date = new Date(value); + return isNaN(date.getTime()) ? undefined : date; + }; + + return ( <> - - <h1 className="bg-gray-400 text-xl text-center border-2 p-2 mt-4 pl-6"> - 건축물 시설 정보 - </h1> - <div className="grid grid-cols-6 gap-2 mt-4"> - <div className="col-span-3"> - <FormField - control={form.control} - name="ctpvCd" - render={({ field }) => ( - <FormUi label="시도"> - <SelectBox - className={""} - selectClass={selectClass} - label={""} - selectArray={code.cityCd} - onSelectValue={(val) => { - field.onChange(val); - }} - value={field.value} - /> - </FormUi> - )} - /> - </div> - <div className="col-span-3"> - <FormField - control={form.control} - name="sggCd" - render={({ field }) => ( - <FormUi label="시군구"> - <SelectBox - className={""} - selectClass={selectClass} - label={""} - selectArray={code.sggCd } - onSelectValue={(val) => { - field.onChange(val); - }} - value={field.value} - /> - </FormUi> - )} - /> - </div> + <h1 className="bg-gray-400 text-xl text-center border-2 p-2 mt-4 pl-6"> + 건축물 시설 정보 + </h1> + <div className="grid grid-cols-6 gap-2 mt-4"> + <div className="col-span-3"> + <FormField + control={form.control} + name="ctpvCd" + render={({ field }) => ( + <FormUi label="시도"> + <SelectBox + className="col-span-3 " + label={""} + selectClass={selectClass} + selectArray={code.cityCd} + + onSelectValue={(val)=>{ + getSelCity(String(val)) + field.onChange(Number(val) ); + } + + } + value={field.value} + + /> + </FormUi> + )} + /> </div> - <div className="grid grid-cols-6 gap-2 mt-4 "> - <div className="col-span-2"> - <FormField - control={form.control} - name="bdstNm" - render={({ field }) => ( - <FormUi label="건축물명"> - <Input - className="" - placeholder="1,000,000" - type="text" - {...field} - /> - </FormUi> - )} - /> - </div> - <div className="col-span-2"> - <FormField - control={form.control} - name="daddr" - render={({ field }) => ( - <FormUi label="위치"> - <Input - className="" - placeholder="1,000,000" - type="search" - {...field} - /> - </FormUi> - )} - /> - </div> - <div className="col-span-2"> - <FormField - control={form.control} - name="bdstUsgCd" - render={({ field }) => ( - <FormUi label="건축물용도"> - <SelectBox - className={""} - selectClass={selectClass} - label={""} - selectArray={code.bdstUsgCd} - onSelectValue={(val) => { - field.onChange(val); - }} - value={field.value} - /> - </FormUi> - )} - /> - </div> - <div className="col-span-2"> - <FormField - control={form.control} - name="frstArchPrmsnDt" - render={({ field }) => ( - <FormUi label="최초건축허가일"> - <Input + <div className="col-span-3"> + <FormField + control={form.control} + name="sggCd" + render={({ field }) => ( + <FormUi label="시군구"> + <SelectBox + className="col-span-3" + label={""} + selectClass={selectClass} + selectArray={selectSgg? selectSgg:code.sggCd || []} + onSelectValue={(val) =>{ + getSgg(val) + field.onChange(Number(val)) + }} + value={field.value} + + /> + </FormUi> + )} + /> + </div> + </div> + <div className="grid grid-cols-6 gap-2 mt-4 "> + <div className="col-span-2"> + <FormField + control={form.control} + name="bdstNm" + render={({ field }) => ( + <FormUi label="건축물명"> + <Input className="" - type="date" - onChange={(e) => - field.onChange( - e.target.value ? new Date(e.target.value) : undefined - ) - } - value={ - field.value ? field?.value.toISOString().split("T")[0] : "" - } - /> - </FormUi> - )} - /> - </div> - <div className="col-span-2"> - <FormField - control={form.control} - name="archArea" - render={({ field }) => ( - <FormUi label="건축면적(m³)"> - <Input - className="" - placeholder="1,000,000" - type="number" - {... field} - onChange={(e) => { - const value = e.target.value; - field.onChange(value === '' ? '' : Number(value)); - }} - /> - </FormUi> - )} - /> - </div> - <div className="col-span-2"> - <FormField - control={form.control} - name="" - render={({ field }) => ( - <FormUi label="법정의무대상여부"> - <SelectBox - className={""} - selectClass={selectClass} - label={""} - selectArray={code.yn} - onSelectValue={(val) => { - field.onChange(val); - }} - value={field.value} - /> - </FormUi> - )} - /> - </div> + placeholder="1,000,000" + type="text" + {...field} + /> + </FormUi> + )} + /> </div> - <h1 className="bg-gray-400 text-xl text-center border-2 p-2 mt-4"> - 중축, 개축, 증축 - </h1> - <div className="flex justify-end gap-2"> - <Button className="rounded-lg" onClick={plusHist}>이력추가</Button> - <Button className="rounded-lg bg-red-500 text-white" onClick={removeLastItem}>삭제</Button> + <div className="col-span-2"> + <FormField + control={form.control} + name="daddr" + render={({ field }) => ( + <FormUi label="위치"> + <Input + className="" + placeholder="1,000,000" + type="search" + {...field} + /> + </FormUi> + )} + /> </div> + <div className="col-span-2"> + <FormField + control={form.control} + name="bdstUsgCd" + render={({ field }) => ( + <FormUi label="건축물용도"> + <SelectBox + className={""} + selectClass={selectClass} + label={""} + selectArray={code.bdstUsgCd} + onSelectValue={(val) => { + field.onChange(Number(val)); + }} + value={field.value} + /> + </FormUi> + )} + /> + </div> + <div className="col-span-2"> + <FormField + control={form.control} + name="frstArchPrmsnDt" + render={({ field }) => ( + <FormUi label="최초건축허가일"> + <DatePicker + mode={"single"} + field={{ + value: new Date(field.value), + onChange: (date: Date | undefined) => + field.onChange(date), + }} + selectClass={selectClass} + ></DatePicker> + + </FormUi> + )} + /> + </div> + <div className="col-span-2"> + <FormField + control={form.control} + name="archArea" + render={({ field }) => ( + <FormUi label="건축면적(m³)"> + <Input + className="" + placeholder="1,000,000" + type="number" + {...field} + onChange={(e) => { + const value = e.target.value; + field.onChange(value === "" ? "" : Number(value)); + }} + /> + </FormUi> + )} + /> + </div> + <div className="col-span-2"> + <FormField + control={form.control} + name="" + render={({ field }) => ( + <FormUi label="법정의무대상여부"> + <SelectBox + className={""} + selectClass={selectClass} + label={""} + selectArray={code.yn} + onSelectValue={(val) => { + field.onChange(val); + }} + value={field.value} + /> + </FormUi> + )} + /> + </div> + </div> + <h1 className="bg-gray-400 text-xl text-center border-2 p-2 mt-4"> + 중축, 개축, 재축 + </h1> + <div className="flex justify-end gap-2"> + <Button type="button" className="rounded-lg" onClick={plusHist}> + 이력추가 + </Button> + <Button + type="button" + className="rounded-lg bg-red-500 text-white" + onClick={removeLastItem} + > + 삭제 + </Button> + </div> {fields.map((field, index) => ( <div key={field.id} className="grid grid-cols-6 gap-2 mt-4"> <div className="col-span-2"> <FormField control={form.control} - name={`history.${index}.bdstNm`} + name={`chgBuilding.${index}.bdstChgNm`} render={({ field }) => ( <FormUi label="구분"> <SelectBox className={""} selectClass={selectClass} label={""} - selectArray={code.cityCd} + selectArray={code.chBuCd} onSelectValue={(val) => { field.onChange(val); }} @@ -225,15 +296,18 @@ export default function BdstReg(form: any ) { <div className="col-span-2"> <FormField control={form.control} - name={`history.${index}.daddr`} + name={`chgBuilding.${index}.archChgPrmsnDt`} render={({ field }) => ( <FormUi label="허가일"> - <Input - className="" - placeholder="1,000,000" - type="search" - {...field} - /> + <DatePicker + mode={"single"} + field={{ + value: safeDate(field.value) || new Date(), + onChange: (date: Date | undefined) => + field.onChange(date), + }} + selectClass={selectClass} + ></DatePicker> </FormUi> )} /> @@ -241,7 +315,7 @@ export default function BdstReg(form: any ) { <div className="col-span-2"> <FormField control={form.control} - name={`history.${index}.bdstUsgCd`} + name={`chgBuilding.${index}.archChgArea`} render={({ field }) => ( <FormUi label="면적"> <Input diff --git a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx index a8591ff4a..bf57cc97e 100644 --- a/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx +++ b/apps/wr/components/ui/form/fcltReg/rainReg/component.tsx @@ -3,31 +3,25 @@ import { useWrStore } from "@/app/store"; import { selectClass, - type RainyBuilding, -} from "@/app/store/ruseFcltMng/fcltReg/rainReg"; -import { bdstDefZod, rainDefZod, rainZod, -} from "@/components/lib/type/zod/fcltReg/controlZod"; + type RainyBuilding, +} from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { DatePicker, FormUi } from "@common/business_components"; import { Form, FormField, SelectBox } from "@common/business_components/ui"; import { Button, Input } from "@common/components/ui"; import { zodResolver } from "@hookform/resolvers/zod"; -import { useEffect } from "react"; -import { useForm } from "react-hook-form"; +import { useEffect, useState } from "react"; +import { useForm, type UseFormReturn } from "react-hook-form"; import { z } from "zod"; import BdstReg from "../bdstReg/component"; -export function RainRegForm({ - rainForm, - isModal, -}: { - rainForm: RainyBuilding | undefined; - isModal: boolean; -}) { - const formSchema = z.object(rainZod); - const form = useForm<z.infer<typeof formSchema>>({ +export const formToObj = ( + isModal: boolean, + formSchema: z.ZodObject<any, "strip", z.ZodTypeAny, any, any> +) => { + return useForm<z.infer<typeof formSchema>>({ resolver: zodResolver(formSchema), defaultValues: isModal ? { @@ -38,14 +32,26 @@ export function RainRegForm({ ...rainDefZod, }, }); +}; - const { code, rainReg, rainUpdate, init } = useWrStore( - (state) => state - ); +const formSchema = z.object(rainZod); +export type RainFormType = UseFormReturn<z.infer<typeof formSchema>>; + +export function RainRegForm({ + rainForm, + isModal, +}: { + rainForm: RainyBuilding; + isModal: boolean; +}) { + + const form = formToObj(isModal, formSchema); + const { code, rainReg, rainUpdate, rain } = useWrStore((state) => state); const { rainFcltCd } = code; useEffect(() => { - // console.log( " data ", data) + console.log(rainForm); + if (rainForm != null) { const data = rainForm; @@ -55,101 +61,109 @@ export function RainRegForm({ String(data?.reuseBuilding?.at(0)?.rainyObj?.pntfColKnd ?? "") ); let formData; + + if (data?.reuseBuilding?.at(0)) { const rb = data.reuseBuilding?.at(0); formData = { + ...data, ...rb?.rainyObj, ...data.reuseBuilding?.at(0), pntfColKnd: selectedOption ? String(selectedOption.val) : undefined, + frstArchPrmsnDt: new Date(data.frstArchPrmsnDt) }; form.reset(formData); } else { formData = { - ctpvCd: data.ctpvCd, - sggCd: data.sggCd, - bdstNm: data.bdstNm, - daddr: data.daddr, - frstArchPrmsnDt: new Date(data.frstArchPrmsnDt), + ...data }; + form.reset(formData); } } - }, [rainForm, rainFcltCd]); + }, [rainForm]); // form 값이 변경될 때마다 로그 출력 useEffect(() => { - const subscription = form.watch((value) => {}); + const subscription = form.watch((value) => { + }); return () => subscription.unsubscribe(); }, [form]); - function onSubmit(values: z.infer<typeof formSchema>) { - console.log("valuesd"); - console.log(values); - let regRainForm = { ...rainForm }; - const raw = values; - const rawVal = { - ctpvCd: raw?.ctpvCd, + const objToForm = (raw: z.infer<typeof formSchema>) => { + let regRainForm: RainyBuilding; + + // 1. 기본 정보 정리 + const obj = !rainForm ? rain.regRainForm : rainForm; + regRainForm = { + ...obj, + ctpvCd: raw?.ctpvCd , sggCd: raw?.sggCd, daddr: raw?.daddr, bdstNm: raw?.bdstNm, - frstArchPrmsnDt: raw?.frstArchPrmsnDt.toISOString(), + frstArchPrmsnDt: raw?.frstArchPrmsnDt , archArea: raw?.archArea + "", + // archChgArea: raw?.archChgArea || 0, // Ensure archChgArea is always a string }; - // 1. 기본 정보 정리 - if (isModal) - regRainForm = {...rawVal}; - if(regRainForm?.reuseBuilding?.at(0)?.rainyObj){ - const rainObj = regRainForm?.reuseBuilding?.at(0)?.rainyObj; - regRainForm.reuseBuilding[0].rainyObj = { - ...rainObj, - pntfColKnd: raw.pntfColKnd || rainObj?.pntfColKnd, - pntfColArea: raw.pntfColArea || rainObj?.pntfColArea, - filtrTrtmfctCpct: raw.filtrTrtmfctCpct || rainObj?.filtrTrtmfctCpct, - filtrTrtmfctYn: raw.filtrTrtmfctYn || rainObj?.filtrTrtmfctYn, - filtrTrtmfctPrs: raw.filtrTrtmfctPrs || rainObj?.filtrTrtmfctPrs, - oilqMeasMthd: rainObj?.oilqMeasMthd, - }; - regRainForm.reuseBuilding[0] = { - ...rainForm?.reuseBuilding[0], - instlCmptnDt: raw.instlCmptnDt, - instlCst: raw.instlCst || rainForm?.reuseBuilding[0]?.instlCst, - instlCstSprtYn: - raw.instlCstSprtYn || rainForm?.reuseBuilding[0]?.instlCstSprtYn, - instlCstSprtAmt: - raw.instlCstSprtAmt || rainForm?.reuseBuilding[0]?.instlCstSprtAmt, - grntchBdstCertYn: - raw.grntchBdstCertYn || rainForm?.reuseBuilding[0]?.grntchBdstCertYn, - grntchBdstCertYr: - raw.grntchBdstCertYr || rainForm?.reuseBuilding[0]?.grntchBdstCertYr, - grntchBdstCertNo: - raw.grntchBdstCertNo || rainForm?.reuseBuilding[0]?.grntchBdstCertNo, - grntchBdstCertGrd: - raw.grntchBdstCertGrd || rainForm?.reuseBuilding[0]?.grntchBdstCertGrd, - bdstUsgCd: raw.bdstUsgCd || rainForm?.reuseBuilding[0]?.bdstUsgCd, - lawTrgtYn: raw.lawTrgtYn || rainForm?.reuseBuilding[0]?.lawTrgtYn, - }; + const rainObj = regRainForm?.reuseBuilding?.at(0)?.rainyObj; + + if (!regRainForm.reuseBuilding) { + regRainForm.reuseBuilding = []; } + regRainForm.reuseBuilding[0] = { + ...rainForm?.reuseBuilding?.at(0), + + instlCmptnDt: raw.instlCmptnDt, + instlCst: raw.instlCst || rainForm?.reuseBuilding?.at(0)?.instlCst, + instlCstSprtYn: + raw.instlCstSprtYn || rainForm?.reuseBuilding?.at(0)?.instlCstSprtYn, + instlCstSprtAmt: + raw.instlCstSprtAmt || rainForm?.reuseBuilding?.at(0)?.instlCstSprtAmt, + grntchBdstCertYn: + raw.grntchBdstCertYn || rainForm?.reuseBuilding?.at(0)?.grntchBdstCertYn, + grntchBdstCertYr: + raw.grntchBdstCertYr || rainForm?.reuseBuilding?.at(0)?.grntchBdstCertYr, + grntchBdstCertNo: + raw.grntchBdstCertNo || rainForm?.reuseBuilding?.at(0)?.grntchBdstCertNo, + grntchBdstCertGrd: + raw.grntchBdstCertGrd || rainForm?.reuseBuilding?.at(0)?.grntchBdstCertGrd, + bdstUsgCd: raw.bdstUsgCd || rainForm?.reuseBuilding?.at(0)?.bdstUsgCd, + lawTrgtYn: raw.lawTrgtYn || rainForm?.reuseBuilding?.at(0)?.lawTrgtYn, + } + regRainForm.reuseBuilding[0].rainyObj = { + ...rainObj, + pntfColKnd: raw.pntfColKnd || rainObj?.pntfColKnd, + pntfColArea: raw.pntfColArea || rainObj?.pntfColArea, + filtrTrtmfctCpct: raw.filtrTrtmfctCpct || rainObj?.filtrTrtmfctCpct, + filtrTrtmfctYn: raw.filtrTrtmfctYn || rainObj?.filtrTrtmfctYn, + filtrTrtmfctPrs: raw.filtrTrtmfctPrs || rainObj?.filtrTrtmfctPrs, + }; if (isModal) { - rainReg(raw); + rainReg(regRainForm); } else { - rainUpdate(raw); + console.log(" regRainForm ", regRainForm) + rainUpdate(regRainForm); } + }; - init(); + function onSubmit(values: z.infer<typeof formSchema>) { + console.log(values); + objToForm(values); } useEffect(() => { console.log("form errors:", form.formState.errors); }, [form.formState.errors]); + + return ( <div className=""> <Form {...form}> <form onSubmit={form.handleSubmit(onSubmit)}> - {/* <div className="flex justify-between items-center mx-3"> */} <div> <div className="grid grid-cols-12"> <h1 className="pl-3 text-xl col-span-10"> @@ -160,7 +174,7 @@ export function RainRegForm({ </Button> </div> </div> - {isModal ? <BdstReg form={form}></BdstReg> : <></>} + {isModal&&rainForm!=undefined ? <BdstReg form={form} ud={rainForm}/> : <></>} {isModal ? ( <h1 className="pl-3 text-xl col-span-10 mt-4 "> ○ 빗물이용시설 운영정보{" "} @@ -179,20 +193,6 @@ export function RainRegForm({ name="instlCmptnDt" render={({ field }) => ( <FormUi label="설치완료일"> - {/* <Input - className="" - type="date" - onChange={(e) => - field.onChange( - e.target.value ? new Date(e.target.value) : undefined - ) - } - value={ - field.value - ? field?.value.toISOString().split("T")[0] - : "" - } - /> */} <DatePicker mode={"single"} field={{ @@ -394,7 +394,7 @@ export function RainRegForm({ <div className="col-span-3 pl-6"> <FormField control={form.control} - name="grntchCstSprtYn" + name="grntchBdstCertYn" render={({ field }) => ( <FormUi label="인증여부"> <SelectBox diff --git a/apps/wr/components/ui/modal/bdstReg/component.tsx b/apps/wr/components/ui/modal/bdstReg/component.tsx index aba76c7f9..e0a389182 100644 --- a/apps/wr/components/ui/modal/bdstReg/component.tsx +++ b/apps/wr/components/ui/modal/bdstReg/component.tsx @@ -3,41 +3,38 @@ import { headMakeColSpan } from "@/app/ruseFcltMng/fcltReg/rainReg/page"; import { useWrStore } from "@/app/store"; import { selectClass, - type bdstType, - type RainyInfoResponse, - type selectArray, + type RainyBuilding, } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import { ScrollArea, SearchInput, SelectBox, UiTable } from "@common/business_components"; import { Button, Input, Label } from "@common/components"; import { useEffect, useState } from "react"; import { RainRegForm } from "../../form/fcltReg/rainReg/component"; +import { getCityCd, type selectArray } from "@/app/store/common/code"; +import { getCity } from "@/components/lib/func/commom"; + +export type objSearchType = { + sgg: string|number; + city: string|number; + }; + export function BdstReg() { - const { rain, code, bdst, findBdst } = useWrStore((state) => { + const { rain, code, bdst,findBdst } = useWrStore((state) => { return state; }); - type objSearchType = { - sgg: string; - city: string; - }; - const [bdstTable, setbdstTable] = useState<RainyInfoResponse[]>(); - const [rainBdstForm, setRainBdstForm] = useState<RainyInfoResponse | undefined>(); - const { bdstObj, rainRuseObj } = rain; - const [selectSgg, setSelectSgg] = useState<selectArray[] | undefined>() + const [bdstTable, setbdstTable] = useState<RainyBuilding[]>(); + const [rainBdstForm, setRainBdstForm] = useState<RainyBuilding>({} as RainyBuilding); const [searchTxt, setSearchTxt] = useState<string>() + const [selectSgg, setSelectSgg] = useState<selectArray[] | undefined>() const [objSearch, setObjSearch] = useState<objSearchType>({sgg:"",city:""}); - const getCity = (val: string) => { - const data = code.sggCd - .filter((item) => String(item.val).substring(0, 2) === val) - .map((item) => ({ - val: String(item.val), - text: item.text // 한국어 텍스트 - })); + const getSelCity = (val: string) => { + const data= getCity(val,code.sggCd) setSelectSgg(data); setObjSearch({ city:val , sgg:''}) + }; const getSgg = (val: string | number) => { @@ -46,20 +43,19 @@ export function BdstReg() { }; const searchBdst=()=>{ - if(objSearch.sgg===""){ + if(objSearch.city===""){ alert('시도조건은 필수 입니다.') + return } + let data =objSearch.city; + if(objSearch.sgg !=="" ){ + data = objSearch.sgg + } + + findBdst(String(data), searchTxt || "") + } - - - useEffect(()=>{ - - findBdst(searchTxt || "") - },[searchTxt]) - - - useEffect(() => { if (code.sggCd.length > 0) { const table = bdst?.bdstBase?.map((item) => { @@ -77,14 +73,14 @@ export function BdstReg() { } }, [code, bdst]); + const tableClick: (val: number | undefined) => void = (val) => { - + if(val!==undefined && bdst?.bdstBase.length>0){ const data =bdst?.bdstBase[val] - setRainBdstForm([data]); - } - } - + setRainBdstForm(data); + } + } const nodeList = headMakeColSpan(bdst.moUpHeadList); return ( <> @@ -94,7 +90,7 @@ export function BdstReg() { label={"시도"} selectClass={selectClass} selectArray={code.cityCd} - onSelectValue={getCity} + onSelectValue={getSelCity} > {" "} </SelectBox> @@ -108,7 +104,7 @@ export function BdstReg() { {" "} </SelectBox> <Label className="w-20 text-base text-gray-600 mt-4 text-right">건축물명</Label> - <Input className="w-full h-full text-2xl col-span-2 col-start-8" type="text" value={searchTxt} onChange={(e) => setSearchTxt(e.target.value)}/> + <Input className="w-full h-full text-2xl col-span-2 col-start-8" type="text" value={searchTxt || ''} onChange={(e) => setSearchTxt(e.target.value)}/> {/* <SearchInput className="col-span-3 col-start-8" label="건물명" @@ -135,7 +131,7 @@ export function BdstReg() { <div className="border-t border-gray-300 my-4"></div> <ScrollArea className="h-[60vh]"> <div> - <RainRegForm rainForm={rainBdstForm ||undefined} isModal={true}></RainRegForm> + <RainRegForm rainForm={rainBdstForm } isModal={true}/> </div> </ScrollArea> </div>