{% extends "base.html" %}
{% block title %}Kelola User{% endblock %}

{% block content %}
<div class="page-header">
  <div>
    <h1 class="page-title">👥 Kelola User</h1>
    <p class="page-sub">Manajemen akun Owner dan Staf Lapangan</p>
  </div>
  <a href="{{ url_for('tambah_user') }}" class="btn btn--primary">+ Tambah User</a>
</div>

<div class="card">
  <div class="table-wrapper">
    <table class="table">
      <thead>
        <tr>
          <th>#</th>
          <th>Username</th>
          <th>Nama Lengkap</th>
          <th>Role</th>
          <th>Status</th>
          <th>Dibuat</th>
        </tr>
      </thead>
      <tbody>
        {% for u in users %}
        <tr>
          <td>{{ loop.index }}</td>
          <td><code>{{ u.username }}</code></td>
          <td class="td-bold">{{ u.nama_lengkap }}</td>
          <td>
            <span class="badge {% if u.role == 'owner' %}badge--purple{% else %}badge--blue{% endif %}">
              {{ u.role | capitalize }}
            </span>
          </td>
          <td>
            <span class="badge {% if u.aktif %}badge--green{% else %}badge--red{% endif %}">
              {{ 'Aktif' if u.aktif else 'Nonaktif' }}
            </span>
          </td>
          <td>{{ u.created_at.strftime('%d/%m/%Y') }}</td>
        </tr>
        {% else %}
        <tr><td colspan="6" class="text-center">Belum ada user</td></tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
{% endblock %}