@extends('layouts.app')
@section('title', 'Comandas — '.config('app.name'))
@section('content')
{{-- AS ABAS OCUPAM O LUGAR DO TÍTULO. "Comandas" é o que está em aberto no
balcão; "Histórico" é o que já foi pago e arquivado. Como a página só
mostra um universo por vez, um título fixo acima das abas repetiria a
aba ativa.
O
continua existindo, só que invisível: ele é o nome da página para
leitor de tela e para o índice de cabeçalhos, e uma lista de links não
cumpre esse papel. --}}
Comandas
{{-- ABAS COMO LINKS, e NÃO o `data-bs-toggle="tab"` do Bootstrap.
A tab do Bootstrap troca painéis JÁ RENDERIZADOS: a página teria
de trazer as duas listas de uma vez — duas consultas paginadas,
dois conjuntos de modais de detalhe e duas paginações
disputando a mesma query string.
Como link, cada aba é um endereço de verdade: compartilhável,
no histórico do navegador, e funciona sem JavaScript. Só a
APARÊNCIA vem do componente (`nav nav-tabs`).
As abas NÃO carregam a busca: trocar de universo é recomeçar.
Levar o termo junto faria "Histórico" abrir já filtrado por algo
digitado para a outra lista, quase sempre sem resultado.
F1 ALTERNA ENTRE AS ABAS, e o `data-shortcut` fica sempre na
aba INATIVA — a que está ativa não teria para onde levar. Como
só uma das duas é a ativa, a marca cai naturalmente na outra e
o toggle não precisa guardar estado nenhum: cada carga de
página reposiciona a tecla sozinha.
O SELO "F1" ACOMPANHA O `data-shortcut`, na mesma condição.
Imprimi-lo nas duas abas seria mentira: estando em Comandas, o
F1 NÃO leva para Comandas. Marcando só o destino, o selo se lê
como "F1 vem para cá" — que é exatamente o que a tecla faz —, e
ele salta de uma aba para a outra a cada troca, o que já ensina
sozinho que a tecla é um alterna. --}}
{{-- Guardado por `orders.create`, e não por `orders.view`: quem só
consulta o consumo não deve ver um botão que abriria um cadastro
recusado depois. O modal em si só é incluído no fim da tela, dentro
do mesmo `@can` — sem a permissão, ele nem chega ao HTML. --}}
{{-- F2 no BOTÃO, e não numa chamada a `new Modal(...)`: o atalho passa
pelo mesmo caminho do clique, então herda o `data-bs-target` e
qualquer mudança futura do botão. E como o bloco inteiro está sob
`@can`, quem não pode criar comanda não recebe nem o botão nem a
tecla — a permissão continua sendo decidida em um lugar só. --}}
@can('create', App\Models\Order::class)
@endcan
@include('partials.status')
{{-- A busca vive num card próprio, acima da grade. Em listagem de cards não
há cabeçalho de tabela onde encaixá-la, e enfiá-la dentro do primeiro
card a faria parecer parte daquela comanda.
BUSCA AO VIVO, MAS O FORMULÁRIO CONTINUA SENDO UM FORMULÁRIO DE VERDADE.
Method GET, action preenchida e botão de enviar: sem JavaScript a tela
filtra recarregando, como sempre filtrou. O live-search.js intercepta a
digitação, pede a mesma URL e troca o conteúdo de `#orders-results` — e é
ele quem ESCONDE o botão "Buscar", que só faz sentido quando o script não
carregou. Por isso o botão continua no HTML mesmo tendo sumido da tela:
apagá-lo daqui deixaria a busca inutilizável se o bundle falhasse.
O endereço acompanha o filtro (o JS reescreve a URL com a mesma query
que o formulário produziria), então o link continua compartilhável. --}}
{{-- `aria-live="polite"` porque a grade passa a mudar sem que a página
recarregue: sem isso, quem usa leitor de tela digitaria na busca e não
receberia aviso nenhum de que o resultado mudou. "Polite" e não
"assertive" para não interromper a digitação a cada tecla. --}}
@include('orders._results')
{{-- O modal vive FORA da grade de cards, no fim da tela. Dentro de um `.col`
ele herdaria o contexto de posicionamento da grade, e o backdrop do
Bootstrap passaria a ser recortado pelo card em vez de cobrir a página. --}}
@can('create', App\Models\Order::class)
@include('orders._form', [
'modalId' => 'order-create',
'customers' => $customers,
'categories' => $categories,
'products' => $products,
])
@endcan
{{-- UM SÓ modal de adicionar itens para todas as comandas da página: o
catálogo é a parte pesada da tela, e replicá-lo por comanda multiplicaria
o HTML por 12 para mostrar sempre a mesma grade. Qual comanda recebe os
itens vem do botão que abre o modal — ver `orders/_add-items`. --}}
@if ($canAddItems)
@include('orders._add-items', [
'categories' => $categories,
'products' => $products,
])
{{-- Também um só para a página: a lista de contas e as formas de
pagamento são as mesmas para todas as comandas. Mesma permissão do
modal de itens (`orders.update`) — quem corrige a comanda fecha a
comanda. --}}
@include('orders._pay', ['bankAccounts' => $bankAccounts])
@endif
{{-- Também um só para a página, e por permissão SEPARADA (`orders.delete`):
descartar não é o mesmo poder que corrigir ou fechar a comanda. --}}
@if ($canDiscard)
@include('orders._discard')
@endif
@endsection