bfg-common 1.4.16 → 1.4.17

package/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/metrics/Metrics.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="chart-option-groups-container">
+    <span>{{ localization.common.chartMetrics }}</span>
+    <atoms-tabs-vertical-tabs
+      v-model="selectedMetric"
+      :items="props.metricsItems"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_VerticalTabs } from '~/components/atoms/tabs/lib/models/interfaces'
+import type { UI_T_Chart } from '~/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/lib/models/types'
+
+const props = defineProps<{
+  metricsItems: UI_I_VerticalTabs[]
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const selectedMetric = defineModel<UI_T_Chart>('selectedMetric')
+</script>
+
+<style scoped lang="scss">
+.chart-option-groups-container {
+  margin-top: 10px;
+  flex-basis: 20%;
+  //min-width: 20%;
+}
+</style>

package/components/common/pages/hardwareHealth/historyTestimony/tools/lib/config/toolbar.ts

@@ -0,0 +1,78 @@
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
+
+export const periodFunc = (
+  localization: UI_I_Localization,
+  selectedTimespanType: string
+): UI_I_OptionItem[] => {
+  const result = [
+    {
+      text: localization.common.realTime,
+      value: 'real_time',
+    },
+    {
+      text: localization.common.lastDay,
+      value: 'last_day',
+    },
+    {
+      text: localization.common.lastWeek,
+      value: 'last_week',
+    },
+    {
+      text: localization.common.lastMonth,
+      value: 'last_month',
+    },
+    // {
+    //   text: localization.common.lastYear,
+    //   value: 'last_year',
+    // },
+  ]
+
+  if (selectedTimespanType === 'custom_interval') {
+    result.push({
+      text: localization.common.customInterval,
+      value: 'custom_interval',
+    })
+  }
+
+  return result
+}
+
+export const viewFunc = (
+  localization: UI_I_Localization,
+  optionsNames: string[]
+): UI_I_OptionItem[] => {
+  const result = [
+    {
+      text: localization.common.power,
+      value: 'power',
+    },
+    {
+      text: localization.inventoryMonitor.temperature,
+      value: 'temperature',
+    },
+  ]
+
+  if (optionsNames) {
+    optionsNames.forEach((item) => {
+      result.push({
+        text: item,
+        value: item,
+      })
+    })
+  }
+
+  return result
+}
+
+export const getCurrentOptionsStorageFunc = (): string[] => {
+  const optionsNames = []
+  for (const key of Object.entries(localStorage)) {
+    if (key[0].includes('ChartOptionsSensors')) {
+      if (key[0].includes('ChartOptionsSensors')) {
+        optionsNames.push(key[0].replace('ChartOptionsSensors', ''))
+      }
+    }
+  }
+  return optionsNames
+}

package/components/common/pages/hardwareHealth/historyTestimony/tools/lib/models/interfaces.ts

@@ -0,0 +1,9 @@
+import type { UI_T_Chart } from '~/components/common/pages/hardwareHealth/historyTestimony/tools/chartOptionsModal/lib/models/types'
+
+export interface UI_I_SensorsGraphPayload {
+  fields: string
+  period: number[]
+  periodName: string
+  view: string
+  metricType: UI_T_Chart
+}

package/components/common/pages/hardwareHealth/tableView/TableView.vue

@@ -73,14 +73,12 @@ import type {
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_HardwareHealthSensors } from '~/components/common/pages/hardwareHealth/tableView/lib/models/interfaces'
 import type { UI_T_HardwareHealthTabMode } from '~/components/common/pages/hardwareHealth/lib/models/types'
-import type {
-  UI_T_DataGridType,
-  UI_T_SelectedRow,
-} from '~/components/atoms/table/dataGrid/lib/models/types'
+import type { UI_T_DataGridType } from '~/components/atoms/table/dataGrid/lib/models/types'
 import * as sensorTable from '~/components/common/pages/hardwareHealth/tableView/lib/config/sensorTable'
 import * as storageSensorTable from '~/components/common/pages/hardwareHealth/tableView/lib/config/storageSensorTable'
 import * as alertWarningTable from '~/components/common/pages/hardwareHealth/tableView/lib/config/alertWarningTable'
 import * as systemLogTable from '~/components/common/pages/hardwareHealth/tableView/lib/config/systemLogTable'
+import * as historyTestimonyTable from '~/components/common/pages/hardwareHealth/tableView/lib/config/historyTestimonyTable'
 
 const props = defineProps<{
   dataTable: UI_I_HardwareHealthSensors[]
@@ -97,7 +95,7 @@ const table: any = {
   'storage-sensor': storageSensorTable,
   'alert-warning': alertWarningTable,
   'system-log': systemLogTable,
-  'history-testimony': sensorTable,
+  'history-testimony': historyTestimonyTable,
 }
 
 const tableType = computed<UI_T_DataGridType | undefined>(() =>
@@ -137,11 +135,7 @@ const bodyItems = computed<UI_I_BodyItem[][]>(() => {
       break
   }
 
-  return table[props.tableMode].bodyItems(
-    tableData,
-    localization.value,
-    props.tableMode
-  )
+  return table[props.tableMode].bodyItems(tableData, localization.value)
 })
 
 const isShowSensorWarningDetails = ref<boolean>(false)

package/components/common/pages/hardwareHealth/tableView/lib/config/historyTestimonyTable.ts

@@ -0,0 +1,128 @@
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import { UI_E_SensorsCategoryIcon } from '~/components/common/pages/hardwareHealth/lib/models/enums'
+import {
+  constructHeadItem,
+  constructColumnKey,
+} from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
+import {
+  sensorsLocalizationByStatus,
+  sensorsIconByStatus,
+} from '~/components/common/pages/hardwareHealth/lib/config/status'
+import { hardwareHealthHistoryTestimonyTableKeys } from '~/components/common/pages/hardwareHealth/tableView/lib/config/tableKeys'
+import type {
+  UI_I_BodyItem,
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+} from '~/components/atoms/table/dataGrid/lib/models/interfaces'
+import type { UI_I_HardwareHealthSensors } from '~/components/common/pages/hardwareHealth/tableView/lib/models/interfaces'
+
+const getItems = (
+  localization: UI_I_Localization
+): [string, boolean, string, string][] => {
+  return [
+    [
+      localization.common.sensors,
+      true,
+      '330px',
+      hardwareHealthHistoryTestimonyTableKeys[0],
+    ],
+    [
+      localization.common.status,
+      true,
+      '140px',
+      hardwareHealthHistoryTestimonyTableKeys[1],
+    ],
+    [
+      localization.common.categories,
+      true,
+      '130px',
+      hardwareHealthHistoryTestimonyTableKeys[2],
+    ],
+    [
+      localization.common.path,
+      true,
+      '130px',
+      hardwareHealthHistoryTestimonyTableKeys[3],
+    ],
+  ]
+}
+export const columnKeys = (
+  localization: UI_I_Localization
+): UI_I_ColumnKey[] => {
+  const result: UI_I_ColumnKey[] = []
+  getItems(localization).forEach((item, i) => {
+    const col = i === 1 || i === 2 ? 'icon' : `col${i}`
+    result.push(
+      constructColumnKey(col, item[0], item[1], `show-column-${item[3]}`)
+    )
+  })
+  return result
+}
+export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
+  const result: UI_I_HeadItem[] = []
+  getItems(localization).forEach((item, i) => {
+    const col = i === 1 || i === 2 ? 'icon' : `col${i}`
+    result.push(
+      constructHeadItem(
+        col,
+        item[0],
+        item[3],
+        true,
+        item[2],
+        undefined,
+        item[3]
+      )
+    )
+  })
+  return result
+}
+
+export const bodyItems = (
+  data: UI_I_HardwareHealthSensors[],
+  localization: UI_I_Localization
+): UI_I_BodyItem[][] => {
+  const bodyItems: UI_I_BodyItem[][] = []
+  data.forEach((sensor: UI_I_HardwareHealthSensors, key) => {
+    const statusData = {
+      iconClassName: sensorsIconByStatus[sensor.status],
+      isSprite: false,
+      warning: sensor.warning,
+    }
+
+    if (!['disk health'].includes(sensor.category.toLowerCase()))
+      bodyItems.push([
+        {
+          key: 'col0',
+          text: sensor[hardwareHealthHistoryTestimonyTableKeys[0]],
+          id: key,
+        },
+        {
+          key: 'icon',
+          text: localization[
+            sensorsLocalizationByStatus[
+              sensor[hardwareHealthHistoryTestimonyTableKeys[1]]
+            ]
+          ],
+          id: key,
+          data: statusData,
+        },
+        {
+          key: 'icon',
+          text: sensor[hardwareHealthHistoryTestimonyTableKeys[2]],
+          id: key,
+          data: {
+            iconClassName:
+              UI_E_SensorsCategoryIcon[sensor.category.toLowerCase()],
+            isSprite: true,
+          },
+        },
+        {
+          key: 'col3',
+          text: sensor[hardwareHealthHistoryTestimonyTableKeys[3]],
+          id: key,
+        },
+      ])
+  })
+
+  return bodyItems
+}

package/components/common/pages/hardwareHealth/tableView/lib/config/sensorTable.ts

@@ -9,7 +9,6 @@ import {
   constructColumnKey,
 } from '~/components/atoms/table/dataGrid/lib/utils/constructDataTable'
 import type { UI_I_HardwareHealthSensors } from '~/components/common/pages/hardwareHealth/tableView/lib/models/interfaces'
-import type { UI_T_HardwareHealthTabMode } from '~/components/common/pages/hardwareHealth/lib/models/types'
 import { UI_E_SensorsCategoryIcon } from '~/components/common/pages/hardwareHealth/lib/models/enums'
 import { hardwareHealthSensorTableKeys } from '~/components/common/pages/hardwareHealth/tableView/lib/config/tableKeys'
 import {
@@ -31,6 +30,7 @@ const getItems = (
     [localization.common.reading, true, '115px', hardwareHealthSensorTableKeys[2]],
     [localization.common.categories, true, '130px', hardwareHealthSensorTableKeys[3]],
     [localization.common.lastUpdated, true, '195px', hardwareHealthSensorTableKeys[4]],
+    [localization.common.path, true, '195px', hardwareHealthSensorTableKeys[5]],
   ]
 }
 export const columnKeys = (
@@ -66,8 +66,7 @@ export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
 
 export const bodyItems = (
   data: UI_I_HardwareHealthSensors[],
-  localization: UI_I_Localization,
-  tableMode: UI_T_HardwareHealthTabMode
+  localization: UI_I_Localization
 ): UI_I_BodyItem[][] => {
   const bodyItems: UI_I_BodyItem[][] = []
   data.forEach((sensor: UI_I_HardwareHealthSensors, key) => {
@@ -77,13 +76,6 @@ export const bodyItems = (
       warning: sensor.warning,
     }
 
-    let isDisabledRow = false
-    if (
-      tableMode === 'history-testimony' &&
-      !['power', 'temperature'].includes(sensor.category.toLowerCase())
-    )
-      isDisabledRow = true
-
     bodyItems.push([
       // {
       //   data,
@@ -96,7 +88,6 @@ export const bodyItems = (
         key: 'col0',
         text: sensor[hardwareHealthSensorTableKeys[0]],
         id: key,
-        disabled: isDisabledRow,
       },
       {
         key: 'icon',
@@ -131,6 +122,11 @@ export const bodyItems = (
         text: sensor[hardwareHealthSensorTableKeys[4]],
         id: key,
       },
+      {
+        key: 'col5',
+        text: sensor[hardwareHealthSensorTableKeys[5]],
+        id: key,
+      },
     ])
   })
   return bodyItems

package/components/common/pages/hardwareHealth/tableView/lib/config/tableKeys.ts

@@ -3,15 +3,11 @@ import type {
   UI_T_HardwareHealthStorageSensorsTableItemTuple,
   UI_T_HardwareHealthAlertWarningTableItemTuple,
   UI_T_HardwareHealthSystemLogTableItemTuple,
+  UI_T_HardwareHealthSensorsGraphTableItemTuple,
 } from '~/components/common/pages/hardwareHealth/tableView/lib/models/types'
 
-export const hardwareHealthSensorTableKeys: UI_T_HardwareHealthSensorsTableItemTuple = [
-  'name',
-  'status',
-  'reading',
-  'category',
-  'lastUpdated',
-]
+export const hardwareHealthSensorTableKeys: UI_T_HardwareHealthSensorsTableItemTuple =
+  ['name', 'status', 'reading', 'category', 'lastUpdated', 'path']
 
 export const hardwareHealthStorageSensorTableKeys: UI_T_HardwareHealthStorageSensorsTableItemTuple =
   ['name', 'health', 'categories']
@@ -21,3 +17,6 @@ export const hardwareHealthAlertWarningTableKeys: UI_T_HardwareHealthAlertWarnin
 
 export const hardwareHealthSystemLogTableKeys: UI_T_HardwareHealthSystemLogTableItemTuple =
   ['time', 'event']
+
+export const hardwareHealthHistoryTestimonyTableKeys: UI_T_HardwareHealthSensorsGraphTableItemTuple =
+  ['name', 'status', 'category', 'path']

package/components/common/pages/hardwareHealth/tableView/lib/models/interfaces.ts

@@ -8,6 +8,8 @@ export interface UI_I_HardwareHealthSensors {
   reading: string
   category: string
   lastUpdated: string
+  mainName?: string
+  path?: string
   warning?: string
   selEntries?: UI_I_HardwareHealthEventEntries[]
 }

package/components/common/pages/hardwareHealth/tableView/lib/models/types.ts

@@ -3,7 +3,8 @@ export type UI_T_HardwareHealthSensorsTableItemTuple = [
   'status',
   'reading',
   'category',
-  'lastUpdated'
+  'lastUpdated',
+  'path'
 ]
 export type UI_T_HardwareHealthStorageSensorsTableItemTuple = [
   'name',
@@ -15,7 +16,11 @@ export type UI_T_HardwareHealthAlertWarningTableItemTuple = [
   'status',
   'reading'
 ]
-export type UI_T_HardwareHealthSystemLogTableItemTuple = [
-  'time',
-  'event'
+export type UI_T_HardwareHealthSystemLogTableItemTuple = ['time', 'event']
+
+export type UI_T_HardwareHealthSensorsGraphTableItemTuple = [
+  'name',
+  'status',
+  'category',
+  'path'
 ]

package/lib/models/interfaces.ts

@@ -27,6 +27,7 @@ export interface UI_I_Localization {
   contextMenu: UI_I_ArbitraryObject<string>
   networks: UI_I_ArbitraryObject<string>
   inventory: UI_I_ArbitraryObject<string>
+  inventoryMonitor: UI_I_ArbitraryObject<string>
   inventoryTabs: UI_I_ArbitraryObject<string>
   snapshots: UI_I_ArbitraryObject<string>
 }

package/lib/models/types.ts

@@ -34,4 +34,5 @@ export type UI_T_LanguageKey =
   | 'contextMenu'
   | 'networks'
   | 'inventory'
+  | 'inventoryMonitor'
   | 'inventoryTabs'

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bfg-common",
   "private": false,
-  "version": "1.4.16",
+  "version": "1.4.17",
   "scripts": {
     "build": "nuxt build",
     "dev": "nuxt dev --port=3002",

package/components/common/pages/hardwareHealth/Graph.vue

@@ -1,84 +0,0 @@
-<template>
-  <div class="hardware-health-graph">
-    <common-graph
-      v-if="dataLocal && !props.loading"
-      :data="dataLocal"
-      :update="updateHelper"
-    />
-    <div v-else-if="props.loading" class="graphic-loader-block">
-      <div class="spinner"></div>
-    </div>
-    <div v-else class="empty-content"></div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { format } from 'date-fns'
-import type { I_SeriesLine } from '~/node_modules/bfg-nuxt-3-graph/graph/lib/models/interfaces'
-import type { I_LineGraph } from '~/node_modules/bfg-nuxt-3-graph/graph/lib/models/interfaces'
-import { graphDataFunc } from '~/node_modules/bfg-nuxt-3-graph/graph/lib/utils/renderGraph'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-
-const props = defineProps<{
-  data: I_SeriesLine | null
-  loading: boolean
-  formattedDatetime: any
-  isDarkMode: boolean
-  getDateFormat: any
-  language: string
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const dataLocal = ref<I_LineGraph | null>(null)
-const updateHelper = ref<number>(0)
-let dateFormat = ''
-
-const updateChart = (): void => {
-  if (!props.data) return
-
-  dataLocal.value = graphDataFunc(
-    props.data,
-    props.isDarkMode,
-    localization.value,
-    () => {},
-    false,
-    false,
-    true,
-    'spline',
-    '',
-    undefined,
-    () => {},
-    props.formattedDatetime,
-    format,
-    dateFormat
-  )
-
-  updateHelper.value++
-}
-
-watch(
-  () => [props.data, props.isDarkMode, props.language],
-  (newValue) => {
-    dateFormat = props.getDateFormat(newValue[2])
-    updateChart()
-  },
-  { immediate: true, deep: true }
-)
-</script>
-
-<style scoped lang="scss">
-.hardware-health-graph {
-  height: 300px;
-
-  .graphic-loader-block {
-    height: inherit;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-  .empty-content {
-    height: inherit;
-  }
-}
-</style>