사용자 관리 - 페이징 목록 수정

src/components/basis/group/BasisGroupUsersGrid.js

@@ -10,7 +10,7 @@ export const BasisGroupUsersGrid = props => {
       <div className='mt-2 cont-ti d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
         <div>
           <h4>{props.title} 목록</h4>
-          <span className='search-case'>검색결과 총 {props.count}건</span>
+          <span className='search-case'>검색결과 총 {props.total}건</span>
         </div>
         {/* <div className='d-flex align-items-center'>
               <Button.Ripple
@@ -29,8 +29,10 @@ export const BasisGroupUsersGrid = props => {
               title={'비행이력'}
               data={props.data}
               count={props.count}
+              total={props.total}
               columns={props.columns}
               pagination={props.pagination}
+              handlerPageChange={props.handlerPageChange}
               paginationPerPage={props.paginationPerPage}
               paginationRowsPerPageOptions={props.paginationRowsPerPageOptions}
             />

src/containers/basis/group/BasisGroupUsersContainer.js

@@ -14,11 +14,14 @@ export const BasisGroupUsersContainer = props => {
   const {
     joinList,
     joinListCount,
-    userList,
-    userCount,
     groupList,
     groupListCount,
-    selectData
+    selectData,
+    userCount,
+
+    userList,
+    count,
+    total
   } = useSelector(state => state.groupState);
   const { user } = useSelector(state => state.authState);
 
@@ -427,6 +430,12 @@ export const BasisGroupUsersContainer = props => {
     });
   };
 
+  const handlerPageChange = page => {
+    const param = params;
+    param.page = page;
+    dispatch(Actions.USER_LIST.request({ searchParams: param }));
+  };
+
   return (
     <CustomMainLayout title={titleName}>
       <div className='pal-card-box'>
@@ -485,7 +494,9 @@ export const BasisGroupUsersContainer = props => {
                 data={userList}
                 title={'사용자'}
                 columns={userColumns}
-                count={userCount}
+                count={count}
+                total={total}
+                handlerPageChange={handlerPageChange}
                 pagination={true}
                 paginationPerPage={10}
                 paginationRowsPerPageOptions={[10, 20, 30, 40]}

src/modules/basis/group/actions/basisGroupAction.ts

@@ -202,7 +202,11 @@ export const USER_LIST = createAsyncAction(
   USER_LIST_REQUEST,
   USER_LIST_SUCCESS,
   USER_LIST_FAILURE
-)<GroupState, { data: UserGroupData[]; count: number }, AxiosError>();
+)<
+  GroupState,
+  { data: UserGroupData[]; count: number; total: number },
+  AxiosError
+>();
 
 export const USER_UPDATE = createAsyncAction(
   USER_UPDATE_REQUEST,

src/modules/basis/group/models/basisGroupModel.ts

@@ -2,26 +2,27 @@ import { ErrorModel } from '../../../models/ComnModel';
 
 export interface GroupState {
   myList: GroupData[] | undefined;
-  myListCount: number | 0;
   groupDetail: GroupData | undefined;
   joinList: JoinGroupData[] | undefined;
-  joinListCount: number | 0;
   mainList: MainGroupData[] | undefined;
-  mainListCount: number | 0;
   groupList: GroupData[] | undefined;
-  groupListCount: number | 0;
   aprvList: AprvGroupData[] | undefined;
-  aprvCount: number | 0;
   userList: UserGroupData[] | undefined;
-  userCount: number | 0;
+  selectData: SelectData | undefined;
   groupId: string | '';
   newGroupId: String | '';
   searchParams: string | '';
   error: ErrorModel | undefined;
-  selectData: SelectData | undefined;
   page: number | 1;
   total: number | 0;
   count: number | 0;
+
+  myListCount: number | 0;
+  joinListCount: number | 0;
+  mainListCount: number | 0;
+  groupListCount: number | 0;
+  aprvCount: number | 0;
+  userCount: number | 0;
 }
 
 export interface GroupSearchData {
@@ -85,6 +86,7 @@ export interface AprvGroupData {
 export interface UserGroupState {
   userGroupData: UserGroupData[] | undefined;
 }
+
 export interface UserGroupData {
   cstmrGroupSno: number;
   groupId: string;
@@ -123,5 +125,5 @@ export const initGroup = {
   selectData: undefined,
   page: 1,
   total: 0,
-  count:0
+  count: 0
 };

src/modules/basis/group/reducers/basisGroupReducer.ts

@@ -95,9 +95,10 @@ export const groupReducer = createReducer<GroupState, Actions.GroupAction>(
   )
   .handleAction(Actions.USER_LIST.success, (state, action) =>
     produce(state, draft => {
-      const { data, count } = action.payload;
+      const { data, count, total } = action.payload;
       draft.userList = data;
-      draft.userCount = count;
+      draft.count = count;
+      draft.total = total;
     })
   )
   .handleAction(Actions.SELECT, (state, action) =>

src/modules/basis/group/sagas/basisGroupSaga.ts

@@ -463,11 +463,18 @@ function* userListSaga(action: ActionType<typeof Actions.USER_LIST.request>) {
   try {
     const { searchParams } = action.payload;
     const res = yield call(Apis.groupAPI.listGroupUser, searchParams);
-    const { data } = res;
+    // const { data } = res;
+    const {
+      data: { items, total },
+      count
+    } = res;
     yield put(
       Actions.USER_LIST.success({
-        data: data.items,
-        count: data.total
+        // data: data.items,
+        // count: data.total
+        data: items,
+        count,
+        total
       })
     );
   } catch (error) {