pve-manager/www/manager6/storage/LvmThinEdit.js
Dominik Csapak 2d9be15856 ui: lvm-thin: fix not being able to edit the storage
The change handler of the edit config from a displayEditField still
triggers, even if hidden and disabled. This then enables another
editConfig part of a displayEditField, which triggers an error in the
API.

To fix that, simply check if this field is disabled before setting
the other fields value

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
2023-03-21 10:29:18 +01:00

187 lines
3.3 KiB
JavaScript

Ext.define('PVE.storage.TPoolSelector', {
extend: 'PVE.form.ComboBoxSetStoreNode',
alias: 'widget.pveTPSelector',
queryParam: 'vg',
valueField: 'lv',
displayField: 'lv',
editable: false,
allowBlank: false,
listConfig: {
emptyText: PVE.Utils.renderNotFound('Thin-Pool'),
columns: [
{
dataIndex: 'lv',
flex: 1,
},
],
},
config: {
apiSuffix: '/scan/lvmthin',
},
reload: function() {
let me = this;
if (!me.isDisabled()) {
me.getStore().load();
}
},
setVG: function(myvg) {
let me = this;
me.vg = myvg;
me.getStore().getProxy().setExtraParams({ vg: myvg });
me.reload();
},
setNodeName: function(value) {
let me = this;
me.callParent([value]);
me.reload();
},
initComponent: function() {
let me = this;
if (!me.nodename) {
me.nodename = 'localhost';
}
let store = Ext.create('Ext.data.Store', {
fields: ['lv'],
proxy: {
type: 'proxmox',
url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
},
});
store.sort('lv', 'ASC');
Ext.apply(me, {
store: store,
});
me.callParent();
},
});
Ext.define('PVE.storage.BaseVGSelector', {
extend: 'PVE.form.ComboBoxSetStoreNode',
alias: 'widget.pveBaseVGSelector',
valueField: 'vg',
displayField: 'vg',
queryMode: 'local',
editable: false,
allowBlank: false,
listConfig: {
columns: [
{
dataIndex: 'vg',
flex: 1,
},
],
},
showNodeSelector: true,
config: {
apiSuffix: '/scan/lvm',
},
setNodeName: function(value) {
let me = this;
me.callParent([value]);
me.getStore().load();
},
initComponent: function() {
let me = this;
if (!me.nodename) {
me.nodename = 'localhost';
}
let store = Ext.create('Ext.data.Store', {
autoLoad: {},
fields: ['vg', 'size', 'free'],
proxy: {
type: 'proxmox',
url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
},
});
Ext.apply(me, {
store: store,
});
me.callParent();
},
});
Ext.define('PVE.storage.LvmThinInputPanel', {
extend: 'PVE.panel.StorageBase',
mixins: ['Proxmox.Mixin.CBind'],
onlineHelp: 'storage_lvmthin',
column1: [
{
xtype: 'pmxDisplayEditField',
cbind: {
editable: '{isCreate}',
},
name: 'vgname',
fieldLabel: gettext('Volume group'),
editConfig: {
xtype: 'pveBaseVGSelector',
listeners: {
nodechanged: function(value) {
let panel = this.up('inputpanel');
panel.lookup('thinPoolSelector').setNodeName(value);
panel.lookup('storageNodeRestriction').setValue(value);
},
change: function(f, value) {
let vgField = this.up('inputpanel').lookup('thinPoolSelector');
if (vgField && !f.isDisabled()) {
vgField.setDisabled(!value);
vgField.setVG(value);
vgField.setValue('');
}
},
},
},
},
{
xtype: 'pmxDisplayEditField',
cbind: {
editable: '{isCreate}',
},
name: 'thinpool',
fieldLabel: gettext('Thin Pool'),
allowBlank: false,
editConfig: {
xtype: 'pveTPSelector',
reference: 'thinPoolSelector',
disabled: true,
},
},
{
xtype: 'pveContentTypeSelector',
cts: ['images', 'rootdir'],
fieldLabel: gettext('Content'),
name: 'content',
value: ['images', 'rootdir'],
multiSelect: true,
allowBlank: false,
},
],
});