mirror of
https://github.com/harvester/harvester-ui-extension.git
synced 2026-11-15 05:16:16 +08:00
marcelofukumoto
12c28c08fa
* feat: align the storage performance options with the Rancher machine pool form Show the storage performance profile on every volume instead of behind a collapsible toggle, and move the VM-wide options to a plain Storage Performance section in the Advanced Options tab. Put the Native I/O tip in a live region so screen readers announce the cache mode change, use an integer input for the I/O thread count, and use the same copy as the Rancher form. Skip the view-only backup row in the image and container volumes when it has nothing to show, so it no longer adds an empty gap above the profile. Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com> * fix: announce the storage performance warnings and name the virtio requirement - Put the bus tip and the Filesystem warning in an always-rendered status region. They appear above the field being changed, so screen readers need them announced. - Say in the bus tip that a dedicated I/O thread needs the virtio bus, because KubeVirt rejects it on any other bus. - Mark I/O Thread Count as required while editing, like the Rancher form. Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com> * fix: state only the dedicated I/O thread requirement in the bus tip Neither the Harvester docs nor KubeVirt tie cache mode or I/O mode to the bus, so stop saying that those options work best on virtio. Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com> --------- Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
151 lines
4.3 KiB
Vue
151 lines
4.3 KiB
Vue
<script>
|
|
import LabeledSelect from '@shell/components/form/LabeledSelect';
|
|
import { LabeledInput } from '@components/Form/LabeledInput';
|
|
import { Checkbox } from '@components/Form/Checkbox';
|
|
import { Banner } from '@components/Banner';
|
|
import { _VIEW } from '@shell/config/query-params';
|
|
import { IO_THREADS_POLICY } from '../../../config/harvester-map';
|
|
|
|
export default {
|
|
name: 'VMPerformanceOptions',
|
|
|
|
components: {
|
|
LabeledSelect, LabeledInput, Checkbox, Banner
|
|
},
|
|
|
|
emits: ['update:blockMultiQueue', 'update:ioThreadsPolicy', 'update:ioThreadCount'],
|
|
|
|
props: {
|
|
blockMultiQueue: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
|
|
ioThreadsPolicy: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
|
|
ioThreadCount: {
|
|
type: Number,
|
|
default: 2
|
|
},
|
|
|
|
mode: {
|
|
type: String,
|
|
default: 'create'
|
|
},
|
|
|
|
// Whether the current disk set contains a virtio disk (VM context only).
|
|
hasVirtioDisk: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
|
|
// Whether any disk requests a dedicated I/O thread (drives the auto-enable hint).
|
|
hasDedicatedIothread: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
},
|
|
|
|
computed: {
|
|
isView() {
|
|
return this.mode === _VIEW;
|
|
},
|
|
|
|
storagePerformanceEnabled() {
|
|
return this.$store.getters['harvester-common/getFeatureEnabled']('highPerformanceStorage');
|
|
},
|
|
|
|
ioThreadsPolicyOptions() {
|
|
return IO_THREADS_POLICY.map((value) => ({
|
|
label: value === '' ? this.t('harvester.virtualMachine.volume.diskPerformance.ioThreadsPolicy.default') : this.t(`harvester.virtualMachine.volume.diskPerformance.ioThreadsPolicy.${ value }`),
|
|
value,
|
|
}));
|
|
},
|
|
},
|
|
|
|
watch: {
|
|
// Block Multi-Queue only applies to virtio disks. If the last virtio disk is
|
|
// removed while it is enabled, clear it so the VM is not left with an invalid
|
|
// setting the disabled checkbox can no longer surface.
|
|
hasVirtioDisk(neu) {
|
|
if (!neu && this.blockMultiQueue) {
|
|
this.$emit('update:blockMultiQueue', false);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
v-if="storagePerformanceEnabled && (!isView || blockMultiQueue || !!ioThreadsPolicy)"
|
|
class="vm-perf"
|
|
>
|
|
<h3>
|
|
{{ t('harvester.virtualMachine.volume.diskPerformance.title') }}
|
|
</h3>
|
|
<p class="text-muted mb-10">
|
|
{{ t('harvester.virtualMachine.volume.diskPerformance.description') }}
|
|
</p>
|
|
|
|
<div
|
|
class="mb-10"
|
|
data-testid="input-vm-block-multi-queue"
|
|
>
|
|
<Checkbox
|
|
:value="blockMultiQueue"
|
|
:label="t('harvester.virtualMachine.volume.diskPerformance.blockMultiQueue.label')"
|
|
:tooltip="t('harvester.virtualMachine.volume.diskPerformance.blockMultiQueue.tip')"
|
|
:mode="mode"
|
|
:disabled="!hasVirtioDisk"
|
|
@update:value="$emit('update:blockMultiQueue', $event)"
|
|
/>
|
|
</div>
|
|
<Banner
|
|
v-if="!hasVirtioDisk && !isView"
|
|
color="info"
|
|
label-key="harvester.virtualMachine.volume.diskPerformance.blockMultiQueue.noVirtioTip"
|
|
/>
|
|
|
|
<div class="row mb-20">
|
|
<div
|
|
class="col span-6"
|
|
data-testid="input-vm-iothreads-policy"
|
|
>
|
|
<LabeledSelect
|
|
:value="ioThreadsPolicy"
|
|
:label="t('harvester.virtualMachine.volume.diskPerformance.ioThreadsPolicy.label')"
|
|
:tooltip="t('harvester.virtualMachine.volume.diskPerformance.ioThreadsPolicy.tip')"
|
|
:options="ioThreadsPolicyOptions"
|
|
:mode="mode"
|
|
@update:value="$emit('update:ioThreadsPolicy', $event)"
|
|
/>
|
|
</div>
|
|
<div
|
|
v-if="ioThreadsPolicy === 'supplementalPool'"
|
|
class="col span-6"
|
|
data-testid="input-vm-iothread-count"
|
|
>
|
|
<LabeledInput
|
|
type="integer"
|
|
min="1"
|
|
:required="!isView"
|
|
:value="ioThreadCount"
|
|
:label="t('harvester.virtualMachine.volume.diskPerformance.ioThreadCount.label')"
|
|
:tooltip="t('harvester.virtualMachine.volume.diskPerformance.ioThreadCount.tip')"
|
|
:mode="mode"
|
|
@update:value="$emit('update:ioThreadCount', Number($event))"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<Banner
|
|
v-if="hasDedicatedIothread && !ioThreadsPolicy"
|
|
color="info"
|
|
label-key="harvester.virtualMachine.volume.diskPerformance.ioThreadsPolicy.autoEnabledTip"
|
|
/>
|
|
</div>
|
|
</template>
|