login from modal is working, register is lacking password generator

web/themes/custom/materiotheme/vuejs/components/Content/Product.vue

@@ -7,7 +7,7 @@
       <div class="description" v-html="product.field_description" />
       <span class="price">{{ product.price__number }}</span>
     </section>
-    <aside class="">
+    <aside v-if="!isAdherent">
       <input
         v-if="product.field_multiple"
         v-model="quantity"
@@ -24,11 +24,17 @@
         Commander
       </button>
     </aside>
+
     <Modal
-      v-if="login"
+      v-if="showLoginModal"
+      @close="closeModal"
     >
-      i'm a modal
+      <div>
+        Please login or register before continue.
+      </div>
+      <LoginRegisterForm @onLogedIn="logedIn"/>
     </Modal>
+
   </article>
 </template>
 
@@ -38,6 +44,7 @@ import { REST } from 'vuejs/api/rest-axios'
 import router from 'vuejs/route'
 import { mapState, mapActions } from 'vuex'
 import Modal from 'vuejs/components/Helper/Modal'
+import LoginRegisterForm from 'vuejs/components/Helper/LoginRegisterForm'
 
 let basePath = drupalSettings.path.baseUrl + drupalSettings.path.pathPrefix;
 
@@ -48,25 +55,28 @@ export default {
   data(){
     return {
       quantity: 1,
-      login:false,
-      register:false
+      showLoginModal:false
     }
   },
   computed: {
     ...mapState({
-      isloggedin: state => state.User.isloggedin
+      isloggedin: state => state.User.isloggedin,
+      isAdherent: state => state.User.isAdherent
     })
   },
   methods:{
-    ...mapActions({
-      userLogin: 'User/userLogin'
-    }),
+    // ...mapActions({
+    //   userLogin: 'User/userLogin'
+    // }),
+    closeModal () {
+      this.showLoginModal = false;
+    },
     checkaddtocart() {
       console.log('checkaddtocart');
 
       if(!this.isloggedin){
         // TODO: show popup login or register
-        this.login = true
+        this.showLoginModal = true
         // TODO: rest login or register
         // TODO: rest login
         // TODO: this.addtocart()
@@ -74,6 +84,10 @@ export default {
         this.addtocart()
       }
     },
+    logedIn () {
+      console.log('Product: logedIn');
+      this.closeModal()
+    },
     addtocart () {
       console.log("addtocart")
 
@@ -93,7 +107,8 @@ export default {
     }
   },
   components: {
-    Modal
+    Modal,
+    LoginRegisterForm
   }
 }
 </script>