bfg-common 1.1.97 → 1.1.99

package/components/common/vm/actions/add/customizeHardware/CustomizeHardware.vue

@@ -55,6 +55,7 @@
         :networks="props.networksForBootOptions"
         :options="props.options"
         :is-edit="props.isEdit"
+        :is-clone="props.isClone"
         :error-validation-fields="props.errorValidationFields"
         :state="props.state"
         @change-boot-order="onChangeBootOrder"
@@ -126,6 +127,7 @@ const props = defineProps<{
   usbController?: string
   options?: UI_I_SendDataVmoptions
   isEdit?: boolean
+  isClone?: boolean
   state?: string | number
   passthroughDevices?: UI_I_ConfigurePciDevicesTable | null
 }>()

package/components/common/vm/actions/add/customizeHardware/vmoptions/Vmoptions.vue

@@ -8,6 +8,7 @@
           v-model:guest-os-family="guestOsFamilyLocal"
           v-model:guest-os-version="guestOsVersionLocal"
           :is-edit="props.isEdit"
+          :is-clone="props.isClone"
           :state="props.state"
         />
         <common-vm-actions-add-customize-hardware-vmoptions-remote-console-options
@@ -65,6 +66,7 @@ const props = defineProps<{
   cdDvdDrives: UI_I_SendDataNewCdDvdDrive[] | null
   networks: UI_I_SendDataNewNetwork[] | null
   isEdit: boolean
+  isClone: boolean
   errorValidationFields: UI_I_ErrorValidationField[]
   options?: UI_I_SendDataVmoptions
   state?: string | number

package/components/common/vm/actions/add/customizeHardware/vmoptions/generalOptions/GeneralOptions.vue

@@ -108,6 +108,7 @@ const props = defineProps<{
   guestOsFamily: UI_I_OptionItem | null
   guestOsVersion: UI_I_OptionItem | null
   isEdit: boolean
+  isClone: boolean
   state?: string | number
 }>()
 const emits = defineEmits<{
@@ -118,7 +119,7 @@ const emits = defineEmits<{
 }>()
 
 const isDisabled = computed<boolean>(
-  () => !props.isEdit || (props.isEdit && props.state !== 1)
+  () => (!props.isEdit && !props.isClone) || (props.isEdit && props.state !== 1)
 )
 
 const vmNameLocal = computed<string>({

package/components/common/vm/actions/clone/Clone.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="add-vm">
+  <div class="clone-vm">
     <atoms-modal-by-steps
-      test-id="add-vm-wizard"
+      test-id="clone-vm-wizard"
       :show="true"
       :title="localization.cloneExistingVirtualMachine"
       :step-items="stepItems"
@@ -11,14 +11,15 @@
       @hide="onHideModal"
     >
       <template #modalBody>
-        <div class="add-vm-context">
+        <atoms-loader v-show="!vmSettings || loading" id="loader" />
+        <div v-if="vmSettings" class="vm-context">
           <div class="context-title-wrap">
             <p>{{ stepSubTitle }}</p>
           </div>
 
           <common-vm-actions-add-select-name
-            v-show="stepPosition === 1"
-            :show="stepPosition === 1"
+            v-show="stepPosition === 0"
+            :show="stepPosition === 0"
             :name-form-submit="nameFormSubmit"
             :project="props.project"
             @submit="onChangeNameAndNext(...$event)"
@@ -26,19 +27,19 @@
             @loading="loading = $event"
           />
           <common-vm-actions-add-select-storage
-            v-show="stepPosition === 2"
+            v-show="stepPosition === 1"
             :storage-submit="storageSubmit"
             :datastore="props.datastore"
             :get-datastore-table-func="props.getDatastoreTableFunc"
             @submit="onChangeStorageAndNext"
           />
           <common-vm-actions-clone-select-options
-            v-show="stepPosition === 3"
+            v-show="stepPosition === 2"
             :select-options-submit="selectOptionsSubmit"
             @submit="onChangeSelectOptionsAndNext"
           />
           <common-vm-actions-add-customize-hardware
-            v-show="stepPosition === 4"
+            v-show="stepPosition === 3"
             v-model:vm-name="vmName"
             v-model:guest-machine-type="vmSettings.guestMachineType"
             v-model:guest-os-family="vmSettings.guestOsFamily"
@@ -81,7 +82,7 @@
             @send-data="onChangeCustomizeHardware"
           />
           <common-vm-actions-clone-ready-to-complete
-            v-if="stepPosition === 5"
+            v-if="stepPosition === 4"
             :ready-complete-table-info="props.readyCompleteTableInfo"
           />
         </div>
@@ -90,7 +91,7 @@
       <template #modalFooter>
         <div class="flex-align-center flex-space-between w-100">
           <div class="power-on-by-default-wrap">
-            <template v-if="stepPosition === 5">
+            <template v-if="stepPosition === 4">
               <input
                 id="power-on-by-default"
                 v-model="isPowerOnByDefault"
@@ -146,7 +147,10 @@ import type {
   UI_I_FolderOrFileTreePayload,
 } from '~/models/store/storage/interfaces'
 import type { UI_I_NetworkTableItem } from '~/models/store/network/interfaces'
-import type { API_UI_I_Error, UI_I_TablePayload } from '~/models/store/interfaces'
+import type {
+  API_UI_I_Error,
+  UI_I_TablePayload,
+} from '~/models/store/interfaces'
 import type { UI_I_FileTreeNode } from '~/components/models/interfaces'
 import type { UI_I_Localization } from '~/models/interfaces'
 import type { UI_I_SendDataCustomizeHardware } from '~/components/common/vm/actions/add/customizeHardware/models/interfaces'
@@ -188,11 +192,9 @@ const props = defineProps<{
   errorValidationFields: UI_I_ErrorValidationField[]
   readyCompleteTableInfo: UI_I_TableInfoItem[]
   vmCpuHelpTextSecond: string
-  finishFunc: UI_T_AddVmFinishFunc
+  finishFunc: any
   getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
-  validateSendDataFunc: UI_T_AddVmFinishFunc<
-    [UI_T_SelectedNavItem, null | number] | null
-  >
+  validateSendDataFunc: any
   passthroughDevices: UI_I_ConfigurePciDevicesTable | null
   vmNameInWizard: string
 }>()
@@ -213,7 +215,7 @@ const localization = computed<UI_I_Localization>(() => useLocal())
 
 const stepPosition = ref<number>(0)
 watch(stepPosition, (newValue) => {
-  if (newValue === 5) validateSendData()
+  if (newValue === 4) validateSendData()
 })
 const stepItems = ref<UI_I_VerticalStepItem[]>([])
 stepItems.value = stepItemsFunc(localization.value, props.project)
@@ -377,34 +379,34 @@ const checkLocalChangeAndChangeStepStatus = (): void => {
 }
 
 const checkSubmit = (force = false): boolean => {
-  if (stepPosition.value === 1 && !force) {
+  if (stepPosition.value === 0 && !force) {
     nameFormSubmit.value++
     return false
   }
-  if (stepPosition.value === 2 && !force) {
+  if (stepPosition.value === 1 && !force) {
     storageSubmit.value++
     return false
   }
-  if (stepPosition.value === 3 && !force) {
+  if (stepPosition.value === 2 && !force) {
     selectOptionsSubmit.value++
     return false
   }
-  if (stepPosition.value === 4 && !force) {
+  if (stepPosition.value === 3 && !force) {
     customizeHardwareSubmit.value++
     return false
   }
   return true
 }
 const checkSubmitByManual = (step: number): boolean => {
-  if (stepPosition.value === 1) {
+  if (stepPosition.value === 0) {
     nameFormSubmit.value++
     return false
   }
-  if (stepPosition.value === 2) {
+  if (stepPosition.value === 1) {
     storageSubmit.value++
     return false
   }
-  if (step === 6) {
+  if (step === 5) {
     customizeHardwareSubmit.value++
     return false
   }
@@ -425,8 +427,6 @@ const onChangeStep = (key: number): void => {
 }
 
 const compatibility = ref<UI_I_OptionItem[]>(capabilities.compatibility)
-const cpuModels = ref<UI_I_OptionItem[]>(capabilities.cpuModels)
-const maxCpus = ref<number>(capabilities.maxCpus)
 const maxMemory = ref<number>(capabilities.maxMemory)
 
 const vmSettings = computed<UI_I_VmSettings | null>(() => props.vmSettings)
@@ -445,7 +445,7 @@ const onHideModal = (): void => {
   width: 20px;
   top: 0;
 }
-.add-vm-context {
+.vm-context {
   padding: 16px 15px 10px 10px;
   height: 100%;
   display: flex;
@@ -458,12 +458,12 @@ const onHideModal = (): void => {
     h4 {
       font-weight: 700;
       font-size: 13px;
-      color: var(--add-vm-context-title);
+      color: var(--vm-context-title);
     }
     p {
       font-weight: 400;
       font-size: 13px;
-      color: var(--add-vm-context-sub-title);
+      color: var(--vm-context-sub-title);
     }
   }
 
@@ -534,11 +534,11 @@ const onHideModal = (): void => {
 
 <style>
 :root {
-  --add-vm-context-title: #333;
-  --add-vm-context-sub-title: #000;
+  --vm-context-title: #333;
+  --vm-context-sub-title: #000;
 }
 :root.dark-theme {
-  --add-vm-context-title: #adbbc4;
-  --add-vm-context-sub-title: #adbbc4;
+  --vm-context-title: #adbbc4;
+  --vm-context-sub-title: #adbbc4;
 }
 </style>

package/components/common/vm/actions/clone/select/options/Options.vue

@@ -49,35 +49,17 @@ const emits = defineEmits<{
 const localization = computed<UI_I_Localization>(() => useLocal())
 
 const selectedOptions = ref<string[]>([])
-watch(selectedOptions, newValue => {
-  emits('submit', newValue)
+watch(() => props.selectOptionsSubmit, () => {
+  emits('submit', selectedOptions.value)
 })
 </script>
 
 <style scoped lang="scss">
-.select-os {
-  .select-os-block {
-    label:not(.windows-virtualization-label) {
-      padding: 0 5px 5px 0;
-    }
+.select-options {
+  padding: 12px 0 0;
 
-    .windows-virtualization-label {
-      padding: 0 4px;
-    }
-  }
-}
-
-#os-select-help-icon {
-  h3 {
-    margin-top: 7px;
-    font-size: 22px;
-    color: #565656;
-  }
-  p {
-    width: 310px;
-    margin-top: 24px;
-    font-size: 14px;
-    color: #565656;
+  .checkbox {
+    margin: 6px 0;
   }
 }
 </style>

package/components/common/vm/actions/clone/utils.ts

@@ -12,7 +12,7 @@ export const stepItemsFunc = (
   return [
     {
       text: localization.selectName,
-      disabled: true,
+      disabled: false,
       complete: false,
     },
     { text: localization.selectStorage, disabled: true, complete: false },

package/components/common/vm/actions/editSettings/EditSettings.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="add-vm">
+  <div class="edit-vm">
     <atoms-modal
-      test-id="vm-edit-settings"
+      test-id="edit-vm-wizard"
       :show="true"
       :title="localization.editSettings"
       :second-title="vmNameCash"
@@ -14,7 +14,7 @@
           v-show="!vmSettings || loading"
           id="loader"
         />
-        <div v-if="vmSettings" class="add-vm-context">
+        <div v-if="vmSettings" class="vm-context">
           <common-vm-actions-add-customize-hardware
             v-model:vm-name="vmName"
             v-model:guest-machine-type="vmSettings.guestMachineType"
@@ -205,7 +205,7 @@ const validateSendData = async (): Promise<void> => {
 </script>
 
 <style scoped lang="scss">
-.add-vm-context {
+.vm-context {
   padding: 16px 15px 10px 10px;
   height: 100%;
   display: flex;
@@ -218,12 +218,12 @@ const validateSendData = async (): Promise<void> => {
     h4 {
       font-weight: 700;
       font-size: 13px;
-      color: var(--add-vm-context-title);
+      color: var(--vm-context-title);
     }
     p {
       font-weight: 400;
       font-size: 13px;
-      color: var(--add-vm-context-sub-title);
+      color: var(--vm-context-sub-title);
     }
   }
 
@@ -306,11 +306,11 @@ const validateSendData = async (): Promise<void> => {
 
 <style>
 :root {
-  --add-vm-context-title: #333;
-  --add-vm-context-sub-title: #000;
+  --vm-context-title: #333;
+  --vm-context-sub-title: #000;
 }
 :root.dark-theme {
-  --add-vm-context-title: #adbbc4;
-  --add-vm-context-sub-title: #adbbc4;
+  --vm-context-title: #adbbc4;
+  --vm-context-sub-title: #adbbc4;
 }
 </style>

package/package.json

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