MelissaNotificacoes nativa (mesmo design do LinkExterno)

Promove '/melissa/notificacoes' do embed pra pagina nativa Melissa,
eliminando o triplo header (layout + embed + hero sticky da
NotificationsHistoryPage interna).

Layout 2-col seguindo o mesmo blueprint Melissa:

- Header: titulo + count badge + pill amber "X nao lidas" quando
  unreadCount > 0 + botao "Marcar todas lidas" (visivel se ha unread)
  + Recarregar + Voltar.
- Subheader explicativo.
- Sidebar (~280px) com __scroll + __footer fixo:
  - Stat card (Total / Nao lidas amber / Lidas verde / Arquivadas)
  - Filter card "Status" (button list: Todas / Nao lidas / Lidas /
    Arquivadas) + X inline pra voltar pro padrao 'all'
  - Filter card "Tipo" (button list: Agendamento red / Novo paciente
    sky / Recorrencia amber / Sessao orange / Mensagem emerald —
    cores espelham typeMap) + X inline
  - Footer fixo "Limpar filtros" (Transition fade+collapse) — zera
    busca + tipo + reseta status pra 'all'
- Main: toolbar com busca por titulo/descricao + lista de
  notificacoes com row design preservado:
  - Border-left colorido por tipo (--mn-row-color via inline style)
  - Icone do tipo + avatar circular primary com iniciais
  - Body: titulo + type pill colorido + arquivada pill (se aplicavel)
    + detail (2 lines clamp) + tempo relativo
  - Hover actions: marcar lida/nao lida + arquivar/desarquivar +
    remover (com ConfirmDialog)
  - is-unread: bg primary tinted; is-archived: opacity 0.7
- Mobile (<1024px): sidebar vira topo (max-height 50vh), main fica
  abaixo, actions sempre visiveis (sem hover).

Logica preservada da NotificationsHistoryPage:
- load() do supabase ('notifications' eq owner_id, limit 500)
- markRead/markUnread/archive/unarchive/remove + sync notifStore
- markAllRead em batch
- handleRowClick: inbound_message abre conversationDrawer (paciente
  ou anonimo via from_number); outras com deeplink fazem
  router.push (e fecham a Melissa pra navegar pra rota Rail);
  todas marcam como lida automaticamente.

Wire-up MelissaLayout: import + render block + 'notificacoes'
literal em NON_CONFIG_SLUGS; removido de MELISSA_EMBED_KEYS. Entry
removido do EMBED_MAP no MelissaEmbed.

NotificationsHistoryPage continua intacta — segue funcionando no
layout Rail (/therapist/notifications, /admin/notificacoes).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Leonardo
2026-05-06 09:53:34 -03:00
parent ee084c2918
commit f9145442ae
3 changed files with 1327 additions and 13 deletions
+4 -9
View File
@@ -68,15 +68,10 @@ const EMBED_MAP = {
icon: 'pi pi-chart-bar',
comp: defineAsyncComponent(() => import('@/views/pages/therapist/RelatoriosPage.vue'))
},
'notificacoes': {
label: 'Notificações',
desc: 'Histórico de notificações enviadas (WhatsApp, e-mail, SMS).',
icon: 'pi pi-bell',
comp: defineAsyncComponent(() => import('@/views/pages/therapist/NotificationsHistoryPage.vue'))
},
// 'link-externo' foi promovido pra página nativa MelissaLinkExterno
// (eliminado o triplo header). Wire-up agora no MelissaLayout.vue,
// não passa mais por aqui.
// 'notificacoes' e 'link-externo' foram promovidos pra páginas nativas
// Melissa (MelissaNotificacoes / MelissaLinkExterno) — eliminado o
// triplo header que aparecia no embed. Wire-up agora no MelissaLayout.vue,
// não passam mais por aqui.
};
const info = computed(() => EMBED_MAP[props.secaoRota] || null);
+11 -4
View File
@@ -37,6 +37,7 @@ import MelissaEmbed from './MelissaEmbed.vue';
import MelissaCadastrosRecebidos from './MelissaCadastrosRecebidos.vue';
import MelissaAgendamentosRecebidos from './MelissaAgendamentosRecebidos.vue';
import MelissaLinkExterno from './MelissaLinkExterno.vue';
import MelissaNotificacoes from './MelissaNotificacoes.vue';
import MelissaMedicos from './MelissaMedicos.vue';
import MelissaEventoPanel from './MelissaEventoPanel.vue';
import { TOQUES, playToque } from './melissaToques';
@@ -175,9 +176,10 @@ const SECOES = {
};
// Set de keys que renderizam via MelissaEmbed (Onda 1 — pages 1-coluna).
// 'link-externo' foi promovido pra página nativa (MelissaLinkExterno) pra
// remover o triplo-header que aparecia no embed.
const MELISSA_EMBED_KEYS = ['financeiro', 'financeiro-lancamentos', 'documentos', 'documentos-templates', 'online-scheduling', 'relatorios', 'notificacoes'];
// 'link-externo' e 'notificacoes' foram promovidos pra páginas nativas
// (MelissaLinkExterno / MelissaNotificacoes) pra remover o triplo-header
// que aparecia no embed.
const MELISSA_EMBED_KEYS = ['financeiro', 'financeiro-lancamentos', 'documentos', 'documentos-templates', 'online-scheduling', 'relatorios'];
// Slugs reservados pra páginas dedicadas (não-config) — agenda, pacientes,
// conversas etc. + as MELISSA_EMBED_KEYS. Usado no isConfigRoute pra
@@ -185,7 +187,7 @@ const MELISSA_EMBED_KEYS = ['financeiro', 'financeiro-lancamentos', 'documentos'
const MELISSA_NON_CONFIG_SLUGS = new Set([
'agenda', 'pacientes', 'compromissos', 'recorrencias', 'conversas',
'tags', 'grupos', 'cadastros-recebidos', 'medicos', 'agendamentos-recebidos',
'link-externo',
'link-externo', 'notificacoes',
...MELISSA_EMBED_KEYS
]);
// Aliases "bonitos" + INLINE_KEYS reconhecidos pelo MelissaConfiguracoes.
@@ -2170,6 +2172,11 @@ function onKeydown(e) {
@close="fecharSecao"
/>
<MelissaNotificacoes
v-if="layoutReady && secaoAberta === 'notificacoes'"
@close="fecharSecao"
/>
<MelissaConfiguracoes
v-if="layoutReady && isMelissaConfigRoute(secaoAberta)"
:secao-rota="secaoAberta"
File diff suppressed because it is too large Load Diff