<div class="modal fade" id="modalBailleur" tabindex="-1" aria-labelledby="modalBailleurLabel" aria-hidden="true">
    <div class="modal-dialog ">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="modalBailleurLabel">Gestion des Bailleurs</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>       
            <ul class="nav nav-tabs px-3 pt-2" id="bailleurTab" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" id="ajouter-tab" data-bs-toggle="tab"
                            data-bs-target="#ajouter" type="button" role="tab">
                        Ajouter
                    </button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="liste-tab" data-bs-toggle="tab"
                            data-bs-target="#liste" type="button" role="tab">
                        Liste
                    </button>
                </li>
            </ul>
            <div class="modal-body">
                <div class="tab-content pt-3">
                    <div class="tab-pane fade show active" id="ajouter" role="tabpanel">
                        <form id="formBailleur" method="POST" action="{% url 'gestion_projet:creation-bailleur' %}">
                            {% csrf_token %}
                            {{ form_ajout_bailleur.as_p }}
                            <button type="submit" class="btn btn-success mt-3" id="btnEnregistrerBailleur">
                                <i class="bi bi-save me-1"></i> Enregistrer
                            </button>
                        </form>
                    </div>
                    <div class="tab-pane fade" id="liste" role="tabpanel">

                        <div class="d-flex justify-content-between align-items-center mb-3">
                            <h6 class="mb-0">Liste des bailleurs</h6>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div id="table-bailleurs"
                                    data-url="{% url 'gestion_projet:liste-bailleurs' %}">
                                </div>                          
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

