@extends('layouts.admin')

@section('title', 'Log Notifikasi')

@section('content')
<div class="mb-6 flex flex-wrap items-center justify-between gap-4">
    <form action="{{ route('admin.notifications') }}" method="GET" class="flex flex-wrap items-center gap-2">
        <select name="status" class="border border-gray-200 rounded-lg px-4 py-2 text-sm">
            <option value="">Semua Status</option>
            <option value="sent" {{ request('status') === 'sent' ? 'selected' : '' }}>Terkirim</option>
            <option value="failed" {{ request('status') === 'failed' ? 'selected' : '' }}>Gagal</option>
            <option value="pending" {{ request('status') === 'pending' ? 'selected' : '' }}>Pending</option>
            <option value="scheduled" {{ request('status') === 'scheduled' ? 'selected' : '' }}>Dijadwalkan</option>
            <option value="cancelled" {{ request('status') === 'cancelled' ? 'selected' : '' }}>Dibatalkan</option>
        </select>
        <select name="channel" class="border border-gray-200 rounded-lg px-4 py-2 text-sm">
            <option value="">Semua Channel</option>
            <option value="email" {{ request('channel') === 'email' ? 'selected' : '' }}>Email</option>
            <option value="whatsapp" {{ request('channel') === 'whatsapp' ? 'selected' : '' }}>WhatsApp</option>
        </select>
        <select name="job_id" class="border border-gray-200 rounded-lg px-4 py-2 text-sm">
            <option value="">Semua Lowongan</option>
            @foreach($jobs as $job)
                <option value="{{ $job->id }}" {{ request('job_id') == $job->id ? 'selected' : '' }}>{{ $job->title }}</option>
            @endforeach
        </select>
        <button class="bg-gray-100 text-gray-600 px-4 py-2 rounded-lg text-sm hover:outline hover:outline-2 hover:outline-gray-400">Filter</button>
    </form>
    <a href="{{ route('admin.notifications.queue') }}" class="bg-indigo-50 text-indigo-600 px-4 py-2 rounded-lg text-sm font-medium hover:bg-indigo-100 flex items-center gap-2">
        <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
        Lihat Antrian Notifikasi
    </a>
</div>

<div class="bg-white rounded-xl border border-gray-100 overflow-x-auto">
    <table class="w-full min-w-[700px]">
        <thead>
            <tr class="bg-gray-50 border-b border-gray-100">
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Pelamar</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Lowongan</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Tipe</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Channel</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Status</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Jadwal / Kirim</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Error</th>
                <th class="text-left px-6 py-3 text-xs font-medium text-gray-500 uppercase">Waktu</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-50">
            @forelse($logs as $log)
            <tr class="hover:bg-gray-50">
                <td class="px-6 py-3 text-sm text-gray-800">{{ $log->recipient_name ?? ($log->application->applicant->name ?? 'N/A') }}</td>
                <td class="px-6 py-3 text-sm text-gray-600">{{ $log->application->jobListing->title ?? '-' }}</td>
                <td class="px-6 py-3 text-sm text-gray-600">{{ $log->type }}</td>
                <td class="px-6 py-3">
                    <span class="text-xs px-2 py-1 rounded-full {{ $log->channel === 'email' ? 'bg-blue-100 text-blue-700' : 'bg-green-100 text-green-700' }}">
                        {{ $log->channel === 'email' ? 'Email' : 'WhatsApp' }}
                    </span>
                </td>
                <td class="px-6 py-3">
                    @php
                        $statusColors = [
                            'sent' => 'bg-green-100 text-green-700',
                            'failed' => 'bg-red-100 text-red-700',
                            'pending' => 'bg-yellow-100 text-yellow-700',
                            'scheduled' => 'bg-blue-100 text-blue-700',
                            'cancelled' => 'bg-gray-100 text-gray-500',
                        ];
                        $statusLabels = [
                            'sent' => 'Terkirim',
                            'failed' => 'Gagal',
                            'pending' => 'Pending',
                            'scheduled' => 'Dijadwalkan',
                            'cancelled' => 'Dibatalkan',
                        ];
                    @endphp
                    <span class="text-xs px-2 py-1 rounded-full {{ $statusColors[$log->status] ?? 'bg-gray-100 text-gray-700' }}">
                        {{ $statusLabels[$log->status] ?? $log->status }}
                    </span>
                </td>
                <td class="px-6 py-3 text-xs text-gray-500">
                    @if($log->scheduled_at)
                        <span title="Dijadwalkan">{{ $log->scheduled_at->format('d/m/Y H:i') }}</span>
                    @endif
                    @if($log->sent_at)
                        <span title="Terkirim">{{ $log->sent_at->format('d/m/Y H:i') }}</span>
                    @endif
                </td>
                <td class="px-6 py-3 text-xs text-red-500 max-w-xs truncate">{{ $log->error ?? '-' }}</td>
                <td class="px-6 py-3 text-xs text-gray-400">{{ $log->created_at->format('d/m/Y H:i') }}</td>
            </tr>
            @empty
            <tr>
                <td colspan="8" class="px-6 py-12 text-center text-gray-400">Belum ada log notifikasi</td>
            </tr>
            @endforelse
        </tbody>
    </table>
</div>

<div class="mt-6">{{ $logs->appends(request()->query())->links('pagination') }}</div>
@endsection