/* eslint-disable @typescript-eslint/no-explicit-any */ import { Head, Link, usePage } from '@inertiajs/react'; import React from 'react'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Separator } from '@/components/ui/separator'; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "@/components/ui/tooltip"; import { Input } from '@/components/ui/input'; import AppLayout from '@/layouts/app-layout'; import { Search } from 'lucide-react'; import { useState, useEffect } from 'react'; import { useDebounce } from 'use-debounce'; import { router } from '@inertiajs/react'; import * as XLSX from 'xlsx'; interface Department { id: number; name: string; description: string; employees_count: number; } interface PageProps { departments: Department[]; filters: { search?: string }; [key: string]: unknown; } export default function Index({ departments, filters }: PageProps) { const [search, setSearch] = useState(filters.search || ''); const [debouncedSearch] = useDebounce(search, 500); useEffect(() => { if (debouncedSearch !== filters.search) { router.get( '/admin/departments', { search: debouncedSearch }, { preserveState: true, replace: true } ); } }, [debouncedSearch]); const exportExcel = () => { const rows = departments.map((d, i) => ({ No: i + 1, 'Nama Departemen': d.name, Deskripsi: d.description || '-', 'Total Karyawan': d.employees_count, })); const ws = XLSX.utils.json_to_sheet(rows); const wb = XLSX.utils.book_new(); XLSX.utils.book_append_sheet(wb, ws, 'Departemen'); XLSX.writeFile(wb, `Data_Departemen_${new Date().toISOString().slice(0, 10)}.xlsx`); }; return (
{/* Page Header */}

Data Departemen

Kelola struktur organisasi dan unit kerja.

Daftar Departemen
setSearch(e.target.value)} />
{departments.length > 0 ? ( departments.map((dept) => ( )) ) : ( )}
Nama Departemen Deskripsi Total Karyawan Aksi
{dept.name} {dept.description || '-'} 0 ? 'bg-blue-100 text-blue-800' : 'bg-gray-100 text-gray-600'}`}> {dept.employees_count} {dept.employees_count > 0 ? (

Akses Ditolak

Masih ada {dept.employees_count} karyawan aktif di sini.

 ) : ( { if (!confirm('Hapus departemen ini?')) e.preventDefault(); }} className="inline-flex items-center justify-center rounded-md text-sm font-medium h-9 px-3 text-red-600 hover:bg-red-50 transition-colors" > Hapus )}
Belum ada data departemen.
); }