From 09e9a0ce5df27e8e5fc5bcebd8381558835dc49b Mon Sep 17 00:00:00 2001
From: bicochan <chanii8@naver.com>
Date: Mon, 23 Jun 2025 14:21:07 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EA=B4=80=EB=A6=AC=EC=9E=90=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=9E=91=EC=97=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/cs/src/entities/group-user/index.ts      |  5 +-
 apps/cs/src/entities/user/index.ts            |  1 +
 .../user}/ui/password-reset-dialog.tsx        | 12 ++--
 .../src/pages/admin/model/table-columns.tsx   | 71 +++++++++++++++++--
 apps/cs/src/pages/users/ui/user-detail.tsx    |  9 ++-
 5 files changed, 84 insertions(+), 14 deletions(-)
 rename apps/cs/src/{pages/users => entities/user}/ui/password-reset-dialog.tsx (92%)

diff --git a/apps/cs/src/entities/group-user/index.ts b/apps/cs/src/entities/group-user/index.ts
index 239786d57..349194a90 100644
--- a/apps/cs/src/entities/group-user/index.ts
+++ b/apps/cs/src/entities/group-user/index.ts
@@ -1,2 +1,5 @@
 export { GroupUsersApi } from "./api/group-user-service";
-export { type GroupUserListResponseDto } from "./model/group-user-interface";
+export {
+  type GroupUserListResponseDto,
+  type GroupUserSaveData,
+} from "./model/group-user-interface";
diff --git a/apps/cs/src/entities/user/index.ts b/apps/cs/src/entities/user/index.ts
index 4ad247761..7b4615e01 100644
--- a/apps/cs/src/entities/user/index.ts
+++ b/apps/cs/src/entities/user/index.ts
@@ -13,3 +13,4 @@ export {
   type AdminUserList,
   type AdminUserListResponse,
 } from "./model/user-interface";
+export { PasswordResetDialog } from "./ui/password-reset-dialog";
diff --git a/apps/cs/src/pages/users/ui/password-reset-dialog.tsx b/apps/cs/src/entities/user/ui/password-reset-dialog.tsx
similarity index 92%
rename from apps/cs/src/pages/users/ui/password-reset-dialog.tsx
rename to apps/cs/src/entities/user/ui/password-reset-dialog.tsx
index dab2cef12..0d6aaf94e 100644
--- a/apps/cs/src/pages/users/ui/password-reset-dialog.tsx
+++ b/apps/cs/src/entities/user/ui/password-reset-dialog.tsx
@@ -31,9 +31,13 @@ import { useAlertStore, useMutationWrapper } from "@/shared/lib";
 
 interface PasswordResetDialogProps {
   userUnqId: string;
+  children: React.ReactNode;
 }
 
-export function PasswordResetDialog({ userUnqId }: PasswordResetDialogProps) {
+export function PasswordResetDialog({
+  userUnqId,
+  children,
+}: PasswordResetDialogProps) {
   const alert = useAlertStore((state) => state.setMessage);
 
   const [open, setOpen] = useState(false);
@@ -60,11 +64,7 @@ export function PasswordResetDialog({ userUnqId }: PasswordResetDialogProps) {
 
   return (
     <Dialog open={open} onOpenChange={setOpen}>
-      <DialogTrigger asChild>
-        <Button color="gray">
-          <i className="diveicon di-arrow-reset" /> 비밀번호 초기화
-        </Button>
-      </DialogTrigger>
+      <DialogTrigger asChild>{children}</DialogTrigger>
       <DialogContent>
         <DialogHeader>
           <DialogTitle>비밀번호 초기화</DialogTitle>
diff --git a/apps/cs/src/pages/admin/model/table-columns.tsx b/apps/cs/src/pages/admin/model/table-columns.tsx
index 83780c981..dee012995 100644
--- a/apps/cs/src/pages/admin/model/table-columns.tsx
+++ b/apps/cs/src/pages/admin/model/table-columns.tsx
@@ -1,6 +1,13 @@
 import dayjs from "dayjs";
+import { memo } from "react";
 import type { ColumnDef } from "@tanstack/react-table";
-import type { AdminUserList } from "@/entities/user";
+import { useQueryClient } from "@tanstack/react-query";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { Button } from "@common/components";
+import { PasswordResetDialog, type AdminUserList } from "@/entities/user";
+import { GroupUsersApi, type GroupUserSaveData } from "@/entities/group-user";
+import { ENDPOINT } from "@/shared/config";
+import { useAlertStore, useMutationWrapper } from "@/shared/lib";
 import { ManagerIpDialog } from "../ui/manager-ip-dialog";
 
 export const columns: ColumnDef<AdminUserList["content"][number]>[] = [
@@ -23,11 +30,11 @@ export const columns: ColumnDef<AdminUserList["content"][number]>[] = [
     header: "관리자명",
   },
   {
-    accessorKey: "userStateCodeName",
+    accessorKey: "groupNm",
     header: "관리자구분",
   },
   {
-    accessorKey: "groupNm",
+    accessorKey: "ogdpSeNm",
     header: "소속",
   },
   {
@@ -43,7 +50,63 @@ export const columns: ColumnDef<AdminUserList["content"][number]>[] = [
     id: "action",
     header: "관리",
     cell: ({ row }) => {
-      return <ManagerIpDialog userUnqId={row.original.userUnqId} />;
+      return (
+        <ActionCell
+          userUnqId={row.original.userUnqId}
+          groupId={row.original.groupId}
+        />
+      );
     },
   },
 ];
+
+const ActionCell = memo(
+  ({ userUnqId, groupId }: { userUnqId: string; groupId: string }) => {
+    const queryClient = useQueryClient();
+    const { confirm } = useConfirm();
+    const alert = useAlertStore((state) => state.setMessage);
+
+    const { mutate: onDelete } = useMutationWrapper({
+      mutationFn: (data: GroupUserSaveData) =>
+        GroupUsersApi.saveGroupUser([data]),
+      onSuccess: () => {
+        queryClient.invalidateQueries({
+          queryKey: [ENDPOINT.USER_SERVICE.USERS],
+        });
+        alert("삭제되었습니다.");
+      },
+    });
+
+    const handleDelete = async () => {
+      if (await confirm("관리자를 삭제하시겠습니까?")) {
+        onDelete({
+          mode: "D",
+          groupId,
+          userUnqId,
+        });
+      }
+    };
+
+    return (
+      <div className="flex justify-center gap-2">
+        <ManagerIpDialog userUnqId={userUnqId} />
+        <PasswordResetDialog userUnqId={userUnqId}>
+          <Button size="sm" color="gray">
+            비밀번호 초기화
+          </Button>
+        </PasswordResetDialog>
+        <Button size="sm" color="red" onClick={handleDelete}>
+          삭제
+        </Button>
+      </div>
+    );
+  },
+  (prevProps, nextProps) => {
+    return (
+      prevProps.userUnqId === nextProps.userUnqId &&
+      prevProps.groupId === nextProps.groupId
+    );
+  },
+);
+
+ActionCell.displayName = "ActionCell";
diff --git a/apps/cs/src/pages/users/ui/user-detail.tsx b/apps/cs/src/pages/users/ui/user-detail.tsx
index 9673f5c02..60c1f34b8 100644
--- a/apps/cs/src/pages/users/ui/user-detail.tsx
+++ b/apps/cs/src/pages/users/ui/user-detail.tsx
@@ -11,10 +11,9 @@ import {
   TableHead,
   TableRow,
 } from "@common/components";
-import { USER_STATE_CODE, UserApi } from "@/entities/user";
+import { USER_STATE_CODE, UserApi, PasswordResetDialog } from "@/entities/user";
 import { ENDPOINT } from "@/shared/config";
 import { useAlertStore, useMutationWrapper } from "@/shared/lib";
-import { PasswordResetDialog } from "./password-reset-dialog";
 
 function UserDetail({ userUnqId }: { userUnqId: string }) {
   const router = useRouter();
@@ -76,7 +75,11 @@ function UserDetail({ userUnqId }: { userUnqId: string }) {
               계정잠금
             </Button>
           )}
-          <PasswordResetDialog userUnqId={userUnqId} />
+          <PasswordResetDialog userUnqId={userUnqId}>
+            <Button color="gray">
+              <i className="diveicon di-arrow-reset" /> 비밀번호 초기화
+            </Button>
+          </PasswordResetDialog>
           {data?.userStateCode === USER_STATE_CODE.대기 && (
             <Button className="emerald" onClick={() => onApplyUser()}>
               <i className="diveicon di-check-circle-line" /> 가입승인