bfg-common 1.4.785 → 1.4.787

package/assets/localization/local_ru.json

@@ -1202,7 +1202,7 @@
     "relatedObjects": "Связанные Объекты",
     "releaseDate": "Дата выпуска",
     "remoteConsole": "Удаленная консоль {0}",
-    "remoteConsoleDescription": "Используйте {trademark} Remote Console (VMRC) для подключения к клиентским устройствам и доступа к расширенным функциям клавиатуры.\nЕсли у вас уже установлена {trademark} Remote Console, она запустится автоматически, когда вы нажмете кнопку Launch Remote Console. Если нет, вы можете использовать ссылку ниже, чтобы загрузить его.",
+    "remoteConsoleDescription": "Используйте {trademark} Remote Console (VMRC) для подключения к клиентским устройствам и доступа к расширенным функциям клавиатуры.\nЕсли у Вас уже установлена {trademark} Remote Console, она запустится автоматически, когда Вы нажмете кнопку Launch Remote Console. Если нет, Вы можете использовать ссылку ниже, чтобы загрузить его.",
     "remoteConsoleOptions": "Параметры удаленной консоли",
     "remoteConsoleType": "Тип удаленной консоли",
     "remoteConsoleVmrc": "Удаленная консоль {trademark} (VMRC)",

package/components/atoms/autocomplete/Autocomplete.vue

@@ -17,16 +17,32 @@
           name="search"
         />
       </div>
-      <input
-        :id="`${props.testId}-search-input`"
-        v-model.trim="search"
-        :data-id="`${props.testId}-search-input`"
-        type="text"
-        class="search-input"
-        autocomplete="off"
-        :placeholder="props.placeholder"
-        @input="onSearch"
-      />
+
+      <div class="clr-error">
+        <div class="form-group__input">
+          <input
+            :id="`${props.testId}-search-input`"
+            v-model.trim="search"
+            :data-id="`${props.testId}-search-input`"
+            type="text"
+            class="search-input"
+            :class="fieldErrorText && 'clr-input'"
+            autocomplete="off"
+            :placeholder="props.placeholder"
+            @blur="onInitValidation"
+            @input="onSearch"
+          />
+          <div v-show="fieldErrorText" class="form-validate">
+            <atoms-the-icon class="is-error tooltip-trigger" name="info" />
+          </div>
+        </div>
+        <div
+          v-show="fieldErrorText"
+          class="form-group__input-error clr-subtext"
+        >
+          {{ fieldErrorText }}
+        </div>
+      </div>
     </div>
     <div
       v-show="isShow"
@@ -50,6 +66,8 @@
 </template>
 
 <script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
 const props = withDefaults(
   defineProps<{
     placeholder: string
@@ -57,23 +75,27 @@ const props = withDefaults(
     loading?: boolean
     testId?: string
     ms?: number
+    showValidation?: boolean
   }>(),
   {
     testId: 'ui-autocomplete',
     ms: 500,
     loading: false,
+    showValidation: false,
   }
 )
-
 const emits = defineEmits<{
   (event: 'search', value: string): void
   (event: 'select', value: string): void
 }>()
 
+const localization = computed<UI_I_Localization>(() => useLocal())
+
 const search = ref<string>('')
 
 let timer: NodeJS.Timeout
 const onSearch = (): void => {
+  onInitValidation()
   clearTimeout(timer)
   timer = setTimeout(
     (value) => {
@@ -83,7 +105,16 @@ const onSearch = (): void => {
     search.value
   )
 }
+const isInitFieldValidation = ref<boolean>(false)
+const onInitValidation = (): void => {
+  isInitFieldValidation.value = true
+}
+const fieldErrorText = computed<string>(() => {
+  if (!isInitFieldValidation.value) return ''
 
+  if (!search.value && props.showValidation)
+    return localization.value.common.fieldRequired
+})
 const items = computed<any[]>(() => {
   return [...props.items].map((text) => {
     const term = search.value.toLowerCase()
@@ -155,6 +186,13 @@ watch(isHide, (newValue) => {
     window.removeEventListener('keydown', onKeyDown, true)
   }
 })
+watch(
+  () => props.showValidation,
+  (newValue: boolean) => {
+    isInitFieldValidation.value = newValue
+  },
+  { immediate: true }
+)
 </script>
 
 <style scoped lang="scss">
@@ -239,5 +277,22 @@ watch(isHide, (newValue) => {
       }
     }
   }
+  .form-group {
+    &__input {
+      display: flex;
+      .form-validate {
+        svg {
+          width: 24px;
+          height: 24px;
+        }
+      }
+      input {
+        width: 100%;
+      }
+      &-error {
+        margin-top: 0;
+      }
+    }
+  }
 }
 </style>

package/components/common/pages/tasks/Tasks.vue

@@ -25,6 +25,7 @@ import type {
 } from '~/lib/models/table/interfaces'
 import type { UI_I_Task } from '~/lib/models/store/tasks/interfaces'
 import type { UI_T_Project } from '~/lib/models/types'
+import { useOnline } from '@vueuse/core'
 
 const localization = computed<UI_I_Localization>(() => useLocal())
 const { $store }: any = useNuxtApp()
@@ -74,6 +75,13 @@ const isLoading = computed<boolean>(() =>
   $store.getters['tasks/getLoading']('tasks')
 )
 
+const isOnline = useOnline()
+watch(isOnline, (newValue: boolean) => {
+  if (newValue) {
+    getTasks()
+  }
+})
+
 onUnmounted(() => {
   pauseGlobalRefresh()
 })

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

@@ -105,7 +105,7 @@
         v-model:limit-iops-type="limitIopsType"
         :index="props.index"
         :error-validation-fields="props.errorValidationFields"
-        :disabled="props.isRunning"
+        :disabled="props.isRunning && props.type !== 'new'"
         @valid="limitIopsInvalid = $event"
         @remove-error-by-title="emits('remove-error-by-title', $event)"
       />

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

@@ -137,7 +137,7 @@
           v-model:limit-iops-type="limitIopsType"
           :index="props.index"
           :error-validation-fields="props.errorValidationFields"
-          :disabled="props.isRunning"
+          :disabled="props.isRunning && props.type !== 'new'"
           @valid="limitIopsInvalid = $event"
           @remove-error-by-title="emits('remove-error-by-title', $event)"
         />

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

@@ -1,288 +1,288 @@
-<template>
-  <div class="migrate-vm">
-    <atoms-wizard
-      show
-      :wizard="wizard"
-      :selected-scheme="selectedScheme"
-      :title="title"
-      :localization="localization"
-      class="migrate-vm-wizard"
-      test-id="migrate-vm-wizard"
-      @change-steps="onChangeSteps"
-      @hide="onHideModal"
-      @submit="onFinish"
-    >
-      <template #modalBody="{ selectedStep }">
-        <common-pages-scheduled-tasks-modals-common-new-task-form
-          v-if="selectedStep.id === 0"
-          v-model="modelSchedulerTask"
-          :target="selectedVirtualMachine"
-        />
-
-        <common-wizards-vm-migrate-select-type
-          v-if="selectedStep.id === 1"
-          v-model="form.migrate_type"
-          :project="props.project"
-        />
-
-        <common-wizards-vm-migrate-select-target-server
-          v-if="selectedStep.id === 2"
-          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-model="form"
-          :alert-messages="alertMessages[3]"
-          :get-compute-resource-data="props.getComputeResourceData"
-          :compute-resource-data="props.computeResourceTableData"
-          :compute-resource-tree="props.computeResourceTree"
-          @hide-alert="onHideAlert"
-        />
-
-        <common-wizards-vm-migrate-select-storage
-          v-show="selectedStep.id === 4"
-          v-model="form"
-          :alert-messages="alertMessages[4]"
-          :get-datastore-table-func="props.getDatastoreTableFunc"
-          :datastore="props.datastore"
-          :connected-storage-id-default="connectedStorageIdOnVm"
-          :configure-per-disks="props.configurePerDisks"
-          @hide-alert="onHideAlert"
-        />
-
-        <common-wizards-vm-migrate-select-network
-          v-show="selectedStep.id === 5"
-          v-model="form.network"
-        />
-
-        <common-wizards-vm-migrate-select-priority
-          v-if="selectedStep.id === 6"
-          v-model="form.vMotion_priority"
-        />
-
-        <common-ready-to-complete
-          v-if="selectedStep.id === 7"
-          :data="dataReadyView"
-        />
-      </template>
-    </atoms-wizard>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type {
-  UI_I_WizardStep,
-  UI_I_ValidationReturn,
-} from '~/components/atoms/wizard/lib/models/interfaces'
-import Wizard from '~/components/atoms/wizard/lib/utils/utils'
-import {
-  stepsFunc,
-  stepsSchemeInitial,
-} from '~/components/common/wizards/vm/migrate/lib/config/steps'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_T_Project } from '~/lib/models/types'
-import type {
-  UI_I_MigrateFormLocal,
-  UI_I_ChangeStepsSchemes,
-} from '~/components/common/wizards/vm/migrate/lib/models/interfaces'
-import type { UI_T_VmMigrateType } from '~/components/common/wizards/vm/migrate/select/type/lib/models/types'
-import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
-import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
-import type { UI_I_VmSettings } from '~/lib/models/store/vm/interfaces'
-import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
-import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/select/storage/configure/disk/table/lib/models/interfaces'
-import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/lib/models/interfaces'
-import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
-import { constructDataReadyViewFunc } from '~/components/common/wizards/vm/migrate/lib/config/constructDataReady'
-import * as validation from '~/components/common/wizards/vm/migrate/lib/validations'
-
-const props = withDefaults(
-  defineProps<{
-    project: UI_T_Project
-    isScheduledTasks: boolean
-    isEditScheduledTasks: boolean
-    vmSettings: UI_I_VmSettings | null
-    vmName: string
-    getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
-    getComputeResourceData: (payload: UI_I_TablePayload) => Promise<void>
-    datastore: UI_I_DatastoreTableItem[]
-    configurePerDisks: UI_I_StorageConfigurePerDiskItem[]
-    computeResourceTableData?: any
-    computeResourceTree?: UI_I_TreeNode | null
-    selectedVirtualMachine?: string
-  }>(),
-  {
-    computeResourceTree: null,
-  }
-)
-const emits = defineEmits<{
-  (event: 'hide'): void
-  (event: 'finish', value: UI_I_MigrateFormLocal): void
-}>()
-const modelSchedulerTask = defineModel<UI_I_ScheduleNewTasksForm>(
-  'schedulerForm',
-  { required: true }
-)
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const wizard: Wizard = new Wizard(
-  stepsFunc(localization.value, props.isScheduledTasks),
-  stepsSchemeInitial
-)
-
-const selectedScheme = computed<number[]>(() => wizard.selectedScheme.value)
-const alertMessages = computed<string[][]>(() => wizard.alertMessages.value)
-
-const title = computed<string>(() => {
-  const { scheduleNewTasks, scheduleTaskEdit, migrate } =
-    localization.value.common
-  let result = migrate
-  if (props.isScheduledTasks) {
-    const schedulerMode = props.isEditScheduledTasks
-      ? scheduleTaskEdit
-      : scheduleNewTasks
-
-    result = `${schedulerMode} (${migrate})`
-  }
-
-  return result
-})
-
-const isConnectSourceServer = ref<boolean>(false)
-const form = ref<UI_I_MigrateFormLocal>({
-  migrate_type: props.project === 'procurator' ? 'storage' : 'resource',
-  disk_format: 0,
-  storage: null,
-  configure: {
-    type: 'batch-configure',
-    disks: [],
-  },
-  target_server: {
-    fqdn: '',
-    user: '',
-    password: '',
-  },
-  network: {
-    data: null,
-  },
-  resource: {
-    selectedNode: null,
-    host: null,
-    cluster: null,
-    resourcePool: null,
-    vApps: null,
-  },
-  vMotion_priority: 'high',
-})
-
-const validationFunc = async (
-  value: UI_I_WizardStep[],
-  currentStep: UI_I_WizardStep,
-  nextStep: UI_I_WizardStep
-): Promise<UI_I_ValidationReturn> => {
-  let stepHasError = false
-
-  // if (wizard.isValidateForStep(3, currentStep.id, nextStep.id)) {
-  //   const nameValidation = await validation.checkSelectedResourceSync(
-  //     localization.value,
-  //     form.value.resource,
-  //     wizard,
-  //     value
-  //   )
-  //
-  //   value = nameValidation.newValue
-  //
-  //   stepHasError = nameValidation.stepHasError
-  // }
-
-  if (wizard.isValidateForStep(4, currentStep.id, nextStep.id)) {
-    const nameValidation = await validation.checkSelectedDatastoreSync(
-      localization.value,
-      form.value.storage,
-      wizard,
-      value
-    )
-
-    value = nameValidation.newValue
-
-    stepHasError = nameValidation.stepHasError
-  }
-
-  return {
-    newValue: value,
-    stepHasError,
-  }
-}
-const onChangeSteps = async (value: UI_I_WizardStep[]): Promise<void> =>
-  wizard.changeSteps(value, validationFunc)
-
-// Choosing Scheme
-watch(
-  () => form.value.migrate_type,
-  (newValue: UI_T_VmMigrateType) => {
-    const schemes: UI_I_ChangeStepsSchemes = {
-      procurator: {
-        storage: props.isScheduledTasks ? 1 : 0,
-      },
-      sphere: {
-        storage: props.isScheduledTasks ? 1 : 0,
-        resource: props.isScheduledTasks ? 3 : 2,
-        'resource-storage': 2,
-        server: 3,
-      },
-    }
-
-    const projectSchemes = schemes[props.project]
-
-    if (projectSchemes && projectSchemes[newValue] !== undefined) {
-      wizard.changeScheme(projectSchemes[newValue] as number)
-    }
-  },
-  { deep: true, immediate: true }
-)
-
-watch(
-  modelSchedulerTask,
-  (newValue: UI_I_ScheduleNewTasksForm) => {
-    if (props.isScheduledTasks) wizard.setDisabledNextButton(newValue.isValid)
-  },
-  { immediate: true, deep: true }
-)
-
-const loading = ref<boolean>(false)
-
-const connectedStorageIdOnVm = computed<string>(
-  () => props.vmSettings?.storage.id || ''
-)
-
-const dataReadyView = computed<UI_I_TableInfoItem>(() =>
-  constructDataReadyViewFunc(props.vmName, form.value)
-)
-const onFinish = (): void => {
-  loading.value = true
-  emits('finish', form.value)
-  loading.value = false
-}
-
-const onHideModal = (): void => {
-  emits('hide')
-}
-
-const onHideAlert = (stepId: number): void => {
-  wizard.hideAlertMessagesByStepId(stepId)
-}
-</script>
-
-<style scoped lang="scss">
-@import 'assets/scss/common/mixins.scss';
-.migrate-vm {
-  :deep(.modal-body) {
-    height: inherit;
-    @include flex($dir: column);
-  }
-}
-</style>
+<template>
+  <div class="migrate-vm">
+    <atoms-wizard
+      show
+      :wizard="wizard"
+      :selected-scheme="selectedScheme"
+      :title="title"
+      :localization="localization"
+      class="migrate-vm-wizard"
+      test-id="migrate-vm-wizard"
+      @change-steps="onChangeSteps"
+      @hide="onHideModal"
+      @submit="onFinish"
+    >
+      <template #modalBody="{ selectedStep }">
+        <common-pages-scheduled-tasks-modals-common-new-task-form
+          v-if="selectedStep.id === 0"
+          v-model="modelSchedulerTask"
+          :target="selectedVirtualMachine"
+        />
+
+        <common-wizards-vm-migrate-select-type
+          v-if="selectedStep.id === 1"
+          v-model="form.migrate_type"
+          :project="props.project"
+        />
+
+        <common-wizards-vm-migrate-select-target-server
+          v-if="selectedStep.id === 2"
+          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-model="form"
+          :alert-messages="alertMessages[3]"
+          :get-compute-resource-data="props.getComputeResourceData"
+          :compute-resource-data="props.computeResourceTableData"
+          :compute-resource-tree="props.computeResourceTree"
+          @hide-alert="onHideAlert"
+        />
+
+        <common-wizards-vm-migrate-select-storage
+          v-show="selectedStep.id === 4"
+          v-model="form"
+          :alert-messages="alertMessages[4]"
+          :get-datastore-table-func="props.getDatastoreTableFunc"
+          :datastore="props.datastore"
+          :connected-storage-id-default="connectedStorageIdOnVm"
+          :configure-per-disks="props.configurePerDisks"
+          @hide-alert="onHideAlert"
+        />
+
+        <common-wizards-vm-migrate-select-network
+          v-show="selectedStep.id === 5"
+          v-model="form.network"
+        />
+
+        <common-wizards-vm-migrate-select-priority
+          v-if="selectedStep.id === 6"
+          v-model="form.vMotion_priority"
+        />
+
+        <common-ready-to-complete
+          v-if="selectedStep.id === 7"
+          :data="dataReadyView"
+        />
+      </template>
+    </atoms-wizard>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type {
+  UI_I_WizardStep,
+  UI_I_ValidationReturn,
+} from '~/components/atoms/wizard/lib/models/interfaces'
+import Wizard from '~/components/atoms/wizard/lib/utils/utils'
+import {
+  stepsFunc,
+  stepsSchemeInitial,
+} from '~/components/common/wizards/vm/migrate/lib/config/steps'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_T_Project } from '~/lib/models/types'
+import type {
+  UI_I_MigrateFormLocal,
+  UI_I_ChangeStepsSchemes,
+} from '~/components/common/wizards/vm/migrate/lib/models/interfaces'
+import type { UI_T_VmMigrateType } from '~/components/common/wizards/vm/migrate/select/type/lib/models/types'
+import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
+import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
+import type { UI_I_VmSettings } from '~/lib/models/store/vm/interfaces'
+import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
+import type { UI_I_StorageConfigurePerDiskItem } from '~/components/common/wizards/vm/migrate/select/storage/configure/disk/table/lib/models/interfaces'
+import type { UI_I_TableInfoItem } from '~/components/atoms/table/info/lib/models/interfaces'
+import type { UI_I_ScheduleNewTasksForm } from '~/components/common/pages/scheduledTasks/modals/lib/models/interfaces'
+import { constructDataReadyViewFunc } from '~/components/common/wizards/vm/migrate/lib/config/constructDataReady'
+import * as validation from '~/components/common/wizards/vm/migrate/lib/validations'
+
+const props = withDefaults(
+  defineProps<{
+    project: UI_T_Project
+    isScheduledTasks: boolean
+    isEditScheduledTasks: boolean
+    vmSettings: UI_I_VmSettings | null
+    vmName: string
+    getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
+    getComputeResourceData: (payload: UI_I_TablePayload) => Promise<void>
+    datastore: UI_I_DatastoreTableItem[]
+    configurePerDisks: UI_I_StorageConfigurePerDiskItem[]
+    computeResourceTableData?: any
+    computeResourceTree?: UI_I_TreeNode | null
+    selectedVirtualMachine?: string
+  }>(),
+  {
+    computeResourceTree: null,
+  }
+)
+const emits = defineEmits<{
+  (event: 'hide'): void
+  (event: 'finish', value: UI_I_MigrateFormLocal): void
+}>()
+const modelSchedulerTask = defineModel<UI_I_ScheduleNewTasksForm>(
+  'schedulerForm',
+  { required: true }
+)
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const wizard: Wizard = new Wizard(
+  stepsFunc(localization.value, props.isScheduledTasks),
+  stepsSchemeInitial
+)
+
+const selectedScheme = computed<number[]>(() => wizard.selectedScheme.value)
+const alertMessages = computed<string[][]>(() => wizard.alertMessages.value)
+
+const title = computed<string>(() => {
+  const { scheduleNewTasks, scheduleTaskEdit, migrate } =
+    localization.value.common
+  let result = migrate
+  if (props.isScheduledTasks) {
+    const schedulerMode = props.isEditScheduledTasks
+      ? scheduleTaskEdit
+      : scheduleNewTasks
+
+    result = `${schedulerMode} (${migrate})`
+  }
+
+  return result
+})
+
+const isConnectSourceServer = ref<boolean>(false)
+const form = ref<UI_I_MigrateFormLocal>({
+  migrate_type: props.project === 'procurator' ? 'storage' : 'resource',
+  disk_format: 0,
+  storage: null,
+  configure: {
+    type: 'batch-configure',
+    disks: [],
+  },
+  target_server: {
+    fqdn: '',
+    user: '',
+    password: '',
+  },
+  network: {
+    data: null,
+  },
+  resource: {
+    selectedNode: null,
+    host: null,
+    cluster: null,
+    resourcePool: null,
+    vApps: null,
+  },
+  vMotion_priority: 'high',
+})
+
+const validationFunc = async (
+  value: UI_I_WizardStep[],
+  currentStep: UI_I_WizardStep,
+  nextStep: UI_I_WizardStep
+): Promise<UI_I_ValidationReturn> => {
+  let stepHasError = false
+
+  if (wizard.isValidateForStep(3, currentStep.id, nextStep.id)) {
+    const nameValidation = await validation.checkSelectedResourceSync(
+      localization.value,
+      form.value.resource,
+      wizard,
+      value
+    )
+
+    value = nameValidation.newValue
+
+    stepHasError = nameValidation.stepHasError
+  }
+
+  if (wizard.isValidateForStep(4, currentStep.id, nextStep.id)) {
+    const nameValidation = await validation.checkSelectedDatastoreSync(
+      localization.value,
+      form.value.storage,
+      wizard,
+      value
+    )
+
+    value = nameValidation.newValue
+
+    stepHasError = nameValidation.stepHasError
+  }
+
+  return {
+    newValue: value,
+    stepHasError,
+  }
+}
+const onChangeSteps = async (value: UI_I_WizardStep[]): Promise<void> =>
+  wizard.changeSteps(value, validationFunc)
+
+// Choosing Scheme
+watch(
+  () => form.value.migrate_type,
+  (newValue: UI_T_VmMigrateType) => {
+    const schemes: UI_I_ChangeStepsSchemes = {
+      procurator: {
+        storage: props.isScheduledTasks ? 1 : 0,
+      },
+      sphere: {
+        storage: props.isScheduledTasks ? 1 : 0,
+        resource: props.isScheduledTasks ? 3 : 2,
+        'resource-storage': 2,
+        server: 3,
+      },
+    }
+
+    const projectSchemes = schemes[props.project]
+
+    if (projectSchemes && projectSchemes[newValue] !== undefined) {
+      wizard.changeScheme(projectSchemes[newValue] as number)
+    }
+  },
+  { deep: true, immediate: true }
+)
+
+watch(
+  modelSchedulerTask,
+  (newValue: UI_I_ScheduleNewTasksForm) => {
+    if (props.isScheduledTasks) wizard.setDisabledNextButton(newValue.isValid)
+  },
+  { immediate: true, deep: true }
+)
+
+const loading = ref<boolean>(false)
+
+const connectedStorageIdOnVm = computed<string>(
+  () => props.vmSettings?.storage.id || ''
+)
+
+const dataReadyView = computed<UI_I_TableInfoItem>(() =>
+  constructDataReadyViewFunc(props.vmName, form.value)
+)
+const onFinish = (): void => {
+  loading.value = true
+  emits('finish', form.value)
+  loading.value = false
+}
+
+const onHideModal = (): void => {
+  emits('hide')
+}
+
+const onHideAlert = (stepId: number): void => {
+  wizard.hideAlertMessagesByStepId(stepId)
+}
+</script>
+
+<style scoped lang="scss">
+@import 'assets/scss/common/mixins.scss';
+.migrate-vm {
+  :deep(.modal-body) {
+    height: inherit;
+    @include flex($dir: column);
+  }
+}
+</style>

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

@@ -53,9 +53,9 @@ import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/model
 import type { UI_I_TreeNode } from '~/components/common/recursionTree/lib/models/interfaces'
 import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
 import type { UI_T_SelectComputeResourceTabType } from '~/components/common/wizards/vm/migrate/select/storage/lib/models/types'
-import type { UI_E_ComputeResourceTabKamelKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/lib/models/enums'
 import type { UI_I_MigrateFormLocal } from '~/components/common/wizards/vm/migrate/lib/models/interfaces'
 import type { UI_I_SelectedTableDataKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/lib/models/interfaces'
+import { UI_E_ComputeResourceTabKamelKeys } from '~/components/common/wizards/vm/migrate/select/computeResource/lib/models/enums'
 import { vmMigrateComputeResourceTabsFunc } from '~/components/common/wizards/vm/migrate/select/computeResource/lib/config/tabsPannel'
 
 const props = defineProps<{

package/package.json

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