{# templates/entreprise/appartement/index.html.twig #}
{% extends 'entreprise/entreprise_base.html.twig' %}

{% block title %}Gestion des Appartements | {{ entreprise.raisonSociale|default('Mon Bureau') }}{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('assets/css/theme-entreprise-dashboard.css') }}" type="text/css" rel="stylesheet" id="style-default" />
{% endblock %}

{% block body %}
    
    {% set plan = (abonnementActuel and abonnementActuel.abonnement) ? abonnementActuel.abonnement : null %}
    {% set isExpired = (abonnementActuel is null or not abonnementActuel.isActive()) %}
    {% set totalApparts = appartements|length %}
    {% set quotaAppartAtteint = (plan and plan.limiteAppartement > 0 and totalApparts >= plan.limiteAppartement) %}
    
    {% set canModify = (not isExpired) %}
    {% set canAddAppart = (not isExpired and not quotaAppartAtteint) %}
    {% set targetImmeubleId = immeubleSelectionne.id ?? (immeubles|first).id ?? null %}

    <div class="container-fluid py-4 px-md-4">
        
        {# --- EN-TÊTE --- #}
        <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-3">
            <div>
                <h3 class="page-header page-header-top mb-1">
                    {% if immeubleSelectionne %}
                        Appartements du {{ immeubleSelectionne.titre }}
                    {% else %}
                        Tous les Appartements
                    {% endif %}

                    <span class="ms-2 badge bg-light text-dark border" style="font-size:12px">
                        <strong>{{ totalApparts }}</strong> / {{ (plan and plan.limiteAppartement > 0) ? plan.limiteAppartement : 'illimité' }}
                    </span>
                </h3>
                <p class="text-muted small mb-0 page-description">Gérez vos unités locatives et leur ordre d'affichage.</p>
            </div>
            
            <div>
                {% if is_granted('ROLE_ENTREPRISE_COLLAB') %}
                    <a href="{{ canAddAppart ? path('app_entreprise_appartement_new', {'id_immeuble': targetImmeubleId}) : path('app_entreprise_abonnement_plans') }}" 
                       class="btn btn-success shadow-sm px-4 loyer-express-btn {{ not canAddAppart ? 'disabled opacity-50' : '' }}">
                        <i class="fas {{ not canAddAppart ? 'fa-lock' : 'fa-plus' }} me-1"></i> Nouvel Appartement
                    </a>
                {% endif %}
            </div>
        </div>

        {# --- BARRE DE FILTRE (Style Locataire appliqué) --- #}
        <div class="card shadow-sm p-3 mb-4 card-filter border-0" style="background-color: #f8f9fa;">
            <form method="GET" action="{{ path('app_entreprise_appartement_index') }}" class="row g-2">
                <div class="col-md-5">
                    <div class="input-group">
                        <span class="input-group-text bg-white border-end-0 text-muted"><i class="fas fa-search"></i></span>
                        <input type="search" name="q" class="form-control border-start-0 shadow-none" 
                               placeholder="Rechercher par titre (ex: Appart B4)..." 
                               value="{{ app.request.query.get('q') }}">
                    </div>
                </div>
                <div class="col-md-3">
                    <select name="immeubleId" class="form-select border-light-subtle shadow-none">
                        <option value="">-- Tous les lots --</option>
                        {% for immeuble in immeubles %}
                            <option value="{{ immeuble.id }}" {% if immeubleSelectionne and immeubleSelectionne.id == immeuble.id %}selected{% endif %}>
                                {{ immeuble.titre }}
                            </option>
                        {% endfor %}
                    </select>
                </div>
                <div class="col-md-2">
                    <button type="submit" class="btn btn-success w-100 loyer-express-btn">
                        Filtrer
                    </button>
                </div>
                <div class="col-md-2">
                    <a href="{{ path('app_entreprise_appartement_index') }}" class="btn btn-outline-secondary w-100 loyer-express-btn">Effacer</a>
                </div>
            </form>
        </div>

        {% include 'flash_messages.html.twig' %}

        {# --- LISTE DES APPARTEMENTS --- #}
        {% if appartements is empty %}
            <div class="card shadow-sm border-0 py-5 text-center">
                <div class="card-body">
                    <i class="fas fa-search fa-4x mb-3 text-light"></i>
                    <h4 class="text-muted">Aucun appartement trouvé</h4>
                    <p class="text-secondary small">Ajustez vos filtres ou créez un nouvel appartement.</p>
                </div>
            </div>
        {% else %}
            <div class="row g-2 p-2 rounded" style="background-color:#fafafa">
                {% for item in appartements %}
                    {% set appartement = item.appartement %}
                    {% set currentLoyer = item.currentLoyer %}
                    
                    <div class="col-12">
                        <div class="card card-custom shadow-sm border-0 p-2 mb-1">
                            <div class="card-body d-flex align-items-center p-2">
                                
                                {# 1. ORDRE (Uniquement si filtré par lot et sans recherche textuelle pour éviter les conflits logiques) #}
                                {% if immeubleSelectionne and not app.request.query.get('q') %}
                                <div class="order-control d-flex flex-column align-items-center me-3 py-2 px-1 rounded border bg-white">
                                    {% if not loop.first %}
                                        <a href="{{ canModify ? path('app_entreprise_appartement_move', {'id_immeuble': immeubleSelectionne.id, 'id': appartement.id, 'direction': 'up'}) : '#' }}" class="btn-move">
                                            <i class="fas fa-chevron-up"></i>
                                        </a>
                                    {% else %}
                                        <span class="btn-move invisible"><i class="fas fa-chevron-up"></i></span>
                                    {% endif %}
                                    
                                    <span class="small fw-bold my-1">{{ appartement.ordre }}</span>
                                    
                                    {% if not loop.last %}
                                        <a href="{{ canModify ? path('app_entreprise_appartement_move', {'id_immeuble': immeubleSelectionne.id, 'id': appartement.id, 'direction': 'down'}) : '#' }}" class="btn-move">
                                            <i class="fas fa-chevron-down"></i>
                                        </a>
                                    {% else %}
                                        <span class="btn-move invisible"><i class="fas fa-chevron-down"></i></span>
                                    {% endif %}
                                </div>
                                {% endif %}

                                {# 2. INFOS APPARTEMENT #}
                                <div class="flex-grow-1">
                                    <h5 class="fw-bold mb-1 bien-titre">
                                        <a href="{{ path('app_entreprise_appartement_show', {'id_immeuble': appartement.immeuble.id, 'id': appartement.id}) }}" class="text-decoration-none text-dark hover-green">
                                            {{ appartement.titre }}
                                        </a>
                                    </h5>
                                    <div class="d-flex align-items-center flex-wrap gap-2">
                                        {% if not immeubleSelectionne %}
                                            <span class="badge bg-soft-success text-success border-0 px-2">
                                                <i class="fas fa-city me-1"></i> {{ appartement.immeuble.titre }}
                                            </span>
                                        {% endif %}
                                        <span class="badge-info-custom">
                                            <i class="fas fa-th-large me-1"></i> {{ appartement.nbrePieces|default(0) }} pièces
                                        </span>
                                        <span class="badge-info-custom">
                                            <i class="fas fa-bath me-1"></i> {{ appartement.nbreSalleBain|default(0) }} SdB
                                        </span>
                                    </div>
                                </div>

                                {# 3. BLOC LOYER #}
                                <div class="loyer-wrapper text-center mx-3 d-none d-md-block shadow-sm bg-white rounded p-2 border">
                                    <div class="small text-muted text-uppercase fw-bold" style="font-size: 8px;">Loyer Mensuel</div>
                                    <div class="h6 mb-0 fw-bold text-success">
                                        {{ currentLoyer and currentLoyer.montantLoyer ? currentLoyer.montantLoyer|format_money : 'N/D' }}
                                    </div>
                                </div>

                                {# 4. ACTIONS #}
                                <div class="d-flex align-items-center gap-2 ms-auto">
                                    <a href="{{ path('app_entreprise_appartement_show', {'id_immeuble': appartement.immeuble.id, 'id': appartement.id}) }}" 
                                       class="btn btn-sm btn-outline-success border-2 fw-bold px-3 d-none d-lg-inline-block">
                                        Détails
                                    </a>

                                    <div class="btn-group">
                                        <button class="btn btn-sm btn-light border dropdown-toggle shadow-sm" type="button" data-bs-toggle="dropdown">
                                            <i class="fas fa-ellipsis-v text-muted"></i>
                                        </button>
                                        <ul class="dropdown-menu dropdown-menu-end shadow border-0">
                                            <li>
                                                <a class="dropdown-item" href="{{ path('app_entreprise_appartement_show', {'id_immeuble': appartement.immeuble.id, 'id': appartement.id}) }}">
                                                    <i class="fas fa-eye me-2 text-default"></i> Voir la fiche
                                                </a>
                                            </li>
                                            {% if is_granted('ROLE_ENTREPRISE_COLLAB') %}
                                                <li>
                                                    <a class="dropdown-item {{ not canModify ? 'disabled opacity-50' : '' }}" 
                                                       href="{{ canModify ? path('app_entreprise_appartement_edit', {'id_immeuble': appartement.immeuble.id, 'id': appartement.id}) : '#' }}">
                                                        <i class="fas fa-pencil-alt me-2 text-default"></i> Modifier
                                                    </a>
                                                </li>
                                                <li><hr class="dropdown-divider"></li>
                                                <li>
                                                    <form method="post" action="{{ path('app_entreprise_appartement_delete', {'id_immeuble': appartement.immeuble.id, 'id': appartement.id}) }}" 
                                                          onsubmit="return confirm('Confirmer la suppression ?');">
                                                        <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ appartement.id) }}">
                                                        <button class="dropdown-item text-danger {{ not canModify ? 'disabled' : '' }}">
                                                            <i class="fas fa-trash-alt me-2"></i> Supprimer
                                                        </button>
                                                    </form>
                                                </li>
                                            {% endif %}
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            </div>
        {% endif %}
    </div>
{% endblock %}