{% extends '@AdminLTE/layout/suiodd-layout.html.twig' %}

{% block page_title %}{% trans %}output.indice.title{% endtrans %}{% endblock %}


{% block page_content %}
    {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
        {% block box_body %}
            {{ form_start(form) }}
                <div class="form-group row">
                    <div class="col-sm-2">
					    <label class="col-form-label">{% trans %}basics.goal{% endtrans %}</label>
				    </div>
                    <div class="col-10 col-sm-10 col-md-10">
                        {{ form_widget(form.goal) }}
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-sm-2">
					    <label class="col-form-label">{% trans %}basics.target{% endtrans %}</label>
				    </div>
                    <div class="col-10 col-sm-10 col-md-10">
                        {{ form_widget(form.target) }}
                    </div>
                </div> 
                <div class="form-group row">
				<div class="col-sm-2">
					<label class="col-form-label">{% trans %}basics.desagregation{% endtrans %}</label>
				</div>
				<div class="col-sm-5">
					{{ form_widget(form.desagregation) }}
				</div>
				<div class="col-sm-5">
					{{ form_widget(form.modalite) }}
				</div>
			</div>  
                
            {{ form_end(form) }}    
        {% endblock %}
    {% endembed %}

    {% if datas['rows'] %}
        <label class="col-form-label">Mode de calcul sélectionné : Moyenne {{settingsManager.getYear(app.session.get('_year')).moyenne}} </label>
        <div class="row">
            <div class="col-12 col-sm-12 col-md-6">
                {% embed '@AdminLTE/Widgets/infobox-widget.html.twig'  with {
                    'color' : datas['header']['statut'],
                    'icon'  : 'fas fa-map-signs',
                }%}
                    {% block box_text %} {{datas['title']}} {% endblock %}
                    {% block box_number %}
                        {% if datas['header']['indice']!='-' %}
                            {% if is_granted('ROLE_MANAGER') %}
                                Géométrique : {{ datas['header']['indiceG']|number_format(2, ',', ' ') }}   | Arithmétique : {{ datas['header']['indiceA']|number_format(2, ',', ' ') }}
                            {% else %}
                                {{ datas['header']['indice']|number_format(2, ',', ' ') }}
                            {% endif %}
                        {% else %}
                            -
                        {% endif %}
                        {#{ datas['header']['indice']|number_format(2, ',', ' ') }#}
                    {% endblock %}
                    {% block progress_description %}{% endblock %}
                {% endembed %}
            </div>
            <div class="col-12 col-sm-12 col-md-6">
                {% embed '@AdminLTE/Widgets/infobox-widget.html.twig'  with {
                    'color' : datas['header']['statut'],
                    'icon'  : 'fas fa-chart-line',
                }%}
                    {% block box_text %}Tendance globale{% endblock %}
                    {% block box_number %}
                        {% if datas['header']['trend']!='-' %}
                            <img src="{{asset('dist/img/')}}{{ datas['header']['trend'] }}.png" style="width:32px">
                        {% else %}
                            {{ datas['header']['trend'] }}
                        {% endif %}
                        {#{ datas['header']['trend'] }#}
                    {% endblock %}
                    {% block progress_description %}{% endblock %}
                {% endembed %}
            </div>
        </div>

        
        {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
            {% block box_body %}
                <table id="outputMinistryTable" class="table table-striped">
                <thead>
                    <tr>
                        <th rowspan="2">Code</th>
                        <th rowspan="2">Name</th>
                        {% if showValue %}
                        <th colspan="4">Valeurs de l’indicateur</th>
                        {% endif %}
                        <th colspan="{{ (is_granted('ROLE_MANAGER') and (not showValue)) ? 3 : 2 }}">Indice</th>
                        <th rowspan="2">Statut</th>
                        <th rowspan="2">Trend</th>
                    </tr>
                    <tr>
                        {% if showValue %}
                        <th style="width: 60px">Réf.</th>
                        <th style="width: 60px">Réc.</th>
                        <th style="width: 60px">Min.</th>
                        <th style="width: 60px">Cible</th>
                        {% endif %}
                        {% if (is_granted('ROLE_MANAGER') and (not showValue)) %}
                            <th style="width: 60px">Réf.</th>
                            <th style="width: 140px">Réc. Géométrique</th>
                            <th style="width: 140px">Réc. Arithmétique</th>
                        {% else %}
                            <th style="width: 60px">Réf.</th>
                            <th style="width: 60px">Réc.</th>
                        {% endif %}
                    </tr>
                </thead>
                {% for row in datas['rows'] %}
                <tr>
                    <td>{{ row['code'] }}</td>
                    <td>{{ row['name'] }}</td>
                    {% if showValue %}
                    <td class="text-center">{{ row['refValue'] }}<br>({{ row['refYear'] }})</td>
                    <td class="text-center">{{ row['recValue'] }}<br>({{ row['recYear'] }})</td>
                    <td class="text-center">{{ row['minValue'] }}</td>
                    <td class="text-center">{{ row['maxValue'] }}</td>
                    {% endif %}
                    {% if (is_granted('ROLE_MANAGER') and (not showValue)) %}
                        <td class="text-center">{{ row['refIndice'] }}</td>
                        <td class="text-center">{{ row['recIndiceG'] }}</td>
                        <td class="text-center">{{ row['recIndiceA'] }}</td>
                    {% else %}
                        <td class="text-center">{{ row['refIndice'] }}</td>
                        <td class="text-center">{{ row['recIndice'] }}</td>
                    {% endif %}
                    
                    <td class="text-center">
                        {% if row['statut']!='-' %}
                            <i class="nav-icon fas fa-circle text-{{ row['statut'] }}"></i>
                        {% else %}
                            {{ row['statut'] }}
                        {% endif %}
                    </td>
                    <td class="text-center">
                        {% if row['trend']!='-' %}
                            <img src="{{asset('dist/img/')}}{{ row['trend'] }}.png" style="width:24px">
                        {% else %}
                            {{ row['trend'] }}
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}
                </table>
            {% endblock %}

            {% block box_footer %}
            <form name="output_ministry_export" method="post" action="{{ path('app_output_indice_export') }}">
                <input type="hidden" name="datas" value="{{ datas | json_encode() }}"/>
                <div class="row">
                    <div class="col-sm-3">
                        <button type="submit" class="btn btn-block btn-primary">{% trans %}basics.export{% endtrans %}</button>
                    </div>
                    <div class="col-sm-9"></div>
                </div>
            </form>
            {% endblock %}
        {% endembed %}

    {% endif %}




{% if is_granted('ROLE_MANAGER') %}
    {% if datas['rows'] %}
        <label class="col-form-label">Indice global </label>
        <div class="row">
            <div class="col-12 col-sm-12 col-md-6">
                {% embed '@AdminLTE/Widgets/infobox-widget.html.twig'  with {
                    'color' : datas['header']['statut'],
                    'icon'  : 'fas fa-map-signs',
                }%}
                    {% block box_text %} {{datas['title']}} {% endblock %}
                    {% block box_number %}
                        {% if datas['header']['indice']!='-' %}
                                {{ datas['header']['indice']|number_format(2, ',', ' ') }}
                        {% else %}
                            -
                        {% endif %}
                        {#{ datas['header']['indice']|number_format(2, ',', ' ') }#}
                    {% endblock %}
                    {% block progress_description %}{% endblock %}
                {% endembed %}
            </div>
            <div class="col-12 col-sm-12 col-md-6">
                {% embed '@AdminLTE/Widgets/infobox-widget.html.twig'  with {
                    'color' : datas['header']['statut'],
                    'icon'  : 'fas fa-chart-line',
                }%}
                    {% block box_text %}Tendance globale{% endblock %}
                    {% block box_number %}
                        {% if datas['header']['trend']!='-' %}
                            <img src="{{asset('dist/img/')}}{{ datas['header']['trend'] }}.png" style="width:32px">
                        {% else %}
                            {{ datas['header']['trend'] }}
                        {% endif %}
                        {#{ datas['header']['trend'] }#}
                    {% endblock %}
                    {% block progress_description %}{% endblock %}
                {% endembed %}
            </div>
        </div>

        
        {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
            {% block box_body %}
                <table id="outputMinistryTable" class="table table-striped">
                <thead>
                    <tr>
                        <th rowspan="2">Code</th>
                        <th rowspan="2">Name</th>
                        {% if showValue %}
                        <th colspan="4">Valeurs de l’indicateur</th>
                        {% endif %}
                        <th colspan="2">Indice</th>
                        <th rowspan="2">Statut</th>
                        <th rowspan="2">Trend</th>
                    </tr>
                    <tr>
                        {% if showValue %}
                        <th style="width: 60px">Réf.</th>
                        <th style="width: 60px">Réc.</th>
                        <th style="width: 60px">Min.</th>
                        <th style="width: 60px">Cible</th>
                        {% endif %}
                            <th style="width: 60px">Réf.</th>
                            <th style="width: 60px">Réc.</th>
                    </tr>
                </thead>
                {% for row in datas['rows'] %}
                <tr>
                    <td>{{ row['code'] }}</td>
                    <td>{{ row['name'] }}</td>
                    {% if showValue %}
                    <td class="text-center">{{ row['refValue'] }}<br>({{ row['refYear'] }})</td>
                    <td class="text-center">{{ row['recValue'] }}<br>({{ row['recYear'] }})</td>
                    <td class="text-center">{{ row['minValue'] }}</td>
                    <td class="text-center">{{ row['maxValue'] }}</td>
                    {% endif %}
                        <td class="text-center">{{ row['refIndice'] }}</td>
                        <td class="text-center">{{ row['recIndice'] }}</td>
                    
                    <td class="text-center">
                        {% if row['statut']!='-' %}
                            <i class="nav-icon fas fa-circle text-{{ row['statut'] }}"></i>
                        {% else %}
                            {{ row['statut'] }}
                        {% endif %}
                    </td>
                    <td class="text-center">
                        {% if row['trend']!='-' %}
                            <img src="{{asset('dist/img/')}}{{ row['trend'] }}.png" style="width:24px">
                        {% else %}
                            {{ row['trend'] }}
                        {% endif %}
                    </td>
                </tr>
                {% endfor %}
                </table>
            {% endblock %}

            {% block box_footer %}
            <form name="output_ministry_export" method="post" action="{{ path('app_output_indice_export') }}">
                <input type="hidden" name="datas" value="{{ datas | json_encode() }}"/>
                <div class="row">
                    <div class="col-sm-3">
                        <button type="submit" class="btn btn-block btn-primary">{% trans %}basics.export{% endtrans %}</button>
                    </div>
                    <div class="col-sm-9"></div>
                </div>
            </form>
            {% endblock %}
        {% endembed %}

    {% endif %}
{% endif %}


{% endblock %}

{% block javascripts %}
    <script>
        $(function () {
            $("#outputMinistryTable").DataTable({
                "searching": false,
                "pageLength": 25,
                "lengthChange": false
            });
        });
    </script>

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

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