import { Head, Link } from '@inertiajs/react'; import AppLayout from '@/layouts/app-layout'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Users, Building2, Briefcase, UserPlus } from 'lucide-react'; import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip as RechartsTooltip, ResponsiveContainer, PieChart, Pie, Cell, Legend } from 'recharts'; interface DashboardProps { stats: { total_employees: number; total_departments: number; total_positions: number; }; genderData: any[]; deptData: any[]; latestEmployees: any[]; } export default function Dashboard({ stats, genderData, deptData, latestEmployees }: DashboardProps) { return (
{/* CARD STATISTIK */}
Total Karyawan
{stats.total_employees}

Pegawai aktif saat ini

 Total Departemen
{stats.total_departments}

Divisi terdaftar

 Total Jabatan
{stats.total_positions}

Posisi pekerjaan
{/* Grafik Batang */} Karyawan per Departemen
`${value}`} />
{/* Grafik Donat*/} Komposisi Gender
{genderData.map((entry, index) => ( ))}
{/* TABEL KARYAWAN TERBARU */} Karyawan Terbaru Bergabung Lihat Semua
{latestEmployees.map((emp) => (

{emp.user.name}

{emp.position.name} • {emp.department.name}

{new Date(emp.join_date).toLocaleDateString('id-ID', { day: 'numeric', month: 'short', year: 'numeric' })}
))}
); }