feat: add vGPU MIG Configuration page (#576)

* feat: add vGPU MIGConfiguration page Signed-off-by: Andy Lee <andy.lee@suse.com> * feat: add detail page Signed-off-by: Andy Lee <andy.lee@suse.com> * feat: add banner Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: allow editConfig when status is empty Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: remove unneeded code Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: only show disable action if MIGConfig is enabled Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: some UI flow changes Signed-off-by: Andy Lee <andy.lee@suse.com> * feat: show configured profile in table Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: show configured profiles with requested count Signed-off-by: Andy Lee <andy.lee@suse.com> * refactor: based on review Signed-off-by: Andy Lee <andy.lee@suse.com> --------- Signed-off-by: Andy Lee <andy.lee@suse.com>
2026-10-01 03:36:04 +08:00 · 2025-11-04 13:32:30 +08:00
parent b4980a51e7
commit 6f90cae482
7 changed files with 600 additions and 1 deletions
@@ -0,0 +1,116 @@
+import SteveModel from '@shell/plugins/steve/steve-class';
+import { escapeHtml } from '@shell/utils/string';
+import { colorForState } from '@shell/plugins/dashboard-store/resource-class';
+
+/**
+ * Class representing vGPU MIGConfiguration resource.
+ * @extends SteveModal
+ */
+export default class MIGCONFIGURATION extends SteveModel {
+  get _availableActions() {
+    let out = super._availableActions;
+
+    out = out.map((action) => {
+      if (action.action === 'showConfiguration') {
+        return { ...action, enabled: !this.spec.enabled };
+      } else if (action.action === 'goToEditYaml') {
+        return { ...action, enabled: !this.spec.enabled };
+      } else if (action.action === 'goToEdit') {
+        // need to wait for status to be disabled or empty value, then allow user to editConfig
+        return { ...action, enabled: !this.spec.enabled && ['disabled', ''].includes(this.configStatus) };
+      } else {
+        return action;
+      }
+    });
+
+    out.push(
+      {
+        action:  'enableConfig',
+        enabled: !this.isEnabled,
+        icon:    'icon icon-fw icon-dot',
+        label:   'Enable',
+      },
+      {
+        action:  'disableConfig',
+        enabled: this.isEnabled,
+        icon:    'icon icon-fw icon-dot-open',
+        label:   'Disable',
+      },
+    );
+
+    return out;
+  }
+
+  get canYaml() {
+    return false;
+  }
+
+  get disableResourceDetailDrawer() {
+    return true;
+  }
+
+  get canDelete() {
+    return false;
+  }
+
+  get configStatus() {
+    return this.status.status;
+  }
+
+  get actualState() {
+    return this.isEnabled ? 'Enabled' : 'Disabled';
+  }
+
+  get stateDisplay() {
+    return this.actualState;
+  }
+
+  get stateColor() {
+    const state = this.actualState;
+
+    return colorForState(state);
+  }
+
+  get isEnabled() {
+    return this.spec.enabled;
+  }
+
+  get configuredProfiles() {
+    const configuredProfiles = this.spec?.profileSpec?.filter((p) => p.requested > 0) || [];
+
+    if (configuredProfiles.length === 0) {
+      return '';
+    }
+
+    return configuredProfiles
+      .map((profile) => `${ profile.name } * ${ profile.requested }`)
+      .join(', ');
+  }
+
+  async enableConfig() {
+    try {
+      this.spec.enabled = true;
+      await this.save();
+    } catch (err) {
+      this.$dispatch('growl/fromError', {
+        title: this.t('generic.notification.title.error', { name: escapeHtml(this.name) }),
+        err,
+      }, { root: true });
+    }
+  }
+
+  async disableConfig() {
+    const { enabled: currentEnabled } = this.spec;
+
+    try {
+      this.spec.enabled = false;
+      await this.save();
+    } catch (err) {
+      this.spec.enabled = currentEnabled;
+      this.$dispatch('growl/fromError', {
+        title: this.t('generic.notification.title.error', { name: escapeHtml(this.name) }),
+        err,
+      }, { root: true });
+    }
+  }
+}