{% extends 'base.html' %}
{% block content %}
<div class="row g-4">
  <div class="col-xl-4">
    <div class="card border-0 shadow-sm">
      <div class="card-header bg-white"><h5 class="fw-bold mb-0">Tambah User</h5></div>
      <div class="card-body">
        <form method="post" class="row g-3">
          <div class="col-12"><input class="form-control" name="full_name" placeholder="Nama lengkap" required></div>
          <div class="col-md-6"><input class="form-control" name="username" placeholder="Username" required></div>
          <div class="col-md-6"><input class="form-control" name="password" placeholder="Password" required></div>
          <div class="col-md-6"><select class="form-select" name="role"><option value="super_admin">Super Admin</option><option value="admin">Admin</option><option value="pimpinan">Pimpinan</option></select></div>
          <div class="col-md-6"><input class="form-control" name="unit" placeholder="Unit"></div>
          <div class="col-12"><button class="btn btn-primary w-100">Simpan User</button></div>
        </form>
      </div>
    </div>
  </div>
  <div class="col-xl-8">
    <div class="card border-0 shadow-sm">
      <div class="card-header bg-white"><h5 class="fw-bold mb-0">Daftar User</h5></div>
      <div class="card-body table-responsive">
        <table class="table">
          <thead><tr><th>Nama</th><th>Username</th><th>Role</th><th>Unit</th><th>Status</th></tr></thead>
          <tbody>
            {% for user in items %}
            <tr><td>{{ user.full_name }}</td><td>{{ user.username }}</td><td>{{ user.role }}</td><td>{{ user.unit }}</td><td>{{ 'Aktif' if user.is_active_user else 'Nonaktif' }}</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock %}