From d35ff514ef459123d06c20376d6804bd05152bb4 Mon Sep 17 00:00:00 2001 From: leedj312 Date: Thu, 24 Apr 2025 19:16:35 +0900 Subject: [PATCH] =?UTF-8?q?=ED=98=84=ED=99=A9=20=EC=84=9C=EC=B9=98?= =?UTF-8?q?=ED=8F=BC=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ruseFcltMng/fcltSttn/rainSttn/page.tsx | 181 ++++++------------ apps/wr/app/store/common/code/index.ts | 164 ++++++++-------- .../prfmncReg/chkgdnReg/rainChkgdn/index.tsx | 5 +- apps/wr/components/lib/func/commom.ts | 5 +- apps/wr/tailwind.config.ts | 2 +- 5 files changed, 153 insertions(+), 204 deletions(-) diff --git a/apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx b/apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx index a938eef88..e3ef44da0 100644 --- a/apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx +++ b/apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx @@ -2,6 +2,7 @@ import { useWrStore } from "@/app/store"; import { ContentsDiv, + SearchBaseForm, SearchDiv, SearchFormLeft, SearchFormRight, @@ -9,17 +10,16 @@ import { Title, UiModal, UiTable, + type ReturnType, } from "@common/business_components/ui"; import ListDiv from "@common/business_components/ui/list_div"; import { Button, TableHead, TableRow } from "@common/components/ui"; -import { useEffect, useState } from "react"; -import type { - TableTripleProps, -} from "@/app/store/ruseFcltMng/fcltReg/rainReg"; +import { useEffect, useRef, useState } from "react"; +import type { TableTripleProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg"; import type { chHeadType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn"; import { tableData } from "@/components/lib/func/commom"; import HeadChModal from "@/components/ui/modal/headChModal/headChModal"; - +import { btnClass } from "@/app/store/common/code"; export const headMakeTriple = ( upHeadList: TableTripleProps[], @@ -29,13 +29,8 @@ export const headMakeTriple = ( return ( <> {Array.from({ length: rowCount }).map((_, i) => ( - - - - - { - upHeadList + {upHeadList .filter((head: TableTripleProps) => head.visible == true) .map((head: TableTripleProps) => !head.upSequnce[i] ? ( @@ -63,28 +58,31 @@ export const headMakeTriple = ( ))} - {upHeadList - .map((head: TableTripleProps) => - makeHeadNm.find((ch) => ch.headNm === head?.upName[1] && head.visible ==true ) ? ( - - {head.title} - - ) : null - )} + {upHeadList.map((head: TableTripleProps) => + makeHeadNm.find( + (ch) => ch.headNm === head?.upName[1] && head.visible == true + ) ? ( + + {head.title} + + ) : null + )} ); }; export default function RainSttn() { - const { code, rain, init, sttnCommon } = useWrStore((state) => state); + const { code, rain, init, sttnCommon } = useWrStore((state) => state); const { rainRes } = rain; const [isChHead, setIsChHead] = useState(false); + + const ref = useRef({} as ReturnType ) ; const [bdstTable, setBdstTable] = useState(); const [tableHead, setTableHead] = useState([]); let nodeList = headMakeTriple( @@ -101,117 +99,64 @@ export default function RainSttn() { useEffect(() => { if (code.sggCd.length > 0) { const data = tableData(rainRes, { code }); - // data 는 위 JSON 객체라고 가정 + // data 는 위 JSON 객체라고 가정 - console.log("sttnCommon " , sttnCommon.rainSttHeadList) const unVisibleHead = sttnCommon.rainSttHeadList.filter( (item: TableTripleProps) => item.visible === false ); - console.log("unVisibleHead " , unVisibleHead) - const chData = data - .map((item:any) =>({ + const chData = data + .map((item: any) => ({ ...item, - ...item.reuseBuilding[0], - ...item.reuseBuilding[0].rainyObj - })).filter((item:any) => item.rainyObj !== undefined) + ...item.reuseBuilding[0], + ...item.reuseBuilding[0].rainyObj, + })) + .filter((item: any) => item.rainyObj !== undefined); - console.log("chData " , chData) + console.log("chData ", chData); + + setBdstTable(chData); + } + }, [code, rainRes, sttnCommon]); - setBdstTable( chData); - - - - } - - }, [code, rainRes,sttnCommon]); - return ( <>
- <SearchDiv> - <SearchFormLeft> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"권역"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"단위유역"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"중권역"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"환경청"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"시도"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - <SelectBox - className={"col-span-2 w-full h-full text-2xl"} - label={"시군구"} - selectClass={""} - selectArray={code.yn} - onSelectValue={() => {}} - value={""} - /> - </SearchFormLeft> - <SearchFormRight> - <div className="space-y"> - {/* 첫 줄: 버튼 3개 */} - <div className="flex flex-row space-x-2"> - <Button size={"sm"} onClick={(e) => {}}> - 조회 - </Button> - <Button size={"sm"} onClick={() => {}}> - 다운로드 - </Button> - </div> - <div className="flex flex-row space-x-2 pt-3"> - <Button - size={"sm"} - color="green" - onClick={() => { - setIsChHead(true); - }} - > - 조회항목설정 - </Button> - </div> - </div> - </SearchFormRight> - </SearchDiv> + <SearchBaseForm + selectSidoData={code.cityCd} + selectSigunData={code.sggCd} + selectRegionData={code.rvbsnCd} + selectUnitWaterShedData={code.lgbsnCd} + selectMiddleRegionData={code.mdmbsnCd} + selectEnvPartData={code.lclgvrnmntCd} + rightChildren={ + <Button + className={btnClass} + onClick={() => { + setIsChHead(true); + }} + > + 조회항목설정 + </Button>} + leftChildren={undefined} + + + queryClick={function (returnType: ReturnType): void { + throw new Error("Function not implemented."); + } } excelClick={function (returnType: ReturnType): void { + throw new Error("Function not implemented."); + } } initClick={function (): void { + throw new Error("Function not implemented."); + } } btnClass={btnClass } + ref={ref} /> + </div> </div> <div className="grid grid-cols-6 gap-4 "> @@ -233,13 +178,13 @@ export default function RainSttn() { </ListDiv> </div> </div> - <UiModal + <UiModal open={isChHead} onOpenChange={() => { setIsChHead(!isChHead); }} bodyClass={""} - body={<HeadChModal type={'rain'}/>} + body={<HeadChModal type={"rain"} />} /> </ContentsDiv> </> diff --git a/apps/wr/app/store/common/code/index.ts b/apps/wr/app/store/common/code/index.ts index 2a9e77d8e..21b2ea9a3 100644 --- a/apps/wr/app/store/common/code/index.ts +++ b/apps/wr/app/store/common/code/index.ts @@ -1,35 +1,33 @@ import { getFetch } from "@/components/lib/api"; +import type { EnvPartSelectDataType, SelectDataType } from "@common/business_components/ui"; -// Description: 공통코드 -export type selectArray = { - text: string; - val: string | number; - adstDliStrCd?: string -}; -export const yn :selectArray[]=[ + +export const btnClass= "p-4 m-2 text-white rounded-sm text-lg font-medium " + +export const yn :SelectDataType[]=[ {val:'Y', text:'Y'}, {val:'N', text:'N'}, ] //공통 건축물 용도 -export const bdstUsgCd: selectArray[] = [ - { val: 1, text: "운동장" }, - { val: 2, text: "체육관" }, - { val: 3, text: "공공업무시설" }, - { val: 4, text: "공공기관의청사" }, - { val: 5, text: "아파트" }, - { val: 6, text: "연립주택" }, - { val: 7, text: "다세대주택" }, - { val: 8, text: "기숙사" }, - { val: 9, text: "초등학교" }, - { val: 10, text: "중학교" }, - { val: 11, text: "고등학교" }, - { val: 12, text: "전문대학" }, - { val: 13, text: "대학및대학교" }, - { val: 14, text: "골프장" }, - { val: 15, text: "대규모점포" }, - { val: 16, text: "기타" }, +export const bdstUsgCd: SelectDataType[] = [ + { val: '1', text: "운동장" }, + { val: '2', text: "체육관" }, + { val: '3', text: "공공업무시설" }, + { val: '4', text: "공공기관의청사" }, + { val: '5', text: "아파트" }, + { val: '6', text: "연립주택" }, + { val: '7', text: "다세대주택" }, + { val: '8', text: "기숙사" }, + { val: '9', text: "초등학교" }, + { val: '10', text: "중학교" }, + { val: '11', text: "고등학교" }, + { val: '12', text: "전문대학" }, + { val: '13', text: "대학및대학교" }, + { val: '14', text: "골프장" }, + { val: '15', text: "대규모점포" }, + { val: '16', text: "기타" }, ]; //빗물 집수면 종류 용도 export const rainFcltCd = [ @@ -45,36 +43,36 @@ export const rainFcltCd = [ { val: "10", text: "확인불가" }, ]; // 중수도 필수 원수종류 -export const rswtBdstType: selectArray[] = [ - { text: "숙박업", val: 17 }, - { text: "목욕장업", val: 18 }, - { text: "공장", val: 19 }, - { text: "발전시설", val: 20 }, - { text: "관광단지개발사업", val: 21 }, - { text: "도시개발사업", val: 22 }, - { text: "산업단지개발사업", val: 23 }, - { text: "택지개발사업", val: 24 }, - { text: "대규모점포(대형마트)", val: 25 }, - { text: "대규모점포(전문점)", val: 26 }, - { text: "대규모점포(백화점)", val: 27 }, - { text: "대규모점포(쇼핑센터)", val: 28 }, - { text: "대규모점포(복합쇼핑몰)", val: 29 }, - { text: "물류시설", val: 30 }, - { text: "운수시설(여객자동차터미널)", val: 31 }, - { text: "운수시설(철도시설)", val: 32 }, - { text: "운수시설(공항시설)", val: 33 }, - { text: "운수시설(항만시설)", val: 34 }, - { text: "업무시설(공공업무시설)", val: 35 }, - { text: "업무시설(금융업소)", val: 36 }, - { text: "업무시설(사무소)", val: 37 }, - { text: "업무시설(결혼상담소 등 소개업소)", val: 38 }, - { text: "업무시설(출판사)", val: 39 }, - { text: "업무시설(신문사)", val: 40 }, - { text: "업무시설(오피스텔)", val: 41 }, - { text: "교정시설", val: 42 }, - { text: "방송국", val: 43 }, - { text: "전신전화국", val: 44 }, - { text: "기타", val: 45 }, +export const rswtBdstType: SelectDataType[] = [ + { text: "숙박업", val: "17" }, + { text: "목욕장업", val: "18" }, + { text: "공장", val: "19" }, + { text: "발전시설", val: "20" }, + { text: "관광단지개발사업", val: "21" }, + { text: "도시개발사업", val: "22" }, + { text: "산업단지개발사업", val: "23" }, + { text: "택지개발사업", val: "24" }, + { text: "대규모점포(대형마트)", val: "25" }, + { text: "대규모점포(전문점)", val: "26" }, + { text: "대규모점포(백화점)", val: "27" }, + { text: "대규모점포(쇼핑센터)", val: "28" }, + { text: "대규모점포(복합쇼핑몰)", val: "29" }, + { text: "물류시설", val: "30" }, + { text: "운수시설(여객자동차터미널)", val: "31" }, + { text: "운수시설(철도시설)", val: "32" }, + { text: "운수시설(공항시설)", val: "33" }, + { text: "운수시설(항만시설)", val: "34" }, + { text: "업무시설(공공업무시설)", val: "35" }, + { text: "업무시설(금융업소)", val: "36" }, + { text: "업무시설(사무소)", val: "37" }, + { text: "업무시설(결혼상담소 등 소개업소)", val: "38" }, + { text: "업무시설(출판사)", val: "39" }, + { text: "업무시설(신문사)", val: "40" }, + { text: "업무시설(오피스텔)", val: "41" }, + { text: "교정시설", val: "42" }, + { text: "방송국", val: "43" }, + { text: "전신전화국", val: "44" }, + { text: "기타", val: "45" } ]; const orgwtKndCd = [ @@ -96,23 +94,23 @@ export const chBuCd = [ export type comCodeState = { code: { isInit: boolean; - chBuCd:selectArray[] - rainFcltCd: selectArray[]; - bdstUsgCd: selectArray[]; - cityCd: selectArray[]; - sggCd: selectArray[]; + chBuCd:SelectDataType[] + rainFcltCd: SelectDataType[]; + bdstUsgCd: SelectDataType[]; + cityCd: SelectDataType[]; + sggCd: SelectDataType[]; - rvbsnCd:selectArray[]; - mdmbsnCd:selectArray[]; - lgbsnCd:selectArray[]; - lclgvrnmntCd:selectArray[]; + rvbsnCd:SelectDataType[]; + mdmbsnCd:SelectDataType[]; + lgbsnCd:SelectDataType[]; + lclgvrnmntCd:EnvPartSelectDataType[]; - orgwtKndCd:selectArray[]; - yn:selectArray[]; + orgwtKndCd:SelectDataType[]; + yn:SelectDataType[]; }; }; @@ -121,7 +119,7 @@ export type comCodeType = comCodeState & comCodeActions; export const getSggCd = async (set: any) => { const sgg = await getFetch("common", "/addr/sgg"); const sggCd = sgg.map((item: any) => ({ - val: Number(item.adstDstrCd), + val:item.adstDstrCd, text: item.gugun, })); set((state: comCodeState) => ({ @@ -134,10 +132,10 @@ export const getSggCd = async (set: any) => { export const getCityCd = async (set: any) => { const city = await getFetch("common", "/addr/city"); const cityCd = city.map((item: any) => ({ - val: Number(item.adstDstrCd), + val: item.adstDstrCd, text: item.sido, })); - cityCd.unshift({val:0,text:'전체'}) + cityCd.unshift({val:'0',text:'전체'}) set((state: comCodeState) => ({ code: { ...state.code, @@ -151,10 +149,10 @@ export const getRegionCd = async (set: any) => { try{ const rvbsn = await getFetch("common", "/addr/sarea"); const rvbsnCd = rvbsn.map((item: any) => ({ - val: Number(item.rvbsnCd), + val: item.rvbsnCd, text: item.rvbsn, })); - rvbsnCd.unshift({val:0,text:'전체'}) + rvbsnCd.unshift({val:'0',text:'전체'}) set((state: comCodeState) => ({ code: { ...state.code, @@ -171,10 +169,10 @@ export const getMiddleRegionCd = async (set: any) => { try{ const mdmbsn = await getFetch("common", "/addr/midArea"); const mdmbsnCd = mdmbsn.map((item: any) => ({ - val: Number(item.rvbsnCd), + val: item.rvbsnCd, text: item.mdmbsn, })); - mdmbsnCd.unshift({val:0,text:'전체'}) + mdmbsnCd.unshift({val:'0',text:'전체'}) set((state: comCodeState) => ({ code: { ...state.code, @@ -192,10 +190,10 @@ export const getUnitWaterShedCd =async (set: any) => { try{ const lgbsn = await getFetch("common", "/addr/largeArea"); const lgbsnCd = lgbsn.map((item: any) => ({ - val: Number(item.rvbsnCd), + val: item.rvbsnCd, text: item.lgbsn, })); - lgbsnCd.unshift({val:0,text:'전체'}) + lgbsnCd.unshift({val:'0',text:'전체'}) set((state: comCodeState) => ({ code: { ...state.code, @@ -214,11 +212,12 @@ export const getEnvPartCd =async (set: any) => { try{ const lclgvrnmnt = await getFetch('common', '/addr/govArea'); const lclgvrnmntCd = lclgvrnmnt.map((item: any) => ({ - val: Number(item.lclgvrnmntCd), + val: item.lclgvrnmntCd, text: item.lclgvrnmntNm, - adstDliStrCd:item.adstDliStrCd + adstDliStrCd: item.adstDliStrCd || '' + })); - lclgvrnmntCd.unshift({val:0,text:'전체' ,adstDliStrCd:''}) + lclgvrnmntCd.unshift({val:'0',text:'전체' ,adstDliStrCd: '' }) set((state: comCodeState) => ({ code: { ...state.code, @@ -245,7 +244,8 @@ export const comCodeStateExport: comCodeState = { mdmbsnCd:[], lgbsnCd:[], lclgvrnmntCd:[], - yn:yn + yn:yn, + }, }; @@ -262,13 +262,13 @@ export const codeActionExport: (set: any) => comCodeActions = (set: any) => { const sgg = await getFetch("common", "/addr/sgg"); const sggCd = sgg.map((item: any) => ({ - val: Number(item.adstDstrCd), + val: item.adstDstrCd, text: item.gugun, })); const city = await getFetch("common", "/addr/city"); const cityCd = city.map((item: any) => ({ - val: Number(item.adstDstrCd), + val: item.adstDstrCd, text: item.sido, })); @@ -281,11 +281,11 @@ export const codeActionExport: (set: any) => comCodeActions = (set: any) => { })); }, - divCityCd: async(cd: number) => { + divCityCd: async(cd: string) => { set((state: comCodeState) => ({ code: { ...state.code, - sggCd:state.code.sggCd.filter((item) => { return Number(item.val.toString().slice(0,2)) === cd }), + sggCd:state.code.sggCd.filter((item) => { return item.val.toString().slice(0,2) === cd }), }, })); }, diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx index 9b26b68f3..2eee0c93c 100644 --- a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx +++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx @@ -63,7 +63,10 @@ export type rainChkZodType = z.infer<typeof rainChkZod>; export const rainRegExcel = z.object({ bdstInfoPk: z.number().default(111111111), - chckYmd: z.date().default(new Date()), + chckYr: z .string().default("") + .refine((year) =>year.length ===0 || /^\d{4}$/.test(year),{ + message:'4자리 연도만 입력하세요' + }), file: z.instanceof(File).optional(), }); diff --git a/apps/wr/components/lib/func/commom.ts b/apps/wr/components/lib/func/commom.ts index 3e5be1593..5b75d8000 100644 --- a/apps/wr/components/lib/func/commom.ts +++ b/apps/wr/components/lib/func/commom.ts @@ -1,10 +1,11 @@ -import type { comCodeState, selectArray } from "@/app/store/common/code"; +import type { comCodeState, } from "@/app/store/common/code"; +import type { SelectDataType } from "@common/business_components/ui"; -export const getCity = (val: string, sggCd: selectArray[]) => { +export const getCity = (val: string, sggCd: SelectDataType[]) => { const data = sggCd .filter((item) => String(item.val).substring(0, 2) === val) .map((item) => ({ diff --git a/apps/wr/tailwind.config.ts b/apps/wr/tailwind.config.ts index dc688050e..00237ea18 100644 --- a/apps/wr/tailwind.config.ts +++ b/apps/wr/tailwind.config.ts @@ -5,7 +5,7 @@ import presetConfig from "../../tailwind.config.preset"; export default { presets: [presetConfig], content: [ - "./src/**/*.{js,ts,jsx,tsx,mdx}", + "./app/**/*.{js,ts,jsx,tsx,mdx}", "./components/**/*.{js,ts,jsx,tsx,mdx}", "../../packages/common/components/src/ui/**/*.{js,ts,jsx,tsx,mdx}", "../../packages/common/business_components/src/ui/**/*.{js,ts,jsx,tsx,mdx}",