70 lines
2.0 KiB
TypeScript
70 lines
2.0 KiB
TypeScript
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from "@/components/ui/dialog";
|
|
import { Button } from "@/components/ui/button";
|
|
import { User } from "@/types/user";
|
|
|
|
interface UserStatusConfirmDialogProps {
|
|
user: User | null;
|
|
newStatus: string;
|
|
isOpen: boolean;
|
|
onConfirm: () => void;
|
|
onCancel: () => void;
|
|
}
|
|
|
|
/**
|
|
* 사용자 상태 변경 확인 모달
|
|
*/
|
|
export function UserStatusConfirmDialog({
|
|
user,
|
|
newStatus,
|
|
isOpen,
|
|
onConfirm,
|
|
onCancel,
|
|
}: UserStatusConfirmDialogProps) {
|
|
if (!user) return null;
|
|
|
|
const statusText = newStatus === "active" ? "활성" : "비활성";
|
|
const statusColor = newStatus === "active" ? "text-blue-600" : "text-gray-600";
|
|
|
|
return (
|
|
<Dialog open={isOpen} onOpenChange={(open) => !open && onCancel()}>
|
|
<DialogContent className="sm:max-w-[425px]">
|
|
<DialogHeader>
|
|
<DialogTitle>사용자 상태 변경</DialogTitle>
|
|
<DialogDescription>사용자의 상태를 변경하시겠습니까?</DialogDescription>
|
|
</DialogHeader>
|
|
|
|
<div className="py-4">
|
|
<div className="space-y-2">
|
|
<div className="flex items-center gap-2">
|
|
<span className="text-muted-foreground text-sm">사용자:</span>
|
|
<span className="font-medium">
|
|
{user.user_name} ({user.user_id})
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<span className="text-muted-foreground text-sm">변경할 상태:</span>
|
|
<span className={`font-medium ${statusColor}`}>{statusText}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<DialogFooter>
|
|
<Button variant="outline" onClick={onCancel}>
|
|
취소
|
|
</Button>
|
|
<Button onClick={onConfirm} className={newStatus === "active" ? "bg-blue-500 hover:bg-blue-600" : ""}>
|
|
변경
|
|
</Button>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|