Reg con username

package-lock.json

@@ -1230,8 +1230,7 @@
     "ansi-regex": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
-      "dev": true
     },
     "ansi-styles": {
       "version": "3.2.1",
@@ -3495,8 +3494,7 @@
     "escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
-      "dev": true
     },
     "eslint-scope": {
       "version": "4.0.0",
@@ -4767,7 +4765,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
       "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true,
       "requires": {
         "ansi-regex": "2.1.1"
       }
@@ -5774,6 +5771,38 @@
       "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA==",
       "dev": true
     },
+    "ladash": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/ladash/-/ladash-1.2.0.tgz",
+      "integrity": "sha1-wlWPJYd5hc5VWqbnByO0SnLAw2Y=",
+      "requires": {
+        "chalk": "1.1.3"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "last-call-webpack-plugin": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz",
@@ -8840,7 +8869,6 @@
       "version": "3.0.1",
       "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
       "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-      "dev": true,
       "requires": {
         "ansi-regex": "2.1.1"
       }

package.json

@@ -16,6 +16,7 @@
     "chart": "^0.1.2",
     "chart.js": "^2.7.2",
     "countup.js": "^1.9.3",
+    "ladash": "^1.2.0",
     "quasar-extras": "^2.0.8",
     "roboto-font": "^0.1.0",
     "vivus": "^0.4.4",

src/components/views/login/signup.vue

@@ -84,7 +84,7 @@
             </q-field>
 
 
-            <q-btn color="primary" @click="submit">Submit</q-btn>
+            <q-btn color="primary" @click="submit" :disable="$v.$error">Submit</q-btn>
         </q-page>
     </div>
 </template>
@@ -104,7 +104,11 @@
   import {mapGetters, mapActions} from 'vuex'
   import * as types from '../../../store/mutation-types'
 
-  import { Errori_MongoDb } from '../../../store/modules/user'
+  import {Errori_MongoDb} from '../../../store/modules/user'
+
+  import axios from 'axios';
+
+  import { debounce } from 'quasar'
 
 
   export default {
@@ -118,7 +122,9 @@
           confirmpassword: process.env.TEST_PASSWORD,
           dateOfBirth: '',
           terms: true,
-        }
+        },
+        duplicate_email: false,
+        duplicate_username: false,
       }
     },
     computed: {
@@ -144,9 +150,36 @@
     },
     validations: {
       form: {
-        email: {required, email},
+        email: {
+          required, email,
+        },
         password: {required, minLength: minLength(8), maxLength: maxLength(20)},
-        username: {required, minLength: minLength(6), maxLength: maxLength(20)},
+        username: {
+          required, minLength: minLength(6), maxLength: maxLength(20),
+          unique: value => {
+            if (value === '') return true;
+            debounce(function() {
+              return axios.get(process.env.MONGODB_HOST + '/users/' + value)
+                .then(res => {
+                  console.log("STATUS: ");
+                  console.log(res.status);
+                  if (res.status !== 200)
+                    return true;
+                  else
+                    return false;
+                }).then(ris => {
+                  setTimeout(() => {
+                    //
+                    return ris;
+                  }, 1000);
+                })
+                .catch((e) => {
+                  console.log(e);
+                  return true;
+                })
+            }, 2000);
+          }
+        },
         confirmpassword: {
           sameAsPassword: sameAs('password')
         },
@@ -154,13 +187,6 @@
 
       }
     },
-    watch: {
-      getscode(code) {
-        if (code === Errori_MongoDb.DUPLICATE_EMAIL_ID) {
-          this.$q.notify(this.$t('reg.err.duplicate_email'));
-        }
-      }
-    },
     methods: {
       ...mapActions("user", {
         signup: types.USER_SIGNUP,
@@ -171,12 +197,27 @@
         if (!item.required) return this.$t('reg.err.required');
         if (!item.minLength) return this.$t('reg.err.atleast') + ` ${item.$params.minLength.min} ` + this.$t('reg.err.char');
         if (!item.maxLength) return this.$t('reg.err.notmore') + ` ${item.$params.maxLength.max} ` + this.$t('reg.err.char');
-        if (item.duplicated) return this.$t('reg.err.duplicate_email');
         return '';
       },
+      checkErrors(riscode){
+        //console.log("RIS = " + riscode);
+        if (riscode === Errori_MongoDb.DUPLICATE_EMAIL_ID) {
+          this.$q.notify(this.$t('reg.err.duplicate_email'));
+        }else if (riscode === Errori_MongoDb.DUPLICATE_USERNAME_ID) {
+            this.$q.notify(this.$t('reg.err.duplicate_username'));
+        } else if (riscode === Errori_MongoDb.OK) {
+          this.$router.push('/');
+        } else {
+          this.$q.notify("Errore num " + riscode);
+        }
+
+      },
       submit() {
         this.$v.form.$touch();
 
+        this.duplicate_email = false;
+        this.duplicate_username = false;
+
         if (!this.form.terms) {
           this.$q.notify(this.$t('reg.err.terms'));
           return
@@ -192,12 +233,7 @@
         console.log(this.form);
         this.signup(this.form)
           .then((riscode) => {
-            //console.log("RIS = " + riscode);
+            this.checkErrors(riscode);
-            if (riscode === Errori_MongoDb.DUPLICATE_EMAIL_ID) {
-              this.$q.notify(this.$t('reg.err.duplicate_email'));
-            } else {
-              this.$router.push('/');
-            }
           }).catch(error => {
           console.log("ERROR = " + error);
         });

src/i18n.js

@@ -20,7 +20,8 @@ const messages = {
         notmore: 'non dev\'essere lungo più di',
         char: 'caratteri',
         terms: 'Devi accettare le condizioni, per continuare.',
-        duplicate_email: 'l\'Email è già stata registrata'
+        duplicate_email: 'l\'Email è già stata registrata',
+        duplicate_username: 'L\'Username è stato già utilizzato'
       }
     },
   },
@@ -46,6 +47,7 @@ const messages = {
         char: 'characters long',
         terms: 'You need to agree with the terms & conditions.',
         duplicate_email: 'Email was already registered',
+        duplicate_username: 'Username is already taken'
       }
     },
   },