<?php

session_start();

if(!isset($_SESSION['role'])){

    header("Location: ../index.php");
    exit;
}

if($_SESSION['role'] != 'admin'){

    header("Location: ../index.php");
    exit;
}

include '../config/koneksi.php';

$data = mysqli_query($conn,

"SELECT bantuan.*,

laporan.nama_warga,

rumah_ibadah.nama AS rumah_ibadah,

cs_rumah_ibadah.nama AS cs_nama

FROM bantuan

JOIN laporan
ON bantuan.laporan_id = laporan.id

JOIN rumah_ibadah
ON bantuan.rumah_ibadah_id = rumah_ibadah.id

JOIN cs_rumah_ibadah
ON bantuan.cs_id = cs_rumah_ibadah.id

ORDER BY bantuan.id DESC"

);

?>

<!DOCTYPE html>
<html>

<head>

    <title>Data Bantuan</title>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />

    <?php include 'layout/style.php'; ?>
    <script src="https://cdn.tailwindcss.com"></script>
</head>

<body>

    <?php include 'layout/navbar.php'; ?>

    <?php include 'layout/sidebar.php'; ?>

    <div class="content">


        <div class="mb-6">

            <h1 class="text-3xl font-bold text-gray-800">
                Data Bantuan
            </h1>

            <p class="text-gray-500 mt-2">
                Monitoring bantuan sosial yang sedang diproses dan telah selesai disalurkan.
            </p>

        </div>

        <?php

$total = mysqli_num_rows($data);

mysqli_data_seek($data,0);

$proses = 0;
$selesai = 0;

while($r = mysqli_fetch_assoc($data)){

    if($r['status']=='proses'){
        $proses++;
    }

    if($r['status']=='selesai'){
        $selesai++;
    }
}

mysqli_data_seek($data,0);

?>

        <div class="grid md:grid-cols-3 gap-5 mb-6">

            <div class="bg-white rounded-2xl shadow p-5">

                <div class="flex items-center justify-between">

                    <div>
                        <p class="text-gray-500 text-sm">
                            Total Bantuan
                        </p>

                        <h2 class="text-3xl font-bold text-blue-600">
                            <?= $total ?>
                        </h2>
                    </div>

                    <i class="fas fa-hand-holding-heart text-4xl text-blue-500"></i>

                </div>

            </div>

            <div class="bg-white rounded-2xl shadow p-5">

                <div class="flex items-center justify-between">

                    <div>
                        <p class="text-gray-500 text-sm">
                            Diproses
                        </p>

                        <h2 class="text-3xl font-bold text-orange-500">
                            <?= $proses ?>
                        </h2>
                    </div>

                    <i class="fas fa-spinner text-4xl text-orange-500"></i>

                </div>

            </div>

            <div class="bg-white rounded-2xl shadow p-5">

                <div class="flex items-center justify-between">

                    <div>
                        <p class="text-gray-500 text-sm">
                            Selesai
                        </p>

                        <h2 class="text-3xl font-bold text-green-600">
                            <?= $selesai ?>
                        </h2>
                    </div>

                    <i class="fas fa-check-circle text-4xl text-green-600"></i>

                </div>

            </div>

        </div>

        <div class="bg-white rounded-2xl shadow overflow-hidden">

            <div class="p-5 border-b">

                <h2 class="font-semibold text-lg">
                    Daftar Bantuan
                </h2>

            </div>

            <div class="overflow-x-auto">

                <table class="min-w-full">

                    <thead class="bg-gray-100">

                        <tr>

                            <th class="px-4 py-3 text-left">No</th>
                            <th class="px-4 py-3 text-left">Nama Warga</th>
                            <th class="px-4 py-3 text-left">Rumah Ibadah</th>
                            <th class="px-4 py-3 text-left">CS Penyalur</th>
                            <th class="px-4 py-3 text-left">Jenis Bantuan</th>
                            <th class="px-4 py-3 text-center">Status</th>
                            <th class="px-4 py-3 text-center">Bukti</th>

                        </tr>

                    </thead>

                    <tbody>

                        <?php

                $no = 1;

                if(mysqli_num_rows($data) > 0){

                while($row = mysqli_fetch_assoc($data)){

                ?>

                        <tr class="border-b hover:bg-gray-50 transition">

                            <td class="px-4 py-3">
                                <?= $no++ ?>
                            </td>

                            <td class="px-4 py-3 font-medium">
                                <?= htmlspecialchars($row['nama_warga']) ?>
                            </td>

                            <td class="px-4 py-3">
                                <?= htmlspecialchars($row['rumah_ibadah']) ?>
                            </td>

                            <td class="px-4 py-3">
                                <?= htmlspecialchars($row['cs_nama']) ?>
                            </td>

                            <td class="px-4 py-3">
                                <?= htmlspecialchars($row['jenis_bantuan']) ?>
                            </td>

                            <td class="px-4 py-3 text-center">

                                <?php if($row['status']=='proses'){ ?>

                                <span
                                    class="px-3 py-1 rounded-full text-xs font-semibold bg-orange-100 text-orange-700">
                                    Diproses
                                </span>

                                <?php } elseif($row['status']=='selesai'){ ?>

                                <span class="px-3 py-1 rounded-full text-xs font-semibold bg-green-100 text-green-700">
                                    Selesai
                                </span>

                                <?php } ?>

                            </td>

                            <td class="px-4 py-3 text-center">

                                <?php if(!empty($row['bukti_foto'])){ ?>

                                <img src="../assets/uploads/<?= htmlspecialchars($row['bukti_foto']) ?>"
                                    class="w-24 h-24 object-cover rounded-xl shadow mx-auto hover:scale-105 transition cursor-pointer">

                                <?php } else { ?>

                                <span class="text-gray-400 italic">
                                    Belum Ada
                                </span>

                                <?php } ?>

                            </td>

                        </tr>

                        <?php } } else { ?>

                        <tr>

                            <td colspan="7" class="py-10 text-center text-gray-500">

                                <i class="fas fa-box-open text-4xl mb-3 block"></i>

                                Belum ada data bantuan

                            </td>

                        </tr>

                        <?php } ?>

                    </tbody>

                </table>

            </div>

        </div>


    </div>


</body>

</html>