{% extends 'base.html' %}

{% block header %}
<section class="hero is-primary">
    <div class="hero-body">
      <p class="title"> ¡Bienvenido, {{ name }}!</p>
    </div>
    <div class="hero-body">      
        <p class="subtitle"> Estas son tus reservas de padel</p>
    </div>
  </section>
{% endblock header %}

{% block content %}
    <table class="table" id="tablareservas" border = 1>
        <thead>
            <th id="columnid">ID</th>
            <th id="columnnombre">Nombre</th>
            <th>Fecha</th>
            <th>Hora</th>
            <th></th>
        </thead>

        {% for reserva in reservas %}
            <tr>
                <td>{{reserva.id}}</td>
                <td>{{ reserva.nombre }}</td>
                <td>{{ reserva.fecha }}</td>
                <td>{{ reserva.hora }}</td>
                <td>
                <form class="form-eliminar" action="{{ url_for('reservas.eliminar_reserva', id=reserva.id) }}" method="post" style="display: inline;">
                    <button type="submit"  class="button is-danger  is-small">Eliminar</button>
                </form>
                </td>
            </tr>
        {% endfor %}
    </ul>
{% endblock content %}