{# -*- mode: jinja-html -*- #}
{% extends 'base.j2' %}

{% block styles %}
{{super()}}
<script src="/ScoDoc/static/jQuery/jquery-1.12.4.min.js"></script>
<link rel="stylesheet" type="text/css" href="/ScoDoc/static/DataTables/datatables.min.css">
<script type="text/javascript" charset="utf8" src="/ScoDoc/static/DataTables/datatables.min.js"></script>
{% endblock %}

{% block app_content %}
<div class="container">
    <ul class="breadcrumbs">
        <li class="breadcrumbs_item">
            <a href="{{ url_for('entreprises.index') }}" class="breadcrumbs_link">Entreprises</a>
        </li>
        <li class="breadcrumbs_item">
            <a href="{{ url_for('entreprises.fiche_entreprise', entreprise_id=entreprise.id) }}"
                class="breadcrumbs_link">Fiche entreprise</a>
        </li>
        <li class="breadcrumbs_item">
            <a href="" class="breadcrumbs_link breadcrumbs_link-active">Contacts</a>
        </li>
    </ul>
</div>

<div class="container" style="margin-bottom: 10px;">
    <h1>Liste des contacts</h1>
    {% if current_user.has_permission(current_user.Permission.RelationsEntreprisesChange, None) %}
    <a class="btn btn-primary" style="margin-bottom:10px;"
        href="{{ url_for('entreprises.add_contact', entreprise_id=entreprise.id) }}">Ajouter contact</a>
    {% endif %}
    <table id="table-contacts">
        <thead>
            <tr>
                <td data-priority="">Date</td>
                <td data-priority="">Utilisateur</td>
                <td data-priority="">Notes</td>
                {% if current_user.has_permission(current_user.Permission.RelationsEntreprisesChange, None) %}
                <td data-priority="">Action</td>
                {% endif %}
            </tr>
        </thead>
        <tbody>
            {% for contact in contacts %}
            <tr>
                <td>{{ contact.date.strftime('%d/%m/%Y %Hh%M') }}</td>
                <td>{{ contact.user|get_nomcomplet_by_id }}</td>
                <td>{{ contact.notes }}</td>
                {% if current_user.has_permission(current_user.Permission.RelationsEntreprisesChange, None) %}
                <td>
                    <div class="btn-group">
                        <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">Action
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu pull-left">
                            <li><a
                                    href="{{ url_for('entreprises.edit_contact', entreprise_id=entreprise.id, contact_id=contact.id) }}">Modifier</a>
                            </li>
                            <li><a href="{{ url_for('entreprises.delete_contact', entreprise_id=entreprise.id, contact_id=contact.id) }}"
                                    style="color:red">Supprimer</a></li>
                        </ul>
                    </div>
                </td>
                {% endif %}
            </tr>
            {% endfor %}
        </tbody>
        <tfoot>
            <tr>
                <td>Date</td>
                <td>Utilisateur</td>
                <td>Notes</td>
                {% if current_user.has_permission(current_user.Permission.RelationsEntreprisesChange, None) %}
                <td>Action</td>
                {% endif %}
            </tr>
        </tfoot>
    </table>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        let table = new DataTable('#table-contacts',
            {
                "autoWidth": false,
                "responsive": {
                    "details": true
                },
                "pageLength": 10,
                "language": {
                    "emptyTable": "Aucune donnée disponible dans le tableau",
                    "info": "Affichage de _START_ à _END_ sur _TOTAL_ entrées",
                    "infoEmpty": "Affichage de 0 à 0 sur 0 entrées",
                    "infoFiltered": "(filtrées depuis un total de _MAX_ entrées)",
                    "lengthMenu": "Afficher _MENU_ entrées",
                    "loadingRecords": "Chargement...",
                    "processing": "Traitement...",
                    "search": "Rechercher:",
                    "zeroRecords": "Aucune entrée correspondante trouvée",
                    "paginate": {
                        "next": "Suivante",
                        "previous": "Précédente"
                    }
                }
            });
    });
</script>
{% endblock %}