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

refactor: tab key 지정된 코드로 변경

Browse Source
This commit is contained in:
rsone001
2026-02-20 16:10:39 +09:00
parent cb29ac6c4d
commit 8fa00797c8
6 changed files with 28 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/st/src/components/statistics/review/SewagePipeMaintainRvw.tsx
+7 -9
View File
@@ -19,7 +19,7 @@ const SewagePipeMaintainRvw = () => {
const { setMessage: alert } = useAlertStore((state) => state);
const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
const [isLoading, setIsLoading] = useState<boolean>(false);
const [activeTab, setActiveTab] = useState<string>('a');
const [activeTab, setActiveTab] = useState<string>('ST00030001');
const searchParamRef = useRef<SearchFormValues | null>(null);
@@ -36,7 +36,7 @@ const SewagePipeMaintainRvw = () => {
const handleReset = () => {
setRowDataMap(new Map());
setActiveTab('a');
setActiveTab('ST00030001');
searchParamRef.current = null;
};
@@ -46,7 +46,7 @@ const SewagePipeMaintainRvw = () => {
return;
}
setActiveTab('a');
setActiveTab('ST00030001');
setRowDataMap(new Map());
try {
@@ -65,12 +65,11 @@ const SewagePipeMaintainRvw = () => {
if (response?.status === 'success' && response.data) {
const newRowDataMap = new Map<string, Record<string, string | number>[]>();
// API 응답이 배열을 직접 반환하는 경우와 객체로 감싸진 경우 모두 처리
const listData = Array.isArray(response.data)
? response.data
: (response.data.mtcStatusList || []);
newRowDataMap.set('a', toGridRows(listData as object[]));
newRowDataMap.set('ST00030001', toGridRows(listData as object[]));
setRowDataMap(newRowDataMap);
} else {
alert(response?.message || "데이터가 없습니다.");
@@ -85,7 +84,7 @@ const SewagePipeMaintainRvw = () => {
const handleActiveTabChange = async (tabKey: string) => {
setActiveTab(tabKey);
const existingAData = rowDataMap.get('a');
const existingAData = rowDataMap.get('ST00030001');
const activeTabData = rowDataMap.get(tabKey);
const hasAData = Array.isArray(existingAData) && existingAData.length > 0;
@@ -97,9 +96,9 @@ const SewagePipeMaintainRvw = () => {
let response;
if (tabKey === 'a') {
if (tabKey === 'ST00030001') {
response = await statisticsManagementApi.getSewerPipeMtcList(searchParamRef.current);
}else if (tabKey === 'b') {
}else if (tabKey === 'ST00030002') {
response = await statisticsManagementApi.getSewerPipeDrdgList(searchParamRef.current);
}
@@ -107,7 +106,6 @@ const SewagePipeMaintainRvw = () => {
setRowDataMap(prev => {
const next = new Map(prev);
// API 응답이 배열을 직접 반환하는 경우와 객체로 감싸진 경우 모두 처리
const listData = Array.isArray(response.data)
? response.data
: (response.data.mtcStatusList || []);
apps/st/src/components/statistics/review/SewagePipeRvw.tsx
+8 -8
View File
@@ -19,7 +19,7 @@ const SewagePipeRvw = () => {
const { setMessage: alert } = useAlertStore((state) => state);
const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
const [isLoading, setIsLoading] = useState<boolean>(false);
const [activeTab, setActiveTab] = useState<string>('a');
const [activeTab, setActiveTab] = useState<string>('ST00020001');
const searchParamRef = useRef<SearchFormValues | null>(null);
@@ -36,7 +36,7 @@ const SewagePipeRvw = () => {
const handleReset = () => {
setRowDataMap(new Map());
setActiveTab('a');
setActiveTab('ST00020001');
};
const handleSearch = async (values: SearchFormValues) => {
@@ -45,7 +45,7 @@ const SewagePipeRvw = () => {
return;
}
setActiveTab('a');
setActiveTab('ST00020001');
setRowDataMap(new Map());
@@ -64,7 +64,7 @@ const SewagePipeRvw = () => {
if (response?.status === 'success' && response.data) {
const newRowDataMap = new Map<string, Record<string, string | number>[]>();
newRowDataMap.set('a', toGridRows(response.data as object[]));
newRowDataMap.set('ST00020001', toGridRows(response.data as object[]));
setRowDataMap(newRowDataMap);
} else {
alert(response?.message || "데이터가 없습니다.");
@@ -79,7 +79,7 @@ const SewagePipeRvw = () => {
const handleActiveTabChange = async (tabKey: string) => {
setActiveTab(tabKey);
const existingAData = rowDataMap.get('a');
const existingAData = rowDataMap.get('ST00020001');
const activeTabData = rowDataMap.get(tabKey);
const hasAData = Array.isArray(existingAData) && existingAData.length > 0;
@@ -92,11 +92,11 @@ const SewagePipeRvw = () => {
let response;
if (tabKey === 'b') {
if (tabKey === 'ST00020002') {
response = await statisticsManagementApi.getSewagePipeFacilityList(searchParamRef.current);
}else if(tabKey === 'c'){
}else if(tabKey === 'ST00020003'){
response = await statisticsManagementApi.getSewagePipeTypeList(searchParamRef.current);
}else if(tabKey === 'd'){
}else if(tabKey === 'ST00020004'){
response = await statisticsManagementApi.getSewagePipeDiamList(searchParamRef.current);
}
apps/st/src/components/statistics/review/SewageReservoirPumpRvw.tsx
+5 -8
View File
@@ -23,7 +23,7 @@ const SewageReservoirPumpRvw = () => {
const { setMessage: alert } = useAlertStore((state) => state);
const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
const [isLoading, setIsLoading] = useState<boolean>(false);
const [activeTab, setActiveTab] = useState<string>('a');
const [activeTab, setActiveTab] = useState<string>('ST00040001');
const searchParamRef = useRef<SearchFormValues | null>(null);
@@ -40,18 +40,17 @@ const SewageReservoirPumpRvw = () => {
const handleReset = () => {
setRowDataMap(new Map());
setActiveTab('a');
setActiveTab('ST00040001');
searchParamRef.current = null;
};
// 조회 버튼 클릭 시: Tab A(하수저류시설) 데이터 로드
const handleSearch = async (values: SearchFormValues) => {
if (!values.sido || values.sido === 'ALL') {
alert('시도를 선택해주세요.');
return;
}
setActiveTab('a');
setActiveTab('ST00040001');
setRowDataMap(new Map());
try {
@@ -71,7 +70,7 @@ const SewageReservoirPumpRvw = () => {
if (response?.status === 'success' && response.data) {
const newRowDataMap = new Map<string, Record<string, string | number>[]>();
newRowDataMap.set('a', toGridRows(response.data as object[]));
newRowDataMap.set('ST00040001', toGridRows(response.data as object[]));
setRowDataMap(newRowDataMap);
} else {
alert(response?.message || "데이터가 없습니다.");
@@ -83,20 +82,18 @@ const SewageReservoirPumpRvw = () => {
}
};
// 탭 전환 시: 데이터가 없는 경우 지연 로딩 (Tab B: 빗물펌프장)
const handleActiveTabChange = async (tabKey: string) => {
setActiveTab(tabKey);
const activeTabData = rowDataMap.get(tabKey);
const hasActiveTabData = Array.isArray(activeTabData) && activeTabData.length > 0;
// 메인 데이터(Tab A)가 있고, 현재 탭 데이터가 없을 때만 API 호출
if (searchParamRef.current && !hasActiveTabData) {
try {
setIsLoading(true);
let response;
if (tabKey === 'b') {
if (tabKey === 'ST00040002') {
response = await statisticsManagementApi.getPumpStationList(searchParamRef.current);
}
apps/st/src/components/util/column/review/SewagePipeMaintainRvwColumn.ts
+2 -2
View File
@@ -5,7 +5,7 @@ import type { GridView, DataColumn, ColumnFooter } from "@/components/type/DataG
// 하수도 통계 관리 03. 하수관로 유지 관리
const rawMaintainList = [
{
tabKey: 'a',
tabKey: 'ST00030001',
tabLabel: '개보수',
rowStartNum: 4,
fixedColumns: 2,
@@ -152,7 +152,7 @@ const rawMaintainList = [
]
},
{
tabKey: 'b',
tabKey: 'ST00030002',
tabLabel: '관로준설',
rowStartNum: 4,
fixedColumns: 2,
apps/st/src/components/util/column/review/SewagePipeRvwColumn.ts
+4 -4
View File
@@ -6,7 +6,7 @@ import type { GridView, DataColumn, ColumnFooter } from "@/components/type/DataG
// 하수도 통계 관리 02. 하수관로
const rawList = [
{
tabKey: 'a',
tabKey: 'ST00020001',
tabLabel: '지역별 시설현황',
rowStartNum: 4,
fixedColumns: 2,
@@ -185,7 +185,7 @@ const rawList = [
]
},
{
tabKey: 'b',
tabKey: 'ST00020002',
tabLabel: '시설별 설치현황',
rowStartNum: 4,
fixedColumns: 3,
@@ -348,7 +348,7 @@ const rawList = [
]
},
{
tabKey: 'c',
tabKey: 'ST00020003',
tabLabel: '관종별 현황',
rowStartNum: 2,
fixedColumns: 3,
@@ -472,7 +472,7 @@ const rawList = [
]
},
{
tabKey: 'd',
tabKey: 'ST00020004',
tabLabel: '관경별 현황',
rowStartNum: 2,
fixedColumns: 3,
apps/st/src/components/util/column/review/SewageReservoirPumpRvwColumn.ts
+2 -2
View File
@@ -10,7 +10,7 @@ import type { GridView, DataColumn, ColumnFooter } from "@/components/type/DataG
// 하수도 통계 관리 04. 하수저류 시설 및 빗물 펌프장
const rawReservoirList = [
{
tabKey: 'a',
tabKey: 'ST00040001',
tabLabel: '하수저류시설현황',
rowStartNum: 3,
fixedColumns: 2,
@@ -176,7 +176,7 @@ const rawReservoirList = [
]
},
{
tabKey: 'b',
tabKey: 'ST00040002',
tabLabel: '빗물펌프장',
rowStartNum: 3,
fixedColumns: 2,