feat : 기수 조회 페이지 추가

src/main/kotlin/com/example/cmc_be/domain/generation/repository/GenerationWeeksInfoRepository.kt

@@ -1,11 +1,14 @@
 package com.example.cmc_be.domain.generation.repository
 
 import com.example.cmc_be.domain.generation.entity.GenerationWeeksInfo
+import org.springframework.data.domain.Page
+import org.springframework.data.domain.Pageable
 import org.springframework.data.jpa.repository.JpaRepository
 
 interface GenerationWeeksInfoRepository : JpaRepository<GenerationWeeksInfo, Long> {
 
     fun findAllByGeneration(generation: Int): List<GenerationWeeksInfo>
+    fun findAllByGeneration(generation: Int, pageable: Pageable): Page<GenerationWeeksInfo>
 
     fun findByGenerationAndWeek(generation: Int, week: Int): GenerationWeeksInfo?
 

src/main/kotlin/com/example/cmc_be/generation/service/GenerationService.kt

@@ -24,6 +24,6 @@ class GenerationService(
 
     fun getGenerationWeeksInfoDate(generation: Int, page: Int, size: Int): PageResponse<GenerationWeeksInfo> {
         val pageable = PageRequest.of(page, size, Sort.by("id").descending())
-        return PageResponse.from(generationWeeksInfoRepository.findAll(pageable))
+        return PageResponse.from(generationWeeksInfoRepository.findAllByGeneration(generation, pageable))
     }
 }

src/main/webapp/src/apis/handlers/generationWeek.ts

@@ -0,0 +1,13 @@
+import {GetByGeneration} from "../types/user/GetByGeneration";
+import {PageRequest, PageResponse} from "../../components/Table/type";
+import {setSearchParams} from "../core/setSearchParams";
+import request from "../core";
+
+export const generationWeekApi = {
+
+  getAllGenerationWeeksByGeneration: async (payload: GetByGeneration & PageRequest) => {
+    const url = setSearchParams(`/admin/generations/date/page`, payload);
+    return await request.get<PageResponse<GenerationWeekDTO>>(url);
+  },
+
+};

src/main/webapp/src/apis/handlers/users.ts

@@ -1,12 +1,12 @@
 import request from 'apis/core';
 import {PageRequest, PageResponse} from 'components/Table/type';
-import {GetUsersByGeneration} from "../types/user/GetUsersByGeneration";
+import {GetByGeneration} from "../types/user/GetByGeneration";
 import {setSearchParams} from "../core/setSearchParams";
 import {UserDTO} from "../types/user/UserDTO";
 
 export const userApi = {
 
-  getAllUsersByGeneration: async (payload: GetUsersByGeneration & PageRequest) => {
+  getAllUsersByGeneration: async (payload: GetByGeneration & PageRequest) => {
     const url = setSearchParams(`/admin/users/all`, payload);
     return await request.get<PageResponse<UserDTO>>(url);
   },

src/main/webapp/src/apis/types/generationWeek/GenerationWeekDTO.ts

@@ -0,0 +1,9 @@
+interface GenerationWeekDTO {
+  id: string;
+  generation: string;
+  week: string;
+  hour: string;
+  date: string;
+  isOffline: string;
+}
+

src/main/webapp/src/apis/types/user/GetByGeneration.ts

@@ -0,0 +1,3 @@
+export interface GetByGeneration {
+  generation: number;
+}

src/main/webapp/src/config/_nav.tsx

@@ -1,5 +1,5 @@
 import React, {ElementType, ReactNode} from 'react';
-import {cilAddressBook, cilHome, cilStar} from '@coreui/icons';
+import {cilAddressBook, cilCalendar, cilHome, cilStar} from '@coreui/icons';
 import CIcon from '@coreui/icons-react';
 import {CNavGroup, CNavItem} from '@coreui/react';
 
@@ -26,14 +26,26 @@ const _nav = [
     icon: <CIcon icon={cilHome} customClassName='nav-icon'/>,
     to: '/admin-page/dashboard',
   },
+  {
+    component: CNavGroup,
+    name: '동아리 기수 관리',
+    icon: <CIcon icon={cilCalendar} customClassName='nav-icon'/>,
+    items: [
+      {
+        component: CNavItem,
+        name: '기수 조회',
+        to: '/generation-week',
+      },
+    ],
+  },
   {
     component: CNavGroup,
     name: '동아리 인원 관리',
     icon: <CIcon icon={cilAddressBook} customClassName='nav-icon'/>,
     items: [
       {
         component: CNavItem,
-        name: '유저 조회',
+        name: '동아리원 조회',
         to: '/admin-page/user/attendance',
       },
       {

src/main/webapp/src/config/routes.ts

@@ -5,17 +5,19 @@ const Dashboard = React.lazy(() => import('../pages/dashboard/Dashboard'));
 const DemoList = React.lazy(() => import('../pages/demo/List'));
 const QRCodeList = React.lazy(() => import('../pages/attendance/QRCodeList'));
 const UserList = React.lazy(() => import('../pages/user/UserList'));
+const GenerationWeekList = React.lazy(() => import('../pages/generationWeek/GenerationWeekList'));
 const DemoDetail = React.lazy(() => import('../pages/demo/Detail'));
 const TextEditor = React.lazy(() => import('../pages/demo/EditorPage'));
 
 const routes = [
-    {path: '/dashboard', component: Dashboard},
-    {path: '/admin-page/dashboard', component: Dashboard},
-    {path: '/user/attendance', component: UserList},
-    {path: '/user/attendance/qrcode', component: QRCodeList},
-    {path: '/demo/list', component: DemoList},
-    {path: '/demo/editor', component: TextEditor},
-    {path: '/demo/detail/:id', component: DemoDetail},
+  {path: '/dashboard', component: Dashboard},
+  {path: '/admin-page/dashboard', component: Dashboard},
+  {path: '/user/attendance', component: UserList},
+  {path: '/generation-week', component: GenerationWeekList},
+  {path: '/user/attendance/qrcode', component: QRCodeList},
+  {path: '/demo/list', component: DemoList},
+  {path: '/demo/editor', component: TextEditor},
+  {path: '/demo/detail/:id', component: DemoDetail},
 ];
 
 export default routes;

src/main/webapp/src/layout/Content/index.tsx

@@ -5,39 +5,33 @@ import {Navigate, Route, Routes, useLocation} from 'react-router-dom';
 import routes from '../../config/routes';
 
 const loading = (
-    <div className='pt-3 text-center'>
-        <div className='sk-spinner sk-spinner-pulse'/>
-    </div>
+  <div className='pt-3 text-center'>
+    <div className='sk-spinner sk-spinner-pulse'/>
+  </div>
 );
 
 const Content = () => {
-    const location = useLocation();
-    const [isExistsFilteredRoute] = useState(
-        routes.filter(route =>
-            location.pathname.startsWith("/admin-page" + route.path) ||
-            location.pathname.startsWith(route.path)
-        ).length > 0
-    );
-
-    routes.map((route) => {
-        console.log(route.path)
-    })
-    console.log(location.pathname)
-    console.log(`isExistsFilteredRoute : ${isExistsFilteredRoute}`)
-    return (
-        <Suspense fallback={loading}>
-            {!isExistsFilteredRoute ? (
-                <Navigate to='/admin-page/login'/>
-            ) : (
-                <Routes>
-                    {routes.map((route, idx) => {
-                        return route.component && <Route key={idx} path={route.path} element={<route.component/>}/>;
-                    })}
-                    <Route path='/admin-page/' element={<Navigate to='/admin-page/dashboard' replace/>}/>
-                </Routes>
-            )}
-        </Suspense>
-    );
+  const location = useLocation();
+  const [isExistsFilteredRoute] = useState(
+    routes.filter(route =>
+      location.pathname.startsWith("/admin-page" + route.path) ||
+      location.pathname.startsWith(route.path)
+    ).length > 0
+  );
+  return (
+    <Suspense fallback={loading}>
+      {!isExistsFilteredRoute ? (
+        <Navigate to='/admin-page/login'/>
+      ) : (
+        <Routes>
+          {routes.map((route, idx) => {
+            return route.component && <Route key={idx} path={route.path} element={<route.component/>}/>;
+          })}
+          <Route path='/admin-page/' element={<Navigate to='/admin-page/dashboard' replace/>}/>
+        </Routes>
+      )}
+    </Suspense>
+  );
 };
 
 export default React.memo(Content);

src/main/webapp/src/pages/generationWeek/GenerationWeekList.tsx

@@ -0,0 +1,92 @@
+import {CButton, CFormInput} from '@coreui/react';
+import {Column} from '@coreui/react/dist/components/table/types';
+import {FlexBox} from 'components/FlexBox';
+import Section from 'components/Section';
+import useSelectSize from 'components/Select/useSelectSize';
+import useQueryString from 'hooks/useQueryString';
+import React, {Fragment, useState} from 'react';
+import useQueryStringEffect from "../../hooks/useQueryStringEffect";
+import {useInput} from "../../hooks/useInput";
+import {useQuery} from "@tanstack/react-query";
+import Table from "../../components/Table";
+import {getTableResponseType} from "../../utils/getTableResponseType";
+import Row from "../../components/Row";
+import {generationWeekApi} from "../../apis/handlers/generationWeek";
+
+const GENERATION_WEEK_COLUMNS: Column[] = [
+  {label: 'id', key: 'id'},
+  {label: '기수', key: 'generation'},
+  {label: '주차', key: 'week'},
+  {label: '날짜', key: 'date'},
+  // {label: '오프라인 유무', key: 'isOffline'},
+];
+
+const GenerationWeekList = () => {
+
+  const {get} = useQueryString();
+  const [page, setPage] = useState(Number(get('page') || 0));
+  const [size, SizeSelect] = useSelectSize(() => setPage(0));
+  const [generation, onChangeGeneration, setGeneration] = useInput(get('searchValue') || '15');
+
+  const {
+    data,
+    status: httpStatus,
+    refetch,
+  } = useQuery(
+    [page, size],
+    () =>
+      generationWeekApi.getAllGenerationWeeksByGeneration(
+        {
+          generation: parseInt(generation),
+          page: page,
+          size: size
+        }
+      ),
+  );
+
+  useQueryStringEffect(
+    {
+      page,
+      size,
+    },
+    [page, size],
+  );
+
+  return (
+    <>
+      <Section
+        body={
+          <>
+            <Row.Custom label={'기수'}>
+              <CFormInput
+                placeholder='기수를 입력해주세요.'
+                value={generation}
+                type={'number'}
+                onChange={onChangeGeneration}
+              />
+            </Row.Custom>
+          </>
+        }
+        footer={
+          <FlexBox gap={10}>
+            <CButton onClick={() => refetch()}>검색</CButton>
+          </FlexBox>
+        }
+      />
+      <Section
+        body={
+          <Fragment>
+            <Table
+              column={GENERATION_WEEK_COLUMNS}
+              paginationState={[page, setPage]}
+              size={size}
+              data={getTableResponseType({src: data?.contents, totalCnt: data?.totalCnt, page})}
+            />
+          </Fragment>
+        }
+      />
+    </>
+  );
+};
+
+export default GenerationWeekList;