@extends('layouts.app')

@section('title', 'Dashboard Kasir')

@section('content')
    <div class="space-y-6">
        <!-- Stats Cards -->
        <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
            <div class="bg-white rounded-xl shadow-md p-6">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-gray-500 text-sm">Pasien Hari Ini</p>
                        <h3 class="text-2xl font-bold text-gray-800">{{ $pasienHariIni }}</h3>
                    </div>
                    <div class="bg-blue-100 p-3 rounded-full">
                        <i class="fas fa-users text-blue-600 text-xl"></i>
                    </div>
                </div>
                <div class="mt-4">
                    <span class="text-green-500 text-sm font-medium">+2 dari kemarin</span>
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-md p-6">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-gray-500 text-sm">Menunggu Pembayaran</p>
                        <h3 class="text-2xl font-bold text-gray-800">{{ $registrasiSelesai->count() }}</h3>
                    </div>
                    <div class="bg-yellow-100 p-3 rounded-full">
                        <i class="fas fa-clock text-yellow-600 text-xl"></i>
                    </div>
                </div>
                <div class="mt-4">
                </div>
            </div>

            <div class="bg-white rounded-xl shadow-md p-6">
                <div class="flex items-center justify-between">
                    <div>
                        <p class="text-gray-500 text-sm">Pendapatan Hari Ini</p>
                        <h3 class="text-2xl font-bold text-gray-800">Rp {{ number_format($pendapatanHariIni, 0, ',', '.') }}
                        </h3>
                    </div>
                    <div class="bg-green-100 p-3 rounded-full">
                        <i class="fas fa-money-bill-wave text-green-600 text-xl"></i>
                    </div>
                </div>
                <div class="mt-4">
                    <span class="text-green-500 text-sm font-medium">+15% dari kemarin</span>
                </div>
            </div>
        </div>

        <div class="bg-white rounded-xl shadow-md overflow-hidden">
            <div class="p-6 border-b border-gray-200">
                <div class="flex justify-between items-center">
                    <h3 class="text-lg font-semibold text-gray-800">Pasien Menunggu Pembayaran</h3>
                </div>
            </div>

            <div class="overflow-x-auto">
                @if ($registrasiSelesai->count() > 0)
                    <table class="min-w-full divide-y divide-gray-200">
                        <thead class="bg-gray-50">
                            <tr>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    No. Antrian</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Nama Pasien</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Ruang Pelayanan</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Waktu</th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Aksi</th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-gray-200">
                            @foreach ($registrasiSelesai as $registrasis)
                                @if ($registrasis->pasien)
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <span
                                                class="px-2 py-1 bg-blue-100 text-blue-800 rounded-full text-sm font-medium">
                                                #{{ $registrasis->nomor_antrian }}
                                            </span>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="flex items-center">
                                                <div
                                                    class="flex-shrink-0 h-10 w-10 bg-blue-100 rounded-full flex items-center justify-center">
                                                    <i class="fas fa-user text-blue-600"></i>
                                                </div>
                                                <div class="ml-4">
                                                    <div class="text-sm font-medium text-gray-900">
                                                        {{ $registrasis->pasien->nama_pasien ?? 'Pasien Tidak Ditemukan' }}
                                                    </div>
                                                    <div class="text-sm text-gray-500">{{ $registrasis->pasien->nik ?? '' }}
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="text-sm text-gray-900">
                                                {{ optional($registrasis->ruang_pelayanan)->nama_ruang_pelayanan ?? '-' }}
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="text-sm text-gray-500">{{ $registrasis->created_at }}
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
                                            <a href="{{ route('transaksi.show', ['id' => $registrasis->id]) }}"
                                                class="text-blue-500 hover:underline">Bayar</a>
                                        </td>
                                    </tr>
                                @endif
                            @endforeach
                        </tbody>
                    </table>
                @else
                    <div class="p-8 text-center">
                        <i class="fas fa-check-circle text-green-500 text-4xl mb-3"></i>
                        <h4 class="text-lg font-medium text-gray-700">Tidak ada pasien menunggu pembayaran</h4>
                        <p class="text-gray-500 mt-1">Semua pasien telah diproses pembayarannya</p>
                    </div>
                @endif
            </div>
        </div>

        <div class="bg-white rounded-xl shadow-md overflow-hidden mt-8">
            <div class="p-6 border-b border-gray-200">
                <div class="flex justify-between items-center">
                    <h3 class="text-lg font-semibold text-gray-800">Daftar Antrian Pasien</h3>
                </div>
            </div>

            <div class="overflow-x-auto p-3">
                @if ($registrasi->count() > 0)
                    <table class="min-w-full divide-y divide-gray-200">
                        <thead class="bg-gray-50">
                            <tr>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    No. Antrian
                                </th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Nama Pasien
                                </th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Ruang Pelayanan
                                </th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Status
                                </th>
                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
                                    Waktu Registrasi
                                </th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-gray-200">
                            @if (is_object($registrasi) && $registrasi->count() > 0)
                                @foreach ($registrasi as $item)
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <span
                                                class="px-2 py-1 bg-green-100 text-green-800 rounded-full text-sm font-medium">
                                                #{{ $item->nomor_antrian ?? 'N/A' }}
                                            </span>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="flex items-center">
                                                <div
                                                    class="flex-shrink-0 h-10 w-10 bg-green-100 rounded-full flex items-center justify-center">
                                                    <i class="fas fa-user text-green-600"></i>
                                                </div>
                                                <div class="ml-4">
                                                    <div class="text-sm font-medium text-gray-900">
                                                        {{ $item->pasien->nama_pasien ?? 'Pasien Tidak Ditemukan' }}
                                                    </div>
                                                    <div class="text-sm text-gray-500">{{ $item->pasien->nik ?? '-' }}
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="text-sm text-gray-900">
                                                {{ $item->ruang_pelayanan->nama_ruang_pelayanan ?? '-' }}
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <span
                                                class="text-sm {{ $item->status == 'selesai' ? 'text-green-500' : 'text-yellow-500' }}">
                                                {{ ucfirst($item->status) }}
                                            </span>
                                        </td>
                                        <td class="px-6 py-4 whitespace-nowrap">
                                            <div class="text-sm text-gray-500">
                                                {{ $item->created_at }}
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            @else
                                <tr>
                                    <td colspan="5" class="px-6 py-4 text-center text-gray-500">
                                        Data registrasi tidak tersedia atau format tidak valid
                                    </td>
                                </tr>
                            @endif
                        </tbody>
                    </table>
                @else
                    <div class="p-8 text-center">
                        <i class="fas fa-info-circle text-gray-400 text-4xl mb-3"></i>
                        <h4 class="text-lg font-medium text-gray-700">Belum ada pasien terdaftar</h4>
                        <p class="text-gray-500 mt-1">Data antrian akan muncul setelah pasien mendaftar</p>
                    </div>
                @endif
                {{-- {{ $registrasi->links('pagination::tailwind') }} --}}
            </div>
        </div>

    </div>
    </div>
@endsection