Checkout

Visão Geral

Página de finalização do pedido com informações do cliente.

Localização

frontend-react/src/views/customer/CheckoutView.tsx

Funcionalidades

Dados do Cliente

Nome
Telefone
Email (opcional)
Tipo de pedido (mesa/retirada)
Número da mesa (se aplicável)
Observações

Resumo do Pedido

Lista de itens
Subtotal
Total

Campos

Campo	Tipo	Obrigatório	Descrição
`customerName`	string	Sim	Nome do cliente
`customerPhone`	string	Sim	Telefone
`customerEmail`	string	Não	Email
`type`	string	Sim	`dine_in` ou `takeout`
`notes`	string	Não	Observações

Seleção de Forma de Pagamento

O CheckoutView exibe opções de pagamento online conforme a configuração do tenant:

Configuração do Tenant	Opções exibidas
Sem `mpAccessToken`	Banner "Pagamento no estabelecimento" (sem seleção)
`mpAccessToken` configurado	PIX ⚡ + Cartão 💳
`mpAccessToken` + `mpPublicKey` configurados	PIX ⚡ + Cartão 💳 + 📱 Carteira

PIX ⚡ — gera QR Code dinâmico via Mercado Pago, exibido na tela de rastreamento (/track)
Cartão 💳 — pagamento com maquininha ao lado; pedido criado normalmente via POST /t/:slug/checkout/initiate
📱 Carteira — navega para /wallet-pay (WalletPaymentView), onde o Checkout Bricks processa Apple Pay / Google Pay; o pedido é criado pelo backend após aprovação

Fluxo

Cliente revisa itens no carrinho
Preenche dados de contato
Seleciona tipo de pedido (comer no local / levar)
Seleciona forma de pagamento (se disponível)
Confirma pedido (ou é redirecionado para /wallet-pay se escolheu Carteira)
Recebe número de rastreamento

Relacionados