ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

현황 서치폼 변경

Browse Source
This commit is contained in:
leedj312
2025-04-24 19:16:35 +09:00
parent eafcb5fdaa
commit d35ff514ef
5 changed files with 153 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx
+63 -118
View File
@@ -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) => (
<TableRow key={i}>
{
upHeadList
{upHeadList
.filter((head: TableTripleProps) => head.visible == true)
.map((head: TableTripleProps) =>
!head.upSequnce[i] ? (
@@ -63,28 +58,31 @@ export const headMakeTriple = (
</TableRow>
))}
<TableRow>
{upHeadList
.map((head: TableTripleProps) =>
makeHeadNm.find((ch) => ch.headNm === head?.upName[1] && head.visible ==true ) ? (
<TableHead
className={`border border-gray-600 px-2 py-1 `}
key={head.id}
>
{head.title}
</TableHead>
) : null
)}
{upHeadList.map((head: TableTripleProps) =>
makeHeadNm.find(
(ch) => ch.headNm === head?.upName[1] && head.visible == true
) ? (
<TableHead
className={`border border-gray-600 px-2 py-1 `}
key={head.id}
>
{head.title}
</TableHead>
) : null
)}
</TableRow>
</>
);
};
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<ReturnType>({} as ReturnType ) ;
const [bdstTable, setBdstTable] = useState<any[]>();
const [tableHead, setTableHead] = useState<any[]>([]);
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 (
<>
<ContentsDiv>
<div className="grid grid-cols-4 gap-4 ">
<div className="col-span-4">
<Title title={"빗물재이용 시설 현황"} />
<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>
</>
apps/wr/app/store/common/code/index.ts
+82 -82
View File
@@ -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 }),
},
}));
},
apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx
+4 -1
View File
@@ -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(),
});
apps/wr/components/lib/func/commom.ts
+3 -2
View File
@@ -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) => ({
apps/wr/tailwind.config.ts
+1 -1
View File
@@ -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}",