bfg-common 1.2.200 → 1.2.201

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

@@ -1,65 +1,65 @@
-<template>
-  <div class="select-options">
-    <div class="checkbox">
-      <input
-        id="customize-os"
-        v-model="selectedOptions"
-        type="checkbox"
-        value="customize-os"
-      />
-      <label for="customize-os">{{
-        localization.customizeTheOperatingSystem
-      }}</label>
-    </div>
-    <div class="checkbox">
-      <input
-        id="customize-hardware"
-        v-model="selectedOptions"
-        type="checkbox"
-        value="customize-hardware"
-      />
-      <label for="customize-hardware">{{
-        localization.customizeThisVirtualMachineHardware
-      }}</label>
-    </div>
-    <div class="checkbox">
-      <input
-        id="power-on"
-        v-model="selectedOptions"
-        type="checkbox"
-        value="power-on"
-      />
-      <label for="power-on">{{
-        localization.powerOnVirtualMachineAfterCreation
-      }}</label>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/models/interfaces'
-
-const props = defineProps<{
-  selectOptionsSubmit: number
-}>()
-
-const emits = defineEmits<{
-  (event: 'submit', value: string[]): void
-}>()
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const selectedOptions = ref<string[]>([])
-watch(() => props.selectOptionsSubmit, () => {
-  emits('submit', selectedOptions.value)
-})
-</script>
-
-<style scoped lang="scss">
-.select-options {
-  padding: 12px 0 0;
-
-  .checkbox {
-    margin: 6px 0;
-  }
-}
-</style>
+<template>
+  <div class="select-options">
+    <div class="checkbox">
+      <input
+        id="customize-os"
+        v-model="selectedOptions"
+        type="checkbox"
+        value="customize-os"
+      />
+      <label for="customize-os">{{
+        localization.customizeTheOperatingSystem
+      }}</label>
+    </div>
+    <div class="checkbox">
+      <input
+        id="customize-hardware"
+        v-model="selectedOptions"
+        type="checkbox"
+        value="customize-hardware"
+      />
+      <label for="customize-hardware">{{
+        localization.customizeThisVirtualMachineHardware
+      }}</label>
+    </div>
+    <div class="checkbox">
+      <input
+        id="power-on"
+        v-model="selectedOptions"
+        type="checkbox"
+        value="power-on"
+      />
+      <label for="power-on">{{
+        localization.powerOnVirtualMachineAfterCreation
+      }}</label>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/models/interfaces'
+
+const props = defineProps<{
+  selectOptionsSubmit: number
+}>()
+
+const emits = defineEmits<{
+  (event: 'submit', value: string[]): void
+}>()
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const selectedOptions = ref<string[]>([])
+watch(() => props.selectOptionsSubmit, () => {
+  emits('submit', selectedOptions.value)
+})
+</script>
+
+<style scoped lang="scss">
+.select-options {
+  padding: 12px 0 0;
+
+  .checkbox {
+    margin: 6px 0;
+  }
+}
+</style>

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

@@ -1,43 +1,43 @@
-import { UI_I_Localization } from '~/models/interfaces'
-import { UI_I_VerticalStepItem } from '~/components/atoms/models/interfaces'
-import { UI_T_Project } from '~/models/types'
-
-export const stepItemsFunc = (
-  localization: UI_I_Localization,
-  project: UI_T_Project
-): UI_I_VerticalStepItem[] => {
-  if (project === 'sphere') {
-    return []
-  }
-  return [
-    {
-      text: localization.selectName,
-      disabled: false,
-      complete: false,
-    },
-    { text: localization.selectStorage, disabled: true, complete: false },
-    { text: localization.selectCloneOptions, disabled: true, complete: false },
-    {
-      text: localization.customizeHardware,
-      disabled: true,
-      complete: false,
-    },
-    { text: localization.readyComplete, disabled: true, complete: false },
-  ]
-}
-
-export const subTitleFunc = (
-  localization: UI_I_Localization,
-  project: UI_T_Project
-): string[] => {
-  if (project === 'sphere') {
-    return []
-  }
-  return [
-    localization.specifyUniqueName,
-    localization.selectStorageConfigurationDiskFiles,
-    localization.chooseGuestOSInstalledVmAndMachineTypeUsedCreateVm,
-    localization.selectFurtherCloneOptions,
-    localization.clickFinishStartCreation,
-  ]
-}
+import { UI_I_Localization } from '~/models/interfaces'
+import { UI_I_VerticalStepItem } from '~/components/atoms/models/interfaces'
+import { UI_T_Project } from '~/models/types'
+
+export const stepItemsFunc = (
+  localization: UI_I_Localization,
+  project: UI_T_Project
+): UI_I_VerticalStepItem[] => {
+  if (project === 'sphere') {
+    return []
+  }
+  return [
+    {
+      text: localization.selectName,
+      disabled: false,
+      complete: false,
+    },
+    { text: localization.selectStorage, disabled: true, complete: false },
+    { text: localization.selectCloneOptions, disabled: true, complete: false },
+    {
+      text: localization.customizeHardware,
+      disabled: true,
+      complete: false,
+    },
+    { text: localization.readyComplete, disabled: true, complete: false },
+  ]
+}
+
+export const subTitleFunc = (
+  localization: UI_I_Localization,
+  project: UI_T_Project
+): string[] => {
+  if (project === 'sphere') {
+    return []
+  }
+  return [
+    localization.specifyUniqueName,
+    localization.selectStorageConfigurationDiskFiles,
+    localization.chooseGuestOSInstalledVmAndMachineTypeUsedCreateVm,
+    localization.selectFurtherCloneOptions,
+    localization.clickFinishStartCreation,
+  ]
+}

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

@@ -108,7 +108,7 @@ const props = defineProps<{
   hardDisksForBootOptions: UI_I_SendDataNewHardDisk[] | null
   cdDvdDrivesForBootOptions: UI_I_SendDataNewCdDvdDrive[] | null
   networksForBootOptions: UI_I_SendDataNewNetwork[] | null
-  customizeHardwareSubmit: number
+  customizeHardwareSubmit: null | Function
   maxCpus: number
   maxMemory: number
   selectedNavItem: UI_T_SelectedNavItem
@@ -227,19 +227,20 @@ const onChangeBootOrder = (data: UI_T_ChangeBootOrder): void => {
 
 watch(
   () => props.customizeHardwareSubmit,
-  () => {
-    submit()
-  }
+    (newValue) => {
+      newValue && submit(newValue)
+    }
 )
 const virtualHardwareInvalid = ref<string[]>([])
 const vmOptionsInvalid = ref<string[]>([])
-const submit = (): void => {
+const submit = (cb: Function): void => {
   const invalidDevices = [
     ...virtualHardwareInvalid.value,
     ...vmOptionsInvalid.value,
   ]
     .filter((item: string) => !!item)
     .join(', ')
+  console.log(invalidDevices, 111, virtualHardwareInvalid.value);
 
   if (invalidDevices) {
     showValidationErrors([
@@ -248,11 +249,13 @@ const submit = (): void => {
         invalidDevices
       ),
     ])
+    cb(false)
     return
   }
   onRemoveValidationErrors()
 
-  emits('next')
+  // emits('next')
+  cb(true)
 }
 
 const errors = ref<string[]>([])

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

@@ -0,0 +1,267 @@
+<template>
+  <div class="customize-hardware">
+    <atoms-nav-bar v-model="selectedNavItem" :items="navItems" />
+    <atoms-alert
+      v-show="errors.length"
+      status="alert-danger"
+      :items="errors"
+      @remove="onRemoveValidationErrors"
+    />
+
+    <div v-show="selectedNavItem === 0">
+      <common-vm-actions-common-customize-hardware-virtual-hardware
+        :vm-name="vmNameLocal"
+        :storage="props.storage"
+        :max-cpus="props.maxCpus"
+        :max-memory="props.maxMemory"
+        :cpu-models="props.cpuModels"
+        :cpu="props.cpu"
+        :memory="props.memory"
+        :is-edit="props.isEdit"
+        :is-clone="props.isClone"
+        :state="props.state"
+        :hard-disks="props.hardDisks"
+        :cd-dvd-drives="props.cdDvdDrives"
+        :networks="props.networks"
+        :networks-table="props.networksTable"
+        :video-card="props.videoCard"
+        :usb-controller="props.usbController"
+        :pci-devices="props.pciDevices"
+        :nodes="props.nodes"
+        :files="props.files"
+        :error-validation-fields="props.errorValidationFields"
+        :get-datastore-table-func="props.getDatastoreTableFunc"
+        :datastore="props.datastore"
+        :vm-cpu-help-text-second="props.vmCpuHelpTextSecond"
+        :passthrough-devices="props.passthroughDevices"
+        @send-data="onSendDataVirtualHardwareMethod"
+        @get-storage="emits('get-storage', $event)"
+        @get-folders-or-files="emits('get-folders-or-files', $event)"
+        @get-active-device-child="emits('get-active-device-child', $event)"
+        @show-datastore-child="emits('show-datastore-child', $event)"
+        @remove-error-by-title="emits('remove-error-by-title', $event)"
+        @invalid="virtualHardwareInvalid = $event"
+        @get-networks-table="emits('get-networks-table', $event)"
+        @get-pci-devices="emits('get-pci-devices')"
+      />
+    </div>
+    <div v-show="selectedNavItem === 1">
+      <common-vm-actions-common-customize-hardware-vmoptions
+        v-model:vm-name="vmNameLocal"
+        v-model:guest-machine-type="guestMachineTypeLocal"
+        v-model:guest-os-family="guestOsFamilyLocal"
+        v-model:guest-os-version="guestOsVersionLocal"
+        :hard-disks="props.hardDisksForBootOptions"
+        :cd-dvd-drives="props.cdDvdDrivesForBootOptions"
+        :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"
+        @send-data="onSendDataVmOptionsMethod"
+        @invalid="vmOptionsInvalid = $event"
+        @remove-error-by-title="emits('remove-error-by-title', $event)"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { UI_I_DatastoreTableItem } from '~/models/store/storage/interfaces'
+import { UI_I_NetworkTableItem } from '~/models/store/network/interfaces'
+import { UI_I_TablePayload } from '~/models/store/interfaces'
+import { UI_I_FolderOrFileTreePayload } from '~/models/store/storage/interfaces'
+import { UI_I_FileTreeNode } from '~/components/models/interfaces'
+import {
+  UI_I_PciDevice,
+  UI_I_SendDataNewCdDvdDrive,
+  UI_I_SendDataNewHardDisk,
+  UI_I_SendDataNewNetwork,
+  UI_I_SendDataVideoCard,
+  UI_I_SendDataVirtualHardware,
+} from '~/components/common/vm/actions/common/customizeHardware/virtualHardware/models/interfaces'
+import { UI_I_SendDataCustomizeHardware } from '~/components/common/vm/actions/common/customizeHardware/models/interfaces'
+import { UI_I_SendDataVmoptions } from '~/components/common/vm/actions/common/customizeHardware/vmoptions/models/interfaces'
+import { UI_T_SelectedNavItem } from '~/components/common/vm/actions/common/models/types'
+import { UI_I_ErrorValidationField } from '~/models/store/interfaces'
+import { UI_I_Localization } from '~/models/interfaces'
+import { UI_I_OptionItem } from '~/components/atoms/models/interfaces'
+import { UI_I_CollapseNavItem } from '~/components/atoms/collapse/models/interfaces'
+import { UI_I_ConfigurePciDevicesTable } from '~/models/store/host/interfaces'
+import { UI_T_ChangeBootOrder } from '~/components/common/vm/actions/models/types'
+import {
+  API_UI_I_VmEditCpu,
+  API_UI_I_VmEditMemory,
+} from '~/models/store/vm/interfaces'
+import { navItemsFunc } from '~/components/common/vm/actions/common/customizeHardware/config/navItems'
+
+const props = defineProps<{
+  vmName: string
+  errorValidationFields: UI_I_ErrorValidationField[]
+  storage: UI_I_DatastoreTableItem | null
+  guestMachineType: UI_I_OptionItem | null
+  guestOsFamily: UI_I_OptionItem | null
+  guestOsVersion: UI_I_OptionItem | null
+  cpuModels: UI_I_OptionItem[]
+  hardDisksForBootOptions: UI_I_SendDataNewHardDisk[] | null
+  cdDvdDrivesForBootOptions: UI_I_SendDataNewCdDvdDrive[] | null
+  networksForBootOptions: UI_I_SendDataNewNetwork[] | null
+  customizeHardwareSubmit: number
+  maxCpus: number
+  maxMemory: number
+  selectedNavItem: UI_T_SelectedNavItem
+  nodes: UI_I_FileTreeNode[]
+  files: UI_I_FileTreeNode[]
+  networksTable: UI_I_NetworkTableItem[]
+  cpu?: API_UI_I_VmEditCpu
+  memory?: API_UI_I_VmEditMemory
+  vmCpuHelpTextSecond?: string
+  getDatastoreTableFunc?: (payload: UI_I_TablePayload) => Promise<void>
+  datastore: UI_I_DatastoreTableItem[]
+  hardDisks?: UI_I_SendDataNewHardDisk[] | null
+  cdDvdDrives?: UI_I_SendDataNewCdDvdDrive[] | null
+  networks?: UI_I_SendDataNewNetwork[] | null
+  videoCard?: UI_I_SendDataVideoCard
+  pciDevices?: UI_I_PciDevice[]
+  usbController?: string
+  options?: UI_I_SendDataVmoptions
+  isEdit?: boolean
+  isClone?: boolean
+  state?: string | number
+  passthroughDevices?: UI_I_ConfigurePciDevicesTable | null
+}>()
+const emits = defineEmits<{
+  (
+    event: 'change-boot-order',
+    value: [
+      UI_I_SendDataNewHardDisk[],
+      UI_I_SendDataNewCdDvdDrive[],
+      UI_I_SendDataNewNetwork[]
+    ]
+  ): void
+  (event: 'send-data', value: UI_I_SendDataCustomizeHardware): void
+  (event: 'next'): void
+  (event: 'update:vm-name', value: string): void
+  (event: 'update:guest-machine-type', value: UI_I_OptionItem | null): void
+  (event: 'update:guest-os-family', value: UI_I_OptionItem | null): void
+  (event: 'update:guest-os-version', value: UI_I_OptionItem | null): void
+  (event: 'get-storage', value: UI_I_TablePayload): void
+  (event: 'get-folders-or-files', value: UI_I_FolderOrFileTreePayload): void
+  (event: 'get-active-device-child', value: UI_I_FileTreeNode): void
+  (event: 'show-datastore-child', value: UI_I_FileTreeNode): void
+  (event: 'remove-error-by-title', value: string): void
+  (event: 'get-networks-table', value: UI_I_TablePayload): void
+  (event: 'get-pci-devices'): void
+}>()
+
+const vmNameLocal = computed<string>({
+  get() {
+    return props.vmName
+  },
+  set(newValue) {
+    emits('update:vm-name', newValue)
+  },
+})
+const guestMachineTypeLocal = computed<UI_I_OptionItem | null>({
+  get() {
+    return props.guestMachineType
+  },
+  set(newValue) {
+    emits('update:guest-machine-type', newValue)
+  },
+})
+const guestOsFamilyLocal = computed<UI_I_OptionItem | null>({
+  get() {
+    return props.guestOsFamily
+  },
+  set(newValue) {
+    emits('update:guest-os-family', newValue)
+  },
+})
+const guestOsVersionLocal = computed<UI_I_OptionItem | null>({
+  get() {
+    return props.guestOsVersion
+  },
+  set(newValue) {
+    emits('update:guest-os-version', newValue)
+  },
+})
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const navItems = computed<UI_I_CollapseNavItem[]>(() =>
+  navItemsFunc(localization.value)
+)
+const selectedNavItem = ref<number>(0)
+watch(
+  () => props.selectedNavItem,
+  (n) => {
+    selectedNavItem.value = n
+  }
+)
+
+const sendDataVirtualHardware = ref<UI_I_SendDataVirtualHardware | null>(null)
+const onSendDataVirtualHardwareMethod = (
+  data: UI_I_SendDataVirtualHardware
+): void => {
+  sendDataVirtualHardware.value = data
+  sendData()
+}
+const sendDataVmOptions = ref<UI_I_SendDataVmoptions | null>(null)
+const onSendDataVmOptionsMethod = (data: UI_I_SendDataVmoptions): void => {
+  sendDataVmOptions.value = data
+  sendData()
+}
+const sendData = (): void => {
+  emits('send-data', {
+    virtualHardware: sendDataVirtualHardware.value,
+    vmOptions: sendDataVmOptions.value,
+  })
+}
+
+const onChangeBootOrder = (data: UI_T_ChangeBootOrder): void => {
+  emits('change-boot-order', data)
+}
+
+watch(
+  () => props.customizeHardwareSubmit,
+  () => {
+    submit()
+  }
+)
+const virtualHardwareInvalid = ref<string[]>([])
+const vmOptionsInvalid = ref<string[]>([])
+const submit = (): void => {
+  const invalidDevices = [
+    ...virtualHardwareInvalid.value,
+    ...vmOptionsInvalid.value,
+  ]
+    .filter((item: string) => !!item)
+    .join(', ')
+
+  if (invalidDevices) {
+    showValidationErrors([
+      localization.value.thereErrorsFollowingFields.replace(
+        '{0}',
+        invalidDevices
+      ),
+    ])
+    return
+  }
+  onRemoveValidationErrors()
+
+  emits('next')
+}
+
+const errors = ref<string[]>([])
+const showValidationErrors = (arr: string[]): void => {
+  errors.value = arr
+}
+const onRemoveValidationErrors = (): void => {
+  errors.value = []
+}
+</script>
+
+<style scoped lang="scss"></style>