bfg-common 1.0.97 → 1.0.99

package/components/common/home/ResourceBlock.vue

@@ -1,117 +0,0 @@
-<template>
-  <div class="card">
-    <div class="card-block">
-      <div class="clr-row vc-capacity-content">
-        <div
-          v-for="item in props.items"
-          :key="item.type"
-          class="clr-col-md clr-col-sm-12 clr-col-xs-12 capacity-entity"
-        >
-          <div class="capacity-entity-content">
-            <h3 class="capacity-entity-label">
-              {{ localization[item.type] }}
-            </h3>
-            <div class="capacity-entity-metrics-content">
-              <h4 class="capacity-entity-free">
-                {{ item.free.text }} {{ localization.free }}
-              </h4>
-              <progress
-                class="progress-block"
-                :max="item.capacity.value"
-                :value="item.used.value"
-              />
-              <div class="capacity-entity-used">
-                {{ item.used.text }} {{ localization.used?.toLowerCase() }} |
-                {{ item.capacity.text }} {{ localization.total?.toLowerCase() }}
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-import { UI_I_Localization } from '~/models/interfaces'
-import type {
-  UI_I_ResourceMeter,
-  UI_I_MeterBlockItem,
-} from '~/components/common/home/models/interfaces'
-
-const props = defineProps<{
-  items: UI_I_ResourceMeter<UI_I_MeterBlockItem>[]
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-<style lang="scss" scoped>
-.card {
-  color: var(--global-font-color);
-  background-color: var(--global-bg-color);
-
-  &-block {
-    .capacity-entity {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      margin: 0;
-      padding: 0 10px;
-      border-left: 1px solid var(--global-border-color);
-
-      &:first-of-type {
-        border-left: none;
-      }
-
-      .capacity-entity-content {
-        min-height: 120px;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        width: 100%;
-
-        h3 {
-          font-size: 18px;
-          font-weight: 200;
-          margin-bottom: 5px;
-        }
-
-        progress.progress-block {
-          width: 100%;
-          height: 0.6395rem;
-          line-height: 24px;
-          background-color: var(--progress-bg-color);
-        }
-        progress::-webkit-progress-value,
-        progress::-moz-progress-value {
-          background-color: var(--progress-value-bg-color);
-        }
-        progress::-webkit-progress-bar {
-          background-color: var(--progress-bg-color);
-        }
-        .capacity-entity-free {
-          font-size: 22px;
-          font-weight: 200;
-          margin-bottom: 10px;
-        }
-        .capacity-entity-used {
-          font-size: 12px;
-        }
-        .capacity-entity-label {
-          align-self: flex-start;
-          // font-size: 0.9rem;
-        }
-      }
-    }
-  }
-}
-.capacity-entity-content:nth-child(1) {
-  border-left: none;
-}
-.capacity-entity-metrics-content {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
-}
-</style>

package/components/common/home/StatusContent.vue

@@ -1,47 +0,0 @@
-<template>
-  <div class="entity-status-content">
-    <div v-for="(text, value) in props.items" :key="value" class="item">
-      <h3 class="entity-status-item-value">
-        {{ text }}
-      </h3>
-      <div class="entity-status-item-status">{{ localization[value] }}</div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_I_Card } from '~/components/common/home/models/interfaces'
-
-const props = defineProps<{
-  items: UI_I_Card
-}>()
-const localization = computed<UI_I_Localization>(() => useLocal())
-</script>
-
-<style scoped lang="scss">
-.entity-status-content {
-  display: flex;
-  justify-content: space-around;
-  align-items: center;
-  min-height: 100px;
-
-  .item {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    color: inherit;
-    background-color: inherit;
-
-    .entity-status-item-value {
-      font-size: 22px;
-      font-weight: 200;
-    }
-    .entity-status-item-status {
-      font-size: 13px;
-      margin-top: 5px;
-    }
-  }
-}
-</style>

package/components/common/home/alertsTable/AlertsTable.vue

@@ -1,105 +0,0 @@
-<template>
-  <div class="most-alert">
-    <atoms-table-data-grid
-      v-model:selected-row="selectedRow"
-      v-model:page-size="pageSize"
-      v-model:page="page"
-      class="data-table"
-      :head-items="headItems"
-      :body-items="bodyItems"
-      :total-items="bodyItems.length"
-      :total-pages="1"
-      off-select-by-row
-      hide-page-size
-      show-page-info
-      server-off
-    >
-      <template #th="{ item }">
-        <atoms-the-icon
-          width="20px"
-          height="20px"
-          :name="item.iconName"
-          class="title-icon"
-        />
-        <span> {{ item.text }} </span>
-      </template>
-      <template #icon="{ item }">
-        <span :class="['datagrid-cell-icon', item.data.iconClassName]" />
-        <a
-          v-if="item.data.isLink"
-          href="javascript:void(0)"
-          class="text-ellipsis"
-          :title="item.text"
-          @click="selectNodeOfTree(item.data)"
-          >{{ item.text }}</a
-        >
-        <span v-else class="text-ellipsis">
-          {{ item.text }}
-        </span>
-      </template>
-    </atoms-table-data-grid>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type {
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/models/interfaces'
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_T_SelectedRow } from '~/components/atoms/table/dataGrid/models/types'
-import type { UI_I_Alert } from '~/components/common/home/models/interfaces'
-import type { UI_I_AlertData } from '~/components/common/home/alertsTable/models/interfaces'
-import * as table from '~/components/common/home/alertsTable/config/config'
-
-const props = defineProps<{
-  dataTable: UI_I_Alert[]
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-node-of-tree', value: UI_I_AlertData): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedRow = ref<UI_T_SelectedRow>(null)
-const headItems = computed<UI_I_HeadItem[]>(() =>
-  table.headItems(localization.value)
-)
-const bodyItems = ref<UI_I_BodyItem[][]>([])
-watch(
-  () => props.dataTable,
-  (newValue) => {
-    if (!newValue?.length) {
-      bodyItems.value = []
-      return
-    }
-
-    bodyItems.value = table.bodyItems(newValue)
-  },
-  { deep: true, immediate: true }
-)
-const page = ref<number>(1)
-const pageSize = ref<number>(1)
-
-const selectNodeOfTree = (item: UI_I_AlertData): void => {
-  emits('select-node-of-tree', item)
-}
-</script>
-
-<style lang="scss" scoped>
-.most-alert {
-  margin: 0;
-  border: none;
-
-  :deep(.datagrid-outer-wrapper) {
-    padding: 0;
-
-    .datagrid {
-      margin: 0;
-      border: unset;
-      min-height: 200px;
-    }
-  }
-}
-</style>

package/components/common/home/alertsTable/config/config.ts

@@ -1,61 +0,0 @@
-import type {
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/models/interfaces'
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_T_AlertColumnKeys } from '~/components/common/home/models/types'
-import type { UI_I_Alert } from '~/components/common/home/models/interfaces'
-import type { UI_I_AlertData } from '~/components/common/home/alertsTable/models/interfaces'
-import { UI_E_TabsByTypeEnum } from '~/components/common/home/alertsTable/models/enums'
-import { constructHeadItem } from '~/components/atoms/table/dataGrid/utils/constructDataTable'
-
-export const alertsTableKeys: UI_T_AlertColumnKeys[] = [
-  'item',
-  'alerts',
-  'warnings',
-]
-
-const getItems = (
-  localization: UI_I_Localization
-): [string, boolean, string, string, string][] => {
-  return [
-    [localization.item, true, '34%', alertsTableKeys[0], ''],
-    [localization.alerts, true, '33%', alertsTableKeys[1], 'error-outline'],
-    [localization.warnings, true, '33%', alertsTableKeys[2], 'warning-outline'],
-  ]
-}
-
-export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
-  const result: UI_I_HeadItem[] = []
-  getItems(localization).forEach((item, i) => {
-    const col = i === 0 ? 'icon' : `col${i + 1}`
-    result.push(
-      constructHeadItem(col, item[0], item[3], true, item[2], item[4])
-    )
-  })
-  return result
-}
-
-export const bodyItems = (data: UI_I_Alert[]): UI_I_BodyItem[][] => {
-  const bodyItems: UI_I_BodyItem[][] = []
-  data.forEach((alert: UI_I_Alert, key) => {
-    const alertData: UI_I_AlertData = {
-      iconClassName: 'vsphere-icon-folder',
-      id: alert.id,
-      nav: UI_E_TabsByTypeEnum[alert.type],
-      type: alert.type,
-      isLink: true,
-    }
-    bodyItems.push([
-      {
-        key: 'icon',
-        text: alert[alertsTableKeys[0]].toString(),
-        data: alertData,
-        id: key,
-      },
-      { key: 'col2', text: alert[alertsTableKeys[1]].toString(), id: key },
-      { key: 'col3', text: alert[alertsTableKeys[2]].toString(), id: key },
-    ])
-  })
-  return bodyItems
-}

package/components/common/home/alertsTable/models/enums.ts

@@ -1,11 +0,0 @@
-export enum UI_E_TabsByTypeEnum {
-  'zone' = 'h',
-  'datacenter' = 'h',
-  'folder' = 'h',
-  'cluster' = 'h',
-  // для прокуратор
-  'host' = 'h',
-  'vm' = 'v',
-  'datastore' = 's',
-  'network' = 'n',
-}

package/components/common/home/alertsTable/models/interfaces.ts

@@ -1,19 +0,0 @@
-import type { UI_T_NavNodes } from '~/components/common/home/alertsTable/models/types'
-import type { UI_I_TreeNode } from '~/components/common/recursionTree/models/interfaces'
-import type { UI_T_InventoryAllTreeName } from '~/components/common/home/alertsTable/models/types'
-
-export interface UI_I_AlertData {
-  iconClassName: string
-  id: number
-  nav: UI_T_NavNodes
-  type: string
-  isLink: boolean
-}
-
-export interface UI_I_ShowNodePayload {
-  node: UI_I_TreeNode
-  treeName: UI_T_InventoryAllTreeName
-}
-export interface UI_I_SelectNodePayload extends UI_I_ShowNodePayload {
-  doSelect?: boolean
-}

package/components/common/home/alertsTable/models/types.ts

@@ -1,17 +0,0 @@
-export type UI_T_NavNodes =
-  | 'h'
-  // для прокуратор
-  | 'v'
-  | 's'
-  | 'n'
-
-export type UI_T_InventoryTreeName =
-  | 'hostsAndClustersTree'
-  | 'vmsTree'
-  | 'storagesTree'
-  | 'networksTree'
-
-export type UI_T_InventoryAllTreeName =
-  | UI_T_InventoryTreeName
-  | 'folderTree'
-  | 'computeResourceTree'

package/components/common/home/config/configResourceMeterBlock.ts

@@ -1,25 +0,0 @@
-import type {
-  UI_I_MeterBlockItem,
-  UI_I_ResourceMeter,
-} from '~/components/common/home/models/interfaces'
-
-export const optionsDefault: UI_I_ResourceMeter<UI_I_MeterBlockItem>[] = [
-  {
-    type: 'cpu',
-    free: { text: '0', value: 0 },
-    used: { text: '0', value: 0 },
-    capacity: { text: '0', value: 0 },
-  },
-  {
-    type: 'memory',
-    free: { text: '0', value: 0 },
-    used: { text: '0', value: 0 },
-    capacity: { text: '0', value: 0 },
-  },
-  {
-    type: 'storage',
-    free: { text: '0', value: 0 },
-    used: { text: '0', value: 0 },
-    capacity: { text: '0', value: 0 },
-  },
-]

package/components/common/home/models/interfaces.ts

@@ -1,59 +0,0 @@
-import type { UI_T_NodeType } from '~/components/common/home/models/types'
-
-export interface UI_I_ZoneList {
-  name: string
-  id: number
-}
-
-export interface UI_I_ResourceMeter<T> {
-  type: string
-  capacity?: T
-  free?: T
-  used?: T
-}
-
-export interface UI_I_MeterBlockItem {
-  value: number
-  text: string
-}
-
-export interface UI_I_Hosts {
-  connected: number
-  disconnected: number
-  maintenance: number
-}
-
-export interface UI_I_Vms {
-  powered_on: number
-  powered_off: number
-  suspended: number
-}
-
-export interface UI_I_Alert {
-  item: string
-  type: UI_T_NodeType
-  id: number
-  alerts: number
-  warnings: number
-}
-
-export interface UI_I_Service {
-  id: number
-  item: string
-  statusIcon: string
-  statusText: string
-  version: string
-}
-
-export interface UI_I_HomeInfo {
-  resource_meter: UI_I_ResourceMeter<UI_I_MeterBlockItem>[]
-  hosts: UI_I_Hosts
-  vms: UI_I_Vms
-  alerts: UI_I_Alert[]
-  services: UI_I_Service[]
-}
-
-export interface UI_I_Card {
-  text: string
-  value: number
-}

package/components/common/home/models/types.ts

@@ -1,18 +0,0 @@
-export type UI_T_NodeType =
-  | 'zone'
-  | 'folder'
-  | 'datacenter'
-  | 'cluster'
-  // для прокуратор
-  | 'host'
-  | 'vm'
-  | 'datastore'
-  | 'network'
-
-export type UI_T_AlertColumnKeys = 'item' | 'alerts' | 'warnings'
-
-export type UI_T_ServiceColumnKeys =
-  | 'item'
-  | 'statusText'
-  | 'statusIcon'
-  | 'version'

package/components/common/home/servicesTable/ServicesTable.vue

@@ -1,79 +0,0 @@
-<template>
-  <div class="most-alert">
-    <atoms-table-data-grid
-      v-model:selected-row="selectedRow"
-      v-model:page-size="pageSize"
-      v-model:page="page"
-      class="data-table"
-      :head-items="headItems"
-      :body-items="bodyItems"
-      :total-items="bodyItems.length"
-      :total-pages="1"
-      off-select-by-row
-      hide-page-size
-      show-page-info
-      server-off
-    >
-      <template #icon="{ item }">
-        <span :class="['datagrid-cell-icon', item.data.iconClassName]" />
-        <span class="text-ellipsis">
-          {{ item.text }}
-        </span>
-      </template>
-    </atoms-table-data-grid>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type {
-  UI_I_HeadItem,
-  UI_I_BodyItem,
-} from '~/components/atoms/table/dataGrid/models/interfaces'
-import type { UI_T_SelectedRow } from '~/components/atoms/table/dataGrid/models/types'
-import type { UI_I_Localization } from '~/models/interfaces'
-import type { UI_I_Service } from '~/components/common/home/models/interfaces'
-import * as table from '~/components/common/home/servicesTable/config/config'
-
-const props = defineProps<{
-  dataTable: UI_I_Service[]
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedRow = ref<UI_T_SelectedRow>(null)
-const headItems = computed<UI_I_HeadItem[]>(() =>
-  table.headItems(localization.value)
-)
-const bodyItems = ref<UI_I_BodyItem[][]>([])
-watch(
-  () => props.dataTable,
-  (newValue) => {
-    if (!newValue?.length) {
-      bodyItems.value = []
-      return
-    }
-
-    bodyItems.value = table.bodyItems(newValue)
-  },
-  { deep: true, immediate: true }
-)
-const page = ref<number>(1)
-const pageSize = ref<number>(1)
-</script>
-
-<style lang="scss" scoped>
-.most-alert {
-  margin: 0;
-  border: none;
-
-  :deep(.datagrid-outer-wrapper) {
-    padding: 0;
-
-    .datagrid {
-      margin: 0;
-      border: unset;
-      min-height: 200px;
-    }
-  }
-}
-</style>

package/components/common/home/servicesTable/config/config.ts

@@ -1,62 +0,0 @@
-import type {
-  UI_I_BodyItem,
-  UI_I_HeadItem,
-} from '~/components/atoms/table/dataGrid/models/interfaces'
-import type { UI_I_Localization } from '~/models/interfaces'
-import { constructHeadItem } from '~/components/atoms/table/dataGrid/utils/constructDataTable'
-import type { UI_T_ServiceColumnKeys } from '~/components/common/home/models/types'
-import type { UI_I_Service } from '~/components/common/home/models/interfaces'
-
-export const servicesTableKeys: UI_T_ServiceColumnKeys[] = [
-  'item',
-  'statusText',
-  'statusIcon',
-  'version',
-]
-
-const getItems = (
-  localization: UI_I_Localization
-): [string, boolean, string, string][] => {
-  return [
-    [localization.item, true, '34%', servicesTableKeys[0]],
-    [localization.status, true, '33%', servicesTableKeys[1]],
-    [localization.version, true, '33%', servicesTableKeys[2]],
-  ]
-}
-
-export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
-  const result: UI_I_HeadItem[] = []
-  getItems(localization).forEach((item, i) => {
-    const col = i === 1 ? 'icon' : `col${i + 1}`
-    result.push(constructHeadItem(col, item[0], item[3], true, item[2]))
-  })
-  return result
-}
-
-export const bodyItems = (data: UI_I_Service[]): UI_I_BodyItem[][] => {
-  const bodyItems: UI_I_BodyItem[][] = []
-  data.forEach((service: UI_I_Service, key) => {
-    const statusData = {
-      iconClassName: `vsphere-icon-status-${service.statusIcon}`,
-    }
-    bodyItems.push([
-      {
-        key: 'col1',
-        text: service[servicesTableKeys[0]].toString(),
-        id: key,
-      },
-      {
-        key: 'icon',
-        text: service[servicesTableKeys[1]].toString(),
-        data: statusData,
-        id: key,
-      },
-      {
-        key: 'col3',
-        text: service[servicesTableKeys[2]].toString(),
-        id: key,
-      },
-    ])
-  })
-  return bodyItems
-}