{% extends 'base.html.twig' %}

{% block title %}{{TitrePage}}{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href={{ asset('assets/css/style.css')  }}>
<link rel="stylesheet" href={{ asset('assets/css/contact/style.css')  }}>
<link rel="stylesheet" href={{ asset('assets/css/contact/navTop.css')  }}>
<link rel="stylesheet" href={{ asset('assets/css/contact/navMiddle.css')  }}>
<link rel="stylesheet" href={{ asset('assets/css/contact/index.css')  }}>
<link rel="stylesheet" href={{ asset('assets/css/contact/search.css')  }}>
{% endblock %}
{% block menuTop %}
<div class="">
    {{ include('contact/_menuTop.html.twig') }}
</div>
{% endblock %}
{% block menuMiddle %}
<div class="fixed">
    {{ include('contact/_menuMiddle.html.twig') }}
</div>
{% endblock %}
{% block body %}

<div class="container-fluid first">
    <div class="row">
        <div class="col-12 ">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-4">
                        <div class="dropdown">
                            <button class="btn btn-primary dropdown-toggle" type="button" data-bs-toggle="dropdown"
                                aria-expanded="false">
                                <i class="fa-solid fa-plus"></i>
                            </button>
                            <ul class="dropdown-menu">
                                <li>
                                    <a class=" colorContact dropdown-item" href="#" data-bs-toggle="modal"
                                        data-bs-target="#addContactModal">
                                        Ajout Contact
                                    </a>
                                </li>
                                <li>
                                    <a class="colorContact dropdown-item" href="#"data-bs-toggle="modal"
                                        data-bs-target="#addProfessionModal">
                                        Ajout Profession
                                    </a>
                                </li>
                                <li>
                                    <a class=" colorContact dropdown-item" href="#"data-bs-toggle="modal"
                                        data-bs-target="#addStadeModal">
                                        Ajout stade
                                    </a>
                                </li>
                                 <li>
                                    <a class=" colorContact dropdown-item" href="#"data-bs-toggle="modal"
                                        data-bs-target="#addStatutContactModal">
                                        Ajout statut
                                    </a>
                                </li>
                            </ul>
                        </div>
                        {{ include('contact/new/_newContactModal.html.twig') }}
                        {{ include('contact/new/_newProfessionModal.html.twig') }}
                        {{ include('contact/new/_newStadeModal.html.twig') }}
                        {{ include('contact/new/_newStatutContactModal.html.twig') }}
                        
                    </div>
                    <div class="col-8 ">
                        <div class="row">
                            <div class="col-10">
                                {{ include('contact/_search.html.twig') }}
                            </div>
                            <div class="col-2">
                                {{ include('contact/_filterModal.html.twig') }}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col d-flex">
                        <p class="count">
                            {{ contacts is defined and contacts|length > 0 ? contacts|length ~ ' contacts' : 'Aucun contact' }}
                        </p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col d-flex">
                    {# Récupérer l'URL courante #}
                    {% set currentUrl = app.request.requestUri %}
                    {% if currentUrl == "/contact/active"  %}
                    <a href={{ path('app_contact_index') }}>
                        <img src={{ asset('assets/squareContactCross.png') }} alt="" class="img-fluid cross">
                    </a>
                    {% else %}
                    <a href={{ path('app_contact_index_active') }}>
                        <img src={{ asset('assets/squareContact.png') }} alt="" class="img-fluid cross">
                    </a>
                    {% endif %}
                    {{ include('contact/_tableau.html.twig') }}
                </div>
            </div>
        </div>





        {% endblock %}