@extends('layouts.app')

@section('content')
<link href="{{ asset('css/tablareporte.css') }}" rel="stylesheet">
    <div class="container">
        <br/>
        <h1 class="text-center">REPORTE DE USUARIOS</h1>

        @if (Session::has('success'))
            <div class="alert alert-success">
                <p>{{ Session::get('success') }}</p>
            </div>
        @endif
        @if (session('error'))
            <div class="alert alert-danger mt-3">
                {{ session('error') }}
            </div>
        @endif
        <div class="table-responsive-sm">
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>Id</th>
                    <th>Nombre</th>
                    <th>Apellido</th>
                    <th>Correo</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($usuarios as $user)
                    <tr>
                        <td>{{ $user->id }}</td>
                        <td>{{ $user->firstname }}</td>
                        <td>{{ $user->lastname }}</td>
                        <td>{{ $user->email }}</td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="9" class="text-center">No hay usuarios disponibles</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
        <div class="d-flex">
            <div class="mx-auto">
                {{ $usuarios->links('pagination::bootstrap-4') }}
            </div>
        </div>
        </div>
    </div>
@endsection