index.blade.php

@extends('templates.template')

@section('conteudo')
    @push('css')
    <link href="{{asset('vendors/datatables.net-bs/css/dataTables.bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('vendors/datatables.net-responsive-bs/css/responsive.bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('vendors/datatables.net-scroller-bs/css/scroller.bootstrap.min.css')}}" rel="stylesheet">
    @endpush

    <section class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_title">
                <h3>Listagem de Clientes</h3>
                <!--<a class="pull-right collapse-link">
                    <i class="fa fa-chevron-up"></i>
                </a>-->
                <a class="pull-right btn btn-round btn-tema" href="{{route('cliente-inserir')}}">
                    <i class="fa fa-plus"></i> Inserir
                </a>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
            <div class="container-fluid">
                <div class="row">
                    <div class="margin-top">
                        <table id="example" class="table table-striped table-bordered dt-responsive nowrap" style="width: 100% ;">
                            <thead>
                            <tr>
                                <th>Nome</th>
                                <th>CPF/CNPJ</th>
                                <th>RG/IE</th>
                                <th>Email</th>
                                <th>Opções</th>
                            </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
            </div>
        </div>
    </section>

    @push('scripts')
    <script src="{{asset('vendors/datatables.net/js/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('vendors/datatables.net-bs/js/dataTables.bootstrap.min.js')}}"></script>
    <script src="{{asset('vendors/datatables.net-responsive/js/dataTables.responsive.min.js')}}"></script>
    <script src="{{asset('vendors/datatables.net-responsive-bs/js/responsive.bootstrap.min.js')}}"></script>
    <script src="{{asset('vendors/datatables.net-scroller/js/dataTables.scroller.min.js')}}"></script>
    <script>
        $(document).ready(function() {
            $('#example').DataTable( {
                processing: true,
                serverSide: true,
                ajax: "{{route('cliente-index')}}",
                columns: [
                    {data: 'nome'},
                    {data: 'cpf_cnpj'},
                    {data: 'rg_ie'},
                    {data: 'email'},
                    {data: 'opcoes', orderable: false, searchable: false}
                ],
                language: {
                    "sEmptyTable": "Nenhum registro encontrado",
                    "sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                    "sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
                    "sInfoFiltered": "(Filtrados de _MAX_ registros)",
                    "sInfoPostFix": "",
                    "sInfoThousands": ".",
                    "sLengthMenu": "_MENU_ resultados por página",
                    "sLoadingRecords": "Carregando...",
                    "sProcessing": "Processando...",
                    "sZeroRecords": "Nenhum registro encontrado",
                    "sSearch": "Pesquisar",
                    "oPaginate": {
                        "sNext": "Próximo",
                        "sPrevious": "Anterior",
                        "sFirst": "Primeiro",
                        "sLast": "Último"
                    },
                    "oAria": {
                        "sSortAscending": ": Ordenar colunas de forma ascendente",
                        "sSortDescending": ": Ordenar colunas de forma descendente"
                    }
                }
            } );
        } );
    </script>
    @endpush
@endsection