bfg-common 1.5.420 → 1.5.421

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

@@ -1,349 +1,353 @@
-<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 #description="{ selectedStep }">
-        <div class="flex items-center justify-between">
-          <h2 class="custom-sub-title">
-            {{ selectedStep.subTitle }}
-          </h2>
-          <common-wizards-vm-migrate-vm-origin
-            v-if="props.vmOrigin"
-            :vm-origin="props.vmOrigin"
-          />
-        </div>
-      </template>
-      <template #modalBody="{ selectedStep }"
-        >
-        <common-pages-scheduled-tasks-modals-common-new-task-form
-          v-if="selectedStep.id === dynamicSteps.schedulingOptions"
-          v-model="modelSchedulerTask"
-          :target="props.vmName"
-        />
-
-        <common-wizards-vm-migrate-select-type
-          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 === dynamicSteps.selectTargetVCenterSer"
-          v-model="form.target_server"
-          v-model:connect-server="isConnectSourceServer"
-          :wizard="wizard"
-        />
-
-        <common-wizards-vm-migrate-select-compute-resource
-          v-if="isSphere"
-          v-show="selectedStep.id === dynamicSteps.selectComputeResource"
-          v-model="form"
-          :vm-state="props.vmState"
-          :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 === dynamicSteps.selectStorage"
-          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-if="isSphere"
-          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 === dynamicSteps.migrationStrategy"
-          v-model="form.vMotion_priority"
-          :vm-state="props.vmState"
-        />
-
-        <common-ready-to-complete
-          v-if="selectedStep.id === dynamicSteps.readyComplete"
-          :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 {
-  dynamicSteps,
-  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 type { UI_I_VmOrigin } from '~/components/common/wizards/vm/migrate/vmOrigin/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
-    vmState?: number
-    vmInfo?: any | null
-    networks?: any
-    vmOrigin?: UI_I_VmOrigin | null
-    defaultMigrateType?: UI_T_VmMigrateType
-  }>(),
-  {
-    computeResourceTree: null,
-    vmOrigin: null,
-  }
-)
-const emits = defineEmits<{
-  (event: 'finish', value: UI_I_MigrateFormLocal): void
-  (event: 'get-networks', value: string): void
-  (event: 'hide'): void
-}>()
-const modelSchedulerTask = defineModel<UI_I_ScheduleNewTasksForm>(
-  'schedulerForm',
-  { required: true }
-)
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const isSphere = ref<boolean>(props.project === 'sphere')
-
-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.defaultMigrateType
-    ? props.defaultMigrateType
-    : props.project === 'procurator'
-    ? 'storage'
-    : 'resource',
-  disk_format: 0,
-  storage: null,
-  configure: {
-    type: 'batch-configure',
-    disks: [],
-  },
-  target_server: {
-    fqdn: '',
-    user: '',
-    password: '',
-  },
-  network: {},
-  resource: {
-    selectedNode: null,
-    host: null,
-    cluster: null,
-    resourcePool: null,
-    vApps: null,
-  },
-  vMotion_priority:
-    props.vmState === 2 ? 'live' : props.vmState === 1 ? 'offline' : '',
-})
-
-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(
-      dynamicSteps.selectComputeResource,
-      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(
-      dynamicSteps.selectStorage,
-      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': 4,
-        server: 5,
-      },
-    }
-
-    const projectSchemes = schemes[props.project]
-
-    if (projectSchemes && projectSchemes[newValue] !== undefined) {
-      wizard.changeScheme(projectSchemes[newValue] as number)
-    }
-  },
-  { deep: true, immediate: true }
-)
-// Get networks
-watch(
-  () => form.value.resource.host,
-  (newValue) => {
-    emits('get-networks', newValue.id)
-  }
-)
-
-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 {
-  .custom-sub-title {
-    font-weight: 400;
-    font-size: 13px;
-    line-height: inherit;
-    color: var(--add-vm-context-sub-title);
-  }
-
-  :deep(.modal-body) {
-    height: inherit;
-    @include flex($dir: column);
-
-    .content-heading > div {
-      width: 100%;
-    }
-  }
-}
-</style>
+<template>
+  <div class="migrate-vm">
+    <atoms-wizard
+      :wizard="wizard"
+      :selected-scheme="selectedScheme"
+      :title="title"
+      :localization="localization"
+      class="migrate-vm-wizard"
+      test-id="migrate-vm-wizard"
+      show
+      @change-steps="onChangeSteps"
+      @hide="onHideModal"
+      @submit="onFinish"
+    >
+      <template #description="{ selectedStep }">
+        <div class="flex items-center justify-between">
+          <h2 class="custom-sub-title">
+            {{ selectedStep.subTitle }}
+          </h2>
+          <common-wizards-vm-migrate-vm-origin
+            v-if="props.vmOrigin"
+            :vm-origin="props.vmOrigin"
+          />
+        </div>
+      </template>
+      <template #modalBody="{ selectedStep }">
+        <common-pages-scheduled-tasks-modals-common-new-task-form
+          v-if="selectedStep.id === dynamicSteps.schedulingOptions"
+          v-model="modelSchedulerTask"
+          :target="props.vmName"
+        />
+
+        <common-wizards-vm-migrate-select-type
+          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 === dynamicSteps.selectTargetVCenterSer"
+          v-model="form.target_server"
+          v-model:connect-server="isConnectSourceServer"
+          :wizard="wizard"
+        />
+
+        <common-wizards-vm-migrate-select-compute-resource
+          v-if="isSphere"
+          v-show="selectedStep.id === dynamicSteps.selectComputeResource"
+          v-model="form"
+          :vm-state="props.vmState"
+          :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 === dynamicSteps.selectStorage"
+          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-if="isSphere"
+          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 === dynamicSteps.migrationStrategy"
+          v-model="form.vMotion_priority"
+          :vm-state="props.vmState"
+        />
+
+        <common-ready-to-complete
+          v-if="selectedStep.id === dynamicSteps.readyComplete"
+          :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 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 type { UI_I_VmOrigin } from '~/components/common/wizards/vm/migrate/vmOrigin/lib/models/interfaces'
+import {
+  dynamicSteps,
+  stepsFunc,
+  stepsSchemeInitial,
+} from '~/components/common/wizards/vm/migrate/lib/config/steps'
+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
+    vmState?: number
+    vmInfo?: any | null
+    networks?: any
+    vmOrigin?: UI_I_VmOrigin | null
+    defaultMigrateType?: UI_T_VmMigrateType
+  }>(),
+  {
+    computeResourceTableData: undefined,
+    computeResourceTree: null,
+    vmState: undefined,
+    vmInfo: undefined,
+    networks: undefined,
+    vmOrigin: null,
+    defaultMigrateType: undefined,
+  }
+)
+const emits = defineEmits<{
+  (event: 'finish', value: UI_I_MigrateFormLocal): void
+  (event: 'get-networks', value: string): void
+  (event: 'hide'): void
+}>()
+const modelSchedulerTask = defineModel<UI_I_ScheduleNewTasksForm>(
+  'schedulerForm',
+  { required: true }
+)
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const isSphere = ref<boolean>(props.project === 'sphere')
+
+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.defaultMigrateType
+    ? props.defaultMigrateType
+    : props.project === 'procurator'
+    ? 'storage'
+    : 'resource',
+  disk_format: 0,
+  storage: null,
+  configure: {
+    type: 'batch-configure',
+    disks: [],
+  },
+  target_server: {
+    fqdn: '',
+    user: '',
+    password: '',
+  },
+  network: {},
+  resource: {
+    selectedNode: null,
+    host: null,
+    cluster: null,
+    resourcePool: null,
+    vApps: null,
+  },
+  vMotion_priority:
+    props.vmState === 2 ? 'live' : props.vmState === 1 ? 'offline' : '',
+})
+
+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(
+      dynamicSteps.selectComputeResource,
+      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(
+      dynamicSteps.selectStorage,
+      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': 4,
+        server: 5,
+      },
+    }
+
+    const projectSchemes = schemes[props.project]
+
+    if (projectSchemes && projectSchemes[newValue] !== undefined) {
+      wizard.changeScheme(projectSchemes[newValue] as number)
+    }
+  },
+  { deep: true, immediate: true }
+)
+// Get networks
+watch(
+  () => form.value.resource.host,
+  (newValue) => {
+    emits('get-networks', newValue.id)
+  }
+)
+
+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 {
+  .custom-sub-title {
+    font-weight: 400;
+    font-size: 13px;
+    line-height: inherit;
+    color: var(--add-vm-context-sub-title);
+  }
+
+  :deep(.modal-body) {
+    height: inherit;
+    @include flex($dir: column);
+
+    .content-heading > div {
+      width: 100%;
+    }
+  }
+}
+</style>