[st] feat: IMR 이상치 데이터 그리드 컬럼 필터링 적용

apps/st/src/components/statistics/verification/ImrVerificationHistory.tsx

@@ -3,7 +3,7 @@
 import { useEffect, useMemo, useState } from "react";
 import { Line } from "react-chartjs-2";
 
-import { useQuery } from "@tanstack/react-query";
+import { keepPreviousData, useQuery } from "@tanstack/react-query";
 import {
     getCoreRowModel,
     getPaginationRowModel,
@@ -31,15 +31,17 @@ import type {
     StAnlsRsltResponse,
 } from "@/entities/statistics";
 import {
+    IMR_DETAIL_VISIBLE_COLUMNS_BY_STATS_CD,
+    IMR_DETAIL_VISIBLE_COLUMNS_DEFAULT,
     imrDetailGridColumnInfo,
     imrVerificationHistoryColumns,
 } from "@/entities/statistics";
-import { stAnlsMstApi } from "@/entities/statistics/api/statistics-analysis-master-api";
 import { imrApi } from "@/entities/statistics/api/imr-api";
 import {
     useStAnlsSidoCombo,
     useStAnlsSigunguCombo,
 } from "@/entities/statistics/api/queries";
+import { stAnlsMstApi } from "@/entities/statistics/api/statistics-analysis-master-api";
 import { stAnlsRsltApi } from "@/entities/statistics/api/statistics-analysis-result-api";
 import {
     Button,
@@ -55,6 +57,7 @@ import {
 } from "@common/components";
 
 import DataGrid from "@/components/module/DataGrid";
+import type { ColumnInfo } from "@/components/type/DataGrid.type";
 
 ChartJS.register(
     CategoryScale,
@@ -74,6 +77,19 @@ type DateRangeValue = {
 const EMPTY_DATA: never[] = [];
 const EMPTY_ADST_LIST: AdstZoneResponseDto[] = [];
 
+function getImrDetailGridColumnInfo(statsCd: string): ColumnInfo {
+    const visible =
+        IMR_DETAIL_VISIBLE_COLUMNS_BY_STATS_CD[statsCd] ??
+        IMR_DETAIL_VISIBLE_COLUMNS_DEFAULT;
+    const visibleSet = new Set(visible);
+    return {
+        columns: imrDetailGridColumnInfo.columns.map((col) =>
+            visibleSet.has(col.name) ? col : { ...col, visible: false },
+        ),
+        columnLayout: imrDetailGridColumnInfo.columnLayout,
+    };
+}
+
 const ImrVerificationHistory = () => {
     // Area A Search States
     const [searchSido, setSearchSido] = useState<string>("");
@@ -114,6 +130,11 @@ const ImrVerificationHistory = () => {
     const sidoOptions = sidoData ?? EMPTY_ADST_LIST;
     const sigunguOptions = sigunguData ?? EMPTY_ADST_LIST;
 
+    const imrDetailColumnInfo = useMemo(
+        () => getImrDetailGridColumnInfo(selectedHistory?.statsCd ?? ""),
+        [selectedHistory?.statsCd],
+    );
+
     // Area A Data Fetching
     const { data: historyData } = useQuery({
         queryKey: [
@@ -128,6 +149,7 @@ const ImrVerificationHistory = () => {
                 page: historyPagination.pageIndex,
                 size: historyPagination.pageSize,
             }),
+        placeholderData: keepPreviousData,
     });
 
     const historyTable = useReactTable({
@@ -482,7 +504,7 @@ const ImrVerificationHistory = () => {
                             </div>
                         ) : (
                             <DataGrid
-                                columnInfo={imrDetailGridColumnInfo}
+                                columnInfo={imrDetailColumnInfo}
                                 rowData={gridRowData}
                                 setRowData={setGridRowData}
                                 idFieldName="rsltSn"

apps/st/src/entities/statistics/index.ts

@@ -7,7 +7,11 @@ export {
     type JobStatusDto,
     type OutlierRecordDto,
 } from "./model/analysis/analysis-interface";
-export { imrDetailGridColumnInfo } from "./model/imr/imr-detail-grid-column-info";
+export {
+    IMR_DETAIL_VISIBLE_COLUMNS_BY_STATS_CD,
+    IMR_DETAIL_VISIBLE_COLUMNS_DEFAULT,
+    imrDetailGridColumnInfo,
+} from "./model/imr/imr-detail-grid-column-info";
 export {
     type ImrDetailRequest,
     type ImrDetailResponse,

apps/st/src/entities/statistics/model/imr/imr-detail-grid-column-info.ts

@@ -2,6 +2,52 @@ import { ValueType } from "realgrid";
 
 import type { ColumnInfo } from "@/components/type/DataGrid.type";
 
+/** 공통: 시도·구군·행정구역 */
+const IMR_VISIBLE_REGION_COLUMNS = ["sido", "gugun", "adstDong"] as const;
+
+/** ST00020003, ST00020005: 시도·구군·행정구역·관종구분 */
+const IMR_VISIBLE_REGION_AND_PIPE_SE_COLUMNS = [
+    ...IMR_VISIBLE_REGION_COLUMNS,
+    "pipeSeNm",
+] as const;
+
+/** ST00060001, ST00100001: 시도·구군·행정구역·시설코드·시설명·주소 */
+const IMR_VISIBLE_FACILITY_FULL_COLUMNS = [
+    ...IMR_VISIBLE_REGION_COLUMNS,
+    "admdstCd",
+    "fcltNm",
+    "addr",
+] as const;
+
+/** ST00040001, ST00040002, ST00050001, ST00070001: 시도·구군·행정구역·시설명·주소 */
+const IMR_VISIBLE_FACILITY_NAME_ADDR_COLUMNS = [
+    ...IMR_VISIBLE_REGION_COLUMNS,
+    "fcltNm",
+    "addr",
+] as const;
+
+/**
+ * statsCd별 표시 컬럼 name 목록.
+ * 그 외 코드는 {@link IMR_DETAIL_VISIBLE_COLUMNS_DEFAULT} 사용.
+ */
+export const IMR_DETAIL_VISIBLE_COLUMNS_BY_STATS_CD: Record<
+    string,
+    readonly string[]
+> = {
+    ST00020003: [...IMR_VISIBLE_REGION_AND_PIPE_SE_COLUMNS],
+    ST00020005: [...IMR_VISIBLE_REGION_AND_PIPE_SE_COLUMNS],
+    ST00060001: [...IMR_VISIBLE_FACILITY_FULL_COLUMNS],
+    ST00100001: [...IMR_VISIBLE_FACILITY_FULL_COLUMNS],
+    ST00040001: [...IMR_VISIBLE_FACILITY_NAME_ADDR_COLUMNS],
+    ST00040002: [...IMR_VISIBLE_FACILITY_NAME_ADDR_COLUMNS],
+    ST00050001: [...IMR_VISIBLE_FACILITY_NAME_ADDR_COLUMNS],
+    ST00070001: [...IMR_VISIBLE_FACILITY_NAME_ADDR_COLUMNS],
+};
+
+/** 그 외 statsCd: 시도·구군·행정구역만 표시 */
+export const IMR_DETAIL_VISIBLE_COLUMNS_DEFAULT: readonly string[] =
+    IMR_VISIBLE_REGION_COLUMNS;
+
 export const imrDetailGridColumnInfo: ColumnInfo = {
     columns: [
         {
@@ -44,7 +90,7 @@ export const imrDetailGridColumnInfo: ColumnInfo = {
         {
             name: "pipeSeNm",
             fieldName: "pipeSeNm",
-            header: { text: "관로구분" },
+            header: { text: "관종구분" },
             width: 80,
         },
         {