From 585188cc14477dd70150e1f82c14061cb7e60e89 Mon Sep 17 00:00:00 2001
From: clonbg <clonbg@gmail.com>
Date: Tue, 28 Feb 2023 11:39:28 +0100
Subject: [PATCH] registra y manda email

---
 src/pages/RegisterPage.vue | 126 +++++++++++++++----------------------
 src/stores/lista.js        |  34 +++++++++-
 2 files changed, 81 insertions(+), 79 deletions(-)

diff --git a/src/pages/RegisterPage.vue b/src/pages/RegisterPage.vue
index 069bf27..2038c8a 100644
--- a/src/pages/RegisterPage.vue
+++ b/src/pages/RegisterPage.vue
@@ -1,7 +1,5 @@
 <template>
-  <div
-    class="bg-light-green window-height window-width row justify-center items-center"
-  >
+  <div class="bg-light-green window-height window-width row justify-center items-center">
     <div class="column">
       <div class="row">
         <h5 class="text-h5 text-white q-my-md">Mis listas</h5>
@@ -10,86 +8,38 @@
         <q-card square bordered class="q-pa-lg shadow-1">
           <q-card-section>
             <q-form class="q-gutter-md" @click.once="recibeDatos()">
-              <q-input
-                square
-                filled
-                clearable
-                v-model="username"
-                type="text"
-                label="username"
-                :rules="[
-                  (val) =>
-                    (val != null && val.length >= 3) || 'Mínimo 3 caracteres',
-                  (val) => comprobarUsername || 'Ya existe en la BD',
-                ]"
-              />
-              <q-input
-                square
-                filled
-                clearable
-                v-model="nombre"
-                type="text"
-                label="nombre completo"
-                :rules="[
-                  (val) =>
-                    (val != null && val.length >= 3) || 'Mínimo 3 caracteres',
-                ]"
-              />
-              <q-input
-                square
-                filled
-                clearable
-                v-model="email"
-                type="email"
-                label="email"
-                :rules="[
-                  (val) =>
-                    (val != null && val.length >= 7) || 'Mínimo 7 caracteres',
-                  (val) =>
-                    comprobarEmail ||
-                    'No es un email válido o ya existe en la BD',
-                ]"
-              />
-              <q-input
-                square
-                filled
-                clearable
-                v-model="password"
-                type="password"
-                label="password"
-                :rules="[
-                  (val) =>
-                    (val != null && val.trim().length >= 8) ||
-                    'Mínimo 8 caracteres',
-                ]"
-              />
-              <q-input
-                square
-                filled
-                clearable
-                v-model="confirmpassword"
-                type="password"
-                label="repite password"
-                error-message="No coinciden"
-                :error="comprobarConfirmPassword"
-              />
+              <q-input square filled clearable v-model="username" type="text" label="username" :rules="[
+                (val) =>
+                  (val != null && val.length >= 3) || 'Mínimo 3 caracteres',
+                (val) => comprobarUsername || 'Ya existe en la BD',
+              ]" />
+              <q-input square filled clearable v-model="nombre" type="text" label="nombre completo" :rules="[
+                (val) =>
+                  (val != null && val.length >= 3) || 'Mínimo 3 caracteres',
+              ]" />
+              <q-input square filled clearable v-model="email" type="email" label="email" :rules="[
+                (val) =>
+                  (val != null && val.length >= 7) || 'Mínimo 7 caracteres',
+                (val) =>
+                  comprobarEmail ||
+                  'No es un email válido o ya existe en la BD',
+              ]" />
+              <q-input square filled clearable v-model="password" type="password" label="password" :rules="[
+                (val) =>
+                  (val != null && val.trim().length >= 8) ||
+                  'Mínimo 8 caracteres',
+              ]" />
+              <q-input square filled clearable v-model="confirmpassword" type="password" label="repite password"
+                error-message="No coinciden" :error="comprobarConfirmPassword" />
             </q-form>
           </q-card-section>
           <q-card-actions class="q-px-md">
-            <q-btn
-              :disable="btnRegisterDisable()"
-              unelevated
-              color="light-green-7"
-              size="lg"
-              class="full-width"
-              label="Register"
-            />
+            <q-btn :disable="btnRegisterDisable()" unelevated color="light-green-7" size="lg" class="full-width"
+              label="Register" @click="registrar()" />
           </q-card-actions>
           <q-card-section class="text-center q-pa-none">
             <p class="text-grey-6">
-              <router-link to="/login"
-                >Are you registered? Go to Login</router-link
-              >
+              <router-link to="/login">Are you registered? Go to Login</router-link>
             </p>
           </q-card-section>
         </q-card>
@@ -108,6 +58,7 @@ const username = ref(""); //No exista en la bd, tamaño mínimo
 const confirmpassword = ref("");
 const nombre = ref("");
 const usuarios = ref([]);
+
 const recibeDatos = () => {
   listaStore.getUsers().then(function (item) {
     usuarios.value = item;
@@ -156,12 +107,33 @@ const btnRegisterDisable = () => {
   }
   return false;
 };
+
+const registrar = () => {
+  const data = {
+    'username': username.value,
+    'email': email.value,
+    'emailVisibility': true,
+    'password': password.value,
+    'passwordConfirm': confirmpassword.value,
+    'name': nombre.value
+  }
+  /*   const data = {
+      "username": "test_username",
+      "email": "test@example.com",
+      "emailVisibility": true,
+      "password": "12345678",
+      "passwordConfirm": "12345678",
+      "name": "test"
+    }; */
+  listaStore.register(data)
+}
 </script>
 
 <style>
 .q-card {
   width: 360px;
 }
+
 a:link,
 a:visited,
 a:active {
diff --git a/src/stores/lista.js b/src/stores/lista.js
index 258972f..4400387 100644
--- a/src/stores/lista.js
+++ b/src/stores/lista.js
@@ -5,6 +5,7 @@ import PocketBase from "pocketbase";
 export const useListaStore = defineStore("lista", () => {
   const pb = new PocketBase("https://pocketbase.clonbg.es");
   const authData = ref("");
+
   async function login(email, password) {
     authData.value = pb
       .collection("users")
@@ -13,23 +14,52 @@ export const useListaStore = defineStore("lista", () => {
         this.router.push("/");
       })
       .catch((e) => {
-        console.log("error");
+        console.log("error:", e);
       });
   }
+
   async function refresh() {
     const authData = await pb.collection("users").authRefresh();
   }
+
   async function logout() {
     pb.authStore.clear();
     this.router.push("/login");
   }
+
   async function getUsers() {
     return await pb.collection("users").getFullList({
       sort: "-created",
     });
   }
 
-  return { pb, authData, login, refresh, logout, getUsers };
+  async function register(data) {
+    console.log(data);
+    const record = await pb
+      .collection("users")
+      .create(data)
+      .then((r) => {
+        pb.collection("users")
+          .requestVerification(data.email)
+          .then((r) => {
+            console.log("email enviado");
+          });
+        console.log("Correcto");
+      })
+      .catch((e) => {
+        console.log(e);
+      });
+  }
+
+  return {
+    pb,
+    authData,
+    login,
+    refresh,
+    logout,
+    getUsers,
+    register,
+  };
 });
 
 /*