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

    {% block stylesheets %}
        {{ encore_entry_link_tags('app') }}
    {% endblock %}

    {% block javascripts_header %}
        {{ encore_entry_script_tags('app') }}
        {{ encore_entry_script_tags('rapport') }}
    {% endblock %}

{% block body %}
    {% include "module/_title.html.twig" %}
    <div class="shadow mt-4">
        {% include "module/_menu.html.twig" %}

        <div class="card-header bg-white m-2 opacity-6">
            <div class="w-25 font-weight-bold bleu"><i class="fas fa-comments-dollar"></i> Module
                Financier :
            </div>
            <span class="opacity-6 text-center ">Score {{ score.financier.score }} % -
                        Evaluation
             {% if score.financier.eval_en_cours == score.financier.nbre_total %} terminée {% else %}  en cours {% endif %}{{ score.financier.eval_en_cours }}/{{ score.financier.nbre_total }}
       </span>
            <div class="text-right">
                <button id='btnfinanceGraph' class="btn btn-primary opacity-6"><i class="fas fa-chart-pie"></i> Afficher
                    le graphique
                </button>
            </div>
            <div id="financeGraph">
                <canvas class="bg-white" id="chartFinance" dataFinancier="{{ resultatFinancier }}"></canvas>
            </div>
        </div>
        <div class="card-header bg-white m-2 opacity-6 ">
            <div class="w-25 font-weight-bold vertfonce"><i class="fas fa-notes-medical "></i> Module
                Médico Technique :
            </div>
            <span class="opacity-6 text-center ">Score {{ score.technique.score }} %  -  Evaluation {% if score.technique.eval_en_cours == score.technique.nbre_total %} terminée {% else %}  en cours {% endif %} {{ score.technique.eval_en_cours }}
            /{{ score.technique.nbre_total }}</span>
            <div class="text-right">
                <button id='btntechniqueGraph' class="btn btn-success opacity-6"><i class="fas fa-chart-pie"></i>
                    Afficher le graphique
                </button>
            </div>
            <div id="techniqueGraph">
                <canvas class="bg-white" id="chartTechnique" dataTechnique="{{ resultatTechnique }}"></canvas>
            </div>
        </div>
        <div class="card-header bg-white m-2 opacity-6">
            <div class="w-25 font-weight-bold rougepastel"><i class="fas fa-heartbeat"></i> Module Médico
                Economique :
            </div>
            <span class="opacity-6 text-center ">Score  {{ score.economique.score }} % -    Evaluation {% if score.economique.eval_en_cours == score.economique.nbre_total %} terminée {% else %}  en cours {% endif %} {{ score.economique.eval_en_cours }}
            /{{ score.economique.nbre_total }}</span>
            <div class="text-right">
                <button id='btneconomiqueGraph' class="btn btn-rougepastel opacity-6"><i class="fas fa-chart-pie"></i>
                    Afficher le graphique
                </button>
            </div>
            <div id="economiqueGraph">
                <canvas class="bg-white" id="chartEconomique" dataEconomique="{{ resultatEconomique }}"></canvas>
            </div>
        </div>
    </div>
    <div class="bg-white h-auto py-3">
        <div class="ml-4 bleu font-25 opacity-6 font-weight-bold"><i class="fas fa-chart-pie fa-2x mr-2 "></i>Graphique
            global du dossier
        </div>
    </div>

    <canvas class="bg-white" id="myChart" dataFinancier="{{ resultatFinancier }}"
            dataTechnique="{{ resultatTechnique }}" dataEconomique="{{ resultatEconomique }}"></canvas>
    <div class="shadow mt-4">

            <div class="d-flex m-2 opacity-8 justify-content-between">


                <div class="opacity-8 p-3"><a href="{{ path('resultat_export') }}" class="btn btn-mission opacity-8"><i
                                class="far fa-file-word fa-2x"></i> Editer le rapport </a></div>


                <div><img src={{ asset('build/images/graph_explication.png') }}  class="mr-3" align="right"/></div>
            </div>

    </div>
{% endblock %}