@extends('models')
@section('titre-page', 'Prestation')
@section('content-body')
    <!-- Start::app-content -->

    @php
        $PARAMETRE = returnParametreTauxTva();
    @endphp

    <style>
        .height-input {
            height: 2.5rem !important;
        }
    </style>


    <!-- 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-8 col-lg-6 col-md-6 mt-2">
                    <nav>
                        <ol class="breadcrumb mb-0">
                            <li class="breadcrumb-item text-light"><a href="javascript:void(0);">Prestation & outils</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Prestation</li>
                        </ol>
                    </nav>
                </div>

                <div class="col-xl-2 col-lg-3 col-md-3">
                    <button type="button" id="btnNewPrestation"
                        class="btn btn-secondary-light d-flex justify-content-center w-100">
                        <i class="bx bx-plus-circle fs-18 me-2"></i>
                        Nouveau
                    </button>
                </div>
                <div class="col-xl-2 col-lg-3 col-md-3">
                    <button type="button" id="btnImprimFacture"
                        class="btn btn-warning-light d-flex justify-content-center w-100">
                        <i class="bx bx-printer fs-18 me-2"></i>
                        Imprimer
                    </button>
                </div>
            </div>
        </div>
    </div>
    <!-- Page Header Close -->

    <div class="row">
        <div class="col-xl-12 mt-3">
            <div class="card custom-card">
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="tablehover table table-striped text-nowrap overflow-auto w-100" id="tablePrestation">
                            <thead class="table-header-primary">
                                <tr>
                                    <th class="text-center colTable" data-column = "action">
                                        <input class="form-check-input mlr" type="checkbox" id="checkSelectAll">
                                        Actions
                                    </th>
                                    <th class="text-center colTable" data-column = "CodeCipProduit1"
                                        data-class="text-center">Code Prestation</th>
                                    <th class="text-center colTable" data-column = "DesignationProduit">Désignation</th>
                                    <th class="text-center colTable" data-column = "LibelleFamilleProduit">Famille</th>
                                    <th class="text-center colTable" data-column = "PrixRevientHTFormat"
                                        data-class="text-end pe-2">P. Revient HT</th>
                                    <th class="text-center colTable" data-column = "LibelleTauxTva"
                                        data-class="text-center">TVA</th>
                                    <th class="text-center colTable" data-column = "PrixCessionHTFormat"
                                        data-class="text-end pe-2">P. cession HT</th>
                                    <th class="text-center colTable" data-column = "PrixCessionTTCFormat"
                                        data-class="text-end pe-3">P. cession TTC</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End::app-content -->

    {{-- Section modal --}}
    <!-- Modal Prestation -->
    <div class="modal fade" id="modalPrestation" tabindex="-1" aria-labelledby="exampleModalScrollable2"
        data-bs-keyboard="false" aria-hidden="true" data-bs-focus="false">
        <!-- Scrollable modal -->
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title" id="titleModalPrestation"></h6>
                    <button type="button" class="btn-close bg-light" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="formPrestation">
                        <input type="number" id="inpIDPRODUIT" name="IDPRODUIT" style="display : none;">
                        <h6 class="pb-1 mb-3 border-bottom border-danger border-3">Principales infos</h6>
                        <div class="row">
                            <div class="col-md-4 mb-2">
                                <p class="text-muted mb-0">Code prestation</p>
                                <input type="text" class="form-control text-center" name="CodeCipProduit1"
                                    id="inpCodeCipProduit1">
                            </div>
                            <div class="col-md-8 mb-2">
                                <p class="text-muted mb-0">Désignation</p>
                                <input type="text" id="inpDesignationProduit" name="DesignationProduit"
                                    class="form-control">
                            </div>
                            <div class="col-md-6 mb-2">
                                <p class="text-muted mb-0">Nature :</p>
                                <select name="IDCATEGORIEPRODUIT" id="selIDCATEGORIEPRODUIT" class="form-select"
                                    value="0"></select>
                            </div>
                            <div class="col-md-6 mb-2">
                                <p class="text-muted mb-0">Famille :</p>
                                <select name="IDFAMILLEPRODUIT" id="selIDFAMILLEPRODUIT" class="form-select"
                                    value="0"></select>
                            </div>
                        </div>
                        <h6 class="pb-1 mt-3 mb-3 border-bottom border-danger border-3">Gestion des PRIX</h6>
                        <div class="row">
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="Prix revient HT">Prix revient HT</p>
                                <input type="text" class="form-control numberInput text-end" id="inpPrixRevientHT"
                                    name="PrixRevientHT" value="0">
                            </div>
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="Prix cession HT">Prix cession HT</p>
                                <input type="text" class="form-control numberInput text-end" id="inpPrixCessionHT"
                                    name="PrixCessionHT" value="0">
                            </div>
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="Taux TVA">Taux TVA</p>
                                <select name="TypeTva" id="selTypeTva" class="form-select" value="0"></select>
                            </div>
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="Prix cession TTC">Prix cession TTC</p>
                                <input type="text" class="form-control numberInput text-end" id="inpPrixCessionTTC"
                                    name="PrixCessionTTC" value="0" disabled>
                            </div>
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="TM Net">TM Net (%)</p>
                                <input type="number" class="form-control text-center" value="0" disabled>
                            </div>
                            <div class="col-md-2">
                                <p class="text-muted ellipsis mb-0" title="Délais">Délais (jrs)</p>
                                <input type="text" class="form-control text-center numberInput"
                                    id="inpDelaiPaiementPrestation" name="DelaiPaiementPrestation" value="0">
                            </div>
                        </div>
                        <h6 class="pb-1 mt-3 mb-3 border-bottom border-danger border-3">Commentaire</h6>
                        <textarea name="CommentaireProduit" id="inpCommentaireProduit" class="form-control" cols="30" rows="5"></textarea>
                    </form>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-success" id="btnHistoriqueDesVentes">
                        <i class="bx bx-check-circle fs-18 me-2"></i>Historique des ventes
                    </button>
                    <button class="btn btn-success" id="btnModalHistoriqueDesPrix">
                        <i class="bx bx-check-circle fs-18 me-2"></i>Historique des prix
                    </button>
                    <button class="btn btn-success" id="btnCreerPrestation">
                        <i class="bx bx-check-circle fs-18 me-2"></i>Valider
                    </button>
                    <button class="btn btn-warning" id="btnModifierPrestation">
                        <i class="bx bx-edit fs-18 me-2"></i>Modifier
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal historique des prix -->
    <div class="modal fade" id="modalHistoriqueDesPrix" tabindex="-1" aria-labelledby="exampleModalScrollable2"
        data-bs-keyboard="false" aria-hidden="true" data-bs-focus="false">
        <!-- Scrollable modal -->
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title" id="titleModalHistoriqueDesPrix"></h6>
                    <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 d-flex align-items-center mb-3">
                        <div class="me-3">
                            <p class="text-muted mb-0">Période</p>
                            <input type="text" class="form-control text-center" name="datetimes"
                                id="filtrePeriodeHistoriqueDesPrix" />
                        </div>
                        <button type="button" class="btn btn-primary btn-wave mt-3"
                            id="btnFiltreTableHistoriqueDesPrix">
                            <i class="ri-search-line" style="font-size:13px; cursor:pointer;"></i>
                        </button>
                    </div>
                    <div class="table-responsive">
                        <table class="tablehover table table-striped text-nowrap overflow-auto w-100" id="tableHistoriqueDesPrix">
                            <thead class="table-header-primary">
                                <tr>
                                    <th class="text-center" data-column = "creeLeFormat" data-class="text-center">Date
                                    </th>
                                    <th class="text-center" data-column = "PFHT_EuroFormat" data-class="text-end pe-2">
                                        PFHT (Euro)</th>
                                    <th class="text-center" data-column = "PrixFHTFormat" data-class="text-end pe-2">PFHT
                                    </th>
                                    <th class="text-center" data-column = "PGHTFormat" data-class="text-end pe-2">PGHT
                                    </th>
                                    <th class="text-center" data-column = "DernierPrixRevientHTFormat"
                                        data-class="text-end pe-2">Dernier P. Revient HT</th>
                                    <th class="text-center" data-column = "PRMPHTFormat" data-class="text-end pe-2">PRMP
                                        HT</th>
                                    <th class="text-center" data-column = "TauxTVAFormat" data-class="text-center">Taux
                                        TVA</th>
                                    <th class="text-center" data-column = "TMBrutFormat" data-class="text-end pe-3">TM
                                        Brut</th>
                                    <th class="text-center" data-column = "TMNetFormat" data-class="text-end pe-3">TM Net
                                    </th>
                                    <th class="text-center" data-column = "PrixCessionHTFormat"
                                        data-class="text-end pe-3">P. Cession HT</th>
                                    <th class="text-center" data-column = "PrixCessionTTCFormat"
                                        data-class="text-end pe-3">P. Cession TTC</th>
                                    <th class="text-center" data-column = "NomPrenomPersonnel">Auteur</th>
                                    <th class="text-center" data-column = "CommentaireTracabilitePrix">Commentaire</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    {{-- Script executé au chargement de la page --}}
    <script>
        var tablePrestation

        $(function() {
            dateRangeInput('input[name="datetimes"]', true, "DD/MM/YYYY")
            // $('input[name="datetimes"]').daterangepicker({
            //     timePicker: true,
            //     // startDate: moment().startOf('day'),
            //     // endDate: moment().endOf('day'),
            //     "locale": {
            //         "format": "DD/MM/YYYY",
            //         "separator": " - ",
            //         "applyLabel": "Appliquer",
            //         "cancelLabel": "Annuler",
            //         "fromLabel": "From",
            //         "toLabel": "To",
            //         "customRangeLabel": "Custom",
            //         "weekLabel": "W",
            //         "daysOfWeek": [
            //             "Dim",
            //             "Lun",
            //             "Mar",
            //             "Mer",
            //             "Jeu",
            //             "Ven",
            //             "Sam"
            //         ],
            //         "firstDay": 2
            //     },
            // });
        })

        function calculPrixCessionTTC() {

            let PrixCessionTTC = chaineEnNumerique(_('inpPrixCessionHT').value)
            let taux = listeTauxTva.find((items) => items.IDTAUXTVA == parseInt(_('selTypeTva').value))

            if (taux != -1) {
                PrixCessionTTC = PrixCessionTTC * (1 + (taux.ValeurTauxTva / 100))
            } else {
                PrixCessionTTC = 0
            }

            _('inpPrixCessionTTC').value = PrixCessionTTC
            $('#inpPrixCessionTTC').trigger('input')
        }

        function listeDesPrestations(data = {}) {

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

                $.ajax({

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

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

                        resolve(response)

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

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

        function listeLigneSelectionne() {

            let data = []

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

            $.each($(lignes).find('.checkSelectLigne'), function(key, value) {

                if (value.checked == true) {
                    data.push(value.getAttribute('data-id'))
                }
            })
            return data
        }

        function chargerTableListeDesPrestations() {

            progressHandler()

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

                    let data = []

                    if (response.success == 1) {

                        data = response.data
                    }

                    tablePrestation = remplissageDataTable({
                        IdentifiantDuTableau: '#tablePrestation',
                        obj: data,
                        pageLength: 25,
                    })

                    let divShowPer = $('#tablePrestation_filter')
                    let BroDivShowPer = divShowPer.parent().parent()
                    let child = BroDivShowPer.children().eq(0)
                    let child2 = BroDivShowPer.children().eq(1)
                    child2.removeClass('col-md-6')
                    child2.addClass('col-md-4 d-flex  justify-content-end')
                    child.removeClass('col-md-6')
                    child.addClass('d-flex pt-2 col-md-8')
                    child.append(`
                                       <i id="suppLignesCochee" class="bx bxs-trash text-danger me-1 ms-2" style="font-size : 13px; cursor : pointer;margin-top:10px"></i><span id="labelSuppLignesCochee" class="fw-bold mt-2" style="cursor : pointer;">Supprimer les lignes cochées</span>
                                         <span class="d-flex align-items-center px-2" style="cursor : pointer;">
                                                <i class='ri ri-file-excel-2-line text-success me-1' style="font-size : 13px; cursor : pointer; margin-top:10px"></i>
                                                <span id="btn-export-prestation" class="fw-bold mt-2" style="cursor : pointer;">Exporter</span>
                                            </span>
                                        `)

                    completeHandler()
                }).catch(() => {

                    tablePrestation = remplissageDataTable({
                        IdentifiantDuTableau: '#tablePrestation',
                        obj: [],
                        pageLength: 25,
                    })

                    completeHandler()
                })
        }

        function listeNatureProduitSimple() {

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

                $.ajax({

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

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

                        resolve(response)

                        completeHandler()
                    },
                    error: function() {

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

        function listeTauxTva() {

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

                $.ajax({

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

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

                        resolve(response)

                        completeHandler()
                    },
                    error: function() {

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

        function listeFamilleSimple() {

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

                $.ajax({

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

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

                        resolve(response)

                        completeHandler()
                    },
                    error: function() {

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

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

                if (response.success == 1) {

                    let data = response.data

                    data.unshift({
                        IDCATEGORIEPRODUIT: 0,
                        LibelleCategorieProduit: ''
                    })

                    populateSelect('#selIDCATEGORIEPRODUIT', {
                        data: data,
                        valueKey: 'IDCATEGORIEPRODUIT',
                        textKey: 'LibelleCategorieProduit'
                    })

                    $('#selIDCATEGORIEPRODUIT').select2({
                        dropdownParent: $('#modalPrestation')
                    })
                }
            })

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

                if (response.success == 1) {

                    let data = response.data



                    data.unshift({
                        IDFAMILLEPRODUIT: 0,
                        LibelleFamilleProduit: ''
                    })

                    populateSelect('#selIDFAMILLEPRODUIT', {
                        data: data,
                        valueKey: 'IDFAMILLEPRODUIT',
                        textKey: 'LibelleFamilleProduit'
                    })

                    $('#selIDFAMILLEPRODUIT').select2({
                        dropdownParent: $('#modalPrestation')
                    })
                }
            })


        var listeTauxTva
        listeTauxTva()
            .then((response) => {

                if (response.success == 1) {

                    let data = response.data
                    listeTauxTva = response.data

                    data.unshift({
                        IDTAUXTVA: 0,
                        LibelleTauxTva: ''
                    })

                    populateSelect('#selTypeTva', {
                        data: data,
                        valueKey: 'IDTAUXTVA',
                        textKey: 'LibelleTauxTva'
                    })

                }
            })

        chargerTableListeDesPrestations()

        _('inpPrixCessionHT').addEventListener('blur', function() {

            if (this.value.replace(/\s/g, '') == '') {

                _('inpPrixCessionHT').value = 0
            }
        })

        _('inpPrixCessionHT').addEventListener('input', function() {

            calculPrixCessionTTC()
        })

        $(document).on('change', '#selTypeTva', function() {

            calculPrixCessionTTC()
        })
    </script>

    <!-- Script de sélection des lignes -->
    <script>
        _('checkSelectAll').addEventListener('click', function() {

            let value = this.checked

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

            $(lignes).find('.checkSelectLigne').prop('checked', value)
        })

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

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

    <!-- Script de suppression des prestations -->
    <script>
        var listeDesLigneSelectionne

        function suppressionDePrestation() {

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

                $.ajax({

                    url: "{{ route('suppressionDePrestation') }}",
                    type: 'POST',
                    data: {

                        data: listeDesLigneSelectionne,
                        _token: '{{ csrf_token() }}'
                    },
                    dataType: 'json',
                    // beforeSend : progressHandler(),
                    success: function(response) {

                        if (response.success != 1) {

                            notifError(response.msg)
                        }

                        resolve(response)

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

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

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

            $('#suppLignesCochee').trigger('click')
        })

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

            listeDesLigneSelectionne = listeLigneSelectionne()

            if (listeDesLigneSelectionne.length == 0) {

                notif('danger', 'Erreur', 'Veuillez sélectionner les lignes à supprimer')
                return 0
            }

            confirmMdp('{{ csrf_token() }}', suppressionDePrestation, null,
                    'Voulez-vous supprimer le(s) prestation(s) sélectionnée(s) ?', data = {
                        sousTitre: 'Le(s) ligne(s) en relation avec d\'autres fichiers ne seront pas supprimée(s).',
                        infoJNL: "SUPPRESSION DE PRESTATIONS",
                        typeJNL: 3,
                        CodeDroit: "DF_ProduitModifPays"
                    })
                .then((response) => {

                    if (response.success == 1) {

                        notif('success', 'Succès', 'Opération éffectuée avec succès.')
                        chargerTableListeDesPrestations()
                    }
                })
        })
    </script>

    <!-- Script modal prestation -->
    <script>
        function newModifPrestation() {

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

                let formPrestation = new FormData(_('formPrestation'))
                formPrestation.append('PrixCessionTTC', _('inpPrixCessionTTC').value)
                formPrestation.append('_token', '{{ csrf_token() }}')

                $.ajax({

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

                        if (response.success != 2) {

                            notifError(response.msg)
                        }

                        resolve(response)

                        completeHandler()
                    },
                    error: function() {

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

        // Ouverture en ajout
        _('btnNewPrestation').addEventListener('click', function() {

            _('btnHistoriqueDesVentes').style.display = 'none'
            _('btnModalHistoriqueDesPrix').style.display = 'none'
            _('btnCreerPrestation').style.display = ''
            _('btnModifierPrestation').style.display = 'none'

            _('titleModalPrestation').innerHTML = 'Nouvelle prestation'

            _('formPrestation').reset()
            $('#modalPrestation').modal('show')
        })

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

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

                notif('danger', 'Erreur', 'Renseigner le code de la prestation, SVP !')
                _('inpCodeCipProduit1').focus()
                return 0
            }

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

                notif('danger', 'Erreur', 'Renseigner le code de la prestation, SVP !')
                _('inpDesignationProduit').focus()
                return 0
            }

            confirmMdp('{{ csrf_token() }}', newModifPrestation, null, title = '', data = {
                    sousTitre: '',
                    infoJNL: "CREATION/MODIFICATION DE PRODUIT SUR AGENCE PAYS",
                    typeJNL: 3,
                    CodeDroit: "DF_ProduitModifPays"
                })
                .then((response) => {

                    if (response.success == 2) {

                        chargerTableListeDesPrestations()
                        $('#modalPrestation').modal('hide')
                    }
                })
        })

        // Ouverture en modif
        $(document).on('click', '#editPrestation', function() {

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

            listeDesPrestations({
                    IDPRODUIT: IDPRODUIT
                })
                .then((response) => {

                    if (response.success == 1) {

                        let data = response.data

                        _('titleModalPrestation').innerHTML = 'Modifier la prestation ( ' + data
                            .DesignationProduit + ' )'

                        _('btnHistoriqueDesVentes').style.display = ''
                        _('btnModalHistoriqueDesPrix').style.display = ''
                        _('btnCreerPrestation').style.display = 'none'
                        _('btnModifierPrestation').style.display = ''

                        remplirLeForm('formPrestation', data)
                        $('.numberInput').trigger('input')
                        $('#modalPrestation').modal('show')
                    }
                })
        })

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

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

                notif('danger', 'Erreur', 'Renseigner le code de la prestation, SVP !')
                _('inpCodeCipProduit1').focus()
                return 0
            }

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

                notif('danger', 'Erreur', 'Renseigner le code de la prestation, SVP !')
                _('inpDesignationProduit').focus()
                return 0
            }

            confirmMdp('{{ csrf_token() }}', newModifPrestation, null, title = '', data = {
                    sousTitre: '',
                    infoJNL: "CREATION/MODIFICATION DE PRODUIT SUR AGENCE PAYS",
                    typeJNL: 3,
                    CodeDroit: "DF_ProduitModifAgence"
                })
                .then((response) => {

                    if (response.success == 2) {

                        chargerTableListeDesPrestations()
                        $('#modalPrestation').modal('hide')
                    }
                })
        })
    </script>

    <!-- Script de modal d'historique de prix -->
    <script>
        // var tableHistoriqueDesPrix

        // function chargerTableListeHistoriquePrix(IDPRODUIT) {

        //     let Periode = convertirFormatDate2(_('filtrePeriodeHistoriqueDesPrix').value)

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

        //     $.ajax({

        //         url: "{{ route('chargerTableListeHistoriquePrix') }}",
        //         type: 'POST',
        //         data: {
        //             IDPRODUIT: IDPRODUIT,
        //             dateDebut: Periode[0],
        //             dateFin: Periode[1],
        //             _token: '{{ csrf_token() }}'
        //         },
        //         dataType: 'json',
        //         beforeSend: progressHandler(),
        //         success: function(response) {

        //             let data = []

        //             if (response.success == 1) {

        //                 data = response.data
        //             } else {

        //                 notifError(response.msg)
        //             }

        //             // resolve(response)

        //             tableHistoriqueDesPrix = remplissageDataTable({
        //                 IdentifiantDuTableau: '#tableHistoriqueDesPrix',
        //                 obj: data,
        //                 pageLength: 25,
        //                 lengthChange: false,
        //                 bFilter: false
        //             })

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

        //             tableHistoriqueDesPrix = remplissageDataTable({
        //                 IdentifiantDuTableau: '#tableHistoriqueDesPrix',
        //                 obj: [],
        //                 pageLength: 25,
        //                 lengthChange: false,
        //                 bFilter: false
        //             })

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

        // _('btnFiltreTableHistoriqueDesPrix').addEventListener('click', function() {

        //     chargerTableListeHistoriquePrix(_('inpIDPRODUIT').value)
        // })
    </script>

    <!-- Script ouverture de la modal historique de prix -->
    <script>
        _('btnModalHistoriqueDesPrix').addEventListener('click', function() {

            // $('#modalPrestation').modal('hide')
            closeOpenModalAndKeepId()
            $('#ckeckCloseModal').val(_('inpIDPRODUIT').value)
            afficherHistoPrix(_('inpIDPRODUIT').value, _('periode-HP').value)
            // $('#modalHistoriqueDesPrix').modal('show')

            // _('titleModalHistoriqueDesPrix').innerHTML = 'Historique des prix : ' + _('inpDesignationProduit').value

            // tableHistoriqueDesPrix = remplissageDataTable({
            //     IdentifiantDuTableau: '#tableHistoriqueDesPrix',
            //     obj: [],
            //     pageLength: 25,
            //     lengthChange: false,
            //     bFilter: false
            // })
        })
        _('btnHistoriqueDesVentes').addEventListener('click', function() {

            closeOpenModalAndKeepId()
            $('#ckeckCloseModal').val(_('inpIDPRODUIT').value)
            $("#ficheProd-IDPROD").val(_('inpIDPRODUIT').value)
            $('#modalHistoVentes').modal('show')
            
        })

        // Ferméture de la modal
        // $('#modalHistoriqueDesPrix').on('hidden.bs.modal', function() {
        //     $('#modalPrestation').modal('show')
        // })

        // $(document).on('click', '#Histo-ventes-modal-p', function () {
        //     var idProduit = $(this).data('id')
        //     $('#ckeckCloseModal').val(idProduit)

        //     $('#modalHistoVentes').modal("show");
        // })
        // $(document).on('click', '#btnModalHistoriqueDesPrix', function () {
        //     var idProduit = $(this).data('id')
        //     $('#ckeckCloseModal').val(idProduit)
        //     afficherHistoPrix(idProduit, _('periode-HP').value)
        // })

        $(document).on('click', '#btn-export-prestation', function() {

            var data = getCleanedTableData('tablePrestation')
            const filename = file_name("PRESTATION");
            const tabs_format = {
                F: '#,##0',
                G: '#,##0'
            };

            download_excel_file('{{ route('export_global_excel.export') }}', data, filename, [], tabs_format)
        })
    </script>
@endsection