bfg-common 1.5.26 → 1.5.28

package/store/main/mutations.ts

@@ -1,7 +1,7 @@
-import type { UI_I_MainState } from '~/store/main/lib/interfaces'
-
-export default {
-  M_MENU_PINED(state: UI_I_MainState, payload: boolean): void {
-    state.isMenuPined = payload
-  },
-}
+import type { UI_I_MainState } from '~/store/main/lib/interfaces'
+
+export default {
+  M_MENU_PINED(state: UI_I_MainState, payload: boolean): void {
+    state.isMenuPined = payload
+  },
+}

package/store/main/state.ts

@@ -1,7 +1,7 @@
-import type {UI_I_MainState} from "~/store/main/lib/interfaces";
-
-const state: UI_I_MainState = {
-  isMenuPined: false,
-}
-
-export default state
+import type {UI_I_MainState} from "~/store/main/lib/interfaces";
+
+const state: UI_I_MainState = {
+  isMenuPined: false,
+}
+
+export default state

package/store/tasks/mappers/recentTasks.ts

@@ -1,64 +1,64 @@
-import {
-  UI_E_RecentTaskStatus,
-  UI_E_IconNameByRecentTaskStatus,
-} from '~/lib/models/store/tasks/enums'
-import type {
-  API_UI_I_RecentTask,
-  UI_I_RecentTask,
-} from '~/lib/models/store/tasks/interfaces'
-import { base64 } from '~/lib/utils/base64'
-
-export const recentTasks = (
-  data: API_UI_I_RecentTask<string>
-): UI_I_RecentTask<string> => {
-  const items =
-    data.items
-      ?.sort((a, b) => {
-        return b.start_time - a.start_time
-      })
-      .map((task) => {
-        let args: any = {}
-        try {
-          args = base64.decode(task.args)
-        } catch (error) {
-          args = {}
-        }
-
-        let completion: string = task.completion + '' || '--'
-        let execution: string | number = Math.abs(task.start_time - task.completion)
-        let queuedFor: number = task.start_time - task.creation_time
-        let startTime: string = task.start_time + '' || '--'
-        // Обрабатываем данные когда задачка в ожидании
-        if (task.status === 0) {
-          completion = '--'
-          execution = '--'
-          queuedFor = 0
-          startTime = (Date.now() / 1000) + ''
-        }
-
-        return {
-          args,
-          completion,
-          execution,
-          queuedFor,
-          startTime,
-          details: task.details,
-          error: task.error,
-          initiator: task.initiator,
-          server: task.server,
-          statusIcon: UI_E_IconNameByRecentTaskStatus[task.status],
-          statusText: task.error || UI_E_RecentTaskStatus[task.status],
-          status: task.status,
-          target: task.target,
-          targetType: task.target_type,
-          taskName: task.task_name,
-          id: task.id,
-          zone: task.zone,
-          extra: task.extra,
-        }
-      }) || []
-  return {
-    items,
-    last: data.last,
-  }
-}
+import {
+  UI_E_RecentTaskStatus,
+  UI_E_IconNameByRecentTaskStatus,
+} from '~/lib/models/store/tasks/enums'
+import type {
+  API_UI_I_RecentTask,
+  UI_I_RecentTask,
+} from '~/lib/models/store/tasks/interfaces'
+import { base64 } from '~/lib/utils/base64'
+
+export const recentTasks = (
+  data: API_UI_I_RecentTask<string>
+): UI_I_RecentTask<string> => {
+  const items =
+    data.items
+      ?.sort((a, b) => {
+        return b.start_time - a.start_time
+      })
+      .map((task) => {
+        let args: any = {}
+        try {
+          args = base64.decode(task.args)
+        } catch (error) {
+          args = {}
+        }
+
+        let completion: string = task.completion + '' || '--'
+        let execution: string | number = Math.abs(task.start_time - task.completion)
+        let queuedFor: number = task.start_time - task.creation_time
+        let startTime: string = task.start_time + '' || '--'
+        // Обрабатываем данные когда задачка в ожидании
+        if (task.status === 0) {
+          completion = '--'
+          execution = '--'
+          queuedFor = 0
+          startTime = (Date.now() / 1000) + ''
+        }
+
+        return {
+          args,
+          completion,
+          execution,
+          queuedFor,
+          startTime,
+          details: task.details,
+          error: task.error,
+          initiator: task.initiator,
+          server: task.server,
+          statusIcon: UI_E_IconNameByRecentTaskStatus[task.status],
+          statusText: task.error || UI_E_RecentTaskStatus[task.status],
+          status: task.status,
+          target: task.target,
+          targetType: task.target_type,
+          taskName: task.task_name,
+          id: task.id,
+          zone: task.zone,
+          extra: task.extra,
+        }
+      }) || []
+  return {
+    items,
+    last: data.last,
+  }
+}

package/components/common/graph/Graph.vue~

@@ -1,104 +0,0 @@
-<template>
-  <common-graph-new v-if="isNewView" :chart-options="chartOptions" />
-  <common-graph-old v-else :chart-options="chartOptions" />
-</template>
-
-<script setup lang="ts">
-import type {
-  I_LineGraph,
-  I_DiskGraph,
-} from 'bfg-nuxt-3-graph/graph/lib/models/interfaces'
-
-const props = defineProps<{
-  chart?: any
-  data: I_LineGraph | I_DiskGraph
-  update: number
-  exportType?: string
-  selectedRow?: number[]
-}>()
-
-const { $store }: any = useNuxtApp()
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-let localChart: any = null
-const exportChart = (type: string): void => {
-  if (type === 'png') {
-    localChart.exportChart({
-      type: 'image/png',
-    })
-  } else if (type === 'jpeg') {
-    localChart.exportChart({
-      type: 'image/jpeg',
-    })
-  } else if (type === 'svg') {
-    localChart.exportChart({
-      type: 'image/svg+xml',
-    })
-  } else if (type === 'csv') {
-    localChart.downloadCSV()
-  }
-}
-
-const chartOptions = ref<I_LineGraph | I_DiskGraph | null>(null)
-const initGraph = (): void => {
-  if (!props.data) return
-  setTimeout(() => {
-    chartOptions.value = props.data
-  }, 500)
-}
-
-watch(
-  () => props.update,
-  (newValue) => {
-    newValue && initGraph()
-  },
-  { immediate: true }
-)
-
-watch(
-  () => props.exportType,
-  (newValue) => {
-    if (!newValue) return
-
-    exportChart(newValue)
-  }
-)
-
-watch(
-  () => props.chart,
-  (newValue) => {
-    if (newValue.series) localChart = newValue
-  },
-  { deep: true }
-)
-
-const updateSeriesStrokeWidth = (data: number[]): void => {
-  if (!localChart) return
-
-  const newChartOptions = chartOptions.value
-  newChartOptions.series.forEach((_: any, key: number) => {
-    newChartOptions.series[key].lineWidth = 1.5
-
-    if (data.includes(key)) newChartOptions.series[key].lineWidth = 3
-  })
-
-  chartOptions.value = newChartOptions
-}
-
-watch(
-  () => props.selectedRow,
-  (newValue) => newValue && updateSeriesStrokeWidth(newValue)
-)
-</script>
-
-<style scoped lang="scss">
-.graph-content {
-  width: 100%;
-  //height: inherit;
-  height: 100%;
-
-  .graph-block {
-    height: 100%;
-  }
-}
-</style>

package/components/common/graph/graphNew/GraphNew.vue

@@ -1,194 +0,0 @@
-<template>
-  <div
-    ref="chartContainer"
-    :class="[
-      'graph-content',
-      { 'header-in-block': props.isHeaderInBlock },
-      { 'full-screen': isFullscreen },
-    ]"
-  >
-    <template v-if="props.chartOptions">
-      <client-only>
-        <div class="metric-header">
-          <span class="chart-title">{{ props.chartOptions.title.text }}</span>
-          <div class="chart-export-dropdown-container">
-            <ui-button
-              :test-id="`button-metric-${uniqueId}`"
-              is-without-sizes
-              is-without-height
-              variant="text"
-              :class="['metric-export-button', { active: isShowDropdown }]"
-              @click="isShowDropdown = !isShowDropdown"
-            >
-              <ui-icon name="burger" width="20" height="20" />
-            </ui-button>
-            <ui-dropdown
-              :test-id="`metric-${uniqueId}-dropdown`"
-              :show="isShowDropdown"
-              :items="dropdownItems"
-              :elem-id="`button-metric-${uniqueId}`"
-              left
-              width="max-content"
-              @select="onSelect($event, key)"
-              @hide="isShowDropdown = false"
-            />
-          </div>
-        </div>
-        <highchart
-          :options="props.chartOptions"
-          :modules="['exporting', 'export-data']"
-          class="graph-block"
-        />
-      </client-only>
-    </template>
-  </div>
-</template>
-
-<script setup lang="ts">
-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 { E_ChartExportIconByKey } from '~/components/common/graph/graphNew/lib/models/enums'
-
-const props = withDefaults(
-  defineProps<{
-    chartOptions: any
-    isHeaderInBlock?: boolean
-  }>(),
-  {
-    isHeaderInBlock: true,
-  }
-)
-const emits = defineEmits<{
-  (event: 'select-item', value: string): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const uniqueId = ref<number>(useUniqueId())
-
-const chartContainer = ref<any>(null)
-const { isFullscreen, toggle } = useFullscreen(chartContainer)
-
-const isShowDropdown = ref<boolean>(false)
-const dropdownItems = computed<UI_I_Dropdown[]>(() => {
-  const result = []
-
-  const exportItems = props.chartOptions?.exporting?.menuItemDefinitions
-  for (const key in exportItems) {
-    if (!exportItems[key].isHide)
-      result.push({
-        text: exportItems[key].text,
-        value: key,
-        iconName: E_ChartExportIconByKey[key],
-        divider: key === 'printChart',
-      })
-  }
-
-  if (isFullscreen.value) {
-    result.map((item) => {
-      if (item.value === 'viewFullscreen') {
-        item.text = localization.value.common.exitFullscreen
-        item.iconName = 'exit-full-screen'
-      }
-
-      return item
-    })
-  }
-
-  return result
-})
-
-const onSelect = (value: string): void => {
-  switch (value) {
-    case 'viewFullscreen':
-      toggle()
-      break
-    default:
-      emits('select-item', value)
-  }
-}
-</script>
-
-<style>
-:root {
-  --chart-block-title-color: #4d5d69;
-  --chart-block-header-bg-color: #ffffff;
-  --chart-block-export-button-color: #4d5d69;
-  --chart-block-export-button-hover-color: #213444;
-  --chart-block-export-button-active-color: #008fd6;
-}
-:root.dark-theme {
-  --chart-block-title-color: #e9eaec;
-  --chart-block-header-bg-color: #334453;
-  --chart-block-export-button-color: #e9eaec;
-  --chart-block-export-button-hover-color: #ffffff;
-  --chart-block-export-button-active-color: #2ba2de;
-}
-</style>
-<style scoped lang="scss">
-.graph-content {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  box-shadow: 0 1px 4px 0 #00000014;
-  border-radius: 8px;
-
-  &.full-screen {
-    .metric-header {
-      border-radius: 0;
-
-      .chart-title {
-        font-size: 22px;
-      }
-      .metric-export-button {
-        svg {
-          width: 24px;
-          height: 24px;
-        }
-      }
-    }
-    .graph-block {
-      border-radius: 0;
-    }
-  }
-  .metric-header {
-    display: grid;
-    align-items: center;
-    grid-template-columns: max-content max-content;
-    justify-content: space-between;
-    padding: 16px;
-    background-color: var(--chart-block-header-bg-color);
-    border-radius: 8px 8px 0px 0px;
-
-    .chart-title {
-      color: var(--chart-block-title-color);
-      font-family: Inter;
-      font-size: 16px;
-      font-weight: 500;
-    }
-    .chart-export-dropdown-container {
-      position: relative;
-
-      .metric-export-button {
-        color: var(--chart-block-export-button-color);
-
-        &:hover {
-          color: var(--chart-block-export-button-hover-color);
-        }
-        &.active {
-          color: var(--chart-block-export-button-active-color);
-        }
-      }
-    }
-  }
-
-  .graph-block {
-    height: 100%;
-    overflow: hidden;
-    border-radius: 0px 0px 8px 8px;
-    background-color: var(--chart-block-header-bg-color);
-  }
-}
-</style>

package/components/common/graph/graphNew/lib/models/enums.ts

@@ -1,9 +0,0 @@
-export enum E_ChartExportIconByKey {
-  'openNewWindow' = 'new-tab',
-  'printChart' = 'print',
-  'viewFullscreen' = 'view-full-screen',
-  'downloadPNG' = 'download-2',
-  'downloadJPEG' = 'download-2',
-  'downloadSVG' = 'download-2',
-  'downloadCSV' = 'download-2',
-}

package/components/common/monitor/overview/Overview.vue~

@@ -1,132 +0,0 @@
-<template>
-  <common-monitor-overview-new
-    v-if="isNewView"
-    :charts="chartsLocal"
-    :all-data="allData"
-    :update-helper="updateHelper"
-  />
-  <common-monitor-overview-old
-    v-else
-    :charts="chartsLocal"
-    :all-data="allData"
-    :update-helper="updateHelper"
-  />
-</template>
-
-<script setup lang="ts">
-import { format } from 'date-fns'
-import type {
-  I_SeriesColumn,
-  I_SeriesLine,
-  I_ColumnGraph,
-  I_LineGraph,
-} from '~/node_modules/bfg-nuxt-3-graph/graph/lib/models/interfaces'
-import {
-  columnGraphDataFunc,
-  graphDataFunc,
-} from '~/node_modules/bfg-nuxt-3-graph/graph/lib/utils/renderGraph'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_GraphDataSettingItem } from '~/components/common/monitor/lib/models/interfaces'
-
-const props = defineProps<{
-  charts: UI_I_GraphDataSettingItem[]
-  themeMode?: string
-  formatDate?: string
-  formatTime?: string
-  graphType: string
-}>()
-
-const { $formattedDatetime, $store }: any = useNuxtApp()
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const allData = ref<UI_I_GraphDataSettingItem[]>([])
-
-const chartsLocal = ref<any>([])
-
-const getCurrentChart = (chart: any): void => {
-  chartsLocal.value = chart
-}
-
-const instanceOfSeriesLine = (
-  object: I_SeriesLine | I_SeriesColumn
-): object is I_SeriesLine => {
-  return 'lines' in object
-}
-
-const getCurrentData = (
-  chart: UI_I_GraphDataSettingItem,
-  chartType: string
-): I_LineGraph | I_ColumnGraph | null => {
-  if (!chart || !chart.data) return null
-
-  const themeMode = useLocalStorage('themeMode') || props.themeMode
-  const isDarkMode = themeMode === 'dark-theme'
-
-  let graphData = null
-
-  if (chartType === 'column' && !instanceOfSeriesLine(chart.data)) {
-    graphData = columnGraphDataFunc({
-      chart,
-      isDarkMode,
-      localization: localization.value,
-    })
-  } else if (instanceOfSeriesLine(chart.data)) {
-    graphData = graphDataFunc({
-      graphData: chart.data,
-      isDarkMode: isDarkMode,
-      localization: localization.value,
-      fullScreenCallBack: () => {},
-      disabledTitle: false,
-      disabledExportButton: true,
-      disabledLegends: true,
-      graphType: props.graphType,
-      width: 700,
-      chartCallBack: getCurrentChart,
-      formattedDatetime: $formattedDatetime,
-      format: format,
-      formatDate: props.formatDate,
-      timeFormat: props.formatTime,
-    })
-  }
-
-  return graphData
-}
-
-const updateHelper = ref<number>(0)
-
-const updateGraph = (charts: Array<UI_I_GraphDataSettingItem | null>): void => {
-  allData.value = []
-  charts.forEach((chart) => {
-    if (chart && chart.data) {
-      const constructedData = getCurrentData(chart, chart.chartType)
-      if (constructedData)
-        allData.value.push({
-          title: chart.title,
-          loader: chart.loader,
-          data: constructedData,
-          chartType: 'column',
-        })
-    } else {
-      allData.value.push({
-        title: '',
-        loader: chart.loader,
-        data: null,
-        chartType: 'column',
-      })
-    }
-  })
-  updateHelper.value++
-}
-
-watch(
-  () => props.charts,
-  (newValue) => {
-    updateGraph(newValue)
-  },
-  { deep: true, immediate: true }
-)
-</script>
-
-<style scoped lang="scss"></style>