@extends('layouts.app')

@section('content')

@include('users.partials.header', [
    'title' => __('Datos Clientes'),
    'description' => __(''),
    'class' => 'col-lg-12'
]) 

<style>
    #Table-promoaciones tbody tr{
        cursor: pointer;
    }
</style>

<div class="container-fluid mt--7">
    <div class="row">
        <div class="col-xl-12 order-xl-1">
            <div class="card shadow">

                <div class="card-body">
                    <div class="table-responsive" style="overflow-x: hidden !important;">
                        <!-- Projects table -->
                    <div class="row">
                        <div class="col-sm-12 col-lg-12 col-md-12 mb-3 float-right">

                            <button type="button" class="btn btn-success float-right" data-toggle="modal" data-target="#exampleModal"><i class="fas fa-plus"></i>&nbsp;Nuevo Cliente</button>
                        </div>
                        <div class="col-sm-4 col-lg-4 mb-3" >
                            <input class="form-control" placeholder="Buscar" onkeyup="saerch(this);" id="btnsearch" type="text">
                        </div>

                    </div>
                        <br>
         
                        <div class="table-responsive">
                        <table class="table align-items-center table-flush table-striped" id="Table-promoaciones" >
                            <thead class="thead-light">
                                <tr>
                                    <th scope="col"><b>CLIENTE</b></th>
                                    <th scope="col"><b>NOMBRE</b></th>
                                    <th scope="col"><b>ALIAS</b></th>
                                    <th scope="col"><b>CARGO</b></th>
                                    <th scope="col"><b>TELEFONO</b></th>
                                </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    {{-- <div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div> --}}
</div>
{{-- <input type="text" name="" id="global" value="nacional" hidden> --}}
<div class="modal fade" id="exampleModalEdit" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"></div>
@include('promocion::Cliente.modal')

    
@endsection

@section('js')
<script src="{{ asset('js/Articulo.js?v=1.0.3') }}"></script>

<script>
     $.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
  });
  
  table=$('#Table-promoaciones').DataTable({
         "paging":   true,
        "info": false,
        processing:true,
         serverSide:true,
         "pageLength": 15,
    ajax:
    {
      url:"{{ url('promocion/datatableClientes')}}",
      "data":function(d){
        d.clasificacion=$('#clasificacion').val();
      }
    },

    language: {
      searchPlaceholder: "Buscar",
        "decimal": "",
        "emptyTable": "No hay información",
        "info": "Mostrando _START_ a _END_ de _TOTAL_ Entradas",
        "infoEmpty": "Mostrando 0 to 0 of 0 Entradas",
        "infoFiltered": "(Filtrado de _MAX_ total entradas)",
        "infoPostFix": "",
        "thousands": ",",
        "lengthMenu": "",
        "loadingRecords": "Cargando...",
        "processing": "Procesando...",
        "search": "",
        "zeroRecords": "Sin resultados encontrados",
        "paginate": {
            "first": "Primero",
            "last": "Ultimo",
            "next": "Siguiente",
            "previous": "Anterior"
        }

      }, 

      "fnDrawCallback": function (oSettings) {
        // var conditional=
        $(".previous a").html('<i class="ni ni-bold-left"></i>');
        $(".next  a").html('<i class="ni ni-bold-right"></i>');

        },
    columns:[
        {data:'CLIENTE',name:'CLIENTE' },
        {data:'NOMBRE',name:'NOMBRE' },
        {data:'ALIAS', name:'ALIAS'},
        {data:'CARGO',name:'CARGO' },
        {data:'TELEFONO1',name:'TELEFONO1' },
    ],

});


</script>

@endsection