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

<div class="row justify-content-center align-items-center">
  <div class="col-12 col-md-11">
    <h3>Listado de Expedientes</h3>
  </div>
</div>

<div class="row justify-content-center align-items-center">
  <div class="col-md-2">
    <a href="{{ route('expedientes.create') }}" 
       class="btn btn-success btn-block btn-lg" 
       title="Nuevo Expediente">
      Nuevo
    </a>
  </div>
</div>

<br> 

<div class="row justify-content-center align-items-center">
  <div class="col-12 col-md-11">

    @include('compartido.mensajes') 
    @include('compartido.errores')  

    <div class="table-responsive">
      <table class="table table-striped table-bordered table-hover" id="example">
        <thead>
          <tr>
            <th>Id</th>
            <th>ID Detenido</th>
            <th>Motivo</th>
            <th>Fecha Ingreso</th>
            <th>Estado</th>
            <th>Acciones</th>
          </tr>
        </thead>
        <tbody>
          @foreach($expedientes as $expediente)
            <tr>
              <td>{{ $expediente->id_expediente }}</td>
              <td>{{ $expediente->id_detenido }}</td>
              <td>{{ $expediente->motivo_detencion }}</td>
              <td>{{ $expediente->fecha_ingreso }}</td>
              <td>{{ $expediente->estado }}</td>
              <td align="center">
                <form method="POST" action="{{ route('expedientes.destroy', $expediente->id_expediente) }}" style="display:inline;">
                  @csrf
                  @method('DELETE')

                  <a class="btn btn-info" 
                     href="{{ route('expedientes.show', $expediente->id_expediente) }}" 
                     title="Ver más">
                    <i class="fa fa-eye"></i>
                  </a>

                  <a class="btn btn-warning" 
                     href="{{ route('expedientes.edit', $expediente->id_expediente) }}" 
                     title="Editar">
                    <i class="fas fa-edit"></i>
                  </a>

                  <button class="btn btn-danger" 
                          onclick="return confirm('¿Está seguro de eliminar este expediente?');" 
                          title="Eliminar">
                    <i class="fas fa-trash"></i>
                  </button>
                </form>
              </td>
            </tr>
          @endforeach
        </tbody>
      </table>
    </div>

  </div>
</div>

@endsection

@push('styles')

@endpush

@push('scripts')
<script>
  $('#example').DataTable({
    dom: 'Bfrtip',
    buttons: ['excel'],
    pageLength: 5,
  });
</script>
@endpush