Central do Médico (Cockpit) — Protótipo (v3.14)
Documentos desta funcionalidade: 01 - Definição (v4.28) · 02 - Especificação (v4.26) · 03 - Protótipo (v3.14, código executável em 03 - Protótipo v3.14.html) · 04 - Mapeamento de Banco de Dados (v4.31)
SEÇÃO 3 — PROTÓTIPO HTML
Estado: Protótipo funcional v3.14, com HTML semântico, CSS (Flexbox/Grid, tokens tipográficos e de cor do Design System) e JavaScript de interação (render dinâmico dos 4 painéis e da KPI Bar, busca com filtragem dinâmica pós-primeiro-disparo, modal de mensagens, toasts de feedback, filtros por toggle, navegação por teclado nos elementos clicáveis). Ícones vêm da biblioteca Lucide (via lucide.js), não mais emoji. Dados mockados em memória para demonstração.
Cobertura de touchpoints: O protótipo permite percorrer os touchpoints de workflow de ponta a ponta:
- Workflow 1: ver consultas pendentes → identificar atraso (badge pulsante) → clicar no card → abrir PEP
- Workflow 2: ver pacientes em procedimento → monitorar barra de progresso inline → clicar no card → abrir prescrição → clicar em PEP
- Workflow 3: ver prescrições urgentes → clicar em Assinar → tela de assinatura (simulada via toast) → assinar → retorno automático à Central com contador atualizado. Clicar em Revisar → abertura da prescrição para revisão (simulada via toast) → revisão marcada como concluída → retorno automático à Central com contador e KPI atualizados
- Workflow 4: ver mensagens não lidas em destaque, à frente das já lidas (borda lateral colorida, prioridade na lista) → identificar data limite → clicar no card → modal com mensagem integral (leitura rebaixa a conversa de prioridade, sem removê-la do painel) → Resolvido ou Descartado → contador atualizado
Pendências identificadas no protótipo em relação à Seção 2 (ver lista completa no Checklist de acompanhamento):
- Ações de Assinar/Revisar e Resolver/Descartar/Responder mensagens estão simuladas com
showToast()/manipulação de array em memória — os endpoints reais de prescrições (assinar, revisar, editar) saíram do escopo deste documento (ver nota na Seção 2.9); os de conversas (/read,/reply,/resolve,/discard) estão especificados na 2.9/4.9, mas o protótipo ainda não os chama de fato. - O botão “Assinar” continua simulando só a abertura da tela de assinatura via toast, sem de fato abrir a prescrição completa (RN-CM-012 exige isso antes de confirmar) — mantido assim nesta versão porque a tela de prescrição completa ainda não existe em nenhum documento deste projeto; quando essa tela for especificada, o protótipo deve passar a abri-la de verdade em vez de simular via toast.
- O botão “Revisar” do painel de Prescrições Pendentes agora simula a abertura da prescrição e a conclusão da revisão (“Marcar como Revisada”), atualizando contador e KPI — mas ainda não distingue visualmente esse caminho do caminho de editar (que gera nova versão da prescrição, RN-CM-020); a Seção 2.4 já descreve os dois critérios de aceitação, a demonstração interativa do caminho de edição fica pendente.
- O mock de dados (item id 2, “Sandra”) foi ajustado nesta versão só para exibir o nome com o sufixo de equipe (“Sandra (Farmacia)”), reproduzindo o formato final descrito em RN-CM-015/RN-CM-022 — mas a lógica de resolução em si (checar
Conversa.DestinoTipo/EquipeMembropara decidir quando mostrar o sufixo) não existe no protótipo, que só simula dados estáticos em memória; a lógica real fica para quando o protótipo for ligado ao backend. Código-fonte executável:03 - Protótipo v3.14.html— abra direto no navegador.
Histórico de Versões
- (sincronização, 16/09/2026) — sem mudança de conteúdo deste documento; apenas a linha de cabeçalho “Documentos desta funcionalidade” atualizada para apontar Definição v4.28 e Mapeamento de Banco de Dados v4.31 (RN-CM-023 corrigida — ver Histórico desses dois documentos).
- v3.14 (16/09/2026) — Rodada de correções após a primeira revisão de versão aprovada (Agente de UI/UX, ver Skill Designer); mudanças no
.html, este.mdatualizado em conjunto (convenção de versionamento em par dos dois arquivos da Seção 3). Achados críticos: ação “Revisar” agora simula abertura da prescrição e conclusão da revisão, atualizando contador e KPI (antes era só um toast, sem nenhum efeito) — o botão “Assinar” foi mantido como simulação via toast, por decisão do solicitante, já que a tela de prescrição completa ainda não existe em nenhum documento deste projeto. Achados “Destaques”: os 3 KPIs com números estáticos divergentes dos dados mock (Consultas Hoje, Procedimentos Hoje, Alertas de Prescrição) agora são recalculados dos próprios arrays mock a cada render; cor do chip “Finalizado” alinhada à cor do avatar (fonte únicastatusColor()); busca passou a filtrar a cada tecla após o primeiro disparo (1s), como já descrito na Especificação §2.1; strings inseridas viaonclickagora passam por uma função de escape (nomes com apóstrofo, ex. “O’Brien”, não quebram mais o card); todos os emoji trocados por ícones da biblioteca Lucide (lucide.js, CDN); tokens tipográficos do Design System (--font-size-*) importados no:roote todos osfont-sizedo CSS/inline remapeados para a escala oficial (mapeamento não exato em alguns casos — proposta do Designer, não confirmada pelo solicitante, onde o valor antigo caía entre dois tokens). Achados “Menores”: chip “Respondida” ganhou cor própria (não reaproveita mais a cor de urgência “atenção”); badge “Atrasado” ganhou o separador ”·” exigido pelo critério de aceitação (Especificação §2.3); títulos de painel e KPI cards agora são navegáveis por teclado (tabindex,role, Enter/Espaço); mensagens de estado vazio corrigidas (“prescrições”/“notificações” com acento — esta última também alinhada ao novo nome “Mensagens”);<title>da página corrigido para v3.14; cor duplicada do chip “Finalizado” e o valor mágico#fafafa(usado em 2 lugares) substituídos por tokens/valores já existentes no:root; texto placeholder “ícone” dos KPI cards substituído pelos ícones Lucide reais. Nome do painel trocado de “Comunicação” para “Mensagens” (consolidando com Definição e Especificação, ambas corrigidas na mesma rodada). Ver Histórico do.htmlpara o detalhamento técnico completo. - v3.13 (29/08/2026) — Arquivo
.md(narrativa) e.html(código-fonte executável, extraído do bloco de código que antes vivia dentro do documento único) criados pela divisão do documento únicoCM_CockPit_do_medico_v4_25.mdem 4 arquivos por seção (ver Skill Designer, “Organização Física: Pasta por Funcionalidade”, Lição #18). O protótipo funcional em si permanece na v3.13, sem mudança de código nesta divisão. Histórico de revisões do protótipo anterior a esta divisão preservado no documento original arquivado (Histórico/CM_CockPit_do_medico_v4_25 (documento único, antes da divisão em 4 arquivos).md).