import { Head } from '@inertiajs/react'; import AdminNavigation from '../../Components/Admin/AdminNavigation'; import { Card, Col, Container, Row, Badge, Table, ProgressBar } from 'react-bootstrap'; import { Users, Building, UserCheck, Clock, TrendingUp, AlertTriangle } from 'lucide-react'; interface DashboardProps { stats: { tenants: { total: number; active: number; inactive: number; expired: number; }; users: { total: number; active: number; admins: number; }; clients: { total: number; }; leads: { total: number; }; }; recentTenants: Array<{ id: number; name: string; slug: string; plan: string; is_active: boolean; created_at: string; users_count: number; clientes_count: number; }>; tenantsByPlan: Record; expiringSoon: Array<{ id: number; name: string; slug: string; expires_at: string; }>; recentActivity: Array<{ id: number; name: string; email: string; role: string; created_at: string; tenant: { name: string; slug: string; }; }>; } export default function AdminDashboard({ stats, recentTenants, tenantsByPlan, expiringSoon, recentActivity }: DashboardProps) { const formatDate = (dateString: string) => { return new Date(dateString).toLocaleDateString('es-ES', { day: '2-digit', month: '2-digit', year: 'numeric' }); }; const getPlanColor = (plan: string) => { switch (plan) { case 'basic': return 'secondary'; case 'premium': return 'primary'; case 'enterprise': return 'success'; default: return 'light'; } }; const getRoleColor = (role: string) => { switch (role) { case 'admin': return 'danger'; case 'user': return 'info'; default: return 'secondary'; } }; return ( <>
{/* Header */}

Panel de Administración

Gestión global del sistema multitenant

 {/* Stats Cards */}

{stats.tenants.total}

Tenants Total

{stats.tenants.active} activos

{stats.users.total}

Usuarios Total

{stats.users.admins} administradores

{stats.clients.total}

Clientes Total

Todos los tenants

{stats.leads.total}

Leads Total

Sistema completo
{/* Tenants por Plan */}
Distribución por Plan
 {Object.entries(tenantsByPlan).map(([plan, count]) => (
{plan.charAt(0).toUpperCase() + plan.slice(1)}
{count}
))} {/* Tenants Recientes */}
Tenants Recientes
 {recentTenants.map((tenant) => ( ))}
Tenant Plan Estado Usuarios Clientes Creado
{tenant.name}
{tenant.slug}
{tenant.plan} {tenant.is_active ? 'Activo' : 'Inactivo'} {tenant.users_count} {tenant.clientes_count} {formatDate(tenant.created_at)}
{/* Tenants Expirando */}
Expiran Pronto
 {expiringSoon.length > 0 ? ( expiringSoon.map((tenant) => (
{tenant.name}
{tenant.slug}
{formatDate(tenant.expires_at)}
)) ) : (

No hay tenants expirando pronto

)} {/* Actividad Reciente */}
Actividad Reciente
 {recentActivity.length > 0 ? ( recentActivity.map((user) => (
{user.name}
{user.tenant.name} • {formatDate(user.created_at)}
{user.role}
)) ) : (

No hay actividad reciente

)}
{/* Estilos */} ); }