mirror of
https://github.com/harvester/harvester-ui-extension.git
synced 2026-10-06 06:06:05 +08:00
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>
This commit is contained in:
@@ -0,0 +1,124 @@
|
||||
<script>
|
||||
import CreateEditView from '@shell/mixins/create-edit-view';
|
||||
import ResourceTabs from '@shell/components/form/ResourceTabs';
|
||||
import Tab from '@shell/components/Tabbed/Tab';
|
||||
import SortableTable from '@shell/components/SortableTable';
|
||||
|
||||
export default {
|
||||
|
||||
components: {
|
||||
ResourceTabs,
|
||||
Tab,
|
||||
SortableTable,
|
||||
},
|
||||
|
||||
mixins: [CreateEditView],
|
||||
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
headers() {
|
||||
return [
|
||||
{
|
||||
name: 'profileName',
|
||||
labelKey: 'harvester.migconfiguration.tableHeaders.profileName',
|
||||
value: 'name',
|
||||
width: 75,
|
||||
sort: 'name',
|
||||
dashIfEmpty: true,
|
||||
},
|
||||
{
|
||||
name: 'vGPUID',
|
||||
labelKey: 'harvester.migconfiguration.tableHeaders.vGPUID',
|
||||
value: 'vGPUID',
|
||||
width: 75,
|
||||
sort: 'vGPUID',
|
||||
dashIfEmpty: true,
|
||||
},
|
||||
{
|
||||
name: 'available',
|
||||
labelKey: 'harvester.migconfiguration.tableHeaders.available',
|
||||
value: 'available',
|
||||
width: 75,
|
||||
sort: 'available',
|
||||
align: 'center',
|
||||
dashIfEmpty: true,
|
||||
},
|
||||
{
|
||||
name: 'requested',
|
||||
labelKey: 'harvester.migconfiguration.tableHeaders.requested',
|
||||
value: 'requested',
|
||||
width: 75,
|
||||
sort: 'requested',
|
||||
align: 'center',
|
||||
dashIfEmpty: true,
|
||||
},
|
||||
{
|
||||
name: 'total',
|
||||
labelKey: 'harvester.migconfiguration.tableHeaders.total',
|
||||
value: 'total',
|
||||
width: 75,
|
||||
sort: 'total',
|
||||
align: 'center',
|
||||
dashIfEmpty: true,
|
||||
},
|
||||
];
|
||||
},
|
||||
|
||||
rows() {
|
||||
let out = (this.value?.status?.profileStatus || []).map((profile) => {
|
||||
const {
|
||||
id, name, total, available
|
||||
} = profile;
|
||||
|
||||
return {
|
||||
id,
|
||||
name,
|
||||
total,
|
||||
available,
|
||||
vGPUID: profile.vGPUID?.join(', ') || '',
|
||||
};
|
||||
});
|
||||
|
||||
out = out.map((row) => {
|
||||
const requested = this.value?.spec?.profileSpec.find((p) => p.id === row.id)?.requested || 0;
|
||||
|
||||
return { ...row, requested };
|
||||
});
|
||||
|
||||
return out;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ResourceTabs
|
||||
:value="value"
|
||||
:need-events="false"
|
||||
:need-related="false"
|
||||
:mode="mode"
|
||||
>
|
||||
<Tab
|
||||
name="Profile Status"
|
||||
:label="t('harvester.migconfiguration.profileStatus')"
|
||||
>
|
||||
<SortableTable
|
||||
:headers="headers"
|
||||
:rows="rows"
|
||||
key-field="condition"
|
||||
default-sort-by="condition"
|
||||
:table-actions="false"
|
||||
:row-actions="false"
|
||||
:search="false"
|
||||
/>
|
||||
</Tab>
|
||||
</ResourceTabs>
|
||||
</template>
|
||||
Reference in New Issue
Block a user