bfg-common 1.6.95 → 1.6.97

package/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/config/clusterTable.ts

@@ -0,0 +1,340 @@
+import type {
+  UI_I_DataTableBody,
+  UI_I_DataTableOptions,
+  UI_I_DataTableHeader,
+} from '~/node_modules/bfg-uikit/components/ui/dataTable/models/interfaces'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_ClusterTableItem } from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/lib/models/interfaces'
+// import {
+//   UI_E_DeviceStatus,
+//   UI_E_DeviceStatusChipColor,
+//   UI_E_DeviceStatusIcon,
+// } from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/models/enums'
+
+// // Маппинг для статусов
+// const STATUS_MAPPING = {
+//   [UI_E_DeviceStatus.Unknown]: {
+//     icon: UI_E_DeviceStatusIcon.HelpIcon,
+//     chipColor: UI_E_DeviceStatusChipColor.Primary,
+//   },
+//   [UI_E_DeviceStatus.Supported]: {
+//     icon: UI_E_DeviceStatusIcon.StatusCheck,
+//     chipColor: UI_E_DeviceStatusChipColor.Green,
+//   },
+//   [UI_E_DeviceStatus.NotSupported]: {
+//     icon: UI_E_DeviceStatusIcon.Close,
+//     chipColor: UI_E_DeviceStatusChipColor.Red,
+//   },
+// }
+
+export const getHeaderDataFunc = (
+  localization: UI_I_Localization
+): UI_I_DataTableHeader[] => [
+  {
+    col: 'col0',
+    colName: 'name',
+    text: localization.common.name,
+    isSortable: true,
+    sort: 'asc',
+    width: '180px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col1',
+    colName: 'available_cpu',
+    text: localization.common.availableCpu,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col2',
+    colName: 'available_memory',
+    text: localization.common.availableMemory,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col3',
+    colName: 'available_storage',
+    text: localization.common.availableStorage,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col4',
+    colName: 'drs',
+    text: localization.common.vSphere_DRS,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col5',
+    colName: 'ha',
+    text: localization.common.vSphere_HA,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col6',
+    colName: 'total_cpu',
+    text: localization.common.totalCpu,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col7',
+    colName: 'total_memory',
+    text: localization.common.totalMemory,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col8',
+    colName: 'total_storage',
+    text: localization.common.totalStorage,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col9',
+    colName: 'vms',
+    text: localization.common.vms,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col10',
+    colName: 'hosts',
+    text: localization.common.hosts,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col11',
+    colName: 'cpus',
+    text: localization.common.cpus,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col12',
+    colName: 'datastores',
+    text: localization.common.datastores,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col13',
+    colName: 'vsan',
+    text: localization.common.vSAN,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col14',
+    colName: 'vc',
+    text: localization.common.vc,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col15',
+    colName: 'evc_cpu_mode',
+    text: localization.common.evcCpuMode,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+  {
+    col: 'col16',
+    colName: 'evc_graphics_mode',
+    text: localization.common.evcGraphicsMode,
+    isSortable: true,
+    sort: 'asc',
+    width: '96px',
+    show: true,
+    filter: false,
+  },
+]
+export const options: UI_I_DataTableOptions = {
+  perPageOptions: [{ text: '10', value: 100, default: true }],
+  isSelectable: true,
+  selectType: 'radio',
+  showPagination: false,
+  showPageInfo: false,
+  isSortable: true,
+  server: true,
+  isResizable: true,
+  showSelectedRows: false,
+  showColumnManager: true,
+  inModal: true,
+  inBlock: false,
+  // isFocusable: false,
+  // showPaginationOnTop: false,
+  // showSearch: false,
+  // withActions: false,
+  // showExport: false,
+  // withCollapse: false,
+}
+
+export const getBodyDataFunc = (
+  bodyData: UI_I_ClusterTableItem[],
+  _localization: UI_I_Localization
+): UI_I_DataTableBody[] => {
+  const { $binary }: any = useNuxtApp()
+
+  return bodyData.map((cluster, index: number) => {
+    //   const statusKey = host.state
+    //   ? UI_E_DeviceStatus.Unknown
+    //   : UI_E_DeviceStatus.Supported
+    // const statusData = {
+    //   ...STATUS_MAPPING[statusKey],
+    //   testId: `${host.name}-${index}-status`,
+    // }
+
+    return {
+      row: index,
+      collapse: false,
+      isHiddenCollapse: false,
+      collapseToggle: false,
+
+      data: [
+        {
+          key: 'icon',
+          col: 'col0',
+          text: cluster.name,
+          data: {
+            iconClassName: 'vsphere-icon-cluster',
+          },
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+
+        {
+          col: 'col1',
+          text: $binary.roundHz(cluster.available_cpu),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col2',
+          text: $binary.round(cluster.available_memory),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col3',
+          text: $binary.round(cluster.available_storage),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col4',
+          text: cluster.drs,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col5',
+          text: cluster.ha,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col6',
+          text: $binary.roundHz(cluster.total_cpu),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col7',
+          text: $binary.round(cluster.total_memory),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col8',
+          text: $binary.round(cluster.total_storage),
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col9',
+          text: cluster.vms,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col10',
+          text: cluster.hosts,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col11',
+          text: cluster.cpus,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col12',
+          text: cluster.datastores,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col13',
+          text: cluster.vsan,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col14',
+          text: cluster.vc,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col15',
+          text: cluster.evc_cpu_mode,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+        {
+          col: 'col16',
+          text: cluster.evc_graphics_mode,
+          testId: `migrate-cluster-table-item-${index}`,
+        },
+      ],
+    }
+  })
+}

package/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/config/hostTable.ts

@@ -9,6 +9,7 @@ import {
   UI_E_DeviceStatus,
   UI_E_DeviceStatusChipColor,
   UI_E_DeviceStatusIcon,
+  UI_E_HostAlarmStatus,
 } from '~/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/models/enums'
 import {
   hostIconByState,
@@ -31,6 +32,18 @@ const STATUS_MAPPING = {
   },
 }
 
+// Маппинг для статусов
+const HOST_ALARMS_MAPPING = {
+  [UI_E_HostAlarmStatus.Yes]: {
+    icon: UI_E_DeviceStatusIcon.StatusCheck,
+    chipColor: UI_E_DeviceStatusChipColor.Green,
+  },
+  [UI_E_HostAlarmStatus.No]: {
+    icon: UI_E_DeviceStatusIcon.Close,
+    chipColor: UI_E_DeviceStatusChipColor.Red,
+  },
+}
+
 export const getHeaderDataFunc = (
   localization: UI_I_Localization
 ): UI_I_DataTableHeader[] => [
@@ -50,7 +63,7 @@ export const getHeaderDataFunc = (
     text: localization.inventorySummary.state,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '144px',
     show: true,
     filter: false,
   },
@@ -60,7 +73,7 @@ export const getHeaderDataFunc = (
     text: localization.common.cluster,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '120px',
     show: true,
     filter: false,
   },
@@ -70,7 +83,7 @@ export const getHeaderDataFunc = (
     text: localization.common.faultDomain,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '120px',
     show: true,
     filter: false,
   },
@@ -80,7 +93,7 @@ export const getHeaderDataFunc = (
     text: `${localization.common.consumedCpu} %`,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '230px',
     show: true,
     filter: false,
   },
@@ -90,7 +103,7 @@ export const getHeaderDataFunc = (
     text: `${localization.common.consumedMemory} %`,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '230px',
     show: true,
     filter: false,
   },
@@ -110,7 +123,7 @@ export const getHeaderDataFunc = (
     text: localization.inventorySummary.uptime,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '270px',
     show: true,
     filter: false,
   },
@@ -120,7 +133,7 @@ export const getHeaderDataFunc = (
     text: localization.common.certificateValidTo,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '160px',
     show: true,
     filter: false,
   },
@@ -130,7 +143,7 @@ export const getHeaderDataFunc = (
     text: `${localization.common.memorySize} (${localization.common.mb})`,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '160px',
     show: true,
     filter: false,
   },
@@ -160,7 +173,7 @@ export const getHeaderDataFunc = (
     text: localization.common.version,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '270px',
     show: true,
     filter: false,
   },
@@ -170,7 +183,7 @@ export const getHeaderDataFunc = (
     text: localization.common.alarmActions,
     isSortable: true,
     sort: 'asc',
-    width: '96px',
+    width: '120px',
     show: true,
     filter: false,
   },
@@ -211,6 +224,21 @@ export const getBodyDataFunc = (
       testId: `${host.name}-${index}-status`,
     }
 
+    const alarmsStatusKey = host.alarm_action
+      ? UI_E_HostAlarmStatus.Yes
+      : UI_E_HostAlarmStatus.No
+    const alarmActionData = {
+      ...HOST_ALARMS_MAPPING[alarmsStatusKey],
+      testId: `${host.name}-${index}-alarms-status`,
+    }
+
+    const isLangEn = useLocalStorage('lang') === 'en_US'
+    const alarmActionValue = isLangEn
+      ? host.alarm_action
+        ? 'True'
+        : 'False'
+      : localization.common[alarmsStatusKey]
+
     return {
       row: index,
       collapse: false,
@@ -222,7 +250,9 @@ export const getBodyDataFunc = (
           key: 'icon',
           col: 'col0',
           text: host.name,
-          data: `vsphere-icon-${hostIconByState[host.state]}`,
+          data: {
+            iconClassName: `vsphere-icon-${hostIconByState[host.state]}`,
+          },
           testId: `migrate-host-table-item-${index}`,
         },
 
@@ -269,7 +299,7 @@ export const getBodyDataFunc = (
         },
         {
           col: 'col8',
-          text: host.cert_valid_to,
+          text: host.cert_valid_to || '--',
           testId: `migrate-host-table-item-${index}`,
         },
 
@@ -298,8 +328,8 @@ export const getBodyDataFunc = (
         {
           key: 'status',
           col: 'col13',
-          text: host.alarm_action,
-          data: statusData,
+          text: alarmActionValue,
+          data: alarmActionData,
           testId: `migrate-host-table-item-${index}`,
         },
       ],

package/components/common/wizards/vm/migrate/steps/computeResource/tableView/new/lib/models/enums.ts

@@ -3,6 +3,10 @@ export enum UI_E_DeviceStatus {
   Supported = 'supported',
   NotSupported = 'not-supported',
 }
+export enum UI_E_HostAlarmStatus {
+  Yes = 'yes',
+  No = 'no',
+}
 
 export enum UI_E_DeviceStatusChipColor {
   Green = 'green',

package/components/common/wizards/vm/migrate/steps/priority/New.vue

@@ -38,7 +38,7 @@ const props = defineProps<{
 .migration-strategy {
   container-type: inline-size;
   margin-top: 16px;
-
+  padding-bottom: 16px;
   &__radio {
     &-container {
       display: grid;
@@ -62,7 +62,7 @@ const props = defineProps<{
       transition: box-shadow 0.1s ease-in-out;
     }
 
-    &:not(:checked) {
+    &:not(:checked, :disabled) {
       & ~ .radio-label:hover {
         //border-color: var(--select-border);
         box-shadow: inset 0 0 0 1px var(--select-border);
@@ -76,6 +76,11 @@ const props = defineProps<{
         box-shadow: inset 0 0 0 1.5px var(--radio-btn-active-label-border-color);
       }
     }
+    &:disabled {
+      & ~ .radio-label .migration-strategy__radio-description {
+        color: var(--checkbox-radio-label-color-disabled);
+      }
+    }
   }
 }
 

package/components/common/wizards/vm/migrate/steps/selectStorage/New.vue

@@ -27,13 +27,14 @@
       :is-hide-select-disk-format="props.isHideSelectDiskFormat"
     >
       <template v-if="isShowSelectedPerDisks" #buttonConfirm>
-        <button
-          class="btn btn-sm btn-primary"
-          data-id="apply-selected-per-disks-button"
+        <ui-button
+          test-id="apply-selected-per-disks-button"
+          type="primary"
+          size="sm"
           @click="onApplyChanges"
         >
           {{ localization.common.confirm }}
-        </button>
+        </ui-button>
       </template>
     </common-wizards-vm-migrate-steps-select-storage-configure-batch>
 
@@ -47,9 +48,8 @@
     />
 
     <common-wizards-common-compatibility
-      :loading="!model.storage"
-      :text="localization.common.compatibilityChecksSucceeded"
-      status="success"
+      :status="compatibilityText[0]"
+      :text="compatibilityText[1]"
     />
   </div>
 </template>
@@ -62,6 +62,7 @@ import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/model
 import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
 import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/steps/selectStorage/configure/disk/table/lib/models/interfaces'
 import type { UI_I_MigrateFormLocal } from '~/components/common/wizards/vm/migrate/lib/models/interfaces'
+import type { UI_T_CompatibilityStatus } from '~/components/common/wizards/common/compatibility/lib/models/types'
 
 const model = defineModel<UI_I_MigrateFormLocal>({ required: true })
 const selectedPerDiskKeys = defineModel<number[]>('selectedDiskKeys', {
@@ -111,6 +112,19 @@ const onChangePerDiskStorage = (
 const onApplyChanges = (): void => {
   emits('confirm-changes')
 }
+
+const compatibilityText = computed<[UI_T_CompatibilityStatus, string]>(() => {
+  let res: [UI_T_CompatibilityStatus, string] = [
+    'none',
+    localization.value.common.noComputeResourceSelected,
+  ]
+
+  if (model.value.storage) {
+    res = ['success', localization.value.common.compatibilityChecksSucceeded]
+  }
+
+  return res
+})
 </script>
 
 <style lang="scss" scoped>
@@ -118,5 +132,6 @@ const onApplyChanges = (): void => {
 .select-storage {
   @include flex($dir: column);
   margin-top: 16px;
+  padding-bottom: 16px;
 }
 </style>

package/components/common/wizards/vm/migrate/steps/selectStorage/configure/batch/New.vue

@@ -61,7 +61,9 @@ const selectOptionsLocal = computed<UI_I_Dropdown[]>(() =>
     grid-template-columns: 240px 1fr;
     align-items: center;
     column-gap: 16px;
+    border-bottom: 1px solid var(--horizontal-line);
     margin-top: 16px;
+    padding-bottom: 16px;
     & > span {
       font-family: 'Inter', sans-serif;
       color: var(--title-form-first-color);
@@ -69,5 +71,9 @@ const selectOptionsLocal = computed<UI_I_Dropdown[]>(() =>
       font-size: 13px;
     }
   }
+  &__button {
+    display: flex;
+    justify-content: flex-end;
+  }
 }
 </style>

package/components/common/wizards/vm/migrate/steps/selectStorage/configure/batch/table/new/New.vue

@@ -86,6 +86,7 @@ const texts = computed<UI_I_TableTexts>(() => ({
 
 const skeletonData = ref<UI_I_DataTableSkeleton>({
   columnsCount: 4,
+  withoutPagination: true,
   headColumns: [],
   bodyColumns: [],
 })
@@ -118,9 +119,11 @@ watch(
 const onSorting = (value: string): void => {
   emits('sort', value)
 }
+
+/* TODO: если передать в emit selectedStorageKeyLocal.value, то не работает */
 const onSelectRow = (value: UI_I_DataTableBody[]): void => {
   selectedStorageKeyLocal.value = value?.[0].row as number
-  emits('select-storage', selectedStorageKeyLocal.value)
+  emits('select-storage', value?.[0].row as number)
 }
 </script>