add fields, warning smtp

2 files changed, 63 insertions, 6 deletions

diff --git a/src/locales/ru-RU.json b/src/locales/ru-RU.json
index 2c5fd793..4c562e9f 100644
--- a/src/locales/ru-RU.json
+++ b/src/locales/ru-RU.json
@@ -1153,7 +1153,9 @@
       "username": "Имя пользователя",
       "password": "Пароль",
       "host": "SMTP-сервер",
-      "port": "SMTP-порт"
+      "port": "SMTP-порт",
+      "authorization": "Авторизация",
+      "sslEnabled": "Поддержка SSL"
     },
     "table": {
       "userName": "Имя пользователя",
diff --git a/src/views/_sila/Settings/TransferInfo/WarningSmtp.vue b/src/views/_sila/Settings/TransferInfo/WarningSmtp.vue
index 1aa932cd..3b4994c6 100644
--- a/src/views/_sila/Settings/TransferInfo/WarningSmtp.vue
+++ b/src/views/_sila/Settings/TransferInfo/WarningSmtp.vue
@@ -1,7 +1,26 @@
 <template>
   <page-section :section-title="$t('pageTransfer.smtp.smtpTitle')">
-    <b-row class="mt-4">
-      <b-col xs="12" sm="6" lg="4">
+    <b-row class="smtp-warning mb-3">
+      <b-col xs="12" sm="12">
+        <div class="switch-group">
+          <label for="authenticationSwitch">{{
+            $t('pageTransfer.smtp.authorization')
+          }}</label>
+          <b-form-checkbox
+            id="authenticationSwitch"
+            v-model="form.authorization"
+            data-test-id="checkbox-authorization"
+            switch
+            :disabled="$store.getters['authentication/role'] === 'ReadOnly'"
+          >
+            <span v-if="form.authorization">
+              {{ $t('global.status.enabled') }}
+            </span>
+            <span v-else>{{ $t('global.status.disabled') }}</span>
+          </b-form-checkbox>
+        </div>
+      </b-col>
+      <b-col xs="12" sm="12">
         <b-form-group
           :label="$t('pageTransfer.smtp.username')"
           label-for="smtp-name"
@@ -12,7 +31,7 @@
             :disabled="$store.getters['authentication/role'] === 'ReadOnly'"
           /> </b-form-group
       ></b-col>
-      <b-col xs="12" sm="6" lg="4">
+      <b-col xs="12" sm="12">
         <b-form-group
           :label="$t('pageTransfer.smtp.password')"
           label-for="smtp-password"
@@ -27,7 +46,7 @@
           </input-password-toggle>
         </b-form-group>
       </b-col>
-      <b-col xs="12" sm="6" lg="4">
+      <b-col xs="12" sm="12">
         <b-form-group
           :label="$t('pageTransfer.smtp.host')"
           label-for="smtp-host"
@@ -39,7 +58,7 @@
           />
         </b-form-group>
       </b-col>
-      <b-col xs="12" sm="6" lg="4">
+      <b-col xs="12" sm="12">
         <b-form-group
           :label="$t('pageTransfer.smtp.port')"
           label-for="smtp-port"
@@ -52,6 +71,25 @@
           />
         </b-form-group>
       </b-col>
+      <b-col xs="12" sm="12">
+        <div class="switch-group">
+          <label for="sslSwitch">{{
+            $t('pageTransfer.smtp.sslEnabled')
+          }}</label>
+          <b-form-checkbox
+            id="sslSwitch"
+            v-model="form.ssl"
+            data-test-id="checkbox-ssl"
+            switch
+            :disabled="$store.getters['authentication/role'] === 'ReadOnly'"
+          >
+            <span v-if="form.ssl">
+              {{ $t('global.status.enabled') }}
+            </span>
+            <span v-else>{{ $t('global.status.disabled') }}</span>
+          </b-form-checkbox>
+        </div>
+      </b-col>
       <b-col xs="4" class="d-flex justify-content-end align-items-start">
         <b-button variant="primary" @click="saveSmtp">
           {{ $t('global.action.save') }}
@@ -94,6 +132,8 @@ export default {
         password: '',
         host: '',
         port: '',
+        authorization: null,
+        ssl: null,
       },
       fields: [
         {
@@ -126,3 +166,18 @@ export default {
   },
 };
 </script>
+
+<style lang="scss" scoped>
+.switch-group {
+  margin-bottom: 1.5rem;
+}
+.smtp-warning {
+  width: 50%;
+  @media (max-width: 768px) {
+    width: 75%;
+  }
+  @media (max-width: 576px) {
+    width: 100%;
+  }
+}
+</style>