bfg-common 1.2.136 → 1.2.138

package/components/atoms/table/dataGrid/DataGrid.vue

@@ -82,7 +82,7 @@
                             ]"
                             @click="sortTable(item.sortColumn)"
                           >
-                            <slot name="th" :key="key" :item="item">
+                            <slot :key="key" name="th" :item="item">
                               <span
                                 :title="item.text"
                                 :style="{
@@ -204,7 +204,7 @@
                             },
                           ]"
                         >
-                          <slot name="type" :key="key" :item="item">
+                          <slot :key="key" name="type" :item="item">
                             <div
                               :class="`clr-${props.type}-wrapper flex-justify-center flex-align-center`"
                             >
@@ -479,7 +479,7 @@ const emits = defineEmits<{
   (event: 'update:selected-row', value: UI_T_SelectedRow): void
   (event: 'update:page-size', value: number): void
   (event: 'update:page', value: number): void
-  (event: 'filtering', value: any): void
+  (event: 'filtering', value: string[][]): void
   (event: 'sorting', value: [string, boolean]): void
   (event: 'change', value: any): void
   (event: 'row-detail', value: number): void
@@ -660,11 +660,10 @@ const sortTable = (sortName: string): void => {
 const filterShow = ref<boolean[]>([])
 const filterTerm = ref<string[]>([])
 const filtering = (): void => {
-  const filter = headItemsPresent.value
-    .filter((_, key) => filterTerm.value[key])
-    .map((item, key) => {
-      return [item.key, filterTerm.value[key]]
-    })
+  const filter: string[][] = []
+  headItemsPresent.value.forEach((item, key) => {
+    if (filterTerm.value[key]) filter.push([item.key, filterTerm.value[key]])
+  })
 
   emits('filtering', filter)
 }

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

@@ -0,0 +1,9 @@
+export interface UI_I_VmPowerActions {
+  hard_stop: boolean
+  power_off: boolean
+  power_on: boolean
+  reset: boolean
+  restart_guest: boolean
+  shutdown_guest: boolean
+  suspend: boolean
+}

package/components/common/vm/utils/powerActions.ts

@@ -0,0 +1,55 @@
+import type { API_UI_T_VmState } from '~/models/store/types'
+import type { UI_I_VmPowerActions } from '~/components/common/vm/models/interfaces'
+
+export const getPowerActionsByState = (
+  state: API_UI_T_VmState
+): UI_I_VmPowerActions => {
+  const powerActions = {
+    hard_stop: false,
+    power_off: false,
+    power_on: false,
+    reset: false,
+    restart_guest: false,
+    shutdown_guest: false,
+    suspend: false,
+  }
+  switch (state) {
+    case 0: // Unknown
+      powerActions.power_on = true
+      powerActions.hard_stop = true
+      break
+    case 1: // Powered off
+      powerActions.power_on = true
+      break
+    case 2: // Powered on
+      powerActions.power_off = true
+      powerActions.suspend = true
+      powerActions.reset = true
+      powerActions.hard_stop = true
+      powerActions.shutdown_guest = true
+      powerActions.restart_guest = true
+      break
+    case 3: // Suspended
+    case 4: // Error
+    case 5: // Warning
+      powerActions.power_on = true
+      powerActions.hard_stop = true
+      break
+    case 6: // Pending
+      powerActions.hard_stop = true
+      break
+    case 7: // Paused
+      powerActions.power_on = true
+      powerActions.hard_stop = true
+      break
+    case 8: // Blocked
+    case 9: // Shutting down
+    case 10: // Shut off
+      powerActions.hard_stop = true
+      break
+    default:
+      powerActions.hard_stop = true
+  }
+
+  return powerActions
+}

package/components/common/wizards/vm/common/computeResource/TreeView.vue

@@ -0,0 +1,61 @@
+<template>
+  <div class="tree-view">
+    <atoms-loader-pre-loader
+      v-show="loading"
+      id="loader"
+      class="absolute-center tree-view__loading"
+      :show="true"
+    />
+    <common-recursion-tree
+      :nodes="props.computeResourceTree"
+      class="recursion-tree"
+      @get-nodes="onShowNodes"
+      @select-node="onSelectNode"
+      @contextmenu.prevent
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_TreeNode } from '~/node_modules/bfg-common/components/common/recursionTree/models/interfaces'
+
+const props = defineProps<{
+  modelValue: UI_I_TreeNode | null
+  computeResourceTree: UI_I_TreeNode[]
+}>()
+
+const emits = defineEmits<{
+  (event: 'update:modelValue', value: UI_I_TreeNode): void
+  (
+    event: 'get-compute-resource-tree',
+    value: { id: string | number; cb: () => void }
+  ): void
+  (event: 'show-compute-resource-tree', value: UI_I_TreeNode): void
+  (event: 'select-compute-resource-tree', value: UI_I_TreeNode): void
+  (event: 'clear-compute-resource-tree'): void
+}>()
+
+const loading = ref<boolean>(false)
+const onShowNodes = (event: any): void => {
+  emits('show-compute-resource-tree', event)
+}
+const onSelectNode = (node: UI_I_TreeNode): void => {
+  emits('select-compute-resource-tree', node)
+
+  emits('update:modelValue', node)
+}
+</script>
+
+<style scoped lang="scss">
+.tree-view {
+  &__loading {
+    :deep(.spinner.spinner-inverse) {
+      position: static;
+      width: 45px;
+      height: 45px;
+      min-width: 45px;
+      min-height: 45px;
+    }
+  }
+}
+</style>

package/components/common/wizards/vm/common/validation/compatibility/Compatibility.vue

@@ -4,8 +4,8 @@
     <div class="flex-align-center compatibility__content">
       <template v-if="!props.loading">
         <div class="compatibility__message">
-          <div class="icon icon-status-ok" />
-          <span>{{ localization.compatibilityChecksSucceeded }}</span>
+          <div :class="['icon', iconStatus]" />
+          <span>{{ validationText }}</span>
         </div>
       </template>
     </div>
@@ -14,10 +14,13 @@
 
 <script lang="ts" setup>
 import type { UI_I_Localization } from '~/models/interfaces'
+import { UI_E_ValidationCompatibilityStatusIcon } from '~/components/common/wizards/vm/common/validation/models/enums'
 
 const props = withDefaults(
   defineProps<{
     loading?: boolean
+    text: string
+    status: 'Error' | 'Success' | 'Warning'
   }>(),
   {
     loading: true,
@@ -25,6 +28,12 @@ const props = withDefaults(
 )
 
 const localization = computed<UI_I_Localization>(() => useLocal())
+
+const iconStatus = computed<string>(
+  () => UI_E_ValidationCompatibilityStatusIcon[props.status]
+)
+
+const validationText = computed<string>(() => localization.value[props.text])
 </script>
 
 <style lang="scss" scoped>

package/components/common/wizards/vm/common/validation/models/enums.ts

@@ -0,0 +1,5 @@
+export enum UI_E_ValidationCompatibilityStatusIcon {
+  Success = 'icon-status-ok',
+  Error = 'vsphere-icon-status-error',
+  Warning = 'vsphere-icon-status-warning',
+}

package/components/common/wizards/vm/migrate/Migrate.vue

@@ -34,6 +34,8 @@
 
         <common-wizards-vm-migrate-select-compute-resource
           v-show="currentBlockId === 'select-compute-resource'"
+          :migrate-type="vmMigrateType"
+          :compute-resource-tree="props.computeResourceTree"
         />
 
         <common-wizards-vm-migrate-select-storage
@@ -71,6 +73,7 @@ import type { UI_I_TablePayload } from '~/models/store/interfaces'
 import type { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
 import type { UI_I_VmSettings } from '~/models/store/vm/interfaces'
 import type { UI_T_VmMigrateType } from '~/components/common/wizards/vm/migrate/models/types'
+import type { UI_I_TreeNode } from '~/components/common/recursionTree/models/interfaces'
 import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/select/storage/table/disk/models/interfaces'
 import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/models/interfaces'
 import type { UI_I_SelectStorageReadyData } from '~/components/common/wizards/vm/migrate/select/storage/models/interfaces'
@@ -86,6 +89,7 @@ const props = defineProps<{
   getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
   datastore: UI_I_DatastoreTableItem[]
   configurePerDisks: UI_I_StorageConfigurePerDiskItem[]
+  computeResourceTree?: UI_I_TreeNode
   readyCompleteTableInfo?: any // пока так потом если будет нужен изменит или удалить
   finishFunc: any
 }>()

package/components/common/wizards/vm/migrate/select/computeResource/ComputeResource.vue

@@ -1,33 +1,141 @@
 <template>
   <div class="compute-resource">
-    <atoms-tabs
-      v-model="activeTab"
-      test-id="migrate-select-storage-tabs"
-      :items="selectStorageTabs"
-      size="small"
-      class="compute-resource__tabs"
-    />
+    <div
+      v-if="props.migrateType === 'resource-storage'"
+      class="tree-view-wrap mt-1"
+    >
+      <common-wizards-vm-common-compute-resource-tree-view
+        v-model="computeResourceDataLocal.selectedNode"
+        :compute-resource-tree="nodes"
+        @show-compute-resource-tree="onShowComputeResourceTree"
+        @select-compute-resource-tree="onSelectComputeResourceTree"
+      />
+    </div>
+
+    <template v-else>
+      <atoms-tabs
+        v-model="activeTab"
+        test-id="migrate-select-storage-tabs"
+        :items="selectStorageTabs"
+        size="small"
+        class="compute-resource__tabs"
+      />
 
-    <common-wizards-vm-common-validation-compatibility />
+      <common-wizards-vm-migrate-select-compute-resource-table-view
+        v-model:selected-data="selectedData"
+        :data-table="[]"
+        :type="activeTab"
+      />
+    </template>
+
+    <common-wizards-vm-common-validation-compatibility
+      :loading="!computeResourceDataLocal.selectedNode"
+      :status="compatibilityText[0]"
+      :text="compatibilityText[1]"
+    />
   </div>
 </template>
 
 <script lang="ts" setup>
 import type { UI_I_Localization } from '~/models/interfaces'
 import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/models/interfaces'
+import type { UI_I_TreeNode } from '~/components/common/recursionTree/models/interfaces'
 import type { UI_T_SelectComputeResourceTabType } from '~/components/common/wizards/vm/migrate/select/storage/models/types'
+import type { UI_T_VmMigrateType } from '~/components/common/wizards/vm/migrate/models/types'
 import { vmMigrateComputeResourceTabsFunc } from '~/components/common/wizards/vm/migrate/select/computeResource/config/tabsPannel'
 
+const props = defineProps<{
+  migrateType: UI_T_VmMigrateType
+  computeResourceTree: UI_I_TreeNode
+}>()
+
 const localization = computed<UI_I_Localization>(() => useLocal())
+const { $recursion } = useNuxtApp()
 
 const activeTab = ref<UI_T_SelectComputeResourceTabType>('host')
 const selectStorageTabs = computed<UI_I_CollapseNavItem[]>(() =>
   vmMigrateComputeResourceTabsFunc(localization.value)
 )
+
+const computeResourceDataLocal = ref<any>({
+  selectedNode: null,
+})
+
+const nodes = ref<UI_I_TreeNode[]>([])
+
+watch(
+  props.computeResourceTree,
+  (newValue) => {
+    if (nodes.value.length) return
+
+    nodes.value = useDeepCopy([newValue])
+  },
+  { immediate: true, deep: true }
+)
+
+const onShowComputeResourceTree = ({
+  node,
+  cb,
+}: {
+  node: UI_I_TreeNode
+  cb: () => void
+}): void => {
+  $recursion.findAndShow(
+    nodes.value,
+    [node.id, node.type],
+    ['id', 'type'],
+    'nodes'
+  )
+  cb()
+}
+const onSelectComputeResourceTree = (node: UI_I_TreeNode): void => {
+  $recursion.findAndActivate(
+    nodes.value,
+    [node.type, node.id],
+    ['type', 'id'],
+    'nodes'
+  )
+}
+const compatibilityText = computed<[string, string]>(() => {
+  const { selectedNode } = computeResourceDataLocal.value
+
+  if (!selectedNode) return ['Success', '']
+
+  let res: [string, string] = ['Success', 'compatibilityChecksSucceeded']
+
+  if (selectedNode.type === 'datacenter' || selectedNode.type === 'folder') {
+    res = ['Error', 'selectValidClusterOrHostDestination']
+  }
+  if (selectedNode.type === 'cluster') {
+    const hasHost = !!selectedNode.nodes.length
+    if (!hasHost) {
+      res = ['Error', 'clusterNotContainAnyHosts']
+    }
+  }
+
+  if (selectedNode.type === 'host') {
+    if (selectedNode.state === 'Error') {
+      // TODO check Maintenance Mode
+      res = ['Error', 'selectedHostDisconnectedMaintenanceMode']
+    }
+  }
+
+  return res
+})
+
+const selectedData = ref([])
 </script>
 
 <style lang="scss" scoped>
 .compute-resource {
+  .tree-view-wrap {
+    max-height: 250px;
+    min-height: 200px;
+    position: relative;
+    border: 1px solid #000;
+    padding: 5px 0 0 5px;
+    overflow: auto;
+  }
   &__tabs {
     width: 100%;
     :deep(.nav) {

package/components/common/wizards/vm/migrate/select/computeResource/tableView/TableView.vue

@@ -0,0 +1,90 @@
+<template>
+  <div class="table-wrap">
+    <atoms-table-data-grid
+      v-model:selected-row="selectedRow"
+      v-model:column-keys="columnKeys"
+      v-model:page-size="pagination.pageSize"
+      v-model:page="pagination.page"
+      type="checkbox"
+      :head-items="headItems"
+      :body-items="bodyItems"
+      :total-items="bodyItems.length"
+      :total-pages="1"
+      server-off
+      hide-footer
+      hide-page-size
+      @sorting="sorting"
+    >
+    </atoms-table-data-grid>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import type { UI_I_Pagination, UI_I_Localization } from '~/models/interfaces'
+import type {
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+  UI_I_BodyItem,
+} from '~/components/atoms/table/dataGrid/models/interfaces'
+import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/select/storage/table/disk/models/interfaces'
+import type { UI_T_SelectComputeResourceTabType } from '~/components/common/wizards/vm/migrate/select/storage/models/types'
+import * as hostTable from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/hostTable'
+import * as clusterTable from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/clusterTable'
+import * as resourcePoolTable from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/resourcePoolTable'
+import * as vAppsTable from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/vappsTable'
+
+const props = defineProps<{
+  selectedData: number[]
+  dataTable: UI_I_StorageConfigurePerDiskItem[]
+  type: UI_T_SelectComputeResourceTabType
+}>()
+const emits = defineEmits<{
+  (event: 'update:selected-data', value: number[] | null): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const table: any = {
+  host: hostTable,
+  cluster: clusterTable,
+  'resource-pool': resourcePoolTable,
+  'v-apps': vAppsTable,
+}
+
+const headItems = computed<UI_I_HeadItem[]>(() =>
+  table[props.type].headItems(localization.value)
+)
+const columnKeys = computed<UI_I_ColumnKey[]>(() =>
+  table[props.type].columnKeys(localization.value)
+)
+watch(localization, () => {
+  columnKeys.value = table[props.type].columnKeys(localization.value)
+})
+
+const bodyItems = computed<UI_I_BodyItem[][]>(() => {
+  return table[props.type].bodyItems(props.dataTable)
+})
+
+const sort = ref<string | null>(null)
+const pagination = ref<UI_I_Pagination>({
+  page: 1,
+  pageSize: 100,
+})
+
+const sorting = (data: [string, boolean]): void => {
+  const [column, status] = data
+  const direction = status ? 'asc' : 'desc'
+  sort.value = `${column}.${direction}`
+}
+
+const selectedRow = computed<number[]>({
+  get() {
+    return props.selectedData
+  },
+  set(newValue: number[]) {
+    emits('update:selected-data', newValue)
+  },
+})
+</script>
+
+<style lang="scss" scoped></style>

package/components/common/wizards/vm/migrate/select/computeResource/tableView/config/clusterTable.ts

@@ -0,0 +1,114 @@
+import type {
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+  UI_I_BodyItem,
+} from '~/components/atoms/table/dataGrid/models/interfaces'
+import type { UI_I_Localization } from '~/models/interfaces'
+import type {
+  I_Clusters,
+  I_TableIconColumnData,
+} from '~/components/templates/inventory/mainBlock/tablesView/models/interfaces'
+import { E_StatusEnum } from '~/components/templates/inventory/treeView/models/enums'
+import { columnKeys as getColumnKeys } from '~/components/templates/inventory/mainBlock/tablesView/config/columnKeys'
+import { headItems as getHeadItems } from '~/components/templates/inventory/mainBlock/tablesView/config/headItems'
+import { clusterTableItemKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/tableKeys'
+
+const getItems = (
+  localization: UI_I_Localization
+): [string, boolean, string, string][] => {
+  return [
+    [localization.name, true, '180px', clusterTableItemKeys[0]],
+    [localization.availableCpu, true, '180px', clusterTableItemKeys[1]],
+    [localization.availableMemory, true, '180px', clusterTableItemKeys[2]],
+    [localization.availableStorage, true, '180px', clusterTableItemKeys[3]],
+    [localization.vSphere_DRS, true, '180px', clusterTableItemKeys[4]],
+    [localization.vSphere_HA, true, '180px', clusterTableItemKeys[5]],
+    [localization.totalCpu, false, '180px', clusterTableItemKeys[6]],
+    [localization.totalMemory, false, '180px', clusterTableItemKeys[7]],
+    [localization.totalStorage, false, '180px', clusterTableItemKeys[8]],
+    [localization.vms, false, '180px', clusterTableItemKeys[9]],
+    [localization.hosts, false, '180px', clusterTableItemKeys[10]],
+    [localization.cpus, false, '180px', clusterTableItemKeys[11]],
+    [localization.datastores, false, '180px', clusterTableItemKeys[12]],
+    [localization.vSAN, false, '180px', clusterTableItemKeys[13]],
+    [localization.vc, false, '180px', clusterTableItemKeys[14]],
+    [localization.evcCpuMode, true, '180px', clusterTableItemKeys[15]],
+    [localization.evcGraphicsMode, true, '240px', clusterTableItemKeys[16]],
+  ]
+}
+
+export const columnKeys = (
+  localization: UI_I_Localization
+): UI_I_ColumnKey[] => {
+  return getColumnKeys(getItems(localization))
+}
+
+export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
+  return getHeadItems(getItems(localization))
+}
+
+export const bodyItems = (data: I_Clusters[]): UI_I_BodyItem[][] => {
+  const { $binary } = useNuxtApp()
+
+  const bodyItems: UI_I_BodyItem[][] = []
+  data.forEach((cluster, key) => {
+    const clusterData: I_TableIconColumnData = {
+      iconClassName: E_StatusEnum.cluster_Normal,
+      name: cluster.name,
+      // @ts-ignore TODO id надо для перехода, пока что так оставить чтобы нигде не ломалось потом поправить для всех
+      id: cluster.id,
+      nav: 'h',
+      type: 'cluster',
+      isLink: true,
+    }
+    bodyItems.push([
+      {
+        key: 'icon',
+        text: cluster[clusterTableItemKeys[0]],
+        data: clusterData,
+        id: key,
+      },
+      {
+        key: 'col2',
+        text: $binary.roundHz(cluster[clusterTableItemKeys[1]]),
+        id: key,
+      },
+      {
+        key: 'col3',
+        text: $binary.round(cluster[clusterTableItemKeys[2]]),
+        id: key,
+      },
+      {
+        key: 'col4',
+        text: $binary.round(cluster[clusterTableItemKeys[3]]),
+        id: key,
+      },
+      { key: 'col5', text: cluster[clusterTableItemKeys[4]], id: key },
+      { key: 'col6', text: cluster[clusterTableItemKeys[5]], id: key },
+      {
+        key: 'col7',
+        text: $binary.roundHz(cluster[clusterTableItemKeys[6]]),
+        id: key,
+      },
+      {
+        key: 'col8',
+        text: $binary.round(cluster[clusterTableItemKeys[7]]),
+        id: key,
+      },
+      {
+        key: 'col9',
+        text: $binary.round(cluster[clusterTableItemKeys[8]]),
+        id: key,
+      },
+      { key: 'col10', text: cluster[clusterTableItemKeys[9]], id: key },
+      { key: 'col11', text: cluster[clusterTableItemKeys[10]], id: key },
+      { key: 'col12', text: cluster[clusterTableItemKeys[11]], id: key },
+      { key: 'col13', text: cluster[clusterTableItemKeys[12]], id: key },
+      { key: 'col14', text: cluster[clusterTableItemKeys[13]], id: key },
+      { key: 'col15', text: cluster[clusterTableItemKeys[14]], id: key },
+      { key: 'col16', text: cluster[clusterTableItemKeys[15]], id: key },
+      { key: 'col17', text: cluster[clusterTableItemKeys[16]], id: key },
+    ])
+  })
+  return bodyItems
+}

package/components/common/wizards/vm/migrate/select/computeResource/tableView/config/hostTable.ts

@@ -0,0 +1,141 @@
+import type {
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+  UI_I_BodyItem,
+} from '~/components/atoms/table/dataGrid/models/interfaces'
+import type { UI_I_Localization } from '~/models/interfaces'
+import {
+  constructColumnKey,
+  constructHeadItem,
+} from '~/components/atoms/table/dataGrid/utils/constructDataTable'
+import {
+  hostIconByState,
+  hostLocalizationByState,
+} from '~/components/common/config/states'
+// import type { I_TableIconColumnData } from '~/components/templates/inventory/mainBlock/tablesView/models/interfaces'
+// import type { API_I_HostTableItem } from '~/models/store/inventory/host/interfaces'
+import { E_StatusEnum } from '~/components/templates/inventory/treeView/models/enums'
+import { hostTableItemKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/tableKeys'
+
+const getItems = (
+  localization: UI_I_Localization
+): [string, boolean, string, string][] => {
+  return [
+    [localization.name, true, '180px', hostTableItemKeys[0]],
+    [localization.state, true, '96px', hostTableItemKeys[1]],
+    [localization.cluster, true, '180px', hostTableItemKeys[2]],
+    [localization.faultDomain, true, '180px', hostTableItemKeys[3]],
+    [`${localization.consumedCpu} %`, true, '180px', hostTableItemKeys[4]],
+    [`${localization.consumedMemory} %`, true, '180px', hostTableItemKeys[5]],
+    [localization.haState, true, '180px', hostTableItemKeys[6]],
+    [localization.uptime, true, '180px', hostTableItemKeys[7]],
+    [localization.certificateValidTo, false, '180px', hostTableItemKeys[8]],
+    [
+      `${localization.memorySize} (${localization.mb})`,
+      false,
+      '180px',
+      hostTableItemKeys[9],
+    ],
+    [localization.cpus, false, '180px', hostTableItemKeys[10]],
+    [localization.nics, false, '180px', hostTableItemKeys[11]],
+    [localization.version, false, '180px', hostTableItemKeys[12]],
+    [localization.alarmActions, false, '180px', hostTableItemKeys[13]],
+  ]
+}
+
+export const columnKeys = (
+  localization: UI_I_Localization
+): UI_I_ColumnKey[] => {
+  const result: UI_I_ColumnKey[] = []
+  getItems(localization).forEach((item, i) => {
+    const col =
+      i === 0 ? 'icon' : i === 5 || i === 6 ? 'progress' : `col${i + 1}`
+    result.push(constructColumnKey(col, item[0], item[1]))
+  })
+  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 === 0 ? 'icon' : i === 5 || i === 6 ? 'progress' : `col${i + 1}`
+    result.push(constructHeadItem(col, item[0], item[3], false, item[2]))
+  })
+  return result
+}
+
+export const bodyItems = (
+  data: API_I_HostTableItem[],
+  localization: UI_I_Localization
+): UI_I_BodyItem[][] => {
+  const { $number } = useNuxtApp()
+
+  const bodyItems: UI_I_BodyItem[][] = []
+  data.forEach((host, key) => {
+    const hostData: any = {
+      iconClassName: `vsphere-icon-${hostIconByState[host.state]}`,
+      name: host.name,
+      // @ts-ignore TODO id надо для перехода, пока что так оставить чтобы нигде не ломалось потом поправить для всех
+      id: host.name,
+      nav: 'h',
+      type: 'host',
+      isLink: true,
+    }
+
+    const clusterData: any = {
+      iconClassName: E_StatusEnum.cluster_Normal,
+      name: host.cluster,
+      nav: 'h',
+      type: 'cluster',
+      isLink: true,
+    }
+    bodyItems.push([
+      {
+        key: 'icon',
+        text: host[hostTableItemKeys[0]],
+        data: hostData,
+        id: key,
+      },
+      {
+        key: 'col2',
+        text: localization[hostLocalizationByState[host[hostTableItemKeys[1]]]],
+        id: key,
+      },
+      {
+        key: 'col3',
+        text: host[hostTableItemKeys[2]],
+        data: clusterData,
+        id: key,
+      },
+      { key: 'col4', text: host[hostTableItemKeys[3]], id: key },
+      {
+        key: 'progress',
+        text: `${host[hostTableItemKeys[4]].toFixed(2)}%`,
+        data: host[hostTableItemKeys[4]],
+        id: key,
+      },
+      {
+        key: 'progress',
+        text: `${host[hostTableItemKeys[5]].toFixed(2)}%`,
+        data: host[hostTableItemKeys[5]],
+        id: key,
+      },
+      { key: 'col7', text: host[hostTableItemKeys[6]], id: key },
+      { key: 'col8', text: host[hostTableItemKeys[7]], id: key },
+      { key: 'col9', text: host[hostTableItemKeys[8]], id: key },
+      {
+        key: 'col10',
+        text: `${$number.format(host[hostTableItemKeys[9]], 'en')} ${
+          localization.mb
+        }`,
+        id: key,
+      },
+      { key: 'col11', text: host[hostTableItemKeys[10]], id: key },
+      { key: 'col12', text: host[hostTableItemKeys[11]], id: key },
+      { key: 'col13', text: host[hostTableItemKeys[12]], id: key },
+      { key: 'col14', text: host[hostTableItemKeys[13]], id: key },
+    ])
+  })
+  return bodyItems
+}

package/components/common/wizards/vm/migrate/select/computeResource/tableView/config/resourcePoolTable.ts

@@ -0,0 +1,115 @@
+import type {
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+  UI_I_BodyItem,
+} from '~/components/atoms/table/dataGrid/models/interfaces'
+import type { UI_I_Localization } from '~/models/interfaces'
+import {
+  constructColumnKey,
+  constructHeadItem,
+} from '~/components/atoms/table/dataGrid/utils/constructDataTable'
+import { resourcePoolsTableItemKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/tableKeys'
+
+const getItems = (
+  localization: UI_I_Localization
+): [string, boolean, string, string][] => {
+  return [
+    [localization.name, true, '90px', resourcePoolsTableItemKeys[0]],
+    [
+      localization.cpuReservationMhz,
+      true,
+      '180px',
+      resourcePoolsTableItemKeys[0],
+    ],
+    [localization.cpuLimitMhz, true, '180px', resourcePoolsTableItemKeys[0]],
+    [
+      localization.cpuAllocationType,
+      true,
+      '180px',
+      resourcePoolsTableItemKeys[0],
+    ],
+    [localization.cpuShares, true, '180px', resourcePoolsTableItemKeys[1]],
+    [localization.cpuSharesValue, true, '180px', resourcePoolsTableItemKeys[2]],
+    [
+      localization.memoryReservationMb,
+      true,
+      '180px',
+      resourcePoolsTableItemKeys[2],
+    ],
+    [localization.memoryLimitMb, true, '180px', resourcePoolsTableItemKeys[2]],
+    [
+      localization.memoryAllocationType,
+      true,
+      '180px',
+      resourcePoolsTableItemKeys[2],
+    ],
+    [localization.memoryShares, true, '180px', resourcePoolsTableItemKeys[3]],
+    [
+      localization.memorySharesValue,
+      true,
+      '180px',
+      resourcePoolsTableItemKeys[4],
+    ],
+    [localization.vc, true, '90px', resourcePoolsTableItemKeys[5]],
+  ]
+}
+
+export const columnKeys = (
+  localization: UI_I_Localization
+): UI_I_ColumnKey[] => {
+  const result: UI_I_ColumnKey[] = []
+  getItems(localization).forEach((item, i) => {
+    result.push(constructColumnKey(`col${i}`, item[0], item[1]))
+  })
+  return result
+}
+
+export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
+  const result: UI_I_HeadItem[] = []
+  getItems(localization).forEach((item, i) => {
+    result.push(constructHeadItem(`col${i}`, item[0], item[3], false, item[2]))
+  })
+  return result
+}
+
+export const bodyItems = (data: any[]): UI_I_BodyItem[][] => {
+  const { $binary } = useNuxtApp()
+  const bodyItems: UI_I_BodyItem[][] = []
+  data.forEach((vapp, key) => {
+    bodyItems.push([
+      {
+        key: 'col0',
+        text: vapp[resourcePoolsTableItemKeys[0]],
+        id: key,
+      },
+      {
+        key: 'col1',
+        text: $binary.roundHz(vapp[resourcePoolsTableItemKeys[1]]),
+        id: key,
+      },
+      {
+        key: 'col2',
+        text: $binary.roundHz(vapp[resourcePoolsTableItemKeys[2]]),
+        id: key,
+      },
+      { key: 'col3', text: vapp[resourcePoolsTableItemKeys[3]], id: key },
+      { key: 'col4', text: vapp[resourcePoolsTableItemKeys[4]], id: key },
+      { key: 'col5', text: vapp[resourcePoolsTableItemKeys[5]], id: key },
+      {
+        key: 'col6',
+        text: $binary.round(vapp[resourcePoolsTableItemKeys[6]]),
+        id: key,
+      },
+      {
+        key: 'col7',
+        text: $binary.round(vapp[resourcePoolsTableItemKeys[7]]),
+        id: key,
+      },
+      { key: 'col8', text: vapp[resourcePoolsTableItemKeys[8]], id: key },
+      { key: 'col9', text: vapp[resourcePoolsTableItemKeys[9]], id: key },
+      { key: 'col10', text: vapp[resourcePoolsTableItemKeys[10]], id: key },
+      { key: 'col11', text: vapp[resourcePoolsTableItemKeys[11]], id: key },
+    ])
+  })
+  return bodyItems
+}

package/components/common/wizards/vm/migrate/select/computeResource/tableView/config/tableKeys.ts

@@ -0,0 +1,65 @@
+import type {
+  T_HostTableTuple,
+  T_ClusterTableTuple,
+  T_VAppsTableTuple,
+  T_ResourcePoolTableTuple,
+} from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/models/types'
+
+export const hostTableItemKeys: T_HostTableTuple = [
+  'name',
+  'state',
+  'cluster',
+  'fault_domain',
+  'consumed_cpu',
+  'consumed_mem',
+  'ha_state',
+  'uptime',
+  'cert_valid_to',
+  'mem_size',
+  'cpus',
+  'nics',
+  'version',
+  'alarm_action',
+]
+export const clusterTableItemKeys: T_ClusterTableTuple = [
+  'name',
+  'available_cpu',
+  'available_memory',
+  'available_storage',
+  'drs',
+  'ha',
+  'total_cpu',
+  'total_memory',
+  'total_storage',
+  'vms',
+  'hosts',
+  'cpus',
+  'datastores',
+  'vsan',
+  'vc',
+  'evc_cpu_mode',
+  'evc_graphics_mode',
+]
+export const vAppsTableItemKeys: T_VAppsTableTuple = [
+  'name',
+  'cpu_shares',
+  'cpu_shares_val',
+  'memory_shares',
+  'memory_shares_val',
+  'managed_by',
+]
+
+export const resourcePoolsTableItemKeys: T_ResourcePoolTableTuple = [
+  'name',
+  'cpu_reservation',
+  'cpu_limit',
+  'cpu_allocation_type',
+  'cpu_shares',
+  'cpu_shares_val',
+  'memory_reservation',
+  'memory_limit',
+  'memory_allocation_type',
+  'memory_shares',
+  'memory_shares_val',
+  'vc',
+]

package/components/common/wizards/vm/migrate/select/computeResource/tableView/config/vappsTable.ts

@@ -0,0 +1,66 @@
+import {
+  UI_I_ColumnKey,
+  UI_I_HeadItem,
+  UI_I_BodyItem,
+} from '~/components/atoms/table/dataGrid/models/interfaces'
+import type { UI_I_Localization } from '~/models/interfaces'
+// import {
+//   I_TableIconColumnData,
+//   I_Vapps,
+// } from '~/components/templates/inventory/mainBlock/tablesView/models/interfaces'
+import { E_StatusEnum } from '~/components/templates/inventory/treeView/models/enums'
+import { columnKeys as getColumnKeys } from '~/components/templates/inventory/mainBlock/tablesView/config/columnKeys'
+import { headItems as getHeadItems } from '~/components/templates/inventory/mainBlock/tablesView/config/headItems'
+import { vAppsTableItemKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/tableView/config/tableKeys'
+
+const getItems = (
+  localization: UI_I_Localization
+): [string, boolean, string, string][] => {
+  return [
+    [localization.name, true, '180px', vAppsTableItemKeys[0]],
+    [localization.cpuShares, true, '180px', vAppsTableItemKeys[1]],
+    [localization.cpuSharesValue, true, '180px', vAppsTableItemKeys[2]],
+    [localization.memoryShares, true, '180px', vAppsTableItemKeys[3]],
+    [localization.memorySharesValue, true, '180px', vAppsTableItemKeys[4]],
+    [localization.managedBy, true, '180px', vAppsTableItemKeys[5]],
+  ]
+}
+
+export const columnKeys = (
+  localization: UI_I_Localization
+): UI_I_ColumnKey[] => {
+  return getColumnKeys(getItems(localization))
+}
+
+export const headItems = (localization: UI_I_Localization): UI_I_HeadItem[] => {
+  return getHeadItems(getItems(localization))
+}
+
+export const bodyItems = (data: any[]): UI_I_BodyItem[][] => {
+  const bodyItems: UI_I_BodyItem[][] = []
+  data.forEach((vapp, key) => {
+    const nameData: any = {
+      iconClassName: E_StatusEnum.vmtemplate_Normal,
+      name: vapp.name,
+      // @ts-ignore TODO id надо для перехода, пока что так оставить чтобы нигде не ломалось потом поправить для всех
+      id: vapp.id,
+      nav: 'v',
+      type: 'vmtemplate',
+      isLink: true,
+    }
+    bodyItems.push([
+      {
+        key: 'icon',
+        text: vapp[vAppsTableItemKeys[0]],
+        data: nameData,
+        id: key,
+      },
+      { key: 'col2', text: vapp[vAppsTableItemKeys[1]], id: key },
+      { key: 'col3', text: vapp[vAppsTableItemKeys[2]], id: key },
+      { key: 'col4', text: vapp[vAppsTableItemKeys[3]], id: key },
+      { key: 'col5', text: vapp[vAppsTableItemKeys[4]], id: key },
+      { key: 'col6', text: vapp[vAppsTableItemKeys[5]], id: key },
+    ])
+  })
+  return bodyItems
+}

package/components/common/wizards/vm/migrate/select/computeResource/tableView/models/types.ts

@@ -0,0 +1,60 @@
+export type T_HostTableTuple = [
+  'name',
+  'state',
+  'cluster',
+  'fault_domain',
+  'consumed_cpu',
+  'consumed_mem',
+  'ha_state',
+  'uptime',
+  'cert_valid_to',
+  'mem_size',
+  'cpus',
+  'nics',
+  'version',
+  'alarm_action'
+]
+
+export type T_ClusterTableTuple = [
+  'name',
+  'available_cpu',
+  'available_memory',
+  'available_storage',
+  'drs',
+  'ha',
+  'total_cpu',
+  'total_memory',
+  'total_storage',
+  'vms',
+  'hosts',
+  'cpus',
+  'datastores',
+  'vsan',
+  'vc',
+  'evc_cpu_mode',
+  'evc_graphics_mode'
+]
+
+export type T_VAppsTableTuple = [
+  'name',
+  'cpu_shares',
+  'cpu_shares_val',
+  'memory_shares',
+  'memory_shares_val',
+  'managed_by'
+]
+
+export type T_ResourcePoolTableTuple = [
+  'name',
+  'cpu_reservation',
+  'cpu_limit',
+  'cpu_allocation_type',
+  'cpu_shares',
+  'cpu_shares_val',
+  'memory_reservation',
+  'memory_limit',
+  'memory_allocation_type',
+  'memory_shares',
+  'memory_shares_val',
+  'vc'
+]

package/package.json

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