bfg-common 1.5.774 → 1.5.775

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/NewPciDevice.vue

@@ -29,27 +29,23 @@ import type {
 import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
 import { pciDeviceTypeOptionsFunc } from '~/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/lib/config/options'
 
-const address = defineModel<string>('address')
-const vendorName = defineModel<string>('vendorName')
-const className = defineModel<string>('className')
-const deviceName = defineModel<string>('deviceName')
-const mediatedDevice = defineModel<boolean>('mediatedDevice')
-const mediatedDeviceUuid = defineModel<string>('mediatedDeviceUuid')
-
 const props = withDefaults(
   defineProps<{
     index: number
+    pciDevice: UI_I_SendDataNewPciDevice
     passthroughDevices: UI_I_PciDevice[]
     mediatedDevices: UI_I_MediatedDevice[]
     type: UI_T_PciDeviceType
     isEdit: boolean
     state?: string | number
+    // errorValidationFields: UI_I_ErrorValidationField<string>[]
   }>(),
   {
     state: undefined,
   }
 )
 const emits = defineEmits<{
+  (event: 'send-data', value: UI_I_SendDataNewPciDevice): void
   (event: 'remove'): void
 }>()
 
@@ -68,8 +64,7 @@ const isRunning = computed<boolean>(() => {
 })
 
 const isRemovable = computed<boolean>(() => {
-  // return !props.isEdit || !isRunning.value
-  return props.type !== 'edit' || !isRunning.value
+  return !props.isEdit || !isRunning.value
 })
 
 const label = computed<string>(() => {
@@ -80,17 +75,16 @@ const label = computed<string>(() => {
 })
 
 const selectedLabel = computed<string>(() => {
-  if (address.value) {
-    return `${address.value} | ${deviceName.value}`
+  if (props.pciDevice.address) {
+    return `${props.pciDevice.address} | ${props.pciDevice.device_name}`
   }
   switch (selectedType.value.value) {
     case 'direct_path_io':
-      return directPathIo.value
-      // return `${directPathIo.value?.address} | ${directPathIo.value?.device_name}`
+      return `${directPathIo.value?.address} | ${directPathIo.value?.device_name}`
     case 'dynamic_direct_path_io':
       return `${dynamicDirectPathIo.value?.address} | ${dynamicDirectPathIo.value?.device_name}`
     default:
-      return nvidiaGridProfile.value?.text || ''
+      return nvidiaGridProfile.value?.text
   }
 })
 
@@ -105,43 +99,47 @@ pciDeviceTypeOptions.value.forEach((option) => {
   if (!option.disabled) selectedType.value = option
 })
 
-const directPathIo = ref<string>('')
+const directPathIo = ref<string>('') /// TODO
 const dynamicDirectPathIo = ref<UI_I_PciDevice>(props.passthroughDevices[0])
 const nvidiaGridProfile = ref<UI_I_Option | null>(null)
 
-const setData = (): void => {
-  const passthroughDevice = props.passthroughDevices.find((device) => {
-    return (
-      device.class_name + '_' + device.address ===
-      className.value + '_' + address.value
-    )
-  })
-  if (passthroughDevice) {
-    dynamicDirectPathIo.value = passthroughDevice
-  }
+watch(
+  [() => props.pciDevice, () => props.mediatedDevices],
+  ([newValue1]) => {
+    // const passthroughDevice = props.passthroughDevices.find(
+    //   (item) => item.address === newValue.address
+    // )
+    // passthroughDevice && (directPathIo.value = passthroughDevice) // Todo change
+    if (newValue1) {
+      // directPathIo.value = newValue1
+      const passthroughDevice = props.passthroughDevices.find((device) => {
+        return (
+          device.class_name + '_' + device.address ===
+          newValue1.class_name + '_' + newValue1.address
+        )
+      })
+      if (passthroughDevice) {
+        dynamicDirectPathIo.value = passthroughDevice
+      }
 
-  const mediatedDevice = props.mediatedDevices.find((device) => {
-    return (
-      device.profile_name + '_' + device.root_device ===
-      className.value + '_' + address.value
-    )
-  })
-  if (mediatedDevice) {
-    nvidiaGridProfile.value = {
-      text: mediatedDevice.human_readable,
-      value: mediatedDevice.profile_name + '_' + mediatedDevice.root_device,
+      const mediatedDevice = props.mediatedDevices.find((device) => {
+        return (
+          device.profile_name + '_' + device.root_device ===
+          newValue1.class_name + '_' + newValue1.address
+        )
+      })
+      if (mediatedDevice) {
+        nvidiaGridProfile.value = {
+          text: mediatedDevice.human_readable,
+          value: mediatedDevice.profile_name + '_' + mediatedDevice.root_device,
+        }
+
+        selectedType.value =
+          pciDeviceTypeOptions.value.find(
+            (option) => option.value === 'nvidia_grid'
+          ) || selectedType.value
+      }
     }
-
-    selectedType.value =
-      pciDeviceTypeOptions.value.find(
-        (option) => option.value === 'nvidia_grid'
-      ) || selectedType.value
-  }
-}
-watch(
-  () => props.mediatedDevices,
-  () => {
-    setData() // for edit
   },
   { immediate: true, deep: true }
 )
@@ -192,12 +190,7 @@ const sendData = computed<UI_I_SendDataNewPciDevice>(() => {
 watch(
   sendData,
   (newValue) => {
-    address.value = newValue.address
-    vendorName.value = newValue.vendor_name
-    className.value = newValue.class_name
-    deviceName.value = newValue.device_name
-    mediatedDevice.value = newValue.mediated_device
-    mediatedDeviceUuid.value = newValue.mediated_device_uuid || ''
+    emits('send-data', props.type === 'edit' ? props.pciDevice : newValue)
   },
   { immediate: true }
 )

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/Old.vue

@@ -56,7 +56,6 @@
 </template>
 
 <script setup lang="ts">
-import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
 import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
 import type { UI_T_PciDeviceType } from '~/components/common/vm/actions/common/customizeHardware/virtualHardware/lib/models/types'
 import type {
@@ -67,13 +66,13 @@ import type {
 const selectedType = defineModel<UI_I_OptionItem>('selectedType', {
   required: true,
 })
-const directPathIo = defineModel<string>('directPathIo', {
+const directPathIo = defineModel<UI_I_PciDevice>('directPathIo', {
   required: true,
 })
-const dynamicDirectPathIo = defineModel<UI_I_PciDevice>('dynamicDirectPathIo', {
+const dynamicDirectPathIo = defineModel<string>('dynamicDirectPathIo', {
   required: true,
 })
-const nvidiaGridProfile = defineModel<UI_I_Option | null>('nvidiaGridProfile', {
+const nvidiaGridProfile = defineModel<string>('nvidiaGridProfile', {
   required: true,
 })
 
@@ -92,4 +91,8 @@ const emits = defineEmits<{
 }>()
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+#network-connect {
+  margin-right: 4px;
+}
+</style>

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/DirectPathIo.vue

@@ -7,7 +7,9 @@
 </template>
 
 <script lang="ts" setup>
-const model = defineModel<string>({ required: true })
+import type { UI_I_ConfigureAllPciDevicesItem } from '~/lib/models/store/host/interfaces'
+
+const model = defineModel<UI_I_ConfigureAllPciDevicesItem>({ required: true })
 
 const props = defineProps<{
   pciDeviceIndex: number

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/New.vue

@@ -1,7 +1,7 @@
 <template>
   <ui-stack-block
-    :has-children="false"
-    :test-id="`pci-device-direct-path-io-stack-block-${props.pciDeviceIndex}`"
+      :has-children="false"
+      :test-id="`pci-device-direct-path-io-stack-block-${props.pciDeviceIndex}`"
   >
     <template #stackBlockKey>
       {{ localization.common.pciDevice }}

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/directPathIo/Old.vue

@@ -1,8 +1,8 @@
 <template>
   <div>
     <atoms-stack-block
-      :has-children="false"
-      :test-id="`pci-device-direct-path-io-stack-block-${props.pciDeviceIndex}`"
+        :has-children="false"
+        :test-id="`pci-device-direct-path-io-stack-block-${props.pciDeviceIndex}`"
     >
       <template #stackBlockContent>
         <input

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/DynamicDirectPathIo.vue

@@ -10,7 +10,7 @@
 <script lang="ts" setup>
 import type { UI_I_PciDevice } from '~/lib/models/store/vm/interfaces'
 
-const model = defineModel<UI_I_PciDevice>({ required: true })
+const model = defineModel<string>({ required: true })
 
 const props = defineProps<{
   pciDeviceIndex: number

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/New.vue

@@ -21,9 +21,10 @@
 
 <script lang="ts" setup>
 import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_ConfigureAllPciDevicesItem } from '~/lib/models/store/host/interfaces'
 import type { UI_I_PciDevice } from '~/lib/models/store/vm/interfaces'
 
-const model = defineModel<UI_I_PciDevice>()
+const model = defineModel<UI_I_ConfigureAllPciDevicesItem>()
 
 const props = defineProps<{
   pciDeviceIndex: number

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/dynamicDirectPathIo/Old.vue

@@ -28,9 +28,10 @@
 
 <script lang="ts" setup>
 import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_ConfigureAllPciDevicesItem } from '~/lib/models/store/host/interfaces'
 import type { UI_I_PciDevice } from '~/lib/models/store/vm/interfaces'
 
-const model = defineModel<UI_I_PciDevice>()
+const model = defineModel<UI_I_ConfigureAllPciDevicesItem>()
 
 const props = defineProps<{
   pciDeviceIndex: number

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/New.vue

@@ -27,7 +27,7 @@
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
 
-const model = defineModel<UI_I_Option | null>({ required: true })
+const model = defineModel<string>({ required: true })
 
 const props = defineProps<{
   options: UI_I_Option[]

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/NvidiaGrid.vue

@@ -11,7 +11,7 @@
 import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
 import type { UI_I_MediatedDevice } from '~/lib/models/store/vm/interfaces'
 
-const model = defineModel<UI_I_Option | null>({ required: true })
+const model = defineModel<string>({ required: true })
 
 const props = defineProps<{
   pciDeviceIndex: number

package/components/common/vm/actions/common/customizeHardware/virtualHardware/newPciDevice/nvidiaGrid/Old.vue

@@ -42,7 +42,7 @@
 import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_Option } from '~/components/atoms/select/lib/models/interfaces'
 
-const model = defineModel<UI_I_Option | null>({ required: true })
+const model = defineModel<string>({ required: true })
 
 const props = defineProps<{
   options: UI_I_Option[]

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

@@ -27,7 +27,7 @@
       :state="props.state"
       @remove-error-by-title="emits('remove-error-by-title', $event)"
     />
-    <div class="vm-hardware-version-wrap justify-end flex flex-1 mt-1">
+    <div class="vm-hardware-version-wrap justify-end flex flex-1 mt-4">
       <span class="vm-hardware-version">
         {{ props.compatibilityInfo }}
       </span>
@@ -73,7 +73,7 @@ const emits = defineEmits<{
   flex-direction: column;
   gap: 12px;
   margin-top: 20px;
-  padding: 0 0 16px;
+  padding: 0 0 12px;
   overflow: auto;
 
   .vm-hardware-version-wrap {

package/components/common/vm/actions/common/select/compatibility/New.vue

@@ -172,6 +172,7 @@ const versionsLocal = computed(() => {
   @container (max-width: 600px) {
     .version-select-wrap {
       grid-template-columns: 1fr;
+      padding-bottom: 16px;
     }
   }
 }

package/components/common/vm/actions/common/select/options/Old.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="select-options">
     <div
-      v-if="!props.isNewVmFromTemplate"
+      v-show="!props.isNewVmFromTemplate"
       :class="['checkbox', { disabled: props.isNewVmFromTemplate }]"
     >
       <input
@@ -28,6 +28,7 @@
       }}</label>
     </div>
     <div class="checkbox">
+      <!--      :disabled="props.isNewVmFromTemplate"-->
       <input
         id="power-on"
         v-model="modelValue"

package/components/common/vm/actions/common/select/storage/new/New.vue

@@ -221,7 +221,7 @@ const skeletonData = ref<UI_I_DataTableSkeleton>({
 //}
 .select-storage {
   padding-top: 12px;
-  padding-bottom: 16px;
+  //padding-bottom: 16px;
 
   :deep(.title-sm) {
     font-size: 12px;

package/components/common/wizards/common/compatibility/New.vue

@@ -3,7 +3,7 @@
     <p class="compatibility">
       {{ localization.inventorySummary.compatibility }}
     </p>
-    <div class="compatibility-message flex-align-start" data-id="compatibility-message">
+    <div class="compatibility-message flex-align-start">
       <ui-skeleton-item v-if="props.loading" width="160px" height="16px" />
       <template v-else-if="props.text">
         <ui-icon

package/components/common/wizards/common/compatibility/Old.vue

@@ -3,7 +3,7 @@
     <p class="compatibility__title">
       {{ localization.inventorySummary.compatibility }}
     </p>
-    <div class="flex-align-center compatibility__content" data-id="compatibility-message">
+    <div class="flex-align-center compatibility__content">
       <template v-if="props.text">
         <div class="compatibility__message">
           <div v-show="iconStatus" :class="['icon', iconStatus]" />

package/components/common/wizards/common/steps/computeResource/New.vue

@@ -52,16 +52,8 @@ const onSelectNode = (node: UI_I_TreeNode): void => emits('select-node', node)
 <style scoped lang="scss">
 @import 'assets/scss/common/mixins.scss';
 .compute-resource {
-  display: grid;
-  grid-template-rows: 1fr auto;
-  min-height: 100%;
-  padding-top: 16px;
-  padding-bottom: 16px;
-  grid-row-gap: 24px;
-
   &__container-tree {
-    max-height: 240px;
-    height: 100%;
+    height: 240px;
     background: var(--input-bg);
     border: 1px solid var(--line-color);
     border-radius: 8px;