[st] feat: IMR 검증 이력 이상치 데이터 차트 수정
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -54,8 +54,8 @@ export const imrDetailGridColumnInfo: ColumnInfo = {
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
name: "statsNm",
|
||||
fieldName: "statsNm",
|
||||
name: "vrfcTrgtNm",
|
||||
fieldName: "vrfcTrgtNm",
|
||||
header: { text: "항목명" },
|
||||
width: 150,
|
||||
},
|
||||
@@ -78,7 +78,7 @@ export const imrDetailGridColumnInfo: ColumnInfo = {
|
||||
"addr",
|
||||
"pipeSeCd",
|
||||
"vrfcTrgtSn",
|
||||
"statsNm",
|
||||
"vrfcTrgtNm",
|
||||
"cryrVl",
|
||||
],
|
||||
};
|
||||
|
||||
+1
-1
@@ -6,8 +6,8 @@ export interface StAnlsRsltResponse {
|
||||
rsltSn: number; // 결과 일련번호
|
||||
anlsSn: number; // 분석 일련번호
|
||||
vrfcTrgtSn: number; // 검증 대상 일련번호
|
||||
vrfcTrgtNm: string; // 검증 대상명(항목명)
|
||||
admdstCd: string; // 행정구역 코드
|
||||
admdstNm: string; // 행정구역 명칭
|
||||
sido: string; // 시도
|
||||
gugun: string; // 시군구
|
||||
adstDong: string; // 행정동
|
||||
|
||||
Reference in New Issue
Block a user