proxmox-mirrors/pve-manager
1
0
Fork 0
mirror of https://git.proxmox.com/git/pve-manager synced 2025-08-09 14:37:56 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

ui: storage: iSCSI panel: modernize, cleanup & improve UX

Browse Source 
using cbind + pmxDisplayEditField, getting rid of initComponent

Disables the target selector until a portal is entered. For this, we
currently cannot use the pmxDisplayEditField, since that
disabled/enables the fields automatically based on 'editable'.

Also setting buffer for the portal entry change handler to 500ms (so that
we don't query the backend that often)

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
This commit is contained in:
Dominik Csapak 2023-01-18 14:13:01 +01:00 committed by Thomas Lamprecht
parent fa84bd595f
commit df60e210d7
1 changed files with 51 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
www/manager6/storage/IScsiEdit.js
View File

@ -71,6 +71,7 @@ Ext.define('PVE.storage.IScsiScan', {
Ext.define('PVE.storage.IScsiInputPanel', { Ext.define('PVE.storage.IScsiInputPanel', {
extend: 'PVE.panel.StorageBase', extend: 'PVE.panel.StorageBase',
mixins: ['Proxmox.Mixin.CBind'],
onlineHelp: 'storage_open_iscsi', onlineHelp: 'storage_open_iscsi',
@ -88,50 +89,61 @@ Ext.define('PVE.storage.IScsiInputPanel', {
this.callParent([values]); this.callParent([values]);
}, },
initComponent: function() { column1: [
let me = this; {
xtype: 'pmxDisplayEditField',
cbind: {
editable: '{isCreate}',
},
me.column1 = [ name: 'portal',
{ value: '',
xtype: me.isCreate ? 'textfield' : 'displayfield', fieldLabel: 'Portal',
name: 'portal', allowBlank: false,
value: '',
fieldLabel: 'Portal', editConfig: {
allowBlank: false,
listeners: { listeners: {
change: function(f, value) { change: {
if (me.isCreate) { fn: function(f, value) {
let exportField = me.down('field[name=target]'); let panel = this.up('inputpanel');
exportField.setPortal(value); let exportField = panel.lookup('iScsiTargetScan');
exportField.setValue(''); if (exportField) {
} exportField.setDisabled(!value);
exportField.setPortal(value);
exportField.setValue('');
}
},
buffer: 500,
}, },
}, },
}, },
Ext.createWidget(me.isCreate ? 'pveIScsiScan' : 'displayfield', { },
readOnly: !me.isCreate, {
name: 'target', cbind: {
value: '', xtype: (get) => get('isCreate') ? 'pveIScsiScan' : 'displayfield',
fieldLabel: gettext('Target'), readOnly: '{!isCreate}',
allowBlank: false, disabled: '{isCreate}',
reference: 'iScsiTargetScan',
listeners: {
nodechanged: function(value) {
me.lookup('storageNodeRestriction').setValue(value);
},
},
}),
];
me.column2 = [
{
xtype: 'checkbox',
name: 'luns',
checked: true,
fieldLabel: gettext('Use LUNs directly'),
}, },
];
me.callParent(); name: 'target',
}, value: '',
fieldLabel: gettext('Target'),
allowBlank: false,
reference: 'iScsiTargetScan',
listeners: {
nodechanged: function(value) {
this.up('inputpanel').lookup('storageNodeRestriction').setValue(value);
},
},
},
],
column2: [
{
xtype: 'checkbox',
name: 'luns',
checked: true,
fieldLabel: gettext('Use LUNs directly'),
},
],
}); });