69 lines
2.4 KiB
TypeScript
69 lines
2.4 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { ArrowLeft } from 'lucide-react';
|
|
import { UserManagementModal } from '../components/UserManagementModal';
|
|
|
|
interface AdminDashboardProps {
|
|
user: any;
|
|
onNavigate: (page: string) => void;
|
|
}
|
|
|
|
export const AdminDashboard: React.FC<AdminDashboardProps> = ({ user, onNavigate }) => {
|
|
const [isModalOpen, setIsModalOpen] = useState(true);
|
|
|
|
if (!user?.isAdmin) {
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center p-4">
|
|
<div className="text-center">
|
|
<h1 className="text-3xl font-black text-white mb-4">Quyền Truy Cập Bị Từ Chối</h1>
|
|
<p className="text-slate-400 mb-6">Bạn không có quyền truy cập trang admin này.</p>
|
|
<button
|
|
onClick={() => onNavigate('dashboard')}
|
|
className="px-6 py-3 bg-indigo-600 hover:bg-indigo-700 text-white rounded-2xl font-bold transition-all"
|
|
>
|
|
Quay lại Dashboard
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// When admin closes the modal, navigate back to user dashboard
|
|
const handleCloseModal = () => {
|
|
onNavigate('dashboard');
|
|
};
|
|
|
|
return (
|
|
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900">
|
|
{/* Header with toggle button */}
|
|
<div className="fixed top-0 left-0 right-0 z-[60] bg-slate-900/95 backdrop-blur-md border-b border-slate-800 px-4 md:px-6 py-4 flex items-center justify-between gap-4">
|
|
<div className="flex items-center gap-4">
|
|
<button
|
|
onClick={handleCloseModal}
|
|
className="p-2 hover:bg-slate-800 rounded-xl transition-colors"
|
|
title="Quay lại User Dashboard"
|
|
>
|
|
<ArrowLeft className="w-6 h-6 text-slate-300" />
|
|
</button>
|
|
<h1 className="text-2xl font-black text-white">
|
|
🛡️ Admin Dashboard
|
|
</h1>
|
|
</div>
|
|
<button
|
|
onClick={handleCloseModal}
|
|
className="px-4 py-2 text-sm font-bold text-slate-300 hover:text-white hover:bg-slate-800 rounded-xl transition-all"
|
|
>
|
|
Switch to User Dashboard
|
|
</button>
|
|
</div>
|
|
|
|
{/* Modal shown full screen */}
|
|
<div className="pt-20">
|
|
<UserManagementModal
|
|
isOpen={isModalOpen}
|
|
onClose={handleCloseModal}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|