{% extends 'base.html' %}

{% block title %}Perfis do App do Garçom - CapeFood{% endblock %}

{% block content %}
<div class="container-fluid py-3">
    <div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
        <div>
            <h4 class="mb-1"><i class="bi bi-shield-lock text-warning"></i> Perfis do App do Garçom</h4>
            <p class="text-muted mb-0">Gerencie privilégios, restrições e vínculo dos garçons sem sair do módulo Food.</p>
        </div>
        <div class="d-flex gap-2">
            <a href="{{ url_for('food.configuracoes_mesas') }}" class="btn btn-outline-secondary">
                <i class="bi bi-arrow-left"></i> Voltar ao Food
            </a>
            <a href="{{ url_for('food.novo_perfil_garcom_food') }}" class="btn btn-warning text-dark">
                <i class="bi bi-plus-lg"></i> Novo Perfil
            </a>
        </div>
    </div>

    {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
            {% for category, message in messages %}
                <div class="alert alert-{{ category }} alert-dismissible fade show">
                    {{ message }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            {% endfor %}
        {% endif %}
    {% endwith %}

    <div class="row g-3 mb-3">
        <div class="col-md-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <small class="text-muted text-uppercase fw-semibold">Perfis cadastrados</small>
                    <div class="display-6 fw-bold">{{ perfis|length }}</div>
                    <div class="text-muted small">Perfis específicos para o App do Garçom</div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <small class="text-muted text-uppercase fw-semibold">Garçons com perfil</small>
                    <div class="display-6 fw-bold">{{ usuarios_garcom|selectattr('perfil_food_id')|list|length }}</div>
                    <div class="text-muted small">Usuários já vinculados a um perfil Food</div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <small class="text-muted text-uppercase fw-semibold">Observação</small>
                    <div class="fw-semibold mt-1">Sem perfil = comportamento atual</div>
                    <div class="text-muted small">Usuários sem vínculo continuam com o fluxo legado do Food.</div>
                </div>
            </div>
        </div>
    </div>

    <div class="card border-0 shadow-sm mb-4">
        <div class="card-header bg-light d-flex justify-content-between align-items-center">
            <span><i class="bi bi-list-check"></i> Perfis disponíveis</span>
            <span class="text-muted small">Operações sensíveis em modo liberado, gerente/admin ou bloqueado</span>
        </div>
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead class="table-light">
                        <tr>
                            <th>Perfil</th>
                            <th>Resumo operacional</th>
                            <th class="text-center">Garçons</th>
                            <th class="text-center">Visualização</th>
                            <th class="text-end">Ações</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for perfil in perfis %}
                        <tr>
                            <td>
                                <div class="fw-semibold">{{ perfil.nome }}</div>
                                <div class="text-muted small">{{ perfil.descricao or 'Sem descrição' }}</div>
                                {% if perfil.ativo %}
                                <span class="badge bg-success-subtle text-success border border-success-subtle mt-1">Ativo</span>
                                {% else %}
                                <span class="badge bg-secondary-subtle text-secondary border border-secondary-subtle mt-1">Inativo</span>
                                {% endif %}
                            </td>
                            <td>
                                <div class="d-flex flex-wrap gap-1">
                                    <span class="badge bg-light text-dark border">Abrir: {{ controle_labels.get(perfil.controle_abrir_mesa, perfil.controle_abrir_mesa) }}</span>
                                    <span class="badge bg-light text-dark border">Itens: {{ controle_labels.get(perfil.controle_lancar_item, perfil.controle_lancar_item) }}</span>
                                    <span class="badge bg-light text-dark border">Transferir: {{ controle_labels.get(perfil.controle_transferir_mesa, perfil.controle_transferir_mesa) }}</span>
                                    <span class="badge bg-light text-dark border">Trocar garçom: {{ controle_labels.get(perfil.controle_trocar_garcom, perfil.controle_trocar_garcom) }}</span>
                                    <span class="badge bg-light text-dark border">Fechar caixa: {{ controle_labels.get(perfil.controle_fechar_conta, perfil.controle_fechar_conta) }}</span>
                                    <span class="badge bg-light text-dark border">Editar: {{ controle_labels.get(perfil.controle_editar_itens, perfil.controle_editar_itens) }}</span>
                                </div>
                            </td>
                            <td class="text-center">
                                <span class="badge bg-primary">{{ usuarios_por_perfil.get(perfil.id, 0) }}</span>
                            </td>
                            <td class="text-center">
                                <div class="d-flex justify-content-center flex-wrap gap-1">
                                    <span class="badge {{ 'bg-success' if perfil.pode_visualizar_valores else 'bg-secondary' }}">Valores</span>
                                    <span class="badge {{ 'bg-success' if perfil.pode_visualizar_alertas_producao else 'bg-secondary' }}">Alertas</span>
                                    <span class="badge {{ 'bg-success' if perfil.pode_ver_mesas_outros_garcons else 'bg-secondary' }}">Ver outro</span>
                                    <span class="badge {{ 'bg-success' if perfil.pode_lancar_itens_outros_garcons else 'bg-secondary' }}">Lançar outro</span>
                                    <span class="badge {{ 'bg-success' if perfil.pode_previa_consumo_outros_garcons else 'bg-secondary' }}">Prévia outro</span>
                                </div>
                            </td>
                            <td class="text-end">
                                <div class="btn-group btn-group-sm">
                                    <a href="{{ url_for('food.editar_perfil_garcom_food', perfil_id=perfil.id) }}" class="btn btn-outline-primary">
                                        <i class="bi bi-pencil"></i>
                                    </a>
                                    <form method="POST" action="{{ url_for('food.duplicar_perfil_garcom_food', perfil_id=perfil.id) }}">
                                        <button type="submit" class="btn btn-outline-warning" title="Duplicar perfil">
                                            <i class="bi bi-files"></i>
                                        </button>
                                    </form>
                                    <form method="POST" action="{{ url_for('food.excluir_perfil_garcom_food', perfil_id=perfil.id) }}">
                                        <button type="submit" class="btn btn-outline-danger" title="Excluir perfil" onclick="return confirm('Excluir o perfil {{ perfil.nome }}?')">
                                            <i class="bi bi-trash"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                        {% else %}
                        <tr>
                            <td colspan="5" class="text-center py-4 text-muted">
                                <i class="bi bi-inbox fs-3"></i>
                                <p class="mb-0 mt-2">Nenhum perfil do App do Garçom cadastrado ainda.</p>
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="card border-0 shadow-sm">
        <div class="card-header bg-light d-flex justify-content-between align-items-center">
            <span><i class="bi bi-people"></i> Vínculo dos garçons</span>
            <span class="text-muted small">Atribua um perfil por usuário do app</span>
        </div>
        <div class="card-body p-0">
            <form method="POST" action="{{ url_for('food.atualizar_vinculos_perfil_garcom_food') }}">
                <div class="table-responsive">
                    <table class="table table-hover align-middle mb-0">
                        <thead class="table-light">
                            <tr>
                                <th>Garçom/Usuário</th>
                                <th>Tipo</th>
                                <th>Perfil atual</th>
                                <th>Vincular perfil</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for usuario in usuarios_garcom %}
                            <tr>
                                <td>
                                    <div class="fw-semibold">{{ usuario.nome }}</div>
                                    <div class="text-muted small">{{ usuario.username or usuario.motivo or 'Sem login' }}</div>
                                </td>
                                <td>
                                    <span class="badge bg-light text-dark border">{{ usuario.tipo }}</span>
                                </td>
                                <td>
                                    {% if usuario.perfil_food_nome %}
                                    <span class="badge bg-warning text-dark">{{ usuario.perfil_food_nome }}</span>
                                    {% else %}
                                    <span class="text-muted small">Sem perfil</span>
                                    {% endif %}
                                </td>
                                <td>
                                    {% if usuario.disponivel and usuario.id %}
                                    <select class="form-select form-select-sm" name="perfil_food_usuario_{{ usuario.id }}">
                                        <option value="">-- Sem perfil --</option>
                                        {% for perfil in perfis %}
                                        <option value="{{ perfil.id }}" {% if usuario.perfil_food_id == perfil.id %}selected{% endif %}>{{ perfil.nome }}</option>
                                        {% endfor %}
                                    </select>
                                    {% else %}
                                    <span class="text-muted small">{{ usuario.motivo or 'Indisponível' }}</span>
                                    {% endif %}
                                </td>
                            </tr>
                            {% else %}
                            <tr>
                                <td colspan="4" class="text-center py-4 text-muted">Nenhum usuário/garçom disponível para vínculo.</td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>

                <div class="p-3 border-top bg-light text-end">
                    <button type="submit" class="btn btn-success">
                        <i class="bi bi-check-lg"></i> Salvar vínculos
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}