Combine both dialogues. This not only helps to reuse code but also
reduces storage choices from the Storage -> Add menu, and thus
improves usability.
Signed-off-by: Thomas Lamprecht <t.lampre...@proxmox.com>
---
changes v1 -> v2:
* do not hide the monitor or username field when choosing the
hyperconverged variant but tell the user via an emptyText that the
username will default to admin and the monitors will be autodetected
www/manager6/Utils.js | 7 +-
www/manager6/storage/RBDEdit.js | 137 +++++++++++++++++++++-----------
2 files changed, 92 insertions(+), 52 deletions(-)
diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index ad5a0a61..f9a48e14 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -434,15 +434,10 @@ Ext.define('PVE.Utils', { utilities: {
faIcon: 'building'
},
rbd_ext: {
- name: 'RBD (external)',
+ name: 'RBD',
ipanel: 'RBDInputPanel',
faIcon: 'building'
},
- pveceph: {
- name: 'RBD (PVE)',
- ipanel: 'PVERBDInputPanel',
- faIcon: 'building'
- },
zfs: {
name: 'ZFS over iSCSI',
ipanel: 'ZFSInputPanel',
diff --git a/www/manager6/storage/RBDEdit.js b/www/manager6/storage/RBDEdit.js
index d26a6ac3..3a0d373c 100644
--- a/www/manager6/storage/RBDEdit.js
+++ b/www/manager6/storage/RBDEdit.js
@@ -1,6 +1,37 @@
+/*jslint confusion: true*/
Ext.define('PVE.storage.RBDInputPanel', {
extend: 'PVE.panel.StorageBase',
+ viewModel: {
+ parent: null,
+ data: {
+ pveceph: true
+ }
+ },
+
+ controller: {
+ xclass: 'Ext.app.ViewController',
+ control: {
+ 'textfield[name=username]': {
+ disable: 'resetField'
+ },
+ 'textfield[name=monhost]': {
+ disable: 'disableMonField',
+ enable: 'enableMonField'
+ }
+ },
+ resetField: function(field) {
+ field.reset();
+ },
+ enableMonField: function(field) {
+ field.setEmptyText('');
+ },
+ disableMonField: function(field) {
+ field.reset();
+ field.setEmptyText(field.config.emptyText);
+ }
+ },
+
initComponent : function() {
var me = this;
@@ -9,48 +40,57 @@ Ext.define('PVE.storage.RBDInputPanel', {
}
me.type = 'rbd';
- me.column1 = [];
-
- if (me.pveceph) {
- me.column1.push(
- {
- xtype: me.isCreate ? 'pveCephPoolSelector' : 'displayfield',
- nodename: me.nodename,
- name: 'pool',
- fieldLabel: gettext('Pool'),
- allowBlank: false
- }
- );
- } else {
- me.column1.push(
- {
- xtype: me.isCreate ? 'textfield' : 'displayfield',
- name: 'pool',
- value: 'rbd',
- fieldLabel: gettext('Pool'),
- allowBlank: false
+ me.column1 = [
+ {
+ xtype: me.isCreate ? 'pveCephPoolSelector' : 'displayfield',
+ nodename: me.nodename,
+ name: 'pool',
+ bind: {
+ submitValue: '{pveceph}',
+ disabled: '{!pveceph}',
+ hidden: '{!pveceph}'
+ },
+ fieldLabel: gettext('Pool'),
+ allowBlank: false
+ },
+ {
+ xtype: me.isCreate ? 'textfield' : 'displayfield',
+ name: 'pool',
+ value: 'rbd',
+ bind: {
+ submitValue: '{!pveceph}',
+ disabled: '{pveceph}',
+ hidden: '{pveceph}'
+ },
+ fieldLabel: gettext('Pool'),
+ allowBlank: false
+ },
+ {
+ xtype: me.isCreate ? 'textfield' : 'displayfield',
+ name: 'monhost',
+ vtype: 'HostList',
+ bind: {
+ submitValue: '{!pveceph}',
+ disabled: '{pveceph}'
},
- {
- xtype: me.isCreate ? 'textfield' : 'displayfield',
- name: 'monhost',
- vtype: 'HostList',
- value: '',
- fieldLabel: 'Monitor(s)',
- allowBlank: false
+ value: '',
+ fieldLabel: 'Monitor(s)',
+ emptyText: gettext('Autodetected'),
+ allowBlank: false
+ },
+ {
+ xtype: me.isCreate ? 'textfield' : 'displayfield',
+ name: 'username',
+ bind: {
+ submitValue: '{!pveceph}',
+ disabled: '{pveceph}'
},
- {
- xtype: me.isCreate ? 'textfield' : 'displayfield',
- name: 'username',
- value: me.isCreate ? 'admin': '',
- fieldLabel: gettext('User name'),
- allowBlank: true
- }
- );
- }
+ value: me.isCreate ? 'admin': '',
+ fieldLabel: gettext('User name'),
+ allowBlank: true
+ }
+ ];
- // here value is an array,
- // while before it was a string
- /*jslint confusion: true*/
me.column2 = [
{
xtype: 'pveContentTypeSelector',
@@ -68,14 +108,19 @@ Ext.define('PVE.storage.RBDInputPanel', {
fieldLabel: 'KRBD'
}
];
- /*jslint confusion: false*/
+
+ me.columnB = [{
+ xtype: 'proxmoxcheckbox',
+ name: 'pveceph',
+ bind : {
+ value: '{pveceph}'
+ },
+ checked: true,
+ uncheckedValue: 0,
+ submitValue: false,
+ boxLabel: gettext('Use Proxmox VE Hyperconverged managed ceph pool')
+ }];
me.callParent();
}
});
-
-Ext.define('PVE.storage.PVERBDInputPanel', {
- extend: 'PVE.storage.RBDInputPanel',
-
- pveceph: 1
-});
