import { Head } from '@inertiajs/react'; import type { Payroll } from '@/types'; import { Card, CardContent } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Trash2, Sparkles, Plus, X } from 'lucide-react'; import { DataTable } from '@/components/data-table'; import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogTitle, } from "@/components/ui/alert-dialog" import { usePayrollIndex } from './hooks/use-payroll-index'; import { Badge } from '@/components/ui/badge'; import { getColumns } from './partials/columns'; import { PayrollFormModal } from './partials/payroll-form-modal'; export default function PayrollIndex({ payrolls, currentMonthPayrolls, }: { payrolls: Payroll[], currentMonthPayrolls: Payroll[], }) { const { isFormOpen, selectedPayroll, isDeleteDialogOpen, isBulkDeleteDialogOpen, payrollToDelete, rowsToDelete, rowSelection, isGenerating, setRowSelection, setRowsToDelete, setIsDeleteDialogOpen, setIsBulkDeleteDialogOpen, onGenerate, onEdit, onDelete, confirmDelete, confirmBulkDelete, onTogglePaid, closeForm, } = usePayrollIndex(); const columns = getColumns({ onEdit, onDelete, onTogglePaid }); return (

Penggajian

{currentMonthPayrolls.map((payroll) => ( onEdit(payroll)} >

{payroll.user?.name} {payroll.period_month_formatted}

{payroll.is_paid ? 'Lunas' : 'Pending'}

Gaji Pokok {payroll.base_salary_formatted}

{payroll.adjustments?.map((adj, idx) => (

{adj.description} {adj.type === 'bonus' ? '+' : '-'}{adj.amount_formatted}

))}

Gaji Bersih {payroll.total_salary_formatted}

))}

{ setRowsToDelete(rows); setIsBulkDeleteDialogOpen(true); }, icon: Trash2, variant: 'destructive' }, ]} /> {/* Single Delete Confirmation */} Hapus data penggajian? Tindakan ini tidak dapat dibatalkan. Data penggajian untuk {payrollToDelete?.user?.name} periode {payrollToDelete?.period_month} akan dihapus secara permanen. Batal Hapus {/* Bulk Delete Confirmation */} Hapus {rowsToDelete.length} data penggajian? Tindakan ini tidak dapat dibatalkan. {rowsToDelete.length} item yang terpilih akan dihapus secara permanen. Batal Hapus

); } PayrollIndex.layout = { breadcrumbs: [ { title: 'Keuangan', }, ], };