빗물시설통계 시작!

apps/wr/app/stats/rainStat/page.tsx

@@ -21,7 +21,7 @@ export default function RainStat() {
   );
 
   useEffect(() => {
-    searchRainStatList(searchYear)
+    searchRainStatList(searchYear);
   }, [searchRainStatList, searchYear])
 
   return (

apps/wr/app/stats/rswtStat/page.tsx

@@ -1,75 +1,92 @@
 'use client'
+
 import { useWrStore } from "@/app/store";
 import { yearOptions } from "@/components/lib/func/commom";
-import { ContentsDiv, SearchDiv, SearchFormLeft, SelectBox, Title, UiTable } from "@common/business_components/ui";
+import { 
+  ContentsDiv, 
+  SearchDiv, 
+  SearchFormLeft, 
+  SelectBox, 
+  Title, 
+  UiTable 
+} from "@common/business_components/ui";
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components/ui";
 import { useState } from "react";
 
 export default function RswtStat() {
-  const { code, rswtStat } = useWrStore((state) => {
-    return state;
-  });
+  const { code, rswtStat } = useWrStore((state) => state);
   const [pageNation, setPageNation] = useState(1);
   const [searchYear, setSearchYear] = useState<string>(
     String(new Date().getFullYear())
   );
 
-    return(
-        <>
-           <ContentsDiv>
+  const testData = [1,2,3]
+  testData.map((item) => {
+    console.log('test ',item);
+  })
+
+  return (
+    <>
+      <ContentsDiv>
         <div className="grid grid-cols-4 gap-4">
           <div className="col-span-4">
-            <Title title={"재이용 통계"} />
-            <SearchDiv>
-              <SearchFormLeft>
+          <Title title="재이용 통계" />
+          <SearchDiv>
+            <div className="grid grid-cols-12 gap-5 m-4">
+              <div className="col-span-2">
                 <SelectBox
-                  className="w-full h-full text-2xl"
-                  label="통계년도"
-                  selectClass={""}
-                  selectArray={yearOptions}
-                  value={searchYear}
-                  onSelectValue={(val: string | number) =>
-                    setSearchYear(String(val))
-                  }
-                />
-                <div className="flex flex-row space-x-2 items-center">
-                  <Button className="" size={"sm"} onClick={(e) => {}}>
-                    조회
-                  </Button>
-                  <Button className="" size={"sm"} onClick={(e) => {}}>
-                    다운로드
-                  </Button>
-                  <Button className="" size={"sm"} onClick={(e) => {}}>
-                    전체통계다운로드
-                  </Button>
-                </div>
-              </SearchFormLeft>
-              {/* <SearchFormRight>
-                
-              </SearchFormRight> */}
-            </SearchDiv>
-          </div>
+                className="w-full h-full text-2xl"
+                label="통계년도"
+                selectClass=""
+                selectArray={yearOptions}
+                value={searchYear}
+                onSelectValue={(val: string | number) => setSearchYear(String(val))}
+              />
+            </div>
+            <div className="flex flex-row space-x-2 items-center">
+              <Button 
+                className="" 
+                size="sm" 
+                onClick={() => {}}
+              >
+                조회
+              </Button>
+              <Button 
+                className="" 
+                size="sm" 
+                onClick={() => {}}
+              >
+                다운로드
+              </Button>
+              <Button 
+                className="" 
+                size="sm" 
+                onClick={() => {}}
+              >
+                전체통계다운로드
+              </Button>
+            </div>
+            </div>
+          </SearchDiv>
         </div>
-        <div className="grid grid-cols-6 gap-4">
-          <div className="col-span-6 h-full min-h-0">
-            <ListDiv className="min-h-0">
-              {/* <ScrollArea className="h-[60vh]"> */}
-              <UiTable
-                tableData={[]}
-                headlist={rswtStat.rswtStatHeadList}
-                pageSize={20}
-                total={10000}
-                headName={"건축물 목록"}
-                cellClick={(val, headId) => {}}
-                onPageChange={setPageNation}
-              ></UiTable>
-              {/* </ScrollArea> */}
-            </ListDiv>
-          </div>
+      </div>
+      <div className="grid grid-cols-6 gap-4">
+        <div className="col-span-6 h-full min-h-0">
+          <ListDiv className="min-h-0">
+            <UiTable
+              tableData={[]}
+              headlist={rswtStat.rswtStatHeadList}
+              pageSize={20}
+              total={10000}
+              headName="건축물 목록"
+              cellClick={() => {}}
+              onPageChange={setPageNation}
+            />
+          </ListDiv>
         </div>
-      </ContentsDiv>
-        </>
-    )
-
+      </div>
+    </ContentsDiv>
+    </>
+  );
 }

apps/wr/app/store/stats/rainStat/headList.tsx

@@ -29,7 +29,7 @@ export const rainStatHeadListExport: TableUpperProps[] = [
     id: "이용용도",
     title: "이용용도",
     row:0,
-    colSpan:6
+    colSpan:7
   },
   {
     id: "조경용수",
@@ -41,6 +41,11 @@ export const rainStatHeadListExport: TableUpperProps[] = [
     title: "청소화장실용수",
     row:1,
   },
+  {
+    id:"세척살수용수",
+    title:"세척살수용수",
+    row:1,
+  },
   {
     id: "농업용수",
     title: "농업용수",

apps/wr/app/store/stats/rainStat/index.tsx

@@ -1,3 +1,4 @@
+import { fetchType, getFetch } from "@/components/lib/api";
 import type { TableUpperProps } from "../../common/type/header";
 import { rainStatHeadListExport } from "./headList";
 
@@ -5,8 +6,11 @@ export type RainStatProps = {
     ctpvCd : string           //시도
     sggCd : string            //시군구
     areaNm : string           //행정구역명
+    instlCst : number         //설치비용
     archArea : number         //건축연면적
-    dtfcltCpct : number       //처리용량
+    dtfcltCpct : number       //처리용량(저류조용량)
+    wtrUsqty : number         //연간사용량
+    anlOperCst : number       //연간운영비
     annRnwtQty : number       //물사용량
     jungsudo : number         //중수도​이용량
     dachae : number           //대체수​이용량
@@ -17,13 +21,12 @@ export type RainStatProps = {
     way5 : number             //방법5
     way6 : number             //방법6
     way7 : number             //방법7
-    yearMoney : number        //연간운영비
 }
 
 const fetchRainStatList = async (year:string) => {
-    const res = await fetch(`/api/stats/rainStat?year=${year}`)
-    const data = await res.json()
-    return data
+    const res = await getFetch(fetchType.WR,`/reuseChk/reuseWater/sttn/${year}`)
+    console.log(res);
+    return [];
 }
 
 type rainStatActions = {
@@ -50,8 +53,7 @@ export const rainStatActionsExport = (
 ) => {
     return {
         searchRainStatList : async (year:string) => {
-            console.log(year);
-            //const data = await fetchRainStatList(year)
+            const res = await fetchRainStatList(year);
             const rainStatList: never[] = [];
             /* const rainStatHeadList = data.map((item:RainStatProps) => ({
                 ...item,
@@ -72,7 +74,12 @@ export const rainStatActionsExport = (
                 way7:item.way7,
                 yearMoney:item.yearMoney,
             })) */
-            set((state:rainStatState) => ({...state, rainStat: {rainStatList:rainStatList}}))
+            set((state: rainStatState) => ({
+                rainStat: {
+                    ...state.rainStat,
+                    rainStatList: rainStatList,
+                }
+            }));
         }
     }
 }