feat:[집계표]13.하수도 서비스수준

apps/st/src/components/statistics/total/SewerageServiceLevelTot.tsx

@@ -1,131 +1,99 @@
 import { useRef, useState } from "react";
-
 import { useAlertStore } from "@/shared/lib";
-import { statisticsTotalStatusApi } from "@/entities/statistics/api/statistics-total-service";
-import { toGridRows } from "@/components/util/grid/gridFunction";
-
+import { LoadingWithAnimation, Tabs, TabsContent, TabsList, TabsTrigger } from "@common/components";
 import SearchForm from "@/components/module/SearchForm";
 import DataGrid from "@/components/module/DataGrid";
-import { LoadingWithAnimation, Tabs, TabsContent, TabsList, TabsTrigger } from "@common/components";
-
 import type { ColumnInfo } from "@/components/type/DataGrid.type";
 import type { SearchFormValues } from "@/components/type/SearchForm.type";
-import { ComplaintInpColumn } from "@/components/util/column/total/sewerageServiceLevel/ComplaintTotColumn";
-import { ResidentFriendlyFactTotColumn } from "@/components/util/column/total/sewerageServiceLevel/ResidentFriendlyFactTotColumn";
+import { toGridRows } from "@/components/util/grid/gridFunction";
+import CellColorInfo from "./CellColorInfo";
 
-const SewerageServiceLevelInpTabList = [
-    ComplaintInpColumn,
-    ResidentFriendlyFactTotColumn,
-];
-const SUPPORTED_TAB_KEYS = [ComplaintInpColumn.tabKey, ResidentFriendlyFactTotColumn.tabKey] as const;
+// 13. 하수도서비스수준 컬럼 설정
+import { SewageComplaintTab1ColumnConfig } from "@/components/util/column/total/sewerageServiceLevel/ComplaintTotColumn";
+import { ResidentFriendlyFacilityTab2ColumnConfig } from "@/components/util/column/total/sewerageServiceLevel/ResidentFriendlyFactTotColumn";
+
+import { statisticsTotalStatusApi } from "@/entities/statistics/api/statistics-total-service";
+import type { 
+    SewerageServiceLevelRequest,
+    SewerageServiceLevelComplaintResponse,
+    SewerageServiceLevelResidentFriendlyFactResponse
+} from "@/entities/statistics/model/statistics-total/statistics-service-level-total-interface";
+
+const SewageServiceLevelColumnListTot = [
+    SewageComplaintTab1ColumnConfig,
+    ResidentFriendlyFacilityTab2ColumnConfig
+].filter(Boolean);
+
+const firstTabKey = SewageServiceLevelColumnListTot[0]?.tabKey ?? "ST00130001";
 
 const SewerageServiceLevelTot = () => {
     const { setMessage: alert } = useAlertStore((state) => state);
+    
     const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
-    const [isLoading, setIsLoading] = useState<boolean>(false);
-    const [activeTab, setActiveTab] = useState(ComplaintInpColumn.tabKey);
-    const lastSearchValuesRef = useRef<SearchFormValues | null>(null);
-
-    const columnInfo = SewerageServiceLevelInpTabList;
+    const [isLoading, setIsLoading] = useState(false);
+    const [activeTab, setActiveTab] = useState(firstTabKey);
+    const lastSearchedValuesRef = useRef<SearchFormValues | null>(null);
 
     const handleReset = () => {
         setRowDataMap(new Map());
-        setActiveTab(ComplaintInpColumn.tabKey);
-        lastSearchValuesRef.current = null;
+        setActiveTab(firstTabKey);
+        lastSearchedValuesRef.current = null;
     };
 
-    const loadSewerageServiceLevelTotTabData = async (
-        tabKey: string,
-        values: SearchFormValues,
-        mergeIntoExistingMap: boolean,
-    ) => {
-        const param = {
+    const loadGridData = async (tabKey: string, values: SearchFormValues): Promise<boolean> => {
+        setIsLoading(true);
+        const param: SewerageServiceLevelRequest = {
             ctpvNm: values.sido === "ALL" ? "" : values.sido,
             sggNm: values.gugun === "ALL" ? "" : values.gugun,
             sewerBzmnCd: values.bsnmCd,
             statsYr: values.year,
             rowDataYn: values.isDetail,
+            summaryYn: values.isSummary !== 'ALL',
+            summaryYearCnt: values.isSummary !== 'ALL' ? Number(values.isSummary) : undefined
         };
 
-        const fetcherMap = {
-            [ComplaintInpColumn.tabKey]: statisticsTotalStatusApi.getSewerageServiceLevelComplaint.bind(
-                statisticsTotalStatusApi,
-            ),
-            [ResidentFriendlyFactTotColumn.tabKey]:
-                statisticsTotalStatusApi.getSewerageServiceLevelResidentFriendlyFact.bind(
-                    statisticsTotalStatusApi,
-                ),
-        };
-        const fetcher = fetcherMap[tabKey];
-        if (!fetcher) {
-            return false;
-        }
-        const response = await fetcher(param);
-
-        if (response.status === "success" && response.data) {
-            const rows = toGridRows(response.data as object[]);
-            if (mergeIntoExistingMap) {
-                setRowDataMap((prev) => {
-                    const next = new Map(prev);
-                    next.set(tabKey, rows);
-                    return next;
-                });
-            } else {
-                const next = new Map<string, Record<string, string | number>[]>();
-                next.set(tabKey, rows);
-                setRowDataMap(next);
-            }
-            return true;
-        }
-        alert(response.message || "데이터 조회 중 오류가 발생했습니다.");
-        return false;
-    };
-
-    const handleSearch = async (values: SearchFormValues) => {
         try {
-            setIsLoading(true);
-            let ok = false;
-            if (SUPPORTED_TAB_KEYS.includes(activeTab)) {
-                ok = await loadSewerageServiceLevelTotTabData(activeTab, values, true);
-            }
-            if (ok) {
-                lastSearchValuesRef.current = values;
-            } else {
-                lastSearchValuesRef.current = null;
+            // [TAB1] 민원
+            if (tabKey === "ST00130001") {
+                const response: SewerageServiceLevelComplaintResponse = await statisticsTotalStatusApi.getSewerageServiceLevelComplaint(param);
+                if (response?.status === "success") {
+                    setRowDataMap((prev) => new Map(prev).set(tabKey, toGridRows(response.data as object[])));
+                    return true;
+                }
+            } 
+            // [TAB2] 주민친화시설
+            else if (tabKey === "ST00130002") {
+                const response: SewerageServiceLevelResidentFriendlyFactResponse = await statisticsTotalStatusApi.getSewerageServiceLevelResidentFriendlyFact(param);
+                if (response?.status === "success") {
+                    setRowDataMap((prev) => new Map(prev).set(tabKey, toGridRows(response.data as object[])));
+                    return true;
+                }
             }
+            return false;
         } catch {
-            alert("데이터 조회 중 오류가 발생했습니다.");
-            lastSearchValuesRef.current = null;
+            alert("서버 연결 중 오류가 발생했습니다.");
+            return false;
         } finally {
             setIsLoading(false);
         }
     };
 
+    const handleSearch = async (values: SearchFormValues) => {
+        lastSearchedValuesRef.current = values;
+        await loadGridData(activeTab, values);
+    };
+
     const handleActiveTabChange = async (tabKey: string) => {
         setActiveTab(tabKey);
-
-        const values = lastSearchValuesRef.current;
-        if (!values) return;
-
-        const existing = rowDataMap.get(tabKey);
-        const hasData = Array.isArray(existing) && existing.length > 0;
-        if (hasData) return;
-
-        if (SUPPORTED_TAB_KEYS.includes(tabKey)) {
-            try {
-                setIsLoading(true);
-                await loadSewerageServiceLevelTotTabData(tabKey, values, true);
-            } catch {
-                alert("데이터 조회 중 오류가 발생했습니다.");
-            } finally {
-                setIsLoading(false);
-            }
-        }
+        const values = lastSearchedValuesRef.current;
+        if (!values || rowDataMap.has(tabKey)) return;
+        await loadGridData(tabKey, values);
     };
 
     return (
         <div className="relative">
-            <SearchForm isDetail={true} onSubmit={handleSearch} onReset={handleReset} sidoSelectText="전체" />
+            <SearchForm isDetail={true} isSummary={true} onSubmit={handleSearch} onReset={handleReset} sidoSelectText="전체" />
+            
             {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]">
@@ -133,58 +101,48 @@ const SewerageServiceLevelTot = () => {
                     </div>
                 </div>
             )}
+            
+            <CellColorInfo />
+
             <div className="flex flex-col gap-[0.6rem] mx-[0.6rem]">
                 <Tabs value={activeTab} onValueChange={(v) => void handleActiveTabChange(v)} className="w-full" variant="default">
                     <TabsList>
-                        {columnInfo.map((info) => (
-                            <TabsTrigger key={info.tabKey} value={info.tabKey}>
-                                {info.tabLabel || info.tabKey}
-                            </TabsTrigger>
+                        {SewageServiceLevelColumnListTot.map((info) => (
+                            <TabsTrigger key={info.tabKey} value={info.tabKey}>{info.tabLabel}</TabsTrigger>
                         ))}
                     </TabsList>
-                    {columnInfo.map((info) => {
-                        const tabKey = info.tabKey;
-                        if (!info.columns || !info.columnLayout) {
-                            return null;
-                        }
-
-                        const rowData = rowDataMap.get(tabKey) ?? [];
-                        const gridColumnInfo: ColumnInfo = {
-                            columns: info.columns,
-                            columnLayout: info.columnLayout,
-                        };
-
-                        return (
-                            <TabsContent key={tabKey} value={tabKey}>
-                                <DataGrid
-                                    columnInfo={gridColumnInfo}
-                                    rowStartNum={info.rowStartNum}
-                                    excelExportFileSuffix={info.tabLabel || tabKey}
-                                    rowData={rowData}
-                                    setRowData={(updater) => {
-                                        setRowDataMap((prev) => {
-                                            const next = new Map(prev);
-                                            const cur = next.get(tabKey) ?? [];
-                                            const n = typeof updater === "function" ? updater(cur) : updater;
-                                            next.set(tabKey, n);
-                                            return next;
-                                        });
-                                    }}
-                                    isExcelImport={false}
-                                    isExcelExport
-                                    showHeaderCheckbox={false}
-                                    fixedColumns={info.fixedColumns}
-                                    enableSort={false}
-                                    cellStyleCallback={({ row }) => {
-                                        const rowType = String(row.rowType ?? "");
-                                        if (rowType === "DETAIL") return undefined;
-                                        if (rowType === "BIZ_SUM") return "rg-cell-rowtype-biz-sum";
-                                        return "rg-cell-rowtype-other";
-                                    }}
-                                />
-                            </TabsContent>
-                        );
-                    })}
+                    
+                   {SewageServiceLevelColumnListTot.map((info) => (
+                        <TabsContent key={info.tabKey} value={info.tabKey}>
+                            <DataGrid
+                                columnInfo={{ columns: info.columns, columnLayout: info.columnLayout }}
+                                rowStartNum={info.rowStartNum}
+                                rowData={rowDataMap.get(info.tabKey) ?? []}
+                                excelExportFileSuffix={info.tabLabel}
+                                setRowData={(updater) => {
+                                    setRowDataMap((prev) => {
+                                        const next = new Map(prev);
+                                        const cur = next.get(info.tabKey) ?? [];
+                                        const n = typeof updater === "function" ? updater(cur) : updater;
+                                        next.set(info.tabKey, n);
+                                        return next;
+                                    });
+                                }}
+                                isExcelImport={false}
+                                isExcelExport={true}
+                                showHeaderCheckbox={false}
+                                fixedColumns={info.fixedColumns}
+                                enableSort={false}
+                                cellStyleCallback={({ row }) => {
+                                    const rowType = String(row.rowType ?? '');
+                                    if (rowType === 'DETAIL') return undefined;
+                                    if (rowType === 'BIZ_SUM') return 'rg-cell-rowtype-biz-sum';
+                                    if (rowType === 'SUMMARY') return 'rg-cell-rowtype-summary';
+                                    return 'rg-cell-rowtype-other';
+                                }}
+                            />
+                        </TabsContent>
+                    ))}
                 </Tabs>
             </div>
         </div>

apps/st/src/components/util/column/total/sewerageServiceLevel/ComplaintTotColumn.ts

@@ -1,77 +1,36 @@
 import { ValueType } from "realgrid";
 
-// 하수도 통계 관리 > 13. 하수도 서비스 수준 > tab 1: 민원
-export const ComplaintInpColumn = {
-    columns: [
-        { name: "ctpvNm", fieldName: "ctpvNm", header: { text: "시도" } },
-        { name: "sggNm", fieldName: "sggNm", header: { text: "시군구" } },
-        { name: "admdstNm", fieldName: "admdstNm", header: { text: "행정구역명" } },
-        {
-            name: "swtrmtPpltnCnt",
-            fieldName: "swtrmtPpltnCnt",
-            header: { text: "하수처리장민원건수(건)" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0",
-        },
-        {
-            name: "whol",
-            fieldName: "whol",
-            header: { text: "합계" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0",
-        },
-        { name: "odorCnt", fieldName: "odorCnt", header: { text: "악취" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "swagePplCnt", fieldName: "swagePplCnt", header: { text: "하수관거" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "dschgWqCnt", fieldName: "dschgWqCnt", header: { text: "방류수수질" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "ldsCnt", fieldName: "ldsCnt", header: { text: "퇴적토" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "plltnAcdntCnt", fieldName: "plltnAcdntCnt", header: { text: "오염사고" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "sewerCrgAmt", fieldName: "sewerCrgAmt", header: { text: "하수도요금" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "etcCnt", fieldName: "etcCnt", header: { text: "기타" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        {
-            name: "crtrPpltnCvlcptEvntcsCnt",
-            fieldName: "crtrPpltnCvlcptEvntcsCnt",
-            header: { text: "인구10만명당 민원건수(건)" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0.00",
-        },
-        { name: "rmrk", fieldName: "rmrk", header: { text: "비고" } },
-        { name: "statsYr", fieldName: "statsYr", header: { text: "통계연도" }, visible: false },
-        { name: "admdstCd", fieldName: "admdstCd", header: { text: "행정코드" }, visible: false },
-        { name: "rowType", fieldName: "rowType", header: { text: "행타입" }, visible: false },
-    ].map((col) => ({ ...col, editable: false })),
-
-    columnLayout: [
-        {
-            name: "groupA",
-            hideChildHeaders: false,
-            header: { text: "행정구역" },
-            items: ["ctpvNm", "sggNm", "admdstNm"],
-        },
-        {
-            name: "groupB",
-            hideChildHeaders: false,
-            header: { text: "민원건수(건)" },
-            items: [
-                "whol",
-                "odorCnt",
-                "swagePplCnt",
-                "dschgWqCnt",
-                "ldsCnt",
-                "plltnAcdntCnt",
-                "sewerCrgAmt",
-                "etcCnt",
-            ],
-        },
-        "swtrmtPpltnCnt",
-        "crtrPpltnCvlcptEvntcsCnt",
-        "rmrk",
-        "statsYr",
-        "admdstCd",
-        "rowType",
-    ],
-
-    rowStartNum: 2,
-    fixedColumns: 1,
+export const SewageComplaintTab1ColumnConfig = {
     tabKey: "ST00130001",
     tabLabel: "민원",
+    rowStartNum: 3, // 행정구역 3단 헤더
+    fixedColumns: 1,
+    columns: [
+        { name: "ctpvNm", fieldName: "ctpvNm", header: { text: "시도" }, editable: false },
+        { name: "sggNm", fieldName: "sggNm", header: { text: "시군구" }, editable: false },
+        { name: "admdstNm", fieldName: "admdstNm", header: { text: "행정구역명" }, editable: false },
+        { name: "swtrmtPpltnCnt", fieldName: "swtrmtPpltnCnt", header: { text: "하수처리인구\n(명)" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        
+        // 민원유형
+        { name: "whol", fieldName: "whol", header: { text: "총계" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "odorCnt", fieldName: "odorCnt", header: { text: "악취" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "swagePplCnt", fieldName: "swagePplCnt", header: { text: "하수관로" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "dschgWqCnt", fieldName: "dschgWqCnt", header: { text: "배수설비" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "ldsCnt", fieldName: "ldsCnt", header: { text: "맨홀" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "plltnAcdntCnt", fieldName: "plltnAcdntCnt", header: { text: "정화조" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "sewerCrgAmt", fieldName: "sewerCrgAmt", header: { text: "하수도요금" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        { name: "etcCnt", fieldName: "etcCnt", header: { text: "기타" }, valueType: ValueType.NUMBER, dataFormat: "#,##0", editable: false },
+        
+        { name: "crtrPpltnCvlcptEvntcsCnt", fieldName: "crtrPpltnCvlcptEvntcsCnt", header: { text: "기준인구당\n민원건수\n(건/10,000명)" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.00", editable: false }
+    ],
+    columnLayout: [
+        { name: "areaGroup", header: { text: "행정구역" }, items: ["ctpvNm", "sggNm", "admdstNm"] },
+        "swtrmtPpltnCnt",
+        { 
+            name: "complaintGroup", 
+            header: { text: "민원유형(건)" }, 
+            items: ["whol", "odorCnt", "swagePplCnt", "dschgWqCnt", "ldsCnt", "plltnAcdntCnt", "sewerCrgAmt", "etcCnt"] 
+        },
+        "crtrPpltnCvlcptEvntcsCnt"
+    ]
 };

apps/st/src/components/util/column/total/sewerageServiceLevel/ResidentFriendlyFactTotColumn.ts

@@ -1,81 +1,34 @@
 import { ValueType } from "realgrid";
 
-// 하수도 통계 관리 > 13. 하수도 서비스 수준 > tab 2: 주민친화시설
-export const ResidentFriendlyFactTotColumn = {
-    columns: [
-        { name: "ctpvNm", fieldName: "ctpvNm", header: { text: "시도" } },
-        { name: "sggNm", fieldName: "sggNm", header: { text: "시군구" } },
-        { name: "admdstNm", fieldName: "admdstNm", header: { text: "행정구역명" } },
-        { name: "swtrmtFcltNm", fieldName: "swtrmtFcltNm", header: { text: "처리장명" } },
-        {
-            name: "fcltCpct",
-            fieldName: "fcltCpct",
-            header: { text: "시설용량(m³/일)" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0",
-        },
-        {
-            name: "tmplntArea",
-            fieldName: "tmplntArea",
-            header: { text: "처리장면적(㎡)" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0.00",
-        },
-        {
-            name: "whol",
-            fieldName: "whol",
-            header: { text: "총계" },
-            valueType: ValueType.NUMBER,
-            dataFormat: "#,##0",
-        },
-        { name: "brkFcltArea", fieldName: "brkFcltArea", header: { text: "휴게시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "childFrshpSpacArea", fieldName: "childFrshpSpacArea", header: { text: "어린이놀이공간" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "bdySportsFcltArea", fieldName: "bdySportsFcltArea", header: { text: "체력단련시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "sportsFcltArea", fieldName: "sportsFcltArea", header: { text: "운동시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "pkltArea", fieldName: "pkltArea", header: { text: "주차장" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "eduMultiFcltArea", fieldName: "eduMultiFcltArea", header: { text: "교육 및 문화시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "wtlndMakeArea", fieldName: "wtlndMakeArea", header: { text: "습지조성(생태공원)" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "etcCnt", fieldName: "etcCnt", header: { text: "기타" }, valueType: ValueType.NUMBER, dataFormat: "#,##0" },
-        { name: "rmrk", fieldName: "rmrk", header: { text: "비고" } },
-        { name: "statsYr", fieldName: "statsYr", header: { text: "통계연도" }, visible: false },
-        { name: "admdstCd", fieldName: "admdstCd", header: { text: "행정코드" }, visible: false },
-        { name: "rowType", fieldName: "rowType", header: { text: "행타입" }, visible: false },
-    ].map((col) => ({ ...col, editable: false })),
-
-    columnLayout: [
-        {
-            name: "groupA",
-            hideChildHeaders: false,
-            header: { text: "행정구역" },
-            items: ["ctpvNm", "sggNm", "admdstNm"],
-        },
-        "swtrmtFcltNm",
-        "fcltCpct",
-        "tmplntArea",
-        {
-            name: "groupB",
-            hideChildHeaders: false,
-            header: { text: "주민친화시설 면적(㎡)" },
-            items: [
-                "whol",
-                "brkFcltArea",
-                "childFrshpSpacArea",
-                "bdySportsFcltArea",
-                "sportsFcltArea",
-                "pkltArea",
-                "eduMultiFcltArea",
-                "wtlndMakeArea",
-                "etcCnt",
-            ],
-        },
-        "rmrk",
-        "statsYr",
-        "admdstCd",
-        "rowType",
-    ],
-
-    rowStartNum: 2,
-    fixedColumns: 3,
+export const ResidentFriendlyFacilityTab2ColumnConfig = {
     tabKey: "ST00130002",
     tabLabel: "주민친화시설",
+    rowStartNum: 3, // 행정구역 3단 헤더
+    fixedColumns: 1,
+    columns: [
+        { name: "ctpvNm", fieldName: "ctpvNm", header: { text: "시도" }, editable: false },
+        { name: "sggNm", fieldName: "sggNm", header: { text: "시군구" }, editable: false },
+        { name: "admdstNm", fieldName: "admdstNm", header: { text: "행정구역명" }, editable: false },
+        { name: "swtrmtFcltNm", fieldName: "swtrmtFcltNm", header: { text: "처리장명" }, editable: false },
+        { name: "tmplntArea", fieldName: "tmplntArea", header: { text: "처리장\n면적(㎡)" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        // 주민친화시설 면적
+        { name: "whol", fieldName: "whol", header: { text: "총계" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "brkFcltArea", fieldName: "brkFcltArea", header: { text: "휴게시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "childFrshpSpacArea", fieldName: "childFrshpSpacArea", header: { text: "어린이놀이공간" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "bdySportsFcltArea", fieldName: "bdySportsFcltArea", header: { text: "체력단련시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "sportsFcltArea", fieldName: "sportsFcltArea", header: { text: "운동시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "pkltArea", fieldName: "pkltArea", header: { text: "주차장" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "eduMultiFcltArea", fieldName: "eduMultiFcltArea", header: { text: "교육 및\n문화시설" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "wtlndMakeArea", fieldName: "wtlndMakeArea", header: { text: "습지조성\n(생태공원)" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false },
+        { name: "etcCnt", fieldName: "etcCnt", header: { text: "기타" }, valueType: ValueType.NUMBER, dataFormat: "#,##0.0", editable: false }
+    ],
+    columnLayout: [
+        { name: "areaGroup", header: { text: "행정구역" }, items: ["ctpvNm", "sggNm", "admdstNm"] },
+        "swtrmtFcltNm", "tmplntArea",
+        { 
+            name: "facilityGroup", 
+            header: { text: "주민친화시설 면적(㎡)" }, 
+            items: ["whol", "brkFcltArea", "childFrshpSpacArea", "bdySportsFcltArea", "sportsFcltArea", "pkltArea", "eduMultiFcltArea", "wtlndMakeArea", "etcCnt"] 
+        }
+    ]
 };

apps/st/src/entities/statistics/api/statistics-total-service.ts

@@ -23,6 +23,62 @@ import type {
 import type { 
   PublicSewageInquirySummaryResponse
 } from "../model/statistics-total/statistics-sewage-public-total-interface";
+import type { 
+    SewerReservoirMaintainTotalRequest,
+    SewerReservoirStatusTotalResponse,
+    SewerPumpStationStatusTotalResponse
+} from "../model/statistics-total/statistics-sewage-reservoir-total-interface";
+
+import type {
+    MediationPumpMaintainTotalRequest,
+    MediationPumpStatusTotalResponse
+} from "../model/statistics-total/statistics-mediation-pump-total-interface";
+
+import type {
+    ExcretaTreatmentMaintainTotalRequest,
+    ExcretaTreatmentStatusTotalResponse
+} from "../model/statistics-total/statistics-excreta-treatment-total-interface";
+
+
+import type {
+    PrivateSewageFacilitySummaryRequest,
+    PrivateSewageTab1Response,
+    PrivateSewageTab2Response,
+    PrivateSewageTab3Response
+} from "../model/statistics-total/statistics-private-sewage-total-interface";
+
+import type {
+    SewerageFinanceSummaryRequest,
+    SewerageFinanceSettlementResponse,
+    SewerageFeeResponse,
+    SewerageUsageFeeResponse,
+    SewerageOrgCauseResponse
+} from "../model/statistics-total/statistics-sewerage-finance-total-interface";
+
+import type {
+    WaterReuseSummaryRequest,
+    SewerageReuseStatusTab1Response,
+    GrayWaterStatusTab2Response,
+    RainwaterUtilizationStatusTab3Response,
+    SewageWwtRtlztnRegStatusTab4Response,
+    SewageWwtRtlztnSncnStatusTab5Response
+} from "../model/statistics-total/statistics-sewerage-reuse-total-interface";
+
+import type {
+    SludgeSummaryRequest,
+    SludgeProcessingTab1Response,
+    DigestionTankOperTab2Response,
+    SewageSludgeOperTab3Response,
+   HumanWasteSludgeTab4Response
+} from "../model/statistics-total/statistics-sludge-total-interface";
+
+import type {
+    SewerageIndustry,
+    PublicSewageStaffTab1Response,
+    PublicHumanWasteStaffTab2Response,
+    HumanWasteCollectionTab3Response,
+    IndividualSewageTab4Response
+} from "../model/statistics-total/statistics-sewerage-industry-interface";
 
 
 export class StatisticsTotalApiService {
@@ -42,21 +98,6 @@ export class StatisticsTotalApiService {
         return response.data;
     }
 
-    public async getSewerageServiceLevelComplaint(params: SewerageServiceLevelRequest): Promise<SewerageServiceLevelComplaintResponse> {
-        const response = await stClient.get<SewerageServiceLevelComplaintResponse> (
-            `${ENDPOINT.ST_SERVICE.TOTAL}/sewage-complaint`,
-            { params: params }
-        );
-        return response.data;
-    }
-
-    public async getSewerageServiceLevelResidentFriendlyFact(params: SewerageServiceLevelRequest): Promise<SewerageServiceLevelResidentFriendlyFactResponse> {
-        const response = await stClient.get<SewerageServiceLevelResidentFriendlyFactResponse> (
-            `${ENDPOINT.ST_SERVICE.TOTAL}/resident-friendly-facility`,
-            { params: params }
-        );
-        return response.data;
-    }
 
     public async getSewagePipeFactInstallStatus(
         params: SewagePipeTotalRequest,
@@ -122,7 +163,40 @@ export class StatisticsTotalApiService {
         return response.data;
     }
 
-    /** ST00060001 —공공하수처리시설 */
+    /** ★ ST00040001 — 하수저류시설 현황(합계) API */
+    public async getSewerReservoirStatusTotalList(
+        params: SewerReservoirMaintainTotalRequest,
+    ): Promise<SewerReservoirStatusTotalResponse> {
+        const response = await stClient.get<SewerReservoirStatusTotalResponse>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sewer-reservoir-pump/reservoir-status`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /** ★ ST00040002 — 빗물펌프장 현황(합계) API */
+    public async getSewerPumpStationStatusTotalList(
+        params: SewerReservoirMaintainTotalRequest,
+    ): Promise<SewerPumpStationStatusTotalResponse> {
+        const response = await stClient.get<SewerPumpStationStatusTotalResponse>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sewer-reservoir-pump/pump-station-status`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /** ST00050001 — 중계펌프장 현황(합계) API */
+    public async getMediationPumpStationStatusTotalList(
+        params: MediationPumpMaintainTotalRequest,
+    ): Promise<MediationPumpStatusTotalResponse> {
+        const response = await stClient.get<MediationPumpStatusTotalResponse>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/pump-station-status`,
+            { params },
+        );
+        return response.data;
+    }
+        /** 
+         * ST00060001 —공공하수처리시설 */
     public async getSewagePublicFacillityTotal(
         params: SewagePipeMaintainTotalRequest,
     ): Promise<PublicSewageInquirySummaryResponse> {
@@ -132,6 +206,229 @@ export class StatisticsTotalApiService {
         );
         return response.data;
     }
-}
+
+
+    /** ST00070001 — 분뇨처리시설 현황(합계) API */
+    public async getExcretaTreatmentStatusTotalList(
+        params: ExcretaTreatmentMaintainTotalRequest,
+    ): Promise<ExcretaTreatmentStatusTotalResponse> {
+        const response = await stClient.get<ExcretaTreatmentStatusTotalResponse>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/excreta-treatment-status`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /** ST00080001 — 개인하수처리시설 > 처리용량별 오수처리시설(Tab1) */
+    public async getPrivateSewageTab1List(
+        params: PrivateSewageFacilitySummaryRequest,
+    ): Promise<PrivateSewageTab1Response> {
+        const response = await stClient.get<PrivateSewageTab1Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/private-sevage`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /** ST00080002 — 개인하수처리시설 > 정화조현황(Tab2) */
+    public async getPrivateSewageTab2List(
+        params: PrivateSewageFacilitySummaryRequest,
+    ): Promise<PrivateSewageTab2Response> {
+        const response = await stClient.get<PrivateSewageTab2Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/private-tank-status`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /** ST00080003 — 개인하수처리시설 > 개인하수도 관리지역 지정공고 현황(Tab3) */
+    public async getPrivatePrivateMgmtAreaList(
+        params: PrivateSewageFacilitySummaryRequest,
+    ): Promise<PrivateSewageTab3Response> {
+        const response = await stClient.get<PrivateSewageTab3Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/private-mgmt-area`,
+            { params },
+        );
+        return response.data;
+    }
+
+        /** ST00090001 — 하수도 재정결산 조회(Tab1) */
+    public async getSewerageFinancialList(params: SewerageFinanceSummaryRequest): Promise<SewerageFinanceSettlementResponse> {
+        const response = await stClient.get<SewerageFinanceSettlementResponse>(`${ENDPOINT.ST_SERVICE.TOTAL}/sewerage-financial`, { params });
+        return response.data;
+    }
+
+    /** ST00090002 — 하수도 요금 조회(Tab2) */
+    public async getSewerageFeeList(params: SewerageFinanceSummaryRequest): Promise<SewerageFeeResponse> {
+        const response = await stClient.get<SewerageFeeResponse>(`${ENDPOINT.ST_SERVICE.TOTAL}/sewerage-fee`, { params });
+        return response.data;
+    }
+
+    /** ST00090003 — 하수도 사용료 조회(Tab3) */
+    public async getSewerageUsageList(params: SewerageFinanceSummaryRequest): Promise<SewerageUsageFeeResponse> {
+        const response = await stClient.get<SewerageUsageFeeResponse>(`${ENDPOINT.ST_SERVICE.TOTAL}/sewerage-usage`, { params });
+        return response.data;
+    }
+
+    /** ST00090004 — 원인자 부담금 조회(Tab4) */
+    public async getSewerageOrgCauseList(params: SewerageFinanceSummaryRequest): Promise<SewerageOrgCauseResponse> {
+        const response = await stClient.get<SewerageOrgCauseResponse>(`${ENDPOINT.ST_SERVICE.TOTAL}/sewerage-org-cause`, { params });
+        return response.data;
+    }
+
+        /** ST00100001 — 물재이용 > 공공하수처리수 재이용 현황 조회(Tab1) */
+    public async getSewerageReuseTab1List(
+        params: WaterReuseSummaryRequest,
+    ): Promise<SewerageReuseStatusTab1Response> {
+        const response = await stClient.get<SewerageReuseStatusTab1Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/pbl-swage-ruswt`,
+            { params },
+        );
+        return response.data;
+    }
+    /**
+     * ST00100002 — 물재이용 > TAB2 중수도 현황 조회
+     */
+    async getGrayWaterStatusTab2List(
+        params: WaterReuseSummaryRequest
+    ): Promise<GrayWaterStatusTab2Response> { 
+        const response = await stClient.get<GrayWaterStatusTab2Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/gray-water-status`,
+            { params },
+        );
+        return response.data;
+
+    }
+    /** ★ ST00100003 — 물재이용 > TAB3 빗물이용시설현황 조회  */
+    async getRainwaterStatusTab3List(params: WaterReuseSummaryRequest): Promise<RainwaterUtilizationStatusTab3Response> {
+        const response = await stClient.get<RainwaterUtilizationStatusTab3Response>(`${ENDPOINT.ST_SERVICE.TOTAL}/water-reuse`, { params });
+        return response.data;
+    }
+
+    /** ★ ST00100004 — 물재이용 > TAB4 하·폐수처리수 재이용시설 시공업 등록현황 조회 */
+    async getWwtRtlztnRegStatusTab4List(params: WaterReuseSummaryRequest): Promise<SewageWwtRtlztnRegStatusTab4Response> {
+        const response = await stClient.get<SewageWwtRtlztnRegStatusTab4Response>(`${ENDPOINT.ST_SERVICE.TOTAL}/wwt-rtlztn-reg`, { params });
+        return response.data;
+    }
+
+    /** ★ ST00100005 — 물재이용 > TAB5 하·폐수처리수 재이용시설 시공업 인가현황 조회 */
+    async getWwtRtlztnSncnStatusTab5List(params: WaterReuseSummaryRequest): Promise<SewageWwtRtlztnSncnStatusTab5Response> {
+        const response = await stClient.get<SewageWwtRtlztnSncnStatusTab5Response>(`${ENDPOINT.ST_SERVICE.TOTAL}/wwt-rtlztn-aprv`, { params });
+        return response.data;
+    }
+
+    /**
+     * ST00110001 — 하수및분뇨찌꺼기 > TAB1 찌꺼기처리시설현황 조회
+     */
+    async getSludgeProcessingTab1List(
+        params: SludgeSummaryRequest
+    ): Promise<SludgeProcessingTab1Response> {
+        const response = await stClient.get<SludgeProcessingTab1Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sludge-processing`,
+            { params },
+        );
+        return response.data;
+    }
+    /**
+     * ST00110002 — 하수및분뇨찌꺼기 > TAB2 소화조 운영현황 조회
+     */
+    async getSludgeTab2List(
+        params: SludgeSummaryRequest
+    ): Promise<DigestionTankOperTab2Response> {
+        const response = await stClient.get<DigestionTankOperTab2Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sludge-digestion-tank`,
+            { params },
+        );
+        return response.data;
+    }
+
+    /**
+     * ST00110003 — 하수및분뇨찌꺼기 > TAB3 하수찌꺼기 처리시설 운영현황 조회
+     */
+    async getSludgeTab3List(
+        params: SludgeSummaryRequest
+    ): Promise<SewageSludgeOperTab3Response> {
+        // <SewageSludgeOperTab3Response> 제네릭을 추가하여 unknown 에러를 해결합니다.
+        const response = await stClient.get<SewageSludgeOperTab3Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sludge-facility-oper`,
+            { params }
+        );
+        return response.data;
+    }
+    
+    /**
+     * ST00110004 — 하수및분뇨찌꺼기 > TAB4 분뇨찌꺼기(슬러지)처리현황
+     */
+    async getSludgeTab4List(
+    params: SludgeSummaryRequest
+    ): Promise<HumanWasteSludgeTab4Response> {
+    const response = await stClient.get<HumanWasteSludgeTab4Response>(
+        `${ENDPOINT.ST_SERVICE.TOTAL}/sludge-human-waste`,
+        { params },
+    );
+    return response.data;
+    }
+
+    /** ST00120001[TAB1] 공공기관 하수분야 조회 */
+    async getPublicSewageStaffTab1List(
+        params: SewerageIndustry
+    ): Promise<PublicSewageStaffTab1Response> {
+        const response = await stClient.get<PublicSewageStaffTab1Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/public-sewage-staff`,
+            { params }
+        );
+        return response.data;
+    }
+    /** ST00120002[TAB2] 공공기관 분뇨분야 조회 */
+    async getPublicHumanWasteStaffTab2List(
+        params: SewerageIndustry
+    ): Promise<PublicHumanWasteStaffTab2Response> {
+        const response = await stClient.get<PublicHumanWasteStaffTab2Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/public-human-waste-staff`,
+            { params }
+        );
+        return response.data;
+    }
+
+    /** [TAB3] 분뇨수집·운반업 조회 */
+    async getHumanWasteCollectionTab3List(
+        params: SewerageIndustry
+    ): Promise<HumanWasteCollectionTab3Response> {
+        const response = await stClient.get<HumanWasteCollectionTab3Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/human-waste-collection`,
+            { params }
+        );
+        return response.data;
+    }
+
+    /** [TAB4] 개인하수처리관련업 조회 */
+    async getIndividualSewageTab4List(
+        params: SewerageIndustry
+    ): Promise<IndividualSewageTab4Response> {
+        const response = await stClient.get<IndividualSewageTab4Response>(
+            `${ENDPOINT.ST_SERVICE.TOTAL}/indv-swtrmt-rel-bsns`,
+            { params }
+        );
+        return response.data;
+    }
+
+    /** [TAB1] 하수도서비스수준 - 민원 조회 */
+    public async getSewerageServiceLevelComplaint(params: SewerageServiceLevelRequest): Promise<SewerageServiceLevelComplaintResponse> {
+        const response = await stClient.get<SewerageServiceLevelComplaintResponse> (
+            `${ENDPOINT.ST_SERVICE.TOTAL}/sewage-complaint`,
+            { params: params }
+        );
+        return response.data;
+    }
+    /** [TAB1] 하수도서비스수준 - 주민친화시설 조회 */
+    public async getSewerageServiceLevelResidentFriendlyFact(params: SewerageServiceLevelRequest): Promise<SewerageServiceLevelResidentFriendlyFactResponse> {
+        const response = await stClient.get<SewerageServiceLevelResidentFriendlyFactResponse> (
+            `${ENDPOINT.ST_SERVICE.TOTAL}/resident-friendly-facility`,
+            { params: params }
+        );
+        return response.data;
+    }
+    }
+
 
 export const statisticsTotalStatusApi = new StatisticsTotalApiService();

apps/st/src/entities/statistics/model/statistics-total/statistics-service-level-total-interface.ts

@@ -4,14 +4,16 @@ export interface SewerageServiceLevelRequest {
     statsYr?: string;
     sewerBzmnCd?: string;
     rowDataYn?: boolean;
+    summaryYn?: boolean;
+    summaryYearCnt?: number;
 }
 
-export interface SewerageServiceLevelComplaintTotalItem {
+export interface SewageComplaintSummaryItem {
     statsYr: string;
     ctpvNm: string;
-    sggNm: string | null;
-    admdstCd: string;
+    sggNm: string;
     admdstNm: string;
+    admdstCd: string;
     rowType: string;
     swtrmtPpltnCnt: number;
     whol: number;
@@ -23,24 +25,22 @@ export interface SewerageServiceLevelComplaintTotalItem {
     sewerCrgAmt: number;
     etcCnt: number;
     crtrPpltnCvlcptEvntcsCnt: number;
-    rmrk: string | null;
 }
 
 export interface SewerageServiceLevelComplaintResponse {
     status: string;
     message?: string;
-    data: SewerageServiceLevelComplaintTotalItem[];
+    data: SewageComplaintSummaryItem[];
 }
 
 export interface SewerageServiceLevelResidentFriendlyFactTotalItem {
-    statsYr: string;
+   statsYr: string;
     ctpvNm: string;
     sggNm: string;
-    admdstCd: string;
     admdstNm: string;
+    admdstCd: string;
     rowType: string;
     swtrmtFcltNm: string;
-    fcltCpct: number;
     tmplntArea: number;
     whol: number;
     brkFcltArea: number;
@@ -51,7 +51,6 @@ export interface SewerageServiceLevelResidentFriendlyFactTotalItem {
     eduMultiFcltArea: number;
     wtlndMakeArea: number;
     etcCnt: number;
-    rmrk: string;
 }
 
 export interface SewerageServiceLevelResidentFriendlyFactResponse {