From 7807da99c67d682dc86a822aab78b79910799355 Mon Sep 17 00:00:00 2001 From: leedj312 Date: Tue, 11 Mar 2025 16:58:12 +0900 Subject: [PATCH] =?UTF-8?q?dmdForm=EC=9E=91=EC=97=85=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- apps/wr/app/matMng/matDmd/page.tsx | 82 ++++++ apps/wr/app/page.tsx | 6 +- .../publicReuseFaciltyInsert/page.tsx | 4 +- .../rainReuseFaciltyInsert/page.tsx | 29 ++- .../page.tsx | 41 +-- .../store/rainReuseFacilityInsert/index.tsx | 6 +- .../store/rswtrReuseFaciltyInsert/index.tsx | 94 +++++++ apps/wr/app/store/store.tsx | 11 +- .../ui/matDmd/baseForm/component.tsx | 180 +++++++++++++ .../components/ui/matDmd/wqForm/component.tsx | 164 ++++++++++++ apps/wr/components/ui/rainReuseInsertForm.tsx | 60 ++--- .../ui/rswtrReuseFacilityInsetForm.tsx | 219 ---------------- apps/wr/components/ui/rswtrReuseInsetForm.tsx | 240 ++++++++++++++++++ 13 files changed, 842 insertions(+), 294 deletions(-) create mode 100644 apps/wr/app/matMng/matDmd/page.tsx rename apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/{rswtrReuseFacilityInsert => rswtReuseFacilityInsert}/page.tsx (50%) create mode 100644 apps/wr/app/store/rswtrReuseFaciltyInsert/index.tsx create mode 100644 apps/wr/components/ui/matDmd/baseForm/component.tsx create mode 100644 apps/wr/components/ui/matDmd/wqForm/component.tsx delete mode 100644 apps/wr/components/ui/rswtrReuseFacilityInsetForm.tsx create mode 100644 apps/wr/components/ui/rswtrReuseInsetForm.tsx diff --git a/apps/wr/app/matMng/matDmd/page.tsx b/apps/wr/app/matMng/matDmd/page.tsx new file mode 100644 index 000000000..b688fc2f2 --- /dev/null +++ b/apps/wr/app/matMng/matDmd/page.tsx @@ -0,0 +1,82 @@ +"use client" + +import { + toast +} from "sonner" +import { + useForm +} from "react-hook-form" +import { + zodResolver +} from "@hookform/resolvers/zod" +import * as z from "zod" +import { + format +} from "date-fns" + +import { + Calendar as CalendarIcon +} from "lucide-react" +import { Form, FormField, FormUi, SelectBox } from "@common/business_components/ui" +import { Button, Input } from "@common/components/ui" + +const formSchema = z.object({ + ctpv: z.string(), + sgg: z.string(), + coNm: z.string().min(1).min(0).max(20), + bznmNo: z.string().min(1).min(9).max(12), + name_5973331634: z.string().min(1).min(6).max(20), + telNo: z.string().min(8).max(12), + dmdSel: z.string().min(1).min(0), + dmdTmng: z.coerce.date(), + dmdWq: z.string().min(1).optional(), + useUsgCd: z.string(), + wntUntprc: z.string().min(1), + grssClfg: z.string().min(1), + tn: z.string().min(1).optional(), + combResdch: z.string().min(1), + tp: z.string().min(1), + trbt: z.string().min(1).optional(), + ph: z.string().min(1), + bod: z.string().min(1).optional(), + clIonQnt: z.string().min(1), + smll: z.string().min(1).optional(), + cdtnv: z.string().min(1).optional(), + crmty: z.string().min(1).optional(), + rmrk: z.string().min(1) +}); + +export default function MyForm() { + + const form = useForm < z.infer < typeof formSchema >> ({ + resolver: zodResolver(formSchema), + defaultValues: { + "dmdTmng": new Date() + }, + }) + + function onSubmit(values: z.infer < typeof formSchema > ) { + try { + console.log(values); + toast( + 
+          {JSON.stringify(values, null, 2)}
+
+ ); + } catch (error) { + console.error("Form submission error", error); + toast.error("Failed to submit the form. Please try again."); + } + } + + return ( +
+ + + + + +
+ + ) +} \ No newline at end of file diff --git a/apps/wr/app/page.tsx b/apps/wr/app/page.tsx index 4f5f24425..0e6fd2c8a 100644 --- a/apps/wr/app/page.tsx +++ b/apps/wr/app/page.tsx @@ -11,9 +11,11 @@ export default function Home() { 하수재이용 시설 등록 + - ); diff --git a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/publicReuseFaciltyInsert/page.tsx b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/publicReuseFaciltyInsert/page.tsx index a4d4f5c5c..cb76d0c36 100644 --- a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/publicReuseFaciltyInsert/page.tsx +++ b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/publicReuseFaciltyInsert/page.tsx @@ -11,8 +11,8 @@ import { useWrStore } from '../../../store'; const {pubFac} = useWrStore((state) => state); const { pubFacHeadList, publicReuseFacilityData, selectLabel} = pubFac; console.log(pubFacHeadList) - const searchDiv = '시군구' - const selectBox = [{ text: '한양', val: "1" }, { text: '서울', val: "2" }, { text: '부산', val: "3" }] + const searchDiv = '하수재이용시설 ' + const selectBox = [{ text: '서울하수처리시설', val: "1" }, { text: '서울1하수처리시설', val: "2" }, { text: '서울2하수처리시설', val: "3" }] const headName = () => { return (

○공공 허수처리시설 등록

diff --git a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rainReuseFaciltyInsert/page.tsx b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rainReuseFaciltyInsert/page.tsx index daeb64f67..b5dfd509b 100644 --- a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rainReuseFaciltyInsert/page.tsx +++ b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rainReuseFaciltyInsert/page.tsx @@ -2,7 +2,7 @@ import { useWrStore } from "@/app/store"; import type { TableUpperProps } from "@/app/store/rainReuseFacilityInsert" import { RainReuseFaciltyInsertForm } from "@/components/ui/rainReuseInsertForm"; -import { SearchDiv, SearchInput, UiTable } from "@common/business_components"; +import { ScrollArea, SearchDiv, SearchInput, UiTable } from "@common/business_components"; import { Button, TableHead, TableRow } from "@common/components"; @@ -24,7 +24,6 @@ const headMakeColSpan = (upHeadList: TableUpperProps[]) => { export default function Home() { const { rain } = useWrStore((state) => state); const nodeList = headMakeColSpan(rain.upHeadList); - const total = 100; const headName = () => { @@ -34,28 +33,32 @@ export default function Home() { } return ( <> -
-

빗물이용시설 등록

+
+
+

빗물이용시설 등록

+
-
- +
+
-
- - - +
+ + +
+
-
-
+
{nodeList}
-
+
+ +
diff --git a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtrReuseFacilityInsert/page.tsx b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtReuseFacilityInsert/page.tsx similarity index 50% rename from apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtrReuseFacilityInsert/page.tsx rename to apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtReuseFacilityInsert/page.tsx index 49a79f97b..cecd4177c 100644 --- a/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtrReuseFacilityInsert/page.tsx +++ b/apps/wr/app/reuseFaciltyManage/reuseFacilityInsert/rswtReuseFacilityInsert/page.tsx @@ -1,8 +1,8 @@ 'use client' import { useWrStore } from "@/app/store"; -import type { TableUpperProps } from "@/app/store/publicReuseFaciltyInsert"; -import { RswtrReuseFaciltyInsertForm } from "@/components/ui/rswtrReuseFacilityInsetForm"; -import { SearchDiv, SearchInput, UiTable } from "@common/business_components"; +import type { TableUpperProps } from "@/app/store/rainReuseFacilityInsert"; +import { RswtrReuseFaciltyInsertForm } from "@/components/ui/rswtrReuseInsetForm"; +import { ScrollArea, SearchDiv, SearchInput, UiTable } from "@common/business_components"; import { Button, TableHead, TableRow } from "@common/components"; @@ -22,9 +22,8 @@ const headMakeColSpan = (upHeadList: TableUpperProps[]) => { export default function Home() { - const {pubFac} = useWrStore((state) => state); - const { upHeadList, publicReuseFacilityUper} = pubFac; - const nodeList = headMakeColSpan(upHeadList); + const {rswt} = useWrStore((state) => state); + const nodeList = headMakeColSpan(rswt.upHeadList); const total = 100; @@ -36,28 +35,32 @@ export default function Home() { return ( <> -
-

빗물이용시설 등록

- -
- +
+
+

중수도시설 등록

+
+ +
+
-
- - - +
+ + +
+
-
-
- +
+ {nodeList}
-
+
+ +
diff --git a/apps/wr/app/store/rainReuseFacilityInsert/index.tsx b/apps/wr/app/store/rainReuseFacilityInsert/index.tsx index b9ce5c669..94b86aa74 100644 --- a/apps/wr/app/store/rainReuseFacilityInsert/index.tsx +++ b/apps/wr/app/store/rainReuseFacilityInsert/index.tsx @@ -5,7 +5,7 @@ export type TableUpperProps = { upName?: string; upSequnce?: number; } -type rainFacOfType = { +export type rainFacOfType = { sido: string, sigungo: string, facilityName: string, @@ -23,7 +23,7 @@ type rainFacOfType = { legalTargetYn:string, } -const upHeadList:TableUpperProps[] = [ +export const upHeadList:TableUpperProps[] = [ { id: "sido", title: "시도"}, { id: "sigungo", title: "시군구"}, { id: "facilityName", title: "시설명"}, @@ -80,7 +80,7 @@ const rainOfObject:rainFacOfType[] = [ ] -type selectArray ={ +export type selectArray ={ text:string, val:string diff --git a/apps/wr/app/store/rswtrReuseFaciltyInsert/index.tsx b/apps/wr/app/store/rswtrReuseFaciltyInsert/index.tsx new file mode 100644 index 000000000..b2621631b --- /dev/null +++ b/apps/wr/app/store/rswtrReuseFaciltyInsert/index.tsx @@ -0,0 +1,94 @@ +import { upHeadList, type rainFacOfType, type selectArray, type TableUpperProps } from "../rainReuseFacilityInsert"; + + +const rswtOfObject:rainFacOfType[] = [ + { + sido: "서울", + sigungo: "종로구", + facilityName: "그랑서울", + location: "종로 33", + locationgubun: "업무시설", + firstConstructionPermission : '2024-10-10', + buildingArea: "50", + facilityCapacity: "800,000", + reuse: "Y", + permissionDay:'2024-10-10', + register: "Y", + legalTargetYn:"Y" + }, + { + sido: "서울", + sigungo: "종로구", + facilityName: "그랑서울", + location: "종로 33", + locationgubun: "업무시설", + firstConstructionPermission : '2024-10-10', + buildingArea: "50", + facilityCapacity: "800,000", + reuse: "Y", + permissionDay:'2024-10-10', + register: "Y", + legalTargetYn:"Y" + }, + { + sido: "서울", + sigungo: "종로구", + facilityName: "그랑서울", + location: "종로 33", + locationgubun: "업무시설", + firstConstructionPermission : '2024-10-10', + buildingArea: "50", + facilityCapacity: "800,000", + reuse: "Y", + permissionDay:'2024-10-10', + register: "Y", + legalTargetYn:"Y" + }, +] + + +const selectHomeWater = [ + { text: '집수면', val: "1" }, + { text: "종류", val: "2" }, + ]; + + const selectYN= [ + { text: 'Y', val: "1" }, + { text: 'N', val: "2" }, + ]; + +export type rswtFacState ={ rswt:{ + isInit: boolean; + upHeadList: TableUpperProps[]; + rswtOfObject: rainFacOfType[]; + selectHomeWater:selectArray[]; + selectYN:selectArray[]; +}} +type rswtFacSActions = { + decrementList: () => void +} + +export type rswtFacType = rswtFacState & rswtFacSActions; + +export const rswtFacStateExport:rswtFacState= {rswt:{ + isInit:false, + upHeadList: upHeadList, + rswtOfObject: rswtOfObject, + selectHomeWater:selectHomeWater, + selectYN:selectYN + + +}} +export const rswtFacActionsExport:(set:any)=>rswtFacSActions=(set: any) => { + return { + decrementList:()=>set( + (state:rswtFacState) => { + return ( + {rain:{ + upHeadList: state.rswt.upHeadList, + rainOfObject: + state.rswt.rswtOfObject.slice(0, state.rswt.rswtOfObject.length - 1) + }})} + ) + } +} diff --git a/apps/wr/app/store/store.tsx b/apps/wr/app/store/store.tsx index ff7c014ec..4d179e58d 100644 --- a/apps/wr/app/store/store.tsx +++ b/apps/wr/app/store/store.tsx @@ -1,18 +1,21 @@ import { createStore } from 'zustand/vanilla'; import { pubFacActionsExport, pubFacStateExport, type pubFacState } from './publicReuseFaciltyInsert/index'; import { rainFacActionsExport, rainFacStateExport, type rainFacState, type rainFacType } from './rainReuseFacilityInsert'; +import { rswtFacActionsExport, rswtFacStateExport, type rswtFacState, type rswtFacType } from './rswtrReuseFaciltyInsert'; -export type WrStore = pubFacState & rainFacType; -export const StoreZus = (initState: rainFacState& pubFacState = { +export type WrStore = pubFacState & rainFacType &rswtFacType; +export const StoreZus = (initState: rainFacState& pubFacState & rswtFacState= { ...pubFacStateExport, - ...rainFacStateExport + ...rainFacStateExport, + ...rswtFacStateExport }) => { return createStore()((set) => { return { ...initState, ...pubFacActionsExport(set), - ...rainFacActionsExport(set) + ...rainFacActionsExport(set), + ...rswtFacActionsExport } }) } diff --git a/apps/wr/components/ui/matDmd/baseForm/component.tsx b/apps/wr/components/ui/matDmd/baseForm/component.tsx new file mode 100644 index 000000000..6c1de2afa --- /dev/null +++ b/apps/wr/components/ui/matDmd/baseForm/component.tsx @@ -0,0 +1,180 @@ +import { FormField, FormUi, SelectBox } from "@common/business_components"; +import { Input } from "@common/components"; + +export function baseFrom(form:any){ + + + return( + + <> + ( + + + + + )} + /> + + ( + + + + + )} + /> + + ( + + + + )} + /> + + ( + + + + )} + /> + + ( + + + + )} + /> + + ( + + + + + )} + /> + + + ( + + + + )} + /> + + ( + + 요구시기 + + + + + + + + + + + + )} + /> + + ( + + + + + )} + /> + + ( + + + + + )} + /> + + ( + + + + + )} + /> + + + ) +} \ No newline at end of file diff --git a/apps/wr/components/ui/matDmd/wqForm/component.tsx b/apps/wr/components/ui/matDmd/wqForm/component.tsx new file mode 100644 index 000000000..b2e689759 --- /dev/null +++ b/apps/wr/components/ui/matDmd/wqForm/component.tsx @@ -0,0 +1,164 @@ +import { FormField, FormUi } from "@common/business_components"; +import { Input } from "@common/components"; + +export function WqFrom(form: any) { + return ( + <> +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ +
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+ + ); +} diff --git a/apps/wr/components/ui/rainReuseInsertForm.tsx b/apps/wr/components/ui/rainReuseInsertForm.tsx index 2625f2aea..062c8e183 100644 --- a/apps/wr/components/ui/rainReuseInsertForm.tsx +++ b/apps/wr/components/ui/rainReuseInsertForm.tsx @@ -2,19 +2,13 @@ import { Form, - FormControl, - FormDescription, FormField, - FormItem, - FormLabel, - FormMessage, SelectBox, } from "@common/business_components/ui"; import { Input } from "@common/components/ui"; import { zodResolver } from "@hookform/resolvers/zod"; import { useForm } from "react-hook-form"; import { z } from "zod"; -import { IteraterFrom } from "./IteratreForm"; import { FormUi } from "@common/business_components"; import { useWrStore } from "@/app/store"; @@ -26,7 +20,6 @@ const formSchema = z.object({ export function RainReuseFaciltyInsertForm() { const { rain } = useWrStore((state) => state); - console.log( "building selectHomeWater" + rain.selectHomeWater) const form = useForm>({ resolver: zodResolver(formSchema), @@ -46,7 +39,7 @@ export function RainReuseFaciltyInsertForm() { console.log(val) } - + const selectClass ="w-full h-full text-2xl"; return (
@@ -54,10 +47,13 @@ export function RainReuseFaciltyInsertForm() { {/*
*/}
-

○ 재이용시설 운영정보

+

○ 빗물이용시설 운영정보

-
+

+ 기본정보 +

+
-

+

빗물이용시설 정보

-

✓ 1. 집수면

+

✓ 1. 집수면

-
-
+
+
( - + )} /> @@ -117,16 +113,16 @@ export function RainReuseFaciltyInsertForm() {
-

✓ 2. 여과 등 처리시설

+

✓ 2. 여과 등 처리시설

-
+
( - + )} /> @@ -156,26 +152,26 @@ export function RainReuseFaciltyInsertForm() {
-

+

인센티브 정보

-

✓ 1. 설치비 지원

+

✓ 1. 설치비 지원

-
-
+
+
( - - + + )} />
-
+
-

✓ 2. 녹색건축물 인증

+

✓ 2. 녹색건축물 인증

-
-
+
+
( - + )} />
-
+
-
+
-
+
>({ - resolver: zodResolver(formSchema), - defaultValues: { - username: "", - }, - }); - - // 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(values); - } - const selectYNValue = [ - { text: "Y", val: "1" }, - { text: "N", val: "2" }, - ]; - - let homeWaterData = [ - { - labelName: "종류", - type: "check", - selectvlaue: undefined, - formName: "homeWaterData 1", - placeholder:'ooo' - }, - { - labelName: "주요처리공정", - type: "input", - selectvlaue: undefined, - formName: "homeWaterData 2", - placeholder:'1,000,000' - }, - { - labelName: "이용용도", - type: "check", - selectvlaue: undefined, - formName: "homeWaterData 2", - placeholder:'1,000,000' - } - ]; - - let filtrTrtmfct = [ - { - labelName: "설치비지원 여", - type: "input", - selectvlaue: undefined, - formName: "filtrTrtmfct 1", - placeholder:'Y' - }, - { - labelName: "용량", - type: "input", - selectvlaue: undefined, - formName: "filtrTrtmfct 2", - placeholder:100000 - - }, - { - labelName: "처리공정", - type: "input", - selectvlaue: undefined, - formName: "filtrTrtmfct 3", - placeholder:'원수취수' - }, - ]; - let instlCst = [ - { - labelName: "지원여부", - type: "input", - selectvlaue: undefined, - formName: "instlCst 1", - placeholder:'Y' - }, - { - labelName: "지원여부(원)", - type: "input", - selectvlaue: undefined, - formName: "instlCst 2", - placeholder:1000000 - }, - ]; - let greenBuilding = [ - { - labelName: "설치완료일", - type: "chek", - selectvlaue: selectYNValue , - formName: "greenBuilding 1", - placeholder:'Y' - }, - { - labelName: "인증년도", - type: "input", - selectvlaue: undefined, - formName: " greenBuilding 2", - placeholder:'2024' - }, - { - labelName: "인증번호", - type: "input", - selectvlaue: undefined, - formName: "greenBuilding 3", - placeholder:'wr123456789' - }, - { - labelName: "인증등급", - type: "input", - selectvlaue: undefined, - formName: "greenBuilding 4", - placeholder:'A' - }, - ]; - - let baseInfo = [ - { - labelName: "설치완료일", - type: "input", - selectvlaue: undefined , - formName: "baseInfo 1", - placeholder:'2022-1010' - }, - { - labelName: "설치비(월)", - type: "input", - selectvlaue: undefined, - formName: " baseInfo 2", - placeholder:'10000000' - }, - { - labelName: "물사용량(m³)", - type: "input", - selectvlaue: undefined, - formName: " baseInfo 2", - placeholder:'10000000' - }, - { - labelName: "의무대상 물사용량(m³)", - type: "input", - selectvlaue: undefined, - formName: " baseInfo 2", - placeholder:'10000000' - } - - ]; - - return ( - - - {/*
*/} -
-
-

○ 중수도 시설현황 등록

-
-
-
- {IteraterFrom(baseInfo,form,'1' )} -
-
-

- 중수도 시설 정보{" "} -

-
{IteraterFrom(homeWaterData,form,'3' )}
-
- - - -
-

- 인센티브 정보 -

-
-
-

✓ 1. 설치비 지원

-
-
{IteraterFrom(filtrTrtmfct,form,'1' )}
- -
-

✓ 2. 녹색건축물 인증

-
-
{IteraterFrom(greenBuilding,form,'1' )}
- - - - - ); -} diff --git a/apps/wr/components/ui/rswtrReuseInsetForm.tsx b/apps/wr/components/ui/rswtrReuseInsetForm.tsx new file mode 100644 index 000000000..4e923a8fa --- /dev/null +++ b/apps/wr/components/ui/rswtrReuseInsetForm.tsx @@ -0,0 +1,240 @@ +"use client"; + +import { + Form, + FormControl, + FormDescription, + FormField, + FormItem, + FormLabel, + FormMessage, + FormUi, + SelectBox, +} from "@common/business_components/ui"; +import { Input } from "@common/components/ui"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { useForm } from "react-hook-form"; +import { z } from "zod"; +import { useWrStore } from "@/app/store"; + +const formSchema = z.object({ + username: z.string().min(2).max(50), + facilityName: z.string().min(2).max(50), +}); + + +export function RswtrReuseFaciltyInsertForm() { + const { rswt } = useWrStore((state) => state); + + const form = useForm>({ + resolver: zodResolver(formSchema), + defaultValues: { + username: "", + }, + }); + + // 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(values); + } + + const onSelectValue=(val:string)=>{ + console.log(val) + + } + const selectClass ="w-full h-full text-2xl"; + return ( +
+
+ + {/*
*/} +
+
+

○ 중수도 시설 운영정보

+
+
+

+ 기본정보 +

+
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+
+
+ ( + + + + )} + /> +
+ +
+ ( + + + + )} + /> +
+
+
+

+ 중수도 시설 정보 +

+
+ +
+
+ ( + + + + )} + /> +
+
+ ( + + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ +
+

+ 인센티브 정보 +

+
+
+

✓ 1. 설치비 지원

+
+
+
+ ( + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ +
+

✓ 2. 녹색건축물 인증

+
+
+
+ ( + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ ( + + + + )} + /> +
+
+ + +
+ ); +}