어드민페이지 기수별 지원서 개수 조회 구현

src/apis/hooks/admin/docs/useGetStatistic.ts

@@ -14,18 +14,27 @@ const getStatisticPath = () => '/api/admin/application/statistic';
 
 const statisticQueryKey = [getStatisticPath()];
 
-export const getStatistic = async (): Promise<statisticInterface> => {
-  const response =
-    await fetchInstance.get<statisticInterface>(getStatisticPath());
+export const getStatistic = async (
+  classYearId: number
+): Promise<statisticInterface> => {
+  const response = await fetchInstance.get<statisticInterface>(
+    getStatisticPath(),
+    {
+      params: {
+        classYearId: classYearId,
+      },
+    }
+  );
+
   return response.data;
 };
 
-export const useGetStatistic = () => {
+export const useGetStatistic = (classYearId: number) => {
   const accessToken = sessionStorage.getItem('accessToken');
 
   return useQuery<statisticInterface, Error>({
     queryKey: [statisticQueryKey],
-    queryFn: getStatistic,
+    queryFn: () => getStatistic(classYearId),
     enabled: !!accessToken,
   });
 };

src/apis/hooks/admin/docs/useGetTrack.ts

@@ -16,18 +16,22 @@ const getTrackPath = () => '/api/admin/application/statistic/track';
 
 const statisticQueryKey = [getTrackPath()];
 
-const getTrack = async (): Promise<TrackInterface> => {
-  const response = await fetchInstance.get<TrackInterface>(getTrackPath());
+const getTrack = async (classYearId: number): Promise<TrackInterface> => {
+  const response = await fetchInstance.get<TrackInterface>(getTrackPath(), {
+    params: {
+      classYearId: classYearId,
+    },
+  });
 
   return response.data;
 };
 
-export const useGetTrack = () => {
+export const useGetTrack = (classYearId: number) => {
   const accessToken = sessionStorage.getItem('accessToken');
 
   return useQuery<TrackInterface, Error>({
     queryKey: [statisticQueryKey],
-    queryFn: getTrack,
+    queryFn: () => getTrack(classYearId),
     enabled: !!accessToken,
   });
 };

src/pages/admin/AdminDocConfirmPage.tsx

@@ -1,7 +1,8 @@
-import { useState, lazy } from 'react';
+import { useState, useEffect, lazy } from 'react';
 
 import { useGetStatistic } from '@gdg/apis/hooks/admin/docs/useGetStatistic';
 import { useGetTrack } from '@gdg/apis/hooks/admin/docs/useGetTrack';
+import { useGetClassYearList } from '@gdg/apis/hooks/yearId/useGetClassYearList';
 import { DisplayLayout } from '@gdg/styles/LayoutStyle';
 
 import ClassYearIdDropDown from './components/docs/ClassYearIdDropDown';
@@ -23,11 +24,32 @@ const CurrentApplyInfo = lazy(
 const AdminSearchBar = lazy(() => import('./components/AdminSearchBar'));
 
 const AdminDocConfirmPage = () => {
+  const { data: yearIdList } = useGetClassYearList();
+
   const [isMarked, setIsMarked] = useState<boolean>(false);
   const [searchName, setSearchName] = useState<string>('');
   const [trackIdx, setTrackIdx] = useState<number>(0);
   const [isDropdownOpen, setIsDropdownOpen] = useState<boolean>(false);
-  const [classYearId, setClassYearId] = useState<number>(4);
+  const [classYearId, setClassYearId] = useState<number>(1);
+  const [classYearname, setClassYearName] = useState<string>('1기');
+
+  const { data: applyData, refetch: refetchApplyData } =
+    useGetStatistic(classYearId);
+  const { data: trackData, refetch: refetchTrackData } =
+    useGetTrack(classYearId);
+
+  useEffect(() => {
+    if (yearIdList && yearIdList.length > 0) {
+      const lastYear = yearIdList[yearIdList.length - 1];
+      setClassYearId(lastYear.id);
+      setClassYearName(lastYear.name);
+    }
+  }, [yearIdList]);
+
+  useEffect(() => {
+    refetchApplyData();
+    refetchTrackData();
+  }, [classYearId, refetchApplyData, refetchTrackData]);
 
   const handlePassCheck = () => {
     setIsMarked((prev) => !prev);
@@ -37,14 +59,12 @@ const AdminDocConfirmPage = () => {
     setIsDropdownOpen((prev) => !prev);
   };
 
-  const handleYearIdClick = (id: number) => {
+  const handleYearIdClick = (id: number, name: string) => {
     setClassYearId(id);
+    setClassYearName(name);
     setIsDropdownOpen(false);
   };
 
-  const { data: applyData } = useGetStatistic();
-  const { data: trackData } = useGetTrack();
-
   const handleTrackSelect = (index: number) => {
     setTrackIdx(index);
   };
@@ -66,10 +86,13 @@ const AdminDocConfirmPage = () => {
               isSelected={isDropdownOpen}
               onClick={handleClassYearIdCheck}
             >
-              {`${classYearId}기 ${'\u00A0'} ▾`}
+              {`${classYearname} ${'\u00A0'} ▾`}
             </PassBtn>
             {isDropdownOpen && (
-              <ClassYearIdDropDown onYearIdClick={handleYearIdClick} />
+              <ClassYearIdDropDown
+                yearIdList={yearIdList}
+                onYearIdClick={handleYearIdClick}
+              />
             )}
           </ButtonContainer>
         </ButtonBox>

src/pages/admin/components/docs/ClassYearIdDropDown.tsx

@@ -1,7 +1,7 @@
 import styled from '@emotion/styled';
 
 import { displayCenter } from '@gdg/styles/LayoutStyle';
-import { useGetClassYearList } from '@gdg/apis/hooks/yearId/useGetClassYearList';
+import { classYearList } from '@gdg/apis/hooks/yearId/useGetClassYearList';
 
 import { DividingLine } from './ApplyDetailModal.style';
 const DropdownContainer = styled.div`
@@ -37,17 +37,17 @@ const YearIdButton = styled.div`
 `;
 
 const ClassYearIdDropDown = ({
+  yearIdList,
   onYearIdClick,
 }: {
-  onYearIdClick: (id: number) => void;
+  yearIdList: classYearList[] | undefined;
+  onYearIdClick: (id: number, name: string) => void;
 }) => {
-  const { data: yearIdList } = useGetClassYearList();
-
   return (
     <DropdownContainer>
       {yearIdList?.map((id) => (
         <div key={id.id}>
-          <YearIdButton onClick={() => onYearIdClick(id.id)}>
+          <YearIdButton onClick={() => onYearIdClick(id.id, id.name)}>
             {id.name}
           </YearIdButton>
           {id.id < yearIdList.length && <DividingLine />}