@php
    use App\fonctions\definir_date_selection_fonction;use App\Models\parametre;
    $parametre=parametre::first();
    $dates=(new definir_date_selection_fonction())->definir_date_selection($parametre->parametre_date_grille_detail);

@endphp


<div class="form-row">
    <div class="form-group col-md-6">
        <label for="date_debut_facture">Début</label>
        <input type="date" class="form-control" id="date_debut_facture_fiche_annexe" value="{{$dates['debut']}}">
    </div>
    <div class="form-group col-md-6">
        <label for="date_fin_facture">Fin</label>
        <input type="date" class="form-control" id="date_fin_facture_fiche_annexe" value="{{$dates['fin']}}">
    </div>

</div>
<div class="table-responsive" style="overflow-y: auto;height: 45vh;"><!--table facture-->
    <table class="table table-hover table-sm table-bordered " style="width:100%;" id="table_facture_fiche_annexe">
        <thead style="background-color:#28a745; color:white">
        <th scope="col" class="text-center">FACTURE N°</th>
        <th scope="col" class="text-center">DATE</th>
        <th scope="col" class="text-center">DATE ECH</th>
        <th scope="col" class="text-center">MODE REG</th>
        <th scope="col" class="text-center">CODE CLI</th>
        <th scope="col" class="text-center">NOM CLI</th>
        <th scope="col" class="text-center">TOTAL HT</th>
        <th scope="col" class="text-center">TOTAL TVA</th>
        <th scope="col" class="text-center">TOTAL TTC</th>
        <th scope="col" class="text-center">RESTE</th>
        <th scope="col" class="text-center">SOCIETE</th>
        <th scope="col" class="text-center">IMP</th>
        <th scope="col" class="text-center">CPT</th>
        <th scope="col" class="text-center">RELANCE</th>
        <th scope="col" class="text-center">ADRESSE 1</th>
        <th scope="col" class="text-center">ADRESSE 2</th>
        <th scope="col" class="text-center">CODE POSTAL</th>
        <th scope="col" class="text-center">VILLE</th>
        <th scope="col" class="text-center">PAYS</th>
        <th scope="col" class="text-center">EMAIL</th>


        </thead>
    </table>

</div><!-- fin table facture-->
<script>
    $(function () { // Dom ready
        //////data table formule

        var table_facture_fiche_annexe = $('#table_facture_fiche_annexe').DataTable({


            autoWidth: true,
            paging: true,
            searching: true,
            scrollCollapse: true,

            "ajax": {
                "url": "{{route('facture.data_table_facture_fiche_annexe')}}",
                "type": "GET",

                "data": {
                    'type_fiche_annexe': '{{$type_fiche_annexe}}',
                    'id_fiche_annexe': '{{$id_fiche_annexe}}',
                    'date_debut': function () {
                        return $("#date_debut_facture_fiche_annexe").val()
                    },
                    'date_fin': function () {
                        return $("#date_fin_facture_fiche_annexe").val()
                    },

                },

            },
            "createdRow": function(row, data, dataIndex) {
                if (data['DT_FactureValidee'] == "1") {
                    $(row).css('color', 'green');
                }
                // console.log(row);
            },

            columnDefs: [
                {
                    "targets": 9,
                    "createdCell": function(td, cellData, rowData, row, col) {


                        if (rowData['DT_ReglementColor'] != "") {
                            $(td).css('background-color', rowData['DT_ReglementColor']);

                        }

                    }

                },

                {"className": "text-center align-middle ", "targets": "_all"},
                // { "width": "500px", "targets": [0] }

            ]
        });

        $("#date_debut_facture_fiche_annexe").change(function() {
            table_facture_fiche_annexe.ajax.reload(null, false);
        });
        $("#date_fin_facture_fiche_annexe").change(function() {
            table_facture_fiche_annexe.ajax.reload(null, false);
        });


    });//Fin dom ready
</script>