@extends('administrativo.index')

@section('cuerpo')

@section('portada', 'Reporte #3:')

<div class="container-fluid">
    <form action="{{ route('reporte3') }}" method="GET" class="needs-validation" novalidate>
        @csrf
        <div class="form-row">
            <div class="col">
                <div class="form-group">
                    <label for="fecha_entrada">Fecha de Entrada:</label>
                    <input type="date" class="form-control" id="fecha_entrada" name="fecha_entrada" required>
                    <div class="invalid-feedback">
                        Por favor, selecciona una fecha de entrada.
                    </div>
                </div>
            </div>
            <div class="col">
                <div class="form-group">
                    <label for="fecha_salida">Fecha de Salida:</label>
                    <input type="date" class="form-control" id="fecha_salida" name="fecha_salida" required>
                    <div class="invalid-feedback">
                        Por favor, selecciona una fecha de salida.
                    </div>
                </div>
            </div>
        </div>
</div>

{{-- ------------------------------------------------------------------------------------ --}}
<div class="row">


    <div class="col-sm-12">

        <div class="card border-secondary">

            <div class="card-body">

                <table class="datatable table table-hover">


                    <thead class="bg-dark text-white">

                        <tr>
                            <th>Nombre</th>
                            <th>Cantidad Reservaciones</th>
                            <th>Rango Fecha</th>
                        </tr>
                    </thead>

                    <tbody>

                        @foreach ($habitaciones as $item)
                            <tr>

                                <td>{{ $item->nombre_habitacion }}</td>
                                <td>{{ $item->num_reservas }}</td>
                                <td>{{ $rangoFecha }}</td>

                            </tr>
                        @endforeach

                    </tbody>

                </table>

            </div>

        </div>

    </div>

</div>

<button type="submit" class="btn btn-primary" style="margin-top: 20px;">Generar Reporte</button>
</form>
@endsection