refactor: 00. 통계입력현황 컬럼 파일로 분리

- StatsInputSatusMngColumn.ts 파일 생성 후 컬럼 정보 정의
- StatsInputSatusMng.tsx 컴포넌트 수정 (컬럼 정보 파일 import)

apps/st/src/components/statistics/management/StatsInputSatusMng.tsx

@@ -6,46 +6,21 @@ import ReturnButton from "@/components/button/ReturnButton";
 import ReviewOpinionButton from "@/components/button/ReviewOpinionButton";
 import { useState } from "react";
 
+import { StatsInputSatusMngColumn } from "@/components/util/column/management/StatsInputSatusMngColumn";
+
 // 하수도 통계 관리 > 00. 통계 입력 현황
 const StatsInputSatusMng = () => {
-    const columns = [
-        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
-        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
-        { name: 'menu_nm', fieldName: '구분', header: { text: '구분' } },
-        { name: 'locg_status_nm', fieldName: '진행상황', header: { text: '진행상황' } },
-        { name: 'locg_status', fieldName: '작성률', header: { text: '작성률' } },
-        { name: 'locg_charger', fieldName: '작성자', header: { text: '작성자' } },
-        { name: 'locg_cttpc', fieldName: '작성자 연락처', header: { text: '작성자 연락처' } },
-        { name: 'locg_dept', fieldName: '작성자 부서', header: { text: '작성자 부서' } },
-        { name: 'locg_job', fieldName: '작성자 직제', header: { text: '작성자 직제' } },
-        { name: 'locg_cnfirm_nm', fieldName: '승인자', header: { text: '승인자' } },
-        { name: 'locg_cnfirm_dept', fieldName: '승인자 부서', header: { text: '승인자 부서' } },
-        { name: 'locg_cnfirm_job', fieldName: '승인자 직제', header: { text: '승인자 직제' } },
-        { name: 'return_opinion_sm', fieldName: '반려 사유', header: { text: '반려 사유' } },
-    ];
-
-    const columnLayout = [
-        'sido',
-        'sgg',
-        'menu_nm',
-        {
-            name: 'groupA',
-            hideChildHeaders: false,
-            header: { text: '하수도사업자' },
-            items: columns.filter((c) => ['sido', 'sgg', 'menu_nm'].includes(c.name) === false).map((m) => m.name),
-        },
-    ];
-
-    const approveFunc = () => {
-        console.log('appoved');
-        // 승인 요청 로직
-    };
 
     const rejectFunc = () => {
         console.log('reject');
         // 보완 요청 로직
     };
 
+    const approveFunc = () => {
+        console.log('appoved');
+        // 승인 요청 로직
+    };
+
     const returnFunc = () => {
         console.log('return');
         // 반려 로직
@@ -69,7 +44,7 @@ const StatsInputSatusMng = () => {
                 <RejectButton rejectFunc={rejectFunc} />
                 <ApproveButton approveFunc={approveFunc} />
             </div>
-            <DataGrid columnInfo={{ columns, columnLayout }} rowStartNum={2} fixedColumns={3} rowData={rowData} setRowData={setRowData} />
+            <DataGrid columnInfo={ StatsInputSatusMngColumn } rowStartNum={2} fixedColumns={3} rowData={rowData} setRowData={setRowData} />
         </>
     );
 };

apps/st/src/components/util/column/management/StatsInputSatusMngColumn.ts

@@ -0,0 +1,44 @@
+/**
+ * 하수도 통계 관리 > 00. 통계 입력 현황
+ * 단일 Tab
+ */
+export const StatsInputSatusMngColumn = {
+    columns: [
+        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
+        { name: 'sgg', fieldName: '구군', header: { text: '구군' } },
+        { name: 'menu_nm', fieldName: '구분', header: { text: '구분' } },
+        { name: 'locg_status_nm', fieldName: '진행상황', header: { text: '진행상황' } },
+        { name: 'locg_status', fieldName: '작성률', header: { text: '작성률' } },
+        { name: 'locg_charger', fieldName: '작성자', header: { text: '작성자' } },
+        { name: 'locg_cttpc', fieldName: '작성자연락처', header: { text: '작성자연락처' } },
+        { name: 'locg_dept', fieldName: '부서', header: { text: '부서' } },
+        { name: 'locg_job', fieldName: '직제', header: { text: '직제' } },
+        { name: 'locg_cnfirm_nm', fieldName: '승인자', header: { text: '승인자' } },
+        { name: 'locg_cnfirm_dept', fieldName: '부서', header: { text: '부서' } },
+        { name: 'locg_cnfirm_job', fieldName: '직제', header: { text: '직제' } },
+        { name: 'return_opinion_sm', fieldName: '반려사유', header: { text: '반려사유' } },
+    ],
+
+    columnLayout: [
+        'sido',
+        'sgg',
+        'menu_nm',
+        {
+            name: 'groupA',
+            hideChildHeaders: false,
+            header: { text: '하수도사업자' },
+            items: [
+                'locg_status_nm',
+                'locg_status',
+                'locg_charger',
+                'locg_cttpc',
+                'locg_dept',
+                'locg_job',
+                'locg_cnfirm_nm',
+                'locg_cnfirm_dept',
+                'locg_cnfirm_job',
+                'return_opinion_sm'
+            ],
+        },
+    ]
+};