{% extends 'frontend/layout.html.twig' %}

{% block content %}
<div class="container single-template">
    <div class="page-header">
			<h1 class="page-title">
				Télécharger les rapports nationaux sur les ODD
			</h1>
		</div>


    <table id="documentTable" class="table table-striped">
            <thead>
                <th>Année</th>
                <th>{% trans %}basics.title{% endtrans %}</th>
                <th>Fichier</th>
            </thead>
            <tbody>
            {% for rapport in rapports %}
                {% if rapport.rapportSuivi %}
                <tr>
                    <td><div class="text-center">{{ rapport.name}}</div></td>
                    <td>Rapport du suivi de la mise en oeuvre des ODD</td>
                    <td>
                        <a href="{{asset('upload/rapports/')}}{{rapport.rapportSuivi}}">
                            <img src="{{ asset('dist/img/icon/pdf.png') }}" height="32px">
                        </a>    
                    </td>
                </tr>
                {% endif %}
                {% if rapport.rapportIndicateurs %}
                <tr>
                    <td><div class="text-center">{{ rapport.name }}</div></td>
                     <td>Rapport national des indicateurs des ODD</td>
                    <td>
                        <a href="{{asset('upload/rapports/')}}{{rapport.rapportIndicateurs}}">
                            <img src="{{ asset('dist/img/icon/pdf.png') }}" height="32px">
                        </a> 
                    </td>
                </tr>
                {% endif %}
            {% endfor %}
            </tbody>
            </table>
</div>
{% endblock %}

{% block js %}
    <script src="{{ asset('plugins/jquery/jquery.min.js') }}"></script>
    <script>
        $(function () {
            $("#documentTable").DataTable({
                "pageLength": 25
            });
        });
    </script>

    <script src="{{ asset('plugins/datatables/jquery.dataTables.js') }}"></script>
    <script src="{{ asset('plugins/datatables-bs4/js/dataTables.bootstrap4.js') }}"></script>
{% endblock %}

{% block css %}
    <link rel="stylesheet" href="{{ asset('plugins/datatables-bs4/css/dataTables.bootstrap4.css') }}">
{% endblock %}