Copyright, Financeiro, Lançamentos, aprimoramentos de ui

src/features/agenda/pages/AgendaClinicaPage.vue

@@ -1,6 +1,20 @@
-<!-- src/views/pages/agenda/AgendaClinicaPage.vue -->
+<!--
+|--------------------------------------------------------------------------
+| Agência PSI
+|--------------------------------------------------------------------------
+| Criado e desenvolvido por Leonardo Nohama
+|
+| Tecnologia aplicada à escuta.
+| Estrutura para o cuidado.
+|
+| Arquivo: src/features/agenda/pages/AgendaClinicaPage.vue
+| Data: 2026
+| Local: São Carlos/SP — Brasil
+|--------------------------------------------------------------------------
+| © 2026 — Todos os direitos reservados
+|--------------------------------------------------------------------------
+-->
 <template>
-  <Toast />
   <ConfirmDialog />
 
   <!-- Sentinel -->
@@ -107,7 +121,7 @@
             :slotMinTime="slotMinTime"
             :slotMaxTime="slotMaxTime"
             :slotDuration="slotDuration"
-            :slotMinHeight="14"
+
             :expandRows="false"
             :businessHours="businessHours"
             :staff="staffCols"
@@ -192,7 +206,7 @@
           </div>
         </div>
 
-        <Calendar
+        <DatePicker
           v-model="miniDate"
           inline
           class="ag-mini-cal"
@@ -203,7 +217,7 @@
             <span class="mini-day-num">{{ date.day }}</span>
             <span v-if="hasMiniEvent(date)" class="mini-day-dot" />
           </template>
-        </Calendar>
+        </DatePicker>
       </div>
 
       <ProximosFeriadosCard
@@ -346,7 +360,7 @@
   <!-- Month Picker -->
   <Dialog v-model:visible="monthPickerVisible" modal header="Escolher mês" :style="{ width: '420px' }">
     <div class="p-2">
-      <Calendar
+      <DatePicker
         v-model="monthPickerDate"
         view="month"
         dateFormat="mm/yy"
@@ -499,7 +513,7 @@ import { useRouter, useRoute } from 'vue-router'
 import { useToast } from 'primevue/usetoast'
 import { useConfirm } from 'primevue/useconfirm'
 
-import Calendar from 'primevue/calendar'
+import DatePicker from 'primevue/datepicker'
 
 import AgendaClinicMosaic from '@/features/agenda/components/AgendaClinicMosaic.vue'
 import AgendaEventDialog from '@/features/agenda/components/AgendaEventDialog.vue'
@@ -621,9 +635,10 @@ const onlySessionsOptions = [
   { label: 'Tudo', value: false }
 ]
 const viewOptions = [
-  { label: 'Dia', value: 'day' },
-  { label: 'Semana', value: 'week' },
-  { label: 'Mês', value: 'month' }
+  { label: 'Dia',    value: 'day'   },
+  { label: 'Semana', value: 'week'  },
+  { label: 'Mês',    value: 'month' },
+  { label: 'Lista',  value: 'list'  }
 ]
 const timeModeOptions = [
   { label: '24h', value: '24' },
@@ -2172,12 +2187,41 @@ const workDowSet = computed(() =>
   new Set(workRules.value.filter(r => r.ativo).map(r => Number(r.dia_semana)))
 )
 
+// ── Mini calendário: set de dias da semana atual ─────────────
+const currentWeekIsoSet = computed(() => {
+  const now = new Date()
+  const monday = new Date(now)
+  monday.setDate(now.getDate() - ((now.getDay() + 6) % 7))
+  monday.setHours(0, 0, 0, 0)
+  const set = new Set()
+  for (let i = 0; i < 7; i++) {
+    const d = new Date(monday)
+    d.setDate(monday.getDate() + i)
+    set.add(`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`)
+  }
+  return set
+})
+
+const todayISO = computed(() => {
+  const n = new Date()
+  return `${n.getFullYear()}-${String(n.getMonth()+1).padStart(2,'0')}-${String(n.getDate()).padStart(2,'0')}`
+})
+
 // ── Mini calendário: classes por dia ──────────────────────────
 function miniDayClass (date) {
   const iso = `${date.year}-${String(date.month + 1).padStart(2,'0')}-${String(date.day).padStart(2,'0')}`
-  if (miniBlockedDaySet.value.has(iso)) return 'mini-day-blocked'
   const dow = new Date(date.year, date.month, date.day).getDay()
-  return workDowSet.value.has(dow) ? 'mini-day-work' : 'mini-day-off'
+  const classes = []
+  if (currentWeekIsoSet.value.has(iso)) {
+    classes.push('mini-week-hl')
+    if (dow === 1)      classes.push('mini-week-hl--start')
+    else if (dow === 0) classes.push('mini-week-hl--end')
+    else                classes.push('mini-week-hl--mid')
+  }
+  if (iso === todayISO.value) classes.push('mini-day-today')
+  if (miniBlockedDaySet.value.has(iso)) classes.push('mini-day-blocked')
+  else classes.push(workDowSet.value.has(dow) ? 'mini-day-work' : 'mini-day-off')
+  return classes
 }
 
 // ── Mini calendário: bolinhas + bloqueios de dia inteiro ──────
@@ -2519,12 +2563,28 @@ function goRecorrencias () { router.push({ name: 'admin-agenda-recorrencias' })
   width: 100%; min-width: unset; border-radius: 6px;
   position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 1;
 }
+:deep(.p-disabled.mini-day-work) { background: color-mix(in srgb, #9ca3af 18%, transparent) !important; opacity: 0.6; }
 .mini-day-num { display: block; text-align: center; line-height: 1; }
 .mini-day-dot {
   position: absolute; bottom: 2px; right: 2px;
   width: 4px; height: 4px; border-radius: 50%;
   background: var(--primary-color, #6366f1);
 }
+
+/* Semana atual — faixa de fundo contínua seg→dom */
+:deep(.mini-week-hl)        { background: color-mix(in srgb, var(--primary-color, #6366f1) 12%, transparent) !important; border-radius: 0 !important; }
+:deep(.mini-week-hl--start) { border-radius: 6px 0 0 6px !important; }
+:deep(.mini-week-hl--end)   { border-radius: 0 6px 6px 0 !important; }
+
+/* Hoje — cartão com borda + sombra */
+:deep(.mini-day-today) {
+  background: color-mix(in srgb, var(--primary-color, #6366f1) 80%, #00000000) !important;
+  border: 1px solid var(--surface-border) !important;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
+  border-radius: 6px !important;
+  color: #ffffff !important;
+  font-weight: 600 !important;
+}
 </style>
 
 <style>