@extends('layouts.app')

@section('title', 'Statistik - Admin TUNJUK-i')

@section('content')
<div class="mb-6">
    <div class="flex items-center justify-between">
        <div>
            <h1 class="text-2xl font-bold text-[#0b2b4a] flex items-center gap-2">
                <i class="fas fa-chart-bar text-[#c9a84c]"></i>
                Statistik Sistem
            </h1>
            <p class="text-gray-500 text-sm mt-1">Statistik lengkap sistem TUNJUK-i</p>
        </div>
        <a href="{{ route('admin.dashboard') }}" class="text-gray-600 hover:text-gray-800 transition">
            <i class="fas fa-arrow-left mr-1"></i> Kembali ke Dashboard
        </a>
    </div>
</div>

@php
    $totalUsers = \App\Models\User::count();
    $totalContractors = \App\Models\Contractor::count();
    $totalPackages = \App\Models\JobPackage::count();
    $totalContracts = \App\Models\Contract::count();
    $totalFinancing = \App\Models\FinancingApplication::count();
    $totalAuditLogs = \App\Models\AuditLog::count();
    
    $usersByRole = \App\Models\User::select('role', \DB::raw('count(*) as total'))
        ->groupBy('role')
        ->get();
    
    $contractsByStatus = \App\Models\Contract::select('status', \DB::raw('count(*) as total'))
        ->groupBy('status')
        ->get();
    
    $packagesByStatus = \App\Models\JobPackage::select('status', \DB::raw('count(*) as total'))
        ->groupBy('status')
        ->get();
    
    $verifiedOAP = \App\Models\Contractor::where('oap_status', 'verified')->count();
    $pendingOAP = \App\Models\Contractor::where('oap_status', 'pending')->count();
    $rejectedOAP = \App\Models\Contractor::where('oap_status', 'rejected')->count();
@endphp

<!-- Stats Cards -->
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8">
    <x-stat-card title="Total Users" :value="$totalUsers" icon="fa-users" subtitle="Semua user" />
    <x-stat-card title="Total Kontraktor" :value="$totalContractors" icon="fa-hard-hat" subtitle="{{ $verifiedOAP }} terverifikasi" />
    <x-stat-card title="Total Paket" :value="$totalPackages" icon="fa-box" subtitle="Semua paket" />
    <x-stat-card title="Total Kontrak" :value="$totalContracts" icon="fa-file-signature" subtitle="Semua kontrak" />
</div>

<!-- Detail Stats -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-8">
    <!-- Users by Role -->
    <div class="bg-white p-6 rounded-2xl shadow-sm border border-gray-100">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">User by Role</h3>
        <div class="space-y-2">
            @foreach($usersByRole as $item)
                <div class="flex items-center justify-between">
                    <span class="text-sm text-gray-600">{{ ucfirst($item->role) }}</span>
                    <span class="text-sm font-semibold text-gray-800">{{ $item->total }}</span>
                </div>
            @endforeach
        </div>
    </div>

    <!-- Contracts by Status -->
    <div class="bg-white p-6 rounded-2xl shadow-sm border border-gray-100">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">Kontrak by Status</h3>
        <div class="space-y-2">
            @foreach($contractsByStatus as $item)
                <div class="flex items-center justify-between">
                    <span class="text-sm text-gray-600">{{ ucfirst($item->status) }}</span>
                    <span class="text-sm font-semibold text-gray-800">{{ $item->total }}</span>
                </div>
            @endforeach
        </div>
    </div>

    <!-- Packages by Status -->
    <div class="bg-white p-6 rounded-2xl shadow-sm border border-gray-100">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">Paket by Status</h3>
        <div class="space-y-2">
            @foreach($packagesByStatus as $item)
                <div class="flex items-center justify-between">
                    <span class="text-sm text-gray-600">{{ ucfirst($item->status) }}</span>
                    <span class="text-sm font-semibold text-gray-800">{{ $item->total }}</span>
                </div>
            @endforeach
        </div>
    </div>
</div>

<!-- OAP Status -->
<div class="bg-white p-6 rounded-2xl shadow-sm border border-gray-100">
    <h3 class="text-sm font-semibold text-gray-700 mb-4">Status Verifikasi OAP</h3>
    <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
        <div class="bg-green-50 p-4 rounded-xl text-center">
            <p class="text-2xl font-bold text-green-600">{{ $verifiedOAP }}</p>
            <p class="text-xs text-gray-500">Terverifikasi</p>
        </div>
        <div class="bg-yellow-50 p-4 rounded-xl text-center">
            <p class="text-2xl font-bold text-yellow-600">{{ $pendingOAP }}</p>
            <p class="text-xs text-gray-500">Pending</p>
        </div>
        <div class="bg-red-50 p-4 rounded-xl text-center">
            <p class="text-2xl font-bold text-red-600">{{ $rejectedOAP }}</p>
            <p class="text-xs text-gray-500">Ditolak</p>
        </div>
    </div>
</div>
@endsection