[feat]통계 입력현황,하수도 보급율,펌프장,공공하수처리시설

apps/st/src/components/statistics/review/PublicSewageFacilityRvw.tsx

@@ -0,0 +1,201 @@
+import SearchForm from "@/components/module/SearchForm";
+import DataGrid from "@/components/module/DataGrid";
+import SaveButton from "@/components/button/SaveButton";
+import ApproveButton from "@/components/button/ApproveButton";
+import ReviewOpinionButton from "@/components/button/ReviewOpinionButton";
+import ReturnButton from "@/components/button/ReturnButton";
+
+const PublicSewageFacilityRvw = () => {
+    const columns = [
+        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
+        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
+         { name: '구분', fieldName: '구분', header: { text: '구분' } },
+        { name: '소재지', fieldName: '소재지', header: { text: '소재지' } },
+        //시설용량
+         { name: '시설용량(500m3/일이상/미만)', fieldName: '시설용량(500m3/일이상/미만)', header: { text: '시설용량(500m3/일이상/미만)' } },
+        { name: '(시설용량)물리적', fieldName: '(시설용량)물리적', header: { text: '물리적' } },
+        { name: '(시설용량)생물학적', fieldName: '(시설용량)생물학적', header: { text: '생물학적' } },
+        { name: '(시설용량)고도', fieldName: '(시설용량)고도', header: { text: '고도' } },
+        //유입하수량
+        { name: '유입하수량(500m3/일이상/미만)', fieldName: '유입하수량(500m3/일이상/미만)', header: { text: '유입하수량(500m3/일이상/미만)' } },
+        { name: '(유입하수량)물리적', fieldName: '(유입하수량)물리적', header: { text: '물리적' } },
+        { name: '(유입하수량)생물학적', fieldName: '(유입하수량)생물학적', header: { text: '생물학적' } },
+        { name: '(유입하수량)고도', fieldName: '(유입하수량)고도', header: { text: '고도' } },
+        { name: '오수펌프_총양수량(m3/min)', fieldName: '오수펌프_총양수량(m3/min)', header: { text: '총양수량(m3/min)' } },
+        { name: '우수펌프_총양수량(m3/min)', fieldName: '우수펌프_총양수량(m3/min)', header: { text: '총양수량(m3/min)' } },
+        //방류량
+        { name: '방류량(500m3/일이상/미만)', fieldName: '방류량(500m3/일이상/미만)', header: { text: '방류량(500m3/일이상/미만)' } },
+        { name: '(방류량)물리적', fieldName: '(방류량)물리적', header: { text: '물리적' } },
+        { name: '(방류량)생물학적', fieldName: '(방류량)생물학적', header: { text: '생물학적' } },
+        { name: '(방류량)고도', fieldName: '(방류량)고도', header: { text: '고도' } },
+
+        { name: '유입BOD', fieldName: '유입BOD', header: { text: '유입BOD' } },
+        { name: '방류BOD', fieldName: '방류BOD', header: { text: '방류BOD' } },
+        { name: '유입TOC', fieldName: '유입TOC', header: { text: '유입TOC' } },
+        { name: '방류TOC', fieldName: '방류TOC', header: { text: '방류TOC' } },
+        { name: '유입SS', fieldName: '유입SS', header: { text: '유입SS' } },
+        { name: '방류SS', fieldName: '방류SS', header: { text: '방류SS' } },
+        { name: '유입T-N', fieldName: '유입T-N', header: { text: '유입T-N' } },
+        { name: '방류T-N', fieldName: '방류T-N', header: { text: '방류T-N' } },
+        { name: '유입T-P', fieldName: '유입T-P', header: { text: '유입T-P' } },
+        { name: '방류T-P', fieldName: '방류T-P', header: { text: '방류T-P' } },
+        { name: '유입총대장균군수', fieldName: '유입총대장균군수', header: { text: '유입총대장균군수' } },
+        { name: '방대총대장균군수', fieldName: '방대총대장균군수', header: { text: '방대총대장균군수' } },
+        { name: '처리효율(%)', fieldName: '처리효율(%)', header: { text: '처리효율(%)' } },
+        { name: '처리부하량(kgBOD/D)', fieldName: '처리부하량(kgBOD/D)', header: { text: '처리부하량(kgBOD/D)' } },
+        { name: '처리방법', fieldName: '처리방법', header: { text: '처리방법' } },
+    
+        { name: '(연계처리량)분뇨', fieldName: '(연계처리량)분뇨', header: { text: '분뇨' } },
+        { name: '(연계처리량)축산', fieldName: '(연계처리량)축산', header: { text: '축산' } },
+        { name: '(연계처리량)침출수', fieldName: '(연계처리량)침출수', header: { text: '침출수' } },
+        { name: '(연계처리량)기타', fieldName: '(연계처리량)기타', header: { text: '기타' } },
+       { name: '전화번호', fieldName: '전화번호', header: { text: '전화번호' } },
+       { name: '준공일', fieldName: '준공일', header: { text: '준공일' } },
+       { name: '가동개시일', fieldName: '가동개시일', header: { text: '가동개시일' } },
+        { name: '사업비(백만원)', fieldName: '사업비(백만원)', header: { text: '사업비(백만원)' } },
+        { name: '방류수소독방법', fieldName: '방류수소독방법', header: { text: '방류수소독방법' } },
+        { name: '수계', fieldName: '수계', header: { text: '수계' } },
+         { name: '지류', fieldName: '지류', header: { text: '지류' } },
+           { name: '세부단위구역', fieldName: '세부단위구역', header: { text: '세부단위구역' } },
+            { name: '지역구분', fieldName: '지역구분', header: { text: '지역구분' } },
+              { name: '명칭', fieldName: '명칭', header: { text: '명칭' } },
+              { name: '목표수질(BOD)', fieldName: '목표수질(BOD)', header: { text: '목표수질(BOD)' } },
+                { name: '에너지자립율(%)', fieldName: '에너지자립율(%)', header: { text: '에너지자립율(%)' } },
+                   { name: '에너지자체생산량(TOE)', fieldName: '에너지자체생산량(TOE)', header: { text: '에너지자체생산량(TOE)' } },
+                   { name: '계(TOE)', fieldName: '계(TOE)', header: { text: '계(TOE)' } },
+                   { name: '총전력사용량(KWh)', fieldName: '총전력사용량(KWh)', header: { text: '총전력사용량(KWh)' } },
+                      { name: '자체에너지사용량(TOE)', fieldName: '자체에너지사용량(TOE)', header: { text: '자체에너지사용량(TOE)' } },
+                       { name: '하수처리량당CO2배출량(KgCO2/m3)', fieldName: '하수처리량당CO2배출량(KgCO2/m3)', header: { text: '하수처리량당CO2배출량(KgCO2/m3)' } },
+                       { name: '운영주체(자체/공기업/민간대행)', fieldName: '운영주체(자체/공기업/민간대행)', header: { text: '운영주체(자체/공기업/민간대행)' } },
+  { name: '위탁업체명', fieldName: '위탁업체명', header: { text: '위탁업체명' } },
+   { name: '위탁비용(백만원/년)', fieldName: '위탁비용(백만원/년)', header: { text: '위탁비용(백만원/년)' } },
+      { name: '위탁계약기간(yyyy-mm-dd~)', fieldName: '위탁계약기간(yyyy-mm-dd~)', header: { text: '위탁계약기간(yyyy-mm-dd~)' } },
+        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+    ];
+
+    const columnLayout = [
+        {
+            name: 'groupA',
+            hideChildHeaders: false,
+            header: { text: '행정구역' },
+            items: ['sido', 'sgg'],
+        },
+        '소재지',
+        '시설용량(500m3/일이상/미만)',
+        {
+            name: 'groupB',
+            hideChildHeaders: false,
+            header: { text: '(m3/일)' },
+            items: ['(시설용량)물리적','(시설용량)생물학적','(시설용량)고도'],
+        },
+        '유입하수량(500m3/일이상/미만)',
+        {
+            name: 'groupC',
+            hideChildHeaders: false,
+            header: { text: '(m3/일)' },
+            items: ['(유입하수량)물리적','(유입하수량)생물학적','(유입하수량)고도'],
+        },
+        '방류량(500m3/일이상/미만)',
+        {
+            name: 'groupD',
+            hideChildHeaders: false,
+            header: { text: '(m3/일)' },
+            items: ['(방류량)물리적','(방류량)생물학적','(방류량)고도'],
+        },
+      
+        '유입BOD',
+        '방류BOD',
+        '유입TOC',
+        '방류TOC',
+        '유입SS',
+        '방류SS',
+        '유입T-N',
+        '방류T-N',
+        '유입T-P',
+        '방류T-P',
+        '유입총대장균군수',
+        '방대총대장균군수',
+        '처리효율(%)',
+        '처리부하량(kgBOD/D)',
+        '처리방법',
+        {
+            name: 'groupE',
+            hideChildHeaders: false,
+            header: { text: '연계처리량(m3/일)(500m3/일 이상/ 미만)' },
+            items: ['(연계처리량)분뇨','(연계처리량)축산','(연계처리량)침출수','(연계처리량)기타'],
+        },
+        '전화번호',
+        '준공일',
+        '가동개시일',
+        '사업비(백만원)',
+        '방류수소독방법',
+        'rmk',
+          {
+            name: 'groupF',
+            hideChildHeaders: false,
+            header: { text: '방류수역' },
+            items: ['수계','지류','세부단위구역','지역구분',
+                    {
+            name: 'groupG',
+            hideChildHeaders: false,
+            header: { text: '중권역' },
+            items: ['명칭','목표수질(BOD)'],
+        },
+            ],
+        },
+        '에너지자립율(%)',
+        '에너지자체생산량(TOE)',
+           {
+            name: 'groupH',
+            hideChildHeaders: false,
+            header: { text: '연간 총 에너지 사용량(TOE)' },
+            items: ['계(TOE)','총전력사용량(KWh)','자체에너지사용량(TOE)'],
+        },
+        '하수처리량당CO2배출량(KgCO2/m3)',
+        '운영주체(자체/공기업/민간대행)',
+             {
+            name: 'groupI',
+            hideChildHeaders: false,
+            header: { text: '위탁현황' },
+            items: ['위탁업체명','위탁비용(백만원/년)','위탁계약기간(yyyy-mm-dd~)'],
+        },
+        
+
+    ];
+
+     const approveFunc = () => {
+        console.log('approveFunc');
+        // 승인 로직
+    };
+
+    const saveFunc = () => {
+        console.log('submit');
+        // 저장 로직
+    };
+
+    const reviewOpinionFunc = () => {
+        console.log('reviewOpinionFunc');
+        // 검토의견 작성
+    };
+
+    const returnFunc = () => {
+        console.log('returnFunc');
+        // 반려 
+    };
+
+    return (
+       <>
+            <SearchForm userMenual={true} fctName={true} />
+                      <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                <ReviewOpinionButton reviewOpinionFunc={reviewOpinionFunc} />
+                 <ApproveButton approveFunc={approveFunc} />
+                <ReturnButton returnFunc={returnFunc} />
+                <SaveButton saveFunc={saveFunc} />
+                
+            </div>
+            <DataGrid columnInfo={{columns, columnLayout}} rowStartNum={2} isExcelImport={false} fixedColumns={3} />
+        </>
+    );
+};
+
+export default PublicSewageFacilityRvw;

apps/st/src/components/statistics/review/PumpingStationRvw.tsx

@@ -1,12 +1,163 @@
 import SearchForm from "@/components/module/SearchForm";
 
+import DataGrid from "@/components/module/DataGrid";
+import SaveButton from "@/components/button/SaveButton";
+import ApproveButton from "@/components/button/ApproveButton";
+import ReviewOpinionButton from "@/components/button/ReviewOpinionButton";
+import ReturnButton from "@/components/button/ReturnButton";
 const PumpingStationRvw = () => {
-    
+    const columns = [
+        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
+        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
+        { name: '펌프장명', fieldName: '펌프장명', header: { text: '펌프장명' } },
+         { name: '구분', fieldName: '구분', header: { text: '구분' } },
+        { name: '처리장명', fieldName: '처리장명', header: { text: '처리장명' } },
+        { name: '구분(합류식분류식)', fieldName: '구분(합류식분류식)', header: { text: '구분(합류식분류식)' } },
+        { name: '위치', fieldName: '위치', header: { text: '위치' } },
+        { name: '가동년월일 yyyy-mm-dd', fieldName: '가동년월일 yyyy-mm-dd', header: { text: '가동년월일 yyyy-mm-dd' } },
+        { name: '계획배수면적(km2)', fieldName: '계획배수면적(km2)', header: { text: '계획배수면적(km2)' } },
+        { name: '청천시(A)', fieldName: '청천시(A)', header: { text: '청천시(A)' } },
+        { name: '우천시(B)', fieldName: '우천시(B)', header: { text: '우천시(B)' } },
+        { name: '우수량(B-A)', fieldName: '우수량(B-A)', header: { text: '우수량(B-A)' } },
+        { name: '오수펌프_총양수량(m3/min)', fieldName: '오수펌프_총양수량(m3/min)', header: { text: '총양수량(m3/min)' } },
+        { name: '우수펌프_총양수량(m3/min)', fieldName: '우수펌프_총양수량(m3/min)', header: { text: '총양수량(m3/min)' } },
+        //오수펌프(1)
+        { name: '오수펌프(1)구경(mm)', fieldName: '오수펌프(1)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '오수펌프(1)양수량(m3/min)', fieldName: '오수펌프(1)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '오수펌프(1)펌프대수', fieldName: '오수펌프(1)펌프대수', header: { text: '펌프대수' } },
+        { name: '오수펌프(1)예비대수', fieldName: '오수펌프(1)예비대수', header: { text: '예비대수' } },
+        //오수펌프(2)
+        { name: '오수펌프(2)구경(mm)', fieldName: '오수펌프(2)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '오수펌프(2)양수량(m3/min)', fieldName: '오수펌프(2)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '오수펌프(2)펌프대수', fieldName: '오수펌프(2)펌프대수', header: { text: '펌프대수' } },
+        { name: '오수펌프(2)예비대수', fieldName: '오수펌프(2)예비대수', header: { text: '예비대수' } },
+         //오수펌프(3)
+        { name: '오수펌프(3)구경(mm)', fieldName: '오수펌프(3)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '오수펌프(3)양수량(m3/min)', fieldName: '오수펌프(3)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '오수펌프(3)펌프대수', fieldName: '오수펌프(3)펌프대수', header: { text: '펌프대수' } },
+        { name: '오수펌프(3)예비대수', fieldName: '오수펌프(3)예비대수', header: { text: '예비대수' } },
+        //우수펌프(1)
+        { name: '우수펌프(1)구경(mm)', fieldName: '우수펌프(1)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '우수펌프(1)양수량(m3/min)', fieldName: '우수펌프(1)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '우수펌프(1)펌프대수', fieldName: '우수펌프(1)펌프대수', header: { text: '펌프대수' } },
+        { name: '우수펌프(1)예비대수', fieldName: '우수펌프(1)예비대수', header: { text: '예비대수' } },
+        //우수펌프(2)
+        { name: '우수펌프(2)구경(mm)', fieldName: '우수펌프(2)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '우수펌프(2)양수량(m3/min)', fieldName: '우수펌프(2)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '우수펌프(2)펌프대수', fieldName: '우수펌프(2)펌프대수', header: { text: '펌프대수' } },
+        { name: '우수펌프(2)예비대수', fieldName: '우수펌프(2)예비대수', header: { text: '예비대수' } },
+        //우수펌프(3)
+        { name: '우수펌프(3)구경(mm)', fieldName: '우수펌프(3)구경(mm)', header: { text: '구경(mm)' } },
+        { name: '우수펌프(3)양수량(m3/min)', fieldName: '우수펌프(3)양수량(m3/min)', header: { text: '양수량(m3/min)' } },
+        { name: '우수펌프(3)펌프대수', fieldName: '우수펌프(3)펌프대수', header: { text: '펌프대수' } },
+        { name: '우수펌프(3)예비대수', fieldName: '우수펌프(3)예비대수', header: { text: '예비대수' } },
+
+        { name: '연간전력사용량(kWh/년)', fieldName: '연간전력사용량(kWh/년)', header: { text: '연간전력사용량(kWh/년)' } },
+        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+    ];
+
+    const columnLayout = [
+        {
+            name: 'groupA',
+            hideChildHeaders: false,
+            header: { text: '행정구역' },
+            items: ['sido', 'sgg'],
+        },
+        '펌프장명',
+        '구분',
+        '처리장명',
+        '구분(합류식분류식)',
+        '위치',
+        '가동년월일 yyyy-mm-dd',
+        '계획배수면적(km2)',
+        {
+            name: 'groupB',
+            hideChildHeaders: false,
+            header: { text: '계획시간대최대배수량(m3/hr)' },
+            items: ['청천시(A)','우천시(B)','우수량(B-A)'],
+        },
+        {
+            name: 'groupC',
+            hideChildHeaders: false,
+            header: { text: '배수능력' },
+            items: [
+                '오수펌프_총양수량(m3/min)',
+                {
+                    name: '오수펌프(1)',
+                    hideChildHeaders: false,
+                    header: { text: '오수펌프(1)' },
+                    items: ['오수펌프(1)구경(mm)', '오수펌프(1)양수량(m3/min)', '오수펌프(1)펌프대수', '오수펌프(1)예비대수'],
+                },
+                 {
+                    name: '오수펌프(2)',
+                    hideChildHeaders: false,
+                    header: { text: '오수펌프(2)' },
+                    items: ['오수펌프(2)구경(mm)', '오수펌프(2)양수량(m3/min)', '오수펌프(2)펌프대수', '오수펌프(2)예비대수'],
+                },
+                {
+                    name: '오수펌프(3)',
+                    hideChildHeaders: false,
+                    header: { text: '오수펌프(3)' },
+                    items: ['오수펌프(3)구경(mm)', '오수펌프(3)양수량(m3/min)', '오수펌프(3)펌프대수', '오수펌프(3)예비대수'],
+                },
+                '우수펌프_총양수량(m3/min)',
+                {
+                    name: '우수펌프(1)',
+                    hideChildHeaders: false,
+                    header: { text: '우수펌프(1)' },
+                    items: ['우수펌프(1)구경(mm)', '우수펌프(1)양수량(m3/min)', '우수펌프(1)펌프대수', '우수펌프(1)예비대수'],
+                },
+                        {
+                    name: '우수펌프(2)',
+                    hideChildHeaders: false,
+                    header: { text: '우수펌프(2)' },
+                    items: ['우수펌프(2)구경(mm)', '우수펌프(2)양수량(m3/min)', '우수펌프(2)펌프대수', '우수펌프(2)예비대수'],
+                },
+                        {
+                    name: '우수펌프(3)',
+                    hideChildHeaders: false,
+                    header: { text: '우수펌프(3)' },
+                    items: ['우수펌프(3)구경(mm)', '우수펌프(3)양수량(m3/min)', '우수펌프(3)펌프대수', '우수펌프(3)예비대수'],
+                },
+            ],
+        },
+        '연간전력사용량(kWh/년)',
+        'rmk',
+    ];
+
+     const approveFunc = () => {
+        console.log('approveFunc');
+        // 승인 로직
+    };
+
+    const saveFunc = () => {
+        console.log('submit');
+        // 저장 로직
+    };
+
+    const reviewOpinionFunc = () => {
+        console.log('reviewOpinionFunc');
+        // 검토의견 작성
+    };
+
+    const returnFunc = () => {
+        console.log('returnFunc');
+        // 반려 
+    };
+
     return (
-        <>
+       <>
             <SearchForm userMenual={true} fctName={true} />
+                      <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                <ReviewOpinionButton reviewOpinionFunc={reviewOpinionFunc} />
+                 <ApproveButton approveFunc={approveFunc} />
+                <ReturnButton returnFunc={returnFunc} />
+                <SaveButton saveFunc={saveFunc} />
+                
+            </div>
+            <DataGrid columnInfo={{columns, columnLayout}} rowStartNum={2} isExcelImport={false} fixedColumns={3} />
         </>
     );
-}
+};
 
 export default PumpingStationRvw;

apps/st/src/components/statistics/review/SeweragePenetrationRateRvw.tsx

@@ -1,11 +1,139 @@
 import SearchForm from "@/components/module/SearchForm";
 
+import DataGrid from "@/components/module/DataGrid";
+import SaveButton from "@/components/button/SaveButton";
+import ApproveButton from "@/components/button/ApproveButton";
+import ReviewOpinionButton from "@/components/button/ReviewOpinionButton";
+import ReturnButton from "@/components/button/ReturnButton";
+
 const SeweragePenetrationRateRvw = () => {
+    const columns = [
+        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
+        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
+        { name: '구분', fieldName: '구분', header: { text: '구분' } },
+         { name: '수계', fieldName: '수계', header: { text: '수계' } },
+        { name: 'bstrm', fieldName: '지류', header: { text: '지류' } },
+        { name: 'mdbsn', fieldName: '세부단위유역', header: { text: '세부단위유역' } },
+        { name: 'lgbsn', fieldName: '중권역', header: { text: '중권역' } },
+        { name: 'mdmbsn', fieldName: '소권역', header: { text: '소권역' } },
+        { name: 'specl_cntrpln_ar', fieldName: '특별대책지역', header: { text: '특별대책지역' } },
+        { name: 'total_popl', fieldName: '총인구', header: { text: '총인구' } },
+        { name: 'popl_sm', fieldName: '내국인', header: { text: '내국인' } },
+        { name: 'frgnr_popl_sm', fieldName: '외국인', header: { text: '외국인' } },
+        { name: 'area', fieldName: '행정참고자료면적(㎢)', header: { text: '행정참고자료면적(㎢)' } },
+        { name: 'popltn_sm', fieldName: '총인구(명)', header: { text: '총인구(명)' } },
+        { name: 'ar_sm', fieldName: '총면적(㎢)', header: { text: '총면적(㎢)' } },
+        { name: '계', fieldName: '계', header: { text: '계' } },
+        //공공하수처리인구
+        { name: '합계', fieldName: '합계', header: { text: '합계' } },
+        { name: '1차처리', fieldName: '1차처리', header: { text: '1차처리' } },
+        { name: '2차처리', fieldName: '2차처리', header: { text: '2차처리' } },
+        { name: '3차처리', fieldName: '3차처리', header: { text: '3차처리' } },
+        //폐수처리인구(명)
+         { name: '(폐수처리인구)합계', fieldName: '(폐수처리인구)합계', header: { text: '합계' } },
+        { name: '(폐수처리인구)1차처리', fieldName: '(폐수처리인구)1차처리', header: { text: '1차처리' } },
+        { name: '(폐수처리인구)2차처리', fieldName: '(폐수처리인구)2차처리', header: { text: '2차처리' } },
+        { name: '(폐수처리인구)3차처리', fieldName: '(폐수처리인구)3차처리', header: { text: '3차처리' } },
+
+        { name: 'not_conect_popltn', fieldName: '미접속인구', header: { text: '미접속인구' } },
+        { name: 'swge_proc_zone_inner_ar', fieldName: '면적(㎢)', header: { text: '면적(㎢)' } },
+        { name: 'swge_proc_zone_outer_sm', fieldName: '합계', header: { text: '계' } },
+        { name: 'town_unproc_popltn', fieldName: '미처리인구', header: { text: '미처리인구' } },
+        { name: 'town_swtt_popltn', fieldName: '오수처리인구', header: { text: '오수처리인구' } },
+        { name: 'town_wrrtn_popltn', fieldName: '정화조인구', header: { text: '정화조인구' } },
+        { name: 'swge_proc_zone_outer_ar', fieldName: '면적(㎢)', header: { text: '면적(㎢)' } },
+        { name: 'pblswrg_popltn_suprt', fieldName: '공공하수처리구역인구보급율(%)', header: { text: '공공하수처리구역인구보급율(%)' } },
+        { name: 'adtrt_popltn_suprt', fieldName: '고도처리인구보급율(%)', header: { text: `고도처리인구보급율(%)` } },
+        { name: 'swrg_instlrt', fieldName: '하수도설치율(%)', header: { text: '하수도설치율(%)' } },
+        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+    ];
+
+    const columnLayout = [
+        {
+            name: 'groupA',
+            hideChildHeaders: false,
+            header: { text: '행정구역' },
+            items: ['sido', 'sgg'],
+        },
+        '구분',
+        '수계',
+        'bstrm',
+        {
+            name: 'groupB',
+            hideChildHeaders: false,
+            header: { text: '수계영향권별분류류' },
+            items: ['mdbsn', 'lgbsn', 'mdmbsn'],
+        },
+        'specl_cntrpln_ar',
+        'popltn_sm',
+        'ar_sm',
+        {
+            name: 'groupD',
+            hideChildHeaders: false,
+            header: { text: '하수처리구역내' },
+            items: [
+                '계',
+                {
+                    name: 'pblswrgGroup',
+                    hideChildHeaders: false,
+                    header: { text: '공공하수처리인구(명)' },
+                    items: ['합계', '1차처리', '2차처리', '3차처리'],
+                },
+                {
+                    name: 'wstrGroup',
+                    hideChildHeaders: false,
+                    header: { text: '폐수처리인구(명)' },
+                    items: ['(폐수처리인구)합계', '(폐수처리인구)1차처리', '(폐수처리인구)2차처리', '(폐수처리인구)3차처리'],
+                },
+                'not_conect_popltn',
+                'swge_proc_zone_inner_ar'
+            ],
+        },
+        {
+            name: 'groupE',
+            hideChildHeaders: false,
+            header: { text: '하수처리구역외' },
+            items: ['swge_proc_zone_outer_sm', 'town_unproc_popltn', 'town_swtt_popltn', 'town_wrrtn_popltn', 'swge_proc_zone_outer_ar'],
+        },
+        'pblswrg_popltn_suprt',
+        'adtrt_popltn_suprt',
+        'swrg_instlrt',
+        'rmk',
+    ];
+
+     const approveFunc = () => {
+        console.log('approveFunc');
+        // 승인 로직
+    };
+
+    const saveFunc = () => {
+        console.log('submit');
+        // 저장 로직
+    };
+
+    const reviewOpinionFunc = () => {
+        console.log('reviewOpinionFunc');
+        // 검토의견 작성
+    };
+
+    const returnFunc = () => {
+        console.log('returnFunc');
+        // 반려 
+    };
+
     return (
-        <>
+       <>
             <SearchForm userMenual={true} />
+                      <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                <ReviewOpinionButton reviewOpinionFunc={reviewOpinionFunc} />
+                 <ApproveButton approveFunc={approveFunc} />
+                <ReturnButton returnFunc={returnFunc} />
+                <SaveButton saveFunc={saveFunc} />
+                
+            </div>
+            <DataGrid columnInfo={{columns, columnLayout}} rowStartNum={2} isExcelImport={false} fixedColumns={2} />
         </>
     );
-}
+};
 
 export default SeweragePenetrationRateRvw;

apps/st/src/components/statistics/review/StatsInputSatusRvw.tsx

@@ -1,9 +1,213 @@
 import SearchForm from "@/components/module/SearchForm";
+import DataGrid from "@/components/module/DataGrid";
+import SaveButton from "@/components/button/SaveButton";
+import ApproveButton from "@/components/button/ApproveButton";
+import ReviewOpinionButton from "@/components/button/ReviewOpinionButton";
+import ReturnButton from "@/components/button/ReturnButton";
 
 const StatsInputSatusRvw = () => {
+    const columns = [
+        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
+        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
+
+        { name: '진행상태', fieldName: '진행상태', header: { text: '진행상태' } },
+        //01번
+        { name: '제출자01', fieldName: '제출자01', header: { text: '제출자' } },
+        { name: '연락처01', fieldName: '연락처01', header: { text: '연락처' } },
+        { name: '지자체진행상태01', fieldName: '지자체진행상태01', header: { text: '지자체진행상태' } },
+        { name: '진행상태01', fieldName: '진행상태01', header: { text: '진행상태' } },
+        //02번
+        { name: '제출자02', fieldName: '제출자02', header: { text: '제출자' } },
+        { name: '연락처02', fieldName: '연락처02', header: { text: '연락처' } },
+        { name: '지자체진행상태02', fieldName: '지자체진행상태02', header: { text: '지자체진행상태' } },
+        { name: '진행상태02', fieldName: '진행상태02', header: { text: '진행상태' } },
+        // 03번
+        { name: '제출자03', fieldName: '제출자03', header: { text: '제출자' } },
+        { name: '연락처03', fieldName: '연락처03', header: { text: '연락처' } },
+        { name: '지자체진행상태03', fieldName: '지자체진행상태03', header: { text: '지자체진행상태' } },
+        { name: '진행상태03', fieldName: '진행상태03', header: { text: '진행상태' } },
+
+        // 04번
+        { name: '제출자04', fieldName: '제출자04', header: { text: '제출자' } },
+        { name: '연락처04', fieldName: '연락처04', header: { text: '연락처' } },
+        { name: '지자체진행상태04', fieldName: '지자체진행상태04', header: { text: '지자체진행상태' } },
+        { name: '진행상태04', fieldName: '진행상태04', header: { text: '진행상태' } },
+
+        // 05번
+        { name: '제출자05', fieldName: '제출자05', header: { text: '제출자' } },
+        { name: '연락처05', fieldName: '연락처05', header: { text: '연락처' } },
+        { name: '지자체진행상태05', fieldName: '지자체진행상태05', header: { text: '지자체진행상태' } },
+        { name: '진행상태05', fieldName: '진행상태05', header: { text: '진행상태' } },
+
+        // 06번
+        { name: '제출자06', fieldName: '제출자06', header: { text: '제출자' } },
+        { name: '연락처06', fieldName: '연락처06', header: { text: '연락처' } },
+        { name: '지자체진행상태06', fieldName: '지자체진행상태06', header: { text: '지자체진행상태' } },
+        { name: '진행상태06', fieldName: '진행상태06', header: { text: '진행상태' } },
+
+        // 07번
+        { name: '제출자07', fieldName: '제출자07', header: { text: '제출자' } },
+        { name: '연락처07', fieldName: '연락처07', header: { text: '연락처' } },
+        { name: '지자체진행상태07', fieldName: '지자체진행상태07', header: { text: '지자체진행상태' } },
+        { name: '진행상태07', fieldName: '진행상태07', header: { text: '진행상태' } },
+
+        // 08번
+        { name: '제출자08', fieldName: '제출자08', header: { text: '제출자' } },
+        { name: '연락처08', fieldName: '연락처08', header: { text: '연락처' } },
+        { name: '지자체진행상태08', fieldName: '지자체진행상태08', header: { text: '지자체진행상태' } },
+        { name: '진행상태08', fieldName: '진행상태08', header: { text: '진행상태' } },
+
+        // 09번
+        { name: '제출자09', fieldName: '제출자09', header: { text: '제출자' } },
+        { name: '연락처09', fieldName: '연락처09', header: { text: '연락처' } },
+        { name: '지자체진행상태09', fieldName: '지자체진행상태09', header: { text: '지자체진행상태' } },
+        { name: '진행상태09', fieldName: '진행상태09', header: { text: '진행상태' } },
+
+        // 10번
+        { name: '제출자10', fieldName: '제출자10', header: { text: '제출자' } },
+        { name: '연락처10', fieldName: '연락처10', header: { text: '연락처' } },
+        { name: '지자체진행상태10', fieldName: '지자체진행상태10', header: { text: '지자체진행상태' } },
+        { name: '진행상태10', fieldName: '진행상태10', header: { text: '진행상태' } },
+
+        // 11번
+        { name: '제출자11', fieldName: '제출자11', header: { text: '제출자' } },
+        { name: '연락처11', fieldName: '연락처11', header: { text: '연락처' } },
+        { name: '지자체진행상태11', fieldName: '지자체진행상태11', header: { text: '지자체진행상태' } },
+        { name: '진행상태11', fieldName: '진행상태11', header: { text: '진행상태' } },
+
+        // 12번
+        { name: '제출자12', fieldName: '제출자12', header: { text: '제출자' } },
+        { name: '연락처12', fieldName: '연락처12', header: { text: '연락처' } },
+        { name: '지자체진행상태12', fieldName: '지자체진행상태12', header: { text: '지자체진행상태' } },
+        { name: '진행상태12', fieldName: '진행상태12', header: { text: '진행상태' } },
+
+        // 13번
+        { name: '제출자13', fieldName: '제출자13', header: { text: '제출자' } },
+        { name: '연락처13', fieldName: '연락처13', header: { text: '연락처' } },
+        { name: '지자체진행상태13', fieldName: '지자체진행상태13', header: { text: '지자체진행상태' } },
+        { name: '진행상태13', fieldName: '진행상태13', header: { text: '진행상태' } },
+        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+    ];
+
+    const columnLayout = [
+        {
+            name: 'groupA',
+            hideChildHeaders: false,
+            header: { text: '행정구역' },
+            items: ['sido', 'sgg'],
+        },
+        '진행상태',
+        {
+            name: 'groupB',
+            hideChildHeaders: false,
+            header: { text: '01. 하수도 보급율' },
+            items: ['제출자01', '연락처01', '지자체진행상태01','진행상태01'],
+        },
+      {
+            name: 'groupC',
+            hideChildHeaders: false,
+            header: { text: '02. 하수관로' },
+            items: ['제출자02', '연락처02', '지자체진행상태02','진행상태02'],
+        },
+       {
+        name: 'groupD',
+        hideChildHeaders: false,
+        header: { text: '03. 하수관로유지관리' },
+        items: ['제출자03', '연락처03', '지자체진행상태03', '진행상태03'],
+    },
+    {
+        name: 'groupE',
+        hideChildHeaders: false,
+        header: { text: '04. 하수저류시설' },
+        items: ['제출자04', '연락처04', '지자체진행상태04', '진행상태04'],
+    },
+    {
+        name: 'groupF',
+        hideChildHeaders: false,
+        header: { text: '05. 펌프장' },
+        items: ['제출자05', '연락처05', '지자체진행상태05', '진행상태05'],
+    },
+    {
+        name: 'groupG',
+        hideChildHeaders: false,
+        header: { text: '06. 공공하수처리시설' },
+        items: ['제출자06', '연락처06', '지자체진행상태06', '진행상태06'],
+    },
+    {
+        name: 'groupH',
+        hideChildHeaders: false,
+        header: { text: '07. 분뇨처리시설' },
+        items: ['제출자07', '연락처07', '지자체진행상태07', '진행상태07'],
+    },
+    {
+        name: 'groupI',
+        hideChildHeaders: false,
+        header: { text: '08. 개인하수처리시설' },
+        items: ['제출자08', '연락처08', '지자체진행상태08', '진행상태08'],
+    },
+    {
+        name: 'groupJ',
+        hideChildHeaders: false,
+        header: { text: '09. 하수도재정' },
+        items: ['제출자09', '연락처09', '지자체진행상태09', '진행상태09'],
+    },
+    {
+        name: 'groupK',
+        hideChildHeaders: false,
+        header: { text: '10. 물재이용' },
+        items: ['제출자10', '연락처10', '지자체진행상태10', '진행상태10'],
+    },
+    {
+        name: 'groupL',
+        hideChildHeaders: false,
+        header: { text: '11. 하수및분뇨찌꺼기' },
+        items: ['제출자11', '연락처11', '지자체진행상태11', '진행상태11'],
+    },
+    {
+        name: 'groupM',
+        hideChildHeaders: false,
+        header: { text: '12. 하수및분뇨관련사업' },
+        items: ['제출자12', '연락처12', '지자체진행상태12', '진행상태12'],
+    },
+    {
+        name: 'groupN',
+        hideChildHeaders: false,
+        header: { text: '13. 하수도서비스수준' },
+        items: ['제출자13', '연락처13', '지자체진행상태13', '진행상태13'],
+    }
+    ];
+
+    const approveFunc = () => {
+        console.log('approveFunc');
+        // 승인 로직
+    };
+
+    const saveFunc = () => {
+        console.log('submit');
+        // 저장 로직
+    };
+
+    const reviewOpinionFunc = () => {
+        console.log('reviewOpinionFunc');
+        // 검토의견 작성
+    };
+
+    const returnFunc = () => {
+        console.log('returnFunc');
+        // 반려 
+    };
+
     return (
         <>
             <SearchForm userMenual={true} />
+                      <div className="flex justify-end items-center gap-[0.6rem] m-[0.6rem]">
+                <ReviewOpinionButton reviewOpinionFunc={reviewOpinionFunc} />
+                 <ApproveButton approveFunc={approveFunc} />
+                <ReturnButton returnFunc={returnFunc} />
+                <SaveButton saveFunc={saveFunc} />
+                
+            </div>
+            <DataGrid columnInfo={{columns, columnLayout}} rowStartNum={2} isExcelImport={false} fixedColumns={2} />
         </>
     );
 }