rules username perfil

package.json

@@ -26,7 +26,14 @@
     "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-vue": "^9.0.0",
     "postcss": "^8.4.14",
-    "prettier": "^2.5.1"
+    "prettier": "^2.5.1",
+    "workbox-build": "^6.5.4",
+    "workbox-cacheable-response": "^6.5.4",
+    "workbox-core": "^6.5.4",
+    "workbox-expiration": "^6.5.4",
+    "workbox-precaching": "^6.5.4",
+    "workbox-routing": "^6.5.4",
+    "workbox-strategies": "^6.5.4"
   },
   "engines": {
     "node": "^18 || ^16 || ^14.19",

public/icons/safari-pinned-tab.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256"><path fill-opacity=".016" d="M0 128.004v128.004l128.25-.254 128.25-.254.254-127.75L257.008 0H0v128.004m.485.496c0 70.4.119 99.053.265 63.672.146-35.38.146-92.98 0-128C.604 29.153.485 58.1.485 128.5" fill="#1976D2" fill-rule="evenodd"/><path fill-opacity=".414" d="M110.5 4.051C82.037 8.492 57.508 21.188 37.936 41.608 20.753 59.537 9.701 80.895 4.873 105.5c-1.801 9.181-1.801 35.819 0 45 5.086 25.923 17.318 48.612 35.98 66.739 18.375 17.848 38.091 28.197 64.647 33.931 7.912 1.708 37.088 1.708 45 0 26.556-5.734 46.272-16.083 64.647-33.931 18.662-18.127 30.894-40.816 35.98-66.739 1.801-9.181 1.801-35.819 0-45-5.086-25.923-17.318-48.612-35.98-66.739-18.016-17.5-37.679-28.049-62.147-33.342-8.851-1.915-33.839-2.719-42.5-1.368M57.937 67.355c-5.675 6.602-9.848 13.179-14.046 22.136-6.475 13.818-6.675 13.065 5.205 19.652l10.177 5.643.114 12.846.113 12.847 6.5 1.214c3.575.667 9.951 1.235 14.169 1.26l7.669.047-4.359-8.75c-2.397-4.812-5.289-12.125-6.425-16.25-2.998-10.886-4.465-27.659-3.355-38.358l.919-8.858-3.559-2.242c-1.957-1.233-4.909-2.936-6.559-3.786-2.978-1.534-3.026-1.515-6.563 2.599m88.906.496c-2.389 2.669-6.038 7.731-8.111 11.25l-3.767 6.399 9.58.7c18.028 1.316 35.321 7.575 51.975 18.814l7.848 5.295 6.334-3.404c6.009-3.23 6.304-3.56 5.738-6.405-1.147-5.77-10.374-23.254-15.998-30.312l-5.672-7.12-3.002 1.552c-1.651.854-6.361 3.538-10.467 5.966-4.107 2.428-7.65 4.414-7.875 4.414-.225 0-2.416-1.532-4.869-3.404-4.319-3.297-14.43-8.596-16.402-8.596-.533 0-2.924 2.183-5.312 4.851M119.97 112.25c-13.123 6.629-13.123 24.871 0 31.5 2.45 1.238 6.063 2.25 8.03 2.25 1.967 0 5.58-1.012 8.03-2.25 13.123-6.629 13.123-24.871 0-31.5-2.45-1.237-6.063-2.25-8.03-2.25-1.967 0-5.58 1.013-8.03 2.25M157 161.354c-4.352 7.642-20.272 23.85-29 29.524-3.575 2.325-10.213 6.041-14.75 8.26l-8.25 4.033V217.858l5.75 1.254c7.405 1.615 27.095 1.615 34.5 0l5.75-1.254v-24.456l3.648-1.32c4.794-1.733 14.437-7.412 16.54-9.741 1.553-1.719 1.535-2.204-.269-7.341-2.19-6.233-7.905-17.753-9.416-18.979-.608-.493-2.383 1.609-4.503 5.333" fill="#1976D2" fill-rule="evenodd"/><path fill-opacity=".633" d="M106.5 20.973c-22.292 4.83-39.705 14.257-55.488 30.039-14.029 14.03-23.57 30.536-28.774 49.782-2.363 8.739-2.625 11.45-2.625 27.206s.262 18.467 2.625 27.206c5.204 19.246 14.745 35.752 28.774 49.782 14.03 14.029 30.536 23.57 49.782 28.774 8.739 2.363 11.45 2.625 27.206 2.625s18.467-.262 27.206-2.625c19.246-5.204 35.752-14.745 49.782-28.774 14.029-14.03 23.57-30.536 28.774-49.782 2.363-8.739 2.625-11.45 2.625-27.206s-.262-18.467-2.625-27.206c-5.204-19.246-14.745-35.752-28.774-49.782-14.091-14.09-30.744-23.693-49.782-28.705-13.549-3.567-35.609-4.171-48.706-1.334m12 14.646c-1.65.25-5.362.92-8.25 1.489L105 38.142v23.97l-4.75 2.077c-6.192 2.707-17.255 9.944-17.232 11.273.035 1.995 6.648 17.075 9.379 21.388l2.754 4.349 3.674-6.267c8.243-14.057 26.562-29.805 44.666-38.396L151 52.973V38.166l-5.25-1.133c-5.812-1.255-22.567-2.124-27.25-1.414m30.364 29.131C143.041 71.129 135 83.305 135 85.744c0 .588.826.853 1.835.589 3.458-.904 21.048 1.663 29.357 4.284 10.03 3.165 22.999 9.592 31.774 15.747l6.466 4.535 5.534-3.108c8.572-4.815 8.255-4.157 5.513-11.444-3.799-10.092-9.099-19.497-15.061-26.725-3.004-3.642-5.79-6.614-6.19-6.605-.4.009-5.225 2.667-10.721 5.907l-9.993 5.89-4.507-3.286C165.275 68.808 152.92 62 151.716 62c-.188 0-1.472 1.237-2.852 2.75m-90 1C51.41 73.915 44.842 84.856 40.56 96.241l-2.536 6.741 10.552 6.155 10.552 6.156-.681 6.353c-.374 3.495-.372 9.226.004 12.737l.683 6.383 5.683 1.085c8.602 1.642 20.516 2.366 22.019 1.338 1.068-.73.728-1.998-1.686-6.301-3.395-6.053-6.18-13.281-8.819-22.888-1.413-5.145-1.79-10.397-1.808-25.188L74.5 70.123l-6.088-3.561C65.063 64.603 62.11 63 61.849 63c-.261 0-1.605 1.237-2.985 2.75m61.636 45.667c-1.65.737-4.209 2.632-5.686 4.211-10.782 11.526-2.66 30.372 13.089 30.372 15.938 0 24.142-18.76 13.283-30.373-5.038-5.388-13.972-7.206-20.686-4.21m52.021 10.333c2.397 4.813 5.289 12.125 6.425 16.25 2.998 10.886 4.465 27.659 3.355 38.358l-.919 8.858 3.559 2.242c1.957 1.233 4.972 2.97 6.7 3.861l3.141 1.62 5.984-7.548c8.468-10.679 18.616-32.069 15.696-33.084-.529-.184-5.012-2.704-9.962-5.6l-9-5.265-.109-11.634c-.061-6.398-.364-12.295-.675-13.105-.725-1.891-10.983-3.703-20.967-3.703h-7.587l4.359 8.75M44.704 149.289c-5.391 2.986-5.757 3.417-5.238 6.149 1.091 5.733 10.297 23.167 15.988 30.278l5.776 7.216 3.002-1.552c1.651-.854 6.432-3.58 10.625-6.059 4.62-2.731 8.054-4.175 8.714-3.664 4.628 3.577 13.301 8.762 16.873 10.086l4.316 1.6 3.37-3.816c3.99-4.517 8.242-10.633 10.867-15.629l1.893-3.603-9.695-.598c-16.92-1.046-35.444-7.731-51.57-18.613-4.144-2.796-7.893-5.066-8.33-5.045-.437.022-3.403 1.484-6.591 3.25m111.329 12.97c-8.786 14.244-27.564 29.962-44.73 37.44l-6.376 2.778.286 8.006.287 8.007 6.5 1.208c8.333 1.549 23.668 1.549 32 0l6.5-1.209.5-12.249.5-12.249 6.276-2.966c3.452-1.63 8.335-4.381 10.851-6.113 4.167-2.866 4.523-3.428 3.986-6.28-.682-3.621-10.343-23.636-11.403-23.623-.39.0Line truncated

src-pwa/custom-service-worker.js

@@ -0,0 +1,30 @@
+/* eslint-env serviceworker */
+
+/*
+ * This file (which will be your service worker)
+ * is picked up by the build system ONLY if
+ * quasar.config.js > pwa > workboxMode is set to "injectManifest"
+ */
+
+import { clientsClaim } from 'workbox-core'
+import { precacheAndRoute, cleanupOutdatedCaches, createHandlerBoundToURL } from 'workbox-precaching'
+import { registerRoute, NavigationRoute } from 'workbox-routing'
+
+self.skipWaiting()
+clientsClaim()
+
+// Use with precache injection
+precacheAndRoute(self.__WB_MANIFEST)
+
+cleanupOutdatedCaches()
+
+// Non-SSR fallback to index.html
+// Production SSR fallback to offline.html (except for dev)
+if (process.env.MODE !== 'ssr' || process.env.PROD) {
+  registerRoute(
+    new NavigationRoute(
+      createHandlerBoundToURL(process.env.PWA_FALLBACK_HTML),
+      { denylist: [/sw\.js$/, /workbox-(.)*\.js$/] }
+    )
+  )
+}

src-pwa/manifest.json

@@ -0,0 +1,32 @@
+{
+  "orientation": "portrait",
+  "background_color": "#ffffff",
+  "theme_color": "#027be3",
+  "icons": [
+    {
+      "src": "icons/icon-128x128.png",
+      "sizes": "128x128",
+      "type": "image/png"
+    },
+    {
+      "src": "icons/icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "icons/icon-256x256.png",
+      "sizes": "256x256",
+      "type": "image/png"
+    },
+    {
+      "src": "icons/icon-384x384.png",
+      "sizes": "384x384",
+      "type": "image/png"
+    },
+    {
+      "src": "icons/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}

src-pwa/pwa-flag.d.ts

@@ -0,0 +1,10 @@
+/* eslint-disable */
+// THIS FEATURE-FLAG FILE IS AUTOGENERATED,
+//  REMOVAL OR CHANGES WILL CAUSE RELATED TYPES TO STOP WORKING
+import "quasar/dist/types/feature-flag";
+
+declare module "quasar/dist/types/feature-flag" {
+  interface QuasarFeatureFlags {
+    pwa: true;
+  }
+}

src-pwa/register-service-worker.js

@@ -0,0 +1,41 @@
+import { register } from 'register-service-worker'
+
+// The ready(), registered(), cached(), updatefound() and updated()
+// events passes a ServiceWorkerRegistration instance in their arguments.
+// ServiceWorkerRegistration: https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration
+
+register(process.env.SERVICE_WORKER_FILE, {
+  // The registrationOptions object will be passed as the second argument
+  // to ServiceWorkerContainer.register()
+  // https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register#Parameter
+
+  // registrationOptions: { scope: './' },
+
+  ready (/* registration */) {
+    // console.log('Service worker is active.')
+  },
+
+  registered (/* registration */) {
+    // console.log('Service worker has been registered.')
+  },
+
+  cached (/* registration */) {
+    // console.log('Content has been cached for offline use.')
+  },
+
+  updatefound (/* registration */) {
+    // console.log('New content is downloading.')
+  },
+
+  updated (/* registration */) {
+    // console.log('New content is available; please refresh.')
+  },
+
+  offline () {
+    // console.log('No internet connection found. App is running in offline mode.')
+  },
+
+  error (/* err */) {
+    // console.error('Error during service worker registration:', err)
+  }
+})

src/pages/IndexPage.vue

@@ -26,23 +26,35 @@
           />
         </q-avatar>
       </div>
-      <div class="row" style="max-width: 200px">
-        <q-file class="full-width" outlined v-model="imagen" label="Avatar" />
-      </div>
-      <div class="row">
-        <q-input outlined v-model="name" label="Name" />
-      </div>
-      <div class="row">
-        <q-input outlined v-model="username" label="Username" />
-      </div>
-      <div class="row">
-        <q-input
-          outlined
-          v-model="listaStore.pb.authStore.model.email"
-          label="email"
-          disable
-        />
-      </div>
+      <q-form class="q-gutter-md" @click.once="recibeDatos()">
+        <div class="row" style="max-width: 200px">
+          <q-file class="full-width" outlined v-model="imagen" label="Avatar" />
+        </div>
+        <div class="row">
+          <q-input outlined v-model="name" label="Name" />
+        </div>
+        <div class="row">
+          <q-input
+            outlined
+            v-model="username"
+            label="Username"
+            :rules="[
+              (val) =>
+                (val != null && val.length >= 3) || 'Mínimo 3 caracteres',
+              (val) => comprobarUsername || 'Ya existe en la BD',
+              (val) => /^[A-Z0-9]+$/i.test(val) || 'Sólo letras o números',
+            ]"
+          />
+        </div>
+        <div class="row">
+          <q-input
+            outlined
+            v-model="listaStore.pb.authStore.model.email"
+            label="email"
+            disable
+          />
+        </div>
+      </q-form>
       <div class="row q-pt-md">
         <div class="col text-center">
           <q-btn round color="primary" icon="cancel" @click="cargarDatos()" />
@@ -85,7 +97,7 @@
   </q-page>
 </template>
 <script setup>
-import { ref } from "vue";
+import { ref, computed } from "vue";
 import { useListaStore } from "../stores/lista.js";
 
 const listaStore = useListaStore();
@@ -94,13 +106,15 @@ const imagen = ref(null);
 const username = ref(listaStore.pb.authStore.model.username);
 const name = ref(listaStore.pb.authStore.model.name);
 const alertSave = ref(false);
+const usuarios = ref([]);
+
 const updateUser = async () => {
   const formData = new FormData();
   if (username.value.trim().length > 0) {
-    formData.append("username", username.value);
+    formData.append("username", username.value.trim());
   }
   if (name.value.trim().length > 0) {
-    formData.append("name", name.value);
+    formData.append("name", name.value.trim());
   }
   if (imagen.value != null) {
     formData.append("avatar", imagen.value);
@@ -117,4 +131,25 @@ const cargarDatos = () => {
   username.value = listaStore.pb.authStore.model.username.trim();
   name.value = listaStore.pb.authStore.model.name.trim();
 };
+
+const recibeDatos = () => {
+  listaStore.getUsers().then(function (item) {
+    usuarios.value = item;
+  });
+};
+
+const comprobarUsername = computed(() => {
+  let filtro = usuarios.value?.filter(
+    (user) => user.username.toLowerCase() == username.value.trim().toLowerCase()
+  );
+  if (filtro.length == 0) {
+    return true;
+  } else if (
+    filtro.length == 1 &&
+    filtro[0].username == listaStore.pb.authStore.model.username
+  ) {
+    return true;
+  }
+  return false;
+});
 </script>