{% extends 'menuback.html.twig' %}
{% block stylesheets %} 
   {{parent()}}

      <link rel="stylesheet"   href="{{ asset('back/bundles/datatables/datatables.min.css') }}">
      <link rel="stylesheet"   href="{{ asset('back/bundles/datatables/DataTables-1.10.16/css/dataTables.bootstrap4.min.css') }}">
 
 {% endblock %}

{% block body %}
    <div class="main-content">
        <section class="section">
          <div class="section-body">
            <div class="row">
              <div class="col-12">
                <div class="card">
                  <div class="card-header">
                        <input name="product_all" class="checked_all" type="checkbox">Tout selectionnez                      <h4></h4>
    <button type="button" name="btn_substituer" id="btn_substituer" class="btn btn-success" style="background-color:#F57C00;color:black;">Mettre à Substituer</button>
        <button type="button" name="btn_livraison" id="btn_livraison"  class="btn btn-success"  style="background-color:#388E3C

;color:black;">Mettre à Livraison effectuée interieur</button>
        <button type="button" name="btn_echec" id="btn_echec"  class="btn btn-success" style="background-color:#0288D1


;color:black;">Mettre à Echec livraison interieur</button>

<label id="affiche" style="color: green;" ></label>
<p class="total"></p>
                    {# <h4>Export Table</h4> #}
      {# <input name="product_all" class="checked_all" type="checkbox">Tout selectionnez                      <h4></h4>
    <button type="button" name="btn_delete" id="btn_delete" class="btn btn-success">Validez la livraison </button>
<label id="affiche" style="color: green;" ></label> #}
    {# {% for message in app.flashes('success') %}
      <div class="alert alert-success">
        {{ message }}
      </div>
    {% endfor %} #}
                  </div>
                  <div class="card-body">
{# {% for label, flashes in app.session.flashbag.all %}
    {% for flash in flashes %}
        {% if ( label == 'success' ) %}
            <div class="alert alert-success alert-dismissible fade show">
                {{ flash }}
            </div>
        {% elseif ( label == 'danger' ) %}
            <div class="alert alert-danger alert-dismissible fade show">
                {{ flash }}
            </div>
        {% endif %}
    {% endfor %}
{% endfor %} #}
                  <div class="table-responsive">
                      <table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
                       {# <table class="table table-striped" id="table-1"> #}
                        <thead>
                          <tr>
                          <th>actions</th>
                                              <th>N° coman.</th>
                <th>Date update</th>
                {# <th>Nom</th>
                <th>Prenoms</th> #}
                <th>Articles</th>  
                  {# <th>Article</th> #}
                {# <th>Adresseclient</th> #}
                <th>Commune</th>
                <th>Lieu de livraison</th>
                {# <th>Priorité</th> #}
                <th>Contact</th>
                 {# <th>Etat</th>  #}
                                 <th>Statut</th>
                 <th>Bon de livraison</th>  
               
                          </tr>
                        </thead>
                        <tbody>
                        {% for commande in commandes %}
                        
                          <tr>
                           <td>
    <input type="checkbox" name="customer_id[]" class="delete_customer" value="{{commande.id}}" onchange="checkboxes()"/>
                   {# <a href="{{ path('commandes_edit_change_statut', {'id': commande.id}) }}"  class="btn btn-warning">Statut</a>  #}
  </td>
                <td>         <a href="{{ path('commandes_timeline', {'id': commande.id}) }}" style="text-decoration:none;" >{{ commande.numerocommande }}</a></td>
                <td>{{ commande.datecommande|date('d-m-Y H:i') }}  </td>

                 <td style="">
                {% for produit in commande.produit %}
             
                <b style="color:{{ random(['#000000', '#000000', '#000000']) }} ;"  >{{produit.lproduit.designation|slice(0,20)}}...   </b  > /{% endfor %}</td>
                
                 <td>{{ commande.typecommune.designation }}</td>
                <td>{{ commande.adresseclientlivraison }}</td>
        {# <td > 
                {% if commande.priorite.designation is defined %}
                

                  {% if  (commande.priorite.designation) =="URGENT" %}
                <b style="color:crimson;font-weight:bold;">      {{ commande.priorite.designation }} </b>
                   {% else %}
               <b style="color:crimson;font-weight:bold;">      {{ commande.priorite.designation }} </b>

                {% endif %}
                
                 {% endif %} </td> #}

                <td> {{ commande.telephone }}/  {{ commande.contact }} </td>
                {# <td>{{ commande.nom }}</td>
                <td></td> #}
                {# <td>{{ commande.email }}</td> #}
                  <td>
    <b class="badge badge-primary" style="background-color:{{commande.typestatut.color}};">  {{ commande.typestatut.designation   }} </b>

                  </td>
                              <td>
<a href="{{ path('reimpression', {'id': commande.id}) }}" style="text-decoration:none;" target="_blank" > <i class="material-icons">local_printshop</i></a>
                  </td>
                   {# <td>       
                             <a href="{{ path('reimpression', {'id': commande.id}) }}" style="text-decoration:none;" target="_blank" > <i class="material-icons">local_printshop</i></a>   
                 {# <a href="{{ path('reimpression', {'id': commande.id}) }}" style="text-decoration:none;" target="_blank" >{{ commande.numerocommande }}</a></td> #}
 
                  
                {# <td>{% for produit in commande.produit %}
                -<b style="font-weight:bold;color:{{ random(['red', '#000000', 'green']) }} ;">{{produit.designation|slice(0,20)}}</b><br>{% endfor %}</td> #}
                 
                {# <td>{{ commande.adresseclient }}</td> #}
                {# <td>{{ commande.adresseclientlivraison }}</td>
                <td> {{ commande.telephone }}/  {{ commande.contact }} </td>
                {# <td>{{ commande.datelivraison ? commande.datelivraison|date('Y-m-d H:i:s') : '' }}</td> #}
                
               
                     
                   {# <a href="{{ path('commandes_show', {'id': commande.id}) }} "  class="btn btn-success">Voir</a>  #}
                    {# <a href="{{ path('commandes_edit', {'id': commande.id}) }}"  class="btn btn-secondary">Edite</a> #}
                 
 
   
                           
                  
             
                {# {{ include('commandes/_delete_form.html.twig') }}  #}
                
                               
                        </tr>
                          {% endfor %}
                  
                        </tbody>
                      </table>
                    </div>
                   
                         
                      
                  </div>
                </div>
              </div>
            </div>
          </div>
        </section>
     
      </div>
{% endblock %}
{% block javascripts %} 
   {{parent()}}
{# composer self-update
 #}

<script type="text/javascript">


{# function checkboxes(){
    var inputElems = document.getElementsByTagName("input"),
    count = 0;
    for (var i=0; i<inputElems.length; i++) {
    if (inputElems[i].type === "checkbox" && inputElems[i].checked === true){
        count++;
        //alert(count);
        $("#nbrcocher").text(count);
    }
}} #}

 function checkboxes()
  {
  var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
   var inputElems = document.getElementsByTagName("input"),
    count = 0;

    for (var i=0; i<inputElems.length; i++) {       
       if (inputElems[i].type == "checkbox" && inputElems[i].checked == true){
          count++;
       }
    }
 //$("#nbrcocher").text(count);

 $("#affiche").html("il y'a  :" + count + 'Elements cocher').css( styles1 );
 }

        $('.checked_all').on('change', function() {     
                $('.delete_customer').prop('checked', $(this).prop("checked"));              
        });
        //deselect "checked all", if one of the listed checkbox product is unchecked amd select "checked all" if all of the listed checkbox product is checked
        $('.delete_customer').change(function(){ //".checkbox" change 
            if($('.delete_customer:checked').length == $('.delete_customer').length){
                   $('.checked_all').prop('checked',true);
                   
            }else{
                   $('.checked_all').prop('checked',false);
            }
        });
    </script>
<script>
$(document).ready(function(){
 //btn subsituer
 $('#btn_substituer').click(function(){
  
  if(confirm("Vous aller effectuer une action de subsitution"))
  {
   var id = [];
   
   $('.delete_customer:checkbox:checked').each(function(i){
 
   
   id[i] = $(this).val();
 console.log($(this).val());
   });
   
   if(id.length === 0) //tell you if the array is empty
   {
    alert("Svp veuillez selectionnez au moins une ligne");
   }
   else
   {
    $.ajax({
        url: '{{path('pretasubsituer')}}',
                    type: 'POST',
                    dataType: 'json',
                    async: true,
                    
                    data: {id: id},
                        success: function (data) {
                        console.log("data");
                        if (data['Result'] === 'OK') {
                            //$("#ordreError").empty();
                            //var newsletter = data['Record'];
                           // console.log("news",  );
                            

 var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    {# $("#affiche").html("Message :" + data['Message'] ).css( styles1 ); #}
   
  document.location.href='{{path('panierpretasubsituer')}}';
    $("#progress").css("display", "none");
     
                        } else if (data['Result'] === 'ERROR') {
                             var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    $("#affiche").html("Message :" + data['Message'] ).css( styles1 );
                         // $(".loading").css("display", "none");
                            $("#progress").css("display", "none");
                        }
                    }
     
    });
   }
   
  }
  else
  {
   return false;
  }
 });

  //btn livraison effectuer interieur
 $('#btn_livraison').click(function(){
  
  if(confirm("Vous aller effectuer une action de livraison effectué interieur"))
  {
   var id = [];
   
   $('.delete_customer:checkbox:checked').each(function(i){
 
   
   id[i] = $(this).val();
 console.log($(this).val());
   });
   
   if(id.length === 0) //tell you if the array is empty
   {
    alert("Svp veuillez selectionnez au moins une ligne");
   }
   else
   {
    $.ajax({
        url: '{{path('pretalivraisoninteffc')}}',
                    type: 'POST',
                    dataType: 'json',
                    async: true,
                    
                    data: {id: id},
                        success: function (data) {
                        console.log("data");
                        if (data['Result'] === 'OK') {
                            //$("#ordreError").empty();
                            //var newsletter = data['Record'];
                           // console.log("news",  );
                            

 var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    {# $("#affiche").html("Message :" + data['Message'] ).css( styles1 ); #}
   
  document.location.href='{{path('panierlivraisoninteffc')}}';
    $("#progress").css("display", "none");
     
                        } else if (data['Result'] === 'ERROR') {
                             var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    $("#affiche").html("Message :" + data['Message'] ).css( styles1 );
                         // $(".loading").css("display", "none");
                            $("#progress").css("display", "none");
                        }
                    }
     
    });
   }
   
  }
  else
  {
   return false;
  }
 });


  //btn echec livraison
 $('#btn_echec').click(function(){
  
  if(confirm("Vous aller effectuer une action de echec livraison interieur"))
  {
   var id = [];
   
   $('.delete_customer:checkbox:checked').each(function(i){
 
   
   id[i] = $(this).val();
 console.log($(this).val());
   });
   
   if(id.length === 0) //tell you if the array is empty
   {
    alert("Svp veuillez selectionnez au moins une ligne");
   }
   else
   {
    $.ajax({
        url: '{{path('pretaecheclivint')}}',
                    type: 'POST',
                    dataType: 'json',
                    async: true,
                    
                    data: {id: id},
                        success: function (data) {
                        console.log("data");
                        if (data['Result'] === 'OK') {
                            //$("#ordreError").empty();
                            //var newsletter = data['Record'];
                           // console.log("news",  );
                            

 var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    {# $("#affiche").html("Message :" + data['Message'] ).css( styles1 ); #}
   
  document.location.href='{{path('panierpretaecheclivint')}}';
    $("#progress").css("display", "none");
     
                        } else if (data['Result'] === 'ERROR') {
                             var styles1 = {
      color : "#01579B",
      fontWeight: "bold",
      fontSize:"20px",
      fontStyle:"italic" ,
      position:"center"
       
    };
    $("#affiche").html("Message :" + data['Message'] ).css( styles1 );
                         // $(".loading").css("display", "none");
                            $("#progress").css("display", "none");
                        }
                    }
     
    });
   }
   
  }
  else
  {
   return false;
  }
 });
 
});
</script>

 

<script type="text/javascript">
$(document).ready(function() {
	document.title='Simple DataTable';
	// DataTable initialisation
	$('#example').DataTable(
		{
			"dom": '<"dt-buttons"Bf><"clear">lirtp',
			"paging": true,
			"autoWidth": true,
			"buttons": [
				'colvis',
				'copyHtml5',
        'csvHtml5',
				'excelHtml5',
        'pdfHtml5',
				'print'
			]
		}
	);
});
 </script>

<script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>

<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.colVis.min.js"></script>
  <script type="text/javascript" src="{{ asset('back/bundles/datatables/datatables.min.js') }}"></script>  
           <script type="text/javascript" src="{{ asset('back/bundles/datatables/DataTables-1.10.16/js/dataTables.bootstrap4.min.js') }}"></script>  
           <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/dataTables.buttons.min.js') }}"></script> 
           <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/buttons.flash.min.js') }}"></script>  
            <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/jszip.min.js') }}"></script>  
            <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/pdfmake.min.js') }}"></script>  
            <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/vfs_fonts.js') }}"></script> 
            <script type="text/javascript" src="{{ asset('back/bundles/datatables/export-tables/buttons.print.min.js') }}"></script>  
             <script type="text/javascript" src="{{ asset('back/js/page/datatables.js') }}"></script>    

 {% endblock %}