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

{% block stylesheets%}
    
    {{ parent() }}

    <link href="{{ asset('template/css/plugins/footable/footable.core.css') }}" rel="stylesheet">

{% endblock %}

{% block breadcrumb %}
    <ol class="breadcrumb">
        <li>
            <a href="#">Messagerie</a>
        </li>
        <li class="active">
            <strong> Messages envoy&eacute;s</strong>
        </li>
    </ol>
{% endblock %}



{% block body %}
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5> Historique des messages envoy&eacute;s</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                </div>
            </div>
            <div class="ibox-content col-lg-12">
                <input type="text" class="form-control input-sm m-b-xs" id="filter"
                                       placeholder="Rechercher">
                <table class="footable table table-stripped" data-page-size="8" data-filter=#filter>
                                    <thead>
                                        <tr>
                                            <th>Destinataire</th>
                                            <th>Message</th>
                                            <th>Date</th>
                                            <th>Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for mt in outbox %}
                                        <tr>
                                            <td> {{ mt.phonebook }} </td>
                                            <td> {{ mt.content }} </td>
                                            <td> {{ mt.sentAt|date('d/m/Y H:i:s') }} </td>
                                            <td> {{ mt.status }} </td>
                                        </tr>
                                        {% endfor %}
                                    </tbody>
                                    <tfoot>
                                        <tr>
                                            <td colspan="5">
                                                <ul class="pagination pull-right"></ul>
                                            </td>
                                        </tr>
                                    </tfoot>
                </table>
            </div>
        </div>
    </div>
{% endblock %}


{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('template/js/plugins/footable/footable.all.min.js') }}"></script>

    <script>
        $(document).ready(function() {

            $('.footable').footable();

        });

    </script>
{% endblock %}