feat: corrige dialog

src/api/student.js

@@ -0,0 +1,6 @@
+import api from "src/api";
+
+export const getStudents = async () => {
+  const { data } = await api.get("/student");
+  return data.payload;
+};

src/pages/dashboard/components/AlunosAtivosDialog.vue

@@ -16,6 +16,7 @@
             <div class="text-caption text-grey-6">
               {{ alunos.length }} Alunos Cadastrados
             </div>
+            <q-spinner v-if="loading" size="16px" color="primary" class="q-ml-sm" />
           </q-card-section>
 
           <q-card-section class="q-pt-xs q-pb-sm">
@@ -88,8 +89,9 @@
 </template>
 
 <script setup>
-import { ref, computed } from "vue";
+import { ref, computed, onMounted } from "vue";
 import { useDialogPluginComponent } from "quasar";
+import { getStudents } from "src/api/student";
 
 defineEmits([...useDialogPluginComponent.emits]);
 
@@ -97,56 +99,32 @@ const { dialogRef, onDialogHide, onDialogCancel } = useDialogPluginComponent();
 
 const search = ref("");
 const selectedIndex = ref(0);
-
-const alunos = [
-  {
-    id: 1,
-    nome: "Heloisa Faria",
-    telefone: "(46)99999-9999",
-    unidade: "Unidade franco",
-    status: "Ativo",
-  },
-  {
-    id: 2,
-    nome: "Carol",
-    telefone: "(45)99999-9999",
-    unidade: "Arapongas-PR",
-    status: "Ativo",
-  },
-  {
-    id: 3,
-    nome: "Marcelo Souza",
-    telefone: "(45)98888-8888",
-    unidade: "Curitiba-PR",
-    status: "Ativo",
-  },
-  {
-    id: 4,
-    nome: "Ana Lúcia",
-    telefone: "(45)97777-7777",
-    unidade: "Londrina-PR",
-    status: "Ativo",
-  },
-  {
-    id: 5,
-    nome: "Ricardo Silva",
-    telefone: "(45)96666-6666",
-    unidade: "Ponta Grossa-PR",
-    status: "Ativo",
-  },
-  {
-    id: 6,
-    nome: "Juliana Costa",
-    telefone: "(45)95555-5555",
-    unidade: "Maringá-PR",
-    status: "Ativo",
-  },
-];
+const loading = ref(false);
+
+const alunos = ref([]);
+
+onMounted(async () => {
+  loading.value = true;
+  try {
+    const students = await getStudents();
+    alunos.value = students.map((s) => ({
+      id: s.id,
+      nome: s.name,
+      telefone: s.phone ?? "—",
+      unidade: s.unit?.fantasy_name ?? "—",
+      status: s.status === "active" ? "Ativo" : "Inativo",
+    }));
+  } catch {
+    // silencioso
+  } finally {
+    loading.value = false;
+  }
+});
 
 const filteredAlunos = computed(() => {
-  if (!search.value) return alunos;
+  if (!search.value) return alunos.value;
   const q = search.value.toLowerCase();
-  return alunos.filter(
+  return alunos.value.filter(
     (a) =>
       a.nome.toLowerCase().includes(q) ||
       a.telefone.includes(q) ||