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

{% block header %}
<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-sm-8">
        <h2>Processus ({{ processuses|length }})</h2>
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="{{path('start')}}">Mapsi</a>
            </li>
            <li class="breadcrumb-item active">
                <strong><a>Processus</a></strong>
            </li>
        </ol>
    </div>
    <div class="col-sm-4">
        <div class="title-action">
            <a class="btn btn-primary" href="{{path('processus_create')}}">+ Nouveau Processus</a>
        </div>
    </div>
</div>
{% endblock %}



{% block body %}
<div class="wrapper wrapper-content animated fadeIn">
	<div class="row">
        <div class="col-lg-12">
			<div class="tabs-container">
                <ul class="nav nav-tabs" role="tablist">
	                <li><a class="nav-link active show" data-toggle="tab" href="#tab-1"> Vue processus</a></li>
                    <li><a class="nav-link" data-toggle="tab" href="#tab-2"> Liste</a></li>
                    <li><a class="nav-link" data-toggle="tab" href="#tab-3"> Vue projet</a></li>
                </ul>
                <div class="tab-content">
	                <div role="tabpanel" id="tab-1" class="tab-pane active show">
                        <div class="panel-body">
	                        <div class="row">
								<div class="col-lg-12">
									<h2>Pilotage</h2>
									{% for processus in processuses if processus.typeprocessus.code is defined and processus.typeprocessus.code == "MAN" %}
									<div class="widget style1 lazur-bg m-1 inline text-left" style="width:19%; min-width:220px; vertical-align: top;">
										<h3><a href="{{path('processus_edit',{'id' : processus.id} ) }}" class="stretched-link text-light"><strong>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</strong>	</a></h3>															
										<small><i>{{ processus.finalite | default("N/C") }}</i></small>
										<br><small>{{ processus.responsable.lastname | default("N/C") }} {{ processus.responsable.firstname | default("N/C") }}
										<br>{{ processus.activites|length | default("0") }} activités, {{ processus.risques|length | default("0") }} risques, {{ processus.actions|length | default("0") }} actions </small>						
									</div>
									{% endfor %}
									<br>
									<h2>Réalisation</h2>
									{% for processus in processuses if processus.typeprocessus.code is defined and processus.typeprocessus.code == "REA" %}
									<div class="widget style1 yellow-bg m-1 inline text-left" style="width:19%; min-width:220px; vertical-align: top;">
										<h3><a href="{{path('processus_edit',{'id' : processus.id} ) }}" class="stretched-link text-light"><strong>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</strong>	</a></h3>															
										<small><i>{{ processus.finalite | default("N/C") }}</i></small>
										<br><small>{{ processus.responsable.lastname | default("N/C") }} {{ processus.responsable.firstname | default("N/C") }}
										<br>{{ processus.activites|length | default("0") }} activités, {{ processus.risques|length | default("0") }} risques, {{ processus.actions|length | default("0") }} actions </small>						
									</div>
									{% endfor %}
									<br>
									<h2>Support</h2>
									{% for processus in processuses if processus.typeprocessus.code is defined and processus.typeprocessus.code == "SUP" %}
									<div class="widget style1 navy-bg m-1 inline text-left" style="width:19%; min-width:220px; vertical-align: top;">										
										<h3><a href="{{path('processus_edit',{'id' : processus.id} ) }}" class="stretched-link text-light"><strong>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</strong></a></h3>							
										<small><i>{{ processus.finalite | default("N/C") }}</i></small>
										<br><small>{{ processus.responsable.lastname | default("N/C") }} {{ processus.responsable.firstname | default("N/C") }}
										<br>{{ processus.activites|length | default("0") }} activités, {{ processus.risques|length | default("0") }} risques, {{ processus.actions|length | default("0") }} actions </small>							
									</div>	
									{% endfor %}
								</div>
							</div>
						</div>
                    </div>
                    <div role="tabpanel" id="tab-2" class="tab-pane">
                        <div class="panel-body">
	                        <div class="row">
								<div class="col-lg-12">
									<section class="processus">
										<div class="table-responsive">
											<table class="table table-striped table-bordered table-hover dataTables-processus" >
											  	<thead>
												  	<tr>
												   		<th scope="col">ID</th>
												   		<th scope="col">Code</th>
												   		<th scope="col">Désignation</th>
												   		<th scope="col">Finalité</th>
												   		<th scope="col">Métier</th>
												   		<th scope="col">Type</th>
												   		<th scope="col">Responsable</th>
												   		<th scope="col">DIMA / RTO</th>
												   		<th scope="col">PDMA / RPO</th>
												   		<th scope="col">Activités</th>
												   		<th scope="col">Actions</th>
												   		<th scope="col">MaJ</th>
												   		{% if is_granted('ROLE_ADMIN') %}<th scope="col">Action</th>{% endif %}
												    </tr>
												</thead>
												<tbody>
													{% for processus in processuses %}
													<article>
														<tr>
													      <th scope="row" data-order="{{ processus.id }}"><span class="badge badge-secondary">P-{{ processus.id }}</span></th>
													      <th scope="row"><a class="" href="{{path('processus_edit',{'id' : processus.id} ) }}">{{ processus.code | default("N/C")  }}</a></th>
													      <th scope="row"><a class="" href="{{path('processus_edit',{'id' : processus.id} ) }}">{{ processus.designation | title }}</a></th>
													      <th scope="row">{{ processus.finalite | default("N/C")  }}</th>
													      <td>{{ processus.metier.designation | default("N/C") }}</td>
													      <td>{{ processus.typeprocessus.designation | default("N/C") }}</td>
													      <td>{{ processus.responsable.lastname | default("N/C") }} {{ processus.responsable.firstname | default("N/C") }}</td>
													       <td>
													      	{% set minDima = 1000 %}
											                {% set desiDima = "NC" %}
											                {% set colorDima = "NC" %}
														    <span class="badge {{colorDima}}">
									                            {{desiDima | default("N/C")}}
									                        </span>
													      </td>
													      <td>
														    {% set minPdma = 1000 %}
															{% set desiPdma = "NC" %}
															{% set colorPdma = "NC" %}																
														    <span class="badge {{colorPdma}}">
									                            {{desiPdma | default("N/C")}}
									                        </span> 
													      </td>
													      <td><button class="btn btn-primary btn-circle" type="button">{{ processus.activites | length }}</button></td>
													      <td><button class="btn btn-primary btn-circle" type="button">{{ processus.actions | length }}</button></td>
													      <td>{{ processus.PublishedAt | date("d/m/Y")}}</td>
													      {% if is_granted('ROLE_ADMIN') %}<td><a class="btn btn-danger btn-sm del" href="{{path('processus_remove',{'id' : processus.id} ) }}"><i class="fa fa-trash"></i></a></td>{% endif %} 
								
													    </tr>
													</article>
													{% endfor %}
												</tbody>
											</table>
										</div>
									</section> 
								</div>
							</div>
						</div>
                    </div>
                    <div role="tabpanel" id="tab-3" class="tab-pane">
                        <div class="panel-body">
	                        <div class="row">
								<div class="col-lg-1"><h5>Pilotage</h5></div>
								<div class="col-lg-11">
									{% for processus in processuses %}
									{% if processus.typeprocessus.code is defined and processus.typeprocessus.code == "MAN" %}
									<div class="float-sm-left widget style1 lazur-bg m-1">
										<span>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</span><br>
											{% for action in processus.actions %}
												<span class="badge"><a class="" href="{{path('activite_edit',{'id' : action.id} ) }}">A-{{ action.id| default("N/C") }} {{ action.designation| default("N/C") }}</a></span>
											{% endfor %}
									</div>
									{% endif %}
									{% endfor %}
								</div>
							</div>
							<div class="row">
								<div class="col-lg-1"><h5>Opérations</h5></div>
								<div class="col-lg-11">
									{% for processus in processuses %}
									{% if processus.typeprocessus.code is defined and processus.typeprocessus.code == "REA" %}
									<div class="float-sm-left widget style1 yellow-bg m-1">
										<span>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</span><br>
											{% for action in processus.actions %}
												<span class="badge"><a class="" href="{{path('activite_edit',{'id' : action.id} ) }}">A-{{ action.id| default("N/C") }} {{ action.designation| default("N/C") }}</a></span>
											{% endfor %}
									</div>
									{% endif %}
									{% endfor %}
								</div>
							</div>
							<div class="row">
								<div class="col-lg-1"><h5>Support</h5></div>
								<div class="col-lg-11">
									{% for processus in processuses %}
									{% if processus.typeprocessus.code is defined and processus.typeprocessus.code == "SUP" %}
									<div class="float-sm-left widget style1 navy-bg m-1">
										<span>{{ processus.code | default("N/C") }} - {{ processus.designation | default("N/C") }}</span><br>
											{% for action in processus.actions %}
												<span class="badge"><a class="" href="{{path('activite_edit',{'id' : action.id} ) }}">A-{{ action.id| default("N/C") }} {{ action.designation| default("N/C") }}</a></span>
											{% endfor %}
									</div>
									{% endif %}
								{% endfor %}
								</div>
							</div>
                        </div>
                    </div>
                </div>
			</div>
        </div>
    </div>
</div>
{% endblock %}

{% block javascripts %}
    <!-- Page-Level Scripts -->
    <script>
        $(document).ready(function(){
	        
	        mermaid.initialize({})
	        
	        $('a.del').confirm({
			    title: 'Attention',
			    content: 'Voulez vous vraiment supprimer ce processus ?',
			    buttons: {
			        supprimer: function () {
			           location.href = this.$target.attr('href');
			        },
			        annuler: function () {
			        }    
			    }
			});
	        
            $('.dataTables-processus').DataTable({
                pageLength: 25,
                responsive: true,
                dom: '<"html5buttons"B>lTfgitp',
                buttons: [
                    { extend: 'copy'},
                    {extend: 'csv'},
                    {extend: 'excel', title: 'ExampleFile'},
                    {extend: 'pdf', title: 'ExampleFile'},

                    {extend: 'print',
                     customize: function (win){
                            $(win.document.body).addClass('white-bg');
                            $(win.document.body).css('font-size', '10px');

                            $(win.document.body).find('table')
                                    .addClass('compact')
                                    .css('font-size', 'inherit');
                    }
                    }
                ]

            });

        });

    </script>
{% endblock %}