{% extends "base.html" %}
{% block content %}
<div class="row">
    <div class="col-md-6">
        <h2>👑 Tambah Pengguna Baru</h2>
        <div class="card p-3 mb-4">
            <form method="POST" action="{{ url_for('manage_users') }}">
                <input type="hidden" name="action" value="add">
                <div class="mb-3">
                    <label class="form-label">Username</label>
                    <input type="text" class="form-control" name="username" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">Password</label>
                    <input type="password" class="form-control" name="password" required>
                </div>
                <div class="mb-3">
                    <label class="form-label">Hak Akses (Role)</label>
                    <select class="form-select" name="role_id" required>
                        {% for role in roles %}
                            <option value="{{ role.id }}">{{ role.name }}</option>
                        {% endfor %}
                    </select>
                </div>
                <button type="submit" class="btn btn-success">Tambah Pengguna</button>
            </form>
        </div>
    </div>

    <div class="col-md-6">
        <h2>Daftar & Edit Hak Akses Pengguna</h2>
        <div class="table-responsive">
            <table class="table table-bordered table-sm">
                <thead>
                    <tr>
                        <th>Username</th>
                        <th>Role Saat Ini</th>
                        <th>Aksi</th>
                    </tr>
                </thead>
                <tbody>
                    {% for user in users %}
                    <tr>
                        <td>{{ user.username }}</td>
                        <td><span class="badge bg-{{ 'danger' if user.role.name == 'Admin' else ('warning' if user.role.name == 'Uploader' else 'secondary') }}">{{ user.role.name }}</span></td>
                        <td>
                            <form method="POST" action="{{ url_for('manage_users') }}" class="d-flex">
                                <input type="hidden" name="action" value="change_role">
                                <input type="hidden" name="user_id" value="{{ user.id }}">
                                <select class="form-select form-select-sm me-2" name="new_role_id" required>
                                    {% for role in roles %}
                                        <option value="{{ role.id }}" {% if user.role_id == role.id %}selected{% endif %}>{{ role.name }}</option>
                                    {% endfor %}
                                </select>
                                <button type="submit" class="btn btn-sm btn-primary" {% if user.username == 'admin' %}disabled{% endif %}>Ubah Role</button>
                            </form>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}