bfg-common 1.4.695 → 1.4.696

package/components/common/pages/home/StatusContent.vue

@@ -1,49 +1,49 @@
-<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.common[value] }}
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_Hosts } from '~/components/common/pages/home/lib/models/interfaces'
-
-const props = defineProps<{
-  items: UI_I_Hosts
-}>()
-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>
+<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.common[value] }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_Hosts } from '~/components/common/pages/home/lib/models/interfaces'
+
+const props = defineProps<{
+  items: UI_I_Hosts
+}>()
+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/pages/home/headline/Headline.vue

@@ -1,44 +1,44 @@
-<template>
-  <div class="home-headline">
-    <common-pages-home-headline-new
-      v-if="isNewView"
-      v-model="selectedZone"
-      :data="zoneOptionList"
-      :project="props.project"
-    ></common-pages-home-headline-new>
-
-    <common-pages-home-headline-old
-      v-else
-      v-model="selectedZone"
-      :data="zoneOptionList"
-    ></common-pages-home-headline-old>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { UI_I_ZoneList } from '~/components/common/pages/home/lib/models/interfaces'
-import type { UI_T_Project } from '~/lib/models/types'
-
-const selectedZone = defineModel<string>('selectedZone', { required: true })
-
-const props = defineProps<{
-  zoneList: UI_I_ZoneList[]
-  project: UI_T_Project
-}>()
-
-const { $store }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const zoneOptionList = computed<UI_I_ZoneList[]>(() => props.zoneList)
-</script>
-
-<style lang="scss">
-:root {
-  --home-title-color: #4d5d69;
-}
-
-:root.dark-theme {
-  --home-title-color: #e9eaec;
-}
-</style>
+<template>
+  <div class="home-headline">
+    <common-pages-home-headline-new
+      v-if="isNewView"
+      v-model="selectedZone"
+      :data="zoneOptionList"
+      :project="props.project"
+    ></common-pages-home-headline-new>
+
+    <common-pages-home-headline-old
+      v-else
+      v-model="selectedZone"
+      :data="zoneOptionList"
+    ></common-pages-home-headline-old>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { UI_I_ZoneList } from '~/components/common/pages/home/lib/models/interfaces'
+import type { UI_T_Project } from '~/lib/models/types'
+
+const selectedZone = defineModel<string>('selectedZone', { required: true })
+
+const props = defineProps<{
+  zoneList: UI_I_ZoneList[]
+  project: UI_T_Project
+}>()
+
+const { $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
+const zoneOptionList = computed<UI_I_ZoneList[]>(() => props.zoneList)
+</script>
+
+<style lang="scss">
+:root {
+  --home-title-color: #4d5d69;
+}
+
+:root.dark-theme {
+  --home-title-color: #e9eaec;
+}
+</style>

package/components/common/pages/home/headline/HeadlineNew.vue

@@ -1,71 +1,71 @@
-<template>
-  <div class="container-flex">
-    <h1>{{ localization.mainNavigation.home }}</h1>
-
-    <ui-select
-      v-if="isProjectSphere"
-      v-model="selectedZoneModel"
-      :items="selectItems"
-      :disabled="!selectItems.length"
-      width="165px"
-      select-width="100%"
-      size="sm"
-      test-id="home-zone-select"
-    >
-      <template v-if="!selectItems.length" #toggleContent>
-        <div class="default-toggle-content">
-          <span class="default-icon vsphere-icon-vcenter"></span>
-          <span class="text">{{ localization.common.default }}</span>
-        </div>
-      </template>
-    </ui-select>
-  </div>
-</template>
-
-<script lang="ts" setup>
-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 type { UI_T_Project } from '~/lib/models/types'
-import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
-
-const selectedZoneModel = defineModel<string>({ required: true })
-const props = defineProps<{
-  project: UI_T_Project
-  data: UI_I_Option[]
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const isProjectSphere = computed<boolean>(() => props.project === 'sphere')
-
-const selectItems = computed<UI_I_Dropdown[]>(() => props.data)
-</script>
-
-<style lang="scss" scoped>
-@import '/assets/scss/common/mixins';
-.container-flex {
-  @include flex($align: center, $just: space-between);
-  & > h1 {
-    color: var(--home-title-color);
-    font-size: 22px;
-    font-weight: 400;
-    line-height: 26.63px;
-    margin-bottom: 19px;
-  }
-
-  .default-toggle-content {
-    display: flex;
-    align-items: center;
-    grid-gap: 8px;
-
-    .default-icon {
-      width: 20px;
-      height: 20px;
-    }
-    .text {
-      font-size: 13px;
-      font-weight: 400;
-    }
-  }
-}
-</style>
+<template>
+  <div class="container-flex">
+    <h1>{{ localization.mainNavigation.home }}</h1>
+
+    <ui-select
+      v-if="isProjectSphere"
+      v-model="selectedZoneModel"
+      :items="selectItems"
+      :disabled="!selectItems.length"
+      width="165px"
+      select-width="100%"
+      size="sm"
+      test-id="home-zone-select"
+    >
+      <template v-if="!selectItems.length" #toggleContent>
+        <div class="default-toggle-content">
+          <span class="default-icon vsphere-icon-vcenter"></span>
+          <span class="text">{{ localization.common.default }}</span>
+        </div>
+      </template>
+    </ui-select>
+  </div>
+</template>
+
+<script lang="ts" setup>
+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 type { UI_T_Project } from '~/lib/models/types'
+import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
+
+const selectedZoneModel = defineModel<string>({ required: true })
+const props = defineProps<{
+  project: UI_T_Project
+  data: UI_I_Option[]
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const isProjectSphere = computed<boolean>(() => props.project === 'sphere')
+
+const selectItems = computed<UI_I_Dropdown[]>(() => props.data)
+</script>
+
+<style lang="scss" scoped>
+@import '/assets/scss/common/mixins';
+.container-flex {
+  @include flex($align: center, $just: space-between);
+  & > h1 {
+    color: var(--home-title-color);
+    font-size: 22px;
+    font-weight: 400;
+    line-height: 26.63px;
+    margin-bottom: 19px;
+  }
+
+  .default-toggle-content {
+    display: flex;
+    align-items: center;
+    grid-gap: 8px;
+
+    .default-icon {
+      width: 20px;
+      height: 20px;
+    }
+    .text {
+      font-size: 13px;
+      font-weight: 400;
+    }
+  }
+}
+</style>

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

@@ -1,48 +1,48 @@
-import type { UI_T_NodeType } from '~/components/common/pages/home/lib/models/types'
-import type { UI_I_Resources } from '~/components/common/resource/lib/models/interfaces'
-import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
-
-export interface UI_I_ZoneList extends UI_I_Option {}
-export interface UI_I_Hosts {
-  connected: number
-  disconnected: number
-  maintenance: number
-  total: number
-}
-
-export interface UI_I_Vms {
-  powered_on: number
-  powered_off: number
-  suspended: number
-  total: 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_Resources[]
-  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
-  icon?: string
-}
+import type { UI_T_NodeType } from '~/components/common/pages/home/lib/models/types'
+import type { UI_I_Resources } from '~/components/common/resource/lib/models/interfaces'
+import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
+
+export interface UI_I_ZoneList extends UI_I_Option {}
+export interface UI_I_Hosts {
+  connected: number
+  disconnected: number
+  maintenance: number
+  total: number
+}
+
+export interface UI_I_Vms {
+  powered_on: number
+  powered_off: number
+  suspended: number
+  total: 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_Resources[]
+  vms: UI_I_Vms
+  alerts: UI_I_Alert[]
+  services: UI_I_Service[]
+  hosts?: UI_I_Hosts
+}
+
+export interface UI_I_Card {
+  text: string
+  value: number
+  icon?: string
+}

package/components/common/pages/home/widgets/Widgets.vue

@@ -1,45 +1,49 @@
-<template>
-  <common-pages-home-widgets-new
-    v-if="isNewView"
-    :vms="vms"
-    :hosts="hosts"
-    :alerts="alerts || []"
-    :services="services || []"
-    :loading="props.loading"
-  ></common-pages-home-widgets-new>
-
-  <common-pages-home-widgets-old
-    v-else
-    :vms="vms"
-    :hosts="hosts"
-    :alerts="alerts || []"
-    :services="services || []"
-  ></common-pages-home-widgets-old>
-</template>
-
-<script lang="ts" setup>
-import type {
-  UI_I_Alert,
-  UI_I_HomeInfo,
-  UI_I_Hosts,
-  UI_I_Vms,
-  UI_I_Service,
-} from '~/components/common/pages/home/lib/models/interfaces'
-
-const props = defineProps<{
-  homeInfo: UI_I_HomeInfo
-  loading: boolean
-}>()
-
-const { $store }: any = useNuxtApp()
-
-const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
-
-const vms = computed<UI_I_Vms>(() => props.homeInfo.vms || {})
-const hosts = computed<UI_I_Hosts>(() => props.homeInfo.hosts || {})
-
-const alerts = computed<UI_I_Alert[]>(() => props.homeInfo.alerts || 0)
-const services = computed<UI_I_Service[]>(() => props.homeInfo.services || 0)
-</script>
-
-<style lang="scss" scoped></style>
+<template>
+  <common-pages-home-widgets-new
+    v-if="isNewView"
+    :vms="vms"
+    :hosts="hosts"
+    :alerts="alerts || []"
+    :services="services || []"
+    :loading="props.loading"
+    :project="props.project"
+  />
+
+  <common-pages-home-widgets-old
+    v-else
+    :vms="vms"
+    :hosts="hosts"
+    :alerts="alerts || []"
+    :services="services || []"
+    :project="props.project"
+  />
+</template>
+
+<script lang="ts" setup>
+import type {
+  UI_I_Alert,
+  UI_I_HomeInfo,
+  UI_I_Hosts,
+  UI_I_Vms,
+  UI_I_Service,
+} from '~/components/common/pages/home/lib/models/interfaces'
+import type { UI_T_Project } from '~/lib/models/types'
+
+const props = defineProps<{
+  homeInfo: UI_I_HomeInfo
+  loading: boolean
+  project?: UI_T_Project
+}>()
+
+const { $store }: any = useNuxtApp()
+
+const isNewView = computed<boolean>(() => $store.getters['main/getIsNewView'])
+
+const vms = computed<UI_I_Vms>(() => props.homeInfo.vms || {})
+const hosts = computed<UI_I_Hosts>(() => props.homeInfo.hosts || {})
+
+const alerts = computed<UI_I_Alert[]>(() => props.homeInfo.alerts || 0)
+const services = computed<UI_I_Service[]>(() => props.homeInfo.services || 0)
+</script>
+
+<style lang="scss" scoped></style>