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-06-20 17:51:01 +09:00
parent a39a03fb8b
commit 47ba298157
9 changed files with 297 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/app/ruseFcltMng/fcltSttn/htdflSttn/page.tsx
+13 -17
View File
@@ -21,12 +21,11 @@ import {
type ReturnType,
} from "@common/business_components/ui";
import ListDiv from "@common/business_components/ui/list_div";
import { makeFcltRegHead } from "@common/business_components/ui/table/makeFcltRegHead";
import SttnDetailModal from "@/components/ui/modal/sttn/sttnDetailModal/sttnDetailModal";
import BdstChgModal from "@/components/ui/modal/fcltReg/bdstChgModal/bdstChgModal";
import { Button } from "@common/components/ui";
import { useCallback, useEffect, useRef, useState } from "react";
import { excelHtdflSttnParsing } from "@/app/store/ruseFcltMng/fcltSttn/htdflSttn/excel";
import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
export default function HtdflSttn() {
const { code, htdflSttn, htdflSttnSearch, initHtdfl } = useWrStore(
@@ -120,16 +119,14 @@ export default function HtdflSttn() {
selectUnitWaterShedData={code.lgbsnCd}
selectMiddleRegionData={code.mdmbsnCd}
selectEnvPartData={code.lclgvrnmntCd}
rightChildren={
<Button
className={btnClass}
onClick={() => {
setIsChHead(true);
}}
>
조회항목설정
</Button>
}
rightChildren={<Button
className={btnClass}
onClick={() => {
setIsChHead(true);
} }
>
조회항목설정
</Button>}
leftChildren={undefined}
queryClick={function (returnType: ReturnType): void {
// '{partValue: 'A', sidoValue: '0', sigunValue: '0', regionValue: '0', unitWaterShedValue: '0', …}'
@@ -140,12 +137,11 @@ export default function HtdflSttn() {
con = returnType.sidoValue;
}
// rainSttnSearch(1, "20", con);
}}
} }
excelClick={excelClick}
initClick={function (): void {}}
initClick={function (): void { } }
btnClass={btnClass}
ref={ref}
/>
ref={ref} isAdmin={false} />
</div>
</div>
<div className="grid grid-cols-6 gap-4 ">
@@ -155,7 +151,7 @@ export default function HtdflSttn() {
headName={[]}
tableData={bdstTable || []}
children={
<makeFcltRegHead upHeadList={htdflSttn.htdflSttNodeList} />
<HeadMakeColSpan upHeadList={htdflSttn.htdflSttNodeList} />
}
headlist={htdflSttn.htdflSttHeadList}
pageSize={20}
apps/wr/app/ruseFcltMng/fcltSttn/rainSttn/page.tsx
+39 -23
View File
@@ -19,7 +19,10 @@ import {
import ListDiv from "@common/business_components/ui/list_div";
import { Button } from "@common/components/ui";
import { useCallback, useEffect, useRef, useState } from "react";
import type { chgBuilding, customRainBdst } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
import type {
chgBuilding,
customRainBdst,
} from "@/app/store/ruseFcltMng/fcltReg/rainReg";
import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
import SttnDetailModal from "@/components/ui/modal/sttn/sttnDetailModal/sttnDetailModal";
import BdstChgModal from "@/components/ui/modal/fcltReg/bdstChgModal/bdstChgModal";
@@ -34,7 +37,10 @@ export default function RainSttn() {
const [pageNation, setPageNation] = useState(1);
const [isChHead, setIsChHead] = useState(false);
const [bdstTable, setBdstTable] = useState<customRainBdst[]>();
const [detailModal, setDetailModal] = useState<{isOpen:boolean,data:customRainBdst|undefined}>({data:undefined,isOpen:false })
const [detailModal, setDetailModal] = useState<{
isOpen: boolean;
data: customRainBdst | undefined;
}>({ data: undefined, isOpen: false });
const [bdstChgProps, setBdstChgProps] = useState<{
isOpen: boolean;
chBuilding: chgBuilding[];
@@ -42,22 +48,29 @@ export default function RainSttn() {
const codeData = getCityOrSgg(ref);
const cellClick=(index:number|undefined, headId: string)=>{
if(headId!=='chBuildingYn' && index!==undefined && bdstTable!==undefined){
setDetailModal({isOpen:true ,data:bdstTable[index] })
}else if( headId==='chBuildingYn' && index!==undefined && bdstTable!==undefined){
const cellClick = (index: number | undefined, headId: string) => {
if (
headId !== "chBuildingYn" &&
index !== undefined &&
bdstTable !== undefined
) {
setDetailModal({ isOpen: true, data: bdstTable[index] });
} else if (
headId === "chBuildingYn" &&
index !== undefined &&
bdstTable !== undefined
) {
if (
bdstTable[index] &&
bdstTable[index]?.chgBuilding[0]?.bdstChgNm!==null
bdstTable[index]?.chgBuilding[0]?.bdstChgNm !== null
) {
setBdstChgProps({ isOpen:true , chBuilding: bdstTable[index].chgBuilding});
setBdstChgProps({
isOpen: true,
chBuilding: bdstTable[index].chgBuilding,
});
}
}
}
};
useEffect(() => {
if (!rainSttn.isInit) {
@@ -73,8 +86,7 @@ export default function RainSttn() {
...item,
...item.reuseBuilding[0],
...item.reuseBuilding[0].rainyObj,
chBuildingYn:item.chgBuilding[0]?.bdstChgNm!==null?'Y':'N'
chBuildingYn: item.chgBuilding[0]?.bdstChgNm !== null ? "Y" : "N",
}))
.filter((item: any) => item.rainyObj !== undefined);
@@ -99,7 +111,7 @@ export default function RainSttn() {
const excelClick = useCallback(() => {
if (codeData) rainSttnSearch(1, "10000", codeData);
}, [rainSttnSearch,codeData]);
}, [rainSttnSearch, codeData]);
return (
<>
@@ -139,6 +151,7 @@ export default function RainSttn() {
initClick={function (): void {}}
btnClass={btnClass}
ref={ref}
isAdmin={false}
/>
</div>
</div>
@@ -154,7 +167,9 @@ export default function RainSttn() {
headlist={rainSttn.rainSttHeadList}
pageSize={20}
total={100000}
cellClick={(index: number | undefined,headId:string)=>{cellClick(index ?? undefined,headId)} }
cellClick={(index: number | undefined, headId: string) => {
cellClick(index ?? undefined, headId);
}}
onPageChange={setPageNation}
></UiTable>
</ListDiv>
@@ -177,12 +192,13 @@ export default function RainSttn() {
}
/>
<UiModal
open={detailModal.isOpen}
onOpenChange={()=>{
setDetailModal({...detailModal, isOpen:!detailModal.isOpen})
}}
bodyClass={"w-[40vw] max-w-none max-h-[calc(100%-70px)]"}
body={<SttnDetailModal type={"RNB"} formObj={detailModal.data}/>}/>
open={detailModal.isOpen}
onOpenChange={() => {
setDetailModal({ ...detailModal, isOpen: !detailModal.isOpen });
}}
bodyClass={"w-[40vw] max-w-none max-h-[calc(100%-70px)]"}
body={<SttnDetailModal type={"RNB"} formObj={detailModal.data} />}
/>
<UiModal
bodyClass={""}
open={bdstChgProps.isOpen}
apps/wr/app/store/common/searchCode/index.ts
+3 -4
View File
@@ -100,9 +100,9 @@ export const searchActions: (set: any) => comFcltActions = (set: any) => {
try {
const url = `/prcsFclt/CstRt/${year}`;
const rateFeeRes = await getFetch(fetchType.COMMON, url);
set((state: comFcltState) => {
state.rateFeeRes = rateFeeRes;
return state;
return state.rateFeeRes = rateFeeRes;;
});
} catch (e) {
console.log(" error ", e);
@@ -112,8 +112,7 @@ export const searchActions: (set: any) => comFcltActions = (set: any) => {
const url = `/prcsFclt/CstRuse/${year}`;
const constCost = await getFetch(fetchType.COMMON, url);
set((state: comFcltState) => {
state.constCostRes = constCost;
return state;
return state.constCostRes = constCost;;
});
}catch (e) {
}
apps/wr/app/store/common/searchCode/type.tsx
+21 -1
View File
@@ -4,9 +4,29 @@ export type conCostFeeType= {
fctCd: string,
stdCost: string
}
export type rateFeeType = {
yr: string,
incExpCd: string,
stdCost: number,
rt: number
}
}
export type ContCostMap = {
gubun: string;
"500": number;
"1000": number;
"2000": number;
"3000": number;
"5000": number;
"10000": number;
"20000": number;
"30000": number;
"50000": number;
"100000": number;
[key: string]: any;
};
apps/wr/app/store/matDmd/coMatRvw/headList.tsx
+17 -64
View File
@@ -1,15 +1,8 @@
import { z } from "zod";
import type { CommonTableProps } from "../../common/type/header";
import type { CommonTableProps, TableUpperProps } from "../../common/type/header";
export const sttnHeadListType = z.array(
z.object({
id: z.string(),
title: z.string(),
visible: z.boolean(),
})
);
export const coRvwHeadListExport: z.infer<typeof sttnHeadListType> = [
export const coRvwHeadListExport: CommonTableProps[]= [
{
id: "cityText",
title: "시도",
@@ -47,7 +40,6 @@ export const coRvwHeadListExport: z.infer<typeof sttnHeadListType> = [
},
];
// id는 다확인해야함
export const coRvwNodeListExport: CommonTableProps[] = [
{
@@ -81,7 +73,8 @@ export const coRvwNodeListExport: CommonTableProps[] = [
row: 1,
rowSpan: 1,
colSpan: 1,
},{
},
{
id: "telNo",
title: "전화번호",
visible: true,
@@ -105,107 +98,67 @@ export const coRvwNodeListExport: CommonTableProps[] = [
rowSpan: 1,
colSpan: 1,
},
];
export const cmpttnHeadListExport: CommonTableProps[] = [
export const constCostHeadListExport: CommonTableProps[] = [
{
id: "",
id: "gubun",
title: "구분",
visible: true,
},
{
id: "BD",
title: "처리시설 용량(m³)",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "500",
title: "500",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "1000",
title: "1,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},{
},
{
id: "2000",
title: "2,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "3000", //바꾸기
title: "3,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "5000", //바꾸기
title: "5,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "10000", //바꾸기
id: "10000", //
title: "10,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "20000", //바꾸기
id: "20000", //
title: "20,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "30000", //바꾸기
id: "30000", //
title: "30,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "50000", //바꾸기
id: "50000", //
title: "50,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
{
id: "100000", //바꾸기
title: "100,000",
visible: true,
row: 1,
rowSpan: 1,
colSpan: 1,
},
];
export const coModalHeadListExport: CommonTableProps[] = [
export const rateFeeHeadListExport: CommonTableProps[] = [
{
id: "gubun",
title: "공사비/구분",
@@ -231,9 +184,9 @@ export const coModalHeadListExport: CommonTableProps[] = [
title: "시설부대비",
visible: true,
},
]
];
export const usageProcData =[
export const usageProcData = [
{ usage: "청소", process: "총인처리시설 + 염소소독" },
{ usage: "화장실용수", process: "총인처리시설 + 염소소독" },
{ usage: "세척", process: "총인처리시설 + UV소독" },
@@ -243,4 +196,4 @@ export const usageProcData =[
{ usage: "하천", process: "총인처리시설 + UV소독" },
{ usage: "지하수", process: "전처리시설 + RO" },
{ usage: "공업", process: "전처리시설 + RO" },
]
];
apps/wr/app/store/matDmd/coMatRvw/index.tsx
+7 -4
View File
@@ -1,6 +1,4 @@
import type { z } from "zod";
import type { sttnHeadListType } from "../coSttn/headList";
import { coRvwHeadListExport, coRvwNodeListExport } from "./headList";
import { constCostHeadListExport, coRvwHeadListExport, coRvwNodeListExport, rateFeeHeadListExport } from "./headList";
import type { CommonTableProps } from "../../common/type/header";
import type { DedMatUpdateType, DmdCoReqType } from "./type";
import { fetchType, getFetch, putFectch } from "@/components/lib/api";
@@ -8,13 +6,16 @@ import toast from "react-hot-toast/headless";
const coRvwHeadList = coRvwHeadListExport;
const coRvwNodeList = coRvwNodeListExport;
const rateFeeHeadList =rateFeeHeadListExport;
const constCostHeadList=constCostHeadListExport
export type coRvwState = {
coRvw: {
isInit: boolean;
coMatRvwRes: DmdCoReqType[];
coRvwHeadList: CommonTableProps[];
coRvwNodeList: CommonTableProps[];
rateFeeHeadList: CommonTableProps[];
constCostHeadList: CommonTableProps[];
};
};
@@ -24,6 +25,8 @@ export const coRvwStateExport: coRvwState = {
coMatRvwRes: [],
coRvwHeadList: coRvwHeadList,
coRvwNodeList: coRvwNodeList,
rateFeeHeadList:rateFeeHeadList,
constCostHeadList:constCostHeadList
},
};
apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
+20 -10
View File
@@ -17,7 +17,7 @@ import {
} from "@common/business_components/ui";
import PopoverUi from "@common/business_components/ui/popover_ui";
import { Button, Input, Label } from "@common/components/ui";
import { useEffect, useState } from "react";
import { useEffect, useRef, useState } from "react";
import { type UseFormReturn } from "react-hook-form";
export default function ConCostForm({
@@ -27,8 +27,20 @@ export default function ConCostForm({
form: UseFormReturn<DmdCoReqType>;
type: string;
}) {
const { coMatRvwUpdate, ruseRvwCalUpdate } = useWrStore((state) => state);
const { coMatRvwUpdate, ruseRvwCalUpdate,getRateFee ,getConstCostFee} = useWrStore((state) => state);
const ref = useRef<boolean>(false);
useEffect(() => {
if (!ref.current) {
const currentYear = new Date().getFullYear();
getConstCostFee(String(currentYear));
getRateFee(String(currentYear));
ref.current = true;
}
}, [ref, getConstCostFee ,getRateFee ]);
const [isTrfMo, setIsTrfMo] = useState<{
isModal: boolean;
}>({ isModal: false });
@@ -58,10 +70,8 @@ export default function ConCostForm({
prcsFcltCpctCstrnCst: form.getValues("demandCst.prcsFcltCpctCstrnCst"),
rgtr: TEST_UUID,
};
console.log("mat data ", data);
coMatRvwUpdate("11000SW001R1", form.getValues("dmdInfoFk"), data);
} else if (type === "hist") {
console.log("hist data ", value);
ruseRvwCalUpdate(value);
}
};
@@ -101,7 +111,7 @@ export default function ConCostForm({
placeholder=""
type="text"
onChange={(e) => {
field.onChange(Number(e.target.value));
field.onChange((e.target.value));
}}
value={field.value ?? ""}
/>
@@ -367,17 +377,17 @@ export default function ConCostForm({
</div>
</div>
<UiModal
body={<ConstCostFeeTable setReturnData={(e) =>{}}></ConstCostFeeTable>}
bodyClass="w-[40vw] max-w-none h-[30vh]"
body={<RateFeeTableModal setReturnData={(e) =>{}}></RateFeeTableModal>}
bodyClass="w-[40vw] h-[40vh] "
open={isTrfMo.isModal}
onOpenChange={(open) => {
setIsTrfMo({ isModal: open });
}}
/>
<UiModal
body={<RateFeeTableModal setReturnData={(e) =>{}}></RateFeeTableModal>}
bodyClass="w-[70vw] max-w-none h-[30vh]"
open={isCmpttnMo.isModal}
body={<ConstCostFeeTable setReturnData={(e) =>{}}></ConstCostFeeTable>}
bodyClass="w-[40vw] max-w-none h-[40vh]"
open={isCmpttnMo.isModal}
onOpenChange={(open) => {
setIsCmpttnMo({ isModal: open });
}}
apps/wr/components/ui/modal/coMat/constCostFeeTable.tsx
+87 -41
View File
@@ -1,60 +1,106 @@
"use client";
import { useWrStore } from "@/app/store";
import { cmpttnHeadListExport } from "@/app/store/matDmd/coMatRvw/headList";
import type {
conCostFeeType,
ContCostMap,
} from "@/app/store/common/searchCode/type";
import { yearOptions } from "@/components/lib/func/commom";
import { SelectBox, UiTable } from "@common/business_components/ui";
import { Label } from "@common/components/ui";
import { useEffect, useState } from "react";
export function ConstCostFeeTable({
import { SelectBox, UiTable } from "@common/business_components/ui";
import ListDiv from "@common/business_components/ui/list_div";
import { Label, ScrollArea } from "@common/components/ui";
import { useEffect, useRef, useState } from "react";
export function ConstCostFeeTable({
setReturnData,
}: {
setReturnData: (data: any) => void;
}) {
const { constCostRes,getConstCostFee } = useWrStore((state) => state);
const { coRvw, constCostRes, getConstCostFee } = useWrStore((state) => state);
const [year, setYear] = useState<string>(String(new Date().getFullYear()));
const [constCostData, setConstCostData] = useState<ContCostMap[]>([]);
function getFctDescription(fctCd: string) {
const fctMap: { [key: string]: string } = {
"001": "총인",
"002": "염소.소독",
"003": "uv소독",
"004": "생물학적탈질",
"005": "RO",
};
return fctMap[fctCd];
}
useEffect(() => {
const tableData = constCostRes?.reduce(
(acc: ContCostMap[], cur: conCostFeeType) => {
const key = cur.fctCd;
let target = acc?.find((item: any) => item.gubun === key);
if (!target) {
target = {
gubun: cur.fctCd,
"500": 0,
"1000": 0,
"2000": 0,
"3000": 0,
"5000": 0,
"10000": 0,
"20000": 0,
"30000": 0,
"50000": 0,
"100000": 0,
};
acc?.push(target);
}
target[cur.fctCpc] = cur.stdCost;
getConstCostFee(year)
}, [year,getConstCostFee]);
useEffect(() => {
const tableData = constCostRes.map((item) => {})
console.log(' constCostRes : ', constCostRes);
},[constCostRes])
return acc;
},
[]
);
console.log("tableData", tableData);
const formattedTableData = tableData?.map((item: ContCostMap) => {
return {
...item,
gubun: getFctDescription(item.gubun) || item.gubun,
};
});
setConstCostData(formattedTableData);
}, [constCostRes]);
return (
<>
<h3 className="mt-4 ml-2 text-2xl font-medium text-label">
공사비 산정표 보기
</h3>
<hr />
<div className="flex items-center">
<Label className="text-xl text-gray-600">기준년도</Label>
<SelectBox
className="h-full text-2xl"
label=""
selectClass={"ml-4"}
selectArray={yearOptions}
value={year}
onSelectValue={(val: string | number) => setYear(String(val))}
/>
</div>
<UiTable
headName={""}
tableData={[]}
headlist={cmpttnHeadListExport}
pageSize={0}
total={0}
cellClick={() => {}}
onPageChange={() => {}}
/>
<ListDiv className="!w-full ">
<h3 className="mt-4 ml-2 text-2xl font-medium text-label">
공사비 산정표 보기
</h3>
<hr />
<div className="flex items-center">
<Label className="text-xl text-gray-600">기준년도</Label>
<SelectBox
className="h-full text-2xl"
label=""
selectClass={"ml-4"}
selectArray={yearOptions}
value={year}
onSelectValue={(val: string | number) => setYear(String(val))}
/>
</div>
<ScrollArea className="h-[calc(100vh-300px)] w-full">
<UiTable
headName={""}
tableData={constCostData || []}
headlist={coRvw.constCostHeadList}
pageSize={0}
total={0}
cellClick={() => {}}
onPageChange={() => {}}
/>
</ScrollArea>
</ListDiv>
</>
);
}
apps/wr/components/ui/modal/coMat/rateFeeModal.tsx
+90 -52
View File
@@ -2,82 +2,120 @@
import { useWrStore } from "@/app/store";
import type { rateFeeType } from "@/app/store/common/searchCode/type";
import { coModalHeadListExport } from "@/app/store/matDmd/coMatRvw/headList";
import { yearOptions } from "@/components/lib/func/commom";
import { SelectBox, UiTable } from "@common/business_components/ui";
import { Label } from "@common/components/ui";
import ListDiv from "@common/business_components/ui/list_div";
import { Label, ScrollArea } from "@common/components/ui";
import { Scroll } from "lucide-react";
import { useEffect, useState } from "react";
export function RateFeeTableModal({ setReturnData}: { setReturnData: (data: any) => void }) {
export function RateFeeTableModal({
setReturnData,
}: {
setReturnData: (data: any) => void;
}) {
const { code, coRvw,rateFeeRes } = useWrStore((state) => state);
const [year, setYear] = useState<string>(String(new Date().getFullYear()));
const { rateFeeRes,getRateFee } = useWrStore((state) => state);
const [reateFeeTable, setRateFeeTable] = useState<rateFeeType[]>([]);
useEffect(() => {
const gubunLabelMap: Record<number, string> = {
50: "5천만원까지",
100: "1억원까지",
200: "2억원까지",
300: "3억원까지",
500: "5억원까지",
1000: "10억원까지",
2000: "20억원까지",
3000: "30억원까지",
5000: "50억원까지",
10000: "100억원까지",
20000: "200억원까지",
30000: "300억원까지",
40000: "400억원까지",
50000: "500억원까지",
70000: "700억원까지",
100000: "1000억원까지",
150000: "1500억원까지",
200000: "2000억원까지",
300000: "3000억원까지",
500000: "5000억원까지",
};
getRateFee(year)
},[year,getRateFee])
useEffect(() => {
let tableData = []
const data = rateFeeRes.reduce((acc: any,cur:rateFeeType) =>{
const fetchData = async (rateFeeRes: rateFeeType[]) => {
const data = await rateFeeRes?.reduce((acc: any, cur: rateFeeType) => {
const key = cur.stdCost;
let target = acc.find((item: any) => item.stdCost === key);
if(!target){
target={
gubun: cur.stdCost,
if (!target) {
target = {
stdCost: cur.stdCost,
BD: 0,
WD: 0,
SE: 0,
CE: 0,
}
};
acc.push(target);
}
target[cur.incExpCd] = cur.rt;
return acc;
}, []);
return acc
},[])
const dataGubun = data?.map((item: any) => {
return {
...item,
gubun: gubunLabelMap[item.stdCost] || item.stdCost,
};
});
console.log('data : ', data);
return dataGubun?.sort((a: any, b: any) => a.stdCost - b.stdCost);
};
},[rateFeeRes])
useEffect(() => {
console.log("rateFeeRes ", rateFeeRes);
if (rateFeeRes?.length >= 0) {
fetchData(rateFeeRes).then((data) => {
setRateFeeTable(data);
});
}
}, [rateFeeRes]);
return (
<>
<div className="sticky top-0 z-10 bg-white pb-4">
<h3 className="text-2xl font-medium text-label">요율표 보기</h3>
<hr />
<div className="flex items-center">
<Label className="text-xl text-gray-600">기준년도</Label>
<SelectBox
className="h-full text-2xl"
label=""
selectClass={"ml-4"}
selectArray={yearOptions}
value={year}
onSelectValue={(val: string | number) => setYear(String(val))}
/>
<ListDiv className="!h-[calc(100vh-100px)] w-[90vw] max-w-[1200px] min-w-[600px] overflow-hidden">
<div className="sticky top-0 z-10 grid grid-cols-6 gap-4 p-4 bg-white">
<h3 className="col-span-6 text-2xl font-medium text-label">
요율표 보기
</h3>
<hr className="col-span-6 border-gray-300" />
<div className="col-span-2 flex items-center">
<Label className="text-xl text-gray-600">기준년도</Label>
<SelectBox
className="h-full text-2xl"
label=""
selectClass={"ml-4"}
selectArray={yearOptions}
value={year}
onSelectValue={(val: string | number) => setYear(String(val))}
/>
</div>
<div className="col-span-6">
<ScrollArea className="h-[60vh] overflow-auto">
<UiTable
className="min-w-full"
key={"rateTable" + reateFeeTable?.length}
headName={""}
tableData={reateFeeTable || []}
headlist={coRvw.rateFeeHeadList}
onPageChange={() => {}}
pageSize={0}
total={0}
cellClick={undefined}
/>
</ScrollArea>
</div>
</div>
<UiTable
headName={""}
tableData={[]}
headlist={coModalHeadListExport}
onPageChange={() => {}}
pageSize={0}
total={0}
cellClick={undefined}
/>
</div>
</ListDiv>
</>
);
}