<div class="card">
  <div style="display:flex; justify-content:space-between; align-items:center;
              margin-bottom:16px; flex-wrap:wrap; gap:8px;">
    <span style="font-weight:600; color:#555;">
      Total: <strong><?= count($templates) ?></strong> template
      <?php if ($is_admin): ?>
        <span class="badge badge-primary" style="margin-left:6px;">Semua User</span>
      <?php endif; ?>
    </span>
    <a href="<?= site_url('template/builder') ?>" class="btn btn-primary">+ Buat Template</a>
  </div>

  <table id="tblTemplate" class="display nowrap" style="width:100%">
    <thead>
      <tr>
        <th>#</th>
        <th class="all">Nama Template</th>
        <th>Toko</th>
        <th>Lebar</th>
        <?php if ($is_admin): ?><th>Pemilik</th><?php endif; ?>
        <th class="all">Status</th>
        <th>Dibuat</th>
        <th class="all">Aksi</th>
      </tr>
    </thead>
    <tbody>
      <?php if (empty($templates)): ?>
        <tr>
          <td colspan="<?= $is_admin ? 8 : 7 ?>"
              style="text-align:center; color:#999; padding:40px;">
            Belum ada template.
            <a href="<?= site_url('template/builder') ?>" style="color:var(--primary);">
              Buat sekarang →
            </a>
          </td>
        </tr>
      <?php else: ?>
        <?php foreach ($templates as $i => $t): ?>
          <tr>
            <td><?= $i + 1 ?></td>
            <td><strong><?= htmlspecialchars($t->name) ?></strong></td>
            <td><?= htmlspecialchars($t->store_name ?? '-') ?></td>
            <td><?= $t->paper_width ?>mm</td>
            <?php if ($is_admin): ?>
              <td>
                <span class="badge badge-primary" style="font-size:11px;">
                  <?= htmlspecialchars($t->owner_name ?? '-') ?>
                </span>
              </td>
            <?php endif; ?>
            <td>
              <?php if ($t->is_default): ?>
                <span class="badge badge-success">✓ Default</span>
              <?php else: ?>
                <a href="<?= site_url('template/set_default/' . $t->id) ?>"
                   class="badge badge-primary"
                   style="cursor:pointer; text-decoration:none;"
                   onclick="return confirm('Jadikan template ini sebagai default?')">
                  Set Default
                </a>
              <?php endif; ?>
            </td>
            <td data-order="<?= $t->created_at ?>"
                style="color:#888; font-size:12px; white-space:nowrap;">
              <?= date('d/m/Y', strtotime($t->created_at)) ?>
            </td>
            <td>
              <div style="display:flex; gap:4px; justify-content:center;">
                <a href="<?= site_url('template/builder/' . $t->id) ?>"
                   class="btn btn-warning btn-sm">✏️ Edit</a>
                <?php if (!$t->is_default): ?>
                  <a href="<?= site_url('template/delete/' . $t->id) ?>"
                     class="btn btn-danger btn-sm"
                     onclick="return confirm('Hapus template <?= htmlspecialchars(addslashes($t->name)) ?>?')">🗑</a>
                <?php endif; ?>
              </div>
            </td>
          </tr>
        <?php endforeach; ?>
      <?php endif; ?>
    </tbody>
  </table>
</div>

<script>
$(document).ready(function () {
  var colAksi = <?= $is_admin ? 7 : 6 ?>;

  $('#tblTemplate').DataTable({
    responsive: true,
    language: {
      search:            '',
      searchPlaceholder: 'Cari template...',
      lengthMenu:        'Tampilkan _MENU_ baris',
      info:              'Menampilkan _START_–_END_ dari _TOTAL_ data',
      infoEmpty:         'Tidak ada data',
      infoFiltered:      '(dari _MAX_ total)',
      zeroRecords:       'Template tidak ditemukan',
      emptyTable:        'Belum ada template',
      paginate: { first:'«', last:'»', next:'›', previous:'‹' },
    },
    order:      [[0, 'desc']],
    pageLength: 10,
    lengthMenu: [[5, 10, 25, 50, -1], [5, 10, 25, 50, 'Semua']],
    columnDefs: [
      { orderable: false, targets: colAksi },
      { responsivePriority: 1, targets: 1 },
      { responsivePriority: 2, targets: colAksi },
    ],
    dom: '<"dt-top"lf>rt<"dt-bottom"ip>',
  });
});
</script>
