form validationMessage

src/views/dashboard.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="Dashboard">
-        Dashboard
+        <h2>Dashboard</h2>
     </div>
 </template>
 

src/views/forms/login.vue

@@ -10,6 +10,10 @@
 
                 <my-form :elements="elements" :buttons="buttons" :submitHandler="login"></my-form>
 
+                <transition name="component-fade">
+                    <div class="loginerror" v-show="loginError">{{ loginError }}</div>
+                </transition>
+
                 <div style="clear:both;"></div>
             </div>
         </div>
@@ -33,19 +37,22 @@ export default {
                     placeholder: "Benutzername",
                     icon: "icon-user",
                     type: "text",
-                    required: true
+                    required: true,
+                    requiredMessage: "Der Benutzername wird benötigt!"
                 },
                 password: {
                     placeholder: "Passwort",
                     icon: "icon-key",
                     type: "password",
-                    required: true
+                    required: true,
+                    requiredMessage: "Das Passwort wird benötigt!"
                 }
             },
             buttons: [{
                 label: "login",
                 type: "submit"
-            }]
+            }],
+            loginError: ""
         }
     },
     methods: {
@@ -59,12 +66,25 @@ export default {
                 .catch(error => {
                     console.log("---- login error -------");
                     console.log(error);
+                    this.loginError = "Loginfehler: " + error;
                 });
         }
     }
 }
 </script>
 
+<style scoped>
+    .loginerror {
+        color: black;
+        font-size: 1em;
+        text-align: center;
+        background-color: #faa;
+        padding: 10px;
+        margin-top: 10px;
+        border-radius: 30px;
+    }
+</style>
+
 <style lang="less">
 @import "~mixins";
 
@@ -127,4 +147,5 @@ export default {
         }
     }
 }
-</style>
+</style>
+

src/views/forms/logout.vue

@@ -1,5 +1,6 @@
 <template>
     <div>
+        <h3>Logout</h3>
         Sie werden ausgeloggt....
     </div>
 </template>
@@ -11,7 +12,7 @@ export default {
         this.$store.commit('clearLogin');
         setTimeout(() => {
             this.$router.replace('/login');
-        }, 2000);
+        }, 1000);
     }
 }
 </script>

src/views/lists/domainlist.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="Domainlist">
-        <h1>Domainlist</h1>
+        <h2>Domainlist</h2>
         <scroll-table :actions="actions" :columns="columns" :new-rows="newRows" :has-more="hasMore" :loading="loading" :handler="more" orderBy="Name" :orderDesc="false" :limit="50"></scroll-table>
     </div>
 </template>

src/views/lists/userlist.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="Userlist">
-        <h1>Userlist</h1>
+        <h2>Userlist</h2>
         <scroll-table :actions="actions" :columns="columns" :new-rows="newRows" :has-more="hasMore" :loading="loading" :handler="more" orderBy="username" :orderDesc="false" :limit="50"></scroll-table>
     </div>
 </template>