added select field form option validation

changelog.md

@@ -2,6 +2,7 @@
 
 ## Unreleased
 
+* Added single select field form option validation.
 * Changed all cookies to SameSite=lax.
 
 ## Released (2021-02-04)

web-frontend/modules/database/components/field/FieldSelectOptions.vue

@@ -15,7 +15,9 @@
       <input
         v-model="item.value"
         class="input select-options__value"
+        :class="{ 'input--error': $v.value.$each[index].value.$error }"
         @input="$emit('input', value)"
+        @blur="$v.value.$each[index].value.$touch()"
       />
       <a class="select-options__remove" @click.stop.prevent="remove(index)">
         <i class="fas fa-times"></i>
@@ -33,6 +35,8 @@
 </template>
 
 <script>
+import { required } from 'vuelidate/lib/validators'
+
 import ColorSelectContext from '@baserow/modules/core/components/ColorSelectContext'
 import { colors } from '@baserow/modules/core/utils/colors'
 
@@ -78,5 +82,12 @@ export default {
       this.$emit('input', this.value)
     },
   },
+  validations: {
+    value: {
+      $each: {
+        value: { required },
+      },
+    },
+  },
 }
 </script>

web-frontend/modules/database/components/field/FieldSingleSelectSubForm.vue

@@ -4,6 +4,7 @@
       <label class="control__label control__label--small">Options</label>
       <div class="control__elements">
         <FieldSelectOptions
+          ref="selectOptions"
           v-model="values.select_options"
         ></FieldSelectOptions>
       </div>
@@ -30,7 +31,8 @@ export default {
   },
   methods: {
     isFormValid() {
-      return true
+      this.$refs.selectOptions.$v.$touch()
+      return !this.$refs.selectOptions.$v.$invalid
     },
   },
 }