From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: <d.csapak@proxmox.com> Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 3E3B1956C0 for <pve-devel@lists.proxmox.com>; Wed, 18 Jan 2023 14:13:40 +0100 (CET) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id CD9A4202E1 for <pve-devel@lists.proxmox.com>; Wed, 18 Jan 2023 14:13:09 +0100 (CET) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [94.136.29.106]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS for <pve-devel@lists.proxmox.com>; Wed, 18 Jan 2023 14:13:08 +0100 (CET) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id C79E245111 for <pve-devel@lists.proxmox.com>; Wed, 18 Jan 2023 14:13:05 +0100 (CET) From: Dominik Csapak <d.csapak@proxmox.com> To: pve-devel@lists.proxmox.com Date: Wed, 18 Jan 2023 14:13:03 +0100 Message-Id: <20230118131303.2892050-9-d.csapak@proxmox.com> X-Mailer: git-send-email 2.30.2 In-Reply-To: <20230118131303.2892050-1-d.csapak@proxmox.com> References: <20230118131303.2892050-1-d.csapak@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL 0.065 Adjusted score from AWL reputation of From: address BAYES_00 -1.9 Bayes spam probability is 0 to 1% KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pve-devel] [PATCH manager 6/6] ui: storage/LVMInputPanel: modernize & cleanup code X-BeenThere: pve-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox VE development discussion <pve-devel.lists.proxmox.com> List-Unsubscribe: <https://lists.proxmox.com/cgi-bin/mailman/options/pve-devel>, <mailto:pve-devel-request@lists.proxmox.com?subject=unsubscribe> List-Archive: <http://lists.proxmox.com/pipermail/pve-devel/> List-Post: <mailto:pve-devel@lists.proxmox.com> List-Help: <mailto:pve-devel-request@lists.proxmox.com?subject=help> List-Subscribe: <https://lists.proxmox.com/cgi-bin/mailman/listinfo/pve-devel>, <mailto:pve-devel-request@lists.proxmox.com?subject=subscribe> X-List-Received-Date: Wed, 18 Jan 2023 13:13:40 -0000 using cbin, gettin rid of initComponent this is a bit more complicated than the other refactorings in storage recently, since we have a few fields with non trivial dependecies between the selected mode (existing vgs/base storage) and isCreate Because of that, using a cbind for the xtype here instead of the pmxDisplayEditField is much more convenient (accessing the pmxDisplayEditField and the editField below is currently not really ideal) Signed-off-by: Dominik Csapak <d.csapak@proxmox.com> --- www/manager6/storage/LVMEdit.js | 152 ++++++++++++++++---------------- 1 file changed, 74 insertions(+), 78 deletions(-) diff --git a/www/manager6/storage/LVMEdit.js b/www/manager6/storage/LVMEdit.js index 84ee198da..1b6edd08e 100644 --- a/www/manager6/storage/LVMEdit.js +++ b/www/manager6/storage/LVMEdit.js @@ -141,78 +141,76 @@ Ext.define('PVE.storage.LunSelector', { Ext.define('PVE.storage.LVMInputPanel', { extend: 'PVE.panel.StorageBase', + mixins: ['Proxmox.Mixin.CBind'], onlineHelp: 'storage_lvm', - initComponent: function() { - let me = this; - - me.column1 = []; - - let vgnameField = Ext.createWidget(me.isCreate ? 'textfield' : 'displayfield', { + column1: [ + { + xtype: 'pveBaseStorageSelector', + name: 'basesel', + fieldLabel: gettext('Base storage'), + cbind: { + disabled: '{!isCreate}', + hidden: '{!isCreate}', + }, + submitValue: false, + listeners: { + change: function(f, value) { + let me = this; + let vgField = me.up('inputpanel').lookup('volumeGroupSelector'); + let vgNameField = me.up('inputpanel').lookup('vgName'); + let baseField = me.up('inputpanel').lookup('lunSelector'); + + vgField.setVisible(!value); + vgField.setDisabled(!!value); + + baseField.setVisible(!!value); + baseField.setDisabled(!value); + baseField.setStorage(value); + + vgNameField.setVisible(!!value); + vgNameField.setDisabled(!value); + }, + }, + }, + { + xtype: 'pveStorageLunSelector', + name: 'base', + fieldLabel: gettext('Base volume'), + reference: 'lunSelector', + hidden: true, + disabled: true, + }, + { + xtype: 'pveVgSelector', name: 'vgname', - hidden: !!me.isCreate, - disabled: !!me.isCreate, - value: '', fieldLabel: gettext('Volume group'), + reference: 'volumeGroupSelector', + cbind: { + disabled: '{!isCreate}', + hidden: '{!isCreate}', + }, allowBlank: false, - }); - - if (me.isCreate) { - let vgField = Ext.create('PVE.storage.VgSelector', { - name: 'vgname', - fieldLabel: gettext('Volume group'), - reference: 'volumeGroupSelector', - allowBlank: false, - listeners: { - nodechanged: (value) => me.lookup('storageNodeRestriction').setValue(value), - } - }); - - let baseField = Ext.createWidget('pveStorageLunSelector', { - name: 'base', - hidden: true, - disabled: true, - fieldLabel: gettext('Base volume'), - }); - - me.column1.push({ - xtype: 'pveBaseStorageSelector', - name: 'basesel', - fieldLabel: gettext('Base storage'), - submitValue: false, - listeners: { - change: function(f, value) { - if (value) { - vgnameField.setVisible(true); - vgnameField.setDisabled(false); - vgField.setVisible(false); - vgField.setDisabled(true); - baseField.setVisible(true); - baseField.setDisabled(false); - } else { - vgnameField.setVisible(false); - vgnameField.setDisabled(true); - vgField.setVisible(true); - vgField.setDisabled(false); - baseField.setVisible(false); - baseField.setDisabled(true); - } - baseField.setStorage(value); - }, + listeners: { + nodechanged: function(value) { + this.up('inputpanel').lookup('storageNodeRestriction').setValue(value); }, - }); - - me.column1.push(baseField); - - me.column1.push(vgField); - } - - me.column1.push(vgnameField); - - // here value is an array, - // while before it was a string - me.column1.push({ + }, + }, + { + name: 'vgname', + fieldLabel: gettext('Volume group'), + reference: 'vgName', + cbind: { + xtype: (get) => get('isCreate') ? 'textfield' : 'displayfield', + hidden: '{isCreate}', + disabled: '{isCreate}', + }, + value: '', + allowBlank: false, + }, + { xtype: 'pveContentTypeSelector', cts: ['images', 'rootdir'], fieldLabel: gettext('Content'), @@ -220,17 +218,15 @@ Ext.define('PVE.storage.LVMInputPanel', { value: ['images', 'rootdir'], multiSelect: true, allowBlank: false, - }); - - me.column2 = [ - { - xtype: 'proxmoxcheckbox', - name: 'shared', - uncheckedValue: 0, - fieldLabel: gettext('Shared'), - }, - ]; - - me.callParent(); - }, + }, + ], + + column2: [ + { + xtype: 'proxmoxcheckbox', + name: 'shared', + uncheckedValue: 0, + fieldLabel: gettext('Shared'), + }, + ], }); -- 2.30.2