st: feat: 그리드 해더 색상 통일, 통계입력현황 조회 기능 추가 & 검색폼 컴포넌트 로직 수정(통계입력현황 조회시 도를 제외한 시는 행정구역(sggNm)을 조회하지 않도록)

apps/st/src/components/statistics/input/StatsInputStatusInp.tsx

@@ -1,14 +1,59 @@
 import { useState } from "react";
 
 import SearchForm from "@/components/module/SearchForm";
-import { DataGrid } from "@rsone/components";
+// import { DataGrid } from "@rsone/components";
+import DataGrid from "@/components/module/DataGrid";
 import ApproveButton from "@/components/button/ApproveButton";
 import RejectButton from "@/components/button/RejectButton";
+import { LoadingWithAnimation } from "@common/components";
 
 import { StatsInputStatusInpColumn } from "@/components/util/column/input/StatsInputStatusInpColumn";
+import { StatisticsInputStatusApi } from "@/entities/statistics/api/statistics-input-status-service";
+import type { StatsInputStatusListRequestParams } from "@/entities/statistics/model/statistics-input-status-interface";
+import type { SearchFormValues } from "@/components/type/SearchForm.type";
+import { useAlertStore } from "@/shared/lib";
+import { toGridRows } from "@/components/util/grid/gridFunction";
 
 // 하수도 통계 관리 > 00. 통계 입력 현황
 const StatsInputStatusInp = () => {
+    const { setMessage: alert } = useAlertStore((state) => state);
+    const [rowData, setRowData] = useState<Record<string, string | number>[]>([]);
+    const [isLoading, setIsLoading] = useState<boolean>(false);
+
+    const handleSearch = async (values: SearchFormValues) => {
+        if (values.sido === '' || values.sido === 'ALL') {
+            alert('시도를 선택해주세요.');
+            return;
+        }
+
+        const searchParam: StatsInputStatusListRequestParams = {
+            ctpvNm: values.sido,
+            sewerBzmnCd: values.bsnmCd,
+            sggNm: values.gugun === 'ALL' ? '' : values.gugun,
+            statsYr: values.year,
+        };
+
+        try {
+            setIsLoading(true);
+
+            const response =  await StatisticsInputStatusApi.getStatisticsInputStatusList(searchParam);
+
+            if (response.status === 'success' && response.data) {
+                setRowData(toGridRows(response.data));
+            } else {
+                alert(response.message);
+            }
+        } catch {
+            alert('데이터 조회 중 오류가 발생했습니다.');
+            setRowData([]);
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    const handleReset = () => {
+        setRowData([]);
+    };
 
     const rejectFunc = () => {
         // 보완 요청 로직
@@ -18,25 +63,31 @@ const StatsInputStatusInp = () => {
         // 승인 요청 로직
     };
 
-    const [rowData, setRowData] = useState<Record<string, string | number>[]>([]);
-
     return (
         <>
-            <SearchForm />
-            <div className="card !py-0">
-                <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
-                    <RejectButton rejectFunc={rejectFunc} />
-                    <ApproveButton approveFunc={approveFunc} />
+            <div className="relative">
+                <SearchForm onSubmit={handleSearch} onReset={handleReset} isStatusMenu={true} />
+                <div className="card !py-0">
+                    <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                        <RejectButton rejectFunc={rejectFunc} />
+                        <ApproveButton approveFunc={approveFunc} />
+                    </div>
                 </div>
+                {isLoading && <div className="absolute inset-0 z-50 [data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center">
+                    <div className="relative size-[5rem]">
+                        <LoadingWithAnimation color="primary" />
+                    </div>
+                </div>}
+                <DataGrid 
+                    columnInfo={ StatsInputStatusInpColumn } 
+                    rowStartNum={2} 
+                    fixedColumns={3} 
+                    rowData={rowData} 
+                    setRowData={setRowData} 
+                    isExcelImport={false}
+                    showHeaderCheckbox={true}
+                />
             </div>
-            <DataGrid 
-                columnInfo={ StatsInputStatusInpColumn } 
-                rowStartNum={2} 
-                fixedColumns={3} 
-                rowData={rowData} 
-                setRowData={setRowData} 
-                isExcelImport={false} 
-            />
         </>
     );
 };