@php
  $D_Creation_reglementFactureLocation = session()->get('D_Creation_reglementFactureLocation');
  $D_Modification_reglementFactureLocation = session()->get('D_Modification_reglementFactureLocation');
  $D_Suppression_reglementFactureLocation = session()->get('D_Suppression_reglementFactureLocation');
@endphp
@include('../header')

<main class="main" id="top">

    @include('../navigation')
    <div class="content">
        @include('../loading')
        <div class="d-flex justify-content-between">
            <h4> <i class="fas fa-fan"></i> Listes des règlements</h4>
            <div class="d-flex">
                
                    <button type="button" id="ImprimerListeReglementLocataire" style="margin-right:8px;"  class="btn btn-warning btn-sm rounded-pill"><i data-feather="printer"></i>
                        Impression
                    </button>
            @if($D_Creation_reglementFactureLocation)
                 <button type="button" id="BtnAppelModalReglement" class="btn btn-success btn-sm rounded-pill"
                data-bs-toggle="modal" data-bs-target="#ModalReglementLocataire"><i data-feather="plus-circle"></i>
                Ajouter</button>
            @endif
            </div>
           
        </div>
        <hr>
            <br>
                <div class="d-flex justify-content-center flex-wrap animate__animated animate__zoomIn">
                
                    <div style="margin-right:10px;">
                        <p class="Nomask fs-1">Montant total : <span class="text-warning fs-1" id="MontantTotal"></span> </p>
                         <p class="mask" style="display:none;">Montant Total : <span class="text-warning fs-1">***** F</span> </p>
                    </div>

                    <div style="margin-right:10px;">
                         <p class="Nomask fs-1">Total utilisé : <span class="text-success fs-1" id="TotalRegle"></span></p>
                          <p class="mask"  style="display:none;">Total utilisé : <span class="text-success fs-1" >***** F</span></p>
                    </div>

                    <div  style="margin-right:10px;">
                        <p class="Nomask fs-1">Solde :  <span class="text-danger fs-1" id="TotalRestant"></span></p>
                        <p class="mask"  style="display:none;">Solde :  <span class="text-danger fs-1" >***** F</span></p>
                    </div>

                    <div>
                        <p><i class="fa fa-eye-slash fs-2 mt-1 cursor-pointer masquerTotaux"></i></p>
                         <i class="fa fa-eye fs-2 cursor-pointer voirTotaux" style="display:none;"></i>
                    </div>
                </div>
            <br>

        <div class="card card-shadow">
            <div class="card-body">

                <div class="d-flex justify-content-center">
                    <input style="width:300px; text-align:center"
                        class="form-control datetimepicker flatpickr-input dateInputSearch dateInput" type="text"
                        placeholder="d/m/Y À d/m/Y"
                        data-options="{&quot;mode&quot;:&quot;range&quot;,&quot;dateFormat&quot;:&quot;d/m/Y&quot;,&quot;disableMobile&quot;:true}"
                        readonly="readonly">
                
                    <button class="btn btn-success me-1" id="dateSearch" style="margin-left:12px;">
                         <i class="fa fa-search cursor-pointer  text-light "></i>
                    </button>
                </div>

                <div class="table-responsive">
                    <table id="ReglementFactureTable" class="table table-striped w-100">
                        <thead class="tableauEntete">
                            <tr>
                                <th>Actions</th>
                                <th>Date</th>
                                <th>Référence Automatique</th>
                                <th>Référence Manuelle</th>
                                <th>Locataire</th>
                                <th>Mode règlement</th>
                                <th>Numero chèque</th>
                                <th>Banque</th>
                                <th>Statut</th>
                                <th>Montant</th>
                                <th>Total utilisé</th>
                                <th>Solde</th>
                                <th>Infos création</th>
                                
                            </tr>
                        </thead>

                    </table>
                </div>

            </div>
        </div>

        <div class="modal fade" id="ModalReglementLocataire" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header modal-header-Bg">
                        <h5 class="modal-title text-white" id="Titremodal"></h5>
                        <button class="btn p-1 CloseModalBtn FermerCreationReglementLocataire" type="button"><span class="fas fa-times fs--1 text-white"></span></button>
                        <button type="button" class="btn btn-outline-danger CloseModalBtn FermerModificationReglementLocataire" id="FermerModificationReglementLocataire" style="display:none">Fermer</button>
                    </div>
                    <div class="modal-body">
                        <form class="formReglementAdd  needs-validation p-0" method="POST" novalidate>
                            
                                    @include('OPERATIONS/FORMS/ReglementLocataireForm')  

                    </div>
                    <div class="modal-footer">

                        <button class="btn btn-outline-danger FermerCreationReglementLocataire" type="button">Fermer</button>
                        <button type="button" class="btn btn-outline-danger FermerModificationReglementLocataire" id="FermerModificationReglementLocataire" style="display:none">Fermer</button>
                        <button class="btn btn-success" type="submit">Enregistrer</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="ModalFaireReglementLocataire" tabindex="-1" aria-labelledby="staticBackdropLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header modal-header-Bg">
                        <h5 class="modal-title text-white" id="staticBackdropLabel">Utilisation de règlement</h5><button
                            class="btn p-1 CloseModalBtn" type="button" data-bs-dismiss="modal"
                            aria-label="Close"><span class="fas fa-times fs--1 text-white"></span></button>
                    </div>
                    <div class="modal-body">
                        <form class="formReglementLigneAdd  needs-validation p-0" method="POST" novalidate>
                            
                                 @include('OPERATIONS/FORMS/ReglementLigneForm')

                         </form>
                        <div class="card card-shadow mt-4">
                        
                        <div class="card-body">

                            <div class="table-responsive">
                            <table id="TableFactureReglementLigne" class="table table-striped w-100">
                                <thead>
                                    <tr>
                                        <th>Actions</th>
                                        <th>Facture</th>
                                        <th>Location</th>
                                        <th>Bien</th>
                                        <th>Date opération</th>
                                        <th>Montant</th>
                                        <th>MontantMasquer</th>
                                        <th>Date de Créarion</th>
                                    </tr>
                                </thead>
                                
                            </table>
                         </div>
                        
                        </div>
                        </div>
                         
                         
                    </div>
                    <div class="modal-footer">

                        <button class="btn btn-outline-danger" type="button" data-bs-dismiss="modal">Fermer</button>                       
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="ModalVoirReglementLigneLocataire" tabindex="-1" aria-labelledby="staticBackdropLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-xl">
                <div class="modal-content">
                    <div class="modal-header modal-header-Bg">
                        <h5 class="modal-title text-white" id="staticBackdropLabel">Détails règlement <span id="RefReglement"></span></h5><button
                            class="btn p-1 CloseModalBtn" type="button" data-bs-dismiss="modal"
                            aria-label="Close"><span class="fas fa-times fs--1 text-white"></span></button>
                    </div>
                    <div class="modal-body">

                        <div class="d-flex justify-content-between">
                            <div>
                            <span>Total : </span> <span class="text-warning" id="totalFactReglement"></span>
                            </div>

                            <div id="blockLocataire">
                             </div>
                             <div></div>
                        </div>
                        <div class="card card-shadow mt-4">
                        
                        <div class="card-body">


                            <div class="table-responsive">
                            <table id="TableVoirReglementLigne" class="table table-striped w-100">
                                <thead>
                                    <tr>
                                       
                                        <th>Facture</th>
                                        <th>Location</th>
                                        <th>Bien</th>
                                        <th>Date opération</th>
                                        <th>Montant</th>
                                        <th>MontantMasquer</th>
                                        <th>Date de Créarion</th>
                                    </tr>
                                </thead>
                                
                            </table>
                         </div>
                        
                        </div>
                        </div>
                         
                         
                    </div>
                    <div class="modal-footer">

                        <button class="btn btn-outline-danger" type="button" data-bs-dismiss="modal">Fermer</button>                       
                    </div>
                </div>
            </div>
        </div>

        <dialog id="dialog">
            <h4>Informations.</h4>
            {{-- <div style="width:200px;height:80px;background:gray;"></div>  --}}
            <p></p>
            <div id="UserInfoBlock">
            </div>

            <button onclick="window.dialog.close();" aria-label="close" class="x">x</button>
        </dialog>


        @include('../primary_footer')

    </div>

    @include('../chatblock')

</main>

@include('../rightbar')

@include('../footer')

<script>
    $(document).ready(function() {

        $('.nomPage').text('Règlement Facture')

        $('.modal').each(function() {
            $(this).find('.Pselect2X').select2({
                dropdownParent: $(this),
                width: '100%' 
            });
        });
        GetLocataire();
        referenceReglement();
        
        recuperationTypedePiece()
        var dateDebut = dateDebRecuperationdonnees()
        var dateFin = dateFinRecuperationdonnees()
        recuperationReglement(dateDebut,dateFin);
        //var modificationDocumentStatut = false;
        
         Filepond()
        const inputElement = document.querySelector('input[name="media[]"]');
        const pond = FilePond.create(inputElement);

        $('#montantReglement').on('input', function() {
            var inputVal = $(this).val().replace(/ /g, "");
                if (!isNaN(inputVal)) {
                    let formattedVal = numberWithSpaces(inputVal);
                    $(this).val(formattedVal);
                }
        });

        $('#montantReglementLigne').on('input', function() {
            var inputVal = $(this).val().replace(/ /g, "");
                if (!isNaN(inputVal)) {
                    let formattedVal = numberWithSpaces(inputVal);
                    $(this).val(formattedVal);
                }
        });

        $("#TableFactureReglementLigne").DataTable({

            searching: false,
            bLengthChange: false,
            language: {
                processing: false,
                search: "Rechercher&nbsp;:",
                lengthMenu: "Afficher :&nbsp;  _MENU_&nbsp;lignes",
                info: "Affichage de ligne _START_ &agrave; _END_ sur _TOTAL_&nbsp;lignes",
                infoEmpty: "Affichage de ligne 0 &agrave; 0 sur 0&nbsp;lignes",
                infoFiltered: "(filtr&eacute; de _MAX_&nbsp;lignes au total)",
                infoPostFix: "",
                loadingRecords: "Chargement en cours...",
                zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable: '<img src="assets/img/spot-illustrations/empty.png" style="width:500px;"/><br>Aucune donnée disponible dans le tableau',

                paginate: {
                    first: "",
                    previous: "<",
                    next: ">",
                    last: ""
                },
                aria: {
                    sortAscending: ": activer pour trier la colonne par ordre croissant",
                    sortDescending: ": activer pour trier la colonne par ordre décroissant"
                }
            },
            pagingType: 'full_numbers',
            pageLength: 10,
            columnDefs:[
                {
                    targets:[2],
                    className:'text-center'
                },
                {
                    targets:[6],
                    visible:false
                },
                {
                    targets:[0,1],
                    className:'text-center'
                },
                 {
                    targets:[3],
                    className:'text-end'
                }

            ]
           
        });

        $("#TableVoirReglementLigne").DataTable({

            searching: false,
            bLengthChange: false,
            language: {
                processing: false,
                search: "Rechercher&nbsp;:",
                lengthMenu: "Afficher :&nbsp;  _MENU_&nbsp;lignes",
                info: "Affichage de ligne _START_ &agrave; _END_ sur _TOTAL_&nbsp;lignes",
                infoEmpty: "Affichage de ligne 0 &agrave; 0 sur 0&nbsp;lignes",
                infoFiltered: "(filtr&eacute; de _MAX_&nbsp;lignes au total)",
                infoPostFix: "",
                loadingRecords: "Chargement en cours...",
                zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable: '<img src="assets/img/spot-illustrations/empty.png" style="width:500px;"/><br>Aucune donnée disponible dans le tableau',

                paginate: {
                    first: "",
                    previous: "<",
                    next: ">",
                    last: ""
                },
                aria: {
                    sortAscending: ": activer pour trier la colonne par ordre croissant",
                    sortDescending: ": activer pour trier la colonne par ordre décroissant"
                }
            },
            pagingType: 'full_numbers',
            pageLength: 10,
            columnDefs:[
                {
                    targets:[2],
                    className:'text-center'
                },
                {
                    targets:[5],
                    visible:false
                },
                {
                    targets:[0,1,3],
                    className:'text-center'
                },
                 {
                    targets:[4],
                    className:'text-end'
                }

            ]
           
        });

        
        $("#ReglementFactureTable").DataTable({
            language: {
                processing: false,
                search: "Rechercher&nbsp;:",
                lengthMenu: "Afficher :&nbsp;  _MENU_&nbsp;lignes",
                info: "Affichage de ligne _START_ &agrave; _END_ sur _TOTAL_&nbsp;lignes",
                infoEmpty: "Affichage de ligne 0 &agrave; 0 sur 0&nbsp;lignes",
                infoFiltered: "(filtr&eacute; de _MAX_&nbsp;lignes au total)",
                infoPostFix: "",
                loadingRecords: "Chargement en cours...",
                zeroRecords: "Aucun &eacute;l&eacute;ment &agrave; afficher",
                emptyTable: '<img src="assets/img/spot-illustrations/empty.png" style="width:500px;"/><br>Aucune donnée disponible dans le tableau',

                paginate: {
                    first: "",
                    previous: "Pr&eacute;c&eacute;dent",
                    next: "Suivant",
                    last: ""
                },
                aria: {
                    sortAscending: ": activer pour trier la colonne par ordre croissant",
                    sortDescending: ": activer pour trier la colonne par ordre décroissant"
                }
            },
            pagingType: 'full_numbers',
            pageLength: 25,
            columnDefs: [{
                targets: [0, 1, 3],
                className: 'text-center'
            },
            {
                targets: [4],
                className: 'tblWidth-1'
            },
            {
                targets: [9,10,11],
                className: 'tblWidth-3 text-end'
            },

            {
                targets: [8],
                className: 'tblWidth-3 text-center'
            },

            {
                targets: [2,3,5,6,7],
                className: 'tblWidth-2 text-center'
            },
             {
                targets: [12],
                className: 'tblWidth-2'
            },

            ]
        });

    
        $('#BtnAppelModalReglement').on('click', function() {
            $('#Titremodal').text('Nouveau règlement')
            $('.InputIDRegelement').val(0)
            $('.formReglementAdd')[0].reset()
             referenceReglement()
        })

        $('.formReglementAdd').on('submit', function(e) {
            e.preventDefault();

            if (!$(this)[0].checkValidity()) {
                $(this).addClass('was-validated');
                e.preventDefault();
                e.stopPropagation();
            } else {
                e.preventDefault();
                MesrequetesAjax("{{ Route('Reglement.creer') }}", "POST", new FormData(
                        this), false, false,
                    "JSON",
                    function(resp) {
                        $('#ModalReglementLocataire').modal('hide');
                         recuperationReglement(dateDebut,dateFin);
                        Notification('Succès', resp.msg, 'top-right', 'success')
                        $('.InputIDRegelement').val(0)
                        $('.formReglementAdd')[0].reset()
                        $('.formReglementAdd').removeClass('was-validated');
                    },
                    function(error) {},
                    function() {
          
                        if ($.trim($('.montantReglementLocataire').val()).length == 0) {
                          
                            return false;
                        }
                         
                        if ($('.ModeReglementSelects').val().length == 0) {
                           
                            return false;
                        } 
                         
                        if ($('.LocataireSelect').val().length == 0) {
                            return false;
                        }
                        
                        if ($('.dateReglement').val().length == 0) {
                            return false;
                        }
                      

                    })

            }

        })

        $(document).on('click', '#Modification-btn', function() {
            $('#Titremodal').text('Modification règlement')
            var IDReglement = $(this).attr('data-id');
            var locataire = '';
            MesrequetesAjax("{{ route('Reglementfacture.recuperation') }}", "GET", {
                    IdReglement: IDReglement
                }, false, true,
                "JSON",
                function(resp) {

                    
                    $('.dateReglement').val(formatageDate(new Date(resp.data[0].dateReglement)))
                    InputSeparateurMillierAffectation(resp.data[0].montantReglement,$('.montantReglementLocataire'))
                   
                    $('.InputIDRegelement').val(resp.data[0].IDReglementLocataire);
                    $('#ReferenceReglement').val(resp.data[0].RefReglementInterne);
                    $('#ReferenceReglementNumerique').val(resp.data[0].RefReglementNumerique);
                    $('#ReferenceReglementExterne').val(resp.data[0].RefReglementExterne);
                    $('#ObservationReglement').val(resp.data[0].ObservationReglement);
                    $('.ModeReglementSelect').val(resp.data[0].IDModeReglement).trigger('change')
                    $('.LocataireSelect').val(resp.data[0].IDLocataire).trigger('change')
                    $('.NomBanque').val(resp.data[0].IDBanque)
                    $('.NumeroCheque').val(resp.data[0].numeroCheque)
                    
                    var table = $("#FormTableDocumentTableReglementLocataire").DataTable()
                 
                        table.clear().draw();
                        $.each(resp.PieceJointe,function(key,value){
                            table.row.add(['<i class="fa fa-trash text-danger cursor-pointer" id="suppressiondocument" data-id="'+value.IDPiecejoint+'"></i>',value.libelleType_piece,value.referenceDocument,value.UrlFichier])
                        })

                        table.draw(); 

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

        $(document).on('click', '#CheckUser', function() {
             $('#UserInfoBlock').html('')
             var IdLocataire = $(this).attr('data-id');
             var photoprofil ="";
              var prenom ="";
             MesrequetesAjax("{{ route('LocataireParId.recuperation') }}", "GET", {IDLocataire:IdLocataire}, false, true, "JSON", function(resp) {
                     if(resp.data[0].prenom !=null){
                         prenom = resp.data[0].prenom;
                     }

                    photoprofil = resp.data[0].photoProfil;

                    if(resp.data[0].TypeLocataire==1 && resp.data[0].photoProfil ==null ){

                            photoprofil = ' <img style="border:2.5px solid green; width:50px; height:50px; border-radius:80px;" src="media/imgDefault/userDefault.png">';
                    } 

                    if(resp.data[0].TypeLocataire!=1 && resp.data[0].photoProfil ==null ){
                      
                       photoprofil = ' <img style="border:2.5px solid green; width:50px; height:50px; border-radius:80px;" src="media/imgDefault/buldingDefault.png">';
                    }

                    if(resp.data[0].photoProfil !=null){

                        photoprofil = '<img style="border:2.5px solid green; width:50px; height:50px; border-radius:80px;" src="media/PhotoProfil/'+photoprofil+'">'
                    }
                   
                     $('#UserInfoBlock').append('<div class="card card-shadow" style="border-radius:30px 0px 10px 30px">\
                    <div class="d-flex">'+photoprofil+'\
                        <div style="margin-left:20px;margin-top:10px;"> <h3>'+resp.data[0].nom+' '+prenom+'</h3></div></div></div> <br>\
                    <div class="d-flex"><div><i class="fa fa-envelope text-warning" style="font-size:20px"></i></div><div style="margin-left:20px;">\
                            <h5>'+resp.data[0].mail+'</h5></div> </div>\
                    <div class="d-flex"><div><i class="fa fa-phone text-danger" style="font-size:20px"></i></div><div style="margin-left:20px;">\
                            <h5>'+resp.data[0].telephoneMobile+'</h5></div></div>');
                    window.dialog.showModal()

             })
        })

        $(document).on('click','#SupprimerRegelement',function(){
            var IdReglement = $(this).attr('data-id');
             SuppressionElement(IdReglement,'reglements_locataires','IDReglementLocataire',recuperationReglement)
        })

        $(document).on('click','#EffectuerRegelement',function(){
              var refReglement = $(this).attr('data-reference')
              var montantReglement = $(this).attr('data-montant')
              var soldeReglement = $(this).attr('data-solde')
              var IDReglement = $(this).attr('data-reglementid')
              var IDLocataire=  $(this).attr('data-idlocataire');
              $('.IDLocataireInputHidden').val(IDLocataire);
              ListFacture(IDLocataire)
              recuperationReglementLigne(IDReglement)
            $('#refReglementL').text(refReglement);
            $('#MontantReglementL').text(montantReglement);
            $('#SoldeReglementL').text(soldeReglement);
            $('.IDReglementInputHidden').val(IDReglement);

            $('#RefFactSelectionner').text('---')
            $('#MontantFactSelectionner').text('---')
            $('#MontantRestantFactSelectionner').text('---')

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

        $(document).on('change','#ListFactureSelect',function(){
            var IDFactures = $(this).val();
            $('.IDFactureLigneInputHidden').val(IDFactures)
            factureByID(IDFactures)
        })

        $('.formReglementLigneAdd').on('submit',function(e){

            var IdReglement = $('.IDReglementInputHidden').val()
            var MontantSaisir = $('.montantReglementLigne').val();
            var IDLocataireInputHidden =$('.IDLocataireInputHidden').val();
            var idFacturePrestation = $('.IDFactureLigneInputHidden').val()
           
            var solde = $('#SoldeReglementL').text();
            var soldeL = solde.replace(/\s/g, '')
             if (!$(this)[0].checkValidity()) {
                $(this).addClass('was-validated');
                e.preventDefault();
                e.stopPropagation();
            } else {
                e.preventDefault();
                MesrequetesAjax("{{ Route('ReglementLigne.creer') }}", "POST", new FormData(
                        this), false, false,
                    "JSON",
                    function(resp) {
                       
                         recuperationReglementLigne(IdReglement)
                        // ListFacture(IDLocataireInputHidden);
                          var GetSoldes = parseInt(soldeL);
                          var montantSaisirs = MontantSaisir.replace(/\s/g, '')
                          var montantSaisirsNumerique = parseInt(montantSaisirs)
                          var operation = GetSoldes-montantSaisirsNumerique;
                          var result = formaterNombre(operation);
                       
                         recuperationReglement(dateDebut,dateFin)
                         Notification('Succès', resp.msg, 'top-right', 'success')
                         $('.IDReglementLigneUpdateHidden').val(0)
                         $('.formReglementLigneAdd')[0].reset()
                         $('.formReglementLigneAdd').removeClass('was-validated');


                        factureByID(idFacturePrestation)
                        $('#ListFactureSelect').val(idFacturePrestation).trigger('change')

                         MesrequetesAjax("{{ route('Reglementfacture.recuperation') }}", "GET", {IdReglement:IdReglement}, false, true,
                        "JSON",
                        function(response) {

                            $('#refReglementL').text(response.data[0].RefReglementInterne);
                            $('#MontantReglementL').text(formaterNombre(response.data[0].montantReglement)+' F');
                            $('#SoldeReglementL').text(formaterNombre(parseInt(response.data[0].montantReglement) - parseInt(response.data[0].TotalUtilise))+' F');
                        })

                        
                         $('#btn-validerReglementLigne').text('Valider')
                    },
                    function(error) {},
                    function() {
                        if ($('.montantReglementLigne').val().length == 0) {
                            return false;
                        }
                        var MontantFacture= $('#MontantRestantFactSelectionner').text();
                        var MontantFact = MontantFacture.replace(/\s/g, '')
                        var mtFact = parseInt(MontantFact);

                        var montantInserer = $('.montantReglementLigne').val().replace(/\s/g, '');
                       
                       // montantRestantFacture
                       if($('.IDReglementLigneUpdateHidden').val()==0){

                            if(mtFact < parseInt(montantInserer)){
                                $('.montantEleve').text('Le montant entré ne doit être supérieur au montant restant de la facture')
                                return false;
                            }else{
                                $('.montantEleve').text('')
                            }

                             var GetSolde = parseInt(soldeL);

                        if(parseInt(montantInserer) > GetSolde ){
                            Notification('Erreur','Vous ne disposer pas de solde suffisant pour éffectuer ce règlement','top-right','error')
                            return false;
                        }

                       }else{

                            var ancienMontant = $('.MontantForModificationInputHidden').val()
                            var diff = parseInt(montantInserer) - parseInt(ancienMontant)
                            if( diff > mtFact ){
                                $('.montantEleve').text('Le montant entré ne doit être supérieur au montant restant de la facture')
                                return false;
                            }

                             var GetSolde = parseInt(soldeL);

                        if(diff > GetSolde ){
                            Notification('Erreur','Vous ne disposer pas de solde suffisant pour éffectuer ce règlement','top-right','error')
                            return false;
                        }
                       }

                        if ($('.ListFactureSelect').val().length == 0) {
                            return false;
                        } 
                    })
                    
                    
                    
             }
          
        })

        $(document).on('click','#DeleteReglementLigne',function(){
            var IDreglement = $(this).attr('data-id');
            var IDreglementligne = $(this).attr('data-idreglementligne');
            var idFacturePrestation = $('.IDFactureLigneInputHidden').val()
            var IdReglement = $('.IDReglementInputHidden').val()
            $.confirm({
                icon: 'fa fa-warning',
                title: '<span style="font-size:16px;color:black; font-weight:bolder">Voulez-vous vraiment supprimer ?</span>',
                content: 'Cette action est irévessible',
                type: 'red',
                typeAnimated: true,
                buttons: {
                    tryAgain: {
                        text: 'Valider',
                        btnClass: 'btn-red',
                        action: function() {
                MesrequetesAjax("{{ route('ReglementLigne.supprimer') }}", "GET",{IdReglementLigne:IDreglementligne}, null, true, "JSON", function(resp) {
                    Notification('Succès', resp.msg, 'top-right', 'success')
                    recuperationReglementLigne(IDreglement);
                    //ListFacture();
                    factureByID(idFacturePrestation)

                        MesrequetesAjax("{{ route('Reglementfacture.recuperation') }}", "GET", {IdReglement:IdReglement}, false, true,
                            "JSON",
                            function(response) {

                            
                                $('#refReglementL').text(response.data[0].RefReglementInterne);
                                $('#MontantReglementL').text(formaterNombre(response.data[0].montantReglement)+' F');
                                $('#SoldeReglementL').text(formaterNombre(parseInt(response.data[0].montantReglement) - parseInt(response.data[0].TotalUtilise))+' F');
                            })

                            $('.formReglementLigneAdd')[0].reset()
                })

                    }
                    },

                    fermer: {
                        text: 'Fermer',
                    },
                    //close: function () {}
                }
            });
            
        })

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

                var table = $("#TableFactureReglementLigne").DataTable();
                var idReglementLigne = $(this).attr('data-idreglementligne')
                var rowNode = $(this).parent();
                var Facture = table.row(rowNode).data()[1];
               
                $('#ListFactureSelect').html('')
                    
                    MesrequetesAjax("{{ route('FactureReglementLigneModification.recuperation') }}", "GET", null, true, true, "JSON", function(response) {
                        $.each(response.ligne, function(key, value) {

                            if(value.refFacture==Facture){
                                    
                                    factureByIDModifReglementLigne(value.IDFacture,table.row().data()[4])
                                $('.ListFactureSelect').append('<option selected value="'+value.IDFacture+'">'+value.refFacture+'</option>')
                            }else{
                                $('#ListFactureSelect').append($('<option>', {
                                value: value.IDFacture,
                                text: value.refFacture
                            }))
                            }
                            
                        })
                    });

                    $('.IDReglementLigneUpdateHidden').val(idReglementLigne)
                   
                    InputSeparateurMillierAffectation(table.row().data()[6],$('.montantReglementLigne'))
                    $('.MontantForModificationInputHidden').val(table.row().data()[6])
                    $('.dateReglementLigne').val(table.row().data()[4])
                    $('#btn-validerReglementLigne').text('Modifier')

        })

        $('#dateSearch').on('click', function() {

            if($('.dateInputSearch').val().length==0){
               Notification('Erreur', 'Veuillez renseigner une intervalle de date', 'top-right', 'error')
                return false;
            }
            var e = $('.dateInputSearch').val();
            var dateDepart = e.slice(0, 10)
            var dateFin = e.slice(13, 23)
            var dateDepartFormater = dateDepart.slice(6, 10) + '-' + dateDepart.slice(3, 5) + '-' +dateDepart.slice(0, 2)
            var dateFinFormater = dateFin.slice(6, 10) + '-' + dateFin.slice(3, 5) + '-' + dateFin.slice(0, 2)
            recuperationReglement(dateDepartFormater,dateFinFormater);
        })

        $(document).on('click', '.masquerTotaux', function(){
                $(this).css('display','none');
                $('.mask').css('display','block');

                $('.Nomask').css('display','none');
                $('.voirTotaux').css({'display':'block','margin-top':'-10px'});
        })

        $(document).on('click', '.voirTotaux', function(){
                    $(this).css('display','none');
                    $('.mask').css('display','none');

                    $('.Nomask').css('display','block');
                    $('.masquerTotaux').css({'display':'block','margin-top':'-10px'});
        })

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

                var GetId = $(this).data('id')
                var locataire = $(this).data('locataire')
                var typelocataire = $(this).data('typelocataire')
                var Reference = $(this).data('reference')
                
                $('#RefReglement').text('('+Reference+')')
                var GetLocataire =''
                if(typelocataire == 1){
                  GetLocataire='<img class="imgInTableRow" src="media/imgDefault/userDefault.png">' 
                }else{
                     GetLocataire = '<img class="imgInTableRow" src="media/imgDefault/buldingDefault.png">';
                }
                $('#blockLocataire').html('')
                $('#blockLocataire').append(''+GetLocataire+' '+locataire+'')
                 recuperationReglementLigneEtat(GetId)
                 $('#ModalVoirReglementLigneLocataire').modal('show')

        })
        

        $(document).on('change', '#StatusChequeSelect', function(){
                
                var valeur = $(this).val()
                var selectedOption = $(this).find('option:selected');
                var IdRegelement = selectedOption.attr('data-id');

            MesrequetesAjax("{{ route('miseAjourStatusReglementModeCheque.modifier') }}", "GET", {IDRegelement:IdRegelement,IDStatus:valeur}, null, true, "JSON", function(resp) {
               
              Notification('Succès',resp.msg,'top-right','success');
               recuperationReglement(dateDebut,dateFin);
    
            });
        })

    //26-01-2024
    // IMPRESSION LISTE DES REGLEMENTS LOCATAIRE
    $(document).on('click','#ImprimerListeReglementLocataire',function(){

            // mode:0 => impression sans Entete
            $.confirm({
                icon: 'fa fa-warning',
                title: '<span style="font-size:13px;color:black; font-weight:bolder">Voulez-vous imprimer le reçu avec entête ?</span>',
                content: 'Cette action est irévessible',
                type: 'success',
                typeAnimated: true,
                buttons: {
                    fermer: {
                        text: 'FERMER'
                    },
                    pasEntete: {
                        text: 'NON',
                        action: function() {
                                    MesrequetesAjax("{{ route('listeImpression.imprimer') }}", "GET", {param:6,mode:0 }, null, true, null, function(resp) {
                                        var pdfData = "data:application/pdf;base64," + resp.pdf;
                                        var newTab = window.open('', '_blank');
                                        newTab.document.write('<iframe src="' + pdfData + '" style="width:100%; height:100%;" frameborder="0"></iframe>');
                                    })
                                }
                            },

                    tryAgain: {
                        text: 'OUI',
                        btnClass: 'btn-red',
                        action: function() { 

                                    MesrequetesAjax("{{ route('listeImpression.imprimer') }}", "GET", {param:6,mode:1 }, null, true, null, function(resp) {
                                        var pdfData = "data:application/pdf;base64," + resp.pdf;
                                        var newTab = window.open('', '_blank');
                                        newTab.document.write('<iframe src="' + pdfData + '" style="width:100%; height:100%;" frameborder="0"></iframe>');
                                    })
                        }
                    },
                },

            });
    })
 

    });

    function TablerecuperationReglementFacture(response) {
        var table = $("#ReglementFactureTable").DataTable();
        table.clear().draw()
                var montantTotal = 0;
                var totalUtilise = 0;
                var totalRestant = 0;
        $.each(response, function(key, value) {
            
            montantTotal +=parseInt(value.montantReglement);
            totalUtilise +=parseInt(value.TotalUtilise);
            var montantSolde = parseInt(value.montantReglement) - parseInt(value.TotalUtilise)
           
            var photoprofil = '';
            var jourMoisSelect = '';
            var prenom = '';

            if (value.photoProfil != null) {
                photoprofil = '<img class="imgInTableRow" src="media/PhotoProfil/' + value.photoProfil + '">';
            }
                
            if(value.TypeLocataire==1 && value.photoProfil ==null ){
               photoprofil = '<img class="imgInTableRow" src="media/imgDefault/userDefault.png">';
            }

            if(value.TypeLocataire!=1 && value.photoProfil ==null ){
                photoprofil = '<img class="imgInTableRow" src="media/imgDefault/buldingDefault.png">';
            }

            if(value.prenom !=null){
                prenom = value.prenom;
            }
             <br />
<b>Warning</b>:  Undefined variable $D_Modification_reglementFactureLocation in <b>E:\install\laragon\www\reditas\resources\views\OPERATIONS\reglementFacture.blade.php</b> on line <b>947</b><br />
                actionBtn= '';
            
           <br />
<b>Warning</b>:  Undefined variable $D_Suppression_reglementFactureLocation in <b>E:\install\laragon\www\reditas\resources\views\OPERATIONS\reglementFacture.blade.php</b> on line <b>953</b><br />
            actionBtnSupprimer= '';
          
        if(value.statutReglement > 0){
            if(value.statutReglement == 1){
                 var status = '<select id="StatusChequeSelect" class="form-select"><option selected  data-id="'+value.IDReglementLocataire+'" value="1">À encaisser</option><option data-id="'+value.IDReglementLocataire+'" value="2">Encaissé</option> <option  data-id="'+value.IDReglementLocataire+'" value="3">Réjetté</option></select>';
            }else if(value.statutReglement == 2){

              status = '<select id="StatusChequeSelect" class="form-select"><option data-id="'+value.IDReglementLocataire+'" value="1">À encaisser</option><option selected data-id="'+value.IDReglementLocataire+'" value="2">Encaissé</option> <option  data-id="'+value.IDReglementLocataire+'" value="3">Réjetté</option></select>';
           
            }else if(value.statutReglement == 3){

              status = '<select id="StatusChequeSelect" class="form-select"><option data-id="'+value.IDReglementLocataire+'" value="1">À encaisser</option><option selected data-id="'+value.IDReglementLocataire+'" value="2">Encaissé</option> <option selected data-id="'+value.IDReglementLocataire+'" value="3">Réjetté</option></select>';
            }
           
        }
        else{
             status = 'R.A.S';
        }

         var actionBtnDetail= '<i class="fa fa-eye text-success cursor-pointer" title="liste" id="VoirRegelementLigne" data-id="' +value.IDReglementLocataire + '" data-locataire="'+value.nom+' '+prenom+'" data-typelocataire="'+value.TypeLocataire+'" data-reference="'+value.RefReglementInterne+'" ></i>';
          var btnAjouterReglement  = '<i class="fa fa-plus-circle text-warning cursor-pointer" id="EffectuerRegelement" data-idlocataire="'+value.IDLocataire+'" data-reglementid="'+value.IDReglementLocataire+'" data-montant="'+formaterNombre(value.montantReglement)+' F"  data-reference="'+value.RefReglementInterne+'" data-solde="'+formaterNombre(montantSolde)+' F"></i>'
        if(value.statutReglement > 0 && value.statutReglement !=2){
            var btnAjouterReglement = '<i class="fa fa-plus-circle text-danger cursor-pointer" title="Veuillez Encaisser le chèque pour faire un règlement"></i>'
        } 
           var heure = value.dateCreationReglementLocataire.substr(11,19)
            table.row.add([
                actionBtnDetail+'&nbsp;'+btnAjouterReglement+'&nbsp;'+actionBtnSupprimer+''+actionBtn+'',
                formatageDate(new Date(value.dateReglement)),value.RefReglementInterne,value.RefReglementExterne,photoprofil +
                ' <span class="cursor-pointer" id="CheckUser" data-id="' + value.IDLocataire + '">' +
                value.nom + ' ' +prenom + '</span>', '<span class="badge bg-warning">'+value.intituleModeReglement + '</span>',value.numeroCheque,value.nomBanque,status, '<span style="font-weight:bolder">' +
                formaterNombre(value.montantReglement) + ' F</span>', '<span style="font-weight:bolder">' +
                formaterNombre(value.TotalUtilise) + ' F</span>', '<span style="font-weight:bolder">' +
                formaterNombre(montantSolde) + ' F</span>',
                '<span style="color:black;font-weight:bold">Par '+ value.nom_utilisateur +' '+ value.prenom_utilisateur +'</span> <br> le '+
                formatageDate(new Date(value.dateCreationReglementLocataire))+' '+heure
               

            ]);
        })

        table.draw()

            $('#MontantTotal').text(formaterNombre(montantTotal)+' F');
        
            $('#TotalRegle').text(formaterNombre(totalUtilise)+' F');

            var Solde = parseInt(montantTotal) - parseInt(totalUtilise);

            $('#TotalRestant').text(formaterNombre(Solde)+' F');
            $('.masquerTotaux').css({'display':'block','margin-top':'-10px'});
           $('.voirTotaux').css({'display':'none'});
    }

    function recuperationReglement($dateDebut,$dateFin) {
        MesrequetesAjax("{{ route('Reglementfacture.recuperation') }}", "GET",{dateDebut:$dateDebut,dateFin:$dateFin}, null, true,
            "JSON",
            function(response) {
                $('div#loaders').addClass('hiddenElement');
                TablerecuperationReglementFacture(response.data)
            }, null,
            function() {
                $('div#loaders').removeClass('hiddenElement');
            });

    }

    function GetLocataire() {
        MesrequetesAjax("{{ route('Locataire.recuperation') }}", "GET", null, true, true, "JSON", function(response) {
           
            $.each(response.ligne, function(key, value) {
                 var prenom = "";
                if(value.prenom !=null){
                    prenom = value.prenom;
                }
                $('#LocataireSelect').append($('<option>', {
                    value: value.IDLocataire,
                    text: value.nom + ' ' + prenom
                }))
            })
        });
    }

    function GetModeReglement() {
        MesrequetesAjax("{{ route('ModeReglement.recuperation') }}", "GET", null, true, true, "JSON", function(response) {
            $.each(response.data, function(key, value) {
                $('.ModeReglementSelect').append($('<option>', {
                    value: value.IDModeReglement,
                    text: value.intituleModeReglement
                }))
            })
        });
    }
    
    function referenceReglement() {
        MesrequetesAjax("{{ route('getReferenceReglement.creer') }}", "GET", null, true, true, "JSON", function(resp) {
            
            $('#ReferenceReglement').val(resp[0]);
            $('#ReferenceReglementNumerique').val(resp[1]);
            
        });
    }

    function ListFacture($IDLocataire){
         MesrequetesAjax("{{ route('Facture.recuperation') }}", "GET",{IDLocataire:$IDLocataire}, null, true, "JSON", function(response) {
             $('#ListFactureSelect').html('')
              $('#ListFactureSelect').append('<option selected disable>Choisir...</option>')
            $.each(response.ligne, function(key, value) {
                $('#ListFactureSelect').append($('<option>', {
                    value: value.IDFacture,
                    text: value.refFacture
                }))
            })
        });
    }

    function factureByID($IDFacture){
                MesrequetesAjax("{{ route('Facture.recuperationById') }}", "GET",{IDFacture:$IDFacture}, false, true, "JSON", function(resp) {
                    $('#RefFactSelectionner').text(resp.ligne[0].refFacture)
                    $('#MontantFactSelectionner').text( formaterNombre(resp.ligne[0].montantFacture)+' F')
                    $('#MontantRegleFac').text(formaterNombre(resp.ligne[0].TotalRegleFacture)+' F')
                    var montantRestant = resp.ligne[0].montantFacture - resp.ligne[0].TotalRegleFacture;
                    $('#MontantRestantFactSelectionner').text(formaterNombre(montantRestant)+' F')
               });
    }

    function factureByIDModifReglementLigne($IDFacture,$motant){
                MesrequetesAjax("{{ route('Facture.recuperationById') }}", "GET",{IDFacture:$IDFacture}, false, true, "JSON", function(resp) {
                    $('#RefFactSelectionner').text(resp.ligne[0].refFacture)
                    $('#MontantFactSelectionner').text( formaterNombre(resp.ligne[0].montantFacture)+' F')
                    var montantRestant = resp.ligne[0].montantFacture - resp.ligne[0].TotalRegleFacture;
                    $('#MontantRestantFactSelectionner').text(formaterNombre(parseInt(montantRestant) + parseInt($motant) )+' F')
               });
    }

    function recuperationReglementLigne($IdReglementLigne){
            MesrequetesAjax("{{ route('ReglementLigne.recuperation') }}", "GET",{IDreglementLocataire:$IdReglementLigne}, null, true, "JSON", function(resp) {
                var table = $("#TableFactureReglementLigne").DataTable();
                 table.clear().draw()
                 $.each(resp.ligne,function(key, value) {
                     table.row.add([
                        '<i id="DeleteReglementLigne"  data-idreglementligne="'+value.IDReglementLigne+'" data-id="'+value.IDReglementLocataire+'" class="fa fa-trash text-danger cursor-pointer"></i> &nbsp; <i id="ModifierReglementLigne"  data-idreglementligne="'+value.IDReglementLigne+'" class="fa fa-edit text-success cursor-pointer"></i>',
                        value.refFacture,value.refLocation,value.intituleBien,formatageDate(new Date(value.DateReglementLigne)),formaterNombre(value.MontantReglementLigne)+' F',value.MontantReglementLigne,value.created_at
                     ])
                 })

                table.draw()
            })
    }

    function recuperationReglementLigneEtat($IdReglementLigne){
            MesrequetesAjax("{{ route('ReglementLigne.recuperation') }}", "GET",{IDreglementLocataire:$IdReglementLigne}, null, true, "JSON", function(resp) {
                var table = $("#TableVoirReglementLigne").DataTable();
                 table.clear().draw()
                 var totalFactReglement = 0;
                 $.each(resp.ligne,function(key, value) {
                    totalFactReglement +=parseInt(value.MontantReglementLigne)
                     table.row.add([
                        value.refFacture,value.refLocation,value.intituleBien,formatageDate(new Date(value.DateReglementLigne)),formaterNombre(value.MontantReglementLigne)+' F',value.MontantReglementLigne,value.created_at
                     ])
                 })

                table.draw()

                $('#totalFactReglement').text(formaterNombre(totalFactReglement)+' F')
            })
    }
    function recuperationTypedePiece(){
        MesrequetesAjax("{{ route('typePiece.recuperation') }}", "GET", null, true, true, "JSON", function(resp) {
            $.each(resp.data, function(key, values) {
                $('.TypeDocumentSelect').append($('<option>', {
                    value: values.IDTypepiece,
                    text: values.libelleType_piece
                }))
            })
        });  
    }
</script>

<script>
    var modal = document.querySelector(".modal");
    var triggers = document.querySelectorAll(".trigger");
    var closeButton = document.querySelector(".close-button");

    function toggleModal() {
        modal.classList.toggle("show-modal");
    }

    function windowOnClick(event) {
        if (event.target === modal) {
            toggleModal();
        }
    }

    for (var i = 0, len = triggers.length; i < len; i++) {
        triggers[i].addEventListener("click", toggleModal);
    }
    closeButton.addEventListener("click", toggleModal);
    window.addEventListener("click", windowOnClick);
</script>

</body>

</html>