@extends('layouts.admin')@section('title','Ringkasan Kehadiran')@section('content')
<div class="page-head"><div><h1 class="page-title">Ringkasan Kehadiran</h1><p class="page-subtitle">{{ now()->translatedFormat('l, j F Y') }} • Pantau kondisi tenaga kerja hari ini.</p></div><a class="btn btn-ghost" href="{{ route('admin.attendance.index',['date'=>now()->toDateString()]) }}"><i data-lucide="calendar-days"></i> Lihat Absensi Hari Ini</a></div>
<div class="stats-grid">@foreach($stats as $stat)<div class="card stat"><div class="stat-top"><div class="stat-icon {{ $stat['tone'] }}"><i data-lucide="{{ $stat['icon'] }}"></i></div><i data-lucide="more-horizontal" class="muted"></i></div><div class="stat-value">{{ number_format($stat['value']) }}</div><div class="stat-label">{{ $stat['label'] }}</div></div>@endforeach</div>
<div class="dashboard-grid"><div class="dashboard-stack"><section class="card"><div class="card-head split"><div><strong>Tren Kehadiran 7 Hari</strong><div class="tiny muted">Kehadiran, keterlambatan, dan anomali radius</div></div><a class="btn btn-ghost btn-sm" href="{{ route('admin.reports.index') }}">Buka laporan</a></div><div class="card-body"><div class="chart-wrap"><canvas id="attendanceChart"></canvas></div></div></section><section class="card"><div class="card-head split"><div><strong>Koreksi Terbaru</strong><div class="tiny muted">Permintaan perubahan data dari karyawan</div></div><a class="btn btn-ghost btn-sm" href="{{ route('admin.corrections.index') }}">Lihat semua</a></div><div class="table-wrap"><table class="data-table"><thead><tr><th>Karyawan</th><th>Jenis</th><th>Alasan</th><th>Status</th></tr></thead><tbody>@forelse($corrections as $item)<tr><td><strong>{{ $item->employee->full_name }}</strong><div class="tiny muted">{{ $item->created_at->diffForHumans() }}</div></td><td>{{ str_replace('_',' ',$item->request_type) }}</td><td>{{ Str::limit($item->reason,42) }}</td><td><span class="badge {{ $item->status }}">{{ strtoupper($item->status) }}</span></td></tr>@empty<tr><td colspan="4" class="empty">Belum ada permintaan koreksi.</td></tr>@endforelse</tbody></table></div></section></div><div class="dashboard-stack"><section class="card"><div class="card-head split"><div><strong>Perlu Perhatian</strong><div class="tiny muted">Kehadiran dengan status khusus hari ini</div></div></div><div class="card-body attention-list">@forelse($attention as $item)<a class="attention-row" href="{{ route('admin.attendance.show',$item) }}"><span class="row-icon"><i data-lucide="{{ $item->status==='outside_radius'?'map-pin-alert':($item->status==='late'?'clock-alert':'file-warning') }}"></i></span><span class="row-main"><span class="row-title">{{ $item->employee->full_name }}</span><span class="row-meta">{{ ucfirst(str_replace('_',' ',$item->status)) }} • {{ $item->check_in_time?->format('H:i') }}</span></span><span class="badge {{ $item->status }}">{{ ucfirst(str_replace('_',' ',$item->status)) }}</span></a>@empty<div class="empty"><i data-lucide="circle-check-big"></i><p>Tidak ada anomali hari ini.</p></div>@endforelse</div></section><section class="card"><div class="card-head split"><div><strong>Aktivitas Sistem</strong><div class="tiny muted">Audit trail terbaru</div></div><a class="btn btn-ghost btn-sm" href="{{ route('admin.activity-logs.index') }}">Lihat log</a></div><div class="card-body activity-list">@foreach($activities as $item)<div class="activity-row"><span class="row-icon"><i data-lucide="activity"></i></span><span class="row-main"><span class="row-title">{{ Str::limit($item->description,55) }}</span><span class="row-meta">{{ $item->user?->name??'Sistem' }} • {{ $item->created_at->diffForHumans() }}</span></span></div>@endforeach</div></section></div></div>
@push('scripts')<script>document.addEventListener('DOMContentLoaded',()=>{const trend=@json($trend);new Chart(document.getElementById('attendanceChart'),{type:'line',data:{labels:trend.map(x=>x.label),datasets:[{label:'Hadir',data:trend.map(x=>x.present),borderColor:'#198754',backgroundColor:'rgba(25,135,84,.08)',fill:true,tension:.35},{label:'Terlambat',data:trend.map(x=>x.late),borderColor:'#e58a00',tension:.35},{label:'Luar Radius',data:trend.map(x=>x.outside),borderColor:'#7c3aed',tension:.35}]},options:{responsive:true,maintainAspectRatio:false,plugins:{legend:{position:'top',align:'start',labels:{usePointStyle:true,boxWidth:8,font:{family:'Inter'}}}},scales:{x:{grid:{display:false}},y:{beginAtZero:true,ticks:{precision:0}}}}})});</script>@endpush
@endsection