feat(ux): restringir navegacao principal ao MenuLateral.vue na skill ux-fluxo-funcional

This commit is contained in:
Luiz Silva 2026-10-18 16:06:51 -03:00
parent e5b42a6541
commit 20663b7f6a

View file

@ -18,17 +18,17 @@ Garantir que qualquer aplicação `<modulo>-front` do ecossistema (identificada
## Os 6 Pilares da Usabilidade Funcional
### Pilar 1 — Navegação Primária Visível e Ordenada pela Jornada Operacional
### Pilar 1 — Navegação no Menu Lateral Ordenada pela Jornada Operacional
O usuário corporativo não deve adivinhar onde clicar nem abrir um menu hambúrguer oculto a cada troca de tela para descobrir como o sistema funciona.
O menu de navegação das páginas do módulo deve residir **exclusivamente no menu lateral (`MenuLateral.vue`)**, ordenado pela sequência lógica de trabalho do domínio:
1. **Ordem da Tarefa (Task-Order Navigation):** A navegação principal do módulo deve refletir a sequência lógica de trabalho do domínio:
1. **Ordem da Tarefa (Task-Order Navigation no `MenuLateral.vue`):** A navegação lateral do módulo deve refletir a sequência lógica de trabalho do domínio:
- `1. Cadastros Base / Pré-requisitos` (ex.: catálogos, recursos, equipes, parâmetros iniciais)
- `2. Modelos / Configuração` (ex.: templates, padrões reutilizáveis)
- `3. Entidade Principal / Planejamento` (ex.: registros centrais do módulo, cronogramas, estruturação)
- `4. Execução Operacional` (ex.: quadros de trabalho, filas de atendimento, operação diária)
- `5. Monitoramento / Indicadores` (ex.: dashboards executivos, relatórios consolidados)
2. **Barra de Navegação Visível no Topo ou Subcabeçalho:** Além do menu lateral retrátil (`v-navigation-drawer`), manter uma barra de navegação primária visível no `v-app-bar` (ou barra horizontal de etapas) com destaque claro da rota ativa.
2. **Proibição de Menu Duplicado no Cabeçalho (`CabecalhoPrincipal.vue`):** O `v-app-bar` superior deve conter apenas o botão de acionamento do menu lateral, a identidade do módulo e o menu de usuário/notificações — **nunca** duplicar botões de navegação de páginas na barra superior.
---
@ -98,7 +98,7 @@ No Vuetify 3 em tema claro (`dark: false`), componentes com `variant="tonal"` e
2. **Auditar a Jornada Completa:** Inspecionar `App.vue`, `router/index.ts`, `plugins/vuetify.ts` e as views de `<modulo>-front/src/` verificando os 6 Pilares acima.
3. **Corrigir Tokens e Navegação Global:**
- Ajustar `secondary` em `vuetify.ts` caso esteja usando cor clara sem contraste.
- Tornar a navegação principal visível e ordenada pela jornada operacional em `App.vue`.
- Concentrar a navegação principal exclusivamente em `MenuLateral.vue` (sem duplicar links na `CabecalhoPrincipal.vue`) e ordenada pela jornada operacional.
4. **Desafogar Layouts e Conectar Fluxos:**
- Substituir *split-screens* apertados (`4+8`) por seleção de contexto + área principal de `12 colunas`.
- Inserir links de navegação cruzada e *empty states* guiados entre telas dependentes.
@ -110,7 +110,7 @@ No Vuetify 3 em tema claro (`dark: false`), componentes com `variant="tonal"` e
## Checklist Rápido de Conformidade (`ux-fluxo-funcional`)
- [ ] A barra de navegação principal está visível e ordenada na sequência lógica de uso do módulo?
- [ ] A navegação principal está concentrada exclusivamente no `MenuLateral.vue` (sem menu horizontal duplicado no cabeçalho) e ordenada na sequência lógica de uso do módulo?
- [ ] Todas as telas com pré-requisitos orientam o usuário e oferecem botão direto para a etapa anterior quando vazias?
- [ ] Telas com abas densas ou tabelas largas usam `12 colunas` em vez de *split-screen* `4+8` espremido?
- [ ] Todos os rótulos técnicos de banco/código (`(info)`, `JSONB`, `Instanciar`, enums crus) foram substituídos por linguagem natural do domínio?