{% extends "admin_master/base_admin_master.html" %}
{% block title %}Manajemen Admin - Admin Master{% endblock %}

{% block page_header %}
<h5 class="mb-1 fw-bold" style="color: #1f2937; font-size: 1.25rem;">Manajemen Admin</h5>
<small class="text-muted" style="font-size: 0.85rem;">Kelola akun admin sistem pesantren.</small>
{% endblock %}

{% block content %}

<!-- Tombol Tambah -->
<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <span class="text-muted" style="font-size: 0.85rem;">Total: <strong>{{ admin_list|length }}</strong> admin</span>
    </div>
    <button class="btn btn-success btn-sm px-3" data-bs-toggle="modal" data-bs-target="#modalTambah">
        <i class="fas fa-plus me-1"></i> Tambah Admin
    </button>
</div>

<!-- Tabel Admin -->
<div class="db-card p-0">
    <div class="table-responsive">
        <table class="table table-master mb-0">
            <thead>
                <tr>
                    <th>Username</th>
                    <th>Nama Lengkap</th>
                    <th>Role</th>
                    <th>Kategori</th>
                    <th>Status</th>
                    <th>Terakhir Login</th>
                    <th class="text-end">Aksi</th>
                </tr>
            </thead>
            <tbody>
                {% for a in admin_list %}
                <tr>
                    <td><code>{{ a.username }}</code></td>
                    <td>{{ a.nama_lengkap or '-' }}</td>
                    <td>
                        {% if a.role == 'admin_master' %}
                        <span class="badge bg-dark bg-opacity-75 rounded-pill">Admin Master</span>
                        {% elif a.role == 'admin_database' %}
                        <span class="badge bg-success bg-opacity-75 rounded-pill">Admin Database</span>
                        {% elif a.role == 'admin_psb' %}
                        <span class="badge bg-primary bg-opacity-75 rounded-pill">Admin PSB</span>
                        {% elif a.role == 'admin_keuangan' %}
                        <span class="badge bg-warning text-dark rounded-pill">Admin Keuangan</span>
                        {% else %}
                        <span class="badge bg-secondary rounded-pill">{{ a.role }}</span>
                        {% endif %}
                    </td>
                    <td>{{ a.kategori or '-' }}</td>
                    <td>
                        {% if a.status == 'Aktif' %}
                        <span class="badge badge-aktif rounded-pill fw-semibold" style="font-size: 0.75rem;">● Aktif</span>
                        {% else %}
                        <span class="badge badge-nonaktif rounded-pill fw-semibold" style="font-size: 0.75rem;">● Nonaktif</span>
                        {% endif %}
                    </td>
                    <td style="font-size: 0.85rem;">{{ a.terakhir_login.strftime('%d %b %Y, %H:%M') if a.terakhir_login else '-' }}</td>
                    <td class="text-end">
                        <div class="dropdown">
                            <button class="btn btn-light btn-sm border-0" data-bs-toggle="dropdown">
                                <i class="fas fa-ellipsis-v text-muted"></i>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-end shadow-sm" style="font-size: 0.85rem;">
                                <li><a class="dropdown-item py-2" href="#" onclick="editAdmin({{ a|tojson|forceescape }})"><i class="fas fa-edit me-2 text-primary"></i> Edit</a></li>
                                <li>
                                    <form action="/admin_master/admin/reset_password/{{ a.id }}" method="POST" class="d-inline">
                                        <button type="submit" class="dropdown-item py-2" onclick="return confirm('Reset password admin {{ a.username }}?')">
                                            <i class="fas fa-key me-2 text-warning"></i> Reset Password
                                        </button>
                                    </form>
                                </li>
                                {% if a.id != session.get('id_admin') %}
                                <li>
                                    <form action="/admin_master/admin/toggle/{{ a.id }}" method="POST" class="d-inline">
                                        <button type="submit" class="dropdown-item py-2">
                                            {% if a.status == 'Aktif' %}
                                            <i class="fas fa-ban me-2 text-secondary"></i> Nonaktifkan
                                            {% else %}
                                            <i class="fas fa-check me-2 text-success"></i> Aktifkan
                                            {% endif %}
                                        </button>
                                    </form>
                                </li>
                                <li><hr class="dropdown-divider"></li>
                                <li>
                                    <form action="/admin_master/admin/hapus/{{ a.id }}" method="POST" class="d-inline">
                                        <button type="submit" class="dropdown-item py-2 text-danger" onclick="return confirm('HAPUS admin {{ a.username }}? Aksi ini tidak bisa dibatalkan!')">
                                            <i class="fas fa-trash me-2"></i> Hapus
                                        </button>
                                    </form>
                                </li>
                                {% endif %}
                            </ul>
                        </div>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>

<!-- Modal Tambah Admin -->
<div class="modal fade" id="modalTambah" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-bottom">
                <h6 class="modal-title fw-bold">Tambah Admin Baru</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form action="/admin_master/admin/tambah" method="POST">
                <div class="modal-body">
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Nama Lengkap</label>
                        <input type="text" name="nama_lengkap" class="form-control" placeholder="Nama lengkap admin">
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Username <span class="text-danger">*</span></label>
                        <input type="text" name="username" class="form-control" required placeholder="Username untuk login">
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Role <span class="text-danger">*</span></label>
                        <select name="role" class="form-select" required>
                            <option value="">-- Pilih Role --</option>
                            <option value="admin_master">Admin Master</option>
                            <option value="admin_database">Admin Database</option>
                            <option value="admin_psb">Admin PSB</option>
                            <option value="admin_keuangan">Admin Keuangan</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Kategori</label>
                        <select name="kategori" class="form-select">
                            <option value="">Semua / Tidak ada</option>
                            <option value="putra">Putra</option>
                            <option value="putri">Putri</option>
                        </select>
                    </div>
                    <div class="alert alert-info border-0" style="font-size: 0.8rem;">
                        <i class="fas fa-info-circle me-1"></i> Password sementara akan di-generate otomatis dan ditampilkan <strong>satu kali</strong>. Admin harus ganti password saat login pertama.
                    </div>
                </div>
                <div class="modal-footer border-top">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-success"><i class="fas fa-plus me-1"></i> Tambah Admin</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Modal Edit Admin -->
<div class="modal fade" id="modalEdit" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-bottom">
                <h6 class="modal-title fw-bold">Edit Admin</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="formEdit" method="POST">
                <div class="modal-body">
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Nama Lengkap</label>
                        <input type="text" name="nama_lengkap" id="edit_nama" class="form-control">
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Username</label>
                        <input type="text" name="username" id="edit_username" class="form-control" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Role</label>
                        <select name="role" id="edit_role" class="form-select" required>
                            <option value="admin_master">Admin Master</option>
                            <option value="admin_database">Admin Database</option>
                            <option value="admin_psb">Admin PSB</option>
                            <option value="admin_keuangan">Admin Keuangan</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label fw-semibold" style="font-size: 0.85rem;">Kategori</label>
                        <select name="kategori" id="edit_kategori" class="form-select">
                            <option value="">Semua / Tidak ada</option>
                            <option value="putra">Putra</option>
                            <option value="putri">Putri</option>
                        </select>
                    </div>
                </div>
                <div class="modal-footer border-top">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-primary"><i class="fas fa-save me-1"></i> Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>

{% endblock %}

{% block extra_scripts %}
<script>
function editAdmin(admin) {
    document.getElementById('formEdit').action = '/admin_master/admin/edit/' + admin.id;
    document.getElementById('edit_nama').value = admin.nama_lengkap || '';
    document.getElementById('edit_username').value = admin.username || '';
    document.getElementById('edit_role').value = admin.role || '';
    document.getElementById('edit_kategori').value = admin.kategori || '';
    new bootstrap.Modal(document.getElementById('modalEdit')).show();
}
</script>
{% endblock %}