{% extends 'base.html' %}

{% block headersupplement %}
<script language="JavaScript">
function toggleCSV(source) {
  checkboxes = document.getElementsByName('MultipleCSVSelect');
  for(var i=0, n=checkboxes.length;i<n;i++) {
    checkboxes[i].checked = source.checked;
  }
}
</script>
{% endblock %}

{% block body %}
  <form name="inputUtenti" method="POST">
  {% csrf_token %}
  <div class='form-control'>
    {% if "UTENTE.CREA" in permesso %}
    <button type='submit' class="btn btn-primary" name='scelta' value='Nuovo Dipendente'>Nuovo Dipendente</button>
      <button type='button' class="btn btn-primary" name='TastoCaricaIndici' data-bs-toggle='modal' data-bs-target='#CaricaIndiceModal'>Carica Lista Nuovi Dipendenti</button>
      <button type='submit' class="btn btn-primary" name='ScaricaCSVSelezionati' value="Scarica CSV Selezionati"/>Scarica CSV Selezionati</button>

    {% endif %}
    <button type='submit' class="btn btn-primary" name="indietro" value="Indietro">Indietro</button>
  </div>
  <div class='form-control'>
    Numero di dipendenti selezionati {{ numeroRecordAttuali }} su un totale di {{ numeroRecordAzienda }}.
  </div>

  <table class='table table-striped table-hover'>
    <thead class='thead-dark'>
      <tr>
        {% if "UTENTE.CREA" in permesso %}<th scope='col'>*</th>{% endif %}
	<th scope='col' style='white-space: nowrap; width: 1%;'>Dipendente&nbsp;
	                <button name='utDW' type="submit" class="btn btn-outline-primary btn-sm">&#x2193;</button>
                        <button name='utUP' type="submit" class="btn btn-outline-primary btn-sm">&#x2191;</button></th>
	<th scope='col' style='white-space: nowrap; width: 1%;'>Codice Fiscale</th>
        <th scope='col' style='white-space: nowrap; width: 1%;'>Sede&nbsp;
	                <button name='seDW' type="submit" class="btn btn-outline-primary btn-sm">&#x2193;</button>
                        <button name="seUP" type="submit" class="btn btn-outline-primary btn-sm">&#x2191;</button></th>

        <th scope='col'>Data di Nascita</th>
	<th scope='col'>Luogo di Nascita</th>
        {% if "DOCUMENTO" in permesso %}
	<th scope='col'>documenti</th>
        {% endif %}
        {% if "UTENTE.EDIT" in permesso %}
          <th scope='col'>Mail</th>
  	  <th scope='col'>Pin</th>
        {% endif %}
        <th scope='col'>Inserimento</th>
        <th scope='col'><input class="form-check-input" type="checkbox" id="selectCSVAll" name="selectCSVAll" value='0' onClick="toggleCSV(this);"/></th>
      </tr>
    </thead>
    <tbody>
      {% for uu in utenti %}
        <tr>
          {% if "UTENTE.EDIT" in permesso %}
            <td> <button type='submit' class='btn btn-primary ' name='scelta' value='{{ uu.id }}'>Edit</button></td>
          {% endif %}
	  <td {% if not uu.enabled %} class="text-decoration-line-through" {% endif %} > {{ uu.nome }} </td>
	  <td> {{ uu.codicefiscale }} </td>
          <td> {{ uu.sede.nome }} </td>
	  <td> {{ uu.datanascita|date:'d/m/Y' }} </td>
	  <td> {{ uu.luogonascita }} </td>
          {% if "DOCUMENTO" in permesso %}
	  <td>{% if uu.documenti %}<a href='{% url 'documento:welcome' uu.id %}'>Download</a>{% else %} N/A {% endif %}</td>
          {% endif %}
          {% if "UTENTE.EDIT" in permesso %}
            <td> {{ uu.mail }} </td>
            <td> {{ uu.pin }} </td>
          {% endif %}
          <td> {{ uu.inserimento|date:'d/m/Y' }} </td>
          {% if "DOCUMENTO" in permesso %}
	    <td>
  	      <input class="form-check-input" type="checkbox" id="MultipleCSVSelect-{{ uu.id }}" name="MultipleCSVSelect" value='{{ uu.id }}'>
	    </td>
          {% endif %}
	</tr>
      {% endfor %} 
    </tbody>
  </table>
  </form>

  {% if "UTENTE.CREA" in permesso %}
  <!-- Modal -->
  <div class="modal fade" id="CaricaIndiceModal" tabindex="-1" role="dialog" aria-labelledby="CaricaIndiceLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
             <form name='formCaricaIndice' method='POST' enctype='multipart/form-data'>
               {% csrf_token %}
               <div class="modal-header">
                <h5 class="modal-title" id="CaricaIndiceLabel">Carica Elenco Dipendenti</h5>
                  <span aria-hidden="true">&times;</span>
                </button>
               </div>
               <div class="modal-body">
                 Caricamento Lista Dipendenti<br>
                 Formato File CSV - obbligatorio <br>
                 Separatore: ';' - prima riga: "Nome colonna".</br>
                 <table class='table table-striped table-hover'>
                   <tbody>
                     <tr>
                       <td>Nome Cognome</td>
                       <td>Codice Fiscale</td>
                       <td>Data Nascita</td>
                       <td>Luogo Nascita</td>
		       <td>email</td>
		       <td>Sede Indentificativo</td>
                     </tr>
                   </tbody>
                 </table><br>
                 <label for='indice'>Elenco Dipendenti:&nbsp;</label>
                 <input type='file' name='indice' id='indice' value='' accept='text/csv'>
               </div>
               <div class="modal-footer">
                 <button type="submit" name="CaricaIndice" value='Carica Lista' class="btn btn-primary">Carica Lista Dipendenti</button>
                 <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Annulla</button>
               </div>
             </form>
           </div>
         </div>
       </div>
     </div>
     <!-- end modal -->
   {% endif %}

{% endblock %}

{% block bodybottom %}
  <div><br><br></div>


  {% if listaok %}
    <table class='table table-striped table-hover'>
      <thead class='thead-dark'>
      <tr>
        <th scope='col'>Documento caricato con successo</th>
      </tr>
      </thead>
      <tbody>
        {% for l in listaok %}
        <tr>
          <td> {{ l }} </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}

  <div><br><br></div>
  {% if listanotok %}
    <table class='table table-striped table-hover'>
      <thead class='thead-dark'>
      <tr>
        <th scope='col'>Documento non caricato perche già presente</th>
      </tr>
      </thead>
      <tbody>
        {% for l in listanotok %}
        <tr>
          <td> {{ l }} </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}

  {%if count %}totale record letti nel file: {{ count }}{% endif %}

{% endblock %}