{% extends "core/dashboard_base.html" %}

{% block dashboard_content %}
<div class="header-bar">
    <h1 class="page-title">Dashboard</h1>
</div>

{% if error %}
<div class="alert alert-danger" role="alert">
    {{ error }}
</div>
{% endif %}

<div class="summary-cards">
    <div class="card">
        <h4>Total Pelanggan</h4>
        <p>{{ total_customers }}</p>
    </div>
    <div class="card">
        <h4>Pengguna Aktif Hotspot</h4>
        <p>{{ total_hotspot }}</p>
    </div>
    <div class="card">
        <h4>Pengguna Aktif PPPoE</h4>
        <p>{{ total_pppoe }}</p>
    </div>
</div>

<div class="customer-table-container">
    <h3 class="table-title">Daftar Pelanggan</h3>
    <div class="table-responsive">
        <table class="table">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Nama User</th>
                    <th>Mac Address</th>
                    <th>Tipe Koneksi</th>
                    <th>Paket/Profile</th>
                    <th>Tanggal Kadaluarsa</th>
                </tr>
            </thead>
            <tbody>
                {% for customer in customers %}
                <tr>
                    <td>{{ forloop.counter }}</td>
                    <td>{{ customer.name }}</td>
                    <td>{{ customer.mac_address }}</td>
                    <td>{{ customer.type }}</td>
                    <td>{{ customer.profile }}</td>
                    <td>{{ customer.comment }}</td>
                </tr>
                {% empty %}
                <tr>
                    <td colspan="6" class="text-center">Tidak ada data pelanggan yang ditemukan.</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
{% endblock %}
