carousel, agenda arquivados, agenda cor, agenda arquivados, grupos pacientes, pacientes arquivados - desativados, sessoes verificadas, ajuste notificações, Prontuario, Agenda Animation, Menu Profile, bagdes Profile, Offline
This commit is contained in:
Leonardo
@@ -35,7 +35,7 @@
|
||||
'bg-indigo-500/10 text-[var(--primary-color,#6366f1)] font-bold': cell.day === selectedDay && !cell.isToday,
|
||||
'text-[var(--text-color,#1e293b)] hover:bg-[var(--surface-hover,#f1f5f9)]': !cell.isToday && !cell.isOther,
|
||||
}"
|
||||
@click="cell.day && (selectedDay = cell.day)"
|
||||
@click="cell.day && onCalDayClick($event, cell.day)"
|
||||
>
|
||||
<span>{{ cell.day }}</span>
|
||||
<span
|
||||
@@ -60,15 +60,17 @@
|
||||
<div
|
||||
v-for="ev in eventosDoDia"
|
||||
:key="ev.id"
|
||||
class="flex items-center gap-1.5 px-1.5 py-1.5 rounded-md bg-[var(--surface-ground,#f8fafc)] border-l-[3px]"
|
||||
class="flex items-center gap-1.5 px-1.5 py-1.5 rounded-md bg-[var(--surface-ground,#f8fafc)] border-l-[3px] cursor-pointer hover:bg-[var(--surface-hover,#f1f5f9)] transition-colors duration-100"
|
||||
:style="ev.bgColor ? { borderLeftColor: ev.bgColor } : {}"
|
||||
:class="{
|
||||
'border-l-sky-400': ev.tipo === 'reuniao',
|
||||
'border-l-green-400': ev.status === 'realizado',
|
||||
'border-l-[var(--primary-color,#6366f1)]': ev.tipo !== 'reuniao' && ev.status !== 'realizado',
|
||||
'border-l-sky-400': !ev.bgColor && ev.tipo === 'reuniao',
|
||||
'border-l-green-400': !ev.bgColor && ev.status === 'realizado',
|
||||
'border-l-[var(--primary-color,#6366f1)]': !ev.bgColor && ev.tipo !== 'reuniao' && ev.status !== 'realizado',
|
||||
}"
|
||||
@click="openEvMenu($event, ev)"
|
||||
>
|
||||
<div class="flex flex-col items-end min-w-[38px]">
|
||||
<span class="text-[1rem] font-bold text-[var(--text-color)]">{{ ev.hora }}</span>
|
||||
<span class="text-[0.7rem] font-bold text-[var(--text-color)]">{{ ev.hora }}</span>
|
||||
<span class="text-xs text-[var(--text-color-secondary)]">{{ ev.dur }}</span>
|
||||
</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
@@ -93,7 +95,7 @@
|
||||
<span class="ml-auto bg-[var(--primary-color,#6366f1)] text-white rounded-full px-1.5 text-xs font-bold">{{ recorrencias.length }}</span>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1.5 max-h-[170px] overflow-y-auto">
|
||||
<div v-for="r in recorrencias" :key="r.id" class="flex items-center gap-2 py-0.5">
|
||||
<div v-for="r in recorrencias" :key="r.id" class="flex items-center gap-2 py-0.5 cursor-pointer hover:bg-[var(--surface-hover,#f1f5f9)] rounded-md px-1 transition-colors duration-100" @click="openRecMenu($event, r)">
|
||||
<div class="w-[26px] h-[26px] rounded-full flex items-center justify-center text-[0.58rem] font-bold text-white flex-shrink-0" :style="{ background: r.color }">{{ r.initials }}</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<span class="block text-xs font-semibold">{{ r.nome }}</span>
|
||||
@@ -130,7 +132,7 @@
|
||||
</div>
|
||||
<div class="min-w-0">
|
||||
<div class="text-[1.1rem] font-bold tracking-tight text-[var(--text-color)]">{{ saudacao }} <span class="text-[var(--primary-color,#6366f1)]">👋</span></div>
|
||||
<div class="text-[1rem] text-[var(--text-color-secondary)] mt-0.5">{{ resumoHoje }}</div>
|
||||
<div class="text-[0.78rem] text-[var(--text-color-secondary)] mt-0.5">{{ resumoHoje }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Controles (desktop e mobile — mesmo conteúdo, sempre visível) -->
|
||||
@@ -163,7 +165,7 @@
|
||||
'text-[var(--text-color)]': !s.cls,
|
||||
}"
|
||||
>{{ s.value }}</div>
|
||||
<div class="text-[1rem] text-[var(--text-color-secondary)] opacity-75">{{ s.label }}</div>
|
||||
<div class="text-[0.7rem] text-[var(--text-color-secondary)] opacity-75">{{ s.label }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -204,11 +206,11 @@
|
||||
v-for="ev in timelineEvents"
|
||||
:key="ev.id"
|
||||
class="absolute top-[3px] h-[34px] rounded flex items-center px-1.5 overflow-hidden cursor-default min-w-[32px] hover:brightness-110 transition-[filter] duration-150 z-10"
|
||||
:style="ev.style"
|
||||
:style="{ ...ev.style, ...(ev.bgColor ? { backgroundColor: ev.bgColor, color: ev.txtColor || '#fff' } : {}) }"
|
||||
:class="{
|
||||
'bg-sky-400': ev.tipo === 'reuniao',
|
||||
'bg-green-500': ev.status === 'realizado',
|
||||
'bg-[var(--primary-color,#6366f1)]': ev.tipo !== 'reuniao' && ev.status !== 'realizado',
|
||||
'bg-sky-400': !ev.bgColor && ev.tipo === 'reuniao',
|
||||
'bg-green-500': !ev.bgColor && ev.status === 'realizado',
|
||||
'bg-[var(--primary-color,#6366f1)]': !ev.bgColor && ev.tipo !== 'reuniao' && ev.status !== 'realizado',
|
||||
}"
|
||||
:title="ev.tooltip"
|
||||
>
|
||||
@@ -235,7 +237,7 @@
|
||||
<div class="flex items-center gap-2.5 px-3.5 pt-3 pb-2 border-b border-[var(--surface-border,#f1f5f9)]">
|
||||
<div class="w-8 h-8 rounded-md flex items-center justify-center text-[0.9rem] flex-shrink-0 bg-red-500/10 text-red-500"><i class="pi pi-inbox" /></div>
|
||||
<div class="flex-1">
|
||||
<span class="block text-[1rem] font-bold text-[var(--text-color)]">Agendador Online</span>
|
||||
<span class="block text-[0.78rem] font-bold text-[var(--text-color)]">Agendador Online</span>
|
||||
<span class="block text-xs text-[var(--text-color-secondary)]">Solicitações do portal externo</span>
|
||||
</div>
|
||||
<span v-if="solicitacoesPendentes > 0" class="rounded-full px-1.5 py-px text-xs font-bold bg-red-50 text-red-500 border border-red-300">{{ solicitacoesPendentes }}</span>
|
||||
@@ -266,7 +268,7 @@
|
||||
<div class="flex items-center gap-2.5 px-3.5 pt-3 pb-2 border-b border-[var(--surface-border,#f1f5f9)]">
|
||||
<div class="w-8 h-8 rounded-md flex items-center justify-center text-[0.9rem] flex-shrink-0 bg-sky-500/10 text-sky-500"><i class="pi pi-user-plus" /></div>
|
||||
<div class="flex-1">
|
||||
<span class="block text-[1rem] font-bold text-[var(--text-color)]">Cadastros Externos</span>
|
||||
<span class="block text-[0.78rem] font-bold text-[var(--text-color)]">Cadastros Externos</span>
|
||||
<span class="block text-xs text-[var(--text-color-secondary)]">Pacientes aguardando triagem</span>
|
||||
</div>
|
||||
<span v-if="cadastrosPendentes > 0" class="rounded-full px-1.5 py-px text-xs font-bold bg-blue-50 text-blue-500 border border-blue-200">{{ cadastrosPendentes }}</span>
|
||||
@@ -275,7 +277,7 @@
|
||||
<div v-for="c in cadastros" :key="c.id" class="flex items-center gap-2">
|
||||
<div class="w-[26px] h-[26px] rounded-full bg-gradient-to-br from-sky-400 to-indigo-500 text-white text-[0.58rem] font-bold flex items-center justify-center flex-shrink-0">{{ c.initials }}</div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<span class="block text-[1rem] font-semibold">{{ c.nome }}</span>
|
||||
<span class="block text-[0.7rem] font-semibold">{{ c.nome }}</span>
|
||||
<span class="block text-xs text-[var(--text-color-secondary)]">{{ c.detalhe }}</span>
|
||||
</div>
|
||||
<button
|
||||
@@ -299,7 +301,7 @@
|
||||
<div class="flex items-center gap-2.5 px-3.5 pt-3 pb-2 border-b border-[var(--surface-border,#f1f5f9)]">
|
||||
<div class="w-8 h-8 rounded-md flex items-center justify-center text-[0.9rem] flex-shrink-0 bg-amber-500/10 text-amber-500"><i class="pi pi-refresh" /></div>
|
||||
<div class="flex-1">
|
||||
<span class="block text-[1rem] font-bold text-[var(--text-color)]">Recorrências</span>
|
||||
<span class="block text-[0.78rem] font-bold text-[var(--text-color)]">Recorrências</span>
|
||||
<span class="block text-xs text-[var(--text-color-secondary)]">Atenção necessária</span>
|
||||
</div>
|
||||
<span v-if="recAlerta.length" class="rounded-full px-1.5 py-px text-xs font-bold bg-amber-50 text-amber-500 border border-amber-200">{{ recAlerta.length }}</span>
|
||||
@@ -307,7 +309,7 @@
|
||||
<div class="flex-1 flex flex-col gap-1.5 px-3.5 py-1.5 min-h-[72px]">
|
||||
<div v-for="r in recAlerta" :key="r.id" class="flex items-center gap-2.5 py-1">
|
||||
<div class="flex-1">
|
||||
<span class="block text-[1rem] font-semibold">{{ r.nome }}</span>
|
||||
<span class="block text-[0.7rem] font-semibold">{{ r.nome }}</span>
|
||||
<span
|
||||
class="block text-xs font-semibold mt-0.5"
|
||||
:class="{
|
||||
@@ -342,7 +344,7 @@
|
||||
<div class="flex items-center gap-2.5 px-3.5 pt-3 pb-2 border-b border-[var(--surface-border,#f1f5f9)]">
|
||||
<div class="w-8 h-8 rounded-md flex items-center justify-center text-[0.9rem] flex-shrink-0 bg-indigo-500/10 text-indigo-500"><i class="pi pi-chart-pie" /></div>
|
||||
<div class="flex-1">
|
||||
<span class="block text-[1rem] font-bold text-[var(--text-color)]">Radar da Semana</span>
|
||||
<span class="block text-[0.78rem] font-bold text-[var(--text-color)]">Radar da Semana</span>
|
||||
<span class="block text-xs text-[var(--text-color-secondary)]">Presença, faltas e reposições</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -418,13 +420,49 @@
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<!-- Menus de contexto (fora do aside para evitar visibility:hidden) -->
|
||||
<Menu ref="calDayMenuRef" :model="calDayMenuItems" :popup="true" />
|
||||
<Menu ref="evMenuRef" :model="evMenuItems" :popup="true" />
|
||||
<Menu ref="recMenuRef" :model="recMenuItems" :popup="true" />
|
||||
|
||||
<!-- Dialog: Novo Compromisso (aberto pelo menu de contexto do mini calendário) -->
|
||||
<AgendaEventDialog
|
||||
v-if="agendaDialogOpen"
|
||||
v-model="agendaDialogOpen"
|
||||
:eventRow="agendaDialogEventRow"
|
||||
:initialStartISO="agendaDialogStartISO"
|
||||
:initialEndISO="agendaDialogEndISO"
|
||||
:ownerId="ownerId"
|
||||
:tenantId="clinicTenantId"
|
||||
:commitmentOptions="commitmentOptionsNormalized"
|
||||
newPatientRoute="/therapist/patients/cadastro"
|
||||
@save="onAgendaDialogSave"
|
||||
@delete="() => { agendaDialogOpen = false; load() }"
|
||||
/>
|
||||
|
||||
<!-- Dialog: Prontuário do paciente -->
|
||||
<PatientProntuario
|
||||
:key="selectedPatient?.id || 'none'"
|
||||
v-model="prontuarioOpen"
|
||||
:patient="selectedPatient"
|
||||
@close="closeProntuario"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useToast } from 'primevue/usetoast'
|
||||
import Menu from 'primevue/menu'
|
||||
import { supabase } from '@/lib/supabase/client'
|
||||
import { useTenantStore } from '@/stores/tenantStore'
|
||||
import { useAgendaEvents } from '@/features/agenda/composables/useAgendaEvents'
|
||||
import AgendaEventDialog from '@/features/agenda/components/AgendaEventDialog.vue'
|
||||
import { useDeterminedCommitments } from '@/features/agenda/composables/useDeterminedCommitments'
|
||||
import PatientProntuario from '@/features/patients/prontuario/PatientProntuario.vue'
|
||||
|
||||
const dashHeroSentinelRef = ref(null)
|
||||
const heroStuck = ref(false)
|
||||
@@ -449,6 +487,241 @@ const saudacao = computed(() => {
|
||||
})
|
||||
|
||||
const tenantStore = useTenantStore()
|
||||
const router = useRouter()
|
||||
const toast = useToast()
|
||||
const { create: createEvento, update: updateEvento } = useAgendaEvents()
|
||||
|
||||
// ── Prontuário ────────────────────────────────────────────────
|
||||
const prontuarioOpen = ref(false)
|
||||
const selectedPatient = ref(null)
|
||||
|
||||
function openProntuario (patientId, patientNome) {
|
||||
if (!patientId) return
|
||||
selectedPatient.value = { id: patientId, nome_completo: patientNome || '' }
|
||||
prontuarioOpen.value = true
|
||||
}
|
||||
function closeProntuario () { prontuarioOpen.value = false; selectedPatient.value = null }
|
||||
|
||||
// ── Tipos de compromisso (para o dialog) ─────────────────────
|
||||
const clinicTenantId = computed(() => tenantStore.activeTenantId || tenantStore.tenantId || null)
|
||||
const { rows: determinedCommitments, load: loadCommitments } = useDeterminedCommitments(clinicTenantId)
|
||||
|
||||
const COMMITMENT_PRIORITY = new Map([
|
||||
['session', 0], ['class', 1], ['study', 2],
|
||||
['reading', 3], ['supervision', 4], ['content_creation', 5],
|
||||
])
|
||||
|
||||
const commitmentOptionsNormalized = computed(() => {
|
||||
const list = Array.isArray(determinedCommitments.value) ? determinedCommitments.value : []
|
||||
return [...list]
|
||||
.filter(i => i?.id && i?.active !== false)
|
||||
.sort((a, b) => {
|
||||
const pa = COMMITMENT_PRIORITY.get(a.native_key) ?? 99
|
||||
const pb = COMMITMENT_PRIORITY.get(b.native_key) ?? 99
|
||||
if (pa !== pb) return pa - pb
|
||||
return String(a.name || '').localeCompare(String(b.name || ''), 'pt-BR')
|
||||
})
|
||||
.map(i => ({
|
||||
id: i.id,
|
||||
tenant_id: i.tenant_id ?? null,
|
||||
created_by: i.created_by ?? null,
|
||||
name: String(i.name || '').trim() || 'Sem nome',
|
||||
description: i.description || '',
|
||||
native_key: i.native_key || null,
|
||||
is_native: !!i.is_native,
|
||||
is_locked: !!i.is_locked,
|
||||
active: i.active !== false,
|
||||
bg_color: i.bg_color || null,
|
||||
text_color: i.text_color || null,
|
||||
fields: Array.isArray(i.determined_commitment_fields)
|
||||
? [...i.determined_commitment_fields].sort((a, b) => (a.sort_order ?? 0) - (b.sort_order ?? 0))
|
||||
: [],
|
||||
}))
|
||||
})
|
||||
|
||||
// ── Mini calendário: menu de contexto ────────────────────────
|
||||
const calDayMenuRef = ref(null)
|
||||
|
||||
const calDayMenuItems = computed(() => [
|
||||
{
|
||||
label: 'Opções do dia',
|
||||
items: [
|
||||
{
|
||||
label: 'Novo Compromisso',
|
||||
icon: 'pi pi-plus-circle',
|
||||
command: () => openNovoCompromisso(),
|
||||
},
|
||||
{
|
||||
label: 'Ver dia na agenda',
|
||||
icon: 'pi pi-calendar',
|
||||
command: () => verDiaNaAgenda(),
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
function onCalDayClick (event, day) {
|
||||
selectedDay.value = day
|
||||
calDayMenuRef.value?.toggle(event)
|
||||
}
|
||||
|
||||
function verDiaNaAgenda () {
|
||||
const d = String(selectedDay.value).padStart(2, '0')
|
||||
const m = String(mesAtual + 1).padStart(2, '0')
|
||||
router.push(`/therapist/agenda?date=${anoAtual}-${m}-${d}`)
|
||||
}
|
||||
|
||||
// ── Menu de contexto: Eventos do dia ─────────────────────────
|
||||
const evMenuRef = ref(null)
|
||||
const _evAtivo = ref(null) // evento clicado
|
||||
|
||||
const evMenuItems = computed(() => [
|
||||
{
|
||||
label: 'Opções',
|
||||
items: [
|
||||
{
|
||||
label: 'Ver prontuário',
|
||||
icon: 'pi pi-file-edit',
|
||||
disabled: !_evAtivo.value?.patientId,
|
||||
command: () => openProntuario(_evAtivo.value?.patientId, _evAtivo.value?.nome),
|
||||
},
|
||||
{
|
||||
label: 'Ver na agenda',
|
||||
icon: 'pi pi-calendar',
|
||||
command: () => {
|
||||
if (!_evAtivo.value?.inicioISO) return
|
||||
const d = new Date(_evAtivo.value.inicioISO)
|
||||
const ds = d.toISOString().slice(0, 10)
|
||||
router.push(`/therapist/agenda?date=${ds}`)
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
function openEvMenu (event, ev) {
|
||||
_evAtivo.value = ev
|
||||
evMenuRef.value?.toggle(event)
|
||||
}
|
||||
|
||||
// ── Menu de contexto: Recorrências ativas ────────────────────
|
||||
const recMenuRef = ref(null)
|
||||
const _recAtivo = ref(null) // recorrência clicada
|
||||
|
||||
const recMenuItems = computed(() => [
|
||||
{
|
||||
label: 'Opções',
|
||||
items: [
|
||||
{
|
||||
label: 'Ver prontuário',
|
||||
icon: 'pi pi-file-edit',
|
||||
disabled: !_recAtivo.value?.patientId,
|
||||
command: () => openProntuario(_recAtivo.value?.patientId, _recAtivo.value?.nome),
|
||||
},
|
||||
{
|
||||
label: 'Ver na agenda',
|
||||
icon: 'pi pi-calendar',
|
||||
command: () => router.push('/therapist/agenda'),
|
||||
},
|
||||
],
|
||||
},
|
||||
])
|
||||
|
||||
function openRecMenu (event, r) {
|
||||
_recAtivo.value = r
|
||||
recMenuRef.value?.toggle(event)
|
||||
}
|
||||
|
||||
// ── Dialog: Novo Compromisso ──────────────────────────────────
|
||||
const agendaDialogOpen = ref(false)
|
||||
const agendaDialogEventRow = ref(null)
|
||||
const agendaDialogStartISO = ref('')
|
||||
const agendaDialogEndISO = ref('')
|
||||
|
||||
function openNovoCompromisso () {
|
||||
if (!ownerId.value) return
|
||||
const durMin = 50
|
||||
const now = new Date()
|
||||
const base = new Date(anoAtual, mesAtual, selectedDay.value, now.getHours(), now.getMinutes(), 0, 0)
|
||||
|
||||
agendaDialogEventRow.value = {
|
||||
owner_id: ownerId.value,
|
||||
tipo: 'sessao',
|
||||
status: 'agendado',
|
||||
titulo: null,
|
||||
observacoes: null,
|
||||
}
|
||||
agendaDialogStartISO.value = base.toISOString()
|
||||
agendaDialogEndISO.value = new Date(base.getTime() + durMin * 60000).toISOString()
|
||||
agendaDialogOpen.value = true
|
||||
}
|
||||
|
||||
function _isUuid (v) {
|
||||
return /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i.test(String(v || ''))
|
||||
}
|
||||
|
||||
function _pickDbFields (obj) {
|
||||
const allowed = [
|
||||
'tenant_id', 'owner_id', 'terapeuta_id', 'patient_id',
|
||||
'tipo', 'status', 'titulo', 'observacoes',
|
||||
'inicio_em', 'fim_em', 'visibility_scope',
|
||||
'determined_commitment_id', 'titulo_custom', 'extra_fields',
|
||||
'recurrence_id', 'recurrence_date',
|
||||
'price', 'insurance_plan_id', 'insurance_guide_number',
|
||||
'insurance_value', 'insurance_plan_service_id',
|
||||
]
|
||||
const out = {}
|
||||
for (const k of allowed) { if (obj[k] !== undefined) out[k] = obj[k] }
|
||||
return out
|
||||
}
|
||||
|
||||
async function onAgendaDialogSave (arg) {
|
||||
try {
|
||||
const isWrapped = !!arg && typeof arg === 'object' && Object.prototype.hasOwnProperty.call(arg, 'payload')
|
||||
const payload = isWrapped ? arg.payload : arg
|
||||
const id = isWrapped ? (arg.id ?? null) : (arg?.id ?? null)
|
||||
|
||||
const normalized = { ...(payload || {}) }
|
||||
|
||||
if (!normalized.owner_id && ownerId.value) normalized.owner_id = ownerId.value
|
||||
|
||||
const tid = clinicTenantId.value
|
||||
if (!tid) throw new Error('tenant_id não encontrado.')
|
||||
normalized.tenant_id = tid
|
||||
|
||||
if (!normalized.visibility_scope) normalized.visibility_scope = 'public'
|
||||
if (!normalized.status) normalized.status = 'agendado'
|
||||
if (!normalized.tipo) normalized.tipo = 'sessao'
|
||||
if (!String(normalized.titulo || '').trim()) normalized.titulo = normalized.tipo === 'bloqueio' ? 'Ocupado' : 'Sessão'
|
||||
if (!_isUuid(normalized.paciente_id)) normalized.paciente_id = null
|
||||
if (normalized.determined_commitment_id && !_isUuid(normalized.determined_commitment_id)) normalized.determined_commitment_id = null
|
||||
|
||||
const dbPayload = _pickDbFields(normalized)
|
||||
|
||||
if (id) {
|
||||
await updateEvento(id, dbPayload)
|
||||
toast.add({ severity: 'success', summary: 'Salvo', detail: 'Compromisso atualizado.', life: 2500 })
|
||||
} else {
|
||||
await createEvento(dbPayload)
|
||||
toast.add({ severity: 'success', summary: 'Criado', detail: 'Compromisso criado com sucesso.', life: 2500 })
|
||||
}
|
||||
|
||||
agendaDialogOpen.value = false
|
||||
await load()
|
||||
|
||||
} catch (e) {
|
||||
const msg = String(e?.message || '')
|
||||
const isOverlap =
|
||||
e?.code === '23P01' ||
|
||||
msg.includes('agenda_eventos_sem_sobreposicao') ||
|
||||
msg.includes('exclusion constraint')
|
||||
if (isOverlap) {
|
||||
toast.add({ severity: 'warn', summary: 'Conflito de horário', detail: 'Já existe um compromisso neste horário.', life: 4000 })
|
||||
} else {
|
||||
toast.add({ severity: 'error', summary: 'Erro ao salvar', detail: msg || 'Tente novamente.', life: 4000 })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const ownerId = ref(null)
|
||||
const eventosDoMes = ref([])
|
||||
@@ -506,18 +779,33 @@ const STATUS_ICON = {
|
||||
agendado: 'pi pi-clock',
|
||||
}
|
||||
|
||||
const commitmentColorMap = computed(() =>
|
||||
new Map(
|
||||
commitmentOptionsNormalized.value
|
||||
.filter(c => c.id && c.bg_color)
|
||||
.map(c => [c.id, { bg_color: c.bg_color, text_color: c.text_color }])
|
||||
)
|
||||
)
|
||||
|
||||
function buildEventoItem (ev) {
|
||||
const inicio = new Date(ev.inicio_em)
|
||||
const fim = ev.fim_em ? new Date(ev.fim_em) : null
|
||||
const durMin = fim ? Math.round((fim - inicio) / 60000) : 50
|
||||
const h = inicio.getHours().toString().padStart(2, '0')
|
||||
const m = inicio.getMinutes().toString().padStart(2, '0')
|
||||
const joinColor = ev.determined_commitments
|
||||
const mapColor = ev.determined_commitment_id ? commitmentColorMap.value.get(ev.determined_commitment_id) : null
|
||||
const bgColor = joinColor?.bg_color ? `#${joinColor.bg_color}` : mapColor?.bg_color ? `#${mapColor.bg_color}` : null
|
||||
const txtColor = joinColor?.text_color ? `#${joinColor.text_color}` : mapColor?.text_color ? `#${mapColor.text_color}` : null
|
||||
return {
|
||||
id: ev.id, hora: `${h}:${m}`, dur: `${durMin}min`,
|
||||
nome: ev.patients?.nome_completo || ev.titulo || ev.titulo_custom || '—',
|
||||
modalidade: ev.modalidade || 'Presencial', recorrente: !!ev.recurrence_id,
|
||||
status: ev.status || 'agendado', statusIcon: STATUS_ICON[ev.status] || 'pi pi-clock',
|
||||
tipo: ev.tipo || 'sessao',
|
||||
patientId: ev.patient_id || null,
|
||||
inicioISO: ev.inicio_em || null,
|
||||
bgColor, txtColor,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -576,40 +864,62 @@ const recorrencias = computed(() =>
|
||||
const diaLabel = weekdays.map(d => DIAS_PT[d]).join(', ')
|
||||
const hora = r.start_time ? String(r.start_time).slice(0, 5) : ''
|
||||
const proxLabel = nextOccurrenceLabel(r)
|
||||
return { id: r.id, nome: nomeAb, freq: `${freq} · ${diaLabel}${hora ? ' ' + hora : ''}`, proxLabel, proxHoje: proxLabel === 'Hoje', color: hashColor(r.patient_id || r.id), initials: initials(nome) }
|
||||
return { id: r.id, nome: nomeAb, freq: `${freq} · ${diaLabel}${hora ? ' ' + hora : ''}`, proxLabel, proxHoje: proxLabel === 'Hoje', color: hashColor(r.patient_id || r.id), initials: initials(nome), patientId: r.patient_id || null }
|
||||
})
|
||||
)
|
||||
|
||||
const eventosHoje = computed(() =>
|
||||
eventosDoMes.value.filter(ev => { if (!ev.inicio_em) return false; const d = new Date(ev.inicio_em); return d.getDate() === hoje && d.getMonth() === mesAtual && d.getFullYear() === anoAtual })
|
||||
)
|
||||
// ── Derivados de eventosDoMes — single pass ───────────────────
|
||||
// Um único computed varre o array uma vez e extrai tudo,
|
||||
// evitando N loops separados que re-executam a cada reatividade.
|
||||
const _statsDoMes = computed(() => {
|
||||
const now = agora.value
|
||||
const semIni = new Date(now); semIni.setDate(now.getDate() - now.getDay()); semIni.setHours(0, 0, 0, 0)
|
||||
const semFim = new Date(semIni); semFim.setDate(semIni.getDate() + 6); semFim.setHours(23, 59, 59, 999)
|
||||
const daqui30 = new Date(now); daqui30.setDate(now.getDate() + 30)
|
||||
|
||||
const eventosSemana = computed(() => {
|
||||
const now = agora.value, ini = new Date(now)
|
||||
ini.setDate(now.getDate() - now.getDay()); ini.setHours(0, 0, 0, 0)
|
||||
const fim = new Date(ini); fim.setDate(ini.getDate() + 6); fim.setHours(23, 59, 59, 999)
|
||||
return eventosDoMes.value.filter(ev => { if (!ev.inicio_em) return false; const d = new Date(ev.inicio_em); return d >= ini && d <= fim })
|
||||
let hojeCnt = 0, semanaCnt = 0, realizadosCnt = 0, encerradosCnt = 0
|
||||
const hojeLista = [], timelineLista = []
|
||||
const diasSemanaMap = [[], [], [], [], [], [], []]
|
||||
|
||||
for (const ev of eventosDoMes.value) {
|
||||
if (!ev.inicio_em) continue
|
||||
const d = new Date(ev.inicio_em)
|
||||
const dDay = d.getDate(), dMon = d.getMonth(), dYear = d.getFullYear()
|
||||
const isHoje = dDay === hoje && dMon === mesAtual && dYear === anoAtual
|
||||
|
||||
if (isHoje) { hojeCnt++; hojeLista.push(ev); timelineLista.push(ev) }
|
||||
if (d >= semIni && d <= semFim) {
|
||||
semanaCnt++
|
||||
diasSemanaMap[d.getDay()].push(ev)
|
||||
}
|
||||
if (d < now && ['realizado','faltou','cancelado'].includes(ev.status)) {
|
||||
encerradosCnt++
|
||||
if (ev.status === 'realizado') realizadosCnt++
|
||||
}
|
||||
}
|
||||
|
||||
const taxaPresenca = encerradosCnt > 0 ? Math.round((realizadosCnt / encerradosCnt) * 100) : null
|
||||
|
||||
return { hojeCnt, semanaCnt, taxaPresenca, hojeLista, timelineLista, diasSemanaMap }
|
||||
})
|
||||
|
||||
const taxaPresenca = computed(() => {
|
||||
const encerrados = eventosDoMes.value.filter(ev => ev.inicio_em && new Date(ev.inicio_em) < new Date() && ['realizado','faltou','cancelado'].includes(ev.status))
|
||||
if (!encerrados.length) return null
|
||||
return Math.round((encerrados.filter(ev => ev.status === 'realizado').length / encerrados.length) * 100)
|
||||
})
|
||||
const eventosHoje = computed(() => _statsDoMes.value.hojeLista)
|
||||
const eventosSemana = computed(() => ({ length: _statsDoMes.value.semanaCnt }))
|
||||
const taxaPresenca = computed(() => _statsDoMes.value.taxaPresenca)
|
||||
|
||||
const quickStats = computed(() => {
|
||||
const pendentes = _solicitacoesBruto.value.length + _cadastrosBruto.value.length
|
||||
const pct = taxaPresenca.value
|
||||
return [
|
||||
{ value: String(eventosHoje.value.length), label: 'Hoje', cls: '' },
|
||||
{ value: String(pendentes), label: 'Pendentes', cls: pendentes > 0 ? 'qs-urgente' : '' },
|
||||
{ value: String(eventosSemana.value.length), label: 'Semana', cls: '' },
|
||||
{ value: pct !== null ? `${pct}%` : '—', label: 'Presença', cls: pct !== null && pct >= 85 ? 'qs-ok' : '' },
|
||||
{ value: String(_statsDoMes.value.hojeCnt), label: 'Hoje', cls: '' },
|
||||
{ value: String(pendentes), label: 'Pendentes', cls: pendentes > 0 ? 'qs-urgente' : '' },
|
||||
{ value: String(_statsDoMes.value.semanaCnt), label: 'Semana', cls: '' },
|
||||
{ value: pct !== null ? `${pct}%` : '—', label: 'Presença', cls: pct !== null && pct >= 85 ? 'qs-ok' : '' },
|
||||
]
|
||||
})
|
||||
|
||||
const resumoHoje = computed(() => {
|
||||
const sessoes = eventosHoje.value.filter(ev => ev.tipo !== 'bloqueio').length
|
||||
const sessoes = _statsDoMes.value.hojeLista.filter(ev => ev.tipo !== 'bloqueio').length
|
||||
const sols = _solicitacoesBruto.value.length
|
||||
const parts = []
|
||||
if (sessoes === 1) parts.push('1 sessão hoje')
|
||||
@@ -648,11 +958,11 @@ const cadastros = computed(() =>
|
||||
const cadastrosPendentes = computed(() => cadastros.value.length)
|
||||
|
||||
const recAlerta = computed(() => {
|
||||
const daqui30 = new Date(); daqui30.setDate(daqui30.getDate() + 30)
|
||||
const now = new Date(), daqui30 = new Date(); daqui30.setDate(now.getDate() + 30)
|
||||
const alerts = []
|
||||
for (const r of regraRecorrencias.value) {
|
||||
const nome = (r._patientNome || '—').split(' ').slice(0, 2).join(' ')
|
||||
if (r.end_date) { const ed = new Date(r.end_date + 'T00:00:00'); if (ed >= new Date() && ed <= daqui30) alerts.push({ id: r.id + '_end', nome, motivo: 'Encerramento próximo', tipo: 'feriado' }) }
|
||||
if (r.end_date) { const ed = new Date(r.end_date + 'T00:00:00'); if (ed >= now && ed <= daqui30) alerts.push({ id: r.id + '_end', nome, motivo: 'Encerramento próximo', tipo: 'feriado' }) }
|
||||
if (r.max_occurrences && r._sessionsCount !== undefined) {
|
||||
const pct = (r._sessionsCount / r.max_occurrences) * 100
|
||||
if (pct > 75) alerts.push({ id: r.id + '_limit', nome, motivo: 'Limite próximo', tipo: 'limite', sessoesUsadas: r._sessionsCount, totalSessoes: r.max_occurrences, progresso: Math.round(pct) })
|
||||
@@ -662,12 +972,14 @@ const recAlerta = computed(() => {
|
||||
})
|
||||
|
||||
const radarSemana = computed(() => {
|
||||
const now = agora.value, dow = now.getDay(), iniSem = new Date(now)
|
||||
iniSem.setDate(now.getDate() - dow); iniSem.setHours(0, 0, 0, 0)
|
||||
const diasMap = _statsDoMes.value.diasSemanaMap
|
||||
const dow = agora.value.getDay()
|
||||
return DIAS_PT.map((dia, i) => {
|
||||
const dayDate = new Date(iniSem); dayDate.setDate(iniSem.getDate() + i)
|
||||
const evs = eventosDoMes.value.filter(ev => { if (!ev.inicio_em) return false; const d = new Date(ev.inicio_em); return d.getDate() === dayDate.getDate() && d.getMonth() === dayDate.getMonth() && d.getFullYear() === dayDate.getFullYear() })
|
||||
const total = evs.length, presentes = evs.filter(ev => ev.status === 'realizado').length, faltas = evs.filter(ev => ev.status === 'faltou').length, reposicao = evs.filter(ev => ['reposicao','reposição'].includes(ev.status)).length
|
||||
const evs = diasMap[i]
|
||||
const total = evs.length
|
||||
const presentes = evs.filter(ev => ev.status === 'realizado').length
|
||||
const faltas = evs.filter(ev => ev.status === 'faltou').length
|
||||
const reposicao = evs.filter(ev => ['reposicao','reposição'].includes(ev.status)).length
|
||||
let status = 'ok'
|
||||
if (faltas > 0 && faltas >= presentes) status = 'falta'
|
||||
else if (reposicao > 0 && reposicao > presentes) status = 'repo'
|
||||
@@ -691,15 +1003,16 @@ const hoursRange = [7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
|
||||
const TL_START = 7, TL_END = 20, TL_SPAN = TL_END - TL_START
|
||||
function toPercent (h, m) { return ((h + m / 60 - TL_START) / TL_SPAN) * 100 }
|
||||
|
||||
|
||||
const timelineEvents = computed(() =>
|
||||
eventosDoMes.value
|
||||
.filter(ev => { if (!ev.inicio_em) return false; const d = new Date(ev.inicio_em); return d.getDate() === hoje && d.getMonth() === mesAtual && d.getFullYear() === anoAtual })
|
||||
_statsDoMes.value.timelineLista
|
||||
.slice()
|
||||
.sort((a, b) => new Date(a.inicio_em) - new Date(b.inicio_em))
|
||||
.map(ev => {
|
||||
const item = buildEventoItem(ev)
|
||||
const [hh, mm] = item.hora.split(':').map(Number)
|
||||
const durMin = parseInt(item.dur) || 50
|
||||
return { id: item.id, label: item.nome.split(' ')[0], tipo: item.tipo, status: item.status, tooltip: `${item.hora} · ${item.nome} · ${item.modalidade}`, badge: item.modalidade?.toLowerCase() === 'online' ? '📱' : '', style: { left: toPercent(hh, mm) + '%', width: Math.max((durMin / 60 / TL_SPAN) * 100, 4) + '%' } }
|
||||
return { id: item.id, label: item.nome.split(' ')[0], tipo: item.tipo, status: item.status, tooltip: `${item.hora} · ${item.nome} · ${item.modalidade}`, badge: item.modalidade?.toLowerCase() === 'online' ? '📱' : '', bgColor: item.bgColor, txtColor: item.txtColor, style: { left: toPercent(hh, mm) + '%', width: Math.max((durMin / 60 / TL_SPAN) * 100, 4) + '%' } }
|
||||
})
|
||||
)
|
||||
|
||||
@@ -714,11 +1027,12 @@ async function load () {
|
||||
if (!ownerId.value) return
|
||||
await tenantStore.ensureLoaded()
|
||||
const tid = tenantStore.activeTenantId || tenantStore.tenantId || null
|
||||
await loadCommitments()
|
||||
const mesInicio = new Date(anoAtual, mesAtual, 1, 0, 0, 0, 0).toISOString()
|
||||
const mesFim = new Date(anoAtual, mesAtual + 1, 0, 23, 59, 59, 999).toISOString()
|
||||
try {
|
||||
const [eventosRes, recRes, solRes, cadRes] = await Promise.all([
|
||||
(() => { let q = supabase.from('agenda_eventos').select('id, inicio_em, fim_em, status, modalidade, tipo, titulo, titulo_custom, patient_id, recurrence_id, patients(nome_completo)').eq('owner_id', ownerId.value).gte('inicio_em', mesInicio).lte('inicio_em', mesFim).order('inicio_em', { ascending: true }); if (tid) q = q.eq('tenant_id', tid); return q })(),
|
||||
(() => { let q = supabase.from('agenda_eventos').select('id, inicio_em, fim_em, status, modalidade, tipo, titulo, titulo_custom, patient_id, recurrence_id, determined_commitment_id, patients(nome_completo), determined_commitments(bg_color, text_color)').eq('owner_id', ownerId.value).gte('inicio_em', mesInicio).lte('inicio_em', mesFim).order('inicio_em', { ascending: true }); if (tid) q = q.eq('tenant_id', tid); return q })(),
|
||||
(() => { let q = supabase.from('recurrence_rules').select('id, patient_id, type, interval, weekdays, start_date, end_date, max_occurrences, start_time').eq('owner_id', ownerId.value).eq('status', 'ativo').order('start_date', { ascending: false }); if (tid) q = q.eq('tenant_id', tid); return q })(),
|
||||
supabase.from('agendador_solicitacoes').select('id, paciente_nome, paciente_sobrenome, tipo, modalidade, data_solicitada, hora_solicitada').eq('owner_id', ownerId.value).eq('status', 'pendente').order('created_at', { ascending: false }).limit(10),
|
||||
supabase.from('patient_intake_requests').select('id, nome_completo, status, created_at').eq('owner_id', ownerId.value).eq('status', 'new').order('created_at', { ascending: false }).limit(10),
|
||||
@@ -780,15 +1094,4 @@ onMounted(async () => {
|
||||
0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.4); }
|
||||
50% { box-shadow: 0 0 0 4px rgba(239,68,68,0); }
|
||||
}
|
||||
|
||||
/* Highlight pulse (acionado externamente via classe JS) */
|
||||
@keyframes highlight-pulse {
|
||||
0% { box-shadow: 0 0 0 0 rgba(99,102,241,0.7), 0 0 0 0 rgba(99,102,241,0.4); }
|
||||
40% { box-shadow: 0 0 0 8px rgba(99,102,241,0.3), 0 0 0 16px rgba(99,102,241,0.1); }
|
||||
100% { box-shadow: 0 0 0 0 rgba(99,102,241,0), 0 0 0 0 rgba(99,102,241,0); }
|
||||
}
|
||||
.notif-card--highlight {
|
||||
animation: highlight-pulse 1s ease-out 3;
|
||||
border-color: rgba(99,102,241,0.6) !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user