86 lines
1.8 KiB
Markdown
86 lines
1.8 KiB
Markdown
# Marketplace Frontend - Documentação
|
|
|
|
## Visão Geral
|
|
|
|
Frontend React do marketplace B2B SaveInMed para busca, compra e gestão de pedidos entre farmácias.
|
|
|
|
## Tecnologias
|
|
|
|
- **React 18** + **TypeScript**
|
|
- **Vite 5** - Build tool
|
|
- **TailwindCSS** - Estilização
|
|
- **Zustand** - State management
|
|
- **React Router** - Navegação
|
|
|
|
## Estrutura
|
|
|
|
```
|
|
src/
|
|
├── components/ → Componentes reutilizáveis
|
|
├── hooks/ → Custom hooks
|
|
├── layouts/ → Layouts (Shell, AuthLayout)
|
|
├── pages/ → Páginas/rotas
|
|
├── services/ → Chamadas API
|
|
├── stores/ → Zustand stores
|
|
├── types/ → TypeScript types
|
|
└── utils/ → Utilitários (format, jwt, logger)
|
|
```
|
|
|
|
## Funcionalidades
|
|
|
|
### Catálogo
|
|
- Busca de produtos por nome/medicamento
|
|
- Filtros por preço, distância, validade
|
|
- Ordenação por menor preço
|
|
|
|
### Carrinho
|
|
- Agrupamento por fornecedor
|
|
- Preços em centavos (formatCents)
|
|
- Cálculo de subtotais
|
|
|
|
### Checkout
|
|
- Endereço de entrega
|
|
- Métodos de pagamento (Pix, Cartão)
|
|
- Cálculo de frete
|
|
|
|
### Dashboard
|
|
- Pedidos realizados
|
|
- Pedidos recebidos
|
|
- Métricas
|
|
|
|
## Stores
|
|
|
|
| Store | Arquivo | Descrição |
|
|
|-------|---------|-----------|
|
|
| Auth | `authStore.ts` | Token, usuário logado |
|
|
| Cart | `cartStore.ts` | Itens do carrinho |
|
|
|
|
## Utils
|
|
|
|
| Util | Função | Exemplo |
|
|
|------|--------|---------|
|
|
| `formatCents` | Converte centavos | `819 → "R$ 8,19"` |
|
|
| `formatCurrency` | Formata decimal | `8.19 → "8,19"` |
|
|
| `decodeJwtPayload` | Decodifica JWT | Extrai claims |
|
|
|
|
## Executar
|
|
|
|
```bash
|
|
cd marketplace
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
## Testes
|
|
|
|
```bash
|
|
npm run test
|
|
```
|
|
|
|
> Para matriz completa (com/sem banco e Playwright), veja: [docs/TESTES.md](./TESTES.md)
|
|
|
|
## Build
|
|
|
|
```bash
|
|
npm run build
|
|
```
|