From f1b000c4ecba0736e26d75ccee2bb2e00c26577a Mon Sep 17 00:00:00 2001 From: Joris-K Date: Mon, 6 Jan 2025 10:48:59 +0100 Subject: [PATCH] add sr and vdi stores --- .../lite/src/libs/xen-api/xen-api.types.ts | 4 +- @xen-orchestra/lite/src/locales/en.json | 18 ++ @xen-orchestra/lite/src/locales/fr.json | 4 + .../lite/src/stores/xen-api/sr.store.ts | 42 ++- .../lite/src/stores/xen-api/vdi.store.ts | 9 + .../lite/src/views/new-vm/NewVmView.vue | 274 ++++++++++++++++-- .../ui/radio-button/UiRadioButton.vue | 4 +- 7 files changed, 324 insertions(+), 31 deletions(-) create mode 100644 @xen-orchestra/lite/src/stores/xen-api/vdi.store.ts diff --git a/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts b/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts index e81ad207d10..d63e4151229 100644 --- a/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts +++ b/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts @@ -43,7 +43,7 @@ import type { VTPM_OPERATION, VUSB_OPERATION, } from '@/libs/xen-api/xen-api.enums' -import type { XEN_API_OBJECT_TYPES } from '@/libs/xen-api/xen-api.utils' +import type {XEN_API_OBJECT_TYPES} from '@/libs/xen-api/xen-api.utils' type TypeMapping = typeof XEN_API_OBJECT_TYPES export type ObjectType = keyof TypeMapping @@ -118,9 +118,11 @@ export interface XenApiHost extends XenApiRecord<'host'> { export interface XenApiSr extends XenApiRecord<'sr'> { content_type: string name_label: string + VDIs: XenApiVdi['$ref'][] physical_size: number physical_utilisation: number shared: boolean + type: string sm_config: { type?: string } diff --git a/@xen-orchestra/lite/src/locales/en.json b/@xen-orchestra/lite/src/locales/en.json index 8b95b1b65c3..c1ff2d9b55c 100644 --- a/@xen-orchestra/lite/src/locales/en.json +++ b/@xen-orchestra/lite/src/locales/en.json @@ -191,9 +191,27 @@ "new-vm.add": "Add new VM", "new-vm.create": "Create VM", "new-vm.template": "Template", + "new-vm.pick-template": "Pick a template from your list", "new-vm.install-settings": "Install settings", + "new-vm.interfaces": "Interfaces", + "new-vm.mac-addresses": "Mac addresses", + "new-vm.storage-repositories": "Storage repositories (SR)", + "new-vm.disk-name": "Disk name", + "new-vm.size": "Size", + "new-vm.description": "Description", + "new-vm.network": "Network", + "new-vm.storage": "Storage", + "new-vm.settings": "Settings", + "new-vm.summary": "Summary", "new-vm.iso-dvd": "ISO/DVD", + "new-vm.boot-vm": "Boot VM after creation", + "new-vm.auto-power": "Auto power-on", + "new-vm.fast-clone": "Fast clone", "new-vm.pxe": "PXE", + "new-vm.ram": "Ram", + "new-vm.new": "New", + "new-vm.typology": "Typology", + "new-vm.vcpu": "Vcpu", "new-vm.no-config": "No config", "new-vm.user-config": "User configuration", "new-vm.network-config": "Network configuration", diff --git a/@xen-orchestra/lite/src/locales/fr.json b/@xen-orchestra/lite/src/locales/fr.json index 6dd3d4f6fe2..a431c64a2e5 100644 --- a/@xen-orchestra/lite/src/locales/fr.json +++ b/@xen-orchestra/lite/src/locales/fr.json @@ -189,6 +189,10 @@ "new-vm": "Nouvelle VM", "new-vm.add": "Ajouter une nouvelle VM", + "new-vm.pick-template": "Choisissez un modèle dans votre liste", + "new-vm.ram": "Ram", + "new-vm.typology": "Typologie", + "new-vm.vcpu": "Vcpu", "new-vm.create": "Créer une VM", "new-vm.template": "Modèle", "new-vm.install-settings": "Paramètres d'installation", diff --git a/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts b/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts index 769019f1fe4..e4d79e82238 100644 --- a/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts +++ b/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts @@ -1,9 +1,47 @@ +import type { XenApiSr } from '@/libs/xen-api/xen-api.types' import { createXapiStoreConfig } from '@/stores/xen-api/create-xapi-store-config' +import { useVdiStore } from '@/stores/xen-api/vdi.store' import { createSubscribableStoreContext } from '@core/utils/create-subscribable-store-context.util' import { defineStore } from 'pinia' +import { computed } from 'vue' export const useSrStore = defineStore('xen-api-sr', () => { - const config = createXapiStoreConfig('sr') + const deps = { + vdiStore: useVdiStore(), + } - return createSubscribableStoreContext(config, {}) + const vdiContext = deps.vdiStore.getContext() + + const { context: baseContext, ...configRest } = createXapiStoreConfig('sr') + + const srs = computed(() => baseContext.records.value) + const srsName = (ref: XenApiSr['$ref']) => baseContext.getByOpaqueRef(ref)?.name_label + + const getSrWithISO = computed(() => srs.value.filter(sr => sr.type === 'iso')) + + const concatVidsArray = computed(() => getSrWithISO.value.flatMap(sr => sr.VDIs || [])) + + const vdisGroupedBySrName = computed(() => { + const groupedVdis: Record = {} + + concatVidsArray.value.forEach(vdiRef => { + const vdi = vdiContext.getByOpaqueRef(vdiRef) + if (vdi) { + const srName = srsName(vdi.SR) || 'Unknown SR' + if (!groupedVdis[srName]) { + groupedVdis[srName] = [] + } + groupedVdis[srName].push(vdi) + } + }) + + return groupedVdis + }) + + const context = { + ...baseContext, + vdisGroupedBySrName, + } + + return createSubscribableStoreContext({ context, ...configRest }, deps) }) diff --git a/@xen-orchestra/lite/src/stores/xen-api/vdi.store.ts b/@xen-orchestra/lite/src/stores/xen-api/vdi.store.ts new file mode 100644 index 00000000000..9d30d7b06e4 --- /dev/null +++ b/@xen-orchestra/lite/src/stores/xen-api/vdi.store.ts @@ -0,0 +1,9 @@ +import { createXapiStoreConfig } from '@/stores/xen-api/create-xapi-store-config' +import { createSubscribableStoreContext } from '@core/utils/create-subscribable-store-context.util' +import { defineStore } from 'pinia' + +export const useVdiStore = defineStore('xen-api-vdi', () => { + const config = createXapiStoreConfig('vdi') + + return createSubscribableStoreContext(config, {}) +}) diff --git a/@xen-orchestra/lite/src/views/new-vm/NewVmView.vue b/@xen-orchestra/lite/src/views/new-vm/NewVmView.vue index fa37014ec02..a322162909f 100644 --- a/@xen-orchestra/lite/src/views/new-vm/NewVmView.vue +++ b/@xen-orchestra/lite/src/views/new-vm/NewVmView.vue @@ -5,37 +5,55 @@ {{ $t('new-vm.template') }} - - - +
+

{{ $t('new-vm.pick-template') }}

+ + + +
{{ $t('new-vm.install-settings') }}
- {{ $t('new-vm.iso-dvd') }} - {{ $t('new-vm.pxe') }} - - - - - +
+ {{ $t('new-vm.iso-dvd') }} + {{ $t('new-vm.pxe') }} +
+ +
- {{ $t('new-vm.no-config') }} - {{ $t('new-vm.ssh-key') }} - - {{ $t('new-vm.custom-config') }} - - -
- {{ ssh_key }} - - {{ $t('add') }} +
+ + {{ $t('new-vm.no-config') }} + + {{ $t('new-vm.ssh-key') }} + + {{ $t('new-vm.custom-config') }} +
- -
+
+
+ + {{ key }} + +
+
+ + + {{ $t('add') }} + +
+
+
{{ $t('new-vm.user-config') }} @@ -60,7 +78,119 @@
{{ $t('new-vm.memory') }} -
+
+ {{ $t('new-vm.vcpu') }} + {{ $t('new-vm.ram') }} + {{ $t('new-vm.typology') }} +
+ {{ $t('new-vm.network') }} +
+ + + + {{ $t('new-vm.interfaces') }} + {{ $t('new-vm.mac-addresses') }} + + + + + + + + + + + + + + + + + + + {{ $t('new-vm.new') }} + + + + + +
+ {{ $t('new-vm.storage') }} +
+ + + + {{ $t('new-vm.storage-repositories') }} + {{ $t('new-vm.disk-name') }} + {{ $t('new-vm.size') }} + {{ $t('new-vm.description') }} + + + + + + + + + + + + + + + + + + + + + + + + + {{ $t('new-vm.new') }} + + + + + +
+ {{ $t('new-vm.settings') }} +
+ + {{ $t('new-vm.boot-vm') }} + {{ $t('new-vm.auto-power') }} + {{ $t('new-vm.fast-clone') }} + +
+ {{ $t('new-vm.summary') }} +
+ + + + + + + +
{{ $t('cancel') }} @@ -74,31 +204,96 @@ @@ -119,6 +314,31 @@ watchEffect(() => {}) } } +.install-radio-container { + display: flex; + gap: 15rem; +} + +.install-chips { + display: flex; + gap: 0.5rem; +} + +.install-ssh-key { + display: flex; + align-items: center; + gap: 0.5rem; +} + +.memory-container { + display: flex; + gap: 10.8rem; +} + +thead tr th { + width: 4rem; +} + .footer { display: flex; justify-content: center; diff --git a/@xen-orchestra/web-core/lib/components/ui/radio-button/UiRadioButton.vue b/@xen-orchestra/web-core/lib/components/ui/radio-button/UiRadioButton.vue index e3b397af5ea..06b8ebaebd7 100644 --- a/@xen-orchestra/web-core/lib/components/ui/radio-button/UiRadioButton.vue +++ b/@xen-orchestra/web-core/lib/components/ui/radio-button/UiRadioButton.vue @@ -27,7 +27,7 @@ const props = withDefaults( disabled: undefined, } ) -const model = defineModel() +const model = defineModel() defineSlots<{ default(): any @@ -60,6 +60,7 @@ const isDisabled = useContext(DisabledContext, () => props.disabled) &:has(input:focus-visible) { outline: none; + &::after { position: absolute; content: ''; @@ -68,6 +69,7 @@ const isDisabled = useContext(DisabledContext, () => props.disabled) border-radius: 0.4rem; } } + &:has(.input:disabled) { cursor: not-allowed;