PADRAO PREVIEW 3-WAY (mobile/sidebar/floating)
- Replica o pattern do MelissaNegocio em MelissaAgendador e MelissaLinkExterno.
- Mobile: preview teleporta pro topo do main, acima de tudo (diferente do
Negocio que vai pro drawer).
- Mid-desktop (1024-1339): teleporta pro fim da sidebar inline.
- Wide-desktop (>=1340): painel flutuante glass fora do fake dialog,
ancorado a +14px do right edge da .X-page com width 320px.
MELISSAAGENDADOR (.mag-page)
- Importa AgendadorPreview (componente legacy do ConfiguracoesAgendadorPage).
- isWideDesktop ref + matchMedia('(min-width: 1340px)') + previewTarget computed.
- 3 placeholders + Teleport com card mag-w--side mag-w--preview.
- Adiciona right: max(6px, min(50%, calc(100% - 1006px))) em .mag-page no
@media >=1024px (necessario pra abrir espaco pro floating).
MELISSALINKEXTERNO (.ml-page)
- Restruturacao: sidebar (Como funciona / Boas praticas) movida da DIREITA
pra ESQUERDA + mobile drawer pattern (botao Menu, Teleport, transitions,
backdrop) espelhando MelissaAgendador.
- 3-way teleport do preview com placeholders nos 3 alvos.
- ml-side ganha width 320px + scroll proprio.
- Right rule + floating preview CSS.
COMPONENTE NOVO: src/components/cadastro/CadastroExternoPreview.vue (~350L)
- Phone-frame 260px estilo AgendadorPreview replicando o CadastroPacienteExterno
publico: nav (logo Psi + chip verificado), hero (avatar 38px + nome split
firstName/lastName em accent + work_description label + clinic name),
stepper 4 dots (1 active), card etapa 1 (numero decorativo + tag "Etapa
1 de 4" + title "Sobre voce" + 3 input bars + CTA "Continuar"), powered by.
- Recebe :token e busca info via mesma edge function que o publico
(get-intake-invite-info), watch refetcha quando token rotaciona.
- Sem token ou sem dados, fallback gracioso pra placeholders ("Profissional"
+ iniciais).
CHROME EM 6 PAGINAS TABULARES (sem preview)
- Apenas o right: max(6px, min(50%, calc(100% - 1006px))) no @media >=1024px,
fazendo a janela ficar do mesmo tamanho do MelissaAgendador.
- MelissaCadastrosRecebidos (.mcr), MelissaRecorrencias (.mr), MelissaGrupos
(.mg), MelissaTags (.mt), MelissaCompromissos (.mc), MelissaMedicos (.mm).
- +9 a 12 linhas por arquivo. Cada um nao tinha @media >=1024px ainda.
ESLint: 0 errors da minha mudanca. 2 errors pre-existentes em
MelissaRecorrencias.vue (totalDone unused L235, v-for/v-bind:key L584) -
nao toquei aquelas linhas.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
6.3 KiB
Wiki Log
Chronological, append-only record of everything that's happened in this wiki.
Format:
## [YYYY-MM-DD HH:MM] <type> | <title>
<optional detail line>
Types: session, ingest, query, lint, rebuild
Quick access: grep "^## \[" log.md | tail -5 gives you the last 5 entries.
[2026-05-05 23:45] session | Blueprint tabular Melissa + restore pacientes
Touched: none (sem mudança de wiki — handoff em HANDOFF.md)
Detalhes: criou blueprints/melissa-table-page-blueprint.md (~530L, 18 seções);
refatorou MelissaCadastrosRecebidos pro padrão (DataTable + frozen action +
view toggle list/grade); criou MelissaAgendamentosRecebidos nativa (substituindo
embed); MelissaPacientes ganhou subheader, sombras, status pills coloridas,
email/phone colunas próprias, mobile pencil+popover, view toggle, fix scroll
mobile (min-height: 0 em .mp-list), botão Restaurar pra arquivados.
Repository: restorePatient novo. PatientsCadastroPage statusOpts: +Arquivado.
A66 V2 — user não gostou design, aguarda feedback específico.
[2026-05-06 12:00] session | MelissaCompromissos refator blueprint
Touched: none (aplicacao direta do blueprint existente - sem mudanca de wiki) Detalhes: refator de MelissaCompromissos pro melissa-table-page-blueprint preservando o design do row (color stripe + name+badges + descricao + meta inline). DataTable com 3 colunas (Compromisso flex / Atividade 220px / Acoes frozen 140px com toggle+pencil+trash). Sidebar com 2 grupos de filtros: Status (Ativos verde / Inativos amber) e Tipo (Nativos blue / Meus accent), cada um com Limpar filtro proprio. Grid view com cards (color stripe 28px + toggle topo + footer com edit/trash). Subheader explicativo. View toggle persistido em mc.viewMode.v1. Removeu Popover de actions (drawer mobile cobre). Stats: Total/Ativos/Inativos/Tempo total. ESLint 0 errors. UI nao testada em browser ainda.
[2026-05-06 14:00] session | Melissa 6 Pages blueprint + WhatsApp drawer + commits
Touched: none (sem nova pagina de wiki - aplicacao do blueprint existente)
Detalhes: Sprint F entregue. Blueprint tabular aplicado em MelissaCompromissos
(row design preservado), MelissaGrupos, MelissaTags, MelissaMedicos,
MelissaConversas, MelissaRecorrencias. Dialogs de criar/editar harmonizados
(FloatLabel + IconField + section dividers espelhando PatientsCadastroPage
Identidade). Dialogs "Pacientes do grupo/tag/medico" com cor primary nos
avatares de letras + X de fechar igual .xx-close. ConversationDrawer redesign
estilo WhatsApp (avatar primary, bg papel de parede, bolhas com tail simulada,
time/status overlay no canto inferior direito, compose pill + send circular
verde #00a884). Bug fix em MelissaPacientes: g.cor->g.color em 20 lugares
(repository devolve camelCase, template lia PT-BR e cores nao apareciam).
5 commits criados: 957e912, 6d9b36d, 269b531, 98f7252, 15103ed. Working tree
limpa. HANDOFF.md atualizado.
[2026-05-06 17:30] session | Melissa drawers: footer pattern AppMenu
Touched: none
[2026-05-08 00:00] session | Melissa cfg-* nativas + temas + cronometro DB
Touched: none
[2026-05-08 09:30] session | Chrome+preview em 7 paginas Melissa (LinkExterno preview novo)
Touched: none (sem mudanca de wiki - aplicacao do pattern existente)
Detalhes: Aplicou o chrome right: max(6px, min(50%, calc(100% - 1006px)))
em 6 paginas tabulares (CadastrosRecebidos .mcr / Recorrencias .mr / Grupos
.mg / Tags .mt / Compromissos .mc / Medicos .mm) - so o tamanho de janela,
sem preview, conforme pedido pelo user. Adicionou novo @media (min-width:
1024px) ao final de cada arquivo (cada um nao tinha esse breakpoint ainda).
MelissaLinkExterno (.ml) ganhou tratamento completo: chrome + sidebar restruturada (2-col com aside agora a ESQUERDA, antes era a direita) + mobile drawer pattern (Teleport pro #ml-mobile-drawer-target, transitions, backdrop, botao Menu mobile-only) + 3-way teleport do preview (mobile=topo do main / mid-desktop=bottom da sidebar / wide-desktop>=1340=floating glass). Sidebar agora com Como funciona + Boas praticas (movidos da .ml-side direita)
- scroll proprio. Sem cfg toggle (nao havia necessidade conceitual).
Componente novo: src/components/cadastro/CadastroExternoPreview.vue (~350L). Phone-frame 260px estilo AgendadorPreview replicando o CadastroPacienteExterno publico: nav (logo Psi + chip verificado), hero (avatar 38px + nome split firstName/lastName em accent + work_description label + clinic name), stepper 4 dots (1 active), card etapa 1 (numero decorativo + tag "Etapa 1 de 4" + title "Sobre voce" + 3 input bars + CTA "Continuar"), powered by. Recebe :token prop e busca info do convite via mesma edge function que o publico (get-intake-invite-info), watch refetcha quando token rotaciona. Sem token ou sem dados, fallbacks pra "Profissional" + iniciais.
ESLint: 0 errors da minha mudanca. 2 errors pre-existentes em MelissaRecorrencias.vue (totalDone unused L235, v-for/v-bind:key L584) - nao toquei aquelas linhas. Working tree: 9 arquivos modificados + src/components/cadastro/ (untracked). Nao commitado, nao testado em browser.
[2026-05-08 07:55] session | MelissaAgendador preview celular teleport 3-way
Touched: none (aplicacao do padrao MelissaNegocio - sem mudanca de wiki) Detalhes: Replicou o padrao floating preview do MelissaNegocio em MelissaAgendador.vue (+145L). Importou AgendadorPreview (phone-frame ja existente do legacy ConfiguracoesAgendadorPage). Adicionou ref isWideDesktop
- matchMedia('(min-width: 1340px)') + computed previewTarget com 3-way
branching: mobile -> #mag-main-preview-target (topo do main, acima de tudo,
DIFERENTE do MelissaNegocio que vai pro drawer); mid-desktop (1024-1339) ->
#mag-sidebar-preview-target (dentro da sidebar apos Status/Resumos);
wide-desktop (>=1340) -> #mag-floating-preview-target (painel flutuante glass
fora do fake dialog, 320px de largura, ancorado a +14px do right edge da
.mag-page). Adicionou regra
right: max(6px, min(50%, calc(100% - 1006px)))em .mag-page no @media >=1024px (necessario pra abrir espaco a direita pro floating). CSS: .mag-floating-preview com glass igual ao fake dialog; placeholders com display:contents; hide rules por breakpoint. Card de preview usa mag-w--side e perde fundo/borda no floating (glass do painel ja faz papel). ESLint 0 errors. Working tree: src/auto-imports.d.ts (auto-gerado) + MelissaAgendador.vue. Nao commitado, nao testado em browser ainda.