ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:

Browse Source 
- 침입수, RDII 분석결과 페이지 페이징 처리, 삭제 후 조회 로직 에러 수정
This commit is contained in:
swcho
2025-07-25 15:08:39 +09:00
parent b980321557
commit 89ca295b69
3 changed files with 64 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/sn/app/(with-base-layout)/ii/BaseLayout.tsx
+3 -3
View File
@@ -218,7 +218,7 @@ const BaseLayout = ({
<div className="flex items-center w-full">
{showDatePicker && ( // showDatePicker 값에 따라 DatePicker 렌더링
<>
<Label className="ml-4 w-20 text-xl text-gray-600 whitespace-nowrap">상수사용기간</Label>
<Label className="mr-4 w-20 text-xl text-gray-600 whitespace-nowrap">상수사용기간</Label>
<DateMonthPicker
field={{
value: aplcnYmFrom || (() => { // aplcnYm이 없으면 현재 연월을 기본값으로 설정
@@ -247,7 +247,7 @@ const BaseLayout = ({
setAplcnYmTo?.(value); // string 값을 직접 전달
}
}}
selectClass="ml-5 w-[100px]"
selectClass="w-[100px]"
startYear={1900} // 시작 연도 설정
/>
</>
@@ -258,7 +258,7 @@ const BaseLayout = ({
setRtnEnvPartSidoValue={(val) => setCtpvCd?.(val)}
setRtnEnvPartSigunValue={setSigungu} // 선택된 시군구 값을 받을 콜백 함수 전달
>
<SelectBox label={"하수처리장"} value={selectedSwageTreatmentPlant} selectArray={treatmentFacilityOptions} className="col-span-3" selectClass="rounded-lg bg-white truncate" onSelectValue={(val) => onSwageTreatmentPlantChange?.(val)} selectContentClass="z-[101]" />
<SelectBox label={"하수처리장"} value={selectedSwageTreatmentPlant} selectArray={treatmentFacilityOptions} className="col-span-3" selectClass="ml-5 rounded-lg bg-white truncate" onSelectValue={(val) => onSwageTreatmentPlantChange?.(val)} selectContentClass="z-[101]" />
{/* <SelectBox label={"하수처리구역"} value={selectedSwageProcessingZone} selectArray={processingZoneOptions} className="col-span-3" selectClass="rounded-lg bg-white truncate" onSelectValue={(val) => onSwageProcessingZoneChange?.(val)} selectContentClass="z-[101]" /> */}
</GovSidoSigunguSearchForm>
{selectBox?.searchChk ? <SearchFormRight><Button size="sm" onClick={() => selectBox.onSearchClick?.()}>조회</Button></SearchFormRight> : null}
apps/sn/app/(with-base-layout)/ii/rdiiResult/page.tsx
+28 -42
View File
@@ -1,5 +1,5 @@
'use client'
import { deleteData, getData } from '@/components/lib/api'
import { deleteData, getData, useCookieAuth } from '@/components/lib/api'
import { UiTable, downloadExcelWithKoreanHeaders } from '@common/business_components/ui'
import { zodResolver } from '@hookform/resolvers/zod'
import { useState, useEffect } from 'react'
@@ -53,6 +53,8 @@ const tableColumn = [
]
const Result = () => {
const AUTH = useCookieAuth();
const form = useForm<ResultFormValues>({
resolver: zodResolver(formSchema),
defaultValues: {
@@ -81,24 +83,27 @@ const Result = () => {
const [totalData, setTotalData] = useState(0) //총 데이터 수
const [isLoadingResult, setIsLoadingResult] = useState<boolean>(false); // 로딩 상태
const [selectedRowData, setSelectedRowData] = useState<any>(null);
const [selectedRowIndex, setSelectedRowIndex] = useState<number | undefined>(undefined);
const [resetSelection, setResetSelection] = useState<boolean>(false);
const [curPage, setCurPage] = useState(1); // 현재 페이지
useEffect(() => {
// setCurPage(1);
handleSearchButtonClick();
}, [])
useEffect(() => {
// setCurPage(1);
handleSearchButtonClick();
}, [curPage])
const handleSearchButtonClick = async (customFormValues?: Partial<ResultFormValues>) => {
const handleSearchButtonClick = async () => {
setIsLoadingResult(true);
setResetSelection(true);
const formValues = customFormValues || form.getValues(); // react-hook-form에서 현재 값 가져오기
const formValues = form.getValues(); // react-hook-form에서 현재 값 가져오기
console.log("formValues", formValues);
let inftwtAnlsSearchDto;
// swageTmplntCd 처리 로직 추가
const processedSwageTmplntCd = formValues.swageTmplntCd && formValues.swageTmplntCd !== '0'
? (() => {
@@ -108,30 +113,21 @@ const Result = () => {
})()
: null;
if (customFormValues) {
inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom,
"aplcnYmTo": formValues.aplcnYmTo,
"enoCd": formValues.enoCd,
"ctpvCd": formValues.ctpvCd,
"sggCd": formValues.sggCd,
"swageTmplntCd": processedSwageTmplntCd,
};
} else {
inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom && formValues.aplcnYmFrom !== '' ? formValues.aplcnYmFrom : null,
"aplcnYmTo": formValues.aplcnYmTo && formValues.aplcnYmTo !== '' ? formValues.aplcnYmTo : null,
"enoCd": formValues.enoCd === '0' ? null : formValues.enoCd,
"ctpvCd": formValues.ctpvCd === '0' ? null : formValues.ctpvCd,
"sggCd": formValues.sggCd?.val === '0' ? null : formValues.sggCd?.val,
"swageTmplntCd": processedSwageTmplntCd,
};
}
let inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom && formValues.aplcnYmFrom !== '' ? formValues.aplcnYmFrom : null,
"aplcnYmTo": formValues.aplcnYmTo && formValues.aplcnYmTo !== '' ? formValues.aplcnYmTo : null,
"enoCd": formValues.enoCd === '0' ? null : formValues.enoCd,
"ctpvCd": formValues.ctpvCd === '0' ? null : formValues.ctpvCd,
"sggCd": formValues.sggCd?.val === '0' ? null : formValues.sggCd?.val,
"swageTmplntCd": processedSwageTmplntCd,
"auth": AUTH,
};
console.log("Search DTO:", inftwtAnlsSearchDto);
const queryParams = new URLSearchParams({
page: '0',
size: '10000000',
page: `${curPage - 1}`,
size: '10',
sort: 'rainInfwtAnlsSn,desc'
});
Object.entries(inftwtAnlsSearchDto).forEach(([key, value]) => {
@@ -153,14 +149,13 @@ const Result = () => {
// 추가 처리 및 일련번호 추가
return {
...formattedItem,
rowNumber: index + 1, // 1부터 시작하는 일련번호 추가
rowNumber: (curPage - 1) * 10 + index + 1, // 1부터 시작하는 일련번호 추가
scsYn: item.scsYn === null || item.scsYn === undefined ? 'N' : item.scsYn // scsYn이 null이면 'N'으로 변경
};
});
// 선택된 행 초기화
setSelectedRowData(null);
setSelectedRowIndex(undefined);
setTableData(dataWithRowNumber);
setTotalData(dataWithRowNumber.length);
@@ -173,6 +168,7 @@ const Result = () => {
alert("분석결과 조회 중 오류가 발생했습니다.");
setTableData([]);
setTotalData(0);
setSelectedRowData(null);
}
setResetSelection(false);
};
@@ -181,7 +177,6 @@ const Result = () => {
const handleCellClick = (index: number | undefined, headId: string) => {
if (index !== undefined && tableData[index]) {
setSelectedRowData(tableData[index]);
setSelectedRowIndex(index);
console.log("Selected row data:", tableData[index]);
}
};
@@ -258,16 +253,8 @@ const Result = () => {
// 테이블 선택 상태 초기화 트리거
setResetSelection(true);
// 삭제 후 테이블 새로고침을 위해 재검색
const customFormValues: Partial<ResultFormValues> = {
aplcnYmFrom: selectedRowData.aplcnYmFrom || null,
aplcnYmTo: selectedRowData.aplcnYmTo || null,
enoCd: selectedRowData.enoCd || null,
ctpvCd: selectedRowData.ctpvCd || null,
sggCd: selectedRowData.sggCd || null,
swageTmplntCd: selectedRowData.swageTmplntCd || null,
};
await handleSearchButtonClick(customFormValues);
// 검색 버튼 클릭 이벤트 트리거
await handleSearchButtonClick();
setIsLoadingResult(false);
@@ -320,9 +307,8 @@ const Result = () => {
tableData={tableData}
total={totalData}
pageSize={10}
children={undefined}
cellClick={handleCellClick}
onPageChange={(e) => { }}
onPageChange={setCurPage}
resetSelection={resetSelection}
/>
</div>
apps/sn/app/(with-base-layout)/ii/result/page.tsx
+33 -51
View File
@@ -74,26 +74,32 @@ const Result = () => {
}
})
const AUTH = useCookieAuth();
const [tableData, setTableData] = useState<any[]>([]); // API 조회 결과 저장 상태
const [totalData, setTotalData] = useState(0) //총 데이터 수
const [totalData, setTotalData] = useState(0) //총 데이터 수l
const [isLoadingResult, setIsLoadingResult] = useState<boolean>(false); // 로딩 상태
const [selectedRowData, setSelectedRowData] = useState<any>(null);
const [selectedRowIndex, setSelectedRowIndex] = useState<number | undefined>(undefined);
const [resetSelection, setResetSelection] = useState<boolean>(false);
const [curPage, setCurPage] = useState(1); // 현재 페이지
useEffect(() => {
// setCurPage(1);
handleSearchButtonClick();
}, [])
const auth = useCookieAuth();
const handleSearchButtonClick = async (customFormValues?: Partial<ResultFormValues>) => {
// 페이지 변경 시마다 데이터 fetch
useEffect(() => {
handleSearchButtonClick();
}, [curPage]);
const handleSearchButtonClick = async () => {
setIsLoadingResult(true);
setResetSelection(true);
const formValues = customFormValues || form.getValues(); // react-hook-form에서 현재 값 가져오기
const formValues = form.getValues(); // react-hook-form에서 현재 값 가져오기
console.log("formValues", formValues);
let inftwtAnlsSearchDto;
// swageTmplntCd 처리 로직 추가
const processedSwageTmplntCd = formValues.swageTmplntCd && formValues.swageTmplntCd !== '0'
@@ -104,34 +110,22 @@ const Result = () => {
})()
: null;
if (customFormValues) {
inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom,
"aplcnYmTo": formValues.aplcnYmTo,
"enoCd": formValues.enoCd,
"ctpvCd": formValues.ctpvCd,
"sggCd": formValues.sggCd,
"swageTmplntCd": processedSwageTmplntCd,
// "swtrmtZoneCd": formValues.swtrmtZoneCd,
"auth" : auth,
};
} else {
inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom && formValues.aplcnYmFrom !== '' ? formValues.aplcnYmFrom : null,
"aplcnYmTo": formValues.aplcnYmTo && formValues.aplcnYmTo !== '' ? formValues.aplcnYmTo : null,
"enoCd": formValues.enoCd === '0' ? null : formValues.enoCd,
"ctpvCd": formValues.ctpvCd === '0' ? null : formValues.ctpvCd,
"sggCd": formValues.sggCd?.val === '0' ? null : formValues.sggCd?.val,
"swageTmplntCd": processedSwageTmplntCd,
// "swtrmtZoneCd": formValues.swtrmtZoneCd === '0' ? null : formValues.swtrmtZoneCd,
"auth" : auth,
};
}
let inftwtAnlsSearchDto = {
"aplcnYmFrom": formValues.aplcnYmFrom && formValues.aplcnYmFrom !== '' ? formValues.aplcnYmFrom : null,
"aplcnYmTo": formValues.aplcnYmTo && formValues.aplcnYmTo !== '' ? formValues.aplcnYmTo : null,
"enoCd": formValues.enoCd === '0' ? null : formValues.enoCd,
"ctpvCd": formValues.ctpvCd === '0' ? null : formValues.ctpvCd,
"sggCd": formValues.sggCd?.val === '0' ? null : formValues.sggCd?.val,
"swageTmplntCd": processedSwageTmplntCd,
// "swtrmtZoneCd": formValues.swtrmtZoneCd === '0' ? null : formValues.swtrmtZoneCd,
"auth": AUTH,
};
console.log("Search DTO:", inftwtAnlsSearchDto);
const queryParams = new URLSearchParams({
page: '0',
size: '10000000',
page: `${curPage - 1}`,
size: '10',
sort: 'inftwtAnlsSn,desc'
});
Object.entries(inftwtAnlsSearchDto).forEach(([key, value]) => {
@@ -144,6 +138,7 @@ const Result = () => {
console.log("API: ", `v1/inftwtAnls${queryString ? `?${queryString}` : ''}`);
try {
const data = await getData(`v1/inftwtAnls${queryString ? `?${queryString}` : ''}`);
console.log("API response:", data);
// 🎯 각 아이템을 개별적으로 포맷팅하면서 일련번호 추가
const dataWithRowNumber = (data.content || []).map((item: any, index: number) => {
@@ -153,17 +148,16 @@ const Result = () => {
// 추가 처리 및 일련번호 추가
return {
...formattedItem,
rowNumber: index + 1, // 1부터 시작하는 일련번호 추가
rowNumber: (curPage - 1) * 10 + index + 1, // 1부터 시작하는 일련번호 추가
scsYn: item.scsYn === null || item.scsYn === undefined ? 'N' : item.scsYn // scsYn이 null이면 'N'으로 변경
};
});
// 선택된 행 초기화
setSelectedRowData(null);
setSelectedRowIndex(undefined);
setTableData(dataWithRowNumber);
setTotalData(dataWithRowNumber.length);
setTotalData(data?.totalElements || 0); // totalElements가 없을 경우 0으로 설정
console.log("response:", data);
console.log("response data:", dataWithRowNumber);
setIsLoadingResult(false);
@@ -174,7 +168,6 @@ const Result = () => {
setTableData([]);
setTotalData(0);
setSelectedRowData(null);
setSelectedRowIndex(undefined);
}
setResetSelection(false);
};
@@ -183,7 +176,6 @@ const Result = () => {
const handleCellClick = (index: number | undefined, headId: string) => {
if (index !== undefined && tableData[index]) {
setSelectedRowData(tableData[index]);
setSelectedRowIndex(index);
console.log("Selected row data:", tableData[index]);
}
};
@@ -261,18 +253,9 @@ const Result = () => {
// 테이블 선택 상태 초기화 트리거
setResetSelection(true);
// 삭제 후 테이블 새로고침을 위해 재검색
const customFormValues: Partial<ResultFormValues> = {
aplcnYmFrom: selectedRowData.aplcnYmFrom || null,
aplcnYmTo: selectedRowData.aplcnYmTo || null,
enoCd: selectedRowData.enoCd || null,
ctpvCd: selectedRowData.ctpvCd || null,
sggCd: selectedRowData.sggCd || null,
swageTmplntCd: selectedRowData.swageTmplntCd || null,
// swtrmtZoneCd: selectedRowData.swtrmtZoneCd || null,
};
await handleSearchButtonClick(customFormValues);
// 검색 버튼 클릭 이벤트 트리거
await handleSearchButtonClick();
setIsLoadingResult(false);
@@ -325,9 +308,8 @@ const Result = () => {
tableData={tableData}
total={totalData}
pageSize={10}
children={undefined}
cellClick={handleCellClick}
onPageChange={(e) => { }}
onPageChange={setCurPage}
resetSelection={resetSelection}
/>
</div>