{% extends "pos/base.html" %}
{% block title %}Staff Pre-Bookings{% endblock %}
{% block heading %}Staff Pre-Bookings{% endblock %}
{% block content %}
<div class="d-flex justify-content-between mb-2">
  <a href="{% url 'hotel:staff_prebook_add' %}" class="btn btn-primary"><i class="fas fa-plus mr-1"></i>New Pre-Booking</a>

  <a href="{% url 'hotel:staff_prebook_upcoming' %}"
     class="btn btn-outline-info ml-2">
    Upcoming (All Sources)
  </a>

  
</div>
<div class="table-responsive">
  <table class="table table-striped table-sm">
    <thead>
      <tr>
        <th>#</th><th>Guest</th><th>Dates</th><th>Nights</th><th>Total</th><th>Adv Req</th><th>Paid</th><th>Status</th><th></th>
      </tr>
    </thead>
    <tbody>
      {% for b in rows %}
      <tr>
        <td>{{ b.t_id }}</td>
        <td>{{ b.guest.name }}</td>
        <td>{{ b.checkin_date }} → {{ b.checkout_date }}</td>
        <td>{{ b.nights }}</td>
        <td>{{ b.total_amount|floatformat:2 }}</td>
        <td>{{ b.advance_required|floatformat:2 }}</td>
        <td>{{ b.advance_received|floatformat:2 }}</td>
        <td><span class="badge badge-{% if b.status == 'CONFIRMED' %}success{% elif b.status == 'CANCELLED' %}danger{% else %}warning{% endif %}">{{ b.status }}</span></td>
        <td class="text-right">
          <a class="btn btn-sm btn-outline-primary" href="{% url 'hotel:staff_prebook_detail' b.id %}">Open</a>
        </td>
      </tr>
      {% empty %}
      <tr><td colspan="9">No pre-bookings yet.</td></tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}