[st] feat: IMR 검증 이력 이상치 데이터 차트 수정

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

@@ -99,7 +99,7 @@ const ImrVerificationHistory = () => {
     // Area A Pagination
     const [historyPagination, setHistoryPagination] = useState({
         pageIndex: 0,
-        pageSize: 10,
+        pageSize: 5,
     });
 
     // Codes for Filter
@@ -178,20 +178,21 @@ const ImrVerificationHistory = () => {
             ...item,
             statsNm: selectedHistory?.vrfcTrgtNm ?? "-",
         }));
-        setGridRowData(mapped as unknown as Record<string, string | number>[]);
+        setGridRowData(mapped as Record<string, string | number>[]);
     }, [detailData, selectedHistory]);
 
     // Area C Data Fetching
     const { data: chartData, isLoading: isChartLoading } = useQuery({
         queryKey: [
-            "imr-log",
+            ENDPOINT.STATVERIFY_SERVICE.IMR,
             selectedHistory?.anlsSn,
             selectedDetail?.vrfcTrgtSn,
             selectedDetail?.admdstCd,
         ],
         queryFn: () =>
             imrApi.getOutliersLog({
-                anlsSn: selectedHistory!.anlsSn,
+                jobUuid: selectedHistory!.jobUuid,
+                anlsSn: selectedDetail!.anlsSn,
                 vrfcTrgtSn: selectedDetail!.vrfcTrgtSn,
                 admdstCd: selectedDetail!.admdstCd,
             }),
@@ -244,9 +245,7 @@ const ImrVerificationHistory = () => {
                 },
                 title: {
                     display: true,
-                    text: selectedDetail
-                        ? `${selectedDetail.fcltNm} - I-MR 분석 차트`
-                        : "I-MR 분석 차트",
+                    text: "I-MR 잔차 관리도",
                     font: {
                         size: 16,
                         weight: "bold",
@@ -435,7 +434,7 @@ const ImrVerificationHistory = () => {
 
             <div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
                 {/* 영역 B: 상세 데이터 그리드 */}
-                <div className="card card-border bg-white p-6">
+                <div className="card card-border bg-white p-4">
                     <div className="flex items-center justify-between">
                         <h2 className="pl-2 text-[1.6rem] font-bold text-title">
                             이상치 데이터
@@ -457,7 +456,7 @@ const ImrVerificationHistory = () => {
                             다운로드
                         </Button>
                     </div>
-                    <div className="mt-2 h-[45rem]">
+                    <div className="mt-2">
                         {isDetailLoading ? (
                             <div className="flex h-full w-full items-center justify-center">
                                 <div className="relative size-[5rem]">
@@ -480,11 +479,11 @@ const ImrVerificationHistory = () => {
                                 isExcelImport={false}
                                 highlightedRowId={selectedDetail?.rsltSn}
                                 onRowClick={(e) => {
-                                    if (!e.rowId) return;
+                                    if (!e.anlsSn) return;
                                     const row = detailData?.content?.find(
                                         (item) =>
                                             String(item.rsltSn) ===
-                                            String(e.rowId),
+                                            String(e.rsltSn),
                                     );
                                     if (row) setSelectedDetail(row);
                                 }}
@@ -494,23 +493,18 @@ const ImrVerificationHistory = () => {
                 </div>
 
                 {/* 영역 C: Line Chart */}
-                <div className="card card-border bg-white p-6">
-                    <h2 className="mb-4 text-[1.6rem] font-bold text-title">
-                        검증 결과 차트
-                    </h2>
-                    <div className="flex h-[45rem] items-center justify-center rounded-lg border bg-slate-50 p-4">
-                        {isChartLoading ? (
-                            <div className="relative size-[5rem]">
-                                <LoadingWithAnimation color="primary" />
-                            </div>
-                        ) : lineChartData ? (
-                            <Line options={chartOptions} data={lineChartData} />
-                        ) : (
-                            <div className="text-[1.4rem] text-muted-foreground">
-                                상세 데이터를 선택하면 차트가 표시됩니다.
-                            </div>
-                        )}
-                    </div>
+                <div className="m-2 flex h-[45rem] items-center justify-center rounded-sm border bg-white p-4">
+                    {isChartLoading ? (
+                        <div className="relative size-[5rem]">
+                            <LoadingWithAnimation color="primary" />
+                        </div>
+                    ) : lineChartData ? (
+                        <Line options={chartOptions} data={lineChartData} />
+                    ) : (
+                        <div className="text-[1.4rem]">
+                            이상치 데이터를 선택하면 차트가 표시됩니다.
+                        </div>
+                    )}
                 </div>
             </div>
         </div>