feat:#345 멤버 역할 수정 api 연결

Leets-Official · Feb 11, 2025 · de07ebf · de07ebf
1 parent 8b153b9
commit de07ebf
Show file tree

Hide file tree

Showing 4 changed files with 63 additions and 18 deletions.
diff --git a/src/api/admin/member/patchUserManagement.tsx b/src/api/admin/member/patchUserManagement.tsx
@@ -54,4 +54,27 @@ const approveSignupApi = async (userId: number | number[]) => {
   }
 };
 
-export { resetPwdApi, approveSignupApi };
+// 관리자로 승격/강등
+const changeUserRoleApi = async (userId: number, role: 'ADMIN' | 'USER') => {
+  const accessToken = localStorage.getItem('accessToken');
+  const refreshToken = localStorage.getItem('refreshToken');
+
+  try {
+    const url = `${BASE_URL}${PATH}/role?userId=${userId}&role=${role}`;
+    const response = await axios.patch(
+      url,
+      {},
+      {
+        headers: {
+          Authorization: `Bearer ${accessToken}`,
+          Authorization_refresh: `Bearer ${refreshToken}`,
+        },
+      },
+    );
+    return response.data;
+  } catch (error: any) {
+    throw new Error(error.response?.data?.message || '역할 변경 실패');
+  }
+};
+
+export { resetPwdApi, approveSignupApi, changeUserRoleApi };
diff --git a/src/components/Admin/Modal/MemberDetailModal.tsx b/src/components/Admin/Modal/MemberDetailModal.tsx
@@ -81,15 +81,23 @@ const MemberDetailModal: React.FC<MemberDetailModalProps> = ({
 }) => {
   const { handleAction } = useAdminActions();
 
+  const roleChangeButton =
+    data.role === 'ADMIN'
+      ? {
+          label: '사용자로 변경',
+          onClick: () => handleAction('사용자로 변경', [data.id]),
+        }
+      : {
+          label: '관리자로 변경',
+          onClick: () => handleAction('관리자로 변경', [data.id]),
+        };
+
   const buttons = [
     {
       label: '가입 승인',
       onClick: () => handleAction('가입 승인', [data.id]),
     },
-    {
-      label: '관리자로 변경',
-      onClick: () => handleAction('관리자로 변경', [data.id]),
-    },
+    roleChangeButton,
     {
       label: '비밀번호 초기화',
       onClick: () => handleAction('비밀번호 초기화', [data.id]),

diff --git a/src/components/Admin/SelectedTopBar.tsx b/src/components/Admin/SelectedTopBar.tsx
@@ -32,7 +32,7 @@ const SvgIcon = styled.img`
 `;
 
 const SelectedTopBar: React.FC = () => {
-  const { selectedMembers, setSelectedMembers } = useMemberContext();
+  const { selectedMembers, setSelectedMembers, members } = useMemberContext();
   const [isModalOpen, setIsModalOpen] = useState(false);
 
   const { handleAction } = useAdminActions();
@@ -48,6 +48,16 @@ const SelectedTopBar: React.FC = () => {
   const handleCloseModal = () => {
     setIsModalOpen(false);
   };
+
+  const selectedRoles = selectedMembers.map(
+    (id) => members.find((m) => m.id === Number(id))?.role,
+  );
+
+  const hasMixedRoles =
+    selectedRoles.includes('ADMIN') && selectedRoles.includes('USER');
+
+  const allAdmins = selectedRoles.every((role) => role === 'ADMIN');
+  const allUsers = selectedRoles.every((role) => role === 'USER');
   const buttons = [
     {
       label: '가입 승인',
@@ -56,19 +66,13 @@ const SelectedTopBar: React.FC = () => {
     },
     {
       label: '관리자로 변경',
-      onClick: () =>
-        alert(
-          `${selectedMembers.length}명의 멤버를 관리자로 변경하시겠습니까?`,
-        ),
-      disabled: selectedMembers.length !== 1,
+      onClick: () => handleAction('관리자로 변경', selectedMembers.map(Number)),
+      disabled: hasMixedRoles || allAdmins,
     },
     {
       label: '사용자로 변경',
-      onClick: () =>
-        alert(
-          `${selectedMembers.length}명의 멤버를 사용자로 변경하시겠습니까?`,
-        ),
-      disabled: selectedMembers.length !== 1,
+      onClick: () => handleAction('사용자로 변경', selectedMembers.map(Number)),
+      disabled: hasMixedRoles || allUsers,
     },
     {
       label: '비밀번호 초기화',

diff --git a/src/hooks/useAdminActions.ts b/src/hooks/useAdminActions.ts
@@ -1,6 +1,7 @@
 import {
   resetPwdApi,
   approveSignupApi,
+  changeUserRoleApi,
 } from '@/api/admin/member/patchUserManagement';
 
 type ActionType =
@@ -35,14 +36,23 @@ const useAdminActions = () => {
     if (!window.confirm(confirmMessage)) return;
 
     try {
+      let response;
+
       if (action === '비밀번호 초기화') {
-        const response = await resetPwdApi(targetIds);
+        response = await resetPwdApi(targetIds);
         console.log('비밀번호 초기화 API 응답:', response);
         alert('비밀번호 초기화가 완료되었습니다.');
       } else if (action === '가입 승인') {
-        const response = await approveSignupApi(targetIds);
+        response = await approveSignupApi(targetIds);
         console.log('가입 승인 API 응답:', response);
         alert('가입 승인 처리가 완료되었습니다.');
+      } else if (action === '관리자로 변경' || '사용자로 변경') {
+        const newRole = action === '관리자로 변경' ? 'ADMIN' : 'USER';
+        response = await Promise.all(
+          targetIds.map((targetId) => changeUserRoleApi(targetId, newRole)),
+        );
+        // console.log('역할 변경 API 응답:', response);
+        alert(`멤버의 역할이 ${newRole}로 변경되었습니다.`);
       }
     } catch (error: any) {
       console.error('오류 발생:', error.message);