Copyright, Financeiro, Lançamentos, aprimoramentos de ui

src/layout/configuracoes/ConfiguracoesDescontosPage.vue

@@ -1,4 +1,19 @@
-<!-- src/layout/configuracoes/ConfiguracoesDescontosPage.vue -->
+<!--
+|--------------------------------------------------------------------------
+| Agência PSI
+|--------------------------------------------------------------------------
+| Criado e desenvolvido por Leonardo Nohama
+|
+| Tecnologia aplicada à escuta.
+| Estrutura para o cuidado.
+|
+| Arquivo: src/layout/configuracoes/ConfiguracoesDescontosPage.vue
+| Data: 2026
+| Local: São Carlos/SP — Brasil
+|--------------------------------------------------------------------------
+| © 2026 — Todos os direitos reservados
+|--------------------------------------------------------------------------
+-->
 <script setup>
 import { ref, computed, onMounted } from 'vue'
 import { supabase } from '@/lib/supabase/client'
@@ -182,7 +197,6 @@ onMounted(async () => {
 </script>
 
 <template>
-  <Toast />
 
   <div class="flex flex-col gap-3">
 
@@ -198,10 +212,23 @@ onMounted(async () => {
       </div>
     </div>
 
-    <!-- Loading -->
-    <div v-if="pageLoading || loading" class="flex justify-center py-10">
-      <ProgressSpinner style="width:40px;height:40px" />
-    </div>
+    <!-- ══ SKELETON ══════════════════════════════════════════════ -->
+    <template v-if="pageLoading || loading">
+      <div class="cfg-wrap">
+        <div class="cfg-wrap__head">
+          <Skeleton width="1.75rem" height="1.75rem" border-radius="6px" />
+          <Skeleton width="11rem" height="12px" />
+        </div>
+        <div v-for="n in 3" :key="n" class="flex items-center gap-3 px-4 py-3 border-b border-[var(--surface-border)] last:border-b-0">
+          <div class="flex flex-col gap-2 flex-1">
+            <Skeleton :width="n % 2 === 0 ? '14rem' : '10rem'" height="11px" />
+            <Skeleton width="8rem" height="10px" />
+          </div>
+          <Skeleton width="4rem" height="1.4rem" border-radius="999px" />
+        </div>
+      </div>
+      <AppLoadingPhrases action="Carregando descontos por paciente..." containerClass="py-6" />
+    </template>
 
     <template v-else>
 
@@ -352,6 +379,8 @@ onMounted(async () => {
         </span>
       </Message>
 
+      <LoadedPhraseBlock />
+
     </template>
   </div>
 </template>