allow use of custom form components, add textarea component, add checkbox input, use more absolute imports

src/views/dashboard.vue

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

src/views/forms/login.vue

@@ -18,11 +18,13 @@
 
 <script>
 import MyForm from "components/my-form";
+import MyInput from "components/my-input";
 
 export default {
     name: "LoginForm",
     components: {
-        MyForm
+        MyForm,
+        MyInput
     },
     data() {
         return {
@@ -30,18 +32,24 @@ export default {
             password: "",
             elements: {
                 username: {
-                    placeholder: "Benutzername",
+                    element: MyInput,
                     icon: "icon-user",
-                    type: "text",
                     required: true,
-                    requiredMessage: "Der Benutzername wird benötigt!"
+                    requiredMessage: "Der Benutzername wird benötigt!",
+                    props: {
+                        type: "text",
+                        placeholder: "Benutzername"
+                    }
                 },
                 password: {
-                    placeholder: "Passwort",
+                    element: MyInput,
                     icon: "icon-key",
-                    type: "password",
                     required: true,
-                    requiredMessage: "Das Passwort wird benötigt!"
+                    requiredMessage: "Das Passwort wird benötigt!",
+                    props: {
+                        type: "password",
+                        placeholder: "Passwort"
+                    }
                 }
             },
             buttons: [{
@@ -115,7 +123,6 @@ export default {
     }
 
     .logo{
-        .clearfix();
         line-height:0; margin-bottom:15px; text-align:center;
         img {width:100%; max-width:72px;}
     }

src/views/forms/settings.vue

@@ -106,11 +106,15 @@
 
 <script>
 import MyForm from "components/my-form";
+import MyInput from "components/my-input";
+import TextareaInput from "components/textarea-input";
 
 export default {
     name: "FormDemo",
     components: {
-        MyForm
+        MyForm,
+        MyInput,
+        TextareaInput
     },
     data() {
         return {
@@ -119,18 +123,39 @@ export default {
             elements: {
                 title: {
                     label: "Titel",
-                    placeholder: "Titel hier eintragen",
-                    icon: "icon-user",
-                    type: "text",
-                    required: true
+                    required: true,
+                    element: MyInput,
+                    props: {
+                        type: "text",
+                        placeholder: "Titel hier eintragen"
+                    }
                 },
                 permalink: {
                     label: "Permalink",
-                    placeholder: "Permalink",
                     description: "Hier steht ein Beschreibungstext für etwas begriffsstutzige Menschen, die eine Beschreibung zum Befüllen des Feldes brauchen.",
-                    icon: "icon-key",
-                    type: "password",
-                    required: true
+                    required: true,
+                    element: MyInput,
+                    props: {
+                        type: "text",
+                        placeholder: "Permalink"
+                    }
+                },
+                content: {
+                    label: "Inhalt",
+                    description: "Hier steht ein Beschreibungstext für etwas begriffsstutzige Menschen, die eine Beschreibung zum Befüllen des Feldes brauchen.",
+                    required: true,
+                    element: TextareaInput,
+                    props: {
+                        placeholder: "Inhalt"
+                    }
+                },
+                public: {
+                    label: "Is Public",
+                    required: true,
+                    element: MyInput,
+                    props: {
+                        type: "checkbox"
+                    }
                 }
             },
             buttons: [{
@@ -141,7 +166,7 @@ export default {
     },
     methods: {
         submit(formData) {
-            console.log("submit", formData);
+            console.log("submit", JSON.stringify(formData));
             // this.$store.dispatch("login", formData)
             //     .then(user => {
             //         console.log("---- user login --------");

src/views/lists/domainlist.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="Domainlist">
-        <h2>Domainlist</h2>
+        <h1>Domainlist</h1>
         <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>
 
 <script>
-import ScrollTable from '../../components/scroll-table.vue';
+import ScrollTable from 'components/scroll-table.vue';
 
 export default {
     name: "Domainlist",

src/views/lists/userlist.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="Userlist">
-        <h2>Userlist</h2>
+        <h1>Userlist</h1>
         <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>
 
 <script>
-import ScrollTable from '../../components/scroll-table.vue';
+import ScrollTable from 'components/scroll-table.vue';
 
 export default {
     name: "Userlist",

src/views/views.js

@@ -11,5 +11,5 @@ export default {
     Logout,
     Userlist,
     Domainlist,
-    Settings,
-}
+    Settings
+}