@extends('models')
@section('titre-page', 'Catalogue produit')
@section('content-body')
    <!-- Start::app-content -->
    <style>
        #tableAgences td,
        #tableAgences th {
            padding: 6px;
        }

        #tableProduit td {
            padding: 0.3rem !important;
        }

        .style-check {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
        }

        .height-input {
            height: 2.5rem !important;
        }

        p.principeActif:hover {

            text-decoration: underline;
            color: #2d58ce;
        }
    </style>

        {{-- @php
        $modeGPHARMA = ModeGpharma();
        @endphp --}}

    @if(isset($CMU))
         <input type="hidden" value="true" class="form-control text-uppercase" id="checkCmu">
    @else
         <input type="hidden" value="false"  class="form-control text-uppercase" id="checkCmu">
    @endif

    <!-- 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-7 col-md-4 mt-2">
                    <nav>
                        <ol class="breadcrumb mb-0">
                             @if(isset($CMU))
                                <li class="breadcrumb-item text-light"><a href="javascript:void(0);">CMU</a></li>
                            @else
                              <li class="breadcrumb-item text-light"><a href="javascript:void(0);">Produit</a></li>
                            @endif

                            <li class="breadcrumb-item active" aria-current="page">Catalogue produit</li>
                        </ol>
                    </nav>
                </div>
                <div class="col-xl-5 col-md-8">
                    <div class="row justify-content-end">
                        <div class="col-xl-5 col-lg-6 col-sm-6 col-8">
                            <button type="button" class="btn btn-secondary-light btn-wave d-flex justify-content-center w-100"
                                id="btnNewProduit">
                                <i class=" ri ri-add-circle-line me-1"></i>Nouveau produit
                            </button>
                        </div>
                        <div class="col-xl-4 col-lg-6 col-sm-6 col-4">
                            <div class="btn-group" style="margin-top : 1px;">
                                <button type="button" class="btn btn-primary-light dropdown-toggle"
                                    data-bs-toggle="dropdown" data-bs-auto-close="inside" aria-expanded="false">
                                    Autres actions
                                </button>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a class="dropdown-item imprimerEtiquetteProduitSelect" >
                                            Imprimer les étiquettes
                                        </a>
                                    </li>
                                    <li>
                                        <hr class="dropdown-divider">
                                    </li>
                                   
                                    <li>
                                        <a class="dropdown-item" id="ListingProduitStockLot">
                                            Listing produit avec stock par lot
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" id="ListingProduitStockLotSansEmplacement">
                                            Listing produit avec stock par lot sans emplacement
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" id="btnExportListings">
                                            Exporter le listing
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" id="actualiseStockProduitsSelect">
                                            Actualiser le stock des produits sélectionnés
                                        </a>
                                    </li>
                                    <li>
                                        <hr class="dropdown-divider">
                                    </li>
                                    <li>
                                        <a class="dropdown-item" style="cursor : pointer;" id="btnModalSelectProduitPourFusion">
                                            Fusionner les produits sélectionnés
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Page Header Close -->

    <div class="row">
        <div class="col-xl-3">
            <div class="card custom-card border-top-card border-top-primary rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Nbre de produit</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="nbreProduit">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-info rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Nbre de boîte</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="nbreBoite">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-warning rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur PFHT</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurPFHT">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-danger rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur PGHT</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurPGHT">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3">
            <div class="card custom-card border-top-card border-top-success rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur P. revient </p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurPRevient">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3">
            <div class="card custom-card border-top-card border-top-success rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur PRMP</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurPRMP">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-danger rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">PRMP/PFHT</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="prmpPfht">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-info rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur Cess. HT</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurCessionHT">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-2">
            <div class="card custom-card border-top-card border-top-warning rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted mb-1">Valeur Ces. TTC</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="valeurCessionTTC">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3">
            <div class="card custom-card border-top-card border-top-primary rounded-0">
                <div class="card-body p-3 py-2">
                    <div class="text-center">
                        <p class="fs-14 text-muted fw-semibold mb-1">Marge</p>
                        <div class="d-flex align-items-center justify-content-center flex-wrap">
                            <h6 class="mb-0 fw-semibold" id="marge">0</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
      
        <div class="col-xl-12">
            <div class="card custom-card">
                <div class="card-header pe-0 pe-0">
                    <div class="row w-100">

                        <div class="col-xl-2 col-md-2 mb-2">
                            <p class="mb-0 text-muted">Site</p>
                            <select class="form-select" name="filtreAgence" id="filtreAgence" @disabled(checkIfDroit('DG_AccesMultiSite'))>
                            </select>
                        </div>
                        <div class="col-xl-3 col-md-4 mb-0">
                            <p class="mb-0 text-muted">Code ou désignation recherchée</p>
                            <input type="text" class="form-control text-uppercase" autocomplete="off" name="filtreCode" id="filtreCode">
                        </div>
                        <div class="col-xl-1 col-md-1 mb-0  pt-1">
                            <button type="button" class="btn btn-primary btn-wave mt-2" id="btnFiltreTable">
                                <i class='bx bx-search-alt' style="font-size:13px; cursor:pointer;"></i>
                            </button>
                        </div>
                        <div class="col-xl-6 col-md-5 d-flex justify-content-end align-items-center">
                            <div class="d-flex">
                                <i class='bx bx-git-merge me-2 fw-bold text-info principeActif'
                                    style="font-size: 17px;margin-top: 1px;cursor:pointer;"></i>
                                <p class="fw-bold principeActif" style="font-size: 13px;cursor:pointer;">
                                    Liste des principes actifs / Produit
                                </p>
                            </div>
                        </div>
                        <div class="accordion accordion-flush mt-2" id="accordionFlushExample">
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="flush-headingOne">
                                    <button class="accordion-button collapsed pb-2" type="button"
                                        style="background: #FFD7DA;font-size : .78rem;" data-bs-toggle="collapse"
                                        data-bs-target="#flush-collapseOne" aria-expanded="false"
                                        aria-controls="flush-collapseOne">
                                        Autres options de filtre
                                    </button>
                                </h2>
                                <div id="flush-collapseOne" class="accordion-collapse collapse"
                                    aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
                                    <div class="accordion-body bg-tabs">

                                        <div class="row">
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Famille</p>
                                                <select class="form-select" name="filtreFamille" id="filtreFamille">
                                                    <option value="0">TOUS</option>
                                                    <option value="1">PHARMACIE</option>
                                                    <option value="2">PARAPHARMACIE</option>
                                                    <option value="3">CENTRE MEDICAL</option>
                                                    <option value="4">LABORATOIRE</option>
                                                    <option value="5">AUTRE</option>
                                                </select>
                                            </div>

                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Nature</p>
                                                <select class="form-select" name="filtreNature" id="filtreNature">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Laboratoire</p>
                                                <select class="form-select" name="filtreLaboratoire" id="filtreLaboratoire">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Statut</p>
                                                <select class="form-select" name="filtreStatut" id="filtreStatut">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Forme</p>
                                                <select class="form-select" name="filtreForme" id="filtreForme">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Fournisseur</p>
                                                <select class="form-select" name="filtreFournisseur" id="filtreFournisseur">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Stock</p>
                                                <select class="form-select" name="filtreStock" id="filtreStock">
                                                    <option value="">TOUS</option>
                                                    <option value=">">STOCK > 0</option>
                                                    <option value="<">STOCK < 0</option>
                                                    <option value="=">STOCK = 0</option>
                                                    <option value="<>">STOCK <> 0</option>
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Type de produit :</p>
                                                <select class="form-select" name="filtreZoneStockageProduit" id="filtreZoneStockageProduit">
                                                    <option value="0">TOUS</option>
                                                    <option value="1">NORMAL</option>
                                                    <option value="2">FROID</option>
                                                    <option value="3">SOUS-CLE</option>
                                                    <option value="4">LAIT & FARINE</option>
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Rack</p>
                                                <select class="form-select" name="filtreRack" id="filtreRack">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Emplacement</p>
                                                <select class="form-select" name="filtreEmplacement" id="filtreEmplacement">
                                                </select>
                                            </div>
                                            <div class="col-xl-4 col-md-3 mb-2">
                                                <p class="mb-0 text-muted">Principe actifs</p>
                                                <select class="form-select" id="IDPRINCIPEACTIF" name="IDPRINCIPEACTIF">
                                                </select>
                                            </div>

                                        </div>
                                        <div class=" row">
                                            <div class=" offset-xl-8 text-end  col-xl-4 col-md-3 mb-2">
                                                <button class=" btn btn-info-gradient" id="searchFiltre"> <i
                                                        class='bx bx-search-alt'></i>
                                                    Rechercher </button>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="tablehover table table-striped text-nowrap sopenModalProduit_ tablehover" id="tableProduit">
                            <thead class="table-header-primary">
                                <tr>
                                    {{-- <th  class="text-center">IDPRODUIT</th> --}}
                                    <th data-column="action" data-class="text-center" data-orderable="false">
                                        <input class="form-check-input" type="checkbox" style="margin-right:35px" id="checkSelectAll">
                                        Actions
                                    </th>
                                    <th data-column="" data-class="text-center" class="text-center colTable">AMM</th>
                                    <th data-column="CodeCipProduit1" data-class="text-center" class="text-center colTable">CIP 1</th>
                                    <th data-column="CodeCipProduit2" data-class="text-center" class="text-center colTable">CIP 2</th>
                                    <th data-column="" data-class="text-center" class="text-center colTable">Code EAN</th>
                                    <th data-column="" data-class="text-center" class="text-center colTable">Code Interne</th>
                                    <th data-column="" class="text-center colTable">Désignation</th>
                                    <th data-column="" data-class="text-center" class="text-center colTable" >Stock Total
                                    </th>
                                    <th data-class="text-center" class="text-center colTable" id="startColumn">Stock
                                        Transit TIZ</th>
                                    <th data-class="text-center" class="text-center colTable" id="endColumn">Stock Total Indisponible
                                    </th>
                                    <th data-class="text-center" class="text-center colTable">VM Produit</th>
                                    <th data-class="text-center" class="text-center colTable">Stock/VM</th>
                                    <th data-class="text-center" class="text-center colTable">Qté en TRF</th>
                                    <th data-class="text-center" class="text-center colTable">Seuil Mini.</th>
                                    <th data-class="text-center" class="text-center colTable">Seuil Maxi.</th>
                                    <th data-class="text-center" class="text-center colTable">Seuil Alerte Détail</th>
                                    <th data-class="text-center" class="text-center colTable">Qté Réappro. Détail</th>
                                    <th data-class="text-center" class="text-center colTable">Numéro AMM</th>
                                    <th data-class="text-center" class="text-center colTable">Date validité AMM</th>
                                    <th class="text-center colTable">Statut Achat</th>
                                    <th data-class="text-center" class="text-center colTable">Cat. ABC</th>
                                    <th data-class="text-start" class="text-center colTable">Famille</th>
                                    <th data-class="text-start" class="text-center colTable">Forme</th>
                                    <th data-class="text-start" class="text-center colTable">Nature</th>
                                    <th data-class="text-start" class="text-center colTable">Classe Thérapeutique</th>
                                    <th data-class="text-center" class="text-center colTable">Classification ATC</th>
                                    <th data-class="text-center" class="text-center colTable">Rubrique douanière</th>
                                    <th data-class="text-center" class="text-center colTable">Code douane</th>
                                    <th data-class="text-end" class="text-center colTable">PFHT</th>
                                    <th data-class="text-end" class="text-center colTable">PGHT</th>
                                    <th data-class="text-end" class="text-center colTable">P. Revient HT</th>
                                    <th data-class="text-end" class="text-center colTable">PRMP</th>
                                    <th data-class="text-center" class="text-center colTable">TVA</th>
                                    <th data-class="text-end" class="text-center colTable">P. Cession HT</th>
                                    <th data-class="text-end" class="text-center colTable">P. Cession TTC</th>
                                    <th data-class="text-end" class="text-center colTable colonnePrixAJoute" >P. Public TTC</th>
                                    <th data-class="text-center" class="text-center colTable">PSY</th>
                                    <th data-class="text-center" class="text-center colTable">P. Sociaux</th>
                                    <th data-class="text-center" class="text-center colTable">P. Liste</th>
                                    <th data-class="text-center" class="text-center colTable">ANS</th>
                                    <th data-class="text-center" class="text-center colTable">Type produit</th>
                                    <th data-class="text-center" class="text-center colTable">Bureau d'achat</th>
                                    <th class="text-center colTable">Fournisseur</th>
                                    <th class="text-center colTable">Laboratoire</th>
                                    <th data-class="text-center" class="text-center colTable">Colisage</th>
                                    <th data-class="text-center" class="text-center colTable">Cartonnage</th>
                                    <th data-class="text-center" class="text-center colTable">Type Min. Cde</th>
                                    <th data-class="text-center" class="text-center colTable">Qté Arrondi Cde</th>
                                    <th data-class="text-center" class="text-center colTable">Volume</th>
                                    <th data-class="text-center" class="text-center colTable">Poids</th>
                                    <th data-class="text-center" class="text-center colTable">Type d'expédition</th>
                                    <th data-class="text-end" class="text-center colTable">Total PFHT</th>
                                    <th data-class="text-end" class="text-center colTable">Total PGHT</th>
                                    <th data-class="text-end" class="text-center colTable">Total P. Revient</th>
                                    <th data-class="text-end" class="text-center colTable">Total PRMP</th>
                                    <th data-class="text-end" class="text-center colTable">Ratio PRMP/PFHT</th>
                                    <th data-class="text-end" class="text-center colTable">Total Cession HT</th>
                                    <th data-class="text-end" class="text-center colTable">Total Cession TTC</th>
                                    <th data-class="text-center" class="text-center colTable">Marge</th>
                                    <th data-class="text-center" class="text-center colTable">Nature Inventaire</th>
                                    <th data-class="text-center" class="text-center colTable">Date Dernier Inventaire</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
       
    </div>
    <!-- End::app-content -->

    <div class="modal fade effect-scale" id="modalListeZoneProd" data-bs-focus="false">
        <div class="modal-dialog modal-sm" role="document">
            <div class="modal-content modal-content-demo">
                <div class="modal-header">
                    <h6 class="modal-title">Liste des zones</h6><button aria-label="Close" class="btn-close bg-white"
                        data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body p-1">
                    <div class="card-body mb-0 pb-0">
                        <div class="row">
                            <div class="col-xl-12 col-lg-12 col-md-12 mb-3">
                                <p class="mb-0 text-muted">Zone de stockage : </p>
                                <select name="" class="form-select" id="listeZoneProd"></select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer p-0">
                    <label class="btn btn-warning-light btn-wave w-100 flex-fill d-flex justify-content-center align-items-center mt-2"
                        id="ImprimerListingProduitStockLot">
                        <i class='bx bxs-printer mt-1 me-1' style="cursor:pointer;"></i> Imprimer
                    </label>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal sélection de client pour fusion -->
    <div class="modal fade" id="modalSelectProduitPourFusion" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLongTitle">Produit conservé</h5>
                    <button type="button" class="btn-close bg-light" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="w-100">
                        <select id="selProduitConserve"></select>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" id="btnConfirmFusionProduit">
                        <i class='bx bx-check-circle'></i>
                        Fusionner
                    </button>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
<script src="{{ asset("assets/js/fonction/traitemement-produit.js") }}"></script>

<script>
    $(document).ready(function(){
        placeboutonPreferenceColonne('tableProduit','produitShowColonne')
    })

    $(document).on('click', '.produitShowColonne', function() {
        appliquerPreferenceColonne('tableProduit','catalogueProduit',$(this),'produitShowColonne')
    })

    recuperationPreferenceColonneUtilisateur('tableProduit','produitShowColonne')

    $(document).on("keydown", function (e) {
        // Statut TOUS et actualisation produit
        if (e.key === "F2") {
            $("#filtreStatut").val("").change()
            $("#btnFiltreTable").click()
        } 
    })
</script>
    {{-- Script executé au chargement de la page --}}
    
    {{-- <script>

        $(document).ready(function() {
            /*::::::::::::::::::::: PARAMETRAGE ::::::::::::::::::::::*/

           

            var table = $("#tableProduit").DataTable({
                language: languageTable,
                // pagingType: 'full_numbers',
                pageLength: 25,
                order: [5, "asc"]
            })

            let modeGPHARMA = '{{ $modeGPHARMA }}'

            //::::::::::::::::::: Variable ::::::::::::::::::/
            listeCheckSelectLigne = []
            var tableClient

            //::::::::::::::::::: Execution ::::::::::::::::::/

            listeColonnes = $('.colTable')
            // listeFiltre()

            // $("#modalFicheProduit").modal("show")
            $(document).on("change", "#checkAi", function() {
                if (this.checked) {
                    $("#NumeroAi").removeAttr("readonly")
                    $("#dateValiditeeAi").removeAttr("readonly")
                    return
                }
                $("#NumeroAi").attr("readonly", "readonly")
                $("#dateValiditeeAi").attr("readonly", "readonly")
            })

            /** Open modal new produit */
            $("#btnNewProduit").click(function() {
                if ($("#idSiteEnCours").val() != "1") {
                    Swal.fire({
                        position: 'center',
                        icon: 'error',
                        title: "Une création de produit n'est possible que sur l'agence Centrale",
                        showConfirmButton: false,
                        timer: 3000
                    })
                    return;
                }
                $("#modalFicheProduit").modal("show")
            })

            // Nouvel enregistrement et MAJ du produit
            $("#formProduit").on("submit", function(evt) {
                evt.preventDefault();

                if ($("#method").val() == "create") {

                    if ($("#codeCIP2").val() == "") $("#codeCIP2").val($("#codeCIP1").val())
                    if ($("#codeEan").val() == "") $("#codeEan").val($("#codeCIP1").val())
                    if ($("#codeTedis").val() == "") $("#codeTedis").val($("#codeCIP1").val())
                }

                var formdata = new FormData(this);
                formdata.append('IDAGENCE', $("#filtreAgence").val())
                $.ajax({
                    url: '{{ route('produits.add', '') }}',
                    type: 'POST',
                    dataType: 'json',
                    processData: false,
                    contentType: false,
                    data: formdata,
                    success: function(response) {
                        // console.log(response)
                        // return
                        if (response.error == false) {
                            notifSuccess("Votre opération a été éffectué avec success !!")

                            $("#btnFiltreTable").trigger("click")
                            $("#modalFicheProduit").modal("hide")
                            return;
                        }
                        notif("danger", "Attention", response.message)
                        // $("#modalFicheProduit").modal("hide")
                    },
                    error: function(response, statut, error) {
                        console.log(response)
                        notif("danger", "Attention", "Erreur lors de l'opération !!")
                    }
                })
            })

            $('#modalFicheProduit').on('hidden.bs.modal', function() {

            });

            /************************** Execution sur modal  ***********************************/

            $("#genereCdeCIP").click(function() {
                $.ajax({

                    url: '{{ route('produits.genereCodeCIP') }}',
                    type: 'GET',
                    dataType: 'json',
                    success: function(response) {
                        $("#codeCIP1").val(response)
                    },
                    error: function(response, statut, error) {
                        console.log(response)
                    }
                })
            })

            //calcul de volume
            $("#longueur").change(function() {
                $("#dropdownMenu2").text(parseFloat($("#longueur").val()) * parseFloat($("#largeur")
                    .val()) * parseFloat($("#hauteur").val()))
                $("#dropdownMenu2").text(parseFloat($("#longueur").val()) * parseFloat($("#largeur")
                    .val()) * parseFloat($("#hauteur").val()))
                $("#volume").val()
            })

            $("#largeur").change(function() {
                $("#dropdownMenu2").text(parseFloat($("#longueur").val()) * parseFloat($("#largeur")
                    .val()) * parseFloat($("#hauteur").val()))

            })

            $("#hauteur").change(function() {
                $("#dropdownMenu2").text(parseFloat($("#longueur").val()) * parseFloat($("#largeur")
                    .val()) * parseFloat($("#hauteur").val()))
            })

            let donneReappro = []

            $(document).on("click", "#btnModalReappro", function() {
                if ($("#idProduit").val() == "") {
                    alertSwal("Ce traitement n'est disponible que lorsque le produit existe déjà !")
                    return false
                }
                listeReappro()
                $("#modalFicheProduit").modal("hide")
                $("#modalReappro").modal("show")
            })

            $('#modalReappro').on('hidden.bs.modal', function() {
                $("#modalFicheProduit").modal("show")
            });

            $(document).on("click", "#btnAddReappro", function() {

                $.ajax({
                    type: "post",
                    url: "{{ route('produits.addListeReappro') }}",
                    data: {
                        IDAGENCE: $("#idSiteEnCours").val(),
                        IDPRODUIT: $("#idProduit").val(),
                        IDPARAMETRE_TRANSFERT_INTERZONE: $("#IDPARAMETRE_TRANSFERT_INTERZONE")
                            .val(),
                        IDZONESTOCKAGE_EXPEDITION: $("#IDZONESTOCKAGE_EXPEDITION").val(),
                        IDZONESTOCKAGE_DESTINATION: $("#IDZONESTOCKAGE_DESTINATION").val(),
                        SeuilAlerteZS: $("#SeuilAlerteZS").val(),
                        QteATransfererZS: $("#QteATransfererZS").val(),
                        _token: "{{ csrf_token() }}"
                    },
                    dataType: "json",
                    success: function(response) {
                        if (response.error == false) {
                            listeReappro()
                            $("#IDPARAMETRE_TRANSFERT_INTERZONE").val("")
                            $("#SeuilAlerteZS").val(0)
                            $("#QteATransfererZS").val(0)
                            $(".btnAddReappro").removeClass("d-none")
                            $(".btnModifReappro").addClass("d-none")
                        }
                    },
                    error: function(response) {
                        notifError(response.responseJSON.messages)
                    }
                });

            })

            $(document).on("click", "#btnEditReappro", function() {
                $(this).data("id")
                $.ajax({
                    type: "get",
                    url: "{{ route('produits.oneReappro') }}",
                    data: {
                        data: $(this).data("id")
                    },
                    dataType: "json",
                    success: function(response) {
                        if (response.error == false) {
                            $("#IDPARAMETRE_TRANSFERT_INTERZONE").val(response.data
                                .IDPARAMETRE_TRANSFERT_INTERZONE)
                            $("#IDZONESTOCKAGE_EXPEDITION").val(response.data
                                .IDZONESTOCKAGE_EXPEDITION)
                            $("#IDZONESTOCKAGE_DESTINATION").val(response.data
                                .IDZONESTOCKAGE_DESTINATION)
                            $("#SeuilAlerteZS").val(response.data.SeuilAlerteZS)
                            $("#QteATransfererZS").val(response.data.QteATransfererZS)

                            $(".btnModifReappro").removeClass("d-none")
                            $(".btnAddReappro").addClass("d-none")
                        }
                    },
                    error: function(response) {
                        notifError(response.responseJSON.messages)
                    }
                });
            })

            $(document).on("click", "#btnAnnuleReappro", function() {
                $("#IDPARAMETRE_TRANSFERT_INTERZONE").val("")
                $("#SeuilAlerteZS").val(0)
                $("#QteATransfererZS").val(0)
                $(".btnAddReappro").removeClass("d-none")
                $(".btnModifReappro").addClass("d-none")
            })

            $(document).on("click", "#btnDeleteReappro", function() {
                confirmAction(() => {
                        $.ajax({
                            type: "DELETE",
                            url: "{{ route('produits.deleteReappro') }}",
                            data: {
                                data: $(this).data("id"),
                                _token: "{{ csrf_token() }}"
                            },
                            dataType: "json",
                            success: function(response) {
                                if (response.error == false) {
                                    listeReappro()
                                }
                            },
                            error: function(response) {
                                notifError(response.responseJSON.messages)
                            }
                        });
                    },
                    "Voulez-vous supprimer la ligne ?",
                    ""
                )
            })

            function listeReappro() {
                $.ajax({
                    type: "GET",
                    url: "{{ route('produits.listeReappro') }}",
                    data: {
                        data: $("#idProduit").val(),
                        IDAGENCE: $("#idSiteEnCours").val(),
                    },
                    dataType: "json",
                    success: function(response) {
                        if (response.error == false) {
                            remplissageDataTable({
                                IdentifiantDuTableau: '#tableReappro',
                                obj: response.data
                            })
                        }
                    },
                    error: function(response) {

                    }
                });

            }
            // fin calcul volume

            //
            $("#typeArrondiCmde").change(function() {
                if ($(this).val() == 0) {
                    $("#qteArrondieCmde").removeAttr("readonly")
                    $("#qteArrondieCmde").attr("readonly", "readonly")
                    $("#qteArrondieCmde").val(0)
                }
                if ($(this).val() == 1) {
                    $("#qteArrondieCmde").removeAttr("readonly")
                    $("#qteArrondieCmde").attr("readonly", "readonly")
                    $("#qteArrondieCmde").val($("#cartonnage").val())
                }
                if ($(this).val() == 2) {
                    $("#qteArrondieCmde").removeAttr("readonly")
                    $("#qteArrondieCmde").val(0)
                }
            })

            // filtre par agence
            $("#btnFiltreTable").click(function() {

                getDataProduit(
                    $("#filtreAgence").val(),
                    $("#filtreCode").val(),
                    $("#filtreFamille").val(),
                    $("#filtreNature").val(),
                    $("#filtreLaboratoire").val(),
                    $("#filtreStatut").val(),
                    $("#filtreForme").val(),
                    $("#filtreFournisseur").val(),
                    $("#filtreStock").val(),
                    $("#filtreMagasinStockage").val(),
                    $("#filtreEmplacement").val(),
                    $('#IDPRINCIPEACTIF').val()
                )
            })

            $(document).on("keydown", "#filtreCode", function(event) {
                if (event.key == "Enter") {
                    $("#btnFiltreTable").trigger("click")
                }
            })

            $("#searchFiltre").click(function() {
                getDataProduit($("#filtreAgence").val(), $("#filtreCode").val(), $("#filtreFamille").val(),
                    $("#filtreNature").val(), $("#filtreLaboratoire").val(), $("#filtreStatut").val(),
                    $("#filtreForme").val(), $("#filtreFournisseur").val(), $("#filtreStock").val(), $(
                        "#filtreMagasinStockage").val(), $("#filtreEmplacement").val(), $(
                        '#IDPRINCIPEACTIF').val())
            })

            //Click sur le boutton delete du tableau
            $("#tableProduit tbody").on("click", ".btn-trash", function() {
                var id = $(this).attr("data_id")

                confirmMdp("{{ csrf_token() }}", () => {
                    $.ajax({
                        url: "{{ route('produits.delete') }}",
                        type: 'POST',
                        dataType: 'json',
                        data: {
                            ref: id,
                            _token: "{{ csrf_token() }}",
                        },
                        success: function(response) {
                            // alert("eeeeeeee")
                            console.log(response)
                            if (response.error == false) {
                                notif("success", "Félicitation", response.message)

                                $("#btnFiltreTable").trigger("click")
                            }
                            notif("warning", "Attention", response.message)
                        },
                        error: function(response, statut, error) {
                            console.log(response)
                        },
                        // timeout : 10000000,
                    })
                })
            })

            //Click sur le boutton edit du tableau
            $("#tableProduit tbody").on("click", ".btn-edit", function() {

                $idAgence = $("#filtreAgence").val()
                var id = $(this).attr("data_id")
                
                ouvrirFicheProduit($idAgence, id)
            })


            $(document).on("click", ".btn-edit-lot", function() {
                $(this).data("id")

                $.ajax({
                    type: "GET",
                    url: "{{ route('produits.getOnelotProduit') }}",
                    data: {
                        "data": $(this).data("id")
                    },
                    dataType: "json",
                    success: function(response) {
                        if (response.error == false) {
                            $("#idlot_modif").val(response.data.IDSTOCKAGENCE_LOTS)
                            $("#Colisage_modif").val(response.data.ColisageLot)
                            $("#Cartonnage_modif").val(response.data.CartonnageLot)
                            $("#date_peremp_modif").val(response.data.DatePeremption)
                            $("#numLot_modif").text(response.data.NumeroLotProduit)
                            $("#nomProduit_modif").text(response.data.DesignationProduit)
                            chargerSelectEmplacementAgence(
                                response.data.IDAGENCE,
                                "#emplacement_modif",
                                "#modalModifInfoLotProduit",
                                response.data.IDZONESTOCKAGE
                            ).then(function () { 
                                $("#emplacement_modif").val(response.data.IDEMPLACEMENT).change()

                             })
                            $("#modalFicheProduit").modal("hide")
                            $("#modalModifInfoLotProduit").modal("show")
                        }

                    },
                    error: function(response) {

                    }
                });
            })

            $(document).on("submit", "#formModifLot", function(evt) {
                evt.preventDefault()
                let formData = new FormData(_("formModifLot"))
                $.ajax({
                    type: "POST",
                    url: "{{ route('produits.changeLotProduit') }}",
                    data: formData,
                    dataType: "json",
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        if (response.error == false) {
                            notifSuccess(response.messages)
                            drawListeLot(response.listeLots)
                            $("#modalModifInfoLotProduit").modal("hide")
                           
                            return false
                        }
                        notifWarnig(response.messages)
                    },
                    error: function(response) {
                        notifError(response.responseJSON.messages)
                    }
                });
            })

            // $('#modalModifInfoLotProduit').on('shown.bs.modal', function() {
            //     $("#modalFicheProduit").modal("hide")
            // });
            $('#modalModifInfoLotProduit').on('hidden.bs.modal', function() {
                $("#modalFicheProduit").modal("show")
            });

            // checkbox
            $("#modalFicheProduit").on("click", "input[type=checkbox]", function() {
                if ($(this).is(':checked')) {
                    $(this).val(true)
                } else {
                    $(this).val(false)
                }
            })

            _('filtreAgence').addEventListener('change', function() {
                chargerSelectMagasin(this.value)
            })

            _('filtreMagasinStockage').addEventListener('change', function() {
                chargerSelectEmplacement(_('filtreAgence').value, _('filtreMagasinStockage').value)
            })

            $("#btnAddCommentaire").click(function() {
                if ($("#zoneCommentaire").val() != "" && $("#IDCLIENT").val() != "") {
                    $.ajax({
                        url: "{{ route('addCommentaireClient') }}",
                        type: 'POST',
                        data: {
                            zoneCommentaire: $("#zoneCommentaire").val(),
                            commentairePrive: $("#commentairePrive").val(),
                            IDPRODUIT: $("#idProduit").val(),
                            IDAGENCE: $("#idSiteEnCours").val(),
                            _token: "{{ csrf_token() }}"
                        },
                        dataType: 'json',
                        success: function(response) {
                            // console.log(response)
                            $("#zoneCommentaire").val("")
                            listeCommentaire($("#idProduit").val(), 3)
                        },
                        error: function(response) {
                            console.log(response)
                        }
                    })
                }
            })

            $("#modalFicheProduit").on('click', '#trashCommentaire', function() {
                var id = $(this).attr("data_id")
                $.ajax({
                    url: "{{ route('deleteCommentaireClient') }}",
                    type: 'POST',
                    data: {
                        IDCOMMENTAIRE_DOCUMENT: id,
                        _token: "{{ csrf_token() }}"
                    },
                    dataType: 'json',
                    success: function(response) {
                        // console.log(response)
                        $("#zoneCommentaire").val("")
                        listeCommentaire($("#idProduit").val(), 3)
                    },
                    error: function(response) {
                        console.log(response)
                    }
                })
            })

            $("#modalFicheClient").on('click', '#trashCommentaire', function() {
                var id = $(this).attr("data_id")
                $.ajax({
                    url: "{{ route('deleteCommentaireClient') }}",
                    type: 'POST',
                    data: {
                        IDCOMMENTAIRE_DOCUMENT: id,
                        _token: "{{ csrf_token() }}"
                    },
                    dataType: 'json',
                    success: function(response) {
                        // console.log(response)
                        $("#zoneCommentaire").val("")
                        listeCommentaire($("#idProduit").val(), 3)
                    },
                    error: function(response) {
                        console.log(response)
                    }
                })
            })

            //::::::::::::::::::: Fonctions ::::::::::::::::::::::::::::::/
            function getDataProduit(filtreAgence, filtreCode, filtreFamille, filtreNature, filtreLaboratoire,
                filtreStatut, filtreForme, filtreFournisseur, filtreStock, filtreMagasinStockage, filtreEmplacement,
                IDPRINCIPEACTIF) {

                $.ajax({
                    url: "{{ route('produits.listeProduit') }}",
                    type: 'GET',
                    dataType: 'json',
                    data: {
                        filtreAgence: filtreAgence,
                        filtreCode: filtreCode,
                        filtreFamille: filtreFamille,
                        filtreNature: filtreNature,
                        filtreLaboratoire: filtreLaboratoire,
                        filtreStatut: filtreStatut,
                        filtreForme: filtreForme,
                        filtreFournisseur: filtreFournisseur,
                        filtreStock: filtreStock,
                        filtreMagasinStockage: filtreMagasinStockage,
                        filtreEmplacement: filtreEmplacement,
                        IDPRINCIPEACTIF: IDPRINCIPEACTIF
                    },
                    beforeSend: function() {
                        progressHandler()
                    },
                    success: function(response) {
                        // alert("eeeeeeee")
                        // console.log(response)
                        if (response.error == false) {
                            table.clear().draw()

                            $('#tableProduit').DataTable().destroy()
                            document.querySelectorAll('#tableProduit thead th.colonneAjouter').forEach(
                                function(th) {
                                    th.remove();
                                });
                            $('#tableProduit thead tr').each(function() {
                                $(this).find('th:eq(6)').after(response.tableHead);
                            });

                            table = $('#tableProduit').DataTable({
                                language: languageTable,
                                pageLength: 25,
                                order: [5, "asc"]
                            })

                            var nbreProduit = 0
                            var nbreBoite = 0
                            var valeurPFHT = 0
                            var valeurPGHT = 0
                            var valeurPRevient = 0
                            var valeurPRMP = 0
                            var prmpPfht = 0
                            var valeurCessionHT = 0
                            var valeurCessionTTC = 0
                            var marge = 0


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

                                $.each(response.ZONESTOCKAGE, function(indexInArray,
                                    valueZone) {
                                    let liste = response.listeStocksZone.find(item =>
                                        item.IDPRODUIT === value.IDPRODUIT && item
                                        .IDZONESTOCKAGE === valueZone.IDZONESTOCKAGE
                                    )
                                    if (liste != undefined) {
                                        value["Zone" + valueZone.CodeZoneStockage] =
                                            liste["SumStockTotal_Lot"]
                                    } else {
                                        value["Zone" + valueZone.CodeZoneStockage] = 0
                                    }
                                })

                                nbreBoite += parseFloat(value.StockTotal == null ? 0 : value
                                    .StockTotal)
                                valeurPFHT += parseFloat(value.PrixAchatFHT == null ? 0 : value
                                    .PrixAchatFHT)
                                valeurPGHT += parseFloat(value.PrixGHT == null ? 0 : value
                                    .PrixGHT)
                                valeurPRevient += parseFloat(value.PrixRevientHT == null ? 0 :
                                    value
                                    .PrixRevientHT)
                                valeurPRMP += parseFloat(value.PrixRevientHTMoyenPondere ==
                                    null ?
                                    0 : value.PrixRevientHTMoyenPondere)
                                valeurCessionHT += parseFloat(value.PrixCessionHT == null ? 0 :
                                    value.PrixCessionHT)
                                valeurCessionTTC += parseFloat(value.PrixCessionTTC == null ?
                                    0 :
                                    value.PrixCessionTTC)


                                let TypeQteMiniCdeClient = ""
                                if (value.TypeQteMiniCdeClient == 0) TypeQteMiniCdeClient =
                                    "AUCUN"
                                if (value.TypeQteMiniCdeClient == 1) TypeQteMiniCdeClient =
                                    "CARTONNAGE"
                                if (value.TypeQteMiniCdeClient == 2) TypeQteMiniCdeClient =
                                    "VALEUR X"

                                var stockTotal = value.StockTotal

                                if (filtreAgence == 1) {
                                    var index = response.tabStockPays.findIndex((item) => item
                                        .IDPRODUIT == value.IDPRODUIT)
                                    if (index >= 0) {
                                        stockTotal = parseInt(response.tabStockPays[index]
                                                .stocktotal) + response.tabStockPays[index]
                                            .quantitecoursroute
                                    }

                                }


                                let rowData = [
                                    `<button class="btn btn-sm btn-outline-danger btn-icon btn-trash" id="trash-${value.IDPRODUIT}" data_id="${value.IDPRODUIT}">
                                    <i class='bx bxs-trash' style='font-size:14px'></i>
                                </button>&nbsp;
                                <button class="btn btn-sm btn-outline-warning btn-icon btn-edit" id="edit-${key}" data_id="${value.IDPRODUIT}">
                                    <i class='bx bxs-edit' style='font-size:14px'></i>
                                </button>
                                <div class="btn btn-sm btn-icon btn-outline-dark">
                                    <i class="bx bx-dots-vertical-rounded" data-bs-toggle="dropdown" aria-expanded="false" style="font-size: 17px; cursor: pointer;"></i>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item principeActifProduit" href="javascript:void(0);" data-id="${value.IDPRODUIT}">Principes actifs</a></li>
                                    </ul>
                                </div>`,
                                    `${verifNull(value.CodeCipProduit1)}`,
                                    `${verifNull(value.CodeCipProduit2)}`,
                                    `${verifNull(value.CodeEanProduit)}`,
                                    `${verifNull(value.CodeTedisProduit)}`,
                                    `${verifNull(value.DesignationProduit)}`,
                                    `${verifNull(value.StockTransitVersReserve)}`
                                ];

                                $.each(response.CODEZONESTOCKAGE, function(index, valueZone) {
                                    let code = "Zone" + valueZone
                                    rowData.push(`${value[code]}`)
                                })

                                rowData = rowData.concat([
                                    `${verifNull(value.StockTotal)}`,
                                    `${verifNull(value.StockIndisponible)}`,
                                    `${verifNull(value.Vm_Produit)}`,
                                    `${value.Vm_Produit != 0 ? ParseFloat(value.StockTotal / value.Vm_Produit, 2) : 0}`,
                                    `${verifNull(value.QuantiteCoursRoute)}`,
                                    `${verifNull(value.SeuilMiniReappro)}`,
                                    `${verifNull(value.SeuilMaxiReappro)}`,
                                    `${verifNull(value.SeuilAlerteDetail)}`,
                                    `${verifNull(value.QuantiteReapproDetail)}`,
                                    `${verifNull(value.NumeroAIProduit)}`,
                                    `${verifNull(value.DateValiditeAIProduit)}`,
                                    `${verifNull(value.LibelleStatutProduit)}`,
                                    `${verifNull(value.LibelleCategorieRotation)}`,
                                    `${verifNull(value.LibelleFamilleProduit)}`,
                                    `${verifNull(value.LibelleFormeProduit)}`,
                                    `${verifNull(value.LibelleCategorieProduit)}`,
                                    `${verifNull(value.LibelleClasseTherapeutique)}`,
                                    `${verifNull(value.ClassificationATC)}`,
                                    `${verifNull(value.LibelleRubriqueDouane)}`,
                                    `${verifNull(value.CodeDroitDouane)}`,
                                    `${formatNumber(verifNull(value.PrixAchatFHT))}`,
                                    `${formatNumber(verifNull(value.PrixGHT))}`,
                                    `${formatNumber(verifNull(value.PrixRevientHT))}`,
                                    `${formatNumber(verifNull(value.PrixRevientHTMoyenPondere))}`,
                                    `${verifNull(value.LibelleTauxTva)}`,
                                    `${formatNumber(verifNull(value.PrixCessionHT))}`,
                                    `${formatNumber(verifNull(value.PrixCessionTTC))}`,
                                    `${formatNumber(verifNull(value.PrixVentePublicTTC))}`,
                                    `<input class="form-check-input" type="checkbox" value="${value.ProduitPSY}" ${value.ProduitPSY == true ? "checked" : ""} disabled>`,
                                    `<input class="form-check-input" type="checkbox" value="${value.ProduitSociaux}" ${value.ProduitSociaux == true ? "checked" : ""} disabled>`,
                                    `<input class="form-check-input" type="checkbox" value="${value.Liste1ou2}" ${value.Liste1ou2 == true ? "checked" : ""} disabled>`,
                                    `<input class="form-check-input" type="checkbox" value="${value.ProduitANS}" ${value.ProduitANS == true ? "checked" : ""} disabled>`,
                                    `<input class="form-check-input" type="checkbox" value="${value.ProduitFroid}" ${value.ProduitFroid == true ? "checked" : ""} disabled>`,
                                    `${verifNull(value.NomBureauAchat)}`,
                                    `${verifNull(value.NomFournisseur)}`,
                                    `${verifNull(value.NomLaboratoire)}`,
                                    `${verifNull(value.ColisageProduit)}`,
                                    `${verifNull(value.CartonnageProduit)}`,
                                    `${TypeQteMiniCdeClient}`,
                                    `${verifNull(value.CartonnageProduit)}`,
                                    `${verifNull(value.VolumeProduitcmcube)}`,
                                    `${verifNull(value.PoidsProduitg)}`,
                                    `${verifNull(value.LibelleTypeExpedition)}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixAchatFHT, 2))}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixGHT, 2))}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixRevientHT, 2))}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixRevientHTMoyenPondere, 2))}`,
                                    `${value.PrixRevientHTMoyenPondere != 0 ? formatNumber(ParseFloat(value.PrixRevientHT / value.PrixRevientHTMoyenPondere, 2)) : 0}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixCessionHT, 2))}`,
                                    `${formatNumber(ParseFloat(value.StockTotal * value.PrixCessionTTC, 2))}`,
                                    `${formatNumber(ParseFloat((value.StockTotal * value.PrixCessionHT) - (value.StockTotal * value.PrixRevientHTMoyenPondere), 2))}`,
                                    `${value.TypeDernierInventaire == 1 ? "IF" : "IT"}`,
                                    `${explodeDate(verifNull(value.DateDernierInventaire))}`
                                ]);

                                table.row.add(rowData)

                            })

                            nbreProduit = response.listeProduit.length
                            if (valeurPRMP == 0) {
                                prmpPfht = 0
                            } else {
                                prmpPfht = parseFloat(valeurPFHT / valeurPRMP).toFixed(4)
                            }


                            $("#nbreProduit").text(separateurMilliers(parseInt(nbreProduit)))
                            $("#nbreBoite").text(separateurMilliers(parseInt(nbreBoite)))
                            $("#valeurPFHT").text(separateurMilliers(parseInt(valeurPFHT)))
                            $("#valeurPGHT").text(separateurMilliers(parseInt(valeurPGHT)))
                            $("#valeurPRevient").text(separateurMilliers(parseInt(valeurPRevient)))
                            $("#valeurPRMP").text(separateurMilliers(parseInt(valeurPRMP)))
                            $("#prmpPfht").text(separateurMilliers(prmpPfht))
                            $("#valeurCessionHT").text(separateurMilliers(parseInt(valeurCessionHT)))
                            $("#valeurCessionTTC").text(separateurMilliers(parseInt(valeurCessionTTC)))
                            $("#marge").text(separateurMilliers(parseInt(marge)))

                            table.draw();
                        }
                        completeHandler()
                    },
                    error: function(response, statut, error) {
                        console.log(response)
                        if (statut === 'timeout') {
                            notifError("TimeOut")
                            return false
                        }
                    },
                })
            }

            function verifNull(data) {
                return data == null || data == "null" ? "" : data
            }

            function ParseFloat(float, rigth) {
                return parseFloat(float).toFixed(rigth)
            }

            function chargerSelectMagasin(IDAGENCE) {

                $.ajax({

                    url: "{{ route('listingZoneStockage') }}",
                    beforeSend: progressHandler(),
                    type: 'POST',
                    data: {
                        _token: "{{ csrf_token() }}",
                        IDAGENCE: IDAGENCE
                    },
                    dataType: 'json',
                    success: function(response) {

                        let obj = response.data

                        $('#filtreMagasinStockage').html('')

                        if (obj.length > 0) {

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

                                $('#filtreMagasinStockage').append('<option value="' + value[
                                    'IDZONESTOCKAGE'] + '">' + value[
                                    'NomZoneStockage'] + '</option>')
                            })

                            $('#filtreMagasinStockage').append('<option value="">TOUS</option>')

                            $('#filtreMagasinStockage').val('')

                            chargerSelectEmplacement(IDAGENCE, 0)
                        } else {

                            $('#filtreMagasinStockage').append(
                                '<option value="">AUCUNE ZONE DISPONIBLE</option>')
                        }

                        completeHandler()
                    }
                })
            }

            function chargerSelectEmplacement(IDAGENCE, IDZONESTOCKAGE) {

                $.ajax({

                    url: "{{ route('listingEmplacementParMagasinParAgence') }}",
                    beforeSend: progressHandler(),
                    type: 'POST',
                    data: {
                        _token: "{{ csrf_token() }}",
                        IDAGENCE: IDAGENCE,
                        IDZONESTOCKAGE: IDZONESTOCKAGE
                    },
                    dataType: 'json',
                    success: function(response) {

                        let obj = response.data

                        $('#filtreEmplacement').html('')

                        if (obj.length > 0) {

                            $.each(obj, function(key, value) {
                                $('#filtreEmplacement').append('<option value="' + value[
                                        'IDEMPLACEMENT'] + '">' + value['NomEmplacement'] +
                                    '</option>')
                                $('#IDEMPLACEMENT').append('<option value="' + value[
                                        'IDEMPLACEMENT'] + '">' + value['NomEmplacement'] +
                                    '</option>')
                            })

                            // $('#filtreEmplacement').append('<option value="0">AUCUN EMPLACEMENT</option>')
                            $('#filtreEmplacement').append('<option value="0">TOUS</option>')

                            $('#filtreEmplacement').val(0).change()
                            $('#filtreEmplacement').select2()
                            $('#IDEMPLACEMENT').select2({
                                dropdownParent: $("#modalFicheProduit")
                            })
                        } else {
                            $('#filtreEmplacement').append(
                                '<option value="">AUCUN EMPLACEMENT DISPONIBLE</option>')
                        }
                        completeHandler()
                    }
                })
            }

            // function listeFiltre() {

            //     $.ajax({

            //         url: "{{ route('produits.listeFiltre') }}",
            //         type: 'GET',
            //         dataType: 'json',
            //         success: function(response) {

            //             // console.log(response)

            //             $("#filtreAgence").html("")
            //             $("#filtreFamille").html("")
            //             $("#filtreNature").html("")
            //             $("#filtreLaboratoire").html("")
            //             $("#filtreStatut").html("")
            //             $("#filtreForme").html("")
            //             $("#filtreFournisseur").html("")
            //             $("#filtreMagasinStockage").html("")
            //             $("#filtreEmplacement").html("")
            //             $('#IDPRINCIPEACTIF').html('')


            //             $("#filtreFamille").append("<option value=''>TOUTES</option>")
            //             $("#filtreNature").append("<option value=''>TOUTES</option>")
            //             $("#filtreLaboratoire").append("<option value=''>TOUTES</option>")
            //             $("#filtreStatut").append("<option value=''>TOUTES</option>")
            //             $("#filtreForme").append("<option value=''>TOUTES</option>")
            //             $("#filtreFournisseur").append("<option value=''>TOUTES</option>")
            //             $("#filtreMagasinStockage").append("<option value=''>TOUS</option>")
            //             $("#filtreEmplacement").append("<option value=''>TOUS</option>")
            //             $('#IDPRINCIPEACTIF').append('<option value="">TOUS</option>')

            //             //Modal
            //             $("#statut").html("")
            //             $("#famille").html("")
            //             $("#forme").html("")
            //             $("#nature").html("")
            //             $("#EmplacementReserve").html("")
            //             $("#emplacementDetail").html("")
            //             $("#zone").html("")
            //             $("#fournisseur").html("")
            //             $("#tauxTVA").html("")
            //             $("#rubriqueDouaniere").html("")
            //             $("#laboratoire").html("")
            //             $("#typeExpedition").html("")
            //             $("#classeTherapeutique").html("")

            //             $.each(response.listeAgence, function(key, value) {
            //                 $("#filtreAgence").append(
            //                     `<option value="${value.IDAGENCE}">${value.NomAgence}</option>`
            //                 )
            //             })

            //             _('filtreAgence').value = _('idSiteEnCours').value

            //             chargerSelectMagasin(_('idSiteEnCours').value)

            //             $.each(response.listeFamille, function(key, value) {
            //                 $("#filtreFamille").append(
            //                     `<option value="${value.IDFAMILLEPRODUIT}">${value.LibelleFamilleProduit}</option>`
            //                 )
            //                 $("#famille").append(
            //                     `<option value="${value.IDFAMILLEPRODUIT}">${value.LibelleFamilleProduit}</option>`
            //                 )
            //             })

            //             $("#filtreNature").append(`<option value="0">""</option>`)
            //             $("#nature").append(`<option value="0">""</option>`)
                        
            //             $.each(response.listeNature, function(key, value) {
                            
            //                 $("#filtreNature").append(
            //                     `<option value="${value.IDCATEGORIEPRODUIT}">${value.LibelleCategorieProduit}</option>`
            //                 )
            //                 $("#nature").append(
            //                     `<option value="${value.IDCATEGORIEPRODUIT}">${value.LibelleCategorieProduit}</option>`
            //                 )
            //             })
            //             $.each(response.listeLaboratoire, function(key, value) {
            //                 $("#filtreLaboratoire").append(
            //                     `<option value="${value.IDLABORATOIRE}">${value.NomLaboratoire}</option>`
            //                 )
            //                 $("#laboratoire").append(
            //                     `<option value="${value.IDLABORATOIRE}">${value.NomLaboratoire}</option>`
            //                 )
            //             })
            //             $.each(response.listeStatut, function(key, value) {
            //                 $("#filtreStatut").append(
            //                     `<option value="${value.IDSTATUTPRODUIT}">${value.LibelleStatutProduit}</option>`
            //                 )
            //                 $("#statut").append(
            //                     `<option value="${value.IDSTATUTPRODUIT}">${value.LibelleStatutProduit}</option>`
            //                 )
            //             })
            //             $.each(response.listeForme, function(key, value) {
            //                 $("#filtreForme").append(
            //                     `<option value="${value.IDFORMEPRODUIT}">${value.LibelleFormeProduit}</option>`
            //                 )
            //                 $("#forme").append(
            //                     `<option value="${value.IDFORMEPRODUIT}">${value.LibelleFormeProduit}</option>`
            //                 )
            //             })
            //             $.each(response.listeFournisseur, function(key, value) {
            //                 $("#filtreFournisseur").append(
            //                     `<option value="${value.IDFOURNISSEUR}">${value.NomFournisseur}</option>`
            //                 )
            //             })

            //             $.each(response.listeZoneDetail, function(key, value) {

            //                 $("#emplacementDetail").append(
            //                     `<option value="${value.IDEMPLACEMENTETAIL}">${value.NomEmplacementDetail}</option>`
            //                 )
            //             })

            //             $.each(response.listeClasseTherapeutique, function(key, value) {

            //                 $("#classeTherapeutique").append(
            //                     `<option value="${value.IDCLASSETHERAPEUTIQUE}">${value.LibelleClasseTherapeutique}</option>`
            //                 )
            //             })

            //             $.each(response.listeZoneStockage, function(key, value) {
            //                 $("#zone").append(
            //                     `<option value="${value.TypeZoneStockage}">${value.NomZoneStockage}</option>`
            //                 )
            //             })

            //             $.each(response.listeTauxTva, function(key, value) {
            //                 $("#tauxTVA").append(
            //                     `<option value="${value.IDTAUXTVA}">${value.LibelleTauxTva}</option>`
            //                 )
            //             })
            //             $.each(response.listeRubriqueDouaniere, function(key, value) {
            //                 $("#rubriqueDouaniere").append(
            //                     `<option value="${value.IDRUBRIQUEDOUANE}">${value.LibelleRubriqueDouane}</option>`
            //                 )
            //             })
            //             $.each(response.listeTypeExpedition, function(key, value) {
            //                 $("#typeExpedition").append(
            //                     `<option value="${value.IDTYPEEXPEDITION}">${value.LibelleTypeExpedition}</option>`
            //                 )
            //             })
            //             $.each(response.listeClasseTherapeutique, function(key, value) {
            //                 $("#classeTherapeutique").append(
            //                     `<option value="${value.IDCLASSETHERAPEUTIQUE}">${value.LibelleClasseTherapeutique}</option>`
            //                 )
            //             })
            //             $.each(response.listePrincipeActif, function(key, value) {

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

            //             $('#IDPRINCIPEACTIF').select2()
            //             $('#filtreLaboratoire').select2()
            //         },
            //         error: function(response, statut, error) {
            //             console.log(response)
            //         }
            //     })
            // }

            function calculerPrixSession() {

                let tauxTVA = afficherOptionSelectionnee('tauxTVA').split('%')[0]
                tauxTVA = tauxTVA == '' ? 0 : tauxTVA

                let prixCessionHt = parseInt(_('prixCessionHt').value.replace(/\s/g, ''))
                prixCessionHt = prixCessionHt == '' ? 0 : prixCessionHt

                _('prixCessionTTC').value = prixCessionHt * (1 + (tauxTVA / 100))
            }
        
            _('prixCessionHt').addEventListener('input', calculerPrixSession)
            _('tauxTVA').addEventListener('change', calculerPrixSession)
        })
    </script>

    <!-- Script de la modal principe actifs / produit -->
    <script>
        $('#selectModalIDPRINCIPEACTIF').select2({
            dropdownParent: $("#modalDCIProduit")
        })

        $('#selectModalIDPRODUIT').select2({
            dropdownParent: $("#modalDCIProduit")
        })

        function selectPrincipeActif() {

            $.ajax({

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

                    if (response.success == 1) {

                        $('#selectModalIDPRINCIPEACTIF').html('')
                        $('#selectModalIDPRINCIPEACTIF').append('<option value = "0">TOUS LES DCI</option>')
                        $('#selectModalIDPRINCIPEACTIF').append('<option value = "-1">SANS DCI</option>')
                        $('#selectModalIDPRINCIPEACTIF').append('<option value = "-2">AVEC DCI</option>')

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

                            $('#selectModalIDPRINCIPEACTIF').append('<option value = "' + value[
                                    'IDPRINCIPEACTIF'] + '">' + value['NomPrincipeActif'] +
                                '</option>')
                        })


                    } else {

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

                    notifError(error)
                }
            })
        }

        function selectProduit() {

            $.ajax({

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

                    if (response.success == 1) {

                        $('#selectModalIDPRODUIT').html('')
                        $('#selectModalIDPRODUIT').append('<option value = "0">TOUS LES PRODUITS</option>')

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

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


                    } else {

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

                    notifError(error)
                }
            })
        }

        selectPrincipeActif()
        selectProduit()

        function chargerTablePrincipeActif() {

            $.ajax({

                url: '{{ route('listingPrincipeParProduit') }}',
                type: 'GET',
                data: {
                    IDPRINCIPEACTIF: _('selectModalIDPRINCIPEACTIF').value,
                    IDPRODUIT: _('selectModalIDPRODUIT').value
                },
                beforeSend: progressHandler(),
                dataType: 'json',
                success: function(response) {

                    if (response.success == 1) {

                        $('#tableDCIProduit').DataTable().destroy()
                        $('#tableDCIProduit').DataTable({

                            bFilter: false,
                            language: languageTable,
                            pageLength: 25,
                            lengthChange: false,
                            data: response.data,
                            'columns': [{
                                    data: 'CodeCipProduit1'
                                },
                                {
                                    data: 'DesignationProduit'
                                },
                                {
                                    data: 'listePrincipeActifs'
                                },
                            ]
                        })
                        $('#modalDCIProduit').modal('show')
                    } else {
                        
                        notifError(response.msg)
                    }

                    completeHandler()
                },error : function(error){
                    
                    notif('danger', 'Erreur', 'Échec de l\'opération.')
                    completeHandler()
                }
            })
        }

        $(document).on('click', '.principeActif', function() {

            $('#selectModalIDPRINCIPEACTIF').val(0).trigger('change')
            $('#selectModalIDPRODUIT').val(0).trigger('change')
            chargerTablePrincipeActif()
        })

        _('btnFiltreTableDCIProduit').addEventListener('click', function() {
            chargerTablePrincipeActif()
        })
    </scrip>

    <!-- Script de la modal pour liason produit principe actif -->
    <script>
        $('#selectModalIDPRINCIPEACTIFAAsso').select2({
            dropdownParent: $("#modalDCIDuProduit")
        })

        let tablePincipeAssoProduit = $('#tablePincipeAssoProduit').DataTable({

            bFilter: false,
            language: languageTable,
            pageLength: 25,
            lengthChange: false,
            columnDefs: [{
                    targets: [0], // Les index des colonnes à centrer (commencent à 0)
                    className: 'text-center' // Classe CSS pour centrer le texte
                }
                // Ajoutez d'autres objets pour chaque colonne à formater
            ]
        })

        function chargerSelectPrincipeAAsso(tableSauf) {

            $.ajax({
                url: '{{ route('listingPrincipeAAsso') }}',
                type: 'POST',
                data: {
                    tableSauf: tableSauf,
                    _token: '{{ csrf_token() }}'
                },
                beforeSend: progressHandler(),
                dataType: 'json',
                success: function(response) {

                    if (response.success == 1) {

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

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

                            $('#selectModalIDPRINCIPEACTIFAAsso').append('<option value = "' + value[
                                    'IDPRINCIPEACTIF'] + '">' + value['NomPrincipeActif'] +
                                '</option>')
                        })

                        completeHandler()
                    } else {

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

                    notifError(error)
                    completeHandler()
                }
            })
        }

        function chargerTablePrincipeAssoProduit(IDPRODUIT, callback) {

            $.ajax({
                url: '{{ route('listingPrincipeAssoProduit') }}',
                type: 'GET',
                data: {
                    IDPRODUIT: IDPRODUIT,
                },
                dataType: 'json',
                success: function(response) {

                    if (response.success == 1) {

                        _('modalNomProduit').innerHTML = response.nomProduit

                        let tableSauf = []
                        tablePincipeAssoProduit.clear().draw()

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

                            tablePincipeAssoProduit.row.add([value.action, value.NomPrincipeActif])
                                .draw()

                            tableSauf.push(value.IDPRINCIPEACTIF)
                        })

                        if (typeof callback === 'function') {

                            callback(tableSauf)
                        } else {

                            completeHandler()
                        }
                    } else {

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

                    notifError(error)
                    completeHandler()
                }
            })
        }

        var IDPRODUIT

        $(document).on('click', '.principeActifProduit', function() {

            IDPRODUIT = $(this).attr('data-id')
            chargerTablePrincipeAssoProduit(IDPRODUIT, chargerSelectPrincipeAAsso)
            $('#modalDCIDuProduit').modal('show')
        })

        // Script d'association d'un principe actif à un produit
        _('newAssoPrincipeActif').addEventListener('click', function() {

            if ($('#selectModalIDPRINCIPEACTIFAAsso').val() == 0) {

                notif('danger', 'Erreur', 'Veuillez sélectionner un DCI à associer au produit')
                return 0
            }

            var selectedIndex = $('#selectModalIDPRINCIPEACTIFAAsso').prop('selectedIndex');

            $.ajax({
                url: '{{ route('assoPrincipeActifProduit') }}',
                type: 'POST',
                data: {
                    IDPRODUIT: IDPRODUIT,
                    IDPRINCIPEACTIF: $('#selectModalIDPRINCIPEACTIFAAsso').val(),
                    _token: '{{ csrf_token() }}'
                },
                beforeSend: progressHandler(),
                dataType: 'json',
                success: function(response) {

                    if (response.success == 2) {

                        notif('success', 'Succès', 'Principe actif attribué au produit')
                        chargerTablePrincipeAssoProduit(IDPRODUIT)
                        $('#selectModalIDPRINCIPEACTIFAAsso').find('option:eq(' + selectedIndex + ')')
                            .remove()
                    } else if (response.success == 1) {

                        notif('danger', 'Erreur', 'Ce principe actif est déjà attribué au produit')
                        completeHandler()
                        $('#selectModalIDPRINCIPEACTIFAAsso').find('option:eq(' + selectedIndex + ')')
                            .remove()
                    } else {

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

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

        // Script de dissociation d'un principe actif à un produit
        $(document).on('click', '#suppPRODUIT_DCI', function() {

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

            Swal.fire({

                title: 'Êtes-vous sûrs ?',
                text: "De vouloir supprimer ce suivi !",
                icon: 'warning',
                showCancelButton: true,
                customClass: {
                    confirmButton: 'btn btn-danger ms-2'
                },
                cancelButtonColor: '#d33',
                confirmButtonText: 'Oui',
                cancelButtonText: 'Non'

            }).then((result) => {

                if (result.isConfirmed) {

                    $.ajax({

                        url: '{{ route('supPRODUIT_DCI') }}',
                        beforeSend: progressHandler(),
                        type: 'POST',
                        data: {
                            IDPRODUIT_DCI: IDPRODUIT_DCI,
                            _token: '{{ csrf_token() }}'
                        },
                        dataType: 'json',
                        success: function(response) {

                            if (response.success = 1) {

                                notif('success', 'Succès',
                                    'Suppression de cette asssociation éffectuée')
                                chargerTablePrincipeAssoProduit(IDPRODUIT)
                                completeHandler()
                            } else {
                                notifError(response.msg)
                                completeHandler()
                            }
                        },
                        error: function(error) {

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

    <!-- Script export du listing -->
    <script>
        _('btnExportListing').addEventListener('click', function() {
            console.log($('#tableProduit').DataTable().rows().data().toArray());
            // exportToExcelFormatted('tableHistoriqueVisite', ['CodeClient', 'NomClient', 'IntentionCommande', 'CaPeriode', 'ObjectifPeriode', 'ModeSuiviCommercial', 'dateDebut', 'dateFin', 'duree', 'COMMENTAIRES_VISITE'], 'ExcelSuiviDelegue')
        })
    </script> --}}

    <!-- Script de sélection de toutes les lignes -->
    <script>

        $('#nature').select2({
            dropdownParent: $("#modalFicheProduit")
        });

        $('#forme').select2({
            dropdownParent: $("#modalFicheProduit")
        });

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

            let checked = this.checked

            let table = $('#tableProduit').DataTable().rows().nodes()
            if(checked == true) {

                $(table).find('.checkSelectLigne:not(:checked)').prop('checked', checked)
            } else {
                $(table).find('.checkSelectLigne:checked').prop('checked', checked)
            }
            
        })

        $(document).on('click', '.checkSelectLigne', function(){

            if (this.checked == false) {
                
                _('checkSelectAll').checked = false
            }
        })
    </script>

    <!-- Script d actualisation du stock des produits sélectionnés -->
    <script>

        function actualisationStockProduitSelectionne(listeIDPRODUIT){

            let route = "{{ route('actualisationStockProduitSelectionne') }}"

            if (listeIDPRODUIT.length > 5) {
                
                route = "{{ route('actualiseStockProduitSupA5') }}"
            }

            return new Promise(function(resolve, reject) {

                $.ajax({

                    url: route,
                    type: 'POST',
                    dataType: 'json',
                    data: {
                        listeIDPRODUIT: listeIDPRODUIT,
                        IDAGENCE : _('idSiteEnCours').value,
                        _token : '{{ csrf_token() }}'
                    },
                    beforeSend: progressHandler(),
                    success: function(response) {

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

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

                        notifError('Échec de l\'opération.')
                        reject()
                        completeHandler()
                    }
                })
            })
        }

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

            let listeIDPRODUIT = []
            let table = $('#tableProduit').DataTable().rows().nodes()
            

            $(table).find('.checkSelectLigne:checked').each(function () {
                listeIDPRODUIT.push($(this).attr('data-id'))
            });

            if (listeIDPRODUIT.length <= 0) {
                
                notif('danger', 'Erreur', 'Veuillez sélectionner les produits à actualiser')
                return 0
            }

            actualisationStockProduitSelectionne(listeIDPRODUIT)
                .then((response) => {
                    if (response.success == 1) {

                        if (listeIDPRODUIT.length <= 5) {
                            
                            notif('success', 'Succès', 'Opération éffectuée avec succès')
                        }
                    }
                })
        })

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

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

            let listeIDPRODUIT = [IDPRODUIT]

            actualisationStockProduitSelectionne(listeIDPRODUIT)
                .then((response) => {

                    if (response.success == 1) {
                        
                        notifSuccess('Opération éffectuée avec succès')
                    }
                })
        })
    </script>

    <!-- Script export excel -->
    <script>

        function exporterListingProduit(data) {

            data._token = '{{ csrf_token() }}'

            return new Promise(function(resolve, reject) {

                $.ajax({

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

                        if (response.success == 1) {

                            if (response.tableExcel.length > 0) {

                                response.tableExcel.forEach(function(value) {

                                    var excelBase64 = value;

                                    // let nomDoc = (response.nomDoc == '' || response.nomDoc == null) ? 'export' : response.nomDoc

                                    let dateString = _('filtrePeriode').value

                                    let periode = convertirFormatDate2(dateString,
                                        inclureHeure = false, formatSortie = 'DD-MM-YYYY',
                                        separateur = ' - ')

                                    let nomDoc = "LISTING_COMMANDE_CLIENT_(" + periode[0] +
                                        "_AU_" + periode[1] + ")"

                                    // Convertit le base64 en Blob
                                    var blob = b64toBlob(excelBase64,
                                        'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
                                    );

                                    // Crée un URL pour le blob
                                    var blobUrl = URL.createObjectURL(blob);

                                    // Crée un élément `<a>` pour le téléchargement
                                    var link = document.createElement('a');
                                    link.href = blobUrl;
                                    link.download = nomDoc +
                                        ".xlsx"; // Nom du fichier à télécharger

                                    // Ajoute le lien au document et déclenche le clic
                                    document.body.appendChild(link);
                                    link.click();

                                    // Nettoie après le téléchargement
                                    document.body.removeChild(link);
                                    URL.revokeObjectURL(blobUrl);
                                })
                            } else {

                                notif('danger', 'Erreur', 'Aucun fichier excel n\'a été chargé')
                            }
                        } else {

                            notifError(response.msg)
                        }

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

                        notifError('Échec de l\'opération.')
                        reject()

                        completeHandler()
                    }
                })
            })
        }

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

            var data = remplissage_avec_row_add_DataTable('tableProduit')
            const filename = file_name("LISTING_PRODUIT");
            download_excel_file('{{ route('export_global_excel.export') }}', data, filename)
        })

    </script>

    <!-- Script de fusion des produits -->
    <script>

        function dataProduiTSelectionne(){

            return new Promise((resolve, reject) => {
                
                $.ajax({
    
                    url : '{{ route("dataProduiTSelectionne") }}',
                    type : 'GET',
                    data : {
                        listeIDPRODUIT : listeLigneSelectionne("#tableProduit", ".checkSelectLigne")
                    },
                    beforeSend : progressHandler(),
                    dataType : 'json',
                    success: function(response) {

                        if (response.success != 1) {

                            notif('danger', 'Erreur', response.msg)
                        }

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

                        notifError('Échec de l\'opération.')
                        reject()

                        completeHandler()
                    }
                })
            })
        }

        _('btnModalSelectProduitPourFusion').addEventListener('click', async function(){

            let data = listeLigneSelectionne("#tableProduit", ".checkSelectLigne")

            if (data.length <= 1) {
                
                notif('danger', 'Erreur', 'Veillez sélectionner au moins 2 produits pour la fusion.')
                return 0
            }

            dataProduiTSelectionne()
                .then(async (response) => {

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

                        dataProduit.unshift({
                            IDPRODUIT : 0,
                            DesignationProduit : ''
                        })

                        await populateSelect('#selProduitConserve',{
                            data : dataProduit,
                            valueKey : 'IDPRODUIT',
                            textKey : 'DesignationProduit'
                        })

                        await $('#selProduitConserve').select2({
                            dropdownParent : $('#modalSelectProduitPourFusion')
                        })

                        $('#modalSelectProduitPourFusion').modal('show')
                    }
                })
        })

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

            let data = listeLigneSelectionne("#tableProduit", ".checkSelectLigne")

            if (_('selProduitConserve').value == 0) {
                
                notif('danger', 'Erreur', 'Veuillez sélectionner le client restant')
                return 0
            }

            if (data.length <= 1) {
                
                notif('danger', 'Erreur', 'Veuillez sélectionner au moin 2 clients pour éffectuer une fusion')
                return 0
            }

            $.ajax({

                url: "{{ route('fusionnerProduit') }}",
                type: 'POST',
                dataType: 'json',
                data: {
                    listeIDPRODUIT : data,
                    IDPRODUIT_Princ : _('selProduitConserve').value,
                    _token : '{{ csrf_token() }}'
                },
                beforeSend: progressHandler(),
                success: function(response) {

                    if (response.success != 1) {

                        notifError(response.msg)
                    }else{

                        let checkbox = '.checkSelectLigne:checked'

                        let table = $('#tableProduit').DataTable().rows().nodes()
                        $(table).find(checkbox).prop('checked', false)

                        $('#modalSelectProduitPourFusion').modal('hide')
                        notif('info', 'Info', 'Fusion en cours de traitement,<br> vous serrez notifié une fois terminé.')
                    }

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

                    notifError('Échec de l\'opération.')
                    completeHandler()
                }
            })
        })
    </script>

@endsection