ayanova/src/views/ops-notification-settings.vue

@@ -1,10 +1,5 @@
 <template>
-  <v-row v-if="formState.ready">
+  <v-container fluid>
-    <v-col>
-      <v-form ref="form">
-        <v-row>
-          <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
-        </v-row>
     <v-row justify="center">
       <v-dialog v-model="testDialog" persistent max-width="600px">
         <v-card>
@@ -17,7 +12,7 @@
                 <v-col cols="12">
                   <v-text-field
                     v-model="testAddress"
-                        :label="$ay.t('testToAddress')"
+                    :label="$ay.t('TestToAddress')"
                     required
                     hint="test_send_to@example.com"
                   ></v-text-field>
@@ -41,9 +36,133 @@
         </v-card>
       </v-dialog>
     </v-row>
+    <v-row v-if="formState.ready">
+      <v-col>
+        <v-form ref="form">
+          <v-row>
+            <gz-error :errorBoxMessage="formState.errorBoxMessage"></gz-error>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-checkbox
+                v-model="obj.smtpDeliveryActive"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :label="$ay.t('SmtpDeliveryActive')"
+                :persistent-hint="true"
+                ref="smtpDeliveryActive"
+                :error-messages="
+                  form().serverErrors(this, 'smtpDeliveryActive')
+                "
+                @change="fieldValueChanged('smtpDeliveryActive')"
+              ></v-checkbox>
+            </v-col>
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.smtpServerAddress"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :clearable="!formState.readOnly"
+                @click:clear="fieldValueChanged('smtpServerAddress')"
+                :label="$ay.t('SmtpServerAddress')"
+                :rules="[form().required(this, 'smtpServerAddress')]"
+                :error-messages="form().serverErrors(this, 'smtpServerAddress')"
+                ref="smtpServerAddress"
+                :data-cy="!!$ay.dev ? 'smtpServerAddress' : false"
+                @input="fieldValueChanged('smtpServerAddress')"
+              ></v-text-field>
+            </v-col>
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.smtpAccount"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :clearable="!formState.readOnly"
+                @click:clear="fieldValueChanged('smtpAccount')"
+                :label="$ay.t('SmtpAccount')"
+                :rules="[form().required(this, 'smtpAccount')]"
+                :error-messages="form().serverErrors(this, 'smtpAccount')"
+                ref="smtpAccount"
+                :data-cy="!!$ay.dev ? 'smtpAccount' : false"
+                @input="fieldValueChanged('smtpAccount')"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.smtpPassword"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :clearable="!formState.readOnly"
+                @click:clear="fieldValueChanged('smtpPassword')"
+                :label="$ay.t('SmtpPassword')"
+                :rules="[form().required(this, 'smtpPassword')]"
+                :error-messages="form().serverErrors(this, 'smtpPassword')"
+                ref="smtpPassword"
+                :data-cy="!!$ay.dev ? 'smtpPassword' : false"
+                @input="fieldValueChanged('smtpPassword')"
+              ></v-text-field>
+            </v-col>
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-select
+                v-model="obj.connectionSecurity"
+                :items="selectLists.NotifyMailSecurity"
+                item-text="name"
+                item-value="id"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :label="$ay.t('ConnectionSecurity')"
+                ref="connectionSecurity"
+                :data-cy="!!$ay.dev ? 'connectionSecurity' : false"
+                :rules="[
+                  form().integerValid(this, 'connectionSecurity'),
+                  form().required(this, 'connectionSecurity')
+                ]"
+                :error-messages="
+                  form().serverErrors(this, 'connectionSecurity')
+                "
+                @input="fieldValueChanged('connectionSecurity')"
+              ></v-select>
+            </v-col>
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.smtpServerPort"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :clearable="!formState.readOnly"
+                @click:clear="fieldValueChanged('smtpServerPort')"
+                :label="$ay.t('SmtpServerPort')"
+                :rules="[
+                  form().integerValid(this, 'smtpServerPort'),
+                  form().required(this, 'smtpServerPort')
+                ]"
+                :error-messages="form().serverErrors(this, 'smtpServerPort')"
+                ref="smtpServerPort"
+                :data-cy="!!$ay.dev ? 'smtpServerPort' : false"
+                @input="fieldValueChanged('smtpServerPort')"
+                type="number"
+              ></v-text-field>
+            </v-col>
+
+            <v-col cols="12" sm="6" lg="4" xl="3">
+              <v-text-field
+                v-model="obj.notifyFromAddress"
+                :readonly="formState.readOnly"
+                :disabled="formState.readOnly"
+                :clearable="!formState.readOnly"
+                @click:clear="fieldValueChanged('notifyFromAddress')"
+                :label="$ay.t('NotifyFromAddress')"
+                :rules="[form().required(this, 'notifyFromAddress')]"
+                :error-messages="form().serverErrors(this, 'notifyFromAddress')"
+                ref="notifyFromAddress"
+                :data-cy="!!$ay.dev ? 'notifyFromAddress' : false"
+                @input="fieldValueChanged('notifyFromAddress')"
+              ></v-text-field>
+            </v-col>
+          </v-row>
         </v-form>
       </v-col>
     </v-row>
+  </v-container>
 </template>
 
 <script>
@@ -121,17 +240,19 @@ namespace AyaNova.Models
     return {
       testAddress: null,
       testDialog: false,
-      formCustomTemplateKey: null,
+      selectLists: {
+        NotifyMailSecurity: []
+      },
       obj: {
         id: 1,
         concurrency: 0,
-        SmtpDeliveryActive: null,
+        smtpDeliveryActive: null,
-        SmtpServerAddress: null,
+        smtpServerAddress: null,
-        SmtpAccount: null,
+        smtpAccount: null,
-        SmtpPassword: null,
+        smtpPassword: null,
-        ConnectionSecurity: null,
+        connectionSecurity: null,
-        SmtpServerPort: null,
+        smtpServerPort: null,
-        NotifyFromAddress: null
+        notifyFromAddress: null
       },
       formState: {
         ready: false,
@@ -330,6 +451,7 @@ function generateMenu(vm) {
 //
 async function initForm(vm) {
   await fetchTranslatedText(vm);
+  await populateSelectionLists(vm);
 }
 
 //////////////////////////////////////////////////////////
@@ -337,19 +459,27 @@ async function initForm(vm) {
 //
 async function fetchTranslatedText(vm) {
   await window.$gz.translation.cacheTranslations([
-    "BackupSettings",
+    "TestSMTPSettings",
-    "BackupTime",
+    "TestToAddress",
-    "BackupLast",
+    "SmtpDeliveryActive",
-    "BackupSetsToKeep",
+    "SmtpServerAddress",
-    "BackupAttachments",
+    "SmtpAccount",
-    "BackupFiles",
+    "SmtpPassword",
-    "BackupNow",
+    "ConnectionSecurity",
-    "AreYouSureBackupNow",
+    "SmtpServerPort",
-    "FileName",
+    "NotifyFromAddress"
-    "FileSize",
-    "FileDate",
-    "AvailableSpace"
   ]);
 }
+
+//////////////////////
+//
+//
+async function populateSelectionLists(vm) {
+  await window.$gz.enums.fetchEnumList("NotifyMailSecurity"); //prefetch
+  //populate
+  vm.selectLists.NotifyMailSecurity = window.$gz.enums.getSelectionList(
+    "NotifyMailSecurity"
+  );
+}
 </script>