@extends('base')

@section('content')


    <div class="alert alert-success text-center">ETAT DES STOCKS</div>
    

    <div class="col-md-2 text-right" style="margin-top:1.5%">
        <button class="btn btn-success" id="rafraichir">Rafraichir</button>
    </div>

    <div class="col-md-12 text-center">Nombre de(s) etat_stock : <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" id="table_etat_stock" style="width:100%">
            <thead style="background-color:#28a745; color:white">
            <tr>
                <th scope="col" class="text-center">CENTRALE</th>
                <th scope="col" class="text-center">PRODUIT</th>
                <th scope="col" class="text-center">TYPE PRODUIT</th>
                <th scope="col" class="text-center">STOCK COURANT</th>
                <th scope="col" class="text-center">UNITE</th>
            </tr>
            </thead>

        </table>
    </div>



    <script>

        $(function() { // Dom ready

            $('title').text("etat_stock - SMART CENTRAL");


            var table = $('#table_etat_stock').on('processing.dt', function (e, settings, processing) {

                $('.ring').css('display', processing ? 'block' : 'none');
                $('#filtre_loading').css('display', processing ? 'block' : 'none');
            }).DataTable({
                scrollX: true,
                orderCellsTop: true,
                // fixedHeader: true,
                scrollCollapse: true,
                autoWidth: true,
                // paging: true,
                // serverSide: true,
                iDisplayLength: '50',
                dom: 'lBfrtip',
                buttons: [
                    { "extend": 'excel', "text": 'Export excel', "className": 'btn_export_excel', title: 'Liste de(s) etat_stock',"attr": {"style" :"color: rgb(255, 255, 255); background-color: rgb(33, 136, 56);"}}
                ],



                'ajax': {
                    'url': '{{url('etat_stock/table')}}',
                    'type': 'GET',
                    // 'data': {},


                    'dataSrc': function (json) {

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

                        return json.data;
                    },
                },



                columnDefs: [

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

            });
            $("#rafraichir").click(function (e){
                e.preventDefault();
                table.ajax.reload(null, false);

            });

        });
    </script>
@endsection