{% extends 'base.html' %}

{% block title %}Comandas - Sistema de Comandas{% endblock %}

{% block content %}
<div class="clearfix">
    <h2 style="float: left;">Comandas</h2>
    <a href="{% url 'comandas:create' %}" class="btn float-right">Nova Comanda</a>
</div>

<table class="table">
    <thead>
        <tr>
            <th>ID</th>
            <th>Mesa</th>
            <th>Garçom</th>
            <th>Status</th>
            <th>Total</th>
            <th>Abertura</th>
            <th>Ações</th>
        </tr>
    </thead>
    <tbody>
        {% for comanda in comandas %}
        <tr>
            <td><strong>#{{ comanda.id }}</strong></td>
            <td>Mesa {{ comanda.mesa.numero }}</td>
            <td>{{ comanda.garcom.get_full_name|default:comanda.garcom.username }}</td>
            <td>
                <span style="color: {% if comanda.status == 'aberta' %}#ffc107{% elif comanda.status == 'fechada' %}#28a745{% else %}#dc3545{% endif %};">
                    {{ comanda.get_status_display }}
                </span>
            </td>
            <td>R$ {{ comanda.total|floatformat:2 }}</td>
            <td>{{ comanda.abertura|date:"d/m H:i" }}</td>
            <td>
                <a href="{% url 'comandas:detail' comanda.pk %}" class="btn">Ver</a>
                {% if comanda.status == 'aberta' %}
                <a href="{% url 'comandas:fechar' comanda.pk %}" class="btn btn-success" 
                   onclick="return confirm('Fechar comanda?')">Fechar</a>
                {% endif %}
            </td>
        </tr>
        {% empty %}
        <tr>
            <td colspan="7" class="text-center">Nenhuma comanda encontrada.</td>
        </tr>
        {% endfor %}
    </tbody>
</table>

{% if is_paginated %}
<div class="text-center">
    {% if page_obj.has_previous %}
        <a href="?page={{ page_obj.previous_page_number }}" class="btn">Anterior</a>
    {% endif %}
    
    Página {{ page_obj.number }} de {{ page_obj.paginator.num_pages }}
    
    {% if page_obj.has_next %}
        <a href="?page={{ page_obj.next_page_number }}" class="btn">Próxima</a>
    {% endif %}
</div>
{% endif %}
{% endblock %}