@extends('app')

@section('titulo', 'Citas del Usuario')
@section('subTitulo', $data->nombre)

@section('botones')
    <a class="btn btn-outline-light" href="{{ route('clientes.index') }}">
        < Regresar</a>
        @endsection

        @section('contenido')
            <div class="container container bg-secondary mt-4 p-3 rounded">

                @foreach ($data->citas as $item)
                    <div class="card mb-3">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-6">
                                    <h5 class="card-title text-primary text-decoration-underline">
                                        {{ \Carbon\Carbon::parse($item->hora)->format('h:i A') }} -
                                        {{ \Carbon\Carbon::parse($item->fecha)->format('Y-m-d') }}</h5>
                                    <p class="card-text">
                                        <strong>{{ $data->nombre }}</strong><br>
                                        {{ $data->telefono }}<br>
                                        {{ $data->correo }}
                                    </p>
                                </div>
                                @if (!$item->atendida)
                                <div class="col-6">
                                    
                                    <form action="{{ route('marcarAtendida', $item) }}" method="POST">
                                        @csrf
                                        <button type="submit" class="btn btn-success mb-2">Marcar como Atendida</button>
                                    </form>

                                    <form action="{{ Route('citas.destroy', $item) }}" method="POST">
                                        @csrf
                                        @method('delete')
                                        <button class="btn btn-danger">Cancelar Cita</button>
                                    </form>

                                </div>
                                @else

                                @endif
                               
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        @endsection