From a9a91245133ad8ac6eaf960988606ad850640dda Mon Sep 17 00:00:00 2001
From: clonbg <clonbg@gmail.com>
Date: Wed, 8 Mar 2023 19:09:20 +0100
Subject: [PATCH] pagina de listas

---
 src/pages/ListasPage.vue | 37 +++++++++++++++++++++++++++++++------
 src/router/routes.js     |  5 +++++
 2 files changed, 36 insertions(+), 6 deletions(-)

diff --git a/src/pages/ListasPage.vue b/src/pages/ListasPage.vue
index fb59ecd..e3091a5 100644
--- a/src/pages/ListasPage.vue
+++ b/src/pages/ListasPage.vue
@@ -1,16 +1,41 @@
 <template>
-  <div class="flex flex-center">
-    <h1>
+  <div class="flex flex-center bg-teal-7 q-ma-md" @click="irPerfil()">
+    <h1 style="font-weight: 415">
       {{ listaStore.pb.authStore.model.username }}
     </h1>
   </div>
-  <q-page class="flex flex-center">
-    <div>Página de listas</div>
-  </q-page>
+  <div class="flex flex-center q-pt-xl q-mt-xl">
+    <div
+      class="full-width text-center q-px-md"
+      v-for="lista in listas"
+      :key="lista.id"
+    >
+      <p class="bg-cyan-7 q-pa-md text-weight-bold text-h6">
+        {{ lista.nombre }}
+      </p>
+    </div>
+  </div>
 </template>
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import { useListaStore } from "../stores/lista.js";
+import { useRouter } from "vue-router";
 
+const $router = useRouter();
 const listaStore = useListaStore();
+
+const listas = ref(null);
+
+const listListas = async () => {
+  listas.value = await listaStore.pb.collection("lista").getFullList({
+    sort: "-created",
+  });
+};
+
+const irPerfil = () => {
+  $router.push("perfil");
+};
+onMounted(() => {
+  listListas();
+});
 </script>
diff --git a/src/router/routes.js b/src/router/routes.js
index 58dc05e..e14764c 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -8,6 +8,11 @@ const routes = [
         component: () => import("pages/ListasPage.vue"),
         meta: { auth: true },
       },
+      {
+        path: "perfil",
+        component: () => import("pages/IndexPage.vue"),
+        meta: { auth: true },
+      },
     ],
   },
   {