From 30f4e9777b157fe7023a9cf02c7d53737d2e2974 Mon Sep 17 00:00:00 2001
From: Vitalii Lysak <v.lysak@dunice.net>
Date: Mon, 19 Sep 2022 17:02:28 +0300
Subject: upd syslog and smtp

---
 src/views/_sila/Settings/TransferInfo/Smtp.vue | 174 ++++++++++++++++++++-----
 1 file changed, 139 insertions(+), 35 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 338eeda7..34d171de 100644
--- a/src/views/_sila/Settings/TransferInfo/Smtp.vue
+++ b/src/views/_sila/Settings/TransferInfo/Smtp.vue
@@ -8,30 +8,31 @@
           }}</label>
           <b-form-checkbox
             id="authenticationSwitch"
-            v-model="form.auth"
+            v-model="form.is_need_auth"
             data-test-id="checkbox-authorization"
             switch
-            :disabled="isNotAdmin"
+            :disabled="loading || isNotAdmin"
           >
-            <span v-if="form.auth">
+            <span v-if="form.is_need_auth">
               {{ $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-col xs="12" sm="6">
         <b-form-group
           :label="$t('pageTransfer.smtp.username')"
           label-for="smtp-name"
         >
           <b-form-input
             id="smtp-name"
-            v-model="form.user"
-            :disabled="isNotAdmin || !form.auth"
+            v-model="form.username"
+            type="text"
+            :disabled="loading || isNotAdmin || !form.is_need_auth"
           /> </b-form-group
       ></b-col>
-      <b-col xs="12" sm="12">
+      <b-col xs="12" sm="6">
         <b-form-group
           :label="$t('pageTransfer.smtp.password')"
           label-for="smtp-password"
@@ -41,12 +42,12 @@
               id="smtp-password"
               v-model="form.password"
               type="password"
-              :disabled="isNotAdmin || !form.auth"
+              :disabled="loading || isNotAdmin || !form.is_need_auth"
             />
           </input-password-toggle>
         </b-form-group>
       </b-col>
-      <b-col xs="12" sm="12">
+      <b-col xs="12" sm="6">
         <b-form-group
           :label="$t('pageTransfer.smtp.host')"
           label-for="smtp-host"
@@ -54,11 +55,11 @@
           <b-form-input
             id="smtp-host"
             v-model="form.host"
-            :disabled="isNotAdmin"
+            :disabled="loading || isNotAdmin"
           />
         </b-form-group>
       </b-col>
-      <b-col xs="12" sm="12">
+      <b-col xs="12" sm="6">
         <b-form-group
           :label="$t('pageTransfer.smtp.port')"
           label-for="smtp-port"
@@ -67,7 +68,7 @@
             id="smtp-port"
             v-model="form.port"
             type="number"
-            :disabled="isNotAdmin"
+            :disabled="loading || isNotAdmin"
           />
         </b-form-group>
       </b-col>
@@ -78,12 +79,12 @@
           }}</label>
           <b-form-checkbox
             id="sslSwitch"
-            v-model="form.ssl"
+            v-model="form.is_need_ssl"
             data-test-id="checkbox-ssl"
             switch
             :disabled="isNotAdmin"
           >
-            <span v-if="form.ssl">
+            <span v-if="form.is_need_ssl">
               {{ $t('global.status.enabled') }}
             </span>
             <span v-else>{{ $t('global.status.disabled') }}</span>
@@ -91,24 +92,62 @@
         </div>
       </b-col>
       <b-col xs="4" class="d-flex justify-content-between align-items-start">
-        <b-button variant="secondary" :disabled="isNotAdmin" @click="sendMail">
+        <b-button
+          variant="secondary"
+          :disabled="loading || isNotAdmin"
+          @click="sendMail"
+        >
           {{ $t('pageTransfer.smtp.testMessage') }}
         </b-button>
 
-        <b-button variant="primary" :disabled="isNotAdmin" @click="saveSmtp">
+        <b-button
+          variant="primary"
+          :disabled="loading || isNotAdmin"
+          @click="saveSmtp"
+        >
           {{ $t('global.action.save') }}
         </b-button>
       </b-col>
     </b-row>
     <b-row>
       <b-col>
+        <div class="text-right">
+          <b-button
+            variant="primary"
+            :disabled="loading || isNotAdmin"
+            @click="initAddModal()"
+          >
+            <icon-add />
+            {{ $t('global.action.add') }}
+          </b-button>
+        </div>
         <b-table
-          hover
           responsive="md"
-          show-empty
+          hover
+          :busy="loading"
           :fields="fields"
+          :items="subscribers"
           :empty-text="$t('global.table.emptyMessage')"
+          show-empty
         >
+          <!-- table actions column -->
+          <template #cell(actions)="{ item }">
+            <table-row-action
+              v-for="(action, index) in item.actions"
+              :key="index"
+              :value="action.value"
+              :enabled="action.enabled"
+              :title="action.title"
+              @click-table-action="onTableAction($event, item)"
+            >
+              <template #icon>
+                <icon-trashcan
+                  v-if="action.value === 'delete'"
+                  :data-test-id="`smtp-tableRowAction-delete-${index}`"
+                />
+              </template>
+            </table-row-action>
+          </template>
         </b-table>
       </b-col>
     </b-row>
@@ -118,43 +157,63 @@
 <script>
 import PageSection from '@/components/_sila/Global/PageSection';
 import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin';
-import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
+import TableRowAction from '@/components/_sila/Global/TableRowAction';
+import LoadingBarMixin, {
+  loading,
+} from '@/components/_sila/Mixins/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';
 
 export default {
   name: 'Smtp',
   components: {
+    IconAdd,
+    IconTrashcan,
     PageSection,
+    TableRowAction,
     InputPasswordToggle,
   },
-  mixins: [BVToastMixin, DataFormatterMixin],
+  mixins: [BVToastMixin, LoadingBarMixin],
 
   data() {
     return {
+      loading,
       form: {
-        user: '',
+        username: '',
         password: '',
         host: '',
         port: '',
-        auth: false,
-        ssl: false,
+        is_need_auth: false,
+        is_need_ssl: false,
       },
       fields: [
         {
-          key: 'name',
+          key: 'host',
           label: this.$t('pageTransfer.table.userName'),
-          formatter: this.dataFormatter,
-        },
-        {
-          key: 'value',
-          label: this.$t('pageTransfer.table.value'),
-          formatter: this.dataFormatter,
-          tdClass: 'text-nowrap',
         },
+        { key: 'actions', label: '', tdClass: 'text-right' },
       ],
     };
   },
   computed: {
+    settings() {
+      return this.$store.getters['smtpStore/settings'];
+    },
+    subscribers() {
+      return this.$store.getters['smtpStore/subscribers'].map((subscriber) => {
+        return {
+          ...subscriber,
+          actions: [
+            {
+              value: 'delete',
+              title: this.$t('pageTransfer.smtp.delSubscriber'),
+            },
+          ],
+        };
+      });
+    },
     isNotAdmin() {
       return (
         this.$store.getters['authentication/role'] === 'ReadOnly' ||
@@ -162,18 +221,51 @@ export default {
       );
     },
   },
+  watch: {
+    settings() {
+      this.setForm();
+    },
+  },
+  created() {
+    this.startLoader();
+    Promise.all([
+      this.$store.dispatch('smtpStore/getSettings'),
+      this.$store.dispatch('smtpStore/getSubscribers'),
+    ]).finally(() => {
+      this.setForm();
+      this.endLoader();
+    });
+  },
   methods: {
+    onTableAction($event, { host }) {
+      if ($event === 'delete') {
+        this.deleteSubscriber(host);
+      }
+    },
+    deleteSubscriber(host) {
+      this.startLoader();
+      this.$store
+        .dispatch('smtpStore/deleteSubscriber', host)
+        .then((success) => this.successToast(success))
+        .catch(({ message }) => this.errorToast(message))
+        .finally(() => this.endLoader());
+    },
+    initAddModal() {
+      this.$bvModal.show('modal-smtp');
+    },
     saveSmtp() {
-      if (!this.form.auth) {
+      this.startLoader();
+      if (!this.form.is_need_auth) {
         // eslint-disable-next-line no-unused-vars
-        const { user, password, ...formWithoutCredits } = this.form;
+        const { username, password, ...formWithoutCredits } = this.form;
         this.form = formWithoutCredits;
       }
 
       this.$store
-        .dispatch('smtpStore/setSmtpSettings', this.form)
+        .dispatch('smtpStore/setSettings', this.form)
         .then((message) => this.successToast(message))
-        .catch(({ message }) => this.errorToast(message));
+        .catch(({ message }) => this.errorToast(message))
+        .finally(() => this.endLoader());
     },
     sendMail() {
       this.$store
@@ -186,6 +278,18 @@ export default {
         .then((message) => this.successToast(message))
         .catch(({ message }) => this.errorToast(message));
     },
+    setForm() {
+      if (!this.settings) {
+        return;
+      }
+
+      this.form.username = this.settings.username;
+      this.form.password = this.settings.password;
+      this.form.host = this.settings.host;
+      this.form.port = this.settings.port;
+      this.form.is_need_auth = this.settings.is_need_auth;
+      this.form.is_need_ssl = this.settings.is_need_ssl;
+    },
   },
 };
 </script>
-- 
cgit v1.2.3