bfg-common 1.5.90 → 1.5.91

package/components/atoms/table/info/Info.vue

@@ -1,6 +1,6 @@
 <template>
-<!--  TODO refactoring-->
-  <table class="table table-vertical">
+  <!--  TODO refactoring-->
+  <table :data-id="props.testId" class="table table-vertical">
     <tbody>
       <tr v-for="item in list" :key="item.id">
         <th
@@ -22,9 +22,15 @@
 <script lang="ts" setup>
 import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/lib/models/interfaces'
 
-const props = defineProps<{
-  items: UI_I_TableInfoItem[]
-}>()
+const props = withDefaults(
+  defineProps<{
+    items: UI_I_TableInfoItem[]
+    testId?: string
+  }>(),
+  {
+    testId: '',
+  }
+)
 
 const list = computed<UI_I_TableInfoItem[]>(() => {
   return props.items.map((item) => {

package/components/common/vm/actions/common/customizeHardware/CustomizeHardwareNew.vue

@@ -5,7 +5,7 @@
       test-id="vm-wizard-tabs"
       :tabs="navItemsLocal"
       type="underline"
-      class="navigation px-4"
+      class="navigation mx-8"
     />
     <ui-alert
       v-show="props.errors.length"

package/components/common/vm/actions/common/customizeHardware/virtualHardware/VirtualHardwareNew.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="virtual-hardware">
-    <div class="action-wrap p-4">
+    <div class="action-wrap py-3 px-8">
       <span class="device-count">{{ deviceCountText }}</span>
 
       <div class="add-device-dropdown-wrap">
@@ -31,7 +31,7 @@
       </div>
     </div>
 
-    <div class="overflow-auto px-4">
+    <div class="overflow-auto px-8">
       <div class="stack-view">
         <common-vm-actions-common-customize-hardware-virtual-hardware-cpu
           :max-cpus="props.maxCpus"

package/components/common/vm/actions/common/customizeHardware/virtualHardware/cdDvdDrive/CdDvdDriveNew.vue

@@ -17,10 +17,29 @@
       </div>
     </template>
     <template #stackBlockContent>
-      <div class="cd-dvd-drive-content flex-align-center">
+      <div :class="['cd-dvd-drive-content flex-align-center', props.type]">
         <template v-if="props.type === 'removed'">
-          <span>{{ localization.common.deviceWillRemoved }}</span>
-          <div class="flex-align-center" @click.stop>
+          <ui-tooltip
+            id="device-will-removed-text"
+            test-id="device-will-removed-text"
+            size="md"
+            position="bottom"
+            position-by-tooltip="center"
+            :margin-between-trigger="8"
+            class="text-ellipsis"
+          >
+            <template #target>
+              <span
+                id="device-will-removed-text"
+                class="device-will-removed-text text-ellipsis"
+                >{{ localization.common.deviceWillRemoved }}</span
+              >
+            </template>
+            <template #content>
+              {{ localization.common.deviceWillRemoved }}
+            </template>
+          </ui-tooltip>
+          <div class="flex-align-center checkbox-wrap" @click.stop>
             <ui-checkbox
               :id="`cd-dvd-delete-files-from-datastore-${props.index}`"
               v-model="deleteFilesFromDatastore"
@@ -150,6 +169,20 @@ const onChangeCdDvdDrive = (data: string): void => {
 <style lang="scss" scoped>
 .cd-dvd-drive-content {
   gap: 8px;
+  &.removed {
+    gap: 0;
+  }
+
+  .device-will-removed-text {
+    font-size: 13px;
+    color: #9da6ad;
+  }
+  .checkbox-wrap {
+    padding: 0 12px;
+    margin: 0 12px;
+    border-right: 1px solid #e9ebeda3;
+    border-left: 1px solid #e9ebeda3;
+  }
 }
 
 :deep(.cd-dvd-drive-select .ui-main-select-toggle) {

package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/CpuNew.vue

@@ -26,6 +26,7 @@
             :error-text="props.vcpusLocalAndApiErrorsTexts"
             test-id="vm-wizard-cpu-combobox"
             size="sm"
+            width="auto"
             @click.stop
           />
 
@@ -170,7 +171,7 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 
 :deep(.ui-main-select-toggle) {

package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/maxCpu/MaxCpuNew.vue

@@ -13,6 +13,7 @@
           :error-text="props.errorText"
           test-id="max-cpu-combobox"
           size="sm"
+          width="auto"
           @click.stop
         />
       </div>

package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/shares/SharesNew.vue

@@ -21,6 +21,7 @@
           :error-text="props.sharesErrorsTexts"
           test-id="vm-wizard-shares-field"
           size="sm"
+          width="auto"
           @click.stop
         />
       </div>

package/components/common/vm/actions/common/customizeHardware/virtualHardware/cpu/tooltip/TooltipNew.vue

@@ -5,16 +5,18 @@
       height="20"
       name="info"
       data-id="show-cpu-help-icon"
+      :class="['cpu-help-icon', { active: isShowCpuHelp }]"
       @click.stop="isShowCpuHelp = !isShowCpuHelp"
     />
     <Teleport to="body">
       <ui-dropdown
         :show="isShowCpuHelp"
         elem-id="cpu-help-icon"
-        test-id=""
+        test-id="cpu-help"
         :items="[]"
-        width="auto"
-        show-from-left
+        width="480px"
+        max-height="unset"
+        left
         @hide="isShowCpuHelp = false"
       >
         <template #content>
@@ -74,6 +76,16 @@ const isShowCpuHelp = ref<boolean>(false)
 </script>
 
 <style lang="scss" scoped>
+.cpu-help-icon {
+  color: #9da6ad;
+
+  &:hover {
+    color: #4d5d69;
+  }
+  &.active {
+    color: #008fd6;
+  }
+}
 .cpu-help-content {
   padding: 16px;
 

package/components/common/vm/actions/common/customizeHardware/virtualHardware/limit/LimitNew.vue

@@ -13,6 +13,7 @@
           :test-id="`vm-wizard-${props.componentType}-limit`"
           :error-text="props.limitErrorsTexts"
           size="sm"
+          width="auto"
           @click.stop
           @change="onSelectLimit"
         />

package/components/common/vm/actions/common/customizeHardware/virtualHardware/memory/MemoryNew.vue

@@ -24,6 +24,7 @@
           :error-text="props.errorText"
           test-id="vm-wizard-memory-field"
           size="sm"
+          width="auto"
           @change="emits('select-memory', $event)"
           @click.stop
         />
@@ -134,7 +135,7 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 
 .memory-content {

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/NewHardDiskNew.vue

@@ -23,11 +23,30 @@
       </div>
     </template>
     <template #stackBlockContent>
-      <!--      <div class="flex-align-center flex-space-between mr-1">-->
-      <div class="new-hard-disk-content flex-align-center">
+      <div :class="['new-hard-disk-content flex-align-center', props.type]">
         <template v-if="props.type === 'removed'">
-          <span>{{ localization.common.deviceWillRemoved }}</span>
-          <div class="flex-align-center" @click.stop>
+          <ui-tooltip
+            id="device-will-removed-text"
+            test-id="device-will-removed-text"
+            size="md"
+            position="bottom"
+            position-by-tooltip="center"
+            :margin-between-trigger="8"
+            class="text-ellipsis"
+          >
+            <template #target>
+              <span
+                id="device-will-removed-text"
+                class="device-will-removed-text text-ellipsis"
+                >{{ localization.common.deviceWillRemoved }}</span
+              >
+            </template>
+            <template #content>
+              {{ localization.common.deviceWillRemoved }}
+            </template>
+          </ui-tooltip>
+
+          <div class="flex-align-center checkbox-wrap" @click.stop>
             <ui-checkbox
               v-model="deleteFilesFromDatastore"
               :test-id="`hard-disk-delete-files-from-datastore-${props.index}`"
@@ -206,11 +225,25 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 
 .new-hard-disk-content {
   gap: 8px;
+  &.removed {
+    gap: 0;
+  }
+
+  .device-will-removed-text {
+    font-size: 13px;
+    color: #9da6ad;
+  }
+  .checkbox-wrap {
+    padding: 0 12px;
+    margin: 0 12px;
+    border-right: 1px solid #e9ebeda3;
+    border-left: 1px solid #e9ebeda3;
+  }
 }
 
 :deep(.ui-main-select-toggle) {

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newHardDisk/limitIops/LimitIopsNew.vue

@@ -26,6 +26,7 @@
             :disabled="props.disabled"
             class="limit-iops"
             size="sm"
+            width="auto"
             @click.stop
           />
         </div>

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newNetwork/NewNetworkNew.vue

@@ -113,7 +113,7 @@ const onChangeLocation = (data: UI_T_SelectedValue): void => {
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 
 :deep(.network-select .ui-main-select-toggle) {

package/components/common/vm/actions/common/customizeHardware/virtualHardware/reservation/ReservationNew.vue

@@ -14,6 +14,7 @@
           :error-text="props.errorDescription"
           class="reservation-combobox"
           size="sm"
+          width="auto"
           @click.stop
           @change="onSelectReservation"
         />

package/components/common/vm/actions/common/customizeHardware/virtualHardware/videoCard/VideoCardNew.vue

@@ -89,7 +89,7 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 
 :deep(.video-card-select .ui-main-select-toggle) {

package/components/common/vm/actions/common/customizeHardware/vmoptions/remoteConsoleOptions/New.vue

@@ -135,6 +135,6 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 <style scoped lang="scss">
 .title {
-  margin-right: 10px;
+  margin-right: 8px;
 }
 </style>

package/components/common/wizards/datastore/add/steps/readyComplete/ReadyCompleteNew.vue

@@ -1,54 +1,6 @@
 <template>
   <div class="ready-complete">
-    <common-details-list :items="properties" class="ready-complete__list list">
-      <template #default="{ item }">
-        <common-details-item
-          :has-children="true"
-          open-by-default
-          :test-id="item.testId"
-        >
-          <template #stackBlockKey>
-            <span class="list__labels">
-              {{ item.label }}
-            </span>
-          </template>
-
-          <template #stackChildren>
-            <template
-              v-for="(item2, key2) in item.items"
-              :key="`${item2}_${key2}`"
-            >
-              <common-details-item
-                :has-children="false"
-                :test-id="item2.testId"
-                class="list__default-style"
-              >
-                <template #stackBlockKey>
-                  <div>
-                    {{ item2.label }}
-                  </div>
-                </template>
-                <template #stackBlockContent>
-                  <div v-if="item2.data">
-                    <div
-                      v-for="item3 in item2.data"
-                      :key="item3"
-                      class="flex-align-center"
-                    >
-                      <div class="vsphere-icon-host"></div>
-                      <span>{{ item3 }}</span>
-                    </div>
-                  </div>
-                  <span v-else>
-                    {{ item2.value }}
-                  </span>
-                </template>
-              </common-details-item>
-            </template>
-          </template>
-        </common-details-item>
-      </template>
-    </common-details-list>
+    {{ props.dataReadyView }}
   </div>
 </template>
 
@@ -61,32 +13,11 @@ const props = defineProps<{
 }>()
 
 const localization = computed<UI_I_Localization>(() => useLocal())
-
 const properties = computed<UI_I_DetailsItem[]>(() => props.dataReadyView)
+console.log(localization, properties)
 </script>
 
 <style lang="scss" scoped>
-@import '~/assets/scss/common/mixins.scss';
 .ready-complete {
-  &__list {
-    @include flex($dir: column);
-    padding: 12px 0;
-    row-gap: 15px;
-  }
-}
-.list {
-  &__labels {
-    @include text($fs: 13px, $fw: 700);
-  }
-  :deep(.list__default-style) {
-    .stack-block {
-      &__label {
-        align-items: flex-start;
-      }
-      &-content {
-        white-space: pre-line;
-      }
-    }
-  }
 }
 </style>

package/components/common/wizards/datastore/add/steps/readyComplete/ReadyCompleteOld.vue

@@ -1,15 +1,92 @@
 <template>
   <div class="ready-complete">
-    {{ props.dataReadyView }}
+    <common-details-list :items="properties" class="ready-complete__list list">
+      <template #default="{ item }">
+        <common-details-item
+          :has-children="true"
+          open-by-default
+          :test-id="item.testId"
+        >
+          <template #stackBlockKey>
+            <span class="list__labels">
+              {{ item.label }}
+            </span>
+          </template>
+
+          <template #stackChildren>
+            <template
+              v-for="(item2, key2) in item.items"
+              :key="`${item2}_${key2}`"
+            >
+              <common-details-item
+                :has-children="false"
+                :test-id="item2.testId"
+                class="list__default-style"
+              >
+                <template #stackBlockKey>
+                  <div>
+                    {{ item2.label }}
+                  </div>
+                </template>
+                <template #stackBlockContent>
+                  <div v-if="item2.data">
+                    <div
+                      v-for="item3 in item2.data"
+                      :key="item3"
+                      class="flex-align-center"
+                    >
+                      <div class="vsphere-icon-host"></div>
+                      <span>{{ item3 }}</span>
+                    </div>
+                  </div>
+                  <span v-else>
+                    {{ item2.value }}
+                  </span>
+                </template>
+              </common-details-item>
+            </template>
+          </template>
+        </common-details-item>
+      </template>
+    </common-details-list>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { UI_I_DetailsItem } from '~/components/common/details/lib/models/interfaces'
+import { UI_I_Localization } from '~/lib/models/interfaces'
 
 const props = defineProps<{
   dataReadyView: UI_I_DetailsItem[]
 }>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const properties = computed<UI_I_DetailsItem[]>(() => props.dataReadyView)
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+@import 'assets/scss/common/mixins.scss';
+.ready-complete {
+  &__list {
+    @include flex($dir: column);
+    padding: 12px 0;
+    row-gap: 15px;
+  }
+}
+.list {
+  &__labels {
+    @include text($fs: 13px, $fw: 700);
+  }
+  :deep(.list__default-style) {
+    .stack-block {
+      &__label {
+        align-items: flex-start;
+      }
+      &-content {
+        white-space: pre-line;
+      }
+    }
+  }
+}
+</style>

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

@@ -14,26 +14,26 @@
     >
       <template #modalBody="{ selectedStep }">
         <common-pages-scheduled-tasks-modals-common-new-task-form
-          v-if="selectedStep.id === 0"
+          v-if="selectedStep.id === dynamicSteps.schedulingOptions"
           v-model="modelSchedulerTask"
           :target="selectedVirtualMachine"
         />
 
         <common-wizards-vm-migrate-select-type
-          v-if="selectedStep.id === 1"
+          v-if="selectedStep.id === dynamicSteps.selectMigrationType"
           v-model="form.migrate_type"
           :project="props.project"
         />
 
         <common-wizards-vm-migrate-select-target-server
-          v-if="selectedStep.id === 2"
+          v-if="selectedStep.id === dynamicSteps.selectTargetVCenterSer"
           v-model="form.target_server"
           v-model:connect-server="isConnectSourceServer"
           :wizard="wizard"
         />
 
         <common-wizards-vm-migrate-select-compute-resource
-          v-show="selectedStep.id === 3"
+          v-show="selectedStep.id === dynamicSteps.selectComputeResource"
           v-model="form"
           :alert-messages="alertMessages[3]"
           :get-compute-resource-data="props.getComputeResourceData"
@@ -43,7 +43,7 @@
         />
 
         <common-wizards-vm-migrate-select-storage
-          v-show="selectedStep.id === 4"
+          v-show="selectedStep.id === dynamicSteps.selectStorage"
           v-model="form"
           :alert-messages="alertMessages[4]"
           :get-datastore-table-func="props.getDatastoreTableFunc"
@@ -54,20 +54,20 @@
         />
 
         <common-wizards-vm-migrate-select-network
-          v-show="selectedStep.id === 5"
+          v-show="selectedStep.id === dynamicSteps.selectNetworks"
           v-model="form.network"
           :vm-info="props.vmInfo"
           :networks="props.networks"
         />
 
         <common-wizards-vm-migrate-select-priority
-          v-if="selectedStep.id === 6"
+          v-if="selectedStep.id === dynamicSteps.migrationStrategy"
           v-model="form.vMotion_priority"
           :vm-state="props.vmState"
         />
 
         <common-ready-to-complete
-          v-if="selectedStep.id === 7"
+          v-if="selectedStep.id === dynamicSteps.readyComplete"
           :data="dataReadyView"
         />
       </template>
@@ -82,6 +82,7 @@ import type {
 } from '~/components/atoms/wizard/lib/models/interfaces'
 import Wizard from '~/components/atoms/wizard/lib/utils/utils'
 import {
+  dynamicSteps,
   stepsFunc,
   stepsSchemeInitial,
 } from '~/components/common/wizards/vm/migrate/lib/config/steps'
@@ -193,7 +194,7 @@ const validationFunc = async (
 ): Promise<UI_I_ValidationReturn> => {
   let stepHasError = false
 
-  if (wizard.isValidateForStep(3, currentStep.id, nextStep.id)) {
+  if (wizard.isValidateForStep(dynamicSteps.selectComputeResource, currentStep.id, nextStep.id)) {
     const nameValidation = await validation.checkSelectedResourceSync(
       localization.value,
       form.value.resource,
@@ -206,7 +207,7 @@ const validationFunc = async (
     stepHasError = nameValidation.stepHasError
   }
 
-  if (wizard.isValidateForStep(4, currentStep.id, nextStep.id)) {
+  if (wizard.isValidateForStep(dynamicSteps.selectStorage, currentStep.id, nextStep.id)) {
     const nameValidation = await validation.checkSelectedDatastoreSync(
       localization.value,
       form.value.storage,

package/components/common/wizards/vm/migrate/lib/config/steps.ts

@@ -2,13 +2,23 @@ import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_WizardStep } from '~/components/atoms/wizard/lib/models/interfaces'
 import { UI_E_WIZARD_STATUS } from '~/components/atoms/wizard/lib/models/enums'
 
+export const dynamicSteps = {
+  schedulingOptions: 0,
+  selectMigrationType: 1,
+  selectTargetVCenterSer: 2,
+  selectComputeResource: 3,
+  selectStorage: 4,
+  selectNetworks: 5,
+  migrationStrategy: 6,
+  readyComplete: 7,
+}
 export const stepsFunc = (
   localization: UI_I_Localization,
   isScheduledTasks: boolean
 ): UI_I_WizardStep[] => {
-  const result: UI_I_WizardStep[] = [
+  return [
     {
-      id: 0,
+      id: dynamicSteps.schedulingOptions,
       stepName: '',
       title: localization.common.schedulingOptions,
       subTitle: '',
@@ -18,7 +28,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-scheduling-options',
     },
     {
-      id: 1,
+      id: dynamicSteps.selectMigrationType,
       title: localization.common.selectMigrationType,
       subTitle: localization.common.selectMigrationTypeDesc,
       status: UI_E_WIZARD_STATUS[!isScheduledTasks ? 'SELECTED' : 'INACTIVE'],
@@ -27,7 +37,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-type',
     },
     {
-      id: 2,
+      id: dynamicSteps.selectTargetVCenterSer,
       title: localization.common.selectTargetVCenterSer,
       subTitle: localization.common.selectComputeResourceDesc,
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -41,7 +51,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-target-server',
     },
     {
-      id: 3,
+      id: dynamicSteps.selectComputeResource,
       title: localization.common.selectComputeResource,
       subTitle: localization.common.selectComputeResourceDesc,
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -55,7 +65,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-compute-resource',
     },
     {
-      id: 4,
+      id: dynamicSteps.selectStorage,
       title: localization.common.selectStorage,
       subTitle: localization.common.selectStorageDesc,
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -69,7 +79,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-storage',
     },
     {
-      id: 5,
+      id: dynamicSteps.selectNetworks,
       title: localization.common.selectNetworks,
       subTitle: localization.common.selectNetworksDesc,
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -78,7 +88,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-networks',
     },
     {
-      id: 6,
+      id: dynamicSteps.migrationStrategy,
       title: localization.migrateVm.migrationStrategy,
       subTitle: localization.common.selectVMotionPriorityDesc,
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -87,7 +97,7 @@ export const stepsFunc = (
       testId: 'migrate-vm-select-vMotion-priority',
     },
     {
-      id: 7,
+      id: dynamicSteps.readyComplete,
       title: localization.common.readyComplete,
       subTitle: '',
       status: UI_E_WIZARD_STATUS.INACTIVE,
@@ -96,16 +106,52 @@ export const stepsFunc = (
       testId: 'migrate-vm-ready-complete',
     },
   ]
-  return result
 }
 
 export const stepsSchemeInitial: number[][] = [
-  [1, 4, 7], // Procurator and Sphere Scheme for "Change storage only" type
-  [0, 1, 4, 7], // Procurator and Sphere Scheme for "Change storage only" type (from Scheduled tasks)
+  [
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectStorage,
+    dynamicSteps.readyComplete,
+  ], // Procurator and Sphere Scheme for "Change storage only" type
+  [
+    dynamicSteps.schedulingOptions,
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectStorage,
+    dynamicSteps.readyComplete,
+  ], // Procurator and Sphere Scheme for "Change storage only" type (from Scheduled tasks)
 
-  [1, 3, 5, 6, 7], // Sphere Scheme for "Change compute resource only" type
-  [0, 1, 3, 5, 6, 7], // Sphere Scheme for "Change compute resource only" type (from Scheduled tasks)
+  [
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectComputeResource,
+    // dynamicSteps.selectNetworks, // пока что скрываем
+    dynamicSteps.migrationStrategy,
+    dynamicSteps.readyComplete,
+  ], // Sphere Scheme for "Change compute resource only" type
+  [
+    dynamicSteps.schedulingOptions,
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectComputeResource,
+    // dynamicSteps.selectNetworks, // пока что скрываем
+    dynamicSteps.migrationStrategy,
+    dynamicSteps.readyComplete,
+  ], // Sphere Scheme for "Change compute resource only" type (from Scheduled tasks)
 
-  [1, 3, 4, 5, 6, 7], // Sphere Scheme for "Change both compute resource and storage" type
-  [1, 2, 3, 4, 5, 6, 7], // Sphere Scheme for "Cross Sphere Zone export" type
+  [
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectComputeResource,
+    dynamicSteps.selectStorage,
+    // dynamicSteps.selectNetworks, // пока что скрываем
+    dynamicSteps.migrationStrategy,
+    dynamicSteps.readyComplete,
+  ], // Sphere Scheme for "Change both compute resource and storage" type
+  [
+    dynamicSteps.selectMigrationType,
+    dynamicSteps.selectTargetVCenterSer,
+    dynamicSteps.selectComputeResource,
+    dynamicSteps.selectStorage,
+    // dynamicSteps.selectNetworks, // пока что скрываем
+    dynamicSteps.migrationStrategy,
+    dynamicSteps.readyComplete,
+  ], // Sphere Scheme for "Cross Sphere Zone export" type
 ]

package/components/common/wizards/vm/migrate/lib/validations.ts

@@ -5,6 +5,7 @@ import type {
 } from '~/components/atoms/wizard/lib/models/interfaces'
 import type Wizard from '~/components/atoms/wizard/lib/utils/utils'
 import type { UI_I_ComputeResourceFormLocal } from '~/components/common/wizards/vm/migrate/select/computeResource/lib/models/interfaces'
+import { dynamicSteps } from '~/components/common/wizards/vm/migrate/lib/config/steps'
 
 export const checkSelectedDatastoreSync = (
   localization: UI_I_Localization,
@@ -15,12 +16,12 @@ export const checkSelectedDatastoreSync = (
   let stepHasError = false
 
   if (!name) {
-    stepHasError = wizard.setValidation(4, 'name', {
+    stepHasError = wizard.setValidation(dynamicSteps.selectStorage, 'name', {
       fieldMessage: '',
       alertMessage: localization.common.selectValidDestinationStorage,
     })
-  } else if (wizard.hasMessage(4, 'name')) {
-    value = wizard.removeValidation(4, 'name', value)
+  } else if (wizard.hasMessage(dynamicSteps.selectStorage, 'name')) {
+    value = wizard.removeValidation(dynamicSteps.selectStorage, 'name', value)
   }
 
   return {
@@ -42,12 +43,22 @@ export const checkSelectedResourceSync = (
   )
 
   if (!hasSelectedData) {
-    stepHasError = wizard.setValidation(3, 'resource', {
-      fieldMessage: '',
-      alertMessage: localization.common.selectValidDestinationComputeResource,
-    })
-  } else if (wizard.hasMessage(3, 'resource')) {
-    value = wizard.removeValidation(3, 'resource', value)
+    stepHasError = wizard.setValidation(
+      dynamicSteps.selectComputeResource,
+      'resource',
+      {
+        fieldMessage: '',
+        alertMessage: localization.common.selectValidDestinationComputeResource,
+      }
+    )
+  } else if (
+    wizard.hasMessage(dynamicSteps.selectComputeResource, 'resource')
+  ) {
+    value = wizard.removeValidation(
+      dynamicSteps.selectComputeResource,
+      'resource',
+      value
+    )
   }
 
   return {

package/package.json

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