비행계획목록-페이징

src/components/basis/flight/plan/FlightPlanGrid.js

@@ -12,7 +12,9 @@ const FlightPlanGrid = ({
   paginationPerPage,
   paginationRowsPerPageOptions,
   isMyGroup,
-  user
+  user,
+  handlerPageChange,
+  total
 }) => {
   const { loading } = useSelector(state => state.loadingReducer);
   const columns = [
@@ -113,7 +115,9 @@ const FlightPlanGrid = ({
                   pagination={pagination}
                   paginationPerPage={paginationPerPage}
                   paginationRowsPerPageOptions={paginationRowsPerPageOptions}
-                  // pagination={props.pagination}
+                  handlerPageChange={handlerPageChange}
+                  total={total}
+                // pagination={props.pagination}
                 />
                 {/* 검색된 데이터가 없습니다. */}
               </div>

src/containers/basis/flight/plan/FlightPlanContainer.js

@@ -33,7 +33,8 @@ const FlightPlanContainer = () => {
     list: planListData,
     detail: planDetailData,
     selectGroup,
-    areaCoordList
+    areaCoordList,
+    total
   } = useSelector(state => state.flightState);
   const { joinList, joinListCount, groupList, groupListCount } = useSelector(
     state => state.groupState
@@ -54,7 +55,7 @@ const FlightPlanContainer = () => {
   };
 
   const handleSearch = data => {
-    dispatch(FlightAction.FLIGHT_PLAN_LIST.request(data));
+    dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...data, page: 1 }));
   };
 
   const handleChangeSearchData = values => {
@@ -91,7 +92,7 @@ const FlightPlanContainer = () => {
       };
     });
 
-    dispatch(FlightAction.FLIGHT_PLAN_LIST.request(param));
+    dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...param, page: 1 }));
 
     let my = false;
     if (user.authId === 'SUPER') {
@@ -131,7 +132,9 @@ const FlightPlanContainer = () => {
   useEffect(() => {
     handlerGroupCancel();
   }, []);
-
+  const onChangePage = page => {
+    dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...searchData, page }));
+  };
   return (
     <CustomMainLayout title={'비행계획서 신청'}>
       <div className='pal-card-box'>
@@ -173,6 +176,8 @@ const FlightPlanContainer = () => {
                   paginationRowsPerPageOptions={[10, 20, 30, 40]}
                   isMyGroup={isMyGroup}
                   user={user}
+                  total={total}
+                  handlerPageChange={onChangePage}
                 />
               </>
             ) : (

src/modules/basis/flight/actions/basisFlightAction.ts

@@ -136,7 +136,15 @@ export const FLIGHT_PLAN_LIST = createAsyncAction(
   FLIGHT_PLAN_LIST_REQUEST,
   FLIGHT_PLAN_LIST_SUCCESS,
   FLIGHT_PLAN_LIST_FAILURE
-)<FlightPlanListRqData, [FlightPlanData], AxiosError>();
+)<
+  FlightPlanListRqData,
+  {
+    items: [FlightPlanData];
+    total: number;
+    count: number;
+  },
+  AxiosError
+>();
 
 // 상세
 export const FLIGHT_PLAN_DETAIL = createAsyncAction(

src/modules/basis/flight/reducers/basisFlightReducer.ts

@@ -28,7 +28,9 @@ export const flightReducer = createReducer<FlightState, Actions.FlightAction>(
   .handleAction(Actions.FLIGHT_PLAN_LIST.success, (state, action) =>
     produce(state, draft => {
       const data = action.payload;
-      draft.list = data;
+      draft.list = data.items;
+      draft.total = data.total;
+      draft.conut = data.count;
     })
   )
   // 상세