{% extends 'base.html' %}

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

{% block top %}
    <div class='form-outline mb-3 text-center btn-primary h3'>
           {{ HeaderTitle }}
    </div>
    <div class='form-outline mb-3 text-center btn-primary h3'>
           Area Utente {{ azienda.azienda }}
    </div>
{% endblock %}

{% block body %}
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="myTab" role="tablist">
  <li class="nav-item" role="presentation">
    <button class="btn btn-primary active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" type="button" role="tab" aria-controls="home" aria-selected="true">Documenti</button>
  </li>
  <li class="nav-item" role="presentation">
    <button class="btn btn-primary" id="profile-tab" data-bs-toggle="tab" data-bs-target="#profile" type="button" role="tab" aria-controls="profile" aria-selected="false">Profilo</button>
  </li>
  <li class="nav-item" role="presentation">
    <button class="btn btn-primary" id="messages-tab" data-bs-toggle="tab" data-bs-target="#messages" type="button" role="tab" aria-controls="messages" aria-selected="false">Attività</button>
  <li>
   <li class="nav-item" role="presentation">
    <button class="btn btn-primary" id="messages-tab" data-bs-toggle="tab" data-bs-target="#byebye" type="button" role="tab" aria-controls="byebye" aria-selected="false">Uscita</button>
  </li>
 
</ul>
<! -- end nav tabs -->

<!-- Tab panes -->
<div class="tab-content">
  <div class="tab-pane active" id="home" role="tabpanel" aria-labelledby="home-tab" tabindex="0">
   <div><br><br></div>
   <div class='form-outline mb-3 text-center btn-primary h3'>
           Documenti Disponibili al Download
   </div>

   <div>
    <form name="ElencoDocumenti" method="POST">
    {% csrf_token %}
    <table class='table table-striped table-hover'>
      <thead class='thead-dark'>
        <tr>
          <th scope='col'>Documento</th>
          <th scope='col'>Descrizione</th>
	  <th scope='col'>Data Caricamento</th>
	  <th scope='col'><input class="form-check-input" type="checkbox" id="selectAll" name="selectAll" value='0' onClick="toggle(this);"/>&nbsp;<label for='selectAll' class='form-check-label'>Tutti</label></th>

        </tr>
      </thead>
      <tbody>
        {% for documento in documentiUtente %}
          <tr>
            <td> <button type='button' class='btn btn-primary btn-block mb-2 active' onclick="window.open('{% url "documento:finalize" documento.id utente.id %}')">{{ documento.documento }}</button></td>
            <td> {{ documento.descrizione }} </td>
	    <td> {{ documento.dataupload }} </td>
	    <td><input class="form-check-input" type="checkbox" id="select-{{ documento.id}}" name="MultipleDocumentSelect" value='{{ documento.id }}'/></td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
      <input type='submit' class="btn btn-primary" name='ScaricaSelezionati' value="ScaricaSelezionati"/>
      </form>
    </div>
  </div>

  <div class="tab-pane" id="profile" role="tabpanel" aria-labelledby="profile-tab" tabindex="0">
    <div><br><br></div>
    <div class='form-outline mb-3 text-center btn-primary h3'>
           Profilo Personale
    </div>

    <form name='download' method='post' class='form-container card p-3 bg-light'>
      {% csrf_token %}
      <div class='form-outline mb-3'>
        <label class='form-label' for='nome'>nome</label>
        <input type='text' class='form-control' id='nome' name='nome' value='{{ utente.nome }}' readonly>
      </div>
      <div class='form-outline mb-3'>
        <label class='form-label' for='cfisc'>nome</label>
        <input type='text' class='form-control' id='cfisc' name='cfisc' value='{{ utente.codicefiscale }}' readonly>
      </div>
      <div class='form-outline mb-3'>
        <label class='form-label' for='luogonascita'>Luogo di Nascita</label>
        <input type='text' class='form-control' id='luogonascita' name='luogonascita' value='{{ utente.luogonascita }}' readonly>
      </div>
      <div class='form-outline mb-3'>
        <label class='form-label' for='datanascita'>Data di Nascita</label>
        <input type='text' class='form-control' id='datanascita' name='datanascita' value='{{ utente.datanascita }}' readonly>
      </div>
     <div class='form-outline mb-3'>
        <label class='form-label' for='pin'>pin/Password</label>
        <input type='text' class='form-control' id='pin' name='pin' value='{{ utente.pin }}'>
      </div>
      <div class='form-outline mb-3'>
        <label class='form-label' for='mail'>Mail</label>
        <input type='text' class='form-control' id='mail' name='mail' value='{{ utente.mail }}'>
      </div>

      <div>
        <input type='submit' class="btn btn-primary" name='aggiorna' value='Aggiorna'/>
        <input type='submit' class="btn btn-primary" name="indietro" value="Logout">
      </div>
    </form>
  </div>

  <div class="tab-pane" id="messages" role="tabpanel" aria-labelledby="messages-tab" tabindex="0">
    <div><br><br></div>
    <div class='form-outline mb-3 text-center btn-primary h3'>
          Ultime attività registrate 
    </div>
    <div>
      <table class='table table-striped table-hover mb-2'>
        <thead class='thead-dark'>
          <tr>
            <th scope='col'>Data</th>
            <th scope='col'>Causale</th>
            <th scope='col'>Utente</th>
            <th scope='col'>Amministratore</th>
            <th scope='col'>documento</th>
          </tr>
        </thead>
        <tbody>
          {% for attivita in listaAttivita %}
            <tr>
              <td> {{ attivita.data | date:'d/m/Y H:i' }} </td>
              <td> {{ attivita.causale.nome }} </td>
              <td> {{ attivita.utente.nome }} </td>
              <td> {{ attivita.amministratore.name }}</td>
              <td> {{ attivita.documento.documento }}</td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>

  <div class="tab-pane" id="byebye" role="tabpanel" aria-labelledby="byebye-tab" tabindex="0">
    <div><br><br></div>
    <div class='form-outline mb-3 text-center btn-primary h3'>
	    <a href="{% url 'login:start' %}">Fine Sessione</a>
    </div>
    <div class='form-outline mb-3 text-center btn-primary h3'>
      Grazie per aver usato i nostri servizi
    </div>
  </div> 
</div>



{% endblock %}

{% block bottom %}
  {% if mailnonvalida %}
    <div class='text-center h5'>
           <b>Attenzione, la mail non risulta inserita/corretta. Si prega di correggerla cliccando sul tasto "Profilo".</b>
    </div>
  {% endif %}
{% endblock %}