feat: 10. 물 재이용 화면 구현 중

- 각 tab을 위한 columns,comlumLayout 파일 생성 - tab 1. 공공하수처리 재이용 정의 완성 (PublicSewageTreatmentWaterReuseMngColumn.ts)
2026-01-07 11:28:36 +09:00
parent 81306a7b82
commit 0b8ace2f0d
8 changed files with 247 additions and 11 deletions
@@ -27,7 +27,7 @@ const SewagePipeMaintainMng = () => {

    const getLastYearDataFunc = () => {
        console.log('get last year data');
-        // 전년도 데이터 가져오기
+        // 전연도 데이터 가져오기
    };

    const submitFunc = () => {
@@ -1,12 +1,65 @@
-import SearchForm from "../../module/SearchForm";
+import { useState } from "react";
+import SearchForm from "@/components/module/SearchForm";
+import TabDataGrid from "@/components/module/TabDataGrid";
+import SubmitButton from "@/components/button/SumitButton";
+import SaveButton from "@/components/button/SaveButton";
+import LastYearDataButton from "@/components/button/LastYearDataButton";
+import SubmitExceptionButton from "@/components/button/SubmitExceptionButton";
+import OperateDataButton from "@/components/button/OperateDataButton"

-import { WaterReuseMngColumnInfoList } from "@/components/util/column/management/WaterReuseMngColumn";
+import { PublicSewageTreatmentWaterReuseMngColumn } from "@/components/util/column/management/waterReuse/PublicSewageTreatmentWaterReuseMngColumn";
+import { RecycledWaterStatusMngColumn } from "@/components/util/column/management/waterReuse/RecycledWaterStatusMngColumn";
+import { RainfallUtilizationFacilityStatusMngColumn } from "@/components/util/column/management/waterReuse/RainfallUtilizationFacilityStatusMngColumn";
+import { TreatmentWaterReuseDesignConstructionStatusMngColumn } from "@/components/util/column/management/waterReuse/TreatmentWaterReuseDesignConstructionStatusMngColumn";
+import { TreatmentWaterReuseBussinessApprovalStatusMngColumn } from "@/components/util/column/management/waterReuse/TreatmentWaterReuseBussinessApprovalStatusMngColumn";

 // 하수도 통계 관리 > 10. 물 재이용
 const WaterReuseMng = () => {
+
+    const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
+
+    // tab list
+    const WaterReuseMngColumnList = [
+        PublicSewageTreatmentWaterReuseMngColumn
+    ];
+    const SubmitExceptionFunc = () => {
+        console.log('submit exception');
+        // 예외 제출 로직 
+    };
+
+    const getLastYearDataFunc = () => {
+        console.log('get last year data');
+        // 전연도 데이터 가져오기
+    };
+
+    const submitFunc = () => {
+        console.log('submit');
+        // 제출 로직
+    };
+
+    const saveFunc = () => {
+        console.log('save');
+        // 저장 로직
+    };
+
+    const getOperateDataFunc = () => {
+        console.log('operateData');
+        // 운영 데이터 업데이트 로직
+    };
+    
    return (
        <>
            <SearchForm userMenual={true} />
+
+            <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                <SubmitExceptionButton SubmitExceptionFunc={SubmitExceptionFunc} />
+                <LastYearDataButton getLastYearDataFunc={getLastYearDataFunc} />
+                <SubmitButton submitFunc={submitFunc} />
+                <SaveButton saveFunc={saveFunc} />
+                <OperateDataButton getOperateDataFunc={getOperateDataFunc} />
+            </div>
+
+            <TabDataGrid columnInfo={WaterReuseMngColumnList} rowDataMap={rowDataMap} setRowDataMap={setRowDataMap} />
        </>
    );
 };
@@ -1,8 +0,0 @@
-/**
- * 하수도 통계 관리 > 10. 물 재이용 
- * 5개 Tab: 컬럼 통합 관리
- */
-export const WaterReuseMngColumnInfoList = [];
-    // ========================================
-    // Tab 1: 공공하수처리수 재이용
-    // ========================================
@@ -0,0 +1,175 @@
+import { footerDecimal1 } from "@/components/util/grid/footerSummary";
+
+// 하수도 통계 관리 > 10. 물 재이용 > tab 1: 공공하수처리수 재이용
+export const PublicSewageTreatmentWaterReuseMngColumn = {
+    columns: [
+        // 행정구역
+        { name: 'SIDO', fieldName: '시도', header: { text: '시도' }, editable: false },
+        { name: 'GUGUN', fieldName: '시군구', header: { text: '시군구' }, editable: false, footer: { text: '합계' } },
+
+        // 하수처리장
+        { name: 'BSC_FCT_NM', fieldName: '시설명', header: { text: '시설명' }, editable: false },
+        { name: 'EQP_PRMS_DT', fieldName: '인가일(년/월/일)', header: { text: '인가일(년/월/일)' }, editable: false },
+        { name: 'FCT_CPC', fieldName: '시설용량(㎥/일)', header: { text: '시설용량(㎥/일)' }, editable: false, footer: footerDecimal1 },
+        { name: 'TPUT_TOTAL', fieldName: '연간하수처리량(천톤/년)', header: { text: '연간하수처리량(천톤/년)' }, footer: footerDecimal1 },        
+        { name: 'RSWTR_LAW_YN', fieldName: '법적의무대상(대상/미대상)', header: { text: '법적의무대상(대상/미대상)' } },
+
+        // 재이용시설 > 기본 정보
+        { name: 'INST_YN', fieldName: '설치유무(유/무)', header: { text: '설치유무(유/무)' } },
+
+        // 재이용시설 > 재이용시설 설치시
+        { name: 'RSWTR_RN_DT', fieldName: '가동개시일(yyyy-mm-dd)', header: { text: '가동개시일(yyyy-mm-dd)' } },
+        { name: 'RSWTR_PRMS_DT', fieldName: '설치승인일(yyyy-mm-dd)', header: { text: '설치승인일(yyyy-mm-dd)' } },
+
+        // 재이용시설 > 재이용시설 설치시 > 재처리시설
+        { name: 'RSWTR_CPC', fieldName: '용량(톤/일)', header: { text: '용량(톤/일)' }, footer: footerDecimal1 },
+        { name: 'RSWTR_TRT_NM', fieldName: '공법/기자재', header: { text: '공법/기자재' } },
+
+        // 재이용시설 > 재이용시설 설치시
+        { name: 'RSWTR_PIPE', fieldName: '공급관로길이(km)', header: { text: '공급관로길이(km)' }, footer: footerDecimal1 },
+        { name: 'RSWTR_PUMP', fieldName: '공급펌프(톤/일)', header: { text: '공급펌프(톤/일)' }, footer: footerDecimal1 },
+
+        // 하수처리수 재이용현황 > 총계
+        { name: 'USE_AMNT_TOTAL', fieldName: '총계', header: { text: '총계' }, editable: false, footer: footerDecimal1 },
+
+        // 하수처리수 재이용현황 > 장내용수
+        { name: 'USE_AMNT_D01', fieldName: '계', header: { text: '계' }, editable: false, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S01', fieldName: '세척수', header: { text: '세척수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S02', fieldName: '냉각수', header: { text: '냉각수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S03', fieldName: '청소수', header: { text: '청소수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S04', fieldName: '조경용수', header: { text: '조경용수' }, footer: footerDecimal1 }, // （레거시) 식수대
+        { name: 'USE_AMNT_S05', fieldName: '희석용수', header: { text: '희석용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S06', fieldName: '장내중수도', header: { text: '장내중수도' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S07', fieldName: '장내기타용수', header: { text: '장내기타용수' }, footer: footerDecimal1 },
+
+        // 하수처리수 재이용현황 > 장외용수
+        { name: 'USE_AMNT_D02', fieldName: '계', header: { text: '계' }, editable: false, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S11', fieldName: '청소·화장실용수', header: { text: '청소·화장실용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S12', fieldName: '세척·살수용수', header: { text: '세척·살수용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S13', fieldName: '조경용수', header: { text: '조경용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S14', fieldName: '친수용수', header: { text: '친수용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S15', fieldName: '하천등유지용수', header: { text: '하천등유지용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S16', fieldName: '농업용수', header: { text: '농업용수' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S17', fieldName: '지하수충전', header: { text: '지하수충전' }, footer: footerDecimal1 },
+        { name: 'USE_AMNT_S18', fieldName: '공업용수', header: { text: '공업용수' }, footer: footerDecimal1 },
+
+        // 재이용률
+        { name: 'REUSE_RT', fieldName: '재이용률(%)', header: { text: '재이용률(%)' }, editable: false, footer: footerDecimal1 },
+
+        // 비고
+        { name: 'RMK', fieldName: '비고', header: { text: '비고' } },
+
+        // Hidden: Check fields : 데이터 변경 여부를 판단하는 필드로, UI에서 숨김 처리
+        { name: 'CHK_RSWTR_LAW_YN', fieldName: 'CHK_RSWTR_LAW_YN', header: { text: 'CHK_RSWTR_LAW_YN' }, visible: false },
+        { name: 'CHK_INST_YN', fieldName: 'CHK_INST_YN', header: { text: 'CHK_INST_YN' }, visible: false },
+        { name: 'CHK_RSWTR_RN_DT', fieldName: 'CHK_RSWTR_RN_DT', header: { text: 'CHK_RSWTR_RN_DT' }, visible: false },
+        { name: 'CHK_RSWTR_PRMS_DT', fieldName: 'CHK_RSWTR_PRMS_DT', header: { text: 'CHK_RSWTR_PRMS_DT' }, visible: false },
+        { name: 'CHK_RSWTR_CPC', fieldName: 'CHK_RSWTR_CPC', header: { text: 'CHK_RSWTR_CPC' }, visible: false },
+        { name: 'CHK_RSWTR_TRT_NM', fieldName: 'CHK_RSWTR_TRT_NM', header: { text: 'CHK_RSWTR_TRT_NM' }, visible: false },
+        { name: 'CHK_RSWTR_PIPE', fieldName: 'CHK_RSWTR_PIPE', header: { text: 'CHK_RSWTR_PIPE' }, visible: false },
+        { name: 'CHK_RSWTR_PUMP', fieldName: 'CHK_RSWTR_PUMP', header: { text: 'CHK_RSWTR_PUMP' }, visible: false },
+        { name: 'CHK_TPUT_TOTAL', fieldName: 'CHK_TPUT_TOTAL', header: { text: 'CHK_TPUT_TOTAL' }, visible: false },
+        { name: 'CHK_USE_AMNT_S01', fieldName: 'CHK_USE_AMNT_S01', header: { text: 'CHK_USE_AMNT_S01' }, visible: false },
+        { name: 'CHK_USE_AMNT_S02', fieldName: 'CHK_USE_AMNT_S02', header: { text: 'CHK_USE_AMNT_S02' }, visible: false },
+        { name: 'CHK_USE_AMNT_S03', fieldName: 'CHK_USE_AMNT_S03', header: { text: 'CHK_USE_AMNT_S03' }, visible: false },
+        { name: 'CHK_USE_AMNT_S04', fieldName: 'CHK_USE_AMNT_S04', header: { text: 'CHK_USE_AMNT_S04' }, visible: false },
+        { name: 'CHK_USE_AMNT_S05', fieldName: 'CHK_USE_AMNT_S05', header: { text: 'CHK_USE_AMNT_S05' }, visible: false },
+        { name: 'CHK_USE_AMNT_S06', fieldName: 'CHK_USE_AMNT_S06', header: { text: 'CHK_USE_AMNT_S06' }, visible: false },
+        { name: 'CHK_USE_AMNT_S07', fieldName: 'CHK_USE_AMNT_S07', header: { text: 'CHK_USE_AMNT_S07' }, visible: false },
+        { name: 'CHK_USE_AMNT_S11', fieldName: 'CHK_USE_AMNT_S11', header: { text: 'CHK_USE_AMNT_S11' }, visible: false },
+        { name: 'CHK_USE_AMNT_S12', fieldName: 'CHK_USE_AMNT_S12', header: { text: 'CHK_USE_AMNT_S12' }, visible: false },
+        { name: 'CHK_USE_AMNT_S13', fieldName: 'CHK_USE_AMNT_S13', header: { text: 'CHK_USE_AMNT_S13' }, visible: false },
+        { name: 'CHK_USE_AMNT_S14', fieldName: 'CHK_USE_AMNT_S14', header: { text: 'CHK_USE_AMNT_S14' }, visible: false },
+        { name: 'CHK_USE_AMNT_S15', fieldName: 'CHK_USE_AMNT_S15', header: { text: 'CHK_USE_AMNT_S15' }, visible: false },
+        { name: 'CHK_USE_AMNT_S16', fieldName: 'CHK_USE_AMNT_S16', header: { text: 'CHK_USE_AMNT_S16' }, visible: false },
+        { name: 'CHK_USE_AMNT_S17', fieldName: 'CHK_USE_AMNT_S17', header: { text: 'CHK_USE_AMNT_S17' }, visible: false },
+        { name: 'CHK_USE_AMNT_S18', fieldName: 'CHK_USE_AMNT_S18', header: { text: 'CHK_USE_AMNT_S18' }, visible: false },
+    ],
+
+    columnLayout: [
+        {
+            name: 'group_admin',
+            header: { text: '행정구역' },
+            items: ['SIDO', 'GUGUN']
+        },
+        {
+            name: 'group_facility',
+            header: { text: '하수처리장' },
+            items: [
+                'BSC_FCT_NM',
+                'EQP_PRMS_DT',
+                'FCT_CPC',
+                'RSWTR_LAW_YN'
+            ]
+        },
+        {
+            name: 'group_reuse_facility',
+            header: { text: '재이용시설' },
+            items: [
+                'INST_YN',
+                {
+                    name: 'group_reuse_install',
+                    header: { text: '재이용시설 설치시' },
+                    items: [
+                        'RSWTR_RN_DT',
+                        'RSWTR_PRMS_DT',
+                        {
+                            name: 'group_treatment_facility',
+                            header: { text: '처리시설' },
+                            items: [
+                                'RSWTR_CPC',
+                                'RSWTR_TRT_NM'
+                            ]
+                        },
+                        'RSWTR_PIPE',
+                        'RSWTR_PUMP'
+                    ]
+                }
+            ]
+        },
+        'TPUT_TOTAL',
+        {
+            name: 'group_reuse_current',
+            header: { text: '하수처리수 재이용현황(천톤/년)' },
+            items: [
+                'USE_AMNT_TOTAL',
+                {
+                    name: 'group_indoor_use',
+                    header: { text: '장 내 용 수' },
+                    items: [
+                        'USE_AMNT_D01',
+                        'USE_AMNT_S01',
+                        'USE_AMNT_S02',
+                        'USE_AMNT_S03',
+                        'USE_AMNT_S04',
+                        'USE_AMNT_S05',
+                        'USE_AMNT_S06',
+                        'USE_AMNT_S07'
+                    ]
+                },
+                {
+                    name: 'group_outdoor_use',
+                    header: { text: '장 외 용 수' },
+                    items: [
+                        'USE_AMNT_D02',
+                        'USE_AMNT_S11',
+                        'USE_AMNT_S12',
+                        'USE_AMNT_S13',
+                        'USE_AMNT_S14',
+                        'USE_AMNT_S15',
+                        'USE_AMNT_S16',
+                        'USE_AMNT_S17',
+                        'USE_AMNT_S18'
+                    ]
+                }
+            ]
+        },
+        'REUSE_RT',
+        'RMK'
+    ],
+
+    rowStartNum: 4,
+    fixedColumns: 0,
+    tabKey: 'publicSewageTreatmentWaterReuse',
+    tabLabel: '공공하수처리수 재이용'
+};
@@ -0,0 +1,4 @@
+import { footerInt, footerDecimal1 } from "@/components/util/grid/footerSummary";
+
+ // 하수도 통계 관리 > 10.물 재이용 > tab 3: 빗물이용시설현황
+ export const RainfallUtilizationFacilityStatusMngColumn = {}
@@ -0,0 +1,4 @@
+import { footerInt, footerDecimal1 } from "@/components/util/grid/footerSummary";
+
+ // 하수도 통계 관리 > 10.물 재이용 > tab 2: 중수도 현황
+ export const RecycledWaterStatusMngColumn = {}
@@ -0,0 +1,4 @@
+import { footerInt, footerDecimal1 } from "@/components/util/grid/footerSummary";
+
+ // 하수도 통계 관리 > 10.물 재이용 > tab 5: 하·폐수처리수 재이용사업 인가현황
+ export const TreatmentWaterReuseBussinessApprovalStatusMngColumn = {}
@@ -0,0 +1,4 @@
+import { footerInt, footerDecimal1 } from "@/components/util/grid/footerSummary";
+
+ // 하수도 통계 관리 > 10.물 재이용 > tab 4: 하·폐수처리수 재이용시설 설계시공업 등록현황
+ export const TreatmentWaterReuseDesignConstructionStatusMngColumn = {}