@extends('layouts.dash')
@section('title') Secteurs @stop

@section('content')
    @if (Session::has('message'))
        <div class="alert alert-warning">{!! Session::get('message') !!}</div>
    @endif

    @if ($errors)
        @foreach ($errors->all() as $error)
            <div class='bg-danger alert'>{!! $error !!}</div>
        @endforeach
    @endif

    @if (Session::has('success'))
        <div class="alert alert-success">{!! \Session::get('success') !!}</div>
    @endif

    <div class="card">
        <div class="card-header">
            <h3>Secteurs</h3>
        </div>
        <div class="card-body">
            @if($user->can("SEC_AJO") || $user->HasRole("ADMINISTRATEUR"))
                 <div class="row">
                    <a href="{{ url('secteurs/create') }}" class="btn btn-success">Ajouter un Secteur</a>
                </div>
            @endif
            <table id="_table" class="table table-condensed table-striped table-bordered table-hover">
                <thead>
                    <tr>
                        <th width="1px">Id</th>
                        <th>Nom</th>
                        <th width="1px">Nb Employeurs</th>
                    </tr>
                </thead>
     
                <tbody>
                    @foreach ($secteurs as $secteur)
                    <tr>
                        <td>{!! $secteur->IdPAD !!}</td>
                        <td>
                            <a href="./secteurs/{!! $secteur->id !!}">
                            {!! $secteur->nom !!}
                            </a>
                        </td>
                        <td align="center">{!! $secteur->NbEmployeurs !!}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>

        </div>
    </div>
@endsection

@section('scripts')
<script>
  $(function () {
    $.fn.dataTable.moment('D/M/YYYY');
    $("#_table").DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": true,
      "ordering": true,
      "info": false,
      "responsive": false, 
      "autoWidth": false,
       oLanguage: {
            "sZeroRecords": "Aucune ligne",
            "sInfo": "Affichage de _START_ &agrave; _END_ sur _TOTAL_ lignes",
            "sInfoEmpty": "Showing 0 to 0 of 0 records",
            "sInfoFiltered": "(sur un total de _MAX_ lignes)",
            "oPaginate": {"sPrevious": "Pr&eacute;c&eacute;dente","sNext": "Suivante"
                ,"sFirst": "Premi&egrave;re","sLast": "Derni&egrave;re"},
                "sSearch":"Chercher",
            
            buttons: {
                colvis: 'Colonnes à afficher',
                copy: 'Copier',print: 'Imprimer',
                copyTitle: 'Ajouté au presse-papiers',
                copyKeys: 'Appuyez sur <i>ctrl</i> ou <i>\u2318</i> + <i>C</i> pour copier les données du tableau à votre presse-papiers. <br><br>Pour annuler, cliquez sur ce message ou appuyez sur Echap.',
                copySuccess: {
                    _: '%d lignes copiées',
                    1: '1 ligne copiée'
                    }
                }
        },
        dom: "<'row'<'col-sm-6'l><'col-sm-6'f>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-4'i><'col-sm-6'B><'col-sm-2'p>>",
        "buttons": ["copy", "excel"], //"print", "pdf", "csv", , "colvis"
        "aaSorting": [
            [1,'asc']
        ],
        "columnDefs": [
            { "targets": [ 0], "orderable": false,"searchable": false},
        ]
    })
    .buttons().container().appendTo('#_table_wrapper .col-md-6:eq(0)');



  });

</script>
@endsection