conditional rules for add and edit macro category

HelgeKeck · Aug 5, 2024 · 3dd9519 · 3dd9519
1 parent b3dd830
commit 3dd9519
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 11 deletions.
diff --git a/src/components/settings/macros/MacroCategoryDialog.vue b/src/components/settings/macros/MacroCategoryDialog.vue
@@ -14,10 +14,7 @@
           dense
           filled
           hide-details
-          :rules="[
-            $rules.required,
-            // customRules.uniqueName
-          ]"
+          :rules="rules"
           required
         />
       </app-setting>
@@ -59,8 +56,8 @@
 </template>
 
 <script lang="ts">
-import type { MacroCategory } from '@/store/macros/types'
 import { Component, Vue, Prop, VModel } from 'vue-property-decorator'
+import type { InputValidationRules } from 'vuetify'
 
 @Component({})
 export default class MacroCategoryDialog extends Vue {
@@ -82,16 +79,13 @@ export default class MacroCategoryDialog extends Vue {
   @Prop({ type: Boolean, required: true })
   readonly visible!: boolean
 
+  @Prop({ type: Array<InputValidationRules> })
+  readonly rules?: InputValidationRules[]
+
   newName = ''
   newColor = ''
   newVisible = true
 
-  get customRules () {
-    return {
-      uniqueName: (v: string) => this.categories.findIndex((c: MacroCategory) => c.name.toLowerCase() === v.toLowerCase()) < 0 || this.$t('app.general.simple_form.error.exists')
-    }
-  }
-
   mounted () {
     this.newName = this.name
     this.newColor = this.color

diff --git a/src/components/settings/macros/MacroSettings.vue b/src/components/settings/macros/MacroSettings.vue
@@ -120,6 +120,7 @@
         :name="categoryDialogState.name"
         :color="categoryDialogState.color"
         :visible="categoryDialogState.visible"
+        :rules="categoryDialogState.rules"
         @save="categoryDialogState.handler"
       />
     </v-card>
@@ -144,6 +145,9 @@ export default class MacroSettings extends Mixins(StateMixin) {
     label: '',
     category: null,
     name: '',
+    color: '',
+    visible: true,
+    rules: [],
     handler: this.handleAddCategory
   }
 
@@ -174,6 +178,10 @@ export default class MacroSettings extends Mixins(StateMixin) {
       name: '',
       color: '',
       visible: true,
+      rules: [
+        this.$rules.required,
+        this.customRules.uniqueName
+      ],
       handler: this.handleAddCategory
     }
   }
@@ -187,6 +195,9 @@ export default class MacroSettings extends Mixins(StateMixin) {
       name: category.name,
       color: category.color ?? '',
       visible: category.visible,
+      rules: [
+        this.$rules.required
+      ],
       handler: this.handleEditCategory
     }
   }
@@ -220,5 +231,11 @@ export default class MacroSettings extends Mixins(StateMixin) {
     }
     this.$store.dispatch('macros/saveCategory', newCategory)
   }
+
+  get customRules () {
+    return {
+      uniqueName: (v: string) => this.categories.findIndex((c: MacroCategory) => c.name.toLowerCase() === v.toLowerCase()) < 0 || this.$t('app.general.simple_form.error.exists')
+    }
+  }
 }
 </script>