bfg-common 1.6.77 → 1.6.78

package/components/common/wizards/vm/migrate/vmOrigin/New.vue

@@ -1,12 +1,17 @@
 <template>
-  <div class="tooltip-info">
-    <span class="tooltip-info__title">{{ localization.common.vmOrigin }}</span>
+  <div :class="['tooltip-info', { isOpen: isShowTooltipLocal }]">
+    <span
+      class="tooltip-info__title"
+      @click.stop="isShowTooltipLocal = !isShowTooltipLocal"
+    >
+      {{ localization.common.vmOrigin }}
+    </span>
     <ui-icon
       id="vm-origin-info-trigger"
-      :class="['tooltip-info__icon pointer', { active: isShowTooltipLocal }]"
+      class="tooltip-info__icon pointer"
       name="info"
-      width="20"
-      height="20"
+      width="16"
+      height="16"
       @click.stop="isShowTooltipLocal = !isShowTooltipLocal"
     />
     <ui-popup-window
@@ -40,7 +45,7 @@
                 :key="item2.name"
                 class="flex items-center mt-2"
               >
-                <span :class="item2.iconName"></span>
+                <span :class="['icon-row', item2.iconName]"></span>
                 <span class="item-name">{{ item2.name }}</span>
               </div>
             </div>
@@ -67,22 +72,29 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 @import 'assets/scss/common/mixins.scss';
 .tooltip-info {
   @include flex($align: center);
+  column-gap: 8px;
+  &:hover {
+    .tooltip-info__title,
+    .tooltip-info__icon {
+      color: var(--close-icon);
+      cursor: pointer;
+    }
+  }
+  &.isOpen {
+    .tooltip-info__title,
+    .tooltip-info__icon {
+      color: var(--btn-primary-fill-bg-color);
+    }
+  }
   &__title {
     font-family: 'Inter', sans-serif;
-    color: var(--title-form-first-color);
+    color: #9da6ad; // for dark and light mode
     font-weight: 500;
     font-size: 12px;
     white-space: nowrap;
-    margin-right: 4px;
   }
   &__icon {
     color: var(--form-icon-color);
-    &:hover {
-      color: var(--close-icon);
-    }
-    &.active {
-      color: var(--btn-primary-fill-bg-color);
-    }
   }
 
   .common-widget-info {
@@ -99,14 +111,22 @@ const localization = computed<UI_I_Localization>(() => useLocal())
     &__content {
       .item-row {
         margin-top: 12px;
+        &:first-child {
+          margin-top: 20px;
+        }
       }
       .title-row {
         font-family: 'Inter', sans-serif;
-        color: var(--title-form-second-color);
+        color: #9da6ad; // for dark and light mode
         font-weight: 500;
         font-size: 13px;
+        line-height: 18px;
         margin-bottom: 8px;
       }
+      .icon-row {
+        width: 20px;
+        height: 20px;
+      }
 
       .item-name {
         font-family: 'Inter', sans-serif;

package/lib/models/store/tasks/enums.ts

@@ -3,6 +3,9 @@ export enum UI_E_RecentTaskStatus {
   'running',
   'completed',
   'failed',
+  'canceled',
+  'retrying',
+  'warning',
 }
 
 export enum UI_E_IconNameByRecentTaskStatus {

package/lib/models/store/tasks/types.ts

@@ -1,8 +1,9 @@
 export type UI_T_TasksStateLoading = 'tasks' | 'recentTasks'
 export type UI_T_TaskStatus =
-    0 | // queued
-    1 | // running
-    2 | // completed
-    3 | // failed
-    4 | // canceled
-    5 // retrying
+  | 0 // queued
+  | 1 // running
+  | 2 // completed
+  | 3 // failed
+  | 4 // canceled
+  | 5 // retrying
+  | 6 // warning

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bfg-common",
   "private": false,
-  "version": "1.6.77",
+  "version": "1.6.78",
   "scripts": {
     "build": "nuxt build",
     "dev": "nuxt dev --port=3002",
@@ -18,7 +18,7 @@
     "@vueuse/core": "10.1.2",
     "@vueuse/nuxt": "10.1.2",
     "bfg-nuxt-3-graph": "1.0.28",
-    "bfg-uikit": "1.1.33",
+    "bfg-uikit": "1.1.32",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-myrules": "file:./eslint",
     "nuxt": "3.11.2",

package/plugins/directives.ts

@@ -1,5 +1,5 @@
 import type { DirectiveBinding } from '@vue/runtime-core'
-import type {UI_I_Localization} from "~/lib/models/interfaces";
+import type { UI_I_Localization } from '~/lib/models/interfaces'
 
 export default defineNuxtPlugin((nuxtApp) => {
   nuxtApp.vueApp.directive('development', {
@@ -22,8 +22,7 @@ function applyDevelopmentState(el: HTMLElement, isDevelopment: boolean) {
 
   el.setAttribute('title', localization.value.common.inDevelopment)
   el.setAttribute('disabled', 'true')
-  el.style.opacity = '0.6'
-  el.style.cursor = 'not-allowed'
+  el.classList.add('in-development')
 
   // Оборачиваем, чтобы не навешивать несколько обработчиков
   const preventClick = (e: MouseEvent) => {
@@ -40,8 +39,7 @@ function applyDevelopmentState(el: HTMLElement, isDevelopment: boolean) {
 
 function cleanupDevelopment(el: HTMLElement) {
   el.removeAttribute('title')
-  el.style.opacity = ''
-  el.style.cursor = ''
+  el.classList.remove('in-development')
 
   const handler = (el as any)._developmentClickHandler
   if (handler) {

package/public/spice-console/application/agent.js

@@ -70,6 +70,7 @@ wdi.Agent = $.spcExtend(wdi.EventObject.prototype, {
 
 	setResolution: function(width, height) {
 		//TODO move this to a setting
+    // SC-2122
 		if(width < 800) {
 			width = 800;
 		}
@@ -80,23 +81,23 @@ wdi.Agent = $.spcExtend(wdi.EventObject.prototype, {
 
 		//adapt resolution, TODO: this needs to be refractored
 		var packetData = {
-            type: wdi.AgentMessageTypes.VD_AGENT_MONITORS_CONFIG,
-            opaque: 0,
-            data: new wdi.VDAgentMonitorsConfig({
-                num_of_monitors: 1,
-                flags: 0,
-                data: new wdi.VDAgentMonConfig({
-                    width: width,
-                    height: height,
-                    // Custom code
-                    // depth: 64,
-                    depth: 32, // SC-2122
-                    // Custom code end
-                    x: 0,
-                    y: 0
-                })
-            })
-        };
+      type: wdi.AgentMessageTypes.VD_AGENT_MONITORS_CONFIG,
+      opaque: 0,
+      data: new wdi.VDAgentMonitorsConfig({
+        num_of_monitors: 1,
+        flags: 0,
+        data: new wdi.VDAgentMonConfig({
+          width: width,
+          height: height,
+          // Custom code
+          // depth: 64,
+          depth: 32,
+          // Custom code end
+          x: 0,
+          y: 0,
+        }),
+      }),
+    }
 		this.sendAgentPacket(packetData);
 	},
 

package/store/tasks/actions.ts

@@ -18,6 +18,7 @@ import type {
 } from '~/lib/models/store/tasks/interfaces'
 import type { UI_I_TasksState } from '~/store/tasks/lib/models/interfaces'
 import type { UI_I_RefreshStack } from '~/store/main/lib/interfaces'
+import type { UI_T_Project } from '~/lib/models/types'
 import { tasksConstructor } from '~/store/tasks/mappers/tasks'
 import { recentTasks } from '~/store/tasks/mappers/recentTasks'
 
@@ -28,9 +29,13 @@ export default {
       state: UI_I_TasksState
       dispatch: <T>(arg0: string, arg1: T, arg2: UI_I_CommitOptions) => void
     },
-    payload: UI_I_DataTableQuery
+    payload: {
+      data: UI_I_DataTableQuery
+      project: UI_T_Project
+    }
   ): Promise<API_UI_I_Error | void> {
-    const { page, pageSize, sortBy, filter } = payload
+    const { data, project } = payload
+    const { page, pageSize, sortBy, filter } = data
 
     const query: UI_I_TableQuery = {
       page_size: pageSize,
@@ -38,7 +43,21 @@ export default {
     }
 
     if (sortBy) query.sortBy = sortBy
-    if (filter) query.filter = filter
+    if (filter) {
+      if (project === 'procurator') {
+        query.filter = filter
+      } else {
+        const filters = filter.split(',')
+        filters.forEach((item) => {
+          const [field, value] = item.split('.')
+
+          if (field && value) {
+            // @ts-ignore
+            query[field] = value
+          }
+        })
+      }
+    }
 
     const queryJson: string = JSON.stringify({ type: 'tasks', ...query })
     const lastQuery: string = context.state.taskQuery || ''
@@ -63,7 +82,9 @@ export default {
           value: true,
         })
       },
-      onResponse({ response }: API_UI_I_Response<API_UI_I_Task<string> | null>) {
+      onResponse({
+        response,
+      }: API_UI_I_Response<API_UI_I_Task<string> | null>) {
         const tasks = tasksConstructor(response._data)
 
         context.commit('M_SET_TASKS_LIST', tasks)
@@ -140,10 +161,7 @@ export default {
     payload: string
   ): Promise<void> {
     // Скрываем кнопку cancel
-    context.commit(
-      'M_HIDE_CANCEL_RECENT_TASK_BY_ID',
-      payload
-    )
+    context.commit('M_HIDE_CANCEL_RECENT_TASK_BY_ID', payload)
     const { error } = await useMyFetch<
       API_UI_I_RecentTask<string>,
       API_UI_I_Error

package/store/tasks/mappers/recentTasks.ts

@@ -82,6 +82,7 @@ export const recentTasks = (
             statusIcon = 'error-outline'
             break
           case 5:
+          case 6:
             statusIcon = 'warning-outline'
             break
         }

package/components/common/certificate/Info/Info.vue

@@ -1,61 +0,0 @@
-<template>
-  <component
-    :is="currentComponent"
-    :certificate-data="props.certificateData"
-    :valid-from="validFrom"
-    :valid-to="validTo"
-    :status-text="statusText"
-  />
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_Certificate } from '~/components/common/certificate/lib/models/interfaces'
-
-const props = defineProps<{
-  certificateData: UI_I_Certificate | {}
-}>()
-
-const { $store, $formattedDatetime }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const currentComponent = computed(() =>
-  isNewView.value
-    ? defineAsyncComponent(() => import('./new/New.vue'))
-    : defineAsyncComponent(() => import('./Old.vue'))
-)
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const updateTimeFormatAndInterfaceLang = computed<number>(
-  () => $store.getters['main/getUpdateTimeFormatAndInterfaceLang']
-)
-
-const validFrom = computed<string>(() =>
-  updateTimeFormatAndInterfaceLang.value
-    ? $formattedDatetime(props.certificateData.valid_from, {
-        hasSeconds: true,
-      })
-    : ''
-)
-const validTo = computed<string>(() =>
-  updateTimeFormatAndInterfaceLang.value
-    ? $formattedDatetime(props.certificateData.valid_to, {
-        hasSeconds: true,
-      })
-    : ''
-)
-
-const statusText = computed<string>(() =>
-  props.certificateData.status === 'good'
-    ? localization.value.common.valid
-    : props.certificateData.status
-)
-
-onUnmounted(() => {
-  $store.dispatch('main/A_PAUSE_GLOBAL_REFRESH', 'hostCertificate')
-})
-</script>
-
-<style lang="scss" scoped></style>

package/components/common/certificate/Info/new/New.vue

@@ -1,285 +0,0 @@
-<template>
-  <div class="certificate-info-page p-4 h-full">
-    <div class="certificate-info-item-box p-4">
-      <div class="flex justify-between items-center flex-wrap gap-4">
-        <div class="flex items-center gap-3">
-          <ui-icon
-            v-if="statusIconName"
-            :name="statusIconName"
-            width="38"
-            height="38"
-          />
-          <div>
-            <p class="status-text mb-1">
-              {{ localization.common.status }}: {{ statusText }}
-            </p>
-            <p class="status-subtext">
-              {{ currentExpirationText }}
-            </p>
-          </div>
-        </div>
-        <div class="elapsed-block">
-          <div class="flex justify-between items-center gap-2 mb-[10px]">
-            <p class="elapsed-text">
-              {{ localization.inventoryConfigure.elapsed }}
-            </p>
-            <p class="elapsed-value">{{ currentElapsedValue }}%</p>
-          </div>
-          <ui-progress-bar-linear
-            :percent="currentElapsedValue"
-            :color="elapsedProgressBarColor"
-            stroke-width="10"
-            border-radius="16"
-          />
-        </div>
-      </div>
-    </div>
-    <div class="grid cols-2 mt-3 gap-3">
-      <div class="certificate-info-item-box p-4">
-        <div class="flex items-center gap-3">
-          <div class="icon-box">
-            <ui-icon name="file" width="20" height="20" />
-          </div>
-          <p class="title-info-block">{{ localization.common.subject }}</p>
-        </div>
-        <div class="grid gap-3 mt-4">
-          <div
-            v-for="(item, key) in subjectInfoItem"
-            :key="key"
-            class="flex justify-between items-center flex-wrap gap-2"
-          >
-            <p class="info-label">{{ localization.inventoryConfigure[key] }}</p>
-            <p class="info-value">{{ item }}</p>
-          </div>
-        </div>
-      </div>
-      <div class="certificate-info-item-box p-4">
-        <div class="flex items-center gap-3">
-          <div class="icon-box">
-            <ui-icon name="permission" width="20" height="20" />
-          </div>
-          <p class="title-info-block">{{ localization.common.issuer }}</p>
-        </div>
-        <div class="grid gap-3 mt-4">
-          <div
-            v-for="(item, key) in issuerInfoItem"
-            :key="key"
-            class="flex justify-between items-center flex-wrap gap-2"
-          >
-            <p class="info-label">{{ localization.inventoryConfigure[key] }}</p>
-            <p class="info-value">{{ item }}</p>
-          </div>
-        </div>
-      </div>
-    </div>
-    <p class="valid-period-title mt-5 mb-4">
-      {{ localization.inventoryConfigure.validPeriod }}
-    </p>
-    <div class="certificate-info-item-box p-4">
-      <p class="active-dates-title mb-4">
-        {{ localization.inventoryConfigure.certificateActiveDates }}
-      </p>
-      <div class="grid-container-dates grid cols-2">
-        <div class="flex items-center gap-3">
-          <div class="icon-box">
-            <ui-icon name="icon-events" width="20" height="20" />
-          </div>
-          <div>
-            <p class="date-title-info mb-1">
-              {{ localization.common.validFrom }}
-            </p>
-            <p class="date-value-info">{{ props.validFrom }}</p>
-          </div>
-        </div>
-        <div class="flex items-center gap-3">
-          <div class="icon-box">
-            <ui-icon name="icon-events" width="20" height="20" />
-          </div>
-          <div>
-            <p class="date-title-info mb-1">
-              {{ localization.common.validTo }}
-            </p>
-            <p class="date-value-info">{{ props.validTo }}</p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_Certificate } from '~/components/common/certificate/lib/models/interfaces'
-import type { UI_I_CertificateInfoItem } from '~/components/common/certificate/Info/new/lib/models/interfaces'
-import {
-  statusIconNameFunc,
-  statusTextFunc,
-  expirationTextFunc,
-  expirationDaysFunc,
-  elapsedValueFunc,
-  elapsedProgressBarColorFunc,
-} from '~/components/common/certificate/Info/new/lib/config'
-import { certificateInfo } from '~/components/common/certificate/Info/new/lib/utils'
-
-const props = defineProps<{
-  certificateData: UI_I_Certificate | {}
-  validFrom: string
-  validTo: string
-  statusText: string
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const currentExpirationDays = computed<number>(() =>
-  expirationDaysFunc(props.certificateData)
-)
-const statusIconName = ref<string>(
-  statusIconNameFunc(currentExpirationDays.value)
-)
-const statusText = ref<string>(
-  statusTextFunc(currentExpirationDays.value, localization.value)
-)
-const currentExpirationText = computed<string>(() =>
-  expirationTextFunc(currentExpirationDays.value, localization.value)
-)
-const currentElapsedValue = computed<number>(() =>
-  elapsedValueFunc(props.certificateData)
-)
-const elapsedProgressBarColor = computed<string>(() =>
-  elapsedProgressBarColorFunc(currentExpirationDays.value)
-)
-
-const subjectInfoItem = computed<UI_I_CertificateInfoItem>(() =>
-  certificateInfo(props.certificateData, 'subject')
-)
-const issuerInfoItem = computed<UI_I_CertificateInfoItem>(() =>
-  certificateInfo(props.certificateData, 'issuer')
-)
-</script>
-
-<style>
-:root {
-  --certificate-info-page-bg: #ffffff;
-  --certificate-info-page-item-box-bg: #ffffff;
-  --certificate-info-page-item-box-border: #e9ebed;
-  --certificate-info-page-item-status-text: #4d5d69;
-  --certificate-info-page-item-status-subtext: #9da6ad;
-  --certificate-info-page-item-elapsed-value: #4d5d69;
-  --certificate-info-page-item-icon-box-bg: #008fd614;
-  --certificate-info-page-item-icon-box-icon: #008fd6;
-  --certificate-info-page-item-title-block: #4d5d69;
-  --certificate-info-page-item-label: #4d5d69;
-  --certificate-info-page-item-value: #182531;
-  --certificate-info-page-valid-period-title: #4d5d69;
-  --certificate-info-page-active-dates-title: #4d5d69;
-  --certificate-info-page-date-value-info: #182531;
-}
-:root.dark-theme {
-  --certificate-info-page-bg: #334453;
-  --certificate-info-page-item-box-bg: #1b2a371f;
-  --certificate-info-page-item-box-border: #e9ebed1f;
-  --certificate-info-page-item-status-text: #e9eaec;
-  --certificate-info-page-item-status-subtext: #9da6ad;
-  --certificate-info-page-item-elapsed-value: #e9eaec;
-  --certificate-info-page-item-icon-box-bg: #2ba2de29;
-  --certificate-info-page-item-icon-box-icon: #2ba2de;
-  --certificate-info-page-item-title-block: #e9eaec;
-  --certificate-info-page-item-label: #e9eaec;
-  --certificate-info-page-item-value: #e9eaec;
-  --certificate-info-page-valid-period-title: #e9eaec;
-  --certificate-info-page-active-dates-title: #e9eaec;
-  --certificate-info-page-date-value-info: #e9eaec;
-}
-</style>
-
-<style lang="scss" scoped>
-.certificate-info-page {
-  background-color: var(--certificate-info-page-bg);
-  box-shadow: 0 1px 4px 0 #00000014;
-  border-radius: 8px;
-
-  .certificate-info-item-box {
-    background-color: var(--certificate-info-page-item-box-bg);
-    border: 1px solid var(--certificate-info-page-item-box-border);
-    border-radius: 8px;
-
-    .status-text {
-      font-weight: 500;
-      font-size: 14px;
-      color: var(--certificate-info-page-item-status-text);
-    }
-    .status-subtext {
-      font-weight: 400;
-      font-size: 12px;
-      color: var(--certificate-info-page-item-status-subtext);
-    }
-    .elapsed-block {
-      min-width: 320px;
-
-      .elapsed-text {
-        font-weight: 400;
-        font-size: 13px;
-        color: #9da6ad;
-      }
-      .elapsed-value {
-        font-weight: 400;
-        font-size: 13px;
-        color: var(--certificate-info-page-item-elapsed-value);
-      }
-    }
-    .icon-box {
-      width: 40px;
-      height: 40px;
-      background: var(--certificate-info-page-item-icon-box-bg);
-      border-radius: 8px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      color: var(--certificate-info-page-item-icon-box-icon);
-    }
-    .title-info-block {
-      font-weight: 500;
-      font-size: 14px;
-      color: var(--certificate-info-page-item-title-block);
-    }
-    .info-label {
-      font-weight: 400;
-      font-size: 13px;
-      line-height: 18px;
-      color: var(--certificate-info-page-item-label);
-    }
-    .info-value {
-      font-weight: 400;
-      font-size: 13px;
-      line-height: 18px;
-      color: var(--certificate-info-page-item-value);
-    }
-  }
-  .valid-period-title {
-    font-size: 16px;
-    font-weight: 500;
-    color: var(--certificate-info-page-valid-period-title);
-  }
-  .active-dates-title {
-    font-size: 14px;
-    font-weight: 500;
-    color: var(--certificate-info-page-active-dates-title);
-  }
-  .grid-container-dates {
-    grid-gap: 44px;
-
-    .date-title-info {
-      font-size: 13px;
-      font-weight: 400;
-      line-height: 18px;
-      color: #9da6ad;
-    }
-    .date-value-info {
-      font-size: 13px;
-      font-weight: 400;
-      line-height: 18px;
-      color: var(--certificate-info-page-date-value-info);
-    }
-  }
-}
-</style>