handling the different routes

frontend/src/components/ButtonText.vue

 <template>
-    <button class="text-button" :style="this.style" v-on:click="this.emit">
+    <button :id="this.id" class="text-button" :style="this.style">
         {{text}}
     </button>
 </template>
@@ -29,7 +29,9 @@ export default {
     text: { type: String, default: ''},
     width: { type: [String], default: "750px" },
     height: { type: [String], default: "130px" },
-    click: {type: String, default: ''}
+    click: {type: String, default: ''},
+    id: {type: String, default: ''},
+    
   },
   computed: {
     style() {
@@ -38,10 +40,6 @@ export default {
         maxWidth: this.width
       }
       return style;
-    },
-    emit () {
-      const emit = "$emit('"+this.click+"')";
-      return emit
     }
   }
 }

frontend/src/views/Home.vue

 <template>
     <div class="home">
         <page-title pagetitle="Riichi Mahjong"/>
-        <form action="#" @submit.prevent="login">
-            <button-text width="615px" height="130px" text="Se Connecter"/>
-        </form>
-        <form action="#" @submit.prevent="register">
-            <button-text width="615px" height="130px" text="S'Enregistrer"/>
+        <form class="home-form" action="#" @submit.prevent="onSubmit">
+            <button-text id="login" width="615px" height="130px" text="Se Connecter"/>
+            <button-text id="register" width="615px" height="130px" text="S'Enregistrer"/>
         </form>
     </div>
 </template>
@@ -21,13 +19,15 @@ export default {
         ButtonText
     },
     methods: {
-        login: function(){
+        onSubmit: function(){
+            if (event.submitter.id=='login') {
                 this.$router.push('login');
-        },
-        register: function(){
+            }
+            if (event.submitter.id=='register') {
                 this.$router.push('register');
             }
         }
+    }
 }
 </script>
 
@@ -43,4 +43,9 @@ export default {
 margin-left:auto;
 margin-right:auto;
 }
+
+.home-form{
+    display: flex;
+    flex-direction: column;
+}
 </style>
\ No newline at end of file

frontend/src/views/Login.vue

@@ -9,8 +9,8 @@
                 
             </div>
                 
-            <svg-button svg="/icons/back.svg"/>
-            <svg-button svg="/icons/validate.svg"/>
+            <svg-button id="back" svg="/icons/back.svg"/>
+            <svg-button id="validate" svg="/icons/validate.svg"/>
         </form>
     </div>
 </template>
@@ -31,10 +31,15 @@ export default {
         CheckboxInput
     },
     methods: {
-        onSubmit: function(){
+        onSubmit: function(event){
+            if (event.submitter.id=='back') {
+                this.$router.push('/');
+            }
+            if (event.submitter.id=='validate') {
                 this.$router.push('lobby');
             }
         }
+    }
 }
 </script>
 

frontend/src/views/Register.vue

@@ -12,8 +12,8 @@
                 
                 
             </div>
-            <svg-button svg="/icons/back.svg"/>
-            <svg-button svg="/icons/validate.svg"/>
+            <svg-button id="back" svg="/icons/back.svg"/>
+            <svg-button id="validate" svg="/icons/validate.svg"/>
         </form>
     </div>
 </template>
@@ -56,9 +56,14 @@ export default {
             if (this.showBackError) {
                 return;
             }
+            if (event.submitter.id=='back') {
+                this.$router.push('/');
+            }
+            if (event.submitter.id=='validate') {
                 this.$router.push('lobby');
             }
         }
+    }
 }
 </script>