lazy evaluation, styles

components/admin/Places.vue

@@ -4,16 +4,18 @@
     v-card-subtitle(v-html="$t('admin.place_description')")
 
     v-dialog(v-model='dialog' width='600')
-      v-card
+      v-card(color='secondary')
         v-card-title {{$t('admin.edit_place')}}
         v-card-text
-          v-form
+          v-form(v-model='valid' ref='form' lazy-validation)
             v-text-field(
+              :rules="[$validators.required('common.name')]"
               :label="$t('common.name')"
               v-model='place.name'
               :placeholder='$t("common.name")')
 
             v-text-field(
+              :rules="[$validators.required('common.address')]"
               :label="$t('common.address')"
               v-model='place.address'
               :placeholder='$t("common.address")')
@@ -21,11 +23,11 @@
         v-card-actions
             v-spacer
             v-btn(@click='dialog=false' color='warning') {{$t('common.cancel')}}
-            v-btn(@click='savePlace' color='primary' :loading='loading' :disable='loading') {{$t('common.save')}}
+            v-btn(@click='savePlace' color='primary' :loading='loading'
+              :disable='!valid || loading') {{$t('common.save')}}
 
     v-card-text
       v-data-table(
-        @click:row='selectPlace'
         :headers='headers'
         :items='places')
         template(v-slot:item.actions='{item}')
@@ -39,6 +41,7 @@ export default {
     return {
       loading: false,
       dialog: false,
+      valid: false,
       place: { name: '', address: '', id: null },
       headers: [
         { value: 'name', text: 'Name' },
@@ -57,6 +60,7 @@ export default {
       this.dialog = true
     },
     async savePlace () {
+      if (!this.$refs.form.validate()) return
       this.loading = true
       await this.$axios.$put('/place', this.place)
       this.updateMeta()

components/admin/Users.vue

@@ -6,15 +6,16 @@
         append-icon='mdi-magnify' outlined rounded
         label='Search'
         single-line hide-details)
-      v-btn(color='primary' text @click='newUserDialog = true') <v-icon>mdi-plus</v-icon> {{$t('common.new_user')}}
+
+    v-btn(color='primary' text @click='newUserDialog = true') <v-icon>mdi-plus</v-icon> {{$t('common.new_user')}}
 
     //- ADD NEW USER
     v-dialog(v-model='newUserDialog' :fullscreen="$vuetify.breakpoint.xsOnly")
 
-      v-card
+      v-card(color='secondary')
         v-card-title {{$t('common.new_user')}}
         v-card-text
-          v-form(v-model='valid')
+          v-form(v-model='valid' ref='user_form' lazy-validation)
             v-text-field(v-model='new_user.email'
               :label="$t('common.email')"
               :rules="$validators.email")
@@ -85,6 +86,7 @@ export default {
       }
     },
     async createUser () {
+      if (!this.$refs.user_form.validate()) return
       try {
         this.loading = true
         const user = await this.$axios.$post('/user', this.new_user)