bfg-common 1.6.112 → 1.6.113

package/assets/localization/local_kk.json

@@ -2671,14 +2671,9 @@
     "hostFound": "Хост табылды",
     "testConnection": "Қосылымды тексеру",
     "saveAndStart": "Сақтау және іске қосу",
-    "saveAndRun": "Сақтау және іске қосу",
     "extended": "Кеңейтілген",
     "deleteConfiguration": "Конфигурацияны жою",
-    "editConnection": "Қосылымды өзгерту",
-    "deleteDatastores": "Деректер қоймаларын жою",
-    "confirmRemoveStorageDescFirst": "Таңдалған деректер қоймаларын ({0}) жойғыңыз келетініне сенімдісіз бе? Бұл әрекет виртуалды машиналарға қатысты барлық файлдарды біржола жояды.",
-    "confirmRemoveStorageDescSecond": "Мәжбүрлі түрде орнатылған VMFS деректер қоймалары инвентарьдан жойылады, бірақ олардың деректері жойылмайды.",
-    "hostSettings": "Хост параметрлері"
+    "editConnection": "Қосылымды өзгерту"
   },
   "auth": {
     "welcomeTo": "Қош келдіңіз",
@@ -2710,8 +2705,7 @@
     "taskName": "Тапсырма аты",
     "moreTasks": "Деректер мәселелері",
     "vmUpdateSteps": "ВМ жаңарту қадамдары",
-    "waitingTime": "Басқару қалыптауы",
-    "cancelTask": "Тапсырманы болдырмау"
+    "waitingTime": "Басқару қалыптауы"
   },
   "layout": {
     "alarms": "Budzіlnіkі",
@@ -3945,25 +3939,6 @@
     "issue": "Мәселе",
     "metricsSent": "Метрикалар жіберілді"
   },
-  "monq": {
-    "monq": "Monq",
-    "connectToMonq": "Monq-қа қосылу",
-    "connectToMonqDescription": "Data Streams бөлімінен сервер URL мен Stream Key енгізіңіз",
-    "monqServerUrl": "Monq серверінің URL-і",
-    "streamKeyApiKey": "Stream Key (Data Stream API Key)",
-    "streamKey": "Stream Key",
-    "getTheKeyInMonqText": "Кілтті Monq-та алыңыз: Settings → Data Streams → Create Stream → Copy API Key",
-    "skipTlsCertificateVerification": "TLS сертификатын тексеруді өткізіп жіберу",
-    "monqIsAvailable": "Monq қолжетімді",
-    "monqIsInvalid": "Monq қолжетімсіз",
-    "monqAvailability": "Monq қолжетімділігі",
-    "streamKeyIsValid": "Stream Key жарамды",
-    "streamKeyIsInvalid": "Stream Key жарамсыз",
-    "streamKeyValidation": "Stream Key тексеруі",
-    "hostSettingsSubtitle": "Метрикалар Monq-қа жіберілетін хост атауы",
-    "hostNameLabel": "Хост атауы (Monq-та көрсетілгендей)",
-    "metricsWillAppearInMonqText": "Метрикалар Monq-та осы атаумен көрінеді. Әдетте бұл гипервизордың IP мекенжайы немесе FQDN."
-  },
   "glpi": {
     "connectToGlpi": "GLPI-ге қосылыңыз",
     "hostAddress": "GLPI мекен-жайы",
@@ -4573,10 +4548,7 @@
     "reSelect": "Қайта таңдау",
     "nameContainsInvalidCharacters": "Қалта атауы 1-ден 64 таңбаға дейін болуы керек және бос орындарды, '/', '@', '#', басқару таңбаларын қамти алмайды, не '.' / '..' болуы мүмкін емес",
     "fileAlreadyExists": "Файл бұрыннан бар",
-    "fileNameAlreadyExists": "«{0}» атауымен файл бұрыннан бар.",
-    "pause": "Тоқтату",
-    "resume": "Жалғастыру",
-    "reSelectFile": "Файлды қайта таңдау"
+    "fileNameAlreadyExists": "«{0}» атауымен файл бұрыннан бар."
   },
   "myPreferences": {
     "twoFactorAuthentication": "Екі факторлы аутентификация",

package/assets/localization/local_ru.json

@@ -2671,14 +2671,9 @@
     "hostFound": "Хост найден",
     "testConnection": "Проверить подключение",
     "saveAndStart": "Сохранить и запустить",
-    "saveAndRun": "Сохранить и запустить",
     "extended": "Расширенный",
     "deleteConfiguration": "Удалить конфигурацию",
-    "editConnection": "Изменить подключение",
-    "deleteDatastores": "Удалить хранилища данных",
-    "confirmRemoveStorageDescFirst": "Вы уверены, что хотите удалить выбранные хранилища данных ({0})? Это действие навсегда удалит все файлы виртуальных машин, находящиеся на выбранных хранилищах.",
-    "confirmRemoveStorageDescSecond": "Принудительно смонтированные VMFS-хранилища будут удалены из инвентаря, но их данные удалены не будут.",
-    "hostSettings": "Настройки хоста"
+    "editConnection": "Изменить подключение"
   },
   "auth": {
     "welcomeTo": "Добро пожаловать в",
@@ -2710,8 +2705,7 @@
     "taskName": "Название задачи",
     "moreTasks": "Дополнительные задачи",
     "vmUpdateSteps": "Шаги обновления ВМ",
-    "waitingTime": "Время ожидания",
-    "cancelTask": "Отменить задачу"
+    "waitingTime": "Время ожидания"
   },
   "layout": {
     "alarms": "Предупреждения",
@@ -3945,25 +3939,6 @@
     "issue": "Ошибки",
     "metricsSent": "Метрики отправлены"
   },
-  "monq": {
-    "monq": "Monq",
-    "connectToMonq": "Подключиться к Monq",
-    "connectToMonqDescription": "Введите URL сервера и Stream Key из раздела Data Streams",
-    "monqServerUrl": "URL сервера Monq",
-    "streamKeyApiKey": "Stream Key (API-ключ Data Stream)",
-    "streamKey": "Stream Key",
-    "getTheKeyInMonqText": "Получите ключ в Monq: Settings → Data Streams → Create Stream → Copy API Key",
-    "skipTlsCertificateVerification": "Пропустить проверку TLS-сертификата",
-    "monqIsAvailable": "Monq доступен",
-    "monqIsInvalid": "Monq недоступен",
-    "monqAvailability": "Доступность Monq",
-    "streamKeyIsValid": "Stream Key действителен",
-    "streamKeyIsInvalid": "Stream Key недействителен",
-    "streamKeyValidation": "Проверка Stream Key",
-    "hostSettingsSubtitle": "Имя хоста, под которым метрики будут отправляться в Monq",
-    "hostNameLabel": "Имя хоста (как отображается в Monq)",
-    "metricsWillAppearInMonqText": "Метрики будут отображаться в Monq под этим именем. Обычно это IP гипервизора или FQDN."
-  },
   "glpi": {
     "connectToGlpi": "Подключитесь к GLPI",
     "hostAddress": "Адрес GLPI",
@@ -4573,10 +4548,7 @@
     "reSelect": "Выбрать заново",
     "nameContainsInvalidCharacters": "Имя папки должно содержать от 1 до 64 символов и не может содержать пробелы, '/', '@', '#', управляющие символы, а также не может быть '.' или '..'",
     "fileAlreadyExists": "Файл уже существует",
-    "fileNameAlreadyExists": "Файл с именем «{0}» уже существует.",
-    "pause": "Пауза",
-    "resume": "Возобновить",
-    "reSelectFile": "Выбрать файл заново"
+    "fileNameAlreadyExists": "Файл с именем «{0}» уже существует."
   },
   "myPreferences": {
     "twoFactorAuthentication": "Двухфакторная аутентификация",

package/assets/localization/local_zh.json

@@ -2669,14 +2669,9 @@
     "hostFound": "已找到主机",
     "testConnection": "测试连接",
     "saveAndStart": "保存并启动",
-    "saveAndRun": "保存并启动",
     "extended": "扩展版",
     "deleteConfiguration": "删除配置",
-    "editConnection": "编辑连接",
-    "deleteDatastores": "删除数据存储",
-    "confirmRemoveStorageDescFirst": "您确定要删除所选数据存储 ({0}) 吗？此操作将永久删除这些数据存储上所有虚拟机相关文件。",
-    "confirmRemoveStorageDescSecond": "强制挂载的 VMFS 数据存储将从清单中移除，但其数据不会被删除。",
-    "hostSettings": "主机设置"
+    "editConnection": "编辑连接"
   },
   "auth": {
     "welcomeTo": "欢迎来到",
@@ -2708,8 +2703,7 @@
     "taskName": "任务名称",
     "moreTasks": "附加任务",
     "vmUpdateSteps": "虚拟机更新步骤",
-    "waitingTime": "等待时间",
-    "cancelTask": "取消任务"
+    "waitingTime": "等待时间"
   },
   "layout": {
     "alarms": "闹钟",
@@ -3943,25 +3937,6 @@
     "issue": "问题",
     "metricsSent": "指标已发送"
   },
-  "monq": {
-    "monq": "Monq",
-    "connectToMonq": "连接到 Monq",
-    "connectToMonqDescription": "输入来自 Data Streams 部分的服务器 URL 和 Stream Key",
-    "monqServerUrl": "Monq 服务器 URL",
-    "streamKeyApiKey": "Stream Key（Data Stream API Key）",
-    "streamKey": "Stream Key",
-    "getTheKeyInMonqText": "在 Monq 中获取密钥：Settings → Data Streams → Create Stream → Copy API Key",
-    "skipTlsCertificateVerification": "跳过 TLS 证书验证",
-    "monqIsAvailable": "Monq 可用",
-    "monqIsInvalid": "Monq 不可用",
-    "monqAvailability": "Monq 可用性",
-    "streamKeyIsValid": "Stream Key 有效",
-    "streamKeyIsInvalid": "Stream Key 无效",
-    "streamKeyValidation": "Stream Key 验证",
-    "hostSettingsSubtitle": "用于向 Monq 发送指标的主机名",
-    "hostNameLabel": "主机名（在 Monq 中显示）",
-    "metricsWillAppearInMonqText": "指标将以此名称显示在 Monq 中。通常为虚拟化主机的 IP 或 FQDN。"
-  },
   "glpi": {
     "connectToGlpi": "连接到GLPI",
     "hostAddress": "GLPI地址",
@@ -4571,10 +4546,7 @@
     "reSelect": "重新选择",
     "nameContainsInvalidCharacters": "文件夹名称必须为 1 到 64 个字符，不能包含空格、'/'、'@'、'#'、控制字符，也不能是 '.' 或 '..'",
     "fileAlreadyExists": "文件已存在",
-    "fileNameAlreadyExists": "名为“{0}”的文件已存在。",
-    "pause": "暂停",
-    "resume": "继续",
-    "reSelectFile": "重新选择文件"
+    "fileNameAlreadyExists": "名为“{0}”的文件已存在。"
   },
   "myPreferences": {
     "twoFactorAuthentication": "双因素认证",

package/components/common/graph/Graph.vue

@@ -1,11 +1,10 @@
 <template>
-  <div class="common-graph-block">
-    <component
-      :is="currentComponent"
-      :chart-options="chartOptions"
-      @select-item="onSelectNewViewExportItem"
-    />
-  </div>
+  <common-graph-graph-new
+    v-if="isNewView"
+    :chart-options="chartOptions"
+    @select-item="onSelectNewViewExportItem"
+  />
+  <common-graph-old v-else :chart-options="chartOptions" />
 </template>
 
 <script setup lang="ts">
@@ -25,19 +24,13 @@ const props = withDefaults(
   {
     chart: undefined,
     exportType: undefined,
-    selectedRow: () => [],
+    selectedRow: [],
   }
 )
 
 const { $store }: any = useNuxtApp()
 const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
 
-const currentComponent = computed(() =>
-  isNewView.value
-    ? defineAsyncComponent(() => import('./new/New.vue'))
-    : defineAsyncComponent(() => import('./Old.vue'))
-)
-
 let localChart: any = null
 const exportChart = (type: string): void => {
   if (type === 'png') {
@@ -131,8 +124,4 @@ watch(
 )
 </script>
 
-<style scoped lang="scss">
-.common-graph-block {
-  display: contents;
-}
-</style>
+<style scoped lang="scss"></style>

package/components/common/graph/{new/New.vue → graphNew/GraphNew.vue}

@@ -15,9 +15,9 @@
             <ui-button
               :test-id="`button-metric-${uniqueId}`"
               :class="['metric-export-button', { active: isShowDropdown }]"
-              variant="text"
               is-without-sizes
               is-without-height
+              variant="text"
               @click="isShowDropdown = !isShowDropdown"
             >
               <ui-icon name="burger" width="20" height="20" />
@@ -27,8 +27,8 @@
               :show="isShowDropdown"
               :items="dropdownItems"
               :elem-id="`button-metric-${uniqueId}`"
-              width="max-content"
               left
+              width="max-content"
               @select="onSelect($event)"
               @hide="isShowDropdown = false"
             />
@@ -48,7 +48,7 @@
 import { useFullscreen } from '@vueuse/core'
 import type { UI_I_Dropdown } from '~/node_modules/bfg-uikit/components/ui/dropdown/models/interfaces'
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-import { UI_E_ChartExportIconByKey } from '~/components/common/graph/new/lib/models/enums'
+import { UI_E_ChartExportIconByKey } from '~/components/common/graph/graphNew/lib/models/enums'
 
 const props = withDefaults(
   defineProps<{

package/components/common/graph/lib/utils/renderGraph.ts

@@ -0,0 +1,393 @@
+import { Ref } from 'vue'
+import type {
+  I_CurrentColor,
+  I_LineGraph,
+  I_DiskGraph,
+  I_Title,
+  I_LineSeries,
+  I_SeriesLine,
+  I_SeriesDisk,
+  I_SeriesLineItem,
+} from '~/node_modules/bfg-nuxt-3-graph/graph/lib/models/interfaces'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
+export const graphDataFunc = (
+  graphData: I_SeriesLine,
+  isDarkMode: boolean,
+  localization: UI_I_Localization,
+  isFullScreen: Ref<boolean>,
+  disabledTitle: boolean,
+  disabledExportButton: boolean,
+  disabledLegends: boolean,
+  graphType?: string,
+  dateTimeFormat?: string,
+  width?: number,
+  chart?: Ref<any>
+): I_LineGraph => {
+  const currentColor: I_CurrentColor = {
+    backgroundColor: isDarkMode ? '#22343c' : 'white',
+    titleColor: isDarkMode ? 'white' : '#333333',
+    xAxisColor: isDarkMode ? '#ADBBC4' : '#707070',
+    textColor: isDarkMode ? '#ADBBC4' : '#707070',
+    legendItemColor: isDarkMode ? '#ADBBC4' : '#333333',
+  }
+
+  const yAxisLength = graphData.yAxis.length
+  const yAxisHelper: string[] = []
+  const yAxis = graphData.yAxis
+    .filter((_: string, key: number) => key >= yAxisLength - 2)
+    .map((text: string, i: number) => {
+      const opposite = !!i
+      if (opposite) yAxisHelper.push(text)
+
+      return {
+        title: {
+          text,
+          style: {
+            color: currentColor.textColor,
+          },
+        },
+        labels: {
+          style: {
+            color: currentColor.textColor,
+          },
+        },
+        min: text === '%' ? 0 : undefined,
+        max: text === '%' ? 100 : undefined,
+        opposite,
+        gridLineWidth: 0.5,
+      }
+    })
+
+  const { $formattedDatetime } = useNuxtApp()
+
+  const currentDateFunc = (data: number): string => {
+    if (dateTimeFormat === 'short')
+      return $formattedDatetime(new Date(data), {
+        hasSeconds: true,
+        separator: ', ',
+        formatTime: 'h:mm',
+      })
+    else
+      return $formattedDatetime(new Date(data), {
+        hasSeconds: true,
+        separator: ', ',
+      })
+  }
+
+  let xAxisCategories: string[] = []
+  let xAxisLabelPositions: number[] | null = null
+  const intervalDate = Math.round(
+    (graphData.pointEnd - graphData.pointStart) / graphData.lines[0].data.length
+  )
+  const series = graphData.lines.map(
+    (line: I_SeriesLineItem, key: number): I_LineSeries => {
+      const data =
+        line.units === 'ms' ? line.data.map((item) => item / 100) : line.data
+
+      if (key === 0) {
+        xAxisCategories = data.map((_: number, key2: number): string => {
+          const currentInterval = key2 ? key2 + 1 : 0
+          return currentDateFunc(
+            graphData.pointStart + intervalDate * currentInterval
+          )
+        })
+      }
+      if (width) {
+        xAxisLabelPositions = []
+        const count = Math.round(width / 250)
+        const positionInterval = Math.round(xAxisCategories.length / count)
+        for (let i = 0; i <= xAxisCategories.length; i += positionInterval) {
+          const currentIndex =
+            i === xAxisCategories.length ? xAxisCategories.length - 1 : i
+
+          if (
+            !xAxisLabelPositions?.length ||
+            currentIndex > xAxisLabelPositions[xAxisLabelPositions.length - 1]
+          ) {
+            xAxisLabelPositions?.push(currentIndex)
+          }
+
+          if (i + positionInterval === positionInterval * count) {
+            xAxisLabelPositions?.push(xAxisCategories.length - 1)
+          }
+        }
+      }
+
+      const visible = key < 10
+      return {
+        data,
+        visible,
+        name: `${line.measurement}`,
+        color: line.color,
+        lineWidth: line.lineWidth || 1.5,
+        yAxis: yAxisHelper.includes(line.units) ? 1 : 0,
+        marker: {
+          enabled: false,
+        },
+        tooltip: {
+          pointFormatter: function (): string {
+            const { x, y }: any = this
+            const currentDate = xAxisCategories.find((_, key) => key === x)
+            return `<b>${line.relatedDeviceName}<br>${currentDate}</b><br>${
+              line.name
+            }: ${new Intl.NumberFormat('en-US').format(y)}`
+          },
+        },
+      }
+    }
+  )
+
+  const title = (): I_Title => {
+    if (disabledTitle) {
+      return {
+        text: '',
+      }
+    } else {
+      return {
+        text: graphData.groupName,
+        style: {
+          color: currentColor.titleColor,
+        },
+      }
+    }
+  }
+
+  return {
+    chart: {
+      type: graphType || 'spline',
+      zooming: {
+        type: 'xy',
+      },
+      animation: false,
+      backgroundColor: currentColor.backgroundColor,
+      events: {
+        fullscreenOpen(): void {
+          isFullScreen.value = true
+        },
+        fullscreenClose(): void {
+          isFullScreen.value = false
+        },
+        load: function () {
+          if (chart) chart.value = this
+        },
+      },
+    },
+
+    title: title(),
+
+    exporting: {
+      menuItemDefinitions: {
+        viewFullscreen: {
+          text: localization.common.viewFullScreen,
+        },
+        printChart: {
+          text: localization.common.printChart,
+        },
+        downloadPNG: {
+          text: localization.common.exportPng,
+        },
+        downloadJPEG: {
+          text: localization.common.exportJpeg,
+        },
+        downloadSVG: {
+          text: localization.common.exportSvg,
+        },
+        downloadCSV: {
+          text: localization.common.exportCsv,
+        },
+      },
+      csv: {
+        dateFormat: '%_ISO',
+      },
+      buttons: {
+        contextButton: {
+          enabled: disabledExportButton,
+          menuItems: [
+            'viewFullscreen',
+            'printChart',
+            'separator',
+            'downloadPNG',
+            'downloadJPEG',
+            'downloadSVG',
+            'downloadCSV',
+          ],
+        },
+      },
+    },
+
+    accessibility: {
+      enabled: false,
+    },
+
+    credits: {
+      enabled: false,
+    },
+
+    tooltip: {
+      headerFormat: '',
+      style: {
+        width: '300px',
+        whiteSpace: 'normal',
+      },
+    },
+
+    legend: {
+      itemMarginBottom: 5,
+      maxHeight: 40,
+      itemStyle: {
+        color: currentColor.legendItemColor,
+      },
+      enabled: disabledLegends,
+    },
+
+    xAxis: {
+      type: 'datetime',
+      labels: {
+        autoRotationLimit: 0,
+        style: {
+          color: currentColor.textColor,
+        },
+      },
+      // tickInterval: 125,
+      tickPositions: xAxisLabelPositions,
+      categories: xAxisCategories,
+      gridLineWidth: 0.5,
+    },
+
+    yAxis,
+
+    plotOptions: {
+      series: {
+        animation: false,
+      },
+      line: {
+        animation: false,
+      },
+    },
+
+    series,
+  }
+}
+
+export const graphDiskDataFunc = (
+  graphData: I_SeriesDisk,
+  isDarkMode: boolean,
+  localization: UI_I_Localization,
+  isFullScreen: Ref<boolean>
+): I_DiskGraph => {
+  const currentColor: I_CurrentColor = {
+    backgroundColor: isDarkMode ? '#22343c' : 'white',
+    titleColor: isDarkMode ? 'white' : '#333333',
+    xAxisColor: isDarkMode ? '#ADBBC4' : '#707070',
+    textColor: isDarkMode ? '#ADBBC4' : '#707070',
+    legendItemColor: isDarkMode ? '#ADBBC4' : '#333333',
+  }
+
+  return {
+    chart: {
+      plotBackgroundColor: null,
+      plotBorderWidth: null,
+      plotShadow: false,
+      type: 'pie',
+      backgroundColor: currentColor.backgroundColor,
+      events: {
+        fullscreenOpen(): void {
+          isFullScreen.value = true
+        },
+        fullscreenClose(): void {
+          isFullScreen.value = false
+        },
+      },
+    },
+
+    exporting: {
+      menuItemDefinitions: {
+        viewFullscreen: {
+          text: localization.common.viewFullScreen,
+        },
+        printChart: {
+          text: localization.common.printChart,
+        },
+        downloadPNG: {
+          text: localization.common.exportPng,
+        },
+        downloadJPEG: {
+          text: localization.common.exportJpeg,
+        },
+        downloadSVG: {
+          text: localization.common.exportSvg,
+        },
+        downloadCSV: {
+          text: localization.common.exportCsv,
+        },
+      },
+      csv: {
+        dateFormat: '%_ISO',
+      },
+      buttons: {
+        contextButton: {
+          enabled: true,
+          menuItems: [
+            'viewFullscreen',
+            'printChart',
+            'separator',
+            'downloadPNG',
+            'downloadJPEG',
+            'downloadSVG',
+            'downloadCSV',
+          ],
+        },
+      },
+    },
+
+    title: {
+      text: graphData.title,
+      style: {
+        color: currentColor.titleColor,
+      },
+    },
+
+    accessibility: {
+      enabled: false,
+    },
+
+    credits: {
+      enabled: false,
+    },
+
+    tooltip: {
+      pointFormat: '{point.percentage:.1f}%',
+    },
+
+    plotOptions: {
+      pie: {
+        cursor: 'pointer',
+        dataLabels: {
+          enabled: false,
+        },
+        showInLegend: true,
+      },
+    },
+
+    legend: {
+      align: 'right',
+      layout: 'vertical',
+      itemStyle: {
+        color: currentColor.legendItemColor,
+      },
+      itemHoverStyle: {
+        color: currentColor.legendItemColor,
+      },
+    },
+
+    series: [
+      {
+        name: 'Brands',
+        colorByPoint: true,
+        data: graphData.data,
+        animation: false,
+      },
+    ],
+  }
+}

package/components/common/modals/confirmation/Confirmation.vue

@@ -10,7 +10,6 @@
     @hide-modal="emits('hide-modal')"
     @confirm="emits('confirm')"
   >
-<!--    TODO fix slot name-->
     <template #otherContent>
       <slot v-if="$slots.otherContent" name="otherContent" />
     </template>