{# templates/admin/projet/index.html.twig #}
{% extends 'layouts/admin_layout.html.twig' %}

{% block title %}Gestion des Projets {% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <style>
        /* Rend la ligne entière cliquable visuellement */
        .clickable-row { cursor: pointer; transition: background-color 0.2s; }
        .clickable-row:hover { background-color: rgba(44, 123, 229, 0.05) !important; }
        .progress-thin { height: 6px; border-radius: 10px; }
        
        /* Style pour les icônes d'aide dans le tableau */
        .help-tooltip {
            font-size: 0.75rem;
            color: #adb5bd;
            margin-left: 4px;
            cursor: help;
        }
        .help-tooltip:hover { color: #0d6efd; }
    </style>
{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h3 class="page-header page-header-top mb-0">Programmes Immobiliers</h3>
            <p class="text-muted small mb-0">Pilotage du catalogue des promotions et inventaires.</p>
        </div>
        <a href="{{ path('app_admin_projet_new') }}" class="btn btn-login shadow-sm show-loader">
            <i class="fas fa-plus me-2"></i>Nouveau Projet
        </a>
    </div>

<div class="card border-0 shadow-sm">
    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
            <thead class="bg-light">
                <tr>
                    <th class="ps-4" style="width: 80px;">Visuel</th>
                    <th>Projet & Type</th>
                    <th>Localisation</th>
                    <th>
                        Statut Foncier
                        <i class="fa-solid fa-circle-question help-tooltip" 
                           data-bs-toggle="tooltip" 
                           title="État juridique du terrain (ACD, Titre Foncier, etc.)"></i>
                    </th>
                    <th class="pe-4">
                        Inventaire & Ventes
                        <i class="fa-solid fa-circle-question help-tooltip" 
                           data-bs-toggle="tooltip" 
                           title="Progression des ventes basée sur le nombre de lots vendus ou livrés."></i>
                    </th>
                </tr>
            </thead>
            <tbody>
                {% for projet in projets %}
                {% set detailUrl = path('app_admin_projet_show', {'id': projet.id}) %}
                
                <tr class="clickable-row show-loader" onclick="window.location='{{ detailUrl }}'">
                    <td class="ps-4">
                        <div class="rounded border d-flex align-items-center justify-content-center bg-light shadow-sm overflow-hidden" 
                             style="width: 60px; height: 60px;">
                            {% if projet.imagePrincipale %}
                                <img src="{{ asset('uploads/projets/' ~ projet.imagePrincipale) }}" 
                                     alt="{{ projet.nom }}" 
                                     class="w-100 h-100 object-fit-cover">
                            {% else %}
                                <i class="fas fa-image text-secondary opacity-50 fa-lg"></i>
                            {% endif %}
                        </div>
                    </td>
                    <td>
                        <div class="fw-bold text-dark">{{ projet.nom }}</div>
                        <div class="d-flex gap-1 mt-1">
                            {% if projet.typeBusiness %}
                                {% set type_class = projet.typeBusiness.value == 'PROMOTION' ? 'bg-info-subtle text-info' : 'bg-success-subtle text-success' %}
                                <span class="badge {{ type_class }} small" style="font-size: 0.7rem;">
                                    <i class="fas {{ projet.typeBusiness.value == 'PROMOTION' ? 'fa-building' : 'fa-home' }} me-1"></i>
                                    {{ projet.typeBusiness.getLabel() }}
                                </span>
                            {% endif %}
                        </div>
                    </td>
                    <td>
                        <div class="small">
                            <i class="fas fa-map-marker-alt text-danger me-1"></i>
                            <span class="fw-medium text-dark">{{ projet.localisationVille }}</span>, 
                            <span class="text-muted">{{ projet.localisationCommune }}</span>
                        </div>
                    </td>
                    <td>
                        <span class="badge bg-light text-dark border fw-normal">
                            {{ projet.statutFoncier ? projet.statutFoncier.getLabel() : 'Non défini' }}
                        </span>
                        {# Aide spécifique pour les statuts sensibles #}
                        {% if projet.statutFoncier and projet.statutFoncier.value == 'EN_COURS' %}
                             <i class="fa-solid fa-clock-rotate-left text-warning ms-1 open-help" 
                                style="cursor:pointer;"
                                data-help="Le dossier foncier est actuellement en cours d'instruction dans les services ministériels."></i>
                        {% endif %}
                    </td>
                    <td class="pe-4" style="min-width: 200px;">
                        {% set totalLots = projet.lots|length %}
                        {% set vendus = projet.lots|filter(l => l.statut.value == 'VENDU' or l.statut.value == 'LIVRE')|length %}
                        {% set pourcentageVente = totalLots > 0 ? (vendus / totalLots * 100) : 0 %}

                        <div class="d-flex justify-content-between align-items-center mb-1">
                            <span class="small fw-bold text-dark">{{ vendus }} / {{ totalLots }} vendus</span>
                            <span class="text-muted small" style="font-size: 0.75rem;">{{ pourcentageVente|number_format(0) }}%</span>
                        </div>
                        
                        <div class="progress progress-thin" style="background-color: #eee;">
                            <div class="progress-bar bg-success" role="progressbar" 
                                 style="width: {{ pourcentageVente }}%" 
                                 aria-valuenow="{{ pourcentageVente }}" aria-valuemin="0" aria-valuemax="100">
                            </div>
                        </div>

                        {% set reserves = projet.lots|filter(l => l.statut.value == 'RESERVE')|length %}
                        {% if reserves > 0 %}
                            <div class="mt-1 d-flex align-items-center" style="font-size: 0.7rem; color: #fd7e14;">
                                <i class="fas fa-info-circle me-1"></i> {{ reserves }} réservé(s)
                                <i class="fa-solid fa-circle-question help-tooltip" 
                                   data-bs-toggle="tooltip" 
                                   title="Les lots réservés sont en attente de validation du premier versement."></i>
                            </div>
                        {% endif %}
                    </td>
                </tr>
                {% else %}
                <tr>
                    <td colspan="5" class="text-center py-5">
                        <div class="text-muted">
                            <i class="fas fa-folder-open fa-3x mb-3 opacity-25"></i>
                            <p>Aucun projet n'a été créé pour le moment.</p>
                            <a href="{{ path('app_admin_projet_new') }}" class="btn btn-sm btn-primary">Créer le premier projet</a>
                        </div>
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
{% endblock %}