<?= $this->include('/Styles/header'); ?>

<main class="p-6">
  <div class="bg-white shadow rounded-lg p-6">
    <div class="flex justify-between mb-4">
      <h2 class="text-2xl font-bold">Category List</h2>
      <a href="<?= site_url('category/add') ?>" class="bg-blue-600 text-white px-4 py-2 rounded">+ Add Category</a>
    </div>

    <?php if(session()->getFlashdata('success')): ?>
      <script>
        Swal.fire({
          icon: 'success',
          title: 'Success',
          text: '<?= session()->getFlashdata('success') ?>',
          showConfirmButton: false,
          timer: 2000
        });
      </script>
    <?php endif; ?>

    <table class="w-full border-collapse border">
      <thead>
        <tr class="bg-gray-100">
          <th class="border p-2">ID</th>
          <th class="border p-2">Category Name</th>
          <th class="border p-2">Description</th>
          <th class="border p-2">Actions</th>
        </tr>
      </thead>
      <tbody>
        <?php foreach($categories as $cat): ?>
          <tr>
            <td class="border p-2"><?= $cat['id'] ?></td>
            <td class="border p-2"><?= $cat['category_name'] ?></td>
            <td class="border p-2"><?= $cat['description'] ?></td>
            <td class="border p-2">
              <a href="<?= site_url('category/edit/'.$cat['id']) ?>" class="bg-green-500 text-white px-2 py-1 rounded">Edit</a>
              <a href="javascript:void(0)" onclick="confirmDelete(<?= $cat['id'] ?>)" class="bg-red-500 text-white px-2 py-1 rounded">Delete</a>
            </td>
          </tr>
        <?php endforeach; ?>
      </tbody>
    </table>
  </div>
</main>

<script>
function confirmDelete(id) {
  Swal.fire({
    title: "Are you sure?",
    text: "This action cannot be undone!",
    icon: "warning",
    showCancelButton: true,
    confirmButtonColor: "#d33",
    cancelButtonColor: "#3085d6",
    confirmButtonText: "Yes, delete it!"
  }).then((result) => {
    if (result.isConfirmed) {
      window.location.href = "<?= site_url('category/delete/') ?>" + id;
    }
  });
}
</script>

<?= $this->include('/Styles/footer'); ?>
