{% extends 'layout.twig' %}

{% block body %}
    <script type="text/javascript" src="{{ baseUrl('ext/highcharts/highcharts/highcharts.js') }}"></script>
    <script type="text/javascript" src="{{ baseUrl('ext/highcharts/highcharts/highcharts-more.js') }}"></script>
    <script type="text/javascript" src="{{ baseUrl('ext/highcharts/highcharts/modules/solid-gauge.js') }}"></script>
    <script type="text/javascript" src="{{ baseUrl('ext/highcharts/highcharts/modules/exporting.js') }}"></script>
    <script type="text/javascript" src="{{ baseUrl('ext/highcharts/highcharts/modules/offline-exporting.js') }}"></script>
<div class="contenu clearfix"  id="fournisseurs">
	<h1>
    	{{ 'Analyse Projets achats' | trad }}
    </h1>

    <div class="tab-content">
        <div id="indicateur_Projet" class="clearfix">
			
			<div class="tab-content clearfix">
                <div class="tuilesIndicateur">
                    <div class="titreTuile">{% if initialiseActif %} {{ 'Nombre de projets initialisés ou en préparation' | trad }} {% else %}  {{ 'Nombre de projets en préparation' | trad }} {% endif %}</div>
                    <div class="resultTuile texteTuilegris">{{ nbProjetInitialise }}</div>
                </div>

                <div class="tuilesIndicateur">
                    <div class="titreTuile">{{ 'Nombre de projets en cours' | trad }}</div>
                    <div class="resultTuile texteTuilevert">{{ nbProjetEnCours }}</div>
                </div>

                <div class="tuilesIndicateur">
                    <div class="titreTuile">{{ 'Nombre de tâches en retard' | trad }}</div>
                    <div class="resultTuile texteTuilerouge">{{ nbTachesEnRetard }}</div>
                </div>

                <div class="tuilesIndicateur">
                    <div class="titreTuile">{{ 'Nombre de tâches en cours' | trad }}</div>
                    <div class="resultTuile texteTuilevert">{{ nbTachesEnCours }}</div>
                </div>
			</div>
			
			<div class="tab-content clearfix" style="display:flex;margin-top:30px;">
				<div class="" style="width:60%;margin-right:3%;">
					{{ Highcharts(dataHighchart1) }}
				</div>
				<div class="" style="width:35%;">
					{{ Highcharts(dataHighchart2) }}
				</div>
			</div>
         
        </div>
    </div>
</div>
{% endblock %}