@extends('layouts.admin')
@section('content')

    <div class="row">
        <div class="col-md-12">
            <div class="card card-outline card-primary">
                <div class="card-header">
                    <h3 class="card-title"> Listado de Secretarias</h3>
                    <div class="card-tools">
                        <a href="{{url('/admin/secretarias/pdf')}}" class="btn btn-success"> <i class="bi bi-printer"></i>
                            Reporte Secretarias
                        </a>
                        <a href="{{url('admin/secretarias/create')}}" class="btn btn-primary" >
                            Registrar Secretaria
                        </a>

                    </div>

                </div>
                <div class="card-body">

                    <table id="example1" class="table table-bordered table-hover table-sm">
                        <thead style="background-color: #4e4e50">
                        <tr>
                            <th style="text-align:center" scope="col"><b>Nro</b></th>
                            <th style="text-align:center" scope="col"><b>Nombres</b></th>
                            <th style="text-align:center" scope="col"><b>Apellidos</b></th>
                            <th style="text-align:center" scope="col"><b>Cedula</b></th>
                            <th style="text-align:center" scope="col"><b>Telefono</b></th>
                            <th style="text-align:center" scope="col"><b>Fecha Naciminento</b></th>
                            <th style="text-align:center" scope="col"><b>Direccion</b></th>
                            <th style="text-align:center" scope="col"><b>Email</b></th>
                            <th style="text-align:center" scope="col"><b>Acciones</b></th>

                        </tr>
                        </thead>
                        <tbody>
                                                @foreach($secretarias as $secretaria)
                            <tr>
                                <td style="text-align:center">{{$contador++}}</td>
                                <td>{{$secretaria->nombres}}</td>
                                <td>{{$secretaria->apellidos}}</td>
                                <td>{{$secretaria->cedula}}</td>
                                <td>{{$secretaria->telefono}}</td>
                                <td>{{$secretaria->fecha_nacimiento}}</td>
                                <td>{{$secretaria->direccion}}</td>
                                <td>{{$secretaria->user->email}}</td>

                                <td style="text-align: center">
                                    <div class="btn-group" role="group" aria-label="Basic example">
                                        <a href="{{url('admin/secretarias/'.$secretaria->id)}}" type="button" class="btn btn-info btn-sm"><i class="bi bi-eye"></i></a>
                                        <a href="{{url('/admin/secretarias/'.$secretaria->id.'/edit')}}" type="button" class="btn btn-success btn-sm"><i class="bi bi-pencil"></i></a>
                                        <a href="{{url('/admin/secretarias/'.$secretaria->id.'/confirm-delete')}}" type="button" class="btn btn-danger btn-sm"><i class="bi bi-trash"></i></a>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>

                    <script>
                        $(function () {
                            $("#example1").DataTable({
                                "pageLength": 10,
                                "language": {
                                    "emptyTable": "No hay información",
                                    "info": "Mostrando _START_ a _END_ de _TOTAL_ Secretarias",
                                    "infoEmpty": "Mostrando 0 a 0 de 0 Usuarios",
                                    "infoFiltered": "(Filtrado de MAX total Secretarias)",
                                    "infoPostFix": "",
                                    "thousands": ",",
                                    "lengthMenu": "Mostrar MENU Secretarias",
                                    "loadingRecords": "Cargando...",
                                    "processing": "Procesando...",
                                    "search": "Buscador:",
                                    "zeroRecords": "Sin resultados encontrados",
                                    "paginate": {
                                        "first": "Primero",
                                        "last": "Ultimo",
                                        "next": "Siguiente",
                                        "previous": "Anterior"
                                    }
                                },
                                "responsive": true, "lengthChange": true, "autoWidth": false,
                                buttons: [{
                                    extend: 'collection',
                                    text: 'Reportes',
                                    orientation: 'landscape',
                                    buttons: [{
                                        text: 'Copiar',
                                        extend: 'copy',
                                    }, {
                                        extend: 'pdf'
                                    },{
                                        extend: 'csv'
                                    },{
                                        extend: 'excel'
                                    },{
                                        text: 'Imprimir',
                                        extend: 'print'
                                    }
                                    ]
                                },
                                    {
                                        extend: 'colvis',
                                        text: 'Visor de columnas',
                                        collectionLayout: 'fixed three-column'
                                    }
                                ],
                            }).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
                        });
                    </script>

                </div>
            </div>
        </div>
    </div>
@endsection