move tasks from sila-dev, lysak

14 files changed, 325 insertions, 12 deletions

diff --git a/src/assets/images/_sila/notifications/critical.svg b/src/assets/images/_sila/notifications/critical.svg
new file mode 100644
index 00000000..3ef0a535
--- /dev/null
+++ b/src/assets/images/_sila/notifications/critical.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.00043 1.99173L14.2754 12.8334H1.72543L8.00043 1.99173ZM0.28376 12.0001C-0.357907 13.1084 0.442093 14.5001 1.72543 14.5001H14.2754C15.5588 14.5001 16.3588 13.1084 15.7171 12.0001L9.44209 1.1584C8.80043 0.0500651 7.20043 0.0500651 6.55876 1.1584L0.28376 12.0001ZM7.16709 6.16673V7.8334C7.16709 8.29173 7.54209 8.66673 8.00043 8.66673C8.45876 8.66673 8.83376 8.29173 8.83376 7.8334V6.16673C8.83376 5.7084 8.45876 5.3334 8.00043 5.3334C7.54209 5.3334 7.16709 5.7084 7.16709 6.16673ZM7.16709 10.3334H8.83376V12.0001H7.16709V10.3334Z" fill="#FF4141"/>
+</svg>
diff --git a/src/assets/images/_sila/notifications/message.svg b/src/assets/images/_sila/notifications/message.svg
new file mode 100644
index 00000000..e1e274ab
--- /dev/null
+++ b/src/assets/images/_sila/notifications/message.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.941177 1.57887C0.941177 1.28822 1.15187 1.05258 1.41176 1.05258H14.5882C14.8481 1.05258 15.0588 1.28822 15.0588 1.57887V10.3278C15.0588 10.6184 14.8481 10.854 14.5882 10.854H3.5107L0.941177 13.5619V1.57887ZM1.41176 1.11744e-05C0.632065 1.11744e-05 0 0.706899 0 1.57887V16L3.88426 11.9066H14.5882C15.3679 11.9066 16 11.1997 16 10.3278V1.57887C16 0.706899 15.3679 1.11744e-05 14.5882 1.11744e-05H1.41176ZM4.5 3.05041C4.22386 3.05041 4 3.31393 4 3.63902C4 3.96412 4.22386 4.22764 4.5 4.22764H11.5C11.7761 4.22764 12 3.96412 12 3.63902C12 3.31393 11.7761 3.05041 11.5 3.05041H4.5ZM4 5.9935C4 5.6684 4.22386 5.40488 4.5 5.40488H11.5C11.7761 5.40488 12 5.6684 12 5.9935C12 6.31859 11.7761 6.58211 11.5 6.58211H4.5C4.22386 6.58211 4 6.31859 4 5.9935ZM4.5 7.75935C4.22386 7.75935 4 8.02287 4 8.34797C4 8.67307 4.22386 8.93659 4.5 8.93659H11.5C11.7761 8.93659 12 8.67307 12 8.34797C12 8.02287 11.7761 7.75935 11.5 7.75935H4.5Z" fill="#1A3E5B" fill-opacity="0.6"/>
+</svg>
diff --git a/src/assets/images/_sila/notifications/right-arrow.svg b/src/assets/images/_sila/notifications/right-arrow.svg
new file mode 100644
index 00000000..fe1ae951
--- /dev/null
+++ b/src/assets/images/_sila/notifications/right-arrow.svg
@@ -0,0 +1,3 @@
+<svg width="7" height="10" viewBox="0 0 7 10" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0.758398 0.591482C0.433398 0.916482 0.433398 1.44148 0.758398 1.76648L3.99173 4.99981L0.758398 8.23315C0.433398 8.55815 0.433398 9.08315 0.758398 9.40815C1.0834 9.73315 1.6084 9.73315 1.9334 9.40815L5.7584 5.58315C6.0834 5.25815 6.0834 4.73315 5.7584 4.40815L1.9334 0.583148C1.61673 0.266481 1.0834 0.266482 0.758398 0.591482Z" fill="#0C1C29" fill-opacity="0.6"/>
+</svg>
diff --git a/src/assets/images/_sila/notifications/warning.svg b/src/assets/images/_sila/notifications/warning.svg
new file mode 100644
index 00000000..6a93b99f
--- /dev/null
+++ b/src/assets/images/_sila/notifications/warning.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="15" viewBox="0 0 16 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.00043 1.99173L14.2754 12.8334H1.72543L8.00043 1.99173ZM0.28376 12.0001C-0.357907 13.1084 0.442093 14.5001 1.72543 14.5001H14.2754C15.5588 14.5001 16.3588 13.1084 15.7171 12.0001L9.44209 1.1584C8.80043 0.0500651 7.20043 0.0500651 6.55876 1.1584L0.28376 12.0001ZM7.16709 6.16673V7.8334C7.16709 8.29173 7.54209 8.66673 8.00043 8.66673C8.45876 8.66673 8.83376 8.29173 8.83376 7.8334V6.16673C8.83376 5.7084 8.45876 5.3334 8.00043 5.3334C7.54209 5.3334 7.16709 5.7084 7.16709 6.16673ZM7.16709 10.3334H8.83376V12.0001H7.16709V10.3334Z" fill="#F0AC0C"/>
+</svg>
diff --git a/src/assets/styles/bmc/custom/_kvm.scss b/src/assets/styles/bmc/custom/_kvm.scss
index a7223844..74b61c7e 100644
--- a/src/assets/styles/bmc/custom/_kvm.scss
+++ b/src/assets/styles/bmc/custom/_kvm.scss
@@ -1,12 +1,16 @@
 #terminal-kvm {
-  height: calc(100vh - 300px);
+  height: 100vw;
   display: flex;
   &.full-window {
-   height: calc(100vh - 80px); 
+    height: calc(100vh - 80px);
   }
   div:nth-child(1) {
     background: transparent !important;
     display: block !important;
     overflow: hidden !important;
+    canvas {
+      max-height: 579px;
+      max-width: 740px;
+    }
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/_sila/AppHeader/AppHeader.vue b/src/components/_sila/AppHeader/AppHeader.vue
index 22be55c7..dbda7365 100644
--- a/src/components/_sila/AppHeader/AppHeader.vue
+++ b/src/components/_sila/AppHeader/AppHeader.vue
@@ -76,6 +76,101 @@
               <span class="responsive-text">{{ $t('appHeader.refresh') }}</span>
             </b-button>
           </li>
+          <li class="nav-item notifications">
+            <b-dropdown id="app-notifications" variant="link" right>
+              <template #button-content>
+                <icon-notification :title="$t('appHeader.titleNotification')" />
+                <span v-if="isLogsExist" class="red-dot"></span>
+              </template>
+              <b-dropdown-text v-if="!isLogsExist">
+                {{ $t('appHeader.titleEmpty') }}
+              </b-dropdown-text>
+              <b-dropdown-group
+                v-if="logs('Critical') && logs('Critical').length > 0"
+                id="dropdown-group-1"
+                :header="$t('appHeader.titleCritical')"
+              >
+                <b-dropdown-item
+                  v-for="(log, index) in logs('Critical')"
+                  :key="index"
+                  :to="logsPage(log.id)"
+                >
+                  <img
+                    class="status-icon"
+                    src="@/assets/images/_sila/notifications/critical.svg"
+                  />
+                  <div class="notification-item">
+                    <span>{{ log.name | truncate(28, '...') }}</span>
+                    <span class="notification-desc">{{
+                      log.description | truncate(28, '...')
+                    }}</span>
+                  </div>
+                  <img
+                    class="arrow-icon"
+                    src="@/assets/images/_sila/notifications/right-arrow.svg"
+                  />
+                </b-dropdown-item>
+              </b-dropdown-group>
+              <b-dropdown-divider
+                v-if="logs('Critical') && logs('Critical').length > 0"
+              ></b-dropdown-divider>
+              <b-dropdown-group
+                v-if="logs('Warning') && logs('Warning').length > 0"
+                id="dropdown-group-2"
+                :header="$t('appHeader.titleWarnings')"
+              >
+                <b-dropdown-item
+                  v-for="(log, index) in logs('Warning')"
+                  :key="index"
+                  :to="logsPage(log.id)"
+                >
+                  <img
+                    class="status-icon"
+                    src="@/assets/images/_sila/notifications/warning.svg"
+                  />
+                  <div class="notification-item">
+                    <span>{{ log.name | truncate(28, '...') }}</span>
+                    <span class="notification-desc">{{
+                      log.description | truncate(28, '...')
+                    }}</span>
+                  </div>
+                  <img
+                    class="arrow-icon"
+                    src="@/assets/images/_sila/notifications/right-arrow.svg"
+                  />
+                </b-dropdown-item>
+              </b-dropdown-group>
+              <b-dropdown-divider
+                v-if="logs('Warning') && logs('Warning').length > 0"
+              ></b-dropdown-divider>
+              <b-dropdown-group
+                v-if="logs('OK') && logs('OK').length > 0"
+                id="dropdown-group-3"
+                :header="$t('appHeader.titleMessages')"
+              >
+                <b-dropdown-item
+                  v-for="(log, index) in logs('OK')"
+                  :key="index"
+                  :to="logsPage(log.id)"
+                >
+                  <img
+                    class="status-icon"
+                    src="@/assets/images/_sila/notifications/message.svg"
+                  />
+                  <div class="notification-item">
+                    <span>{{ log.name | truncate(28, '...') }}</span>
+                    <span class="notification-desc">{{
+                      log.description | truncate(28, '...')
+                    }}</span>
+                  </div>
+                  <img
+                    class="arrow-icon"
+                    src="@/assets/images/_sila/notifications/right-arrow.svg"
+                  />
+                </b-dropdown-item>
+              </b-dropdown-group>
+            </b-dropdown>
+          </li>
           <li class="nav-item">
             <b-dropdown
               id="app-header-user"
@@ -113,6 +208,7 @@ import IconAvatar from '@carbon/icons-vue/es/user--avatar/20';
 import IconClose from '@carbon/icons-vue/es/close/20';
 import IconMenu from '@carbon/icons-vue/es/menu/20';
 import IconRenew from '@carbon/icons-vue/es/renew/20';
+import IconNotification from '@carbon/icons-vue/es/notification/20';
 import StatusIcon from '@/components/Global/StatusIcon';
 import LoadingBar from '@/components/Global/LoadingBar';
 
@@ -125,6 +221,7 @@ export default {
     IconRenew,
     StatusIcon,
     LoadingBar,
+    IconNotification,
   },
   mixins: [BVToastMixin],
   props: {
@@ -140,6 +237,12 @@ export default {
     };
   },
   computed: {
+    isLogsExist() {
+      return (
+        this.$store.getters['eventLog/allEvents'] &&
+        this.$store.getters['eventLog/allEvents'].length > 0
+      );
+    },
     isNavTagPresent() {
       return this.assetTag || this.modelType || this.serialNumber;
     },
@@ -213,6 +316,16 @@ export default {
     );
   },
   methods: {
+    logsPage(id) {
+      return `/logs/event-logs?search=${id}`;
+    },
+    logs(type) {
+      let logs = this.$store.getters['eventLog/allEvents'].filter((log) => {
+        return log.severity === type;
+      });
+
+      return logs.reverse().slice(0, 5);
+    },
     getSystemInfo() {
       this.$store.dispatch('global/getSystemInfo');
     },
@@ -357,6 +470,8 @@ export default {
 
   .dropdown-menu {
     margin-top: 0;
+    overflow-y: auto;
+    max-height: 600px;
 
     @include media-breakpoint-only(md) {
       margin-top: 4px;
@@ -379,4 +494,90 @@ export default {
     outline: 0;
   }
 }
+
+.notifications {
+  .dropdown-toggle::after {
+    display: none;
+  }
+
+  .dropdown-menu {
+    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
+    width: 256px;
+  }
+
+  .dropdown-header {
+    font-style: normal;
+    font-weight: 700;
+    font-size: 12px;
+    line-height: 16px;
+    text-transform: uppercase;
+    color: #0c1c29;
+    padding: 15px 15px 0 15px;
+  }
+  #dropdown-group-1,
+  #dropdown-group-2,
+  #dropdown-group-3 {
+    padding: 15px 15px 5px 15px;
+  }
+
+  .notification-item {
+    display: flex;
+    flex-direction: column;
+    font-style: normal;
+    font-weight: 600;
+    font-size: 12px;
+    line-height: 16px;
+    color: #0c1c29;
+    white-space: normal;
+  }
+
+  .notification-desc {
+    font-style: normal;
+    font-weight: 300;
+    font-size: 12px;
+    line-height: 16px;
+    color: rgba(12, 28, 41, 0.6);
+  }
+
+  .dropdown-item {
+    display: flex;
+    padding: 0.25rem;
+  }
+
+  .list-unstyled {
+    li {
+      margin-bottom: 5px;
+    }
+  }
+
+  .status-icon {
+    align-self: self-start;
+    padding-top: 3px;
+    margin-right: 6px;
+  }
+
+  .arrow-icon {
+    margin-left: auto;
+  }
+
+  .dropdown-divider {
+    margin: 0;
+  }
+
+  .red-dot {
+    position: absolute;
+    top: 4px;
+    right: 12px;
+    height: 12px;
+    width: 12px;
+    background-color: #e11717;
+    border-radius: 50%;
+    display: inline-block;
+  }
+
+  .display--none {
+    display: none;
+  }
+}
 </style>
diff --git a/src/components/_sila/Global/Search.vue b/src/components/_sila/Global/Search.vue
index c25224a7..79a403ad 100644
--- a/src/components/_sila/Global/Search.vue
+++ b/src/components/_sila/Global/Search.vue
@@ -82,15 +82,45 @@ export default {
       searchBy: 'all',
     };
   },
+  computed: {
+    params() {
+      const hash = window.location.hash;
+
+      if (!hash || hash.indexOf('?') === -1) {
+        return;
+      }
+
+      const paramsString = window.location.hash.split('?')[1];
+      return new URLSearchParams(paramsString);
+    },
+  },
+  created() {
+    this.search();
+  },
   methods: {
     onSelect() {
       this.$emit('search-by', this.searchBy);
     },
+    removeSearchParam() {
+      window.location.href = '/#/logs/event-logs';
+    },
+    search() {
+      if (!this.params) {
+        return;
+      }
+
+      let search = this.params.get('search');
+      if (search) {
+        this.filter = search;
+        this.onChangeInput();
+      }
+    },
     onChangeInput() {
       this.$emit('change-search', this.filter);
     },
     onClearSearch() {
       this.filter = '';
+      this.removeSearchParam();
       this.$emit('clear-search');
       this.$refs.searchInput.focus();
     },
diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index 02d72e09..dfee7375 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -106,7 +106,12 @@
     "titleHideNavigation": "Hide navigation",
     "titleShowNavigation": "Show navigation",
     "titleProfile": "Show profile menu",
-    "titleRefresh": "Refresh application data"
+    "titleRefresh": "Refresh application data",
+    "titleNotification": "Show notifications",
+    "titleCritical": "Critical",
+    "titleWarnings": "Warnings",
+    "titleMessages": "Messages",
+    "titleEmpty": "No notifications"
   },
   "appNavigation": {
     "system":"System",
@@ -234,7 +239,8 @@
     },
     "toast": {
       "errorSaveDateTime": "Error saving date and time settings.",
-      "successSaveDateTime": "Successfully saved date and time settings."
+      "successSaveDateTime": "Successfully saved date and time settings.",
+      "delaySaveDateTime": "Update the page after 10 seconds to apply the changes."
     }
   },
   "pageDumps": {
diff --git a/src/locales/ru-RU.json b/src/locales/ru-RU.json
index cb1523aa..f540cf4e 100644
--- a/src/locales/ru-RU.json
+++ b/src/locales/ru-RU.json
@@ -106,7 +106,12 @@
     "titleHideNavigation": "Спрятать навигацию",
     "titleShowNavigation": "Показать навигацию",
     "titleProfile": "Показать меню профиля",
-    "titleRefresh": "Обновить данные веб-приложения"
+    "titleRefresh": "Обновить данные веб-приложения",
+    "titleNotification": "Показать уведомления",
+    "titleCritical": "Критические",
+    "titleWarnings": "Предупреждения",
+    "titleMessages": "Сообщения",
+    "titleEmpty": "Нет уведомлений"
   },
   "appNavigation": {
     "system": "Система",
@@ -233,7 +238,8 @@
     },
     "toast": {
       "errorSaveDateTime": "Ошибка сохранения настроек даты и времени.",
-      "successSaveDateTime": "Настройки даты и времени сохранены."
+      "successSaveDateTime": "Настройки даты и времени сохранены.",
+      "delaySaveDateTime": "Чтобы применить изменения, обновите страницу через 10 секунд."
     }
   },
 
diff --git a/src/main.js b/src/main.js
index 8585f897..ca17b958 100644
--- a/src/main.js
+++ b/src/main.js
@@ -85,6 +85,16 @@ Vue.filter('formatTime', function (value) {
   }
 });
 
+Vue.filter('truncate', function (text, length, suffix) {
+  const arrRaw = text.split(' ');
+  const arr = arrRaw.filter((word) => word !== '');
+  if (arr.length > length) {
+    return arr.splice(0, length).join(' ') + suffix;
+  } else {
+    return text;
+  }
+});
+
 // Plugins
 Vue.use(AlertPlugin);
 Vue.use(BadgePlugin);
diff --git a/src/store/modules/Settings/DateTimeStore.js b/src/store/modules/Settings/DateTimeStore.js
index 51b722a8..84535f94 100644
--- a/src/store/modules/Settings/DateTimeStore.js
+++ b/src/store/modules/Settings/DateTimeStore.js
@@ -68,7 +68,10 @@ const DateTimeStore = {
           }
         })
         .then(() => {
-          return i18n.t('pageDateTime.toast.successSaveDateTime');
+          return [
+            i18n.t('pageDateTime.toast.successSaveDateTime'),
+            i18n.t('pageDateTime.toast.delaySaveDateTime'),
+          ];
         })
         .catch((error) => {
           console.log(error);
diff --git a/src/utilities/_sila/transformSensorName.js b/src/utilities/_sila/transformSensorName.js
new file mode 100644
index 00000000..76f53b6f
--- /dev/null
+++ b/src/utilities/_sila/transformSensorName.js
@@ -0,0 +1,20 @@
+export default function (sensorName) {
+  switch (true) {
+    case sensorName.includes('Pwm'):
+      sensorName = sensorName.replace(
+        sensorName,
+        `CPU ${sensorName.split(' ')[1]} Fan Pwm`
+      );
+      break;
+    case sensorName.includes('System'):
+      sensorName = sensorName.replace(
+        sensorName,
+        `System Fan ${sensorName.split(' ')[2]} Pwm`
+      );
+      break;
+    case sensorName.includes('CPU'):
+      sensorName = sensorName.replace(/cpu/gi, 'CPU ');
+      break;
+  }
+  return sensorName;
+}
diff --git a/src/views/_sila/Operations/Kvm/KvmConsole.vue b/src/views/_sila/Operations/Kvm/KvmConsole.vue
index 50cbff7f..603aa115 100644
--- a/src/views/_sila/Operations/Kvm/KvmConsole.vue
+++ b/src/views/_sila/Operations/Kvm/KvmConsole.vue
@@ -1,8 +1,12 @@
 <template>
   <div :class="marginClass">
     <div ref="toolbar" class="kvm-toolbar">
-      <b-row class="d-flex">
-        <b-col class="d-flex flex-column justify-content-end" cols="4">
+      <b-row class="d-flex flex-column flex-sm-row">
+        <b-col
+          class="d-flex flex-column justify-content-end console-title"
+          style="min-width: 105px"
+          cols="3"
+        >
           <dl class="mb-2" sm="2" md="2">
             <dt class="d-inline font-weight-bold mr-1">
               {{ $t('pageKvm.status') }}:
@@ -14,9 +18,10 @@
           </dl>
         </b-col>
 
-        <b-col class="d-flex justify-content-end pr-1">
+        <b-col class="d-flex justify-content-end pr-1 flex-column flex-sm-row">
           <b-button
             v-if="isConnected"
+            class="console-title console-button"
             variant="link"
             type="button"
             @click="sendCtrlAltDel"
@@ -26,6 +31,7 @@
           </b-button>
           <b-button
             v-if="!isFullWindow"
+            class="console-title console-button"
             variant="link"
             type="button"
             @click="openConsoleWindow()"
@@ -167,4 +173,16 @@ export default {
 .margin-left-full-window {
   margin-left: 5px;
 }
+
+@media (max-width: 1200px) {
+  .console-title {
+    font-size: 0.7rem;
+  }
+}
+
+@media (max-width: 576px) {
+  .console-button {
+    justify-content: flex-end;
+  }
+}
 </style>
diff --git a/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue b/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
index 9886eff5..df11e76e 100644
--- a/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
+++ b/src/views/_sila/Operations/VirtualMedia/ModalConfigureConnection.vue
@@ -11,12 +11,15 @@
     </template>
     <b-form>
       <b-form-group
-        :label="$t('pageVirtualMedia.modal.serverUri')"
+        :label="
+          $t('pageVirtualMedia.modal.serverUri') + ' (http, ftp, smb, nfs)'
+        "
         label-for="serverUri"
       >
         <b-form-input
           id="serverUri"
           v-model="form.serverUri"
+          placeholder="https://"
           type="text"
           :state="getValidationState($v.form.serverUri)"
           data-test-id="configureConnection-input-serverUri"