[pve-devel] [PATCH manager v7 04/14] ui: form: add PCIMapSelector
Dominik Csapak
d.csapak at proxmox.com
Fri Jun 16 15:05:31 CEST 2023
akin to the PCISelector, but uses the api for mapped devices
Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
www/manager6/Makefile | 1 +
www/manager6/form/PCIMapSelector.js | 112 ++++++++++++++++++++++++++++
2 files changed, 113 insertions(+)
create mode 100644 www/manager6/form/PCIMapSelector.js
diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index 9b6dd13b..8de983aa 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -49,6 +49,7 @@ JSSRC= \
form/NetworkCardSelector.js \
form/NodeSelector.js \
form/PCISelector.js \
+ form/PCIMapSelector.js \
form/PermPathSelector.js \
form/PoolSelector.js \
form/PreallocationSelector.js \
diff --git a/www/manager6/form/PCIMapSelector.js b/www/manager6/form/PCIMapSelector.js
new file mode 100644
index 00000000..3ded65dc
--- /dev/null
+++ b/www/manager6/form/PCIMapSelector.js
@@ -0,0 +1,112 @@
+Ext.define('pve-mapped-pci-model', {
+ extend: 'Ext.data.Model',
+
+ fields: ['id', 'path', 'vendor', 'device', 'iommugroup', 'mdev', 'description', 'map'],
+ idProperty: 'id',
+});
+
+Ext.define('PVE.form.PCIMapSelector', {
+ extend: 'Proxmox.form.ComboGrid',
+ xtype: 'pvePCIMapSelector',
+
+ store: {
+ model: 'pve-mapped-pci-model',
+ filterOnLoad: true,
+ sorters: [
+ {
+ property: 'id',
+ direction: 'ASC',
+ },
+ ],
+ },
+
+ autoSelect: false,
+ valueField: 'id',
+ displayField: 'id',
+
+ // can contain a load callback for the store
+ // useful to determine the state of the IOMMU
+ onLoadCallBack: undefined,
+
+ listConfig: {
+ width: 800,
+ columns: [
+ {
+ header: gettext('ID'),
+ dataIndex: 'id',
+ flex: 1,
+ },
+ {
+ header: gettext('Description'),
+ dataIndex: 'description',
+ flex: 1,
+ },
+ {
+ header: gettext('Status'),
+ dataIndex: 'errors',
+ renderer: function(value) {
+ let me = this;
+
+ if (!Ext.isArray(value) || !value?.length) {
+ return `<i class="fa fa-check-circle good"></i> ${gettext('Mapping OK')}`;
+ }
+
+ let errors = [];
+
+ value.forEach((error) => {
+ let iconCls;
+ switch (error?.severity) {
+ case 'warning':
+ iconCls = 'fa-exclamation-circle warning';
+ break;
+ case 'error':
+ iconCls = 'fa-times-circle critical';
+ break;
+ }
+
+ let message = error?.message;
+ let icon = `<i class="fa ${iconCls}"></i>`;
+ if (iconCls !== undefined) {
+ errors.push(`${icon} ${message}`);
+ }
+ });
+
+ return errors.join('<br>');
+ },
+ flex: 3,
+ },
+ ],
+ },
+
+ setNodename: function(nodename) {
+ var me = this;
+
+ if (!nodename || me.nodename === nodename) {
+ return;
+ }
+
+ me.nodename = nodename;
+
+ me.store.setProxy({
+ type: 'proxmox',
+ url: `/api2/json/cluster/mapping/pci?check-node=${nodename}`,
+ });
+
+ me.store.load();
+ },
+
+ initComponent: function() {
+ var me = this;
+
+ var nodename = me.nodename;
+ me.nodename = undefined;
+
+ me.callParent();
+
+ if (me.onLoadCallBack !== undefined) {
+ me.mon(me.getStore(), 'load', me.onLoadCallBack);
+ }
+
+ me.setNodename(nodename);
+ },
+});
--
2.30.2
More information about the pve-devel
mailing list