{% extends 'base.html' %}
{% load static %}
{% block content %}
{% block extra_js %}

<script src="https://cdn.datatables.net/plug-ins/1.10.20/sorting/datetime-moment.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
    <script>
        $(document).ready(
            function () {
               var table = $('#TblRichieste').DataTable(
                {
                  "serverSide": true,
                  "ajax": "/api/prenota/{{annoscol}}/?format=datatables",
                  "paging":true,
                  "stateSave": true,
                  "pageLength": 25,
                  "columns": [

                  {data: "pr_data_richiesta",
                              "render": function ( data ) {
                                  if (data)
                                      return moment(data).format('DD/MM/YY');
                                  else
                                      return '';
                              }
                          },
                          {data: "pr_codfiscale"},  
                          {data: "pr_scuola"},  
                          {data: "nomescuola", searchable:false, sortable:false},  
                          {data: "pr_classe"},  
                          {data: "pr_spesa"},  
                          
               

                      
                    ],
                    "language":
                        {
                          "decimal": ",",
                          "thousands": ".",
                          "url": "https://cdn.datatables.net/plug-ins/1.10.16/i18n/Italian.json"
                        }
            }
            );
            myUrl=window.location.toLocaleString();
            console.log('URL:'+ myUrl);
            //var n = myUrl.lastIndexOf('/');
            var parts = myUrl.split('/');
            var idlibreria = parts[parts.length -2];
            var annoscol = parts[parts.length -3];
            for (let i = 0; i < parts.length; i++) {
                console.log('part '+ String(i) + ':' + String(parts[i]));                
            }
            
            
            
            //urlFinale = '/prenlibreria/'+ annoscol + '/' + idlibreria+'/?format=datatables';
            urlFinale = '/prenlibreria/'+ annoscol + '/' + idlibreria+'/?format=datatables';
            console.log('UR:'+urlFinale);
            table.ajax.url(urlFinale).load();
            
            $('#TblRichieste tbody').on( 'click', 'tr', function () {
     
                //val= $(this).index()+1;
                val=$(this).columns().text;
                alert("Riga "+ val.toString);
            } );            
            //imposta il reloading ogni 2 min
            setInterval( function () {
                          table.ajax.reload();
            }, 120000 );

    
 });
          


</script>

    <script type="text/javascript">
         
            function getConfirmation(id){
               var retVal = confirm("Confermi l'operazione su Id." + id + "?");
               if( retVal == true ){
                  return true;
               }
               else{

                  event.preventDefault();
                  return false;
               }
            }
         //-->
    </script>
{% endblock extra_js %}

<!--div><form action="/app/listapren_admin/{{annoscol}}/" method="POST"  style="padding-top:40px;padding-left: 130px;" enctype="multipart/form-data">{% csrf_token %}{{libreriaform}}
  <input type="submit" value="Filtra" style="background-color: gray;color: yellow;" />
  </form><br>
  {%  if modo == "filtra" %}<a href="/app/listapren_admin/{{annoscol}}/" style="padding-left: 200px;">Lista completa</a> {% endif %}
</div-->
<div class="col-md-6" style="padding-left: 130px;">

    <a href="/app/listapren_admin/{{annoscol}}"  class="external_link">Lista completa prenotazioni </a>
    </div>

<div class="row" style="padding-left: 200px;padding-top:52px;"><h4>Libreria {{libreria}} - prenotazioni A.S. {{ annoscol}}/{{ annoscol|add:"1"}}</h4></div>
<div class="row">
    <div class="col-md-8" style="padding-left: 30px;">
        <table id="TblRichieste" class="table table-striped table-bordered " style="width:90%">
            <thead style="background-color: gray;color: chartreuse;">
                <tr>
                  <th style="text-align: center">Data ins.</th>
                  <th style="text-align: center">cod.fiscale</th>
                  <th style="text-align: center">Cod.Scuola</th>
                  <th style="text-align: center">Scuola</th>
                  <th style="text-align: center">classe</th>
                  <th style="text-align: center">spesa</th>


                </tr>
            </thead>
        </table>
    </div>
</div>
{% endblock %}