From 37f6f72ff1ed6d4795c3f67ca2ba92367582e562 Mon Sep 17 00:00:00 2001
From: Vitalii Lysak <v.lysak@dunice.net>
Date: Tue, 20 Sep 2022 13:30:30 +0300
Subject: add validation for snmp, smtp, syslog

---
 src/views/_sila/Settings/TransferInfo/Smtp.vue | 110 ++++++++++++++++++++++++-
 1 file changed, 107 insertions(+), 3 deletions(-)

(limited to 'src/views/_sila/Settings/TransferInfo/Smtp.vue')

diff --git a/src/views/_sila/Settings/TransferInfo/Smtp.vue b/src/views/_sila/Settings/TransferInfo/Smtp.vue
index 34d171de..40a182d8 100644
--- a/src/views/_sila/Settings/TransferInfo/Smtp.vue
+++ b/src/views/_sila/Settings/TransferInfo/Smtp.vue
@@ -12,6 +12,7 @@
             data-test-id="checkbox-authorization"
             switch
             :disabled="loading || isNotAdmin"
+            @change="onChangeAuthCheckbox($event)"
           >
             <span v-if="form.is_need_auth">
               {{ $t('global.status.enabled') }}
@@ -29,9 +30,23 @@
             id="smtp-name"
             v-model="form.username"
             type="text"
+            :state="getValidationState($v.form.username)"
             :disabled="loading || isNotAdmin || !form.is_need_auth"
-          /> </b-form-group
-      ></b-col>
+            @input="$v.form.username.$touch()"
+          />
+          <b-form-invalid-feedback role="alert">
+            <template v-if="!$v.form.username.required">
+              {{ $t('global.form.fieldRequired') }}
+            </template>
+            <template v-else-if="!$v.form.username.maxLength">
+              {{ $t('global.form.lengthMustBeBetween', { min: 1, max: 16 }) }}
+            </template>
+            <template v-else-if="!$v.form.username.pattern">
+              {{ $t('global.form.invalidFormat') }}
+            </template>
+          </b-form-invalid-feedback>
+        </b-form-group></b-col
+      >
       <b-col xs="12" sm="6">
         <b-form-group
           :label="$t('pageTransfer.smtp.password')"
@@ -42,8 +57,27 @@
               id="smtp-password"
               v-model="form.password"
               type="password"
+              :state="getValidationState($v.form.password)"
               :disabled="loading || isNotAdmin || !form.is_need_auth"
+              @input="$v.form.password.$touch()"
             />
+            <b-form-invalid-feedback role="alert">
+              <template v-if="!$v.form.password.required">
+                {{ $t('global.form.fieldRequired') }}
+              </template>
+              <template
+                v-if="
+                  !$v.form.password.minLength || !$v.form.password.maxLength
+                "
+              >
+                {{
+                  $t('pageUserManagement.modal.passwordMustBeBetween', {
+                    min: 8,
+                    max: 20,
+                  })
+                }}
+              </template>
+            </b-form-invalid-feedback>
           </input-password-toggle>
         </b-form-group>
       </b-col>
@@ -55,8 +89,18 @@
           <b-form-input
             id="smtp-host"
             v-model="form.host"
+            :state="getValidationState($v.form.host)"
             :disabled="loading || isNotAdmin"
+            @input="$v.form.host.$touch()"
           />
+          <b-form-invalid-feedback role="alert">
+            <template v-if="!$v.form.host.required">
+              {{ $t('global.form.fieldRequired') }}
+            </template>
+            <template v-if="!$v.form.host.ipAddress">
+              {{ $t('global.form.invalidFormat') }}
+            </template>
+          </b-form-invalid-feedback>
         </b-form-group>
       </b-col>
       <b-col xs="12" sm="6">
@@ -68,8 +112,18 @@
             id="smtp-port"
             v-model="form.port"
             type="number"
+            :state="getValidationState($v.form.port)"
             :disabled="loading || isNotAdmin"
+            @input="$v.form.port.$touch()"
           />
+          <b-form-invalid-feedback role="alert">
+            <template v-if="!$v.form.port.required">
+              {{ $t('global.form.fieldRequired') }}
+            </template>
+            <template v-if="!$v.form.port.pattern">
+              {{ $t('global.form.invalidFormat') }}
+            </template>
+          </b-form-invalid-feedback>
         </b-form-group>
       </b-col>
       <b-col xs="12" sm="12">
@@ -165,6 +219,16 @@ import LoadingBarMixin, {
 import IconAdd from '@carbon/icons-vue/es/add--alt/20';
 import IconTrashcan from '@carbon/icons-vue/es/trash-can/20';
 import InputPasswordToggle from '@/components/_sila/Global/InputPasswordToggle';
+import {
+  helpers,
+  ipAddress,
+  maxLength,
+  minLength,
+  required,
+  requiredIf,
+} from 'vuelidate/lib/validators';
+import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js';
+import { isoPortRegex } from '@/utilities/_sila/regexConstants';
 
 export default {
   name: 'Smtp',
@@ -175,7 +239,7 @@ export default {
     TableRowAction,
     InputPasswordToggle,
   },
-  mixins: [BVToastMixin, LoadingBarMixin],
+  mixins: [BVToastMixin, LoadingBarMixin, VuelidateMixin],
 
   data() {
     return {
@@ -236,7 +300,40 @@ export default {
       this.endLoader();
     });
   },
+  validations() {
+    return {
+      form: {
+        username: {
+          required: requiredIf(function () {
+            return this.form.is_need_auth;
+          }),
+          maxLength: maxLength(16),
+          pattern: helpers.regex('pattern', /^([a-zA-Z_][a-zA-Z0-9_]*)/),
+        },
+        password: {
+          required: requiredIf(function () {
+            return this.form.is_need_auth;
+          }),
+          minLength: minLength(8),
+          maxLength: maxLength(20),
+        },
+        host: {
+          required,
+          ipAddress,
+        },
+        port: {
+          required,
+          pattern: helpers.regex('pattern', isoPortRegex),
+        },
+      },
+    };
+  },
   methods: {
+    onChangeAuthCheckbox($event) {
+      if (!$event) {
+        this.resetAuthForm();
+      }
+    },
     onTableAction($event, { host }) {
       if ($event === 'delete') {
         this.deleteSubscriber(host);
@@ -254,6 +351,9 @@ export default {
       this.$bvModal.show('modal-smtp');
     },
     saveSmtp() {
+      this.$v.$touch();
+      if (this.$v.$invalid) return;
+
       this.startLoader();
       if (!this.form.is_need_auth) {
         // eslint-disable-next-line no-unused-vars
@@ -290,6 +390,10 @@ export default {
       this.form.is_need_auth = this.settings.is_need_auth;
       this.form.is_need_ssl = this.settings.is_need_ssl;
     },
+    resetAuthForm() {
+      this.form.username = null;
+      this.form.password = null;
+    },
   },
 };
 </script>
-- 
cgit v1.2.3