new version and some hotfixes

Author: ricardovanlaarhoven

generator/templates/Authorisation/src/templates/Authorisation.vue

@@ -1,6 +1,6 @@
 <template>
     <v-main>
-        <v-container fluid class="primary">
+        <v-container fluid fill-height class="primary">
             <router-view/>
         </v-container>
     </v-main>

generator/templates/Crud/src/components/BaseForm.vue

@@ -0,0 +1,65 @@
+<script>
+import BaseForm from '@/components/BaseForm.vue';
+
+export default {
+    name: 'Form',
+    extends: BaseForm,
+    props: {
+        value: {
+            default() {
+                return {values: {}, valid: false};
+            },
+            type: Object,
+        },
+        errors: {
+            default() {
+                return {};
+            },
+            type: Object,
+        },
+        isUpdateForm: {
+            type: Boolean,
+            default: false,
+        },
+    },
+    watch: {
+        value: {
+            immediate: true,
+            handler() {
+                if (Object.keys(this.value.values).length !== 0) {
+                    this.values = this.setFormValues(this.value.values);
+                }
+            },
+            deep: true,
+        },
+        valid: {
+            handler() {
+                this.handleFormEmit();
+            },
+        },
+        values: {
+            handler() {
+                this.handleFormEmit();
+            },
+            deep: true,
+        },
+    },
+    data() {
+        return {
+            valid: false,
+            values: {},
+        };
+    },
+    methods: {
+        setFormValues(values) {
+            return values;
+        },
+        handleFormEmit() {
+            clearTimeout(this.emitTimeout);
+            this.emitTimeout = setTimeout(() => {
+                this.$emit('input', {values: this.values, valid: this.valid});
+            }, 500);
+        },
+    },
+};
+</script>

generator/templates/Crud/src/components/VuetifyResourceBaseForm.vue

@@ -5,19 +5,17 @@
                 <v-subheader class="pa-0">Gebruiker</v-subheader>
                 <v-card class="themed-color">
                     <v-card-text>
-                        <v-text-field
+                        <VTextField
                             :counter="100"
-                            :rules="[(v) => !!v || 'Naam is verplicht', v => serverError('name', v), (v) => !!v && v.length <= 100 || 'de naam mag maximaal 100 tekens bevatten']"
+                            :rules="[(v) => !!v || 'Naam is verplicht', () => serverError('name'), (v) => !!v && v.length <= 100 || 'de naam mag maximaal 100 tekens bevatten']"
                             label="Naam"
-                            class="required"
-                            v-model="values.name"></v-text-field>
-                        <v-text-field
+                            v-model="values.name"/>
+                        <VTextField
                             :counter="150"
-                            :rules="[(v) => !!v || 'E-mail is verplicht', v => serverError('email', v), (v) => !!v && v.length <= 100 || 'het e-mailadres mag maximaal 150 tekens bevatten']"
+                            :rules="[(v) => !!v || 'E-mail is verplicht', () => serverError('email'), (v) => !!v && v.length <= 100 || 'het e-mailadres mag maximaal 150 tekens bevatten']"
                             label="E-mail"
                             hint="Het e-mailadres waarmee de gebruiker gaat inloggen en waarnaar een mail verzonden wordt met instructies om een wachtwoord aan te maken"
-                            class="required"
-                            v-model="values.email"></v-text-field>
+                            v-model="values.email"/>
                     </v-card-text>
                 </v-card>
             </v-col>
@@ -26,7 +24,7 @@
 </template>
 
 <script>
-    import Form from './../BaseForm';
+    import Form from '@/components/VuetifyResourceBaseForm.vue';
 
     export default {
         name: 'user-form',

generator/templates/Crud/src/components/forms/User.vue

@@ -0,0 +1,46 @@
+<script>
+import store from '../store';
+import Error from '../store/modules/Error';
+
+export default {
+    name: 'Form',
+    computed: {
+        hasServerError: () => Error.state.errors.length > 0,
+    },
+    watch: {
+        errors: {
+            handler() {
+                this.validate();
+            },
+            deep: true,
+        },
+    },
+    data() {
+        return {
+            valid: false,
+        };
+    },
+    methods: {
+        validate() {
+            this.$refs.form.validate();
+        },
+        clear() {
+            this.$refs.form.reset();
+        },
+        serverError(key) {
+            const error = store.getters['Error/find'](key);
+
+            if (error) {
+                this.removeServerError(key);
+
+                return error;
+            }
+
+            return true;
+        },
+        removeServerError(key) {
+            store.commit('Error/remove', key);
+        },
+    },
+};
+</script>

generator/templates/Authorisation/src/api/util/keyConverter.js renamed to generator/templates/Default/src/api/util/keyConverter.js

@@ -1,6 +1,6 @@
 {
   "name": "vue-cli-plugin-kingscode-scaffold",
-  "version": "0.7.10",
+  "version": "0.8.0",
   "description": "",
   "main": "index.js",
   "scripts": {