<?php
$tabs = [
  'all'      => 'ทั้งหมด',
  'pending'  => 'รอตรวจสอบ (Review)',
  'active'   => 'Active (วางขาย)',
  'hidden'   => 'Hidden (ซ่อน)',
  'rejected' => 'Rejected (ปฏิเสธ)'
];
$currentStatus = $filters['status'] ?? 'all';
?>
<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-2 mb-3">
  <div>
    <h4 class="fw-bold mb-1 text-dark">ตรวจสอบและกำกับดูแลสินค้า (Product Moderation)</h4>
    <p class="text-muted small mb-0">ตรวจสอบคุณภาพสินค้าใหม่ อนุมัติ ปฏิเสธ หรือซ่อนสินค้าที่ไม่ผ่านเกณฑ์</p>
  </div>
</div>

<!-- ── Status Tabs ─────────────────────────────────────── -->
<div class="d-flex gap-2 mb-3 overflow-x-auto pb-1" style="white-space: nowrap;">
  <?php foreach ($tabs as $v => $l): ?>
  <a href="?<?= http_build_query(array_merge($filters ?? [], ['status' => $v, 'page' => 1])) ?>"
     class="btn btn-sm <?= $currentStatus === $v ? 'btn-primary shadow-xs' : 'btn-white border text-muted' ?>" style="font-size: 0.82rem;">
    <?= $l ?>
  </a>
  <?php endforeach; ?>
</div>

<!-- ── Filter Bar ──────────────────────────────────────── -->
<div class="admin-filter-bar mb-3">
  <form method="GET" class="row g-2 align-items-end">
    <input type="hidden" name="status" value="<?= e($currentStatus) ?>">
    <div class="col-md-5">
      <label class="form-label small fw-semibold text-muted mb-1">ค้นหาสินค้า</label>
      <div class="input-group input-group-sm">
        <span class="input-group-text bg-light"><i class="bi bi-search text-muted"></i></span>
        <input type="text" name="q" value="<?= e($filters['q'] ?? '') ?>" class="form-control" placeholder="ชื่อสินค้า, ร้านค้า, SKU...">
      </div>
    </div>
    <div class="col-6 col-md-4">
      <label class="form-label small fw-semibold text-muted mb-1">หมวดหมู่สินค้า</label>
      <select name="category_id" class="form-select form-select-sm">
        <option value="">ทุกหมวดหมู่</option>
        <?php foreach ($categories ?? [] as $cat): ?>
        <option value="<?= $cat['id'] ?>" <?= ($filters['category_id'] ?? '') == $cat['id'] ? 'selected' : '' ?>>
          <?= ($cat['level'] > 1 ? '&nbsp;&nbsp;&bull; ' : '') . e($cat['name']) ?>
        </option>
        <?php endforeach; ?>
      </select>
    </div>
    <div class="col-6 col-md-3 d-flex gap-2">
      <button type="submit" class="btn btn-primary btn-sm w-100"><i class="bi bi-funnel me-1"></i>ค้นหา</button>
      <?php if (!empty($filters['q']) || !empty($filters['category_id']) || $currentStatus !== 'all'): ?>
      <a href="<?= url('/admin/products') ?>" class="btn btn-outline-secondary btn-sm" title="ล้างการกรอง"><i class="bi bi-x-lg"></i></a>
      <?php endif; ?>
    </div>
  </form>
</div>

<!-- ── Data Table Container ────────────────────────────── -->
<div class="admin-table-container">
  <div class="admin-table-header">
    <div class="d-flex align-items-center gap-2">
      <i class="bi bi-box-seam text-primary"></i>
      <span class="fw-bold text-dark" style="font-size: 0.9rem;">รายการสินค้า</span>
      <span class="badge bg-light text-muted border ms-1"><?= number_format($total ?? 0) ?> รายการ</span>
    </div>
  </div>

  <div class="table-responsive d-none d-md-block">
    <table class="admin-table">
      <thead>
        <tr>
          <th width="48">รูป</th>
          <th>สินค้า</th>
          <th>ร้านค้าผู้ขาย</th>
          <th>หมวดหมู่</th>
          <th>ราคาขาย</th>
          <th class="text-center">สต็อก</th>
          <th>สถานะ</th>
          <th>วันที่ลงขาย</th>
          <th class="text-end">การจัดการ</th>
        </tr>
      </thead>
      <tbody>
        <?php if (empty($products)): ?>
        <tr>
          <td colspan="9" class="text-center text-muted py-4">ไม่พบสินค้าตามเงื่อนไขที่เลือก</td>
        </tr>
        <?php else: foreach ($products as $p): ?>
        <tr>
          <td>
            <div class="rounded-2 border overflow-hidden bg-light d-flex align-items-center justify-content-center flex-shrink-0" style="width: 40px; height: 40px;">
              <?php if ($p['main_image']): ?>
                <img src="<?= product_image_url($p['main_image']) ?>" class="w-100 h-100 object-fit-cover" alt="">
              <?php else: ?>
                <i class="bi bi-image text-muted small"></i>
              <?php endif; ?>
            </div>
          </td>
          <td>
            <div class="fw-semibold text-dark" style="max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
              <?= e($p['name']) ?>
            </div>
            <div class="text-muted small font-monospace">ID #<?= (int)$p['id'] ?></div>
          </td>
          <td>
            <span class="text-dark small fw-medium"><?= e($p['store_name']) ?></span>
          </td>
          <td class="text-muted small">
            <?= e($p['category_name'] ?? '—') ?>
          </td>
          <td>
            <span class="fw-semibold text-dark">฿<?= number_format((float)$p['price'], 2) ?></span>
          </td>
          <td class="text-center font-monospace small">
            <?= (int)$p['stock'] ?>
          </td>
          <td>
            <?php
            $statusMap = [
              'active'   => ['status-active', 'Active'],
              'pending'  => ['status-pending', 'รอตรวจสอบ'],
              'draft'    => ['status-secondary', 'Draft'],
              'hidden'   => ['status-hidden', 'ซ่อน'],
              'rejected' => ['status-danger', 'ปฏิเสธ'],
            ];
            [$pillClass, $pillLabel] = $statusMap[$p['status']] ?? ['status-secondary', $p['status']];
            ?>
            <span class="status-pill <?= $pillClass ?>"><?= $pillLabel ?></span>
          </td>
          <td class="text-muted small"><?= date('d/m/Y', strtotime($p['created_at'])) ?></td>
          <td class="text-end">
            <a href="<?= url('/admin/products/' . (int)$p['id']) ?>" class="btn btn-outline-primary btn-sm py-1 px-2" style="font-size: 0.75rem;">
              <i class="bi bi-search me-1"></i>ตรวจสอบ
            </a>
          </td>
        </tr>
        <?php endforeach; endif; ?>
      </tbody>
    </table>
  </div>

  <!-- Mobile Card List View -->
  <div class="d-md-none p-3">
    <?php if (empty($products)): ?>
      <div class="text-center text-muted py-3 small">ไม่พบสินค้า</div>
    <?php else: foreach ($products as $p): ?>
      <div class="admin-mobile-card">
        <div class="d-flex gap-2 mb-2">
          <div class="rounded-2 border overflow-hidden bg-light d-flex align-items-center justify-content-center flex-shrink-0" style="width: 48px; height: 48px;">
            <?php if ($p['main_image']): ?><img src="<?= product_image_url($p['main_image']) ?>" class="w-100 h-100 object-fit-cover" alt=""><?php else: ?><i class="bi bi-image text-muted"></i><?php endif; ?>
          </div>
          <div class="flex-grow-1 min-w-0">
            <div class="fw-bold text-dark text-truncate"><?= e($p['name']) ?></div>
            <div class="text-muted small"><?= e($p['store_name']) ?> &bull; ฿<?= number_format((float)$p['price'], 2) ?></div>
          </div>
        </div>
        <div class="d-flex justify-content-between align-items-center pt-2 border-top">
          <span class="text-muted small">สต็อก: <?= (int)$p['stock'] ?></span>
          <a href="<?= url('/admin/products/' . (int)$p['id']) ?>" class="btn btn-outline-primary btn-sm py-1 px-2" style="font-size: 0.75rem;">
            ตรวจสอบ &rarr;
          </a>
        </div>
      </div>
    <?php endforeach; endif; ?>
  </div>

  <!-- Pagination -->
  <?php if (($total_pages ?? 1) > 1): ?>
  <div class="p-3 border-top d-flex justify-content-center">
    <nav>
      <ul class="pagination pagination-sm mb-0">
        <?php for ($i = 1; $i <= $total_pages; $i++): ?>
        <li class="page-item <?= $i === $page ? 'active' : '' ?>">
          <a class="page-link" href="?<?= http_build_query(array_merge($filters, ['page' => $i])) ?>"><?= $i ?></a>
        </li>
        <?php endfor; ?>
      </ul>
    </nav>
  </div>
  <?php endif; ?>
</div>

