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

{% block title %}Consultation d'un professionnel{% endblock %}

{% block body %}

    <div class="tab-lister-professionnel">

        <H1>Information sur le professionnel {{ professionnel.nom }}</H1>

        <!-- DataTales Example -->
        <div class="card shadow mb-4">
            <div class="card-header py-3">
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                        <thead>

                        <tr>
                            <td>Nom : </td><td>{{ professionnel.nom }}</td>
                        </tr>
                        <tr>
                            <td>Numéro de rue : </td><td>{{ professionnel.numRue }}</td>
                        </tr>
                        <tr>
                            <td>Rue : </td><td>{{ professionnel.rue }}</td>
                        </tr>
                        <tr>
                            <td>Code postal : </td><td>{{ professionnel.copos }}</td>
                        </tr>
                        <tr>
                            <td>Ville : </td><td>{{ professionnel.ville }}</td>
                        </tr>
                        <tr>
                            <td>Email : </td><td>{{ professionnel.mail }}</td>
                        </tr>
                        <tr>
                            <td> Métiers : </td>
                            <td>
                                {% if metiers is defined %}
                                  {% for m in metiers %}
                                    {{ m.libelle|upper }}
                                      {{ '/' }}
                                {% else %}

                            </td>
                            <tr>
                                <th>Aucun métier n'a été trouvé.</th>
                            </tr>
                        {% endfor %}
                        {% endif %}
                        </tr>
                        </thead>
                        <tfoot>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>

    </div>

{% endblock %}