import { Head } from '@inertiajs/react'; import { Trash2, Sparkles } from 'lucide-react'; import { DataTable } from '@/components/data-table'; import { DeleteConfirmation } from '@/components/modal/delete-confirmation'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Card, CardContent } from '@/components/ui/card'; import type { Payroll } from '@/types'; import { usePayrollIndex } from './hooks/use-payroll-index'; import { getColumns } from './partials/columns'; import { PayrollFormModal } from './partials/payroll-form-modal'; import { usePermission } from '@/hooks/use-permission'; export default function PayrollIndex({ payrolls, currentMonthPayrolls, }: { payrolls: Payroll[], currentMonthPayrolls: Payroll[], }) { const { hasPermission } = usePermission(); 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 }).filter( (col) => col.id !== 'actions' || hasPermission('Edit:PayrollAdjustment') || hasPermission('Delete:Payroll') ); return (

Penggajian

{hasPermission('Generate:Payroll') && ( )}
{currentMonthPayrolls.map((payroll) => ( { if (hasPermission('Edit:PayrollAdjustment')) { 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 */} Tindakan ini tidak dapat dibatalkan. Penggajian {payrollToDelete?.period_month_formatted} akan dihapus secara permanen dan stok akan dikembalikan. } onDelete={confirmDelete} /> {/* Bulk Delete Confirmation */} Tindakan ini tidak dapat dibatalkan. {rowsToDelete.length} item yang terpilih akan dihapus secara permanen. } onDelete={confirmBulkDelete} />
); } PayrollIndex.layout = { breadcrumbs: [ { title: 'Keuangan', }, ], };