# ESPETINHO VITÓRIA

Ecossistema Completo de Gestão de Restaurantes, Delivery, Cardápio Digital e Impressão Térmica

---

Visão Geral do Sistema

O Espetinho Vitória é uma solução omnichannel para estabelecimentos gastronômicos e operações de delivery. O ecossistema unifica o atendimento ao cliente via Cardápio Digital PWA, a operação de cozinha e balcão no Painel Admin em Tempo Real com suporte a Impressão Térmica de Recibos, e o gerenciamento de entregas pelo Módulo de Entregadores.

A arquitetura foi projetada sob três pilares estratégicos:

1. Atendimento Autônomo e Fluidez (Self-Service): Cardápio responsivo com geração de QR Code, cálculo automático de taxa de entrega por bairro/distância e geração de chave Pix dinâmica com QR Code.
2. Operação de Cozinha de Alta Performance: Kanban reativo com atualização via WebSocket (Supabase Realtime), disparo de alertas sonoros a cada novo pedido e integração com impressoras térmicas (recibos de 58mm / 80mm).
3. Gestão Estratégica e Fidelização: Módulo de clientes com histórico de compras, programa de fidelidade por pontuação/pedidos, gestão de estoque de insumos e relatórios financeiros com Recharts.

---

Demonstração da Interface (Screenshots)

1. Cardápio Digital e Fluxo do Cliente (Mobile PWA)

Tela Inicial do Cardápio	Categorias e Navegação

Detalhes do Produto (Açaí)	Seleção de Adicionais e Personalização

2. Painel Administrativo e Gestão Operacional (Desktop)

Dashboard de Métricas Gerais	Kanban de Pedidos em Tempo Real

Gestão de Cardápio e Produtos	Controle de Estoque de Insumos

Relatórios Financeiros e Analytics	Gerador de QR Code para Mesas

---

Diagrama da Arquitetura do Ecossistema

graph TD
    subgraph Cliente ["1. Interface do Cliente (PWA)"]
        Menu["Cardápio Digital & Adicionais"]
        Cart["Carrinho & Taxa de Entrega"]
        Checkout["Checkout Pix / Cartão / Dinheiro"]
        Track["Acompanhamento de Status em Tempo Real"]
    end

    subgraph Admin ["2. Painel Administrativo (Gestão & Cozinha)"]
        Kanban["Kanban de Pedidos (Realtime)"]
        SoundEngine["Alertas Sonoros de Novo Pedido"]
        PrintEngine["Motor de Impressão Térmica"]
        Inventory["Controle de Estoque & Cardápio"]
        Customers["Fidelidade & Clientes"]
        Reports["Relatórios Financeiros & Dashboard"]
    end

    subgraph Driver ["3. Módulo do Entregador"]
        DriverApp["Painel de Entregas & Rota"]
    end

    subgraph Backend ["Backend & Persistência (Supabase)"]
        Auth["Supabase Auth (JWT)"]
        DB["PostgreSQL (Pedidos, Estoque, Clientes)"]
        Realtime["Realtime Engine (WebSockets)"]
    end

    Checkout -->|Envia Pedido| DB
    DB -->|Dispara Modificação| Realtime
    Realtime -->|Push Instantâneo| Kanban
    Kanban -->|Ativa| SoundEngine
    Kanban -->|Comando de Impressão| PrintEngine
    Kanban -->|Atribui Motoboy| DriverApp
    DriverApp -->|Atualiza Status| DB
    DB -->|Sincroniza Status| Track

Loading

---

Principais Funcionalidades

Módulo do Cliente (Cardápio Digital)

• Cardápio Dinâmico: Organização por categorias, variações de insumos e adicionais personalizáveis.
• Cálculo de Frete Flexível: Taxa de entrega calculada por bairro ou raio de distância.
• Checkout Inteligente: Opções de pagamento Pix (Chave / QR Code), Cartão na Entrega ou Dinheiro com cálculo automático de troco.
• Status do Pedido: Acompanhamento transparente das etapas (Pendente, Em Preparo, Saiu para Entrega, Concluído).
• Horário de Funcionamento: Trava automática de pedidos quando o estabelecimento está fechado.

Módulo Administrativo (Gestão e Operação)

• Kanban de Cozinha com Realtime: Drag-and-drop de pedidos entre colunas operacionais com sincronização instantânea.
• Impressão Térmica de Recibos: Emissão de comprovantes para cozinha e cliente formatados para impressoras térmicas ESC/POS.
• Alertas Sonoros: Notificações em áudio diferenciadas para novos pedidos.
• Programa de Fidelidade: Gestão automática de pontos e bônus para clientes frequentes.
• Controle de Estoque: Baixa automática de ingredientes e alertas de item esgotado.
• Gestão de Mesas e Comandas: Suporte para atendimento presencial com controle de comanda por mesa e gerador de QR Code.
• Relatórios de Desempenho: Gráficos analíticos de faturamento diário/mensal, ticket médio e produtos mais vendidos.

---

Tecnologias e Engenharia de Stack

Frontend

• React 19.2: Utilização das APIs mais recentes do React para componentes reativos e alta fluidez de UI.
• JavaScript ES2024: Código moderno, modular e otimizado.
• Vite 7.3: Bundler ultrarrápido com Hot Module Replacement (HMR).
• Recharts 3.7: Biblioteca para renderização de gráficos estatísticos.
• Lucide React: Biblioteca de ícones vetoriais.
• QRCode.React: Gerador nativo de QR Codes para pagamentos Pix e mesas.
• Vite Plugin PWA: Suporte completo a Progressive Web App (PWA) para instalação no celular do cliente.

Backend e Infraestrutura

• Supabase PostgreSQL: Banco de dados relacional com Row Level Security (RLS).
• Supabase Realtime: Transmissão WebSockets de alterações na tabela de pedidos em tempo real.
• Supabase Auth: Gerenciamento de acessos do painel administrativo e entregadores.
• Vercel: Deployment contínuo de alta disponibilidade.

---

Estrutura do Projeto

espetinho-vitoria/
├── src/
│   ├── components/       # Componentes reutilizáveis (Header, Navbar, Modais, ThermalReceipt)
│   ├── context/          # Context API global (StoreContext, AuthContext, ThemeContext)
│   ├── pages/            # Módulos organizados por perfil de acesso
│   │   ├── admin/        # Painel Administrativo (Orders, Menu, Customers, Inventory, Reports, Tables)
│   │   ├── customer/     # Cardápio Digital do Cliente
│   │   └── driver/       # Painel do Entregador
│   ├── services/         # Clientes de API e comunicação com Supabase
│   └── utils/            # Utilitários de formatação de moeda, impressão e Pix
├── public/               # Logotipos e ativos estáticos PWA
├── index.html            # Entry point com meta tags de SEO
├── vite.config.js        # Configuração do Vite e PWA Manifest
└── package.json          # Manifesto de dependências do projeto

---

Instalação e Execução Local

Pré-requisitos

• Node.js: v18.0.0 ou superior
• npm: v9.0.0 ou superior

Passos para Instalação

1. Clonar o Repositório:

   git clone https://github.com/Alan-silva01/espetinho-vitoria.git
   cd espetinho-vitoria

2. Instalar Dependências:

   npm install

3. Configuração de Variáveis de Ambiente: Crie um arquivo .env com as credenciais do seu projeto Supabase:

   VITE_SUPABASE_URL=sua_url_do_supabase
   VITE_SUPABASE_ANON_KEY=sua_chave_anonima_do_supabase

4. Executar em Modo de Desenvolvimento:

   npm run dev

   Acesse no navegador: http://localhost:5173 ou veja a aplicação pública em https://espetinho-vitoria.vercel.app/menu.

5. Gerar Build de Produção:

   npm run build

---

Desenvolvido por Alan Silva | Soluções em Automação e Software Empresarial