@extends('model')
@section('content')
    <style>
        .form-label {
            color: #333;
            margin-bottom: 5px;
        }


        .form-control,
        .form-select {
            border: 1px solid #ccc;
            border-radius: 5px;
            transition: border-color 0.3s; 
        }

        .form-control:focus,
        .form-select:focus {
            border-color: #6f3b23;
            box-shadow: 0 0 5px rgba(105, 59, 26, 0.5);
        }

        .modal-footer {
            justify-content: space-between;
        }

        .form-label i {
            margin-right: 5px;
            color: #6f3b23;
        }

        .descendre-bouton {
            margin-top: 22px;
            /* Ajustez la valeur selon vos besoins */
        }  
    </style> 

    <div id="modalCreationMultirisqueadmin" class="modal fade bs-example-modal-xl" tabindex="-1" role="dialog"
        aria-labelledby="titreModalMultirisqueadmin" aria-hidden="true">
        <div class="modal-dialog modal-xl"> 
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="titreModalMultirisqueadmin">Ajouter un Multirisqueadmin</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>

                <form id="FormCreationMultirisqueadmin">
                    @csrf
                    <div class="modal-body">
                        <div class="container">
                            <!-- Section des champs existants -->
                            <h5 class="text-primary">Informations Générales</h5>
                            <hr>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="idtiers" class="form-label"><i class="fas fa-user"></i> Commercial</label>
                                    <select class="form-select" id="idtiers" name="idtiers">
                                        <!-- Options -->
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label for="denominationmultirisqueadmin" class="form-label"><i class="fas fa-tag"></i>
                                        Nom du souscripteur</label>
                                    <input type="text" class="form-control" id="denominationmultirisqueadmin"
                                        placeholder="Entrez une dénomination" name="denominationmultirisqueadmin">
                                </div>
                            </div>

                            <!-- Interlocuteur and Téléphone interlocuteur -->
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="interlocuteurmultirisqueadmin" class="form-label"><i
                                            class="fas fa-user-tie"></i> Interlocuteur</label>
                                    <input type="text" class="form-control" id="interlocuteurmultirisqueadmin"
                                        placeholder="Entrez un interlocuteur" name="interlocuteurmultirisqueadmin">
                                </div>
                                <div class="col-md-6">
                                    <label for="telephoneinterlocuteurmultirisqueadmin" class="form-label"><i
                                            class="fas fa-phone"></i> Téléphone interlocuteur</label>
                                    <input type="text" class="form-control" id="telephoneinterlocuteurmultirisqueadmin"
                                        placeholder="Entrez un numéro de téléphone"
                                        name="telephoneinterlocuteurmultirisqueadmin">
                                </div>
                            </div>

                            <!-- Date de début et de fin du contrat -->
                            <div class="row mb-3">
                                <div class="col-md-4">
                                    <label for="datedebutcontratmultirisqueadmin" class="form-label"><i
                                            class="fas fa-calendar-alt"></i> Date de début du contrat</label>
                                    <input type="date" class="form-control" id="datedebutcontratmultirisqueadmin"
                                        name="datedebutcontratmultirisqueadmin">
                                </div>
                                <div class="col-md-4">
                                    <label for="datefincontratmultirisqueadmin" class="form-label"><i
                                            class="fas fa-calendar-alt"></i> Date de fin du contrat</label>
                                    <input type="date" class="form-control" id="datefincontratmultirisqueadmin"
                                        name="datefincontratmultirisqueadmin">
                                </div>
                                <div class="col-md-4">
                                    <label for="idassureur" class="form-label"><i class="fas fa-users"></i> Assureur</label>
                                    <select class="form-select" id="idassureur" name="idassureur">
                                        <!-- Options -->
                                    </select>
                                </div>
                            </div>

                            <!-- Intermédiaire et Garantie -->
                            <div class="row mb-3"> 
                                <div class="col-md-6">
                                    <label for="idintermediaire" class="form-label"><i class="fas fa-user"></i>
                                        Intermédiaire</label>
                                    <select class="form-select" id="idintermediaire" name="idintermediaire">
                                        <!-- Options -->
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label for="idgarantiecontratassurance" class="form-label"><i
                                            class="fas fa-shield-alt"></i> Garantie</label>
                                    <select class="form-select" id="idgarantiecontratassurance"
                                        name="idgarantiecontratassurance">
                                        <!-- Options -->
                                    </select>
                                </div>
                            </div>

                            <!-- Pays, Ville et Commune -->
                            <div class="row mb-3">
                                <div class="col-md-4">
                                    <label for="idpays" class="form-label"><i class="fas fa-globe"></i> Pays</label>
                                    <select class="form-select" id="idpays" name="idpays">
                                        <!-- Options -->
                                    </select>
                                </div>
                                <div class="col-md-4">
                                    <label for="idville" class="form-label"><i class="fas fa-map-marker-alt"></i>
                                        Ville</label>
                                    <select class="form-select" id="idville" name="idville">
                                        <!-- Options -->
                                    </select>
                                </div>
                                <div class="col-md-4">
                                    <label for="idcommune" class="form-label"><i class="fas fa-map-marker-alt"></i>
                                        Commune</label>
                                    <select class="form-select" id="idcommune" name="idcommune">
                                        <!-- Options -->
                                    </select>
                                </div>
                            </div>

                            <!-- Type d'affaires et Désignation -->
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <label for="typeaffairemultirisqueadmin" class="form-label"><i
                                            class="fas fa-percent"></i> Type d'affaires</label>
                                    <select class="form-select" id="typeaffairemultirisqueadmin"
                                        name="typeaffairemultirisqueadmin" aria-label="Default select example">
                                        <option value="" disabled selected>CHOISISSEZ UNE AFFAIRE</option>
                                        <option value="NOUVELLES AFFAIRES">NOUVELLES AFFAIRES</option>
                                        <option value="RENOUVELLEMENT">RENOUVELLEMENT</option>
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label for="designationmultirisqueadmin" class="form-label"><i
                                            class="fas fa-tag"></i> Désignation</label>
                                    <select class="form-select" id="designationmultirisqueadmin"
                                        name="designationmultirisqueadmin">
                                        <option value="" disabled selected>SELECTIONNEZ UNE DESIGNATION</option>
                                        <option value="OFFICINE">OFFICINE</option>
                                        <option value="LABORATOIRE">LABORATOIRE</option>
                                        <option value="DEPÔT VENTE">DEPÔT VENTE</option>
                                        <option value="COMMERCE">COMMERCE</option>
                                    </select>
                                </div>
                            </div>

                            <!-- Séparation pour les nouveaux champs -->
                            <h5 class="text-success"></h5>
                            <hr>


                        </div>

                        <div class="row">
                            <div class="col-xl-12">
                                <div class="card custom-card">
                                    <!-- En-tête de la carte -->
                                    <div class="card-header d-flex justify-content-between align-items-center"
                                        style="background-color: #f4fef5; color: #000000;">
                                        <div class="card-title" style="background-color: #f4fef5; color: #000000;">
                                            Tableau des garanties
                                        </div>
                                    </div>
                                    <form id="formCreationDetailsEvent">
                                        @csrf
                                        <div class="modal-body">
                                            vvcc
                                                <div class="row">
                                                    <div class="row mb-3">
                                                        <div class="col-md-4">
                                                            <label for="idcategorie" class="form-label"><i
                                                                    class="fas fa-list-alt"></i> Catégories</label>
                                                            <select class="form-select" id="idcategorie"
                                                                name="idcategorie">
                                                                <!-- Options -->
                                                            </select>
                                                        </div>
                                                        <div class="col-md-4">
                                                            <label for="libelleevenement" class="form-label"><i
                                                                    class="fas fa-calendar-check"></i> Evenements
                                                                assurés</label>
                                                            <input type="text" class="form-control"
                                                                id="libelleevenement"
                                                                placeholder="Décrivez les événements assurés"
                                                                name="libelleevenement">
                                                        </div>
                                                        <div class="col-md-4">
                                                            <label for="capitauxassures" class="form-label"><i
                                                                    class="fas fa-coins"></i> Capitaux assurés</label>
                                                            <input type="text" class="form-control"
                                                                id="capitauxassures"
                                                                placeholder="Entrez les capitaux assurés"
                                                                name="capitauxassures">
                                                        </div>
                                                    </div>

                                                    <!-- Deuxième ligne avec 2 éléments -->
                                                    <div class="row mb-3">
                                                        <div class="col-md-6">
                                                            <label for="primes" class="form-label"><i
                                                                    class="fas fa-percentage"></i> Primes après
                                                                réduction</label>
                                                            <input type="text" class="form-control" id="primes"
                                                                placeholder="Entrez les primes après réduction"
                                                                name="primes">
                                                        </div>
                                                        <div class="col-md-6">
                                                            <label for="apresreduction" class="form-label"><i
                                                                    class="fas fa-tags"></i> Après réduction</label>
                                                            <input type="text" class="form-control"
                                                                id="apresreduction"
                                                                placeholder="Entrez les après réduction"
                                                                name="apresreduction">
                                                        </div>
                                                    </div>

                                                    <!-- Troisième ligne avec 2 éléments et un bouton sur la même ligne -->
                                                    <div class="row mb-3">
                                                        <div class="col-md-6">
                                                            <label for="prorata" class="form-label"><i
                                                                    class="fas fa-balance-scale"></i> Prorata</label>
                                                            <input type="text" class="form-control" id="prorata"
                                                                placeholder="Entrez le prorata" name="prorata">
                                                        </div>
                                                        <div class="col-md-5">
                                                            <label for="franchises" class="form-label"><i
                                                                    class="fas fa-shield-virus"></i> Franchises</label>
                                                            <input type="text" class="form-control" id="franchises"
                                                                placeholder="Entrez les franchises" name="franchises">
                                                        </div>
                                                        <div class="col-md-1 d-flex align-items-center descendre-bouton">
                                                            <button type="button" class="btn btn-success"
                                                                id="btnEnregistrement"
                                                                style="background-color: #6f3b23; border-color: #6f3b23; padding: 10px 20px;">
                                                                <i class="fas fa-save" style="font-size: 1rem;"></i>
                                                            </button>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>

                                    </form>
                                    <!-- Tableau des contrats -->
                                    <div class="card-body">
                                        <div class="table-responsive">
                                            <table id="tableauListeDetailsEvent"
                                                class="table table-bordered text-nowrap w-100">
                                                <thead style="background-color: #49f268; color: #fcfffe;">
                                                    <tr>
                                                        <th class="text-center">Categories</th>
                                                        <th class="text-center">Evènements assurés</th>
                                                        <th class="text-center">Capitaux assurés</th>
                                                        <th class="text-center">Primes</th>
                                                        <th class="text-center">Après réduction</th>
                                                        <th class="text-center">Prorata</th>
                                                        <th class="text-center">Franchises</th>
                                                    </tr>
                                                </thead>
                                                <!-- Contenu du tableau (exemple de lignes de données) -->
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Modal footer with buttons -->
                        <div class="modal-footer">
                            <button type="button" class="btn btn-light" data-bs-dismiss="modal">Annuler</button>
                            <button type="submit" class="btn btn-success" id="boutonEnregistrer"
                                style="background-color: #6f3b23; border-color: #6f3b23;">Enregistrer</button>
                            <label type="button" class="btn btn-success" id="boutonModifier"
                                style="display: none; background-color: #6f3b23; border-color: #6f3b23;">Modifier</label>
                        </div>
                    </div>
                </form>

            </div>
        </div>
    </div>
    </div>

    <!-- Modal confirmation suppression -->
    <div class="modal" id="confirmDeleteModal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Confirmation de suppression</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    Êtes-vous sûr de vouloir supprimer cette assurance ?
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" id="btn-close-modal"
                        data-bs-dismiss="modal">Annuler</button>
                    <button type="button" class="btn btn-danger" id="confirmDeleteBtn"><i class="las la-trash"></i>
                        Supprimer</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Tableau liste -->
    <div class="row">
        <div class="col-xl-12">
            <div class="card custom-card">
                <div class="card-header d-flex justify-content-between align-items-center"
                    style="background-color: #f4fef5; color: #000000;">
                    <div class="card-title" style="background-color: #f4fef5; color: #000000;">Liste des Multirisques
                        Professionnels
                    </div>

                    <button type="button" class="btn btn-success btn-label waves-effect waves-light"
                        id="boutonMultirisqueadmin"
                        style="background-color: #6f3b23; border-color: #6f3b23; margin-left: 0.5cm;"><i
                            class="ri-add-fill label-icon align-middle fs-16 me-2"></i> Ajouter un contrat</button>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <div class="d-flex justify-content-end" style="margin-right: 0.5cm; margin-bottom: 0.5cm;">


                        </div>
                        <table id="tableauListeMultirisqueadmin" class="table table-bordered text-nowrap w-100">
                            <thead style="background-color: #49f268; color: #fcfffe;">
                                <tr>
                                    <th class="text-center">Actions</th>
                                    <th class="text-center">N° Souscripteur </th>
                                    <th class="text-center">Nom Souscripteur</th>
                                    <th class="text-center">Date début contrat</th>
                                    <th class="text-center">Date fin contrat</th>
                                    <th class="text-center">Commercial</th>

                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        $(document).ready(function() {

            var tableauListeMultirisqueadmin = $("#tableauListeMultirisqueadmin").DataTable({
                language: {
                    dom: 'Bfrtip',
                    processing: false,
                    lengthMenu: "Afficher :&nbsp; _MENU_ &eacute;l&eacute;ments",
                    info: "Liste _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
                    infoEmpty: "Liste 0 &agrave; 0 sur 0 &eacute;l&eacute;ments",
                    infoFiltered: "(filtr&eacute; de MAX &eacute;l&eacute;ments au total)",
                    loadingRecords: "Chargement en cours...",
                    zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                    emptyTable: "Aucun contrat enrégistré",
                    paginate: {
                        first: "",
                        previous: "Pr&eacute;c&eacute;dent",
                        next: "Suivant",
                        last: ""
                    },
                    aria: {
                        sortAscending: ": activer pour trier la colonne par ordre croissant",
                        sortDescending: ": activer pour trier la colonne par ordre décroissant"
                    },
                    search: "Rechercher&nbsp;:",
                },
                pagingType: 'full_numbers',
                ordering: true,
                pageLength: 25,
                lengthChange: true,
                order: []
            });

            var tableauListeDetailsEvent = $("#tableauListeDetailsEvent").DataTable({
                language: {
                    dom: 'Bfrtip',
                    processing: false,
                    lengthMenu: "Afficher :&nbsp; _MENU_ &eacute;l&eacute;ments",
                    info: "Liste _START_ &agrave; _END_ sur _TOTAL_ &eacute;l&eacute;ments",
                    infoEmpty: "Liste 0 &agrave; 0 sur 0 &eacute;l&eacute;ments",
                    infoFiltered: "(filtr&eacute; de MAX &eacute;l&eacute;ments au total)",
                    loadingRecords: "Chargement en cours...",
                    zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                    emptyTable: "Aucun contrat enrégistré",
                    paginate: {
                        first: "",
                        previous: "Pr&eacute;c&eacute;dent",
                        next: "Suivant",
                        last: ""
                    },
                    aria: {
                        sortAscending: ": activer pour trier la colonne par ordre croissant",
                        sortDescending: ": activer pour trier la colonne par ordre décroissant"
                    },
                    search: "Rechercher&nbsp;:",
                },
                pagingType: 'full_numbers',
                ordering: true,
                pageLength: 25,
                lengthChange: true,
                order: []
            });


            $("#boutonMultirisqueadmin").click(function() {
                // Réinitialiser les champs du formulaire
                resetForm();
                $("#modalCreationMultirisqueadmin").modal('show');
                const titreModalMultirisqueadmin = document.getElementById('titreModalMultirisqueadmin');
                titreModalMultirisqueadmin.innerText = "Enrégistrer contrat";
                document.getElementById('boutonEnregistrer').style.display = '';
                document.getElementById('boutonModifier').style.display = 'none';
            });



            // appel de la fonction liste multirisque
            listeMultirisqueadmin();

            // Fonction pour ajouter un groupe tiers
            $("#btnEnregistrement").click(function() {
                $.ajax({
                    url: "{{ route('insertionDetailsEvent') }}",
                    type: 'POST',
                    data: {
                        _token: "{{ csrf_token() }}",
                        idcategorie: $("#idcategorie").val(),
                        libelleevenement: $("#libelleevenement").val(),
                        capitauxassures: $("#capitauxassures").val(),
                        primes: $("#primes").val(),
                        apresreduction: $("#apresreduction").val(),
                        prorata: $("#prorata").val(),
                        franchises: $("#franchises").val(),

                    },
                    dataType: 'json',
                    success: function(response) {
                        if (!response.error) {
                            notifSuccess("Evènement ajouté avec succès");
                            $("#idcategorie").val('');
                            $("#libelleevenement").val('');
                            $("#capitauxassures").val('');
                            $("#primes").val('');
                            $("#apresreduction").val('');
                            $("#prorata").val('');
                            $("#franchises").val('');
                            listeDetailsEvent();
                        } else {
                            notyf.error('Erreur: ' + response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                        notyf.error('Une erreur est survenue.');
                    }
                });
            });


            // appel de la fonction liste des evenements
            listeDetailsEvent();

            // fonction listeMultirisqueadmin
            function listeMultirisqueadmin() {
                $.ajax({
                    url: "{{ route('listeMultirisqueadmin') }}",
                    type: 'GET',
                    dataType: 'json',
                    success: function(response) {
                        console.log(response);
                        tableauListeMultirisqueadmin.clear().draw();
                        $.each(response, function(key, value) {
                            tableauListeMultirisqueadmin.row.add([
                                `<div class="d-flex justify-content-center align-items-center">
                                
                                </button>
                                <button type="button" class="btn btn-outline-danger btn-icon waves-effect waves-light material-shadow-none btn-sm mx-1 action-supprimer" data-id="${value.idmultirisqueadmin}" id="btnSupprimer"><i  class="las la-trash"></i></button>

                                <button type="button" class="btn btn-outline-warning btn-icon waves-effect waves-light material-shadow-none btn-sm mx-1" data-id="${value.idmultirisqueadmin}" id="btnModifier"><i class="las la-pen"></i></button>
                              <button type="button" class="btn btn-outline-primary btn-icon waves-effect waves-light material-shadow-none btn-sm mx-1" data-id="${value.idassurancehabitation}" id="btnDetails"><i class="mdi mdi-eye-outline"></i></button>
                             

                            </div>`,

                                `<div class="text-center">${value.codemultirisqueadmin} </div>`,
                                `<div class="text-center">${value.denominationmultirisqueadmin} </div>`,
                                `<div class="text-center">${value.datedebutcontratmultirisqueadmin} </div>`,
                                `<div class="text-center">${value.datefincontratmultirisqueadmin} </div>`,
                                `<div class="text-center">${value.denominationtiers} </div>`
                            ]).draw();
                        });
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                        console.log(status);
                    }
                });
            }

            function listeDetailsEvent() {
                $.ajax({
                    url: "{{ route('listeDetailsEvent') }}",
                    type: 'GET',
                    dataType: 'json',
                    success: function(response) {
                        console.log(response);
                        listeDetailsEvent.clear().draw();
                        $.each(response, function(key, value) {
                            listeDetailsEvent.row.add([
                                `<div class="text-center">${value.libellecategorie} </div>`,
                                `<div class="text-center">${value.liblleevenement} </div>`,
                                `<div class="text-center">${value.capitauxassures} </div>`,
                                `<div class="text-center">${value.primes} </div>`,
                                `<div class="text-center">${value.apresreduction} </div>`,
                                `<div class="text-center">${value.prorata} </div>`
                                `<div class="text-center">${value.franchises} </div>`
                            ]).draw();
                        });
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                        console.log(status);
                    }
                });
            }


            //fonction pour recuperer les donneées de la liste des garanties dans la table garanties
            $.ajax({
                url: "{{ route('listeGarantieContratAssurance') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idgarantiecontratassurance: 0,
                        libellegarantiecontratassurance: 'SELECTIONNEZ UNE GARANTIE'
                    });
                    populateSelect("#idgarantiecontratassurance", {
                        data: response,
                        valueKey: 'idgarantiecontratassurance',
                        textKey: 'libellegarantiecontratassurance',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });


            //fonction pour recuperer les donneées de la liste des dans la table pays

            $.ajax({
                url: "{{ route('listePays') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) { 
                    response.unshift({ 
                        idpays: 0,
                        libellepays: 'SELECTIONNEZ UN PAYS'
                    });
                    populateSelect("#idpays", {
                        data: response,
                        valueKey: 'idpays',
                        textKey: 'libellepays',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });
            //fonction pour recuperer les donneées de la liste des dans la table pays

            $.ajax({
                url: "{{ route('listeCategorie') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idcategorie: 0,
                        libellecategorie: 'SELECTIONNEZ UNE CATEGORIE'
                    });
                    populateSelect("#idcategorie", {
                        data: response,
                        valueKey: 'idcategorie',
                        textKey: 'libellecategorie',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });

            //fonction pour recuperer les donneées de la liste des Villes dans la table villes
            $.ajax({
                url: "{{ route('listeVilles') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idville: 0,
                        libelleville: 'SELECTIONNEZ UNE VILLE'
                    });
                    populateSelect("#idville", {
                        data: response,
                        valueKey: 'idville',
                        textKey: 'libelleville',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });

            //fonction pour recuperer les donneées de la liste des Villes dans la table Commune
            $.ajax({
                url: "{{ route('listeCommunes') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idcommune: 0,
                        libellecommune: 'SELECTIONNEZ UNE VILLE'
                    });
                    populateSelect("#idcommune", {
                        data: response,
                        valueKey: 'idcommune',
                        textKey: 'libellecommune',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });


            //fonction pour recuperer les donneées de la liste des intermediaire dans la table intermediaires
            $.ajax({
                url: "{{ route('listeIntermediaires') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idintermediaire: 0,
                        libelleintermediaire: 'SELECTIONNEZ UN INTERMEDIAIRE'
                    });
                    populateSelect("#idintermediaire", {
                        data: response,
                        valueKey: 'idintermediaire',
                        textKey: 'libelleintermediaire',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });

            //fonction pour recuperer les donneées de la liste des assureurs dans la table assureurs
            $.ajax({
                url: "{{ route('listeAssureurs') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idassureur: 0,
                        denominationassureur: 'SELECTIONNEZ UN ASSUREUR'
                    });
                    populateSelect("#idassureur", {
                        data: response,
                        valueKey: 'idassureur',
                        textKey: 'denominationassureur',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });

            //fonction pour recuperer les donneées de la liste des iutilisateurs dans la table users
            $.ajax({
                url: "{{ route('listeTiers') }}",
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    response.unshift({
                        idtiers: 0,
                        denominationtiers: 'SELECTIONNEZ OPERATEUR'
                    });
                    populateSelect("#idtiers", {
                        data: response,
                        valueKey: 'idtiers',
                        textKey: 'denominationtiers',
                    })

                },
                error: function(xhr, status, error) {
                    console.error(xhr);
                    console.error(" : ", error);
                },

            });





            // fonction de reinitialisation du formulaire apres creation d'un multirisqueadmin
            function resetForm() {
                $('#FormCreationMultirisqueadmin')[0].reset();
            }

            // fonction de reinitialisation du formulaire apres creation d'une garantie d'assurance
            function resetForm() {
                $('#formCreationDetailsEvent')[0].reset();
            }

            // fonction sur le click du bouton valider pour creer un multirisqueadmin
            $("#FormCreationMultirisqueadmin").on("submit", function(evt) {
                // Désactiver le bouton pour éviter les doublons
                evt.preventDefault();
                $(this).prop('disabled', true);

                let formData = new FormData(document.getElementById("FormCreationMultirisqueadmin"))

                $.ajax({
                    url: "{{ route('insertionMultirisqueadmin') }}",
                    type: 'POST',
                    data: formData,
                    dataType: 'json',
                    processData: false,
                    contentType: false,

                    success: function(response) {
                        if (!response.error) {
                            notifSuccess("contrat a été créée avec succès");
                            resetForm();
                            listeMultirisqueadmin();
                            $("#modalCreationMultirisqueadmin").modal('hide');
                        } else {
                            console.log(response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                        console.error("Erreur lors de la création de l'assurance : ",
                            error);
                    },
                    complete: function() {
                        // Réactiver le bouton après la réponse AJAX
                        $("#boutonEnregistrer").prop('disabled', false);
                    }
                });
            });

            $("#formCreationDetailsEvent").on("submit", function(evt) {
                // Désactiver le bouton pour éviter les doublons
                evt.preventDefault();
                $(this).prop('disabled', true);

                let formData = new FormData(document.getElementById("formCreationDetailsEvent"))

                $.ajax({
                    url: "{{ route('insertionDetailsEvent') }}",
                    type: 'POST',
                    data: formData,
                    dataType: 'json',
                    processData: false,
                    contentType: false,

                    success: function(response) {
                        if (!response.error) {
                            notifSuccess("Evènement a été créée avec succès");
                            resetForm();
                            listeDetailsEvent();
                            $("#modalCreationMultirisqueadmin").modal('hide');
                        } else {
                            console.log(response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                        console.error("Erreur lors de la création de l'évènement : ",
                            error);
                    },
                    complete: function() {
                        // Réactiver le bouton après la réponse AJAX
                        $("#boutonEnregistrer").prop('disabled', false);
                    }
                });
            });


            // Fonction pour ouvrir la modal de suppression
            $(document).on('click', '.action-supprimer', function() {
                var multirisqueadminId = $(this).data('id');
                $('#confirmDeleteModal').data('multirisqueadminId', multirisqueadminId).modal('show');
            });

            // Fonction pour confirmer la suppression d'un multirisqueadmin
            $('#confirmDeleteBtn').click(function() {
                var multirisqueadminId = $('#confirmDeleteModal').data('multirisqueadminId');
                $.ajax({
                    url: "{{ route('supprimerMultirisqueadmin') }}",
                    type: 'DELETE',
                    data: {
                        idmultirisqueadmin: multirisqueadminId,
                        _token: "{{ csrf_token() }}"
                    },
                    dataType: 'json',
                    success: function(response) {
                        if (!response.error) {

                            notifSuccess("Contrat supprimé avec succès")
                            $('#confirmDeleteModal').modal('hide');
                            listeMultirisqueadmin();
                        } else {
                            console.error(
                                "Erreur lors de la suppression du multirisqueadmin : ",
                                response
                                .message);
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error("Erreur lors de la suppression du multirisqueadmin : ",
                            error);
                    }
                });
            });


            // fonction sur le click de modifier un multirisqueadmin 
            $("#boutonModifier").click(function() {
                let idMultirisqueadmin = $(this).attr("data-id");
                let formData = new FormData(document.getElementById("FormCreationMultirisqueadmin"))
                formData.append("idmultirisqueadmin", idMultirisqueadmin)
                $.ajax({
                    url: "{{ route('modifierMultirisqueadmin') }}",
                    type: 'POST',
                    data: formData,
                    dataType: 'json',

                    processData: false,
                    contentType: false,
                    success: function(response) {
                        if (!response.error) {
                            notifSuccess("Contrat modifié avec succès")
                            $("#modalCreationMultirisqueadmin").modal("hide");
                            listeMultirisqueadmin();
                        } else {
                            console.log(response.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error(xhr);
                    }
                });
            });

            $("#tableauListeMultirisqueadmin").on("click", "#btnModifier", function() {
                // Réinitialiser les champs du formulaire
                resetForm();
                let idMultirisqueadmin = $(this).attr("data-id");
                $.ajax({
                    url: "{{ route('listeMultirisqueadmin') }}",
                    type: 'GET',
                    data: {
                        idmultirisqueadmin: idMultirisqueadmin
                    },
                    dataType: 'json',
                    success: function(response) {
                        console.log(response);
                        $("#idtiers").val(response[0].idtiers);
                        $("#idintermediaire").val(response[0].idintermediaire);
                        $("#denominationmultirisqueadmin").val(response[0]
                            .denominationmultirisqueadmin);
                        $("#idassureur").val(response[0].idassureur);
                        $("#telephoneinterlocuteurmultirisqueadmin").val(response[0]
                            .telephoneinterlocuteurmultirisqueadmin);
                        $("#datedebutcontratmultirisqueadmin").val(response[0]
                            .datedebutcontratmultirisqueadmin);
                        $("#datefincontratmultirisqueadmin").val(response[0]
                            .datefincontratmultirisqueadmin);
                        $("#designationmultirisqueadmin").val(response[0]
                            .designationmultirisqueadmin);
                        $("#interlocuteurmultirisqueadmin").val(response[0]
                            .interlocuteurmultirisqueadmin);
                        $("#idpays").val(response[0].idpays);
                        $("#idville").val(response[0].idville);
                        $("#idcommune").val(response[0].idcommune);
                        $("#typeaffairemultirisqueadmin").val(response[0]
                            .typeaffairemultirisqueadmin);
                        $("#idgarantiecontratassurance").val(response[0]
                            .idgarantiecontratassurance);
                        $("#modalCreationMultirisqueadmin").modal("show");
                        const titreModalMultirisqueadmin = document.getElementById(
                            'titreModalMultirisqueadmin');
                        titreModalMultirisqueadmin.innerText = "Modifier Contrat";
                        document.getElementById('boutonEnregistrer').style.display = 'none';
                        document.getElementById('boutonModifier').style.display = '';
                        document.getElementById('boutonModifier').setAttribute('data-id',
                            idMultirisqueadmin);

                    },
                });
            });



            // fonction de reinitialisation du formulaire apres creation d'un multirisqueadmin
            function resetForm() {
                $('#FormCreationMultirisqueadmin')[0].reset(); // Réinitialise le formulaire

            }


        })
    </script>
@endsection