[pve-devel] [PATCH V5 pve-manager 1/2] fix #2822: add iscsi, lvm, lvmthin & zfs storage for all cluster nodes
Dominik Csapak
d.csapak at proxmox.com
Thu Sep 29 14:02:03 CEST 2022
thanks for the resend, i can now apply it ;)
i played a bit around with this and i'm not completely happy with the ux here.
having 'localhost' as text in the box is not really helpful because the
user might not actually know what 'localhost' actuall is.
also it's possible to empty the field, of which the meaning is also not really
clear?
my suggestion would be to set allowBlank to false, and by default select
the current nodename (available in Proxmox.NodeName)
That way the current node is preselected, and there is no misunderstanding
which node is scanned at any time.
i'd leave the restriction logic like it is though, because if the storage
is available everywhere, you don't have to change the nodename at all
but if you change it you want it probably restricted (like already
mentioned in a previous review)
aside from that the patches LGTM
On 9/23/22 14:46, Stefan Hrdlicka wrote:
> This adds a dropdown box for iSCSI, LVM, LVMThin & ZFS storage options where a
> cluster node needs to be chosen. As default the current node is
> selected. It restricts the the storage to be only availabe on the
> selected node.
>
> Signed-off-by: Stefan Hrdlicka <s.hrdlicka at proxmox.com>
> ---
> www/manager6/Makefile | 2 +
> www/manager6/form/ComboBoxSetStoreNode.js | 16 ++++++
> www/manager6/form/StorageScanNodeSelector.js | 30 +++++++++++
> www/manager6/storage/Base.js | 1 +
> www/manager6/storage/IScsiEdit.js | 32 +++++++++---
> www/manager6/storage/LVMEdit.js | 29 +++++++++--
> www/manager6/storage/LvmThinEdit.js | 52 +++++++++++++++-----
> www/manager6/storage/ZFSPoolEdit.js | 28 +++++++++--
> 8 files changed, 166 insertions(+), 24 deletions(-)
> create mode 100644 www/manager6/form/ComboBoxSetStoreNode.js
> create mode 100644 www/manager6/form/StorageScanNodeSelector.js
>
> diff --git a/www/manager6/Makefile b/www/manager6/Makefile
> index d16770b1..81f5e5d8 100644
> --- a/www/manager6/Makefile
> +++ b/www/manager6/Makefile
> @@ -27,6 +27,7 @@ JSSRC= \
> form/CalendarEvent.js \
> form/CephPoolSelector.js \
> form/CephFSSelector.js \
> + form/ComboBoxSetStoreNode.js \
> form/CompressionSelector.js \
> form/ContentTypeSelector.js \
> form/ControllerSelector.js \
> @@ -62,6 +63,7 @@ JSSRC= \
> form/SecurityGroupSelector.js \
> form/SnapshotSelector.js \
> form/SpiceEnhancementSelector.js \
> + form/StorageScanNodeSelector.js \
> form/StorageSelector.js \
> form/TFASelector.js \
> form/TokenSelector.js \
> diff --git a/www/manager6/form/ComboBoxSetStoreNode.js b/www/manager6/form/ComboBoxSetStoreNode.js
> new file mode 100644
> index 00000000..3490ddd7
> --- /dev/null
> +++ b/www/manager6/form/ComboBoxSetStoreNode.js
> @@ -0,0 +1,16 @@
> +Ext.define('PVE.form.ComboBoxSetStoreNode', {
> + extend: 'Ext.form.field.ComboBox',
> + config: {
> + apiBaseUrl: '/api2/json/nodes/',
> + apiSuffix: '',
> + },
> +
> + setNodeName: function(value) {
> + let me = this;
> + value ||= Proxmox.NodeName;
> +
> + me.getStore().getProxy().setUrl(`${me.apiBaseUrl}${value}${me.apiSuffix}`);
> + this.clearValue();
> + },
> +
> +});
> diff --git a/www/manager6/form/StorageScanNodeSelector.js b/www/manager6/form/StorageScanNodeSelector.js
> new file mode 100644
> index 00000000..80188707
> --- /dev/null
> +++ b/www/manager6/form/StorageScanNodeSelector.js
> @@ -0,0 +1,30 @@
> +Ext.define('PVE.form.StorageScanNodeSelector', {
> + extend: 'PVE.form.NodeSelector',
> + xtype: 'pveStorageScanNodeSelector',
> +
> + name: 'storageScanNode',
> + itemId: 'pveStorageScanNodeSelector',
> + fieldLabel: gettext('Scan node'),
> + allowBlank: true,
> + disallowedNodes: undefined,
> + autoSelect: false,
> + submitValue: false,
> + value: 'localhost',
> + autoEl: {
> + tag: 'div',
> + 'data-qtip': gettext('Scan for available storages on the selected node'),
> + },
> + triggers: {
> + clear: {
> + handler: function() {
> + let me = this;
> + me.setValue('localhost');
> + },
> + },
> + },
> + setValue: function(value) {
> + let me = this;
> + me.callParent([value]);
> + me.triggers.clear.setVisible(me.triggers.clear.isVisible() && value !== 'localhost');
> + },
> +});
> diff --git a/www/manager6/storage/Base.js b/www/manager6/storage/Base.js
> index 7f6d7a09..1df7a8dd 100644
> --- a/www/manager6/storage/Base.js
> +++ b/www/manager6/storage/Base.js
> @@ -36,6 +36,7 @@ Ext.define('PVE.panel.StorageBase', {
> {
> xtype: 'pveNodeSelector',
> name: 'nodes',
> + reference: 'storageNodeRestriction',
> disabled: me.storageId === 'local',
> fieldLabel: gettext('Nodes'),
> emptyText: gettext('All') + ' (' + gettext('No restrictions') +')',
> diff --git a/www/manager6/storage/IScsiEdit.js b/www/manager6/storage/IScsiEdit.js
> index 2f35f882..393de3c3 100644
> --- a/www/manager6/storage/IScsiEdit.js
> +++ b/www/manager6/storage/IScsiEdit.js
> @@ -1,5 +1,5 @@
> Ext.define('PVE.storage.IScsiScan', {
> - extend: 'Ext.form.field.ComboBox',
> + extend: 'PVE.form.ComboBoxSetStoreNode',
> alias: 'widget.pveIScsiScan',
>
> queryParam: 'portal',
> @@ -10,6 +10,9 @@ Ext.define('PVE.storage.IScsiScan', {
> loadingText: gettext('Scanning...'),
> width: 350,
> },
> + config: {
> + apiSuffix: '/scan/iscsi',
> + },
> doRawQuery: function() {
> // do nothing
> },
> @@ -42,7 +45,7 @@ Ext.define('PVE.storage.IScsiScan', {
> fields: ['target', 'portal'],
> proxy: {
> type: 'proxmox',
> - url: `/api2/json/nodes/${me.nodename}/scan/iscsi`,
> + url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
> },
> });
> store.sort('target', 'ASC');
> @@ -78,6 +81,23 @@ Ext.define('PVE.storage.IScsiInputPanel', {
> var me = this;
>
> me.column1 = [
> + {
> + xtype: 'pveStorageScanNodeSelector',
> + disabled: !me.isCreate,
> + hidden: !me.isCreate,
> + preferredValue: '',
> + allowBlank: true,
> + autoSelect: false,
> + listeners: {
> + change: {
> + fn: function(field, value) {
> + me.lookup('iScsiTargetScan').setNodeName(value);
> + me.lookup('storageNodeRestriction')
> + .setValue(value === 'localhost' ? '' : value);
> + },
> + },
> + },
> + },
> {
> xtype: me.isCreate ? 'textfield' : 'displayfield',
> name: 'portal',
> @@ -94,14 +114,14 @@ Ext.define('PVE.storage.IScsiInputPanel', {
> },
> },
> },
> - {
> + Ext.createWidget(me.isCreate ? 'pveIScsiScan' : 'displayfield', {
> readOnly: !me.isCreate,
> - xtype: me.isCreate ? 'pveIScsiScan' : 'displayfield',
> name: 'target',
> value: '',
> - fieldLabel: 'Target',
> + fieldLabel: gettext('Target'),
> allowBlank: false,
> - },
> + reference: 'iScsiTargetScan',
> + }),
> ];
>
> me.column2 = [
> diff --git a/www/manager6/storage/LVMEdit.js b/www/manager6/storage/LVMEdit.js
> index 2a9cd283..04d96786 100644
> --- a/www/manager6/storage/LVMEdit.js
> +++ b/www/manager6/storage/LVMEdit.js
> @@ -1,10 +1,20 @@
> Ext.define('PVE.storage.VgSelector', {
> - extend: 'Ext.form.field.ComboBox',
> + extend: 'PVE.form.ComboBoxSetStoreNode',
> alias: 'widget.pveVgSelector',
> valueField: 'vg',
> displayField: 'vg',
> queryMode: 'local',
> editable: false,
> + config: {
> + apiSuffix: '/scan/lvm',
> + },
> +
> + setNodeName: function(value) {
> + let me = this;
> + me.callParent([value]);
> + me.getStore().load();
> + },
> +
> initComponent: function() {
> var me = this;
>
> @@ -17,7 +27,7 @@ Ext.define('PVE.storage.VgSelector', {
> fields: ['vg', 'size', 'free'],
> proxy: {
> type: 'proxmox',
> - url: '/api2/json/nodes/' + me.nodename + '/scan/lvm',
> + url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
> },
> });
>
> @@ -103,11 +113,24 @@ Ext.define('PVE.storage.LVMInputPanel', {
> });
>
> if (me.isCreate) {
> - var vgField = Ext.create('PVE.storage.VgSelector', {
> + let vgField = Ext.create('PVE.storage.VgSelector', {
> name: 'vgname',
> fieldLabel: gettext('Volume group'),
> + reference: 'volumeGroupSelector',
> allowBlank: false,
> });
> + me.column1.push({
> + xtype: 'pveStorageScanNodeSelector',
> + listeners: {
> + change: {
> + fn: function(field, value) {
> + me.lookup('volumeGroupSelector').setNodeName(value);
> + me.lookup('storageNodeRestriction')
> + .setValue(value === 'localhost' ? '' : value);
> + },
> + },
> + },
> + });
>
> var baseField = Ext.createWidget('pveFileSelector', {
> name: 'base',
> diff --git a/www/manager6/storage/LvmThinEdit.js b/www/manager6/storage/LvmThinEdit.js
> index 4eab7740..e9202ffa 100644
> --- a/www/manager6/storage/LvmThinEdit.js
> +++ b/www/manager6/storage/LvmThinEdit.js
> @@ -1,5 +1,5 @@
> Ext.define('PVE.storage.TPoolSelector', {
> - extend: 'Ext.form.field.ComboBox',
> + extend: 'PVE.form.ComboBoxSetStoreNode',
> alias: 'widget.pveTPSelector',
>
> queryParam: 'vg',
> @@ -7,6 +7,10 @@ Ext.define('PVE.storage.TPoolSelector', {
> displayField: 'lv',
> editable: false,
>
> + config: {
> + apiSuffix: '/scan/lvmthin',
> + },
> +
> doRawQuery: function() {
> // nothing
> },
> @@ -40,7 +44,7 @@ Ext.define('PVE.storage.TPoolSelector', {
> fields: ['lv'],
> proxy: {
> type: 'proxmox',
> - url: '/api2/json/nodes/' + me.nodename + '/scan/lvmthin',
> + url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
> },
> });
>
> @@ -58,13 +62,23 @@ Ext.define('PVE.storage.TPoolSelector', {
> });
>
> Ext.define('PVE.storage.BaseVGSelector', {
> - extend: 'Ext.form.field.ComboBox',
> + extend: 'PVE.form.ComboBoxSetStoreNode',
> alias: 'widget.pveBaseVGSelector',
>
> valueField: 'vg',
> displayField: 'vg',
> queryMode: 'local',
> editable: false,
> + config: {
> + apiSuffix: '/scan/lvm',
> + },
> +
> + setNodeName: function(value) {
> + let me = this;
> + me.callParent([value]);
> + me.getStore().load();
> + },
> +
> initComponent: function() {
> var me = this;
>
> @@ -77,7 +91,7 @@ Ext.define('PVE.storage.BaseVGSelector', {
> fields: ['vg', 'size', 'free'],
> proxy: {
> type: 'proxmox',
> - url: '/api2/json/nodes/' + me.nodename + '/scan/lvm',
> + url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
> },
> });
>
> @@ -121,27 +135,41 @@ Ext.define('PVE.storage.LvmThinInputPanel', {
> });
>
> if (me.isCreate) {
> - var vgField = Ext.create('PVE.storage.TPoolSelector', {
> - name: 'thinpool',
> - fieldLabel: gettext('Thin Pool'),
> - allowBlank: false,
> + me.column1.push({
> + xtype: 'pveStorageScanNodeSelector',
> + listeners: {
> + change: {
> + fn: function(field, value) {
> + me.lookup('thinPoolSelector').setNodeName(value);
> + me.lookup('volumeGroupSelector').setNodeName(value);
> + me.lookup('storageNodeRestriction')
> + .setValue(value === 'localhost' ? '' : value);
> + },
> + },
> + },
> });
>
> - me.column1.push({
> - xtype: 'pveBaseVGSelector',
> + me.column1.push(Ext.create('PVE.storage.BaseVGSelector', {
> name: 'vgname',
> fieldLabel: gettext('Volume group'),
> + reference: 'volumeGroupSelector',
> listeners: {
> change: function(f, value) {
> if (me.isCreate) {
> + let vgField = me.lookup('thinPoolSelector');
> vgField.setVG(value);
> vgField.setValue('');
> }
> },
> },
> - });
> + }));
>
> - me.column1.push(vgField);
> + me.column1.push(Ext.create('PVE.storage.TPoolSelector', {
> + name: 'thinpool',
> + fieldLabel: gettext('Thin Pool'),
> + reference: 'thinPoolSelector',
> + allowBlank: false,
> + }));
> }
>
> me.column1.push(vgnameField);
> diff --git a/www/manager6/storage/ZFSPoolEdit.js b/www/manager6/storage/ZFSPoolEdit.js
> index 8e689f0c..98034de9 100644
> --- a/www/manager6/storage/ZFSPoolEdit.js
> +++ b/www/manager6/storage/ZFSPoolEdit.js
> @@ -1,5 +1,5 @@
> Ext.define('PVE.storage.ZFSPoolSelector', {
> - extend: 'Ext.form.field.ComboBox',
> + extend: 'PVE.form.ComboBoxSetStoreNode',
> alias: 'widget.pveZFSPoolSelector',
> valueField: 'pool',
> displayField: 'pool',
> @@ -8,6 +8,16 @@ Ext.define('PVE.storage.ZFSPoolSelector', {
> listConfig: {
> loadingText: gettext('Scanning...'),
> },
> + config: {
> + apiSuffix: '/scan/zfs',
> + },
> +
> + setNodeName: function(value) {
> + let me = this;
> + me.callParent([value]);
> + me.getStore().load();
> + },
> +
> initComponent: function() {
> var me = this;
>
> @@ -20,10 +30,9 @@ Ext.define('PVE.storage.ZFSPoolSelector', {
> fields: ['pool', 'size', 'free'],
> proxy: {
> type: 'proxmox',
> - url: '/api2/json/nodes/' + me.nodename + '/scan/zfs',
> + url: `${me.apiBaseUrl}${me.nodename}${me.apiSuffix}`,
> },
> });
> -
> store.sort('pool', 'ASC');
>
> Ext.apply(me, {
> @@ -45,9 +54,22 @@ Ext.define('PVE.storage.ZFSPoolInputPanel', {
> me.column1 = [];
>
> if (me.isCreate) {
> + me.column1.push({
> + xtype: 'pveStorageScanNodeSelector',
> + listeners: {
> + change: {
> + fn: function(field, value) {
> + me.lookup('zfsPoolSelector').setNodeName(value);
> + me.lookup('storageNodeRestriction')
> + .setValue(value === 'localhost' ? '' : value);
> + },
> + },
> + },
> + });
> me.column1.push(Ext.create('PVE.storage.ZFSPoolSelector', {
> name: 'pool',
> fieldLabel: gettext('ZFS Pool'),
> + reference: 'zfsPoolSelector',
> allowBlank: false,
> }));
> } else {
More information about the pve-devel
mailing list