{% extends 'base.html' %}

{% block title %}Dashboard - Finance Hub{% endblock %}

{% block content %}


<!-- KPI Cards -->
<div class="row">
    <div class="col-md-3 mb-3">
        <div class="card kpi-card">
            <div class="card-body">
                <h5 class="card-title">Totale Clienti</h5>
                <p class="display-4">{{ kpi_data.total_clients }}</p>
            </div>
        </div>
    </div>
    <div class="col-md-3 mb-3">
        <div class="card kpi-card">
            <div class="card-body">
                <h5 class="card-title">Totale Portafogli</h5>
                <p class="display-4">{{ kpi_data.total_portfolios }}</p>
            </div>
        </div>
    </div>
    <div class="col-md-3 mb-3">
        <div class="card kpi-card">
            <div class="card-body">
                <h5 class="card-title">Totale Attività</h5>
                <p class="display-4">{{ kpi_data.total_activities }}</p>
            </div>
        </div>
    </div>
    <div class="col-md-3 mb-3">
        <div class="card kpi-card">
            <div class="card-body">
                <h5 class="card-title">Totale Documenti</h5>
                <p class="display-4">{{ kpi_data.total_documents }}</p>
            </div>
        </div>
    </div>
</div>

<!-- Widget Grid -->
<div class="row mt-4">
    <div class="col-md-6 mb-4">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                Clienti Recenti
                <a href="{% url 'client_list' %}" class="btn btn-sm btn-outline-primary">Vedi Tutti</a>
            </div>
            <div class="card-body">
                {% if recent_clients %}
                <ul class="list-group list-group-flush">
                    {% for client in recent_clients %}
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        {{ client.name }} {{ client.surname }}
                        <a href="{% url 'client_detail' client.pk %}" class="btn btn-sm btn-light">Dettagli</a>
                    </li>
                    {% endfor %}
                </ul>
                {% else %}
                <p class="text-muted">Nessun cliente recente.</p>
                {% endif %}
            </div>
        </div>
    </div>
    <div class="col-md-6 mb-4">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                Attività Recenti
                <a href="{% url 'activity_list' %}" class="btn btn-sm btn-outline-primary">Vedi Tutte</a>
            </div>
            <div class="card-body">
                {% if recent_activities %}
                <ul class="list-group list-group-flush">
                    {% for activity in recent_activities %}
                    <li class="list-group-item d-flex justify-content-between align-items-center">
                        <div>
                            <strong>{{ activity.title }}</strong><br>
                            <small class="text-muted">{{ activity.client }} - {{ activity.activity_date|date:"d M Y" }}</small>
                        </div>
                        <a href="{% url 'activity_detail' activity.pk %}" class="btn btn-sm btn-light">Dettagli</a>
                    </li>
                    {% endfor %}
                </ul>
                {% else %}
                <p class="text-muted">Nessuna attività recente.</p>
                {% endif %}
            </div>
        </div>
    </div>
</div>
{% endblock %}
