@extends('base')

@section('content')


<div class="alert alert-success text-center">LISTE DES CHANTIERS (DATE DEPASSEE)</div>

<button class="btn btn-success cloturer_chantier "  @disabled(in_array($profil->profil_chantier,[0,1,3]))>Cloturer</button>

<button class="btn btn-success" id="rafraichir">Rafraichir</button>


<div class="col-md-12 text-center" style="margin-top:10px;">Nombre de chantier(s) : <span class="badge" style="background : #dff0d8; color: #000; font-size: 15px; margin-bottom:0.5%;">0</span></div>
<div class="table-responsive">
    <table class="table table-striped table-hover table-bordered table-sm" id="table_chantier" style="width:100% !important; ">
        <thead style="background-color:#28a745; color:white">
            <tr style="height:70px">
                <th data-orderable="false" data-searchable="false" style="width:40px"><input type="checkbox" name="select_all" value="1" id="select_all" class="form-control"></th>
                <th scope="col" class="text-center ">CODE CLIENT</th>
                <th scope="col" class="text-center ">NOM CLIENT</th>
                <th scope="col" class="text-center ">CODE COMPLET</th>
                <th scope="col" class="text-center ">CODE</th>
                <th scope="col" class="text-center ">SS CHANTIER</th>
                <th scope="col" class="text-center ">MOT DIR</th>
                <th scope="col" class="text-center ">NOM</th>
                <th scope="col" class="text-center">ADRESSE1</th>
                <th scope="col" class="text-center">ADRESSE2</th>
                <th scope="col" class="text-center">CODE POSTAL</th>
                <th scope="col" class="text-center">VILLE</th>
                <th scope="col" class="text-center">POSITION CPT</th>
                <th scope="col" class="text-center">ECHEANCE</th>
                <th scope="col" class="text-center">MODE REG</th>

            </tr>
        </thead>
            <tbody>


            </tbody>

    </table>
</div>

<script>
$(function() { // Dom ready
    $('title').text("CLOTURE CHANTIER - SMART CENTRAL");
    
    var table_liste_chantier_a_ajouter = $('#table_chantier').DataTable({


            autoWidth:true,
            scrollX: true,
            orderCellsTop: true,
            paging: true,
            searching: true,
            scrollCollapse: true,
            iDisplayLength: '50',
            dom: 'lBfrtip',
           

            initComplete: function() {
            // Apply the search
            this.api().columns().every(function() {
                var that = this;

                $('input', this.header()).on('keyup clear', function() {
                    if (that.search() !== this.value) {
                        that
                            .search(this.value)
                            .draw();
                    }
                });
            });

            
        },

            buttons: [
                    { "extend": 'excel', "text": 'Export excel', "className": 'btn_export_excel', title: 'Liste des chantiers',"attr": {"style" :"color: rgb(255, 255, 255); background-color: rgb(33, 136, 56);"}}
                ],
            "ajax": {
                "url": "{{url('chantier/table')}}",
                "type": "GET",

                "data": {
                    'fiche': 'cloture_chantier',


                },

                    'dataSrc': function (json) {

                        $('.badge').html(json.recordsTotal);

                        return json.data;
                    },

            },

            columnDefs: [
                { "className": "text-center align-middle th_cursor_pointer font-weight-bold", "targets": [1] },

                {
                "targets": 0,
                'searchable': false,
                orderable: false,
                "data": function(json) {
                    // console.log(json);
                    var data_select = json['DT_RowId'];



                    var select = '<input type="checkbox" class=" form-control chantier_a_selecter" value="' + data_select + '"  > ';


                    return select;
                },
                "defaultContent": null



            },


                { "className": "text-center align-middle ", "targets": "_all" },

            ],

            'order': [
            [1, 'asc']
        ]

        });
table_liste_chantier_a_ajouter.on('draw', function(){
    $('#table_chantier tbody tr').css('height', '70px');
});


   $('#select_all').on('click', function() {
                // Get all rows with search applied
                var rows = table_liste_chantier_a_ajouter.rows({ 'search': 'applied' }).nodes();
                // Check/uncheck checkboxes for all rows in the table
                $('input[type="checkbox"]', rows).prop('checked', this.checked);
        });

$(".cloturer_chantier").click(function(e) {
        e.preventDefault();
        // $('.ring').show();
        // $('#filtre_loading').show();
        
        var chantier_selected = [];

        var url='{{url('chantier/enregistrer_cloture_chantiers')}}';

        $(".chantier_a_selecter:checked").each(function(index) {

            var id_chantier = $(this).val();
            chantier_selected.push(id_chantier);
        });

        if (chantier_selected.length != 0) {




            function reponse(retourPHP) {


                // $('.ring').hide();
                // $('#filtre_loading').hide();

                $("#message").html(retourPHP.message);
                $("#message").show();

                setTimeout('$("#message").hide()', 3000);
                setTimeout(function() { table_liste_chantier_a_ajouter.ajax.reload(null, false); }, 1000);
                $('#select_all').prop('checked', false);

            }



            $.post(url, { "chantiers": chantier_selected,_token: '{{ csrf_token() }}' }, reponse, "json");

        } else {
            alert('Choisir au minimum un chantier');
            $('.ring').hide();
            $('#filtre_loading').hide();
        }

    });
    });

</script>
@endsection