@extends('models')
@section('titre-page', 'Agences de laboratoire')
@section('content-body')

<!-- Page Header -->
<div class="d-md-flex d-block align-items-center justify-content-between mt-4 page-header-breadcrumb">
    <!-- Start:: row-7 -->
    <div class="col-xl-12 col-12">
        <div class="row mb-3">
            <div class="col-xl-10 col-lg-8 col-md-8 mt-2">
                <nav>
                    <ol class="breadcrumb mb-0">
                        <li class="breadcrumb-item text-light"><a href="javascript:void(0);">Administration</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Agences de laboratoire</li>
                    </ol>
                </nav>
            </div>
        </div>
    </div>
</div>
<!-- Page Header Close -->

<div class="row">
    <div class="col-xl-12">
        <div class="card custom-card">

            <div class="card-body row">
                <div class="col-md-6 mb-1">
                    <form id="formAGENCELABORATOIRE">
                        <div class="row">
                            <div class="col-md-11 row">
                                <div class="col-xl-5">
                                    <p class="mb-0 text-muted">Agence de laboratoire&nbsp;:</p>
                                    <input type="text" class="form-control" id="NomAgenceLaboratoire" name="NomAgenceLaboratoire">
                                </div>
                                <div class="col-xl-7">
                                    <p class="mb-0 text-muted">Email de l'agence&nbsp;:</p>
                                    <input type="text" class="form-control" id="AdresseEmailAgence" name="AdresseEmailAgence">
                                </div>
                                <div class="col-xl-6">
                                    <p class="mb-0 text-muted">Montant&nbsp;:</p>
                                    <input type="number" class="form-control text-end" id="MontantPrestationLaboratoire" name="MontantPrestationLaboratoire">
                                </div>
                                <div class="col-xl-6 pt-2">
                                    <div class="card mt-2" style="height: 35px;">
                                        <div class="card-body d-flex py-2">
                                            <input type="checkbox" class="form-check-input me-2" id="AccesStatistiqueEclatee" name="AccesStatistiqueEclatee">
                                            <p class="text-muted ellipsis" title="Accès statistique éclaté" for="AccesStatistiqueEclatee">Accès statistique éclaté</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-1 pt-1">
                                <button type="button" class="btn btn-success btn-icon btn-wave mt-3 mb-2" id="btnNewAGENCELABORATOIRE">
                                    <i class="bx bx-plus" style="font-size:13px;"></i>
                                </button>
                                <button type="button" class="btn btn-warning btn-icon btn-wave mt-3 mb-2" id="btnEditAGENCELABORATOIRE" style="display: none;">
                                    <i class="bx bx-edit" style="font-size:13px;"></i>
                                </button>
                                <button type="button" class="btn btn-danger btn-icon btn-wave" id="btnAnnuler">
                                    <i class="bx bx-x-circle" style="font-size:13px;"></i>
                                </button>
                            </div>
                        </div>
                    </form>
                    <div class="table-responsive">
                        <table class="tablehover table table-striped text-nowrap w-100" id="tableAgenceLaboratoire">
                            <thead class="table-header-primary">
                                <tr>
                                    <th data-orderable="false" style="width: 10px">
                                        <input class="form-check-input me-1" type="checkbox" id="checkSelectAll">
                                        Actions
                                    </th>
                                    <th data-orderable="false" class="text-center colTable">Liste des agences laboratoires</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
                <div class="col-md-6">
                    <nav class="nav nav-style-1 nav-pills mb-3" role="tablist">
                        <a class="nav-link active" data-bs-toggle="tab" role="tab" aria-current="page" href="#nav-labo" aria-selected="true">Laboratoires</a>
                        <a class="nav-link" data-bs-toggle="tab" role="tab" href="#nav-produits" aria-selected="false">Produits</a>
                    </nav>
                    <input type="number" style="display : none;" id="IDAGENCELABORATOIRE">
                    <div class="tab-content">
                        <div class="tab-pane text-muted show active" id="nav-labo" role="tabpanel">
                            <div class="row">
                                <div class="col-md-8">
                                    <select name="IDLABORATOIRE" id="IDLABORATOIRE">

                                    </select>
                                </div>
                                <div class="col-md-4 d-flex">
                                    <button class="btn btn-success-light w-100" id="btnAjouterLabo">
                                        <i class="bx bx-plus" style="font-size : 15px;"></i> Ajouter
                                    </button>
                                </div>
                            </div>
                            <table class="tablehover table table-striped text-nowrap w-100" id="tableListeLabo">
                                <thead class="table-header-primary">
                                    <tr>
                                        <th class="text-center colTable">Action</th>
                                        <th class="text-center colTable">Liste des laboratoires</th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                        <div class="tab-pane text-muted" id="nav-produits" role="tabpanel">
                            <div class="row">
                                <div class="col-md-8">
                                    <select name="IDPRODUIT" id="IDPRODUIT">

                                    </select>
                                </div>
                                <div class="col-md-4 d-flex">
                                    <button class="btn btn-success-light w-100" id="btnAjouterProduit">
                                        <i class="bx bx-plus" style="font-size : 15px;"></i> Ajouter
                                    </button>
                                </div>
                            </div>
                            <table class="tablehover table table-striped text-nowrap w-100" id="tableListeProduit">
                                <thead class="table-header-primary">
                                    <tr>
                                        <th class="text-center colTable" data-orderable="false">Action</th>
                                        <th class="text-center colTable" data-orderable="false">Liste des produits</th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Section modal --}}
<!-- Modal de compte utilisateur extranet -->
<div class="modal fade" id="modalUTILISATEUREXTRANET" tabindex="-1" aria-labelledby="exampleModalFullscreenLabel" aria-hidden="true" style="display: none;">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="titleUTILISATEUREXTRANET">Nouvel utilisateur extranet</h6>
                <button type="button" class="btn-close bg-light" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form id="formModalUTILISATEUREXTRANET">
                    <div class="row">
                        <input type="number" id="IDUTILISATEUREXTRANETModalUTILISATEUREXTRANET" name="IDUTILISATEUREXTRANETModalUTILISATEUREXTRANET" style="display : none;">
                        <div class="col-md-12 mb-2" id="divClientModalUTILISATEUREXTRANET">
                            <p class="mb-0 text-muted">Client&nbsp;:</p>
                            <select class="js-example-basic-single form-select" id="IDCLIENTModalUTILISATEUREXTRANET" name="IDCLIENTModalUTILISATEUREXTRANET">

                            </select>
                        </div>
                        <div class="col-md-12 mb-2" id="divLaboModalUTILISATEUREXTRANET">
                            <p class="mb-0 text-muted">Agence laboratoire&nbsp;:</p>
                            <select class="js-example-basic-single form-select" id="IDAGENCELABORATOIREModalUTILISATEUREXTRANET" name="IDAGENCELABORATOIREModalUTILISATEUREXTRANET">

                            </select>
                        </div>
                        <div class="col-md-12 mb-2">
                            <p class="text-muted mb-0">Nom de l'utilisateur</p>
                            <input type="text" class="form-control" id="NomPrenomUtilisateur" name="NomPrenomUtilisateur">
                        </div>
                        <div class="col-md-7 mb-2">
                            <p class="text-muted mb-0">Login</p>
                            <input type="text" class="form-control" id="LoginUtilisateur" name="LoginUtilisateur">
                        </div>
                        <div class="col-md-5 mt-2 pt-2">
                            <div class="card" style="height: 35px">
                                <div class="card-body py-2 d-flex">
                                    <input type="checkbox" class="form-check-input me-2" id="D_SuperUtlisateur" name="D_SuperUtlisateur">
                                    <p class="text-muted" for="D_SuperUtlisateur">Super utilisateur</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-7 mb-2">
                            <p for="MPssePersonnel" class="text-muted mb-0">Mot de passe</p>
                            <div class="input-group">
                                <input type="password" class="form-control form-control-lg" id="PhraseUtilisateur" name="PhraseUtilisateur" placeholder="Mot de passe de l'utilisateur">
                                <button class="btn btn-light" type="button" onclick="createpassword('MPssePersonnel',this)" id="button-addon2"><i class="ri-eye-off-line align-middle"></i></button>
                            </div>
                        </div>
                        <div class="col-md-5 mt-2 pt-2">
                            <div class="card" style="height: 43px">
                                <div class="card-body d-flex" style="padding-top: 10px;">
                                    <input type="checkbox" class="form-check-input me-2" id="CompteBloque" name="CompteBloque">
                                    <p class="text-muted" for="CompteBloque">Désactivé</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-7">
                            <p class="text-muted mb-0">Première fenêtre après chargement :</p>
                            <select class="form-select" name="PremierePageApresConnexion" id="PremierePageApresConnexion">
                                <option value="0">NON DÉFINI</option>
                                <option value="1">ESPACE COMMANDE</option>
                                <option value="2">CATALOGUE PRODUIT</option>
                                <option value="3">ESPACE RECLAMATION</option>
                                <option value="4">ESPACE BLV</option>
                                <option value="5">ESPACE RELEVE</option>
                                <option value="6">TABLEAU DE BORD</option>
                            </select>
                        </div>
                        <div class="col-md-5">
                            <p class="text-muted mb-0">Administrateur</p>
                            <div class="card" style="height: 35px">
                                <div class="card-body d-flex py-2">
                                    <input type="checkbox" class="form-check-input me-2" id="D_AdministrateurExtranet" name="D_AdministrateurExtranet">
                                    <p class="text-muted" for="D_AdministrateurExtranet">Extranet</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" id="btnNewUTILISATEUREXTRANET">
                    <i class='bx bxs-plus-circle'></i>
                    Ajouter
                </button>
                <button type="button" class="btn btn-warning" id="btnEditUTILISATEUREXTRANET">
                    <i class="bx bx-edit fs-6 me-1"></i>
                    Modifier
                </button>
            </div>
        </div>
    </div>
</div>


@endsection
@section('script')

<!-- Script exécuté au chargement -->
<script>

    var listeIDProduitsAGENCELABORATOIREbase = []
    var listeIDLaboratoireAGENCELABORATOIRE = []

    var tableListeLabo
    var tableListeProduit
    
    function chargertableAgenceLaboratoire() {

        $.ajax({

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

                if (response.success == 1) {

                    let obj = response.data

                    $("#tableAgenceLaboratoire").DataTable().destroy()
                    tableAgenceLaboratoire = $("#tableAgenceLaboratoire").DataTable({

                        bFilter: true,
                        language: {
                            // dom: 'Bfrtip',
                            processing: false,
                            lengthMenu: "Afficher :&nbsp; _MENU_ lignes",
                            info: "Ligne _START_ à _END_ sur _TOTAL_",
                            infoEmpty: "Affichage de l'&eacute;lement 0 &agrave; 0 sur 0 &eacute;l&eacute;ments",
                            infoFiltered: "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                            infoPostFix: "",
                            loadingRecords: "Chargement en cours...",
                            zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                            emptyTable: tableVide,

                            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;:",
                        },
                        pageLength: 25,
                        lengthChange : false,
                        "data": obj,
                        'columns': [

                            {
                                data: 'action',
                                className: 'text-center'
                            },
                            {
                                data: 'NomAgenceLaboratoire'
                            }
                        ],
                        initComplete: function(settings, json) {
                        
                            completeHandler()
                        }
                    })

                    divShowPer = $('#tableAgenceLaboratoire_filter')
                    let BroDivShowPer = divShowPer.parent().prev()
                    BroDivShowPer.addClass('d-flex')
                    BroDivShowPer.append(
                        `
                    <span class="d-flex align-items-center px-2" style="cursor : pointer;">
                                <i class='ri ri-file-excel-2-line text-success me-1' style="font-size : 18px; cursor : pointer;"></i>
                                <span id="btn-export-liste-labo-excel" class="fw-bold" style="cursor : pointer;">Exporter</span>
                            </span>
                    `
                    )
                } else {

                    notifError(response.msg)
                    completeHandler()
                }
            },
            error: function(error) {
                notifError(error)
                completeHandler()
            }
        })
    }

    chargertableAgenceLaboratoire()

    function chargerTableLabo(data){

        listeIDLaboratoireAGENCELABORATOIRE = data.map(objet => objet.IDLABORATOIRE)

        $("#tableListeLabo").DataTable().destroy()
        tableListeLabo = $("#tableListeLabo").DataTable({

            bFilter: false,
            language: {
                // dom: 'Bfrtip',
                processing: false,
                lengthMenu: "Afficher :&nbsp; _MENU_ lignes",
                info: "Ligne _START_ à _END_ sur _TOTAL_",
                infoEmpty: "Ligne 0 à 0 sur 0",
                infoFiltered: "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                infoPostFix: "",
                loadingRecords: "Chargement en cours...",
                zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable: tableVide,

                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;:",
            },
            pageLength: 25,
            lengthChange : false,
            "data": data,
            'columns': [
                {
                    data: 'action',
                    className : 'text-center'
                },
                {
                    data: 'NomLaboratoire'
                }
            ],
            initComplete: function(settings, json) {
            
                completeHandler()
            }
        })

  
    }

    function chargerTableProduit(data){
        
        listeIDProduitsAGENCELABORATOIREbase = data.map(objet => objet.IDPRODUIT)

        $("#tableListeProduit").DataTable().destroy()
        tableListeProduit = $("#tableListeProduit").DataTable({

            bFilter: false,
            language: {
                // dom: 'Bfrtip',
                processing: false,
                lengthMenu: "Afficher :&nbsp; _MENU_ lignes",
                info: "Ligne _START_ à _END_ sur _TOTAL_",
                infoEmpty: "Ligne 0 à 0 sur 0",
                infoFiltered: "(filtr&eacute; de _MAX_ &eacute;l&eacute;ments au total)",
                infoPostFix: "",
                loadingRecords: "Chargement en cours...",
                zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable: tableVide,

                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;:",
            },
            pageLength: 25,
            lengthChange : false,
            "data": data,
            'columns': [
                {
                    data: 'action',
                    className : 'text-center'
                },
                {
                    data: 'DesignationProduit',
                }
            ],
            initComplete: function(settings, json) {
            
                completeHandler()
            }
        })
    }

    function chargerSelectLabo(valeur) {

        $.ajax({

            url: '{{ route("listingLaboSimple") }}',
            type: 'GET',
            dataType: 'json',
            success: function(response) {

                $('#IDLABORATOIRE').html('')
                $('#IDLABORATOIRE').append('<option value="0">SELECTIONNER UN LABO</option>')

                $.each(response.data, function(key, value) {

                    $('#IDLABORATOIRE').append('<option value="' + value["IDLABORATOIRE"] + '">' + value[
                        "NomLaboratoire"] + '</option>')
                })

                $('#IDLABORATOIRE').select2()

                $('#IDLABORATOIRE').val(valeur).trigger('change')
            }
        })
    }

    function chargerSelectProduit(valeur) {

        $.ajax({

            url: '{{ route("listingProduitSimple") }}',
            type: 'GET',
            dataType: 'json',
            success: function(response) {

                $('#IDPRODUIT').html('')
                $('#IDPRODUIT').append('<option value="0">SELECTIONNER LE PRODUIT</option>')

                $.each(response.data, function(key, value) {

                    $('#IDPRODUIT').append('<option value="' + value["IDPRODUIT"] + '">' + value[
                        "DesignationProduit"] + '</option>')
                })

                $('#IDPRODUIT').select2()

                $('#IDPRODUIT').val(valeur).trigger('change')
            }
        })
    }

    data = []
    chargerTableProduit(data)
    chargerTableLabo(data)
    chargerSelectLabo(0)
    chargerSelectProduit(0)

    function infoAGENCELABORATOIRE(IDAGENCELABORATOIRE){

        $.ajax({

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

                if (response.success == 2) {

                    let objLabo = response.dataLaboratoires
                    let objProduit = response.dataProduit

                    _('NomAgenceLaboratoire').value = response.info.NomAgenceLaboratoire
                    _('AdresseEmailAgence').value = response.info.AdresseEmailAgence
                    _('MontantPrestationLaboratoire').value = response.info.MontantPrestationLaboratoire
                    _('AccesStatistiqueEclatee').checked = response.info.AccesStatistiqueEclatee
                    
                    chargerTableLabo(objLabo)
                    chargerTableProduit(objProduit)
                    
                } else if(response.success == 1){

                    notif('danger', 'Erreur', 'Agence laboratoire non identifiée')
                } else {

                    notifError(response.msg)
                    completeHandler()
                }
            },
            error: function(error) {
                notifError(error)
                completeHandler()
            }
        })
    }

    // Info droit de l'utilisateur
    $(document).on('click', '#infoAGENCELABORATOIRE', function(){

        let ligne = $(this).parent().parent()
        let IDAGENCELABORATOIRE = $(this).attr('data-id')

        if (ligne.css('background-color') !== 'rgb(194, 224, 233)') {

            _('btnNewAGENCELABORATOIRE').style.display = 'none'
            _('btnEditAGENCELABORATOIRE').style.display = ''

            let lignes = tableAgenceLaboratoire.rows().nodes()

            $.each(lignes, function(key, value){

                value.style.background = ''
            })

            ligne.css({'background-color' : '#C2E0E9'})

            infoAGENCELABORATOIRE(IDAGENCELABORATOIRE)
        }else{

            _('btnNewAGENCELABORATOIRE').style.display = ''
            _('btnEditAGENCELABORATOIRE').style.display = 'none'

            _('NomAgenceLaboratoire').value = ''
            _('AdresseEmailAgence').value = ''
            _('MontantPrestationLaboratoire').value = ''
            _('AccesStatistiqueEclatee').checked = false

            ligne.css({'background-color' : ''})
            IDEXPEDITIONCLIENT = 0
            
            chargerTableProduit([])
            chargerTableLabo([])
        }

        _('IDAGENCELABORATOIRE').value = IDAGENCELABORATOIRE
    })

    // boutton annuler
    _('btnAnnuler').addEventListener('click', function(){

        let lignes = tableAgenceLaboratoire.rows().nodes()

        $.each(lignes, function(key, value){

            value.style.background = ''
        })

        _('NomAgenceLaboratoire').value = ''
        _('AdresseEmailAgence').value = ''
        _('MontantPrestationLaboratoire').value = ''
        _('AccesStatistiqueEclatee').checked = false
        _('IDAGENCELABORATOIRE').value = 0

        _('btnNewAGENCELABORATOIRE').style.display = ''
        _('btnEditAGENCELABORATOIRE').style.display = 'none'

        chargerTableProduit([])
        chargerTableLabo([])
    })
</script>

<!-- Script new agence laboratoire -->
<script>

    // Ajouter labo
    _('btnAjouterLabo').addEventListener('click', function(){

        let IDLABORATOIRE = _('IDLABORATOIRE').value

        if (listeIDLaboratoireAGENCELABORATOIRE.includes(parseInt(IDLABORATOIRE))) {
            
            notif('danger', 'Erreur', 'Ce laboratoire est déjà attribué à cette agence de laboratoire')
            return 0
        }

        action = '<a class="btn btn-sm btn-icon btn-outline-danger me-2" id="supLab" type="local" data-id="'+IDLABORATOIRE+ '">\
                    <i class="bx bxs-trash" style="font-size : 17px;cursor : pointer;"></i>\
                </a>'

        NomLaboratoire = afficherOptionSelectionnee('IDLABORATOIRE')
        newRow = { IDLABORATOIRE : IDLABORATOIRE, action : action, NomLaboratoire : NomLaboratoire}

        tableListeLabo.row.add(newRow).draw();

        listeIDLaboratoireAGENCELABORATOIRE.push(parseInt(IDLABORATOIRE))
    })

    // supprimer ligne de labo
    $(document).on('click', '#supLab', function(){

        let IDLABORATOIRE = $(this).data('id');

        // Supprimer l'ID du laboratoire de la liste
        let index = listeIDLaboratoireAGENCELABORATOIRE.indexOf(parseInt(IDLABORATOIRE));
        if (index !== -1) {
            listeIDLaboratoireAGENCELABORATOIRE.splice(index, 1);
        }

        let ligne = $(this).closest('tr'); // Sélectionne la ligne parente (tr) de l'élément cliqué
        let index1 = tableListeLabo.row(ligne).index(); // Obtient l'index de la ligne dans le DataTable
        tableListeLabo.row(index1).remove().draw(); // Supprime la ligne du DataTable et met à jour l'affichage
    })

    // Ajouter produit 
    _('btnAjouterProduit').addEventListener('click', function(){

        let IDPRODUIT = _('IDPRODUIT').value

        if (listeIDProduitsAGENCELABORATOIREbase.includes(parseInt(IDPRODUIT))) {
            
            notif('danger', 'Erreur', 'Ce produit est déjà attribué à cette agence de laboratoire')
            return 0
        }

        action = '<a class="btn btn-sm btn-icon btn-outline-danger me-2" id="supProd" type="local" data-id="'+IDPRODUIT+ '">\
                    <i class="bx bxs-trash" style="font-size : 17px;cursor : pointer;"></i>\
                </a>'

        DesignationProduit = afficherOptionSelectionnee('IDPRODUIT')
        newRow = { IDPRODUIT : IDPRODUIT, action : action, DesignationProduit : DesignationProduit}

        tableListeProduit.row.add(newRow).draw();

        listeIDProduitsAGENCELABORATOIREbase.push(parseInt(IDPRODUIT))
    })

    // supprimer ligne de labo
    $(document).on('click', '#supProd', function(){

        let IDPRODUIT = $(this).data('id');

        // Supprimer l'ID du laboratoire de la liste
        let index = listeIDProduitsAGENCELABORATOIREbase.indexOf(parseInt(IDPRODUIT));
        if (index !== -1) {
            listeIDProduitsAGENCELABORATOIREbase.splice(index, 1);
        }

        let ligne = $(this).closest('tr'); // Sélectionne la ligne parente (tr) de l'élément cliqué
        let index1 = tableListeProduit.row(ligne).index(); // Obtient l'index de la ligne dans le DataTable
        tableListeProduit.row(index1).remove().draw(); // Supprime la ligne du DataTable et met à jour l'affichage

        console.log(listeIDProduitsAGENCELABORATOIREbase)
    })

    _('btnNewAGENCELABORATOIRE').addEventListener('click', function(){

        if (_('NomAgenceLaboratoire').value.replace(/\s/g, '') == '') {
            
            notif('danger', 'Erreur', 'Veuillez saisir un nom agence')
            return 0
        }

        if (_('AdresseEmailAgence').value.replace(/\s/g, '') == '') {
            
            notif('danger', 'Erreur', 'Veuillez saisir une adresse mail')
            return 0
        }

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

        ListeProduitLaboratoire = ''

        listeIDProduitsAGENCELABORATOIREbase.forEach( function(value){

            ListeProduitLaboratoire += value+';'
        })

        ListeLaboratoireProduit = ''

        listeIDLaboratoireAGENCELABORATOIRE.forEach( function(value){

            ListeLaboratoireProduit += value+';'
        })

        formAGENCELABORATOIRE.append('ListeLaboratoireProduit', ListeLaboratoireProduit.slice(0, -1))
        formAGENCELABORATOIRE.append('ListeProduitLaboratoire', ListeProduitLaboratoire.slice(0, -1))

        $.ajax({

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

                if (response.success == 1) {
                    
                    notif('danger', 'Erreur', 'Ce nom d\'agence est déjà utilisé')
                }else if( response.success == 2){

                    notif('success', 'Succès', 'Enregistrement éffectué')
                    _('btnAnnuler').click()
                    chargertableAgenceLaboratoire()

                    chargerTableLabo([])
                    chargerTableProduit([])
                }

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

                notifError(error)
                completeHandler()
            }
        })
    })
</script>

<!-- Script de modification agence laboratoire -->
<script>

    _('btnEditAGENCELABORATOIRE').addEventListener('click', function(){

        if (_('IDAGENCELABORATOIRE').value.replace(/\s/g, '') == '' || _('IDAGENCELABORATOIRE').value == 0) {
            
            notif('danger', 'Erreur', 'Veuillez sélectionner une agence de laboratoire')
            _('btnAnnuler').click()
            return 0
        }

        if (_('NomAgenceLaboratoire').value.replace(/\s/g, '') == '') {
            
            notif('danger', 'Erreur', 'Veuillez saisir un nom agence')
            return 0
        }

        if (_('AdresseEmailAgence').value.replace(/\s/g, '') == '') {
            
            notif('danger', 'Erreur', 'Veuillez saisir une adresse mail')
            return 0
        }

        let formAGENCELABORATOIRE = new FormData(_('formAGENCELABORATOIRE'))
        formAGENCELABORATOIRE.append('_token', '{{ csrf_token() }}')
        formAGENCELABORATOIRE.append('IDAGENCELABORATOIRE', _('IDAGENCELABORATOIRE').value)

        ListeProduitLaboratoire = ''

        listeIDProduitsAGENCELABORATOIREbase.forEach( function(value){

            ListeProduitLaboratoire += value+';'
        })

        ListeLaboratoireProduit = ''

        listeIDLaboratoireAGENCELABORATOIRE.forEach( function(value){

            ListeLaboratoireProduit += value+';'
        })

        formAGENCELABORATOIRE.append('ListeLaboratoireProduit', ListeLaboratoireProduit.slice(0, -1))
        formAGENCELABORATOIRE.append('ListeProduitLaboratoire', ListeProduitLaboratoire.slice(0, -1))

        $.ajax({

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

                if (response.success == 1) {
                    
                    notif('danger', 'Erreur', 'Ce nom d\'agence est déjà utilisé')
                }else if( response.success == 2){

                    notif('success', 'Succès', 'Modification éffectué')
                    _('btnAnnuler').click()
                    chargertableAgenceLaboratoire()

                }

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

                notifError(error)
                completeHandler()
            }
        })
    })

        $(document).on('click','#btn-export-liste-labo-excel',function(){
            var data =  remplissage_avec_data_columns_DataTable('tableAgenceLaboratoire')
            const filename =file_name("LISTE_LABO");
            download_excel_file('{{route("export_global_excel.export")}}', data, filename)
        })
   
</script>

@endsection