{% extends "traite/base.html" %}
{% load static %}
{% block content %}
<div class="p-3">
  <div class="d-flex justify-content-between bg-light my-3 p-3 rounded border ">
    <h4 >Parametres - Juridictions</h4>
  </div>
  <div class="text-end"><a href="{% url 'traiteapp:add_juridiction' %}" class="btn btn-dark px-2" >Ajouter juridiction</a></div>
  <div class="">
    <div class="table-responsive mt-3 tbl-container bdr">
      {% csrf_token %}
      <table class="table table-striped table-sm ">
        <thead class="border bg-blue-dark px-2 text-center">
          <tr class=" ">
            <th scope="col" class="text-white fw-normal py-2 text-start">N° d'ordre</th>
            <th scope="col" class="text-white fw-normal py-2 text-start">Libelle</th>
            <th scope="col" class="text-white fw-normal py-2 text-start">Adresse</th>
            <th scope="col" class="text-white fw-normal py-2 ">Nombre d'utilisateur</th>
            <th scope="col" class="text-white fw-normal py-2"></th>
            <th scope="col" class="text-white fw-normal py-2"></th>
          </tr>
        </thead>
        <tbody class="">
          {% for juridiction in juridictions %}
              <tr class=" text-center my-2 rounded " id="{{ juridiction.id }}">
                <td class="text-start">{{ forloop.counter }}</td>
                <td class="text-start">{{ juridiction.libelle }}</td>
                <td class="text-start">{{ juridiction.adresse }}</td>
                <td class=""> {{juridiction.editeur_juridiction.count}} </td>
                
                <td>
                  <button class="border-0 bg-transparent" href="#">
                    <i class="bi fs-6 bi-pencil-square text-dark-blue fs-6"></i>
                  </button>
                </td>
                <td>
                  
                  <button class="border-0 bg-transparent" onclick="delete({{ juridiction.id }})">
                    <i class="bi fs-6 bi-trash3-fill text-dark-blue fs-6"></i>
                  </button>
                </td>
              </tr>
              {% endfor %}
              </tbody>
            </table>
          </div>
  </div>
</div>
{% endblock content %}