From 1bb6ae08d284183db6b5eec22838cdae6fbb7146 Mon Sep 17 00:00:00 2001
From: JIeunhuh <entks301@naver.com>
Date: Tue, 22 Apr 2025 09:36:37 +0900
Subject: [PATCH] =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=A0=88?=
 =?UTF-8?q?=EC=9D=B4=EC=95=84=EC=9B=83=20=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/sn/app/ii/baseinfo/mock/page.tsx | 210 ++++++++++----------------
 1 file changed, 80 insertions(+), 130 deletions(-)

diff --git a/apps/sn/app/ii/baseinfo/mock/page.tsx b/apps/sn/app/ii/baseinfo/mock/page.tsx
index 119def875..0d9b4f46c 100644
--- a/apps/sn/app/ii/baseinfo/mock/page.tsx
+++ b/apps/sn/app/ii/baseinfo/mock/page.tsx
@@ -9,7 +9,8 @@ import { UiTable } from "@common/business_components/ui"
 import React from "react"
 import ContentLayout from "@/components/ui/contentLayout"
 import ListDiv from "@common/business_components/ui/list_div"
-
+import BaseLayout from "@/ii/BaseLayout"
+// TODO: 컴포넌트 호출 ~ 필요 코드 수정해야댐 
 // zod 스키마 정의
 const formSchema = z.object({
     region: z.string(),
@@ -91,135 +92,84 @@ export default function RTKForm() {
     }
 
     return (
-        <ContentLayout title="모의정보 설정">
-            <SearchDiv>
-                <SearchFormLeft>
-                <SelectBox className="col-span-3" label='' selectArray={[{ text: '한강 유역청', val: '1' }]} onSelectValue={(val) => {}} selectClass={undefined}/>
-                    <SelectBox label='' selectArray={[{ text: '경기도', val: '1' }]} className="col-span-3" onSelectValue={() => { }} selectClass='' />
-                    <SelectBox label='' selectArray={[{ text: '양평군', val: '1' }]} className="col-span-3" onSelectValue={() => { }} selectClass='' />
-                    <SelectBox label='' selectArray={[{ text: '양평하수처리장', val: '1' }]} className="col-span-3" onSelectValue={() => { }} selectClass='' />
-                </SearchFormLeft>
-                <SearchFormRight>
-                    <Button>조회</Button>
-                </SearchFormRight>
-            </SearchDiv>
-            <ListDiv>
-                <div className="card-header">
-                    <h3 className="text-2xl font-medium">모의정보 설정</h3>
-                </div>
-                <Form {...form}>
-                    <form onSubmit={form.handleSubmit(onSubmit)}>
-                        <div className="card !m-[1.2rem]">
-                            {/* 기본 정보 입력 폼 */}
-                            <div className="space-y-[1.2rem]">
-                                <FormField
-                                    control={form.control}
-                                    name="region"
-                                    render={({ field }) => (
-                                        <FormUi label="○ 처리구역" className="flex items-center">
-                                            <Select onValueChange={field.onChange} value={field.value}>
-                                                <SelectTrigger className="w-[150px]">
-                                                    <SelectValue placeholder="선택하세요" />
-                                                </SelectTrigger>
-                                                <SelectContent>
-                                                    <SelectItem value="양평">양평</SelectItem>
-                                                    <SelectItem value="강남">강남</SelectItem>
-                                                    <SelectItem value="마포">마포</SelectItem>
-                                                </SelectContent>
-                                            </Select>
-                                        </FormUi>
-                                    )}
-                                />
-
-                                <FormField
-                                    control={form.control}
-                                    name="rdiiArea"
-                                    render={({ field }) => (
-                                        <FormUi label="○ RDII 기여면적(ha)" className="flex items-center">
-                                            <Input
-                                                className="h-10 text-center text-xl w-[150px]"
-                                                placeholder=""
-                                                type=""
-                                                {...field}
-                                            />
-                                        </FormUi>
-                                    )}
-                                />
-
-                                <FormField
-                                    control={form.control}
-                                    name="rtkSource"
-                                    render={({ field }) => (
-                                        <FormUi label="○ RTK계수 출처" className="flex items-center">
-                                        <Input
-                                                className="h-10 text-center text-xl w-[250px]"
-                                                placeholder=""
-                                                {...field}
-                                            />
-                                        </FormUi>
-                                    )}
-                                />
-                            </div>
-
-                            {/* 테이블 컨테이너 */}
-                            <div className="mt-[1.2rem]">
-                                <div className="grid grid-cols-2">
-                                    <div>
-                                        <div className="mb-[1.2rem] gap-[1.2rem] text-xl font-medium">○ 단위도 계수</div>
-                                        <UiTable
-                                            headName=""
-                                            className="w-[400px]"
-                                            tableData={unitFactorFields}
-                                            headlist={unitFactorHeadlist}
-                                            pageSize={10}
-                                            total={0}
-                                            onPageChange={handlePageChange}
-                                            cellClick={undefined}
-                                        >
-                                            {null}
-                                        </UiTable>
-                                    </div>
-                                    <div>
-                                        <div className="mb-[1.2rem] text-xl font-medium">○ 초기 차단 깊이</div>
-                                        <UiTable
-                                            headName=""
-                                            className="w-[400px]"
-                                            tableData={initialDepthFields}
-                                            headlist={initialDepthHeadlist}
-                                            pageSize={10}
-                                            total={0}
-                                            onPageChange={handlePageChange}
-                                            cellClick={undefined}
-                                        >
-                                            {null}
-                                        </UiTable>
-                                    </div>
-                                </div>
-                            </div>
-
-                            <div className="flex justify-end mt-[1.2rem]">
-                                <Button type="submit">저장</Button>
-                            </div>
-                        </div>
-                    </form>
-                </Form>
-            </ListDiv>
-            <ListDiv>
-                    <div className="card-header flex items-center justify-between">
-                        <h3 className="text-2xl font-medium">RTX계수 입력현황</h3>
-                        <Button type="submit" className="!mx-[1.2rem]">삭제</Button>
-                    </div>
-                    <UiTable
-                        headName=''
-                        headlist={rtxNmHeadlist}
-                        tableData={[]}
-                        total={0}
-                        pageSize={10}
-                        children={undefined}
-                        cellClick={() => { }}
-                        onPageChange={() => { }}
+        <BaseLayout titleName={{ mainTitle: '모의정보 설정', firstCardTitle: '모의정보 설정', secondCardTitle: 'RTX계수 입력현황' }} form={form} onSubmitEvent={() => { }} graphBtn={false} tableInfoData={{ headList: rtxNmHeadlist, tableData: [{}], cellClickFunc: () => { }, onPageChangeFunc: () => { } }}>
+            <div className="space-y-[1.2rem]">
+                <div className="grid grid-cols-[120px_1fr] items-center">
+                    <div className="text-xl font-medium">○ 처리구역</div>
+                    <FormField
+                        control={form.control}
+                        name="region"
+                        render={({ field }) => (
+                            <SelectBox label="" selectArray={[{ text: '양평', val: 1 }]} onSelectValue={() => { }} selectClass="" className="w-[150px]" />
+                        )}
                     />
-            </ListDiv>
-        </ContentLayout>
+                </div>
+                <div className="grid grid-cols-[120px_1fr] items-center">
+                    <div className="text-xl font-medium">○ RDII 기여면적(ha)</div>
+                    <FormField
+                        control={form.control}
+                        name="rdiiArea"
+                        render={({ field }) => (
+                            <Input
+                                className="h-10 text-center text-xl w-[150px]"
+                                placeholder=""
+                                type=""
+                                {...field}
+                            />
+                        )}
+                    />
+                </div>
+                <div className="grid grid-cols-[120px_1fr] items-center">
+                    <div className="text-xl font-medium">○ RTK계수 출처</div>
+                    <FormField
+                        control={form.control}
+                        name="rtkSource"
+                        render={({ field }) => (
+                            <Input
+                                className="h-10 text-center text-xl w-[250px]"
+                                placeholder=""
+                                {...field}
+                            />
+                        )}
+                    />
+                </div>
+            </div>
+
+            {/* 테이블 컨테이너 */}
+            <div className="mt-[1.2rem]">
+                <div className="grid grid-cols-2">
+                    <div>
+                        <div className="mb-[1.2rem] text-xl font-medium">○ 단위도 계수</div>
+                        <UiTable
+                            headName=""
+                            className="w-[400px]"
+                            tableData={unitFactorFields}
+                            headlist={unitFactorHeadlist}
+                            pageSize={10}
+                            total={0}
+                            onPageChange={handlePageChange}
+                            cellClick={undefined}
+                        >
+                            {null}
+                        </UiTable>
+                    </div>
+                    <div>
+                        <div className="mb-[1.2rem] text-xl font-medium">○ 초기 차단 깊이</div>
+                        <UiTable
+                            headName=""
+                            className="w-[400px]"
+                            tableData={initialDepthFields}
+                            headlist={initialDepthHeadlist}
+                            pageSize={10}
+                            total={0}
+                            onPageChange={handlePageChange}
+                            cellClick={undefined}
+                        >
+                            {null}
+                        </UiTable>
+                    </div>
+                </div>
+            </div>
+        </BaseLayout >
     )
 }