import { Head, usePage } from '@inertiajs/react'; import React from 'react'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Separator } from '@/components/ui/separator'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'; import AppLayout from '@/layouts/app-layout'; interface Attendance { id: number; employee_name: string; employee_nik: string; date: string; check_in: string | null; check_out: string | null; status: 'present' | 'leave' | 'dispensation'; notes: string | null; total_hours: string | null; } interface PageProps { attendances: Attendance[]; [key: string]: unknown; } export default function Index({ attendances }: PageProps) { const formatStatus = (status: string) => { switch (status) { case 'present': return Hadir; case 'leave': return Izin/Cuti; case 'dispensation': return Dispensasi; default: return {status}; } }; return (

Rekap Absensi Karyawan

Monitoring kehadiran, izin, dan dispensasi karyawan.

Daftar Absensi

Nama NIK Tanggal Jam Masuk Jam Keluar Keterangan Total Jam Kerja {attendances.length > 0 ? ( attendances.map((attendance) => ( {attendance.employee_name} {attendance.employee_nik} {attendance.date} {attendance.check_in || '-'} {attendance.check_out || '-'}

{formatStatus(attendance.status)} {attendance.notes && ( {attendance.notes} )}

{attendance.total_hours ? `${attendance.total_hours} Jam` : '-'} )) ) : ( Belum ada data absensi. )}

); }