@extends('model')

@section('content')

<!-- Start::page-header -->
<div class="d-flex align-items-center justify-content-between page-header-breadcrumb flex-wrap gap-2">
    <div>
        <nav>
            <ol class="breadcrumb mb-1">
                <li class="breadcrumb-item">
                    <a href="javascript:void(0);">
                        Configuration
                    </a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">Société Client</li>
            </ol>
        </nav>
    </div>
    <div class="btn-list">

        <button class="btn btn-primary btn-wave me-0" id="btnModalNewSocieteClient">
            <i class="bx bx-plus-circle me-1"></i> Nouvel Société
        </button>
    </div>
</div>
<!-- End::page-header -->

<!-- Start::row-2 -->
<div class="row">
    <div class="col-xl-12">
        <div class="card custom-card overflow-hidden">
            <div class="card-body p-2 px-3">
                <div class="table-responsive">
                    <table class="table table-hover text-nowrap w-100" id="tableListeSocieteClient">
                        <thead>
                            <tr>
                                <th data-column="action" class="text-center">Actions</th>
                                <th data-column="raisonSocial" data-class="text-start" class="text-center">Raison sociale</th>
                                <th data-column="contact" data-class="text-start" class="text-center">Contact</th>
                                <th data-column="nom" data-class="text-start" class="text-center">Créé par</th>
                                <th data-column="creeLe" class="text-center">Créé le</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!--End::row-2 -->

{{--- Section des modals ---}}
<!-- Modal de société client-->
<div id="modalSocieteClient" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-bs-focus="false">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-primary-light">
                <i class="iconeHeader bx bx-buildings text-primary me-3" style="font-size : 25px;"></i>
                    <h5 class="modal-title"></h5>
                <button type="button" class="btn-close bg-light text-dark" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body iconFond">
                <i class='bx bx-buildings iconFondBody text-primary'></i>

                <form id="formSociete">
                    <input type="number" value="0" id="inpModalSocieteClientIdsociete" name="idsociete" style="display : none;">
                    <h1 class="page-title fw-medium fs-18 mb-0 border-bottom border-danger mt-2 pb-1 mb-3">Info société</h1>
                    <div class="row">
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Nom société</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientRaisonSocial" name="raisonSocial" style="text-transform: uppercase;">
                        </div>

                        <div class="col-md-6 mb-2">
                            <p class="text-muted mb-0">Créneau de livraison</p>
                            <select class="form-select" id="selCreneauLivraison">
                                <option value="">— Aucun créneau —</option>
                            </select>
                            {{-- Valeurs soumises au formulaire --}}
                            <input type="hidden" id="heureLivraison"    name="heureLivraison">
                            <input type="hidden" id="heureLivraisonFin" name="heureLivraisonFin">
                        </div>

                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Frais livraison</p>
                            <input type="text" class="form-control numberInput text-end" id="fraisLivraison" name="fraisSociete">
                        </div>

                        <div class="col-md-4 mb-2 mb-md-4">
                            <p class="text-muted mb-0">Téléphone fixe</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientTelephoneFixe" name="telephoneFixe" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-4 mb-2 mb-md-4">
                            <p class="text-muted mb-0">Téléphone Mobile</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientTelephoneMobile" name="telephoneMobile" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-4 mb-2 mb-md-4">
                            <p class="text-muted mb-0">Adresse</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientadresse" name="adresse" style="text-transform: uppercase;">
                        </div>

                        <div class="col-md-6 mb-2">
                            <p class="text-muted mb-0">Domaine</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientDomaine" name="domaineMail">
                        </div>

                        <div class="col-md-6 mb-2">
                            <p class="text-muted mb-0">Code société</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientCode" name="codeSociete">
                        </div>
                    </div>
                </form>
                <form id="formUserModalSocieteClient" class="w-100">
                    <h1 class="page-title fw-medium fs-18 mb-0 border-bottom border-danger mt-2 pb-1 mb-3">Info premier utilisateur</h1>
                    <div class="row">
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Nom</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientnom" name="nom" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-5 mb-2">
                            <p class="text-muted mb-0">Prénoms</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientprenoms" name="prenoms" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-4 mb-2">
                            <p class="text-muted mb-0">Mail</p>
                            <input type="text" class="form-control" id="inpModalSocieteClientemail" name="email">
                        </div>
                        <div class="col-md-3 mb-2" id="divinppassword">
                            <p class="text-muted mb-0">Mot de passe</p>
                            <input type="password" class="form-control" id="inpModalSocieteClientpassword" name="password">
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Sexe</p>
                            <select name="sexe" id="selModalSocieteClientsexe" class="form-select">
                                <option value="1">Homme</option>
                                <option value="2">Femme</option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0 ellipsis">Date d'anniversaire</p>
                            <input type="text" class="form-control text-center" id="inpModalSocieteClientdateAnniversaire"  maxlength="5" name="dateAnniversaire" placeholder="07/09">
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Téléphone</p>
                            <input type="text" class="form-control" id="inpModalSocieteClienttelephone" name="telephone">
                        </div>
                    </div>
                    <div class="row" id="listeCheckDroitModalSociete"></div>
                </form>
            </div>
            <div class="modal-footer pt-4 pb-2 mb-0">
                <button type="button" class="btn btn-warning" id="btnEditSocieteClient">
                    <i class="bx bx-edit me-1"></i>
                    Modifier
                </button>
                <button type="button" class="btn btn-primary" id="btnNewSocieteClient">
                    <i class="bx bx-plus-circle me-1"></i>
                    Ajouter
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<!-- Modal d'utilisateur-->
<div id="modalUtilisateur" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-bs-focus="false">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-primary-light">
                <i class="iconeHeader bx bx-user text-primary me-3" style="font-size : 25px;"></i>
                <h5 class="modal-title"></h5>
                <button type="button" class="btn-close bg-light text-dark" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body iconFond">
                <i class='bx bx-user iconFondBody text-primary'></i>
                <form id="formUser" class="w-100 mb-3">
                    <input type="number" value="0" class="form-control" id="inpidusers" name="idusers" style="display : none;">
                    <div class="row">
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Nom</p>
                            <input type="text" class="form-control" id="inpnom" name="nom" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-5 mb-2">
                            <p class="text-muted mb-0">Prénoms</p>
                            <input type="text" class="form-control" id="inpprenoms" name="prenoms" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-4 mb-2">
                            <p class="text-muted mb-0">Mail</p>
                            <input type="text" class="form-control" id="inpemail" name="email">
                        </div>
                        <div class="col-md-3 mb-2" id="divinppassword">
                            <p class="text-muted mb-0">Mot de passe</p>
                            <input type="password" class="form-control" id="inppassword" name="password">
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Sexe</p>
                            <select name="sexe" id="selsexe" class="form-select">
                                <option value="1">Homme</option>
                                <option value="2">Femme</option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-2" style="display : none;">
                            <p class="text-muted mb-0">Société</p>
                            <input type="text" name="idsociete" id="inpidsociete" class="form-control">
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted ellipsis mb-0">Date d'anniversaire</p>
                            <input type="text" class="form-control text-center" id="inpdateAnniversaire"  maxlength="5" name="dateAnniversaire" placeholder="07/09">
                        </div>
                        <div class="col-md-3 mb-2" style="display : none;">
                            <p class="text-muted mb-0">Type d'utilisateur</p>
                            <select name="idtype_users" id="selidtype_users" class="form-select">
                            </select>
                        </div>
                        <div class="col-md-3 mb-2">
                            <p class="text-muted mb-0">Téléphone</p>
                            <input type="text" class="form-control" id="inptelephone" name="telephone">
                        </div>
                        <div class="col-md-3 mb-3">
                            <div>
                                <div class=""><p class="text-muted ellipsis m-0">Etat</div>
                                <div class="custom-toggle-switch toggle-sm ms-2">
                                    <input class="checkStatut" id="checkStatut" type="checkbox" name="statut">
                                    <label for="checkStatut" class="label-primary"></label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row" id="listeCheckDroitModalUtilisateur"></div>
                </form>
                <div class="d-flex justify-content-end mt-2 mb-3">
                    <button type="button" class="btn btn-warning me-2" id="btnEditUsers">
                        <i class="bx bx-edit me-1"></i>
                        Modifier
                    </button>
                    <button type="button" class="btn btn-primary me-2" id="btnNewUsers">
                        <i class="bx bx-plus-circle me-1"></i>
                        Ajouter
                    </button>
                    <button type="button" class="btn btn-dark" id="btnAnnulerSaisieUsers">
                        <i class="bx bx-x-circle me-1"></i>
                        Annuler
                    </button>
                </div>
                <h1 class="page-title fw-medium fs-18 mb-0 border-bottom border-danger mt-3 pb-1 mb-3">Liste des utilisateurs</h1>
                <div class="table-responsive">
                    <table class="table table-hover text-nowrap w-100" id="tableListeUtilisateur">
                        <thead>
                            <tr>
                                <th data-column="action" class="text-center">Actions</th>
                                <th data-column="nom" data-class="text-start" class="text-center">Nom</th>
                                <th data-column="prenoms" data-class="text-start" class="text-center">Prénoms</th>
                                <th data-column="email" data-class="text-start" class="text-center">Addresse Mail</th>
                                <th data-column="spanStatut" class="text-center">Statut</th>
                                <th data-column="telephone" class="text-center">Téléphone mobile</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<!-- Modal des adresses de livraison-->
<div id="ModalAdresselivraison" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-bs-focus="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-primary-light">
                <i class="iconeHeader bx bx-map text-primary me-3" style="font-size : 25px;"></i>
                    <h5 class="modal-title"></h5>
                <button type="button" class="btn-close bg-light text-dark" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body iconFond">
                <i class='bx bx-map iconFondBody text-primary'></i>
                <form id="formadresse_livraison">
                    <div class="row">
                        <input type="number" name="idadresse_livraison" id="inpidadresse_livraison" style="display : none;">
                        <input type="number" name="idsociete" id="inpModalAdresselivraisonidsociete" style="display : none;">
                        <div class="col-md-9">
                            <p class="text-muted mb-0">Nom adresse</p>
                            <input type="text" class="form-control" name="adresse" id="inpadresse" style="text-transform: uppercase;">
                        </div>
                        <div class="col-md-3 d-flex justify-content-between pt-3">
                            <button class="btn btn-primary" id="btnAjouteradresse_livraison">
                                <i class="bx bx-plus-circle" style="font-size: 17px;"></i>
                            </button>
                            <button class="btn btn-warning" id="btnEditadresse_livraison" style="display:none;">
                                <i class="bx bx-edit" style="font-size: 17px;"></i>
                            </button>
                            <button class="btn btn-dark" id="btnAnnulerSaisieadresse_livraison">
                                <i class="bx bx-x-circle" style="font-size: 17px;"></i>
                            </button>
                        </div>
                    </div>
                </form>
                <div class="table-responsive mt-2">
                    <table class="table table-hover text-nowrap w-100" id="tableListeAdresseLivraison">
                        <thead>
                            <tr>
                                <th data-column="action" class="text-center">#</th>
                                <th data-column="adresse" data-class="text-start" class="text-center">Nom Adresse</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>


<!-- Modal liste des membres d'un gestionnaire -->
<div id="modalListMembres" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" data-bs-focus="false">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-primary-light">
                <i class="iconeHeader bx bx-group text-primary me-3" style="font-size:25px;"></i>
                <h5 class="modal-title" id="titreModalListMembres"></h5>
                <button type="button" class="btn-close bg-light text-dark" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body iconFond">
                <i class='bx bx-group iconFondBody text-primary'></i>
                <input type="hidden" id="idGestionnaireListMembres">
                <div class="table-responsive mt-2">
                    <table class="table table-hover text-nowrap w-100" id="tableListMembres">
                        <thead>
                            <tr>
                                <th class="text-center">Actions</th>
                                <th data-class="text-start" class="text-center">Nom</th>
                                <th data-class="text-start" class="text-center">Prénoms</th>
                                <th data-class="text-start" class="text-center">Email</th>
                                <th class="text-center">Téléphone</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
            <div class="modal-footer pt-3 pb-2">
                <button type="button" id="btnFermerModalListMembres" class="btn btn-secondary" data-bs-dismiss="modal">Fermer</button>
            </div>
        </div>
    </div>
</div>

<div id="ModalUserMemeEntreprise" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-bs-focus="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-primary-light">
                <i class="iconeHeader bx bx-user text-primary me-3" style="font-size : 25px;"></i>
                    <h5 class="modal-title" id="TitreModal"></h5>
                <button type="button" class="btn-close bg-light text-dark" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body iconFond">

                <i class='bx bx-map iconFondBody text-primary'></i>
                <input type="hidden" id="idUserGestionnaireHidden"/>
                <div class="table-responsive mt-2">
                    <table class="table table-hover text-nowrap w-100" id="tableUserMemeEntreprise">
                        <thead>
                            <tr>
                                <th class="text-center">#</th>
                                <th data-class="text-start" class="text-center">Nom</th>
                                <th data-class="text-start" class="text-center">Prénoms</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>

            <div class="modal-footer pt-4 pb-2 mb-0">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fermer</button>
                <button type="button" class="btn btn-primary" id="Ajoutsubordonne">
                    <i class="bx bx-plus-circle me-1"></i>
                    Ajouter
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

@endsection


@section('script')

<!-- Script excécuté au chargement de la page -->
<script>

    var tableListeSocieteClient

    formatInputToMMYY(_('#inpModalSocieteClientdateAnniversaire'))

    // ── Chargement des créneaux horaires dans le select ───────────
    function chargerCreneaux(heureDebutActuelle, heureFInActuelle) {

        $.ajax({
            url: "{{ route('creneau_horaire.get') }}",
            type: 'GET',
            dataType: 'json',
            success: function(response) {

                var sel = $('#selCreneauLivraison')
                sel.html('<option value="">— Aucun créneau —</option>')

                if (response.succes && response.data.length) {

                    $.each(response.data, function(i, c) {

                        var label = c.heure_debut.substring(0,5) + ' - ' + c.heure_fin.substring(0,5)
                        var selected = (c.heure_debut.substring(0,5) === (heureDebutActuelle || '').substring(0,5)) ? 'selected' : ''
                        sel.append('<option value="' + c.id_creneau_horaire + '" data-debut="' + c.heure_debut + '" data-fin="' + c.heure_fin + '" ' + selected + '>' + label + '</option>')
                    })
                } else {
                    sel.append('<option disabled>Aucun créneau configuré</option>')
                }

                // Sync les hidden inputs avec la valeur sélectionnée
                syncCreneauHidden()
            }
        })
    }

    function syncCreneauHidden() {

        var opt = $('#selCreneauLivraison option:selected')
        _('#heureLivraison').value    = opt.data('debut') || ''
        _('#heureLivraisonFin').value = opt.data('fin')   || ''
    }

    $('#selCreneauLivraison').on('change', syncCreneauHidden)

    function listingSoctiete(idsociete = 0){

        return new Promise((resolve, reject) => {

            $.ajax({

                url : "{{ route('listingSoctiete') }}",
                type : 'GET',
                data : {
                    idsociete : idsociete
                },
                dataType : 'json',
                // beforeSend : progressHandler(),
                success : function(response){

                    if (response.success != 2) {
                        
                        notifError(response.msg || 'Échec de l\'opération.')
                    }

                    resolve(response)

                    // completeHandler()
                },
                error : function(error){

                    reject()
                    notifErrorAjax()
                    // completeHandler()
                }
            })
        })
    }

    function chargerTableListeDesSocietes(){

        listingSoctiete()
            .then((response) => {

                if (response.success == 2) {
                    
                    let data = response.data

                    tableListeSocieteClient = remplissageDataTable({
                                        IdentifiantDuTableau : '#tableListeSocieteClient',
                                        obj : data,
                                        lengthChange : false
                                    })
                }
            })
    }

    chargerTableListeDesSocietes()

    recuperationDesDroits({droit_client : 1})
        .then((response) => {

            if (response.success == 1) {
                
                let data = response.data

                $('#listeCheckDroitModalSociete').html('')

                $.each(data, function(key, value){
                    
                    $('#listeCheckDroitModalSociete').append('\
                        <div class="col-md-3">\
                            <div>\
                                <div class=""><p class="text-muted ellipsis m-0" title="'+value.libelle+'">'+value.libelle+'</div>\
                                <div class="custom-toggle-switch toggle-sm ms-2">\
                                    <input data-id="'+value.iddroit+'" class="checkDroitModalSociete" id="size-sm'+key+'" type="checkbox">\
                                    <label for="size-sm'+key+'" class="label-primary"></label>\
                                </div>\
                            </div>\
                        </div>\
                    ')
                })

                //////////////////////////////////////////////////////////////////////////////////////////////////////////////////

                $('#listeCheckDroitModalUtilisateur').html('')

                $.each(data, function(key, value){
                    
                    $('#listeCheckDroitModalUtilisateur').append('\
                        <div class="col-md-3">\
                            <div>\
                                <div class=""><p class="text-muted ellipsis m-0" title="'+value.libelle+'">'+value.libelle+'</div>\
                                <div class="custom-toggle-switch toggle-sm ms-2">\
                                    <input data-id="'+value.iddroit+'" class="checkDroitModalUtilisateur" id="size-sm2'+key+'" type="checkbox">\
                                    <label for="size-sm2'+key+'" class="label-primary"></label>\
                                </div>\
                            </div>\
                        </div>\
                    ')
                })
            }
})
</script>

<!-- Script de nouvelle société -->
<script>

    function newModifSociete(){

        return new Promise((resolve, reject) => {

            let formSociete = new FormData(_('#formSociete'))

            formSociete.append('nom', _('#inpModalSocieteClientnom').value)
            formSociete.append('prenoms', _('#inpModalSocieteClientprenoms').value)
            formSociete.append('email', _('#inpModalSocieteClientemail').value)
            formSociete.append('password', _('#inpModalSocieteClientpassword').value)
            formSociete.append('sexe', _('#selModalSocieteClientsexe').value)

            
            formSociete.append('dateAnniversaire', _('#inpModalSocieteClientdateAnniversaire').value)
            formSociete.append('idtype_users', 2)
            formSociete.append('telephone', _('#inpModalSocieteClienttelephone').value)

            let listeDroit = []

            document.querySelectorAll('.checkDroitModalSociete').forEach((value) => {

                if (value.checked) {
                    
                    listeDroit.push(value.getAttribute('data-id'))
                }
            })

            formSociete.append('listeDroit', listeDroit)

            formSociete.append('_token', '{{ csrf_token()}}')

            $.ajax({

                url : "{{ route('newModifSociete') }}",
                type : 'POST',
                data : formSociete,
                dataType : 'json',
                processData : false,
                contentType : false,
                // beforeSend : progressHandler(),
                success : function(response){

                    if (response.success != 1) {
                        
                        // notifError(response.msg || 'Échec de l\'opération.')
                        resolve(response)
                    }

                    resolve(response)

                    // completeHandler()
                },
                error : function(error){

                    reject()
                    notifErrorAjax()
                    // completeHandler()
                }
            })
        })
    }

    // Ouverture de la modale en ajout
    _('#btnModalNewSocieteClient').addEventListener('click', function(){

        _('#btnEditSocieteClient').style.display = 'none'
        _('#btnNewSocieteClient').style.display = ''
        _('#divinppassword').style.display = ''

        _('#formUserModalSocieteClient').style.display = ''

        _('#formSociete').reset()
        _('#formUserModalSocieteClient').reset()

        chargerCreneaux()

        typerModal("#modalSocieteClient", 'Nouvel société client', 'primary', true)
        $('#modalSocieteClient').modal('show')
    })

    // Ouverture en modification 
    $(document).on('click', '#btnModalEditSocieteClient', function(){

        let elmt = this

        let idsociete = $(this).attr('data-id')

        loaderIcon(elmt, 'bx bx-edit')

        listingSoctiete(idsociete)
            .then((response) => {

                if (response.success == 2) {

                    let data = response.data

                    remplirLeForm('#formSociete', data)

                    _('#btnEditSocieteClient').style.display = ''
                    _('#btnNewSocieteClient').style.display = 'none'
                    _('#divinppassword').style.display = 'none'

                    _('#formUserModalSocieteClient').reset()
                    _('#formUserModalSocieteClient').style.display = 'none'

                    // Charger les créneaux et pré-sélectionner le créneau actuel
                    chargerCreneaux(data.heureLivraison, data.heureLivraisonFin)

                    $('.numberInput').trigger('input')
                    typerModal("#modalSocieteClient", 'Modification de la société ('+data.raisonSocial+')', 'warning', true)

                    loaderIcon(elmt, 'bx bx-edit')
                    $('#modalSocieteClient').modal('show')
                }
            }).catch(() => loaderIcon(elmt, 'bx bx-edit'))
    })

    _('#btnNewSocieteClient').addEventListener('click', function(){

        let elmt = this

        if (_('#inpModalSocieteClientRaisonSocial').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez saisir le nom de la société.')
            _('#inpModalSocieteClientRaisonSocial').focus()
            return 0
        }

        if (_('#inpModalSocieteClientTelephoneFixe').value.replace(/\s/g, '') == '' && _('#inpModalSocieteClientTelephoneMobile').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez enregistrer un contact pour la société.')
            return 0
        }

        if(_('#inpModalSocieteClientnom').value.replace(/\s/g, '') == ''){

            notifDanger('Veuillez saisir le nom de l\'utilisateur.')
            return 0
        }

        if(_('#inpModalSocieteClientemail').value.replace(/\s/g, '') == ''){

            notifDanger('Veuillez saisir l\'adresse mail de l\'utilisateur.')
            return 0
        }

        if(_('#inpModalSocieteClientpassword').value.replace(/\s/g, '') == ''){

            notifDanger('Veuillez saisir le mot de passe de l\'utilisateur.')
            return 0
        }

       /* if(_('#inpModalSocieteClientdateAnniversaire').value.replace(/\s/g, '') == ''){

            notifDanger('Veuillez saisir la date d\'anniversaire de l\'utilisateur.')
            return 0
        }*/

        if(_('#inpModalSocieteClienttelephone').value.replace(/\s/g, '') == ''){

            notifDanger('Veuillez saisir le contact de l\'utilisateur.')
            return 0
        }

        loaderIcon(elmt, 'bx bx-plus-circle')

        newModifSociete()
            .then((response) => {

                if (response.success == 2) {
                    
                    notifSuccess('Nouvelle société enregistrée avec succès.')
                    chargerTableListeDesSocietes()
                    $('#modalSocieteClient').modal('hide')
                }

                loaderIcon(elmt, 'bx bx-plus-circle')
            }).catch(() => loaderIcon(elmt, 'bx bx-plus-circle'))
    })

    _('#btnEditSocieteClient').addEventListener('click', function(){

        let elmt = this

        if (_('#inpModalSocieteClientIdsociete').value == 0 && _('#inpModalSocieteClientIdsociete').value == '' ) {
            
            notifDanger('Echec de l\'opération.')
            $('#modalSocieteClient').modal('hide')
            return 0
        }

        if (_('#inpModalSocieteClientRaisonSocial').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez saisir le nom de la société.')
            _('#inpModalSocieteClientRaisonSocial').focus()
            return 0
        }

        if (_('#inpModalSocieteClientTelephoneFixe').value.replace(/\s/g, '') == '' && _('#inpModalSocieteClientTelephoneMobile').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez enregistrer un contact pour la société.')
            return 0
        }

        loaderIcon(elmt, 'bx bx-edit')

        newModifSociete()
            .then((response) => {

                if (response.success == 2) {
                    
                    notifSuccess('Modification éffectuée avec succès.')
                    chargerTableListeDesSocietes()
                    $('#modalSocieteClient').modal('hide')
                }

                loaderIcon(elmt, 'bx bx-edit')
            }).catch(() => loaderIcon(elmt, 'bx bx-edit'))
    })
</script>

<!-- Script modal utilisateur -->
<script>

$(document).ready(function(){


            $("#tableUserMemeEntreprise").DataTable({
              
                language:{
                         // dom: 'Bfrtip',
                        processing: false,
                        lengthMenu: "Afficher :&nbsp; _MENU_ lignes",
                        info: "Ligne _START_ à _END_ sur _TOTAL_",
                        infoEmpty: "Ligne 0 &agrave; 0 sur 0",
                        infoFiltered: "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                        infoPostFix: "",
                        loadingRecords: "Chargement en cours...",
                        zeroRecords: '<img style="height : 250px;" src="/assets/images/fondTable.png" alt="Aucune donnée trouvée" />',
                        emptyTable: '<img style="height : 250px;" src="/assets/images/fondTable.png" alt="Aucune donnée trouvée" />',

                        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: "",
                        searchPlaceholder : 'Rechercher...'
                },
                order:[],  // Désactiver le tri initial
                
                // scrollX: scrollX,
                // scrollY: scrollY,
                // paging: scrollY != false ? false : true,
            });

            var tableListeUtilisateur
           
            function listeDesUtilisateurs(data){
        
                return new Promise((resolve, reject) => {
        
                    $.ajax({
        
                        url : "{{ route('listeDesUtilisateurs') }}",
                        type : 'GET',
                        data : data,
                        dataType : 'json',
                        // beforeSend : progressHandler(),
                        success : function(response){
        
                            if (response.success != 1) {
                                
                                notifError(response.msg || 'Échec de l\'opération.')
                            }
        
                            resolve(response)
        
                            // completeHandler()
                        },
                        error : function(error){
        
                            reject()
                            notifErrorAjax()
                            // completeHandler()
                        }
                    })
                })
            }
        
            function newModifUtilisateur(){
        
                return new Promise((resolve, reject) => {
        
                    let formUser = new FormData(_('#formUser'))
                    formUser.append('idsociete', _('#inpidsociete').value)
                    formUser.append('selidtype_users', 2)
                    formUser.append('_token', '{{ csrf_token()}}')
        
                    let listeDroit = []
        
                    document.querySelectorAll('.checkDroitModalUtilisateur').forEach((value) => {
        
                        if (value.checked) {
                            
                            listeDroit.push(value.getAttribute('data-id'))
                        }
                    })
        
                    formUser.append('listeDroit', listeDroit)
                    $.ajax({
        
                        url : "{{ route('newModifUtilisateur') }}",
                        type : 'POST',
                        data : formUser,
                        dataType : 'json',
                        processData : false,
                        contentType : false,
                        // beforeSend : progressHandler(),
                        success : function(response){
        
                            if (response.success != 2) {
                                
                                notifDanger(response.msg || 'Échec de l\'opération.')
                                resolve(response)
                            }
        
                            resolve(response)
        
                            // completeHandler()
                        },
                        error : function(error){
        
                            reject()
                            notifDanger('Echec de l\'opération.')
                            // completeHandler()
                        }
                    })
                })
            }
        
            // Script d'annulation de saisie
            _('#btnAnnulerSaisieUsers').addEventListener('click', function(){
        
                _('#btnEditUsers').style.display = 'none'
                _('#btnNewUsers').style.display = ''
                _('#formUser').reset()
            })
        
            _('#btnNewUsers').addEventListener('click', function(){
        
                let elmt = this
        
                if(_('#inpnom').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir le nom de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inpemail').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir l\'adresse mail de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inppassword').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir le mot de passe de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inpdateAnniversaire').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir la date d\'anniversaire de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inptelephone').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir le contact de l\'utilisateur.')
                    return 0
                }        
        
                loaderIcon(elmt, 'bx bx-plus-circle')
                
                newModifUtilisateur()
                    .then((response) => {
        
                        if (response.success == 2) {
                            
                            listeDesUtilisateurs({idsociete : _('#inpidsociete').value})
                                .then((response) => {
        
                                    if (response.success == 1) {
                                        
                                        let data = response.data
        
                                        let idsociete = _('#inpidsociete').value
        
                                        _('#formUser').reset()
        
                                        _('#inpidsociete').value = idsociete
        
                                        tableListeUtilisateur = remplissageDataTable({
                                                            IdentifiantDuTableau : '#tableListeUtilisateur',
                                                            obj : data,
                                                            lengthChange : false
                                                        })
        
                                        document.querySelectorAll('#btnModalDroitUsers').forEach(element => {
                                            element.style.display = 'none';
                                        });
                                    }
                                }).catch(() => loaderIcon(elmt, 'bx bx-plus-circle'))
                        }
        
                        loaderIcon(elmt, 'bx bx-plus-circle')
                    }).catch(() => loaderIcon(elmt, 'bx bx-plus-circle'))
                
            })
        
            // Ouverture en modification
            $(document).on('click', '#btnModalEditUsers', function(){
        
                let elmt = this
        
                let idusers = $(this).attr('data-id')
        
                loaderIcon(elmt, 'bx bx-edit')
        
                listeDesUtilisateurs({idusers : idusers})
                    .then((response) => {
        
                        if (response.success == 1) {
                            
                            let data = response.data[0]
                            data.statut = data.statut == 1 ? 1 : 0
        
                            _('#btnEditUsers').style.display = ''
                            _('#btnNewUsers').style.display = 'none'
                            _('#divinppassword').style.display = 'none'
        
                            remplirLeForm('#formUser', data)
                            
                            data.listeDroit.forEach(function(value){
        
                                document.querySelector('.checkDroitModalUtilisateur[data-id="'+value+'"]').checked = true
                            })
        
                            loaderIcon(elmt, 'bx bx-edit')
                        }
                    })        
            })
        
            //PABLO
            // 1. Déclaration du tableau global pour stocker les IDs des utilisateurs cochés
            let utilisateursSelectionnes = [];
        
            $(document).on('click', '#btnModalCallMembers', function() {
                // Note : Assure-toi que ton bouton possède bien l'attribut data-societe="..."
                let $id = $(this).data('societe'); 
                let $iduser = $(this).data('id'); 
                $('#idUserGestionnaireHidden').val($iduser)
                let nomComplet = $(this).data('nomcomplet')
        
                // Réinitialisation du tableau à chaque ouverture du modal si nécessaire
                utilisateursSelectionnes = [];
        
                $.ajax({
                    type: "GET",
                    url: "{{route('user_meme_entreprise.get')}}",
                    data: { idsociete: $id,
                            iduser : $iduser
                     },
                    dataType: "JSON",
                    success: function (resp) {
                        $('#modalUtilisateur').modal('hide');
                        
                        let table = $('#tableUserMemeEntreprise').DataTable();
                        table.clear();
                        $('#TitreModal').html('')
                        $('#TitreModal').html(nomComplet)
                        $('#ModalUserMemeEntreprise').modal('show');
                        
                        $.each(resp.data, function(key, value) {
                            // CORRECTION : On s'assure que chaque checkbox a une classe spécifique pour l'écouteur
                            table.row.add([
                                `<div class="form-check d-flex justify-content-center">
                                    <input class="form-check-input cb-user" type="checkbox" value="${value.idusers}">
                                </div>`,
                                value.nom,
                                value.prenoms
                            ]);
                        });
                        
                        table.draw();
                    }
                });
            });
        
        
            // 2. Écouteur d'événement sur les cases à cocher (Fonctionne même avec la pagination)
            $(document).on('change', '#tableUserMemeEntreprise .cb-user', function() {
                let idUser = $(this).val();
        
                if ($(this).is(':checked')) {
                    // Si coché et pas encore dans le tableau, on l'ajoute
                    if (!utilisateursSelectionnes.includes(idUser)) {
                        utilisateursSelectionnes.push(idUser);
                    }
                } else {
                    // Si décoché, on le retire du tableau
                    utilisateursSelectionnes = utilisateursSelectionnes.filter(function(id) {
                        return id !== idUser;
                    });
                }
        
                // Zone de test (tu peux ouvrir ta console F12 pour voir le tableau évoluer en temps réel)
                console.log("IDs sélectionnés :", utilisateursSelectionnes);
            });
        
            // pablo
            $(document).on('click', '#Ajoutsubordonne', function(){
                // 1. Vérification : On s'assure qu'au moins un utilisateur a été coché
                if (utilisateursSelectionnes.length === 0) {
                    notifDanger("Veuillez sélectionner au moins un utilisateur."); // Tu peux remplacer par un SweetAlert si tu en utilises un
                    return;
                }
        
                // Optionnel : On peut désactiver le bouton pour éviter les doubles clics
                let $btn = $(this);
                $btn.prop('disabled', true).html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Enregistrement...');
        
                // 2. Envoi des données par AJAX
                $.ajax({
                    type: "POST",
                    // Remplace 'subordonne.store' par le nom exact de ta route Laravel
                    url: "{{ route('subordonne.store') }}", 
                    data: {
                        _token: "{{ csrf_token() }}", // Requis par Laravel pour la sécurité CSRF
                        utilisateurs: utilisateursSelectionnes,
                        idUserGestionnaire:$('#idUserGestionnaireHidden').val()
                    },
                    dataType: "JSON",
                    success: function (resp) {
                        // Si l'enregistrement a réussi
                        if (resp.status === 'success') {
                            // Fermer le modal
                            $('#ModalUserMemeEntreprise').modal('hide');
                            
                            // Message de succès (à adapter selon tes habitudes : alert, toastr, sweetalert)
                            notifSuccess(resp.message || "Les subordonnés ont bien été ajoutés !");
                            
                            // Optionnel : Recharger ton tableau principal de la page si nécessaire
                            // $('#votreTableauPrincipal').DataTable().ajax.reload();
                        } else {
                            notifDanger("Une erreur est survenue : " + resp.message);
                        }
                    },
                    error: function (xhr, status, error) {
                        console.error(xhr.responseText);
                        notifDanger("Erreur serveur lors de l'enregistrement.");
                    },
                    complete: function () {
                        // Réactiver le bouton à la fin du traitement
                        $btn.prop('disabled', false).text('Enregistrer');
                    }
                });
            });
            
            _('#btnEditUsers').addEventListener('click', function(){
        
                let elmt = this
        
                if(_('#inpnom').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir le nom de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inpemail').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir l\'adresse mail de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inpdateAnniversaire').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir la date d\'anniversaire de l\'utilisateur.')
                    return 0
                }
        
                if(_('#inptelephone').value.replace(/\s/g, '') == ''){
        
                    notifDanger('Veuillez saisir le contact de l\'utilisateur.')
                    return 0
                }        
        
                loaderIcon(elmt, 'bx bx-edit')
                
                newModifUtilisateur()
                    .then((response) => {
        
                        if (response.success == 2) {
                            
                            listeDesUtilisateurs({idsociete : _('#inpidsociete').value})
                                .then((response) => {
        
                                    if (response.success == 1) {
                                        
                                        let data = response.data
        
                                        tableListeUtilisateur = remplissageDataTable({
                                                            IdentifiantDuTableau : '#tableListeUtilisateur',
                                                            obj : data,
                                                            lengthChange : false
                                                        })
        
                                        document.querySelectorAll('#btnModalDroitUsers').forEach(element => {
                                            element.style.display = 'none';
                                        });
        
                                        _('#btnAnnulerSaisieUsers').click()
                                    }
                                })
                        }
        
                        loaderIcon(elmt, 'bx bx-edit')
                    }).catch(() => loaderIcon(elmt, 'bx bx-edit'))
            })
        
            $(document).on('click', '#btnModalUserSocieteClient', function(){
        
                let elmt = this
        
                let idsociete = $(this).attr('data-id')
        
                loaderIcon(elmt, 'bx bx-user')
        
                listeDesUtilisateurs({idsociete : idsociete})
                    .then((response) => {
        
                        if (response.success == 1) {
        
                            _('#inpidsociete').value = idsociete
                            
                            let data = response.data
        
                            tableListeUtilisateur = remplissageDataTable({
                                                IdentifiantDuTableau : '#tableListeUtilisateur',
                                                obj : data,
                                                lengthChange : false
                                            })
        
                            document.querySelectorAll('#btnModalDroitUsers').forEach(element => {
                                element.style.display = 'none';
                            });
        
                            document.querySelectorAll('.checkDroitModalUtilisateur').forEach(function(value){
        
                                value.checked = false
                            })
                        }
        
                        loaderIcon(elmt, 'bx bx-user')
                    }).catch(() => loaderIcon(elmt, 'bx bx-user'))
        
                _('#btnEditUsers').style.display = 'none'
                _('#btnNewUsers').style.display = ''
                _('#formUser').reset()
        
                typerModal("#modalUtilisateur", 'Utilisateurs société ' , 'teal', true)
                $('#modalUtilisateur').modal('show')
            })
})
</script>

<!-- Script de destination -->
<script>

    var tableListeAdresseLivraison

    function recuperationAdresseLivraisonSociete(data = {}){

        return new Promise((resolve, reject) => {

            $.ajax({

                url : "{{ route('recuperationAdresseLivraisonSociete') }}",
                type : 'GET',
                data : data,
                dataType : 'json',
                // beforeSend : progressHandler(),
                success : function(response){

                    if (response.success != 1) {
                        
                        notifError(response.msg || 'Échec de l\'opération.')
                    }

                    resolve(response)

                    // completeHandler()
                },
                error : function(error){

                    reject()
                    notifErrorAjax()
                    // completeHandler()
                }
            })
        })
    }

    function chargerTableAdresseLivraisonSociete(idsociete){

        recuperationAdresseLivraisonSociete({idsociete : idsociete})
            .then((response) => {

                if (response.success == 1) {

                    _('#btnAnnulerSaisieUsers').click()

                    let data = response.data

                    tableListeAdresseLivraison = remplissageDataTable({
                                                IdentifiantDuTableau : '#tableListeAdresseLivraison',
                                                obj : data,
                                                lengthChange : false
                                            })
                }
            })
    }

    function newEditAdresseLivraison(){

        return new Promise((resolve, reject) => {

            let formadresse_livraison = new FormData(_('#formadresse_livraison'))
            formadresse_livraison.append('_token', '{{ csrf_token()}}')

            $.ajax({

                url : "{{ route('newEditAdresseLivraison') }}",
                type : 'POST',
                data : formadresse_livraison,
                dataType : 'json',
                processData : false,
                contentType : false,
                // beforeSend : progressHandler(),
                success : function(response){

                    if (response.success != 2) {
                        
                        notifDanger(response.msg || 'Échec de l\'opération.')
                        resolve(response)
                    }

                    resolve(response)

                    // completeHandler()
                },
                error : function(error){

                    reject()
                    notifDanger('Echec de l\'opération.')
                    // completeHandler()
                }
            })
        })
    }

    function suppressionAdresseLivraison(idadresse_livraison){

        return new Promise((resolve, reject) => {

            $.ajax({

                url : "{{ route('suppressionAdresseLivraison') }}",
                type : 'GET',
                data : {
                    idadresse_livraison : idadresse_livraison
                },
                dataType : 'json',
                // beforeSend : progressHandler(),
                success : function(response){

                    if (response.success != 2) {
                        
                        notifError(response.msg || 'Échec de l\'opération.')
                    }

                    resolve(response)

                    // completeHandler()
                },
                error : function(error){

                    reject()
                    notifErrorAjax()
                    // completeHandler()
                }
            })
        })
    }

    _('#formadresse_livraison').addEventListener('submit', function(e){

        e.preventDefault()
    })

    // Script d'annulation de saisie
    _('#btnAnnulerSaisieUsers').addEventListener('click', function(){

        _('#btnEditadresse_livraison').style.display = 'none'
        _('#btnAjouteradresse_livraison').style.display = ''

        let idsociete = _('#inpModalAdresselivraisonidsociete').value

        _('#formadresse_livraison').reset()

        _('#inpModalAdresselivraisonidsociete').value = idsociete
    })

    // Ouverture de la modal d'adresse de livraison
    $(document).on('click', '#btnModalAdresse', function(){

        let elmt = this

        let idsociete = $(this).attr('data-id')

        loaderIcon(elmt, 'bx bx-map')

        recuperationAdresseLivraisonSociete({idsociete : idsociete})
            .then((response) => {

                if (response.success == 1) {

                    _('#formadresse_livraison').reset()
                    _('#inpModalAdresselivraisonidsociete').value = idsociete

                    let data = response.data
                    let info = response.info

                    typerModal("#ModalAdresselivraison", 'Adresses société ('+info.raisonSocial+')' , 'success', true)
                    $('#ModalAdresselivraison').modal('show')

                    $('#ModalAdresselivraison').on('shown.bs.modal', function() {

                        tableListeAdresseLivraison = remplissageDataTable({
                                                    IdentifiantDuTableau : '#tableListeAdresseLivraison',
                                                    obj : data,
                                                    lengthChange : false
                                                })
                    })
                }

                loaderIcon(elmt, 'bx bx-map')
            }).catch(() => loaderIcon(elmt, 'bx bx-map'))
        
    })

    // Ajout d'une nouvelle addresse de livraison
    _('#btnAjouteradresse_livraison').addEventListener('click', function(){

        let elmt = this

        if (_('#inpadresse').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez saisir le nom de l\'adresse.')
            return 0
        }

        if (_('#inpModalAdresselivraisonidsociete').value.replace(/\s/g, '') == '' || _('#inpModalAdresselivraisonidsociete').value == 0) {
            
            notifDanger('Échec de l\'opération.')
            $('#ModalAdresselivraison').modal('hide')
            return 0
        }

        loaderIcon(elmt, 'bx bx-plus-circle')

        newEditAdresseLivraison()
            .then((response) => {

                if (response.success == 2) {
                    
                    notifSuccess('Opération éffectuée avec succès.')
                    chargerTableAdresseLivraisonSociete(_('#inpModalAdresselivraisonidsociete').value)
                }

                loaderIcon(elmt, 'bx bx-plus-circle')
            }).catch(() => loaderIcon(elmt, 'bx bx-plus-circle'))
    })

    // Script de modification
    $(document).on('click', '#btnModalEditAdresseLivraisonSocieteClient', function(){

        let elmt = this

        let idadresse_livraison = $(this).attr('data-id')

        loaderIcon(elmt, 'bx bx-edit')

        recuperationAdresseLivraisonSociete({idadresse_livraison : idadresse_livraison})
            .then((response) => {

                if (response.success == 1) {
                    
                    let data = response.data

                    remplirLeForm('#formadresse_livraison', data)

                    _('#btnAjouteradresse_livraison').style.display = 'none'
                    _('#btnEditadresse_livraison').style.display = ''
                }

                loaderIcon(elmt, 'bx bx-edit')
            }).catch(() => loaderIcon(elmt, 'bx bx-edit'))

    })

    _('#btnEditadresse_livraison').addEventListener('click', function(){

        let elmt = this

        if (_('#inpadresse').value.replace(/\s/g, '') == '') {
            
            notifDanger('Veuillez saisir le nom de l\'adresse.')
            _('#btnAnnulerSaisieUsers').click()
            return 0
        }

        if (_('#inpidadresse_livraison').value.replace(/\s/g, '') == '' || _('#inpidadresse_livraison').value == 0) {
            
            notifDanger('Échec de l\'opération.')
            return 0
        }

        if (_('#inpModalAdresselivraisonidsociete').value.replace(/\s/g, '') == '' || _('#inpModalAdresselivraisonidsociete').value == 0) {
            
            notifDanger('Échec de l\'opération.')
            $('#ModalAdresselivraison').modal('hide')
            return 0
        }

        loaderIcon(elmt, 'bx bx-edit')

        newEditAdresseLivraison()
            .then((response) => {

                if (response.success == 2) {
                    
                    notifSuccess('Opération éffectuée avec succès.')
                    chargerTableAdresseLivraisonSociete(_('#inpModalAdresselivraisonidsociete').value)
                }

                loaderIcon(elmt, 'bx bx-edit')
            }).catch(() => loaderIcon(elmt, 'bx bx-edit'))
    })

    $(document).on('click', '#btnModalSupAdresseLivraisonSocieteClient', function(){

        idadresse_livraison = $(this).attr('data-id')

        const swalWithBootstrapButtons = Swal.mixin({
            customClass: {
                confirmButton: 'btn btn-danger ms-2',
                cancelButton: 'btn btn-dark'
            },
            buttonsStyling: false
        })

        swalWithBootstrapButtons.fire({
            title: 'Êtes-vous sûres ?',
            text: "De vouloirs retirer cette offre spéciale !",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Je confirme !',
            cancelButtonText: 'Non !',
            reverseButtons: true
        }).then((result) => {

            if (result.isConfirmed) {

                suppressionAdresseLivraison(idadresse_livraison)
                    .then((response) => {

                        if (response.success == 1) {
                            
                            SwitAlert('error', response.msg, 'center')
                        }else if(response.success == 2){

                            chargerTableAdresseLivraisonSociete(_('#inpModalAdresselivraisonidsociete').value)
                            notifSuccess('Suppression éffectuée.')
                        }
                    })
            }
        })
    })
</script>

<!-- Script liste membres gestionnaire -->
<script>
$(document).ready(function(){

    var tableListMembres = $('#tableListMembres').DataTable({
        language: {
            processing: false,
            lengthMenu: "Afficher :&nbsp; _MENU_ lignes",
            info: "Ligne _START_ à _END_ sur _TOTAL_",
            infoEmpty: "Ligne 0 à 0 sur 0",
            infoFiltered: "(filtré de _MAX_ éléments au total)",
            loadingRecords: "Chargement en cours...",
            zeroRecords: '<img style="height:150px;" src="/assets/images/fondTable.png" alt="Aucun membre trouvé" />',
            emptyTable: '<img style="height:150px;" src="/assets/images/fondTable.png" alt="Aucun membre trouvé" />',
            paginate: { first: "", previous: "Précédent", next: "Suivant", last: "" },
            search: "",
            searchPlaceholder: "Rechercher..."
        },
        order: [],
        columns: [
            { data: null, orderable: false, className: 'text-center' },
            { data: 'nom', className: 'text-start' },
            { data: 'prenoms', className: 'text-start' },
            { data: 'email', className: 'text-start' },
            { data: 'telephone', className: 'text-center' }
        ],
        columnDefs: [{
            targets: 0,
            render: function(data, type, row) {
                return `<button class="btn btn-sm btn-danger btnRetirerMembre" data-id="${row.idusers}" title="Retirer">
                            <i class="bx bx-trash"></i>
                        </button>`;
            }
        }]
    });

    function chargerListeMembres(idgestionnaire) {
        $.ajax({
            url: "{{ route('subordonne.list') }}",
            type: 'GET',
            data: { idgestionnaire: idgestionnaire },
            dataType: 'json',
            success: function(response) {
                tableListMembres.clear();
                if (response.success == 1) {
                    // fermer modal utilisateur
                    $('#modalUtilisateur').modal('hide');
                    tableListMembres.rows.add(response.data).draw();
                } else {
                     $('#modalUtilisateur').modal('hide');
                    tableListMembres.draw();
                }
            },
            error: function() { notifErrorAjax(); }
        });
    }

    $(document).on('click', '#btnListMembers', function() {
        let idusers = $(this).data('id');
        let nomComplet = $(this).data('nomcomplet') || 'Gestionnaire';

        $('#idGestionnaireListMembres').val(idusers);
        $('#titreModalListMembres').text('Membres de ' + nomComplet);
        chargerListeMembres(idusers);
        typerModal('#modalListMembres', 'Membres de ' + nomComplet, 'primary', true);
        $('#modalListMembres').modal('show');
    });

    $(document).on('click', '.btnRetirerMembre', function() {
        let idusers_cible = $(this).data('id');
        let idgestionnaire = $('#idGestionnaireListMembres').val();

        const swalWithBootstrapButtons = Swal.mixin({
            customClass: { confirmButton: 'btn btn-danger ms-2', cancelButton: 'btn btn-dark' },
            buttonsStyling: false
        });

        swalWithBootstrapButtons.fire({
            title: 'Retirer ce membre ?',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Confirmer',
            cancelButtonText: 'Annuler',
            reverseButtons: true
        }).then(function(result) {
            if (result.isConfirmed) {
                $.ajax({
                    url: "{{ route('subordonne.retirer') }}",
                    type: 'GET',
                    data: { idgestionnaire: idgestionnaire, idusers_cible: idusers_cible },
                    dataType: 'json',
                    success: function(response) {
                        if (response.success == 2) {
                            notifSuccess(response.msg);
                            chargerListeMembres(idgestionnaire);
                        } else {
                            notifDanger(response.msg || 'Échec de l\'opération.');
                        }
                    },
                    error: function() { notifErrorAjax(); }
                });
            }
        });
    });

    $('#btnFermerModalListMembres').on('click', function() {
       //ouvrir modal utilisateur
        $('#modalUtilisateur').modal('show');
       // $('#modalListMembres').modal('hide');

    });
});
</script>

@endsection