[pve-devel] [PATCH manager 2/6] ui: dc/Auth*: refactor AuthEdit

Dominik Csapak d.csapak at proxmox.com
Thu Apr 9 16:10:45 CEST 2020


similar to storage/Base.js so that we have the different
RealmTypes in different inputpanels

this will come in handy when we define sync options

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 www/manager6/Makefile           |   4 +-
 www/manager6/Utils.js           |  23 ++++
 www/manager6/dc/AuthEdit.js     | 180 --------------------------------
 www/manager6/dc/AuthEditAD.js   |  54 ++++++++++
 www/manager6/dc/AuthEditBase.js | 120 +++++++++++++++++++++
 www/manager6/dc/AuthEditLDAP.js |  61 +++++++++++
 www/manager6/dc/AuthView.js     |  56 +++++-----
 7 files changed, 287 insertions(+), 211 deletions(-)
 delete mode 100644 www/manager6/dc/AuthEdit.js
 create mode 100644 www/manager6/dc/AuthEditAD.js
 create mode 100644 www/manager6/dc/AuthEditBase.js
 create mode 100644 www/manager6/dc/AuthEditLDAP.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index 095c4c08..a06d349c 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -233,7 +233,9 @@ JSSRC= 				                 	\
 	dc/RoleEdit.js					\
 	dc/ACLView.js					\
 	dc/AuthView.js					\
-	dc/AuthEdit.js					\
+	dc/AuthEditBase.js				\
+	dc/AuthEditAD.js				\
+	dc/AuthEditLDAP.js				\
 	dc/Backup.js					\
 	dc/Support.js					\
 	dc/SecurityGroups.js				\
diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index bd2b161e..5cf51d95 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -566,6 +566,29 @@ Ext.define('PVE.Utils', { utilities: {
 	return format === 'pbs-ct' || volid.match(':backup/vzdump-(lxc|openvz)-');
     },
 
+    authSchema: {
+	ad: {
+	    name: gettext('Active Directory Server'),
+	    ipanel: 'pveAuthADPanel',
+	    add: true,
+	},
+	ldap: {
+	    name: gettext('LDAP Server'),
+	    ipanel: 'pveAuthLDAPPanel',
+	    add: true,
+	},
+	pam: {
+	    name: 'Linux PAM',
+	    ipanel: 'pveAuthBasePanel',
+	    add: false,
+	},
+	pve: {
+	    name: 'Proxmox VE authentication server',
+	    ipanel: 'pveAuthBasePanel',
+	    add: false,
+	},
+    },
+
     storageSchema: {
 	dir: {
 	    name: Proxmox.Utils.directoryText,
diff --git a/www/manager6/dc/AuthEdit.js b/www/manager6/dc/AuthEdit.js
deleted file mode 100644
index 1a62e550..00000000
--- a/www/manager6/dc/AuthEdit.js
+++ /dev/null
@@ -1,180 +0,0 @@
-Ext.define('PVE.dc.AuthEdit', {
-    extend: 'Proxmox.window.Edit',
-    alias: ['widget.pveDcAuthEdit'],
-
-    isAdd: true,
-
-    initComponent : function() {
-        var me = this;
-
-        me.isCreate = !me.realm;
-
-        var url;
-        var method;
-        var serverlist;
-
-        if (me.isCreate) {
-            url = '/api2/extjs/access/domains';
-            method = 'POST';
-        } else {
-            url = '/api2/extjs/access/domains/' + me.realm;
-            method = 'PUT';
-        }
-
-        var column1 = [
-            {
-                xtype: me.isCreate ? 'textfield' : 'displayfield',
-                name: 'realm',
-                fieldLabel: gettext('Realm'),
-                value: me.realm,
-                allowBlank: false
-            }
-	];
-
-	if (me.authType === 'ad') {
-
-	    me.subject = gettext('Active Directory Server');
-
-            column1.push({
-                xtype: 'textfield',
-                name: 'domain',
-                fieldLabel: gettext('Domain'),
-                emptyText: 'company.net',
-                allowBlank: false
-            });
-
-	} else if (me.authType === 'ldap') {
-
-	    me.subject = gettext('LDAP Server');
-
-            column1.push({
-                xtype: 'textfield',
-                name: 'base_dn',
-                fieldLabel: gettext('Base Domain Name'),
-		emptyText: 'CN=Users,DC=Company,DC=net',
-                allowBlank: false
-            });
-
-            column1.push({
-                xtype: 'textfield',
-                name: 'user_attr',
-                emptyText: 'uid / sAMAccountName',
-                fieldLabel: gettext('User Attribute Name'),
-                allowBlank: false
-            });
-	} else if (me.authType === 'pve') {
-
-	    if (me.isCreate) {
-		throw 'unknown auth type';
-	    }
-
-	    me.subject = 'Proxmox VE authentication server';
-
-	} else if (me.authType === 'pam') {
-
-	    if (me.isCreate) {
-		throw 'unknown auth type';
-	    }
-
-	    me.subject = 'linux PAM';
-
-	} else {
-	    throw 'unknown auth type ';
-	}
-
-        column1.push({
-            xtype: 'proxmoxcheckbox',
-            fieldLabel: gettext('Default'),
-            name: 'default',
-            uncheckedValue: 0
-        });
-
-        var column2 = [];
-
-	if (me.authType === 'ldap' || me.authType === 'ad') {
-	    column2.push(
-		{
-                    xtype: 'textfield',
-                    fieldLabel: gettext('Server'),
-                    name: 'server1',
-                    allowBlank: false
-		},
-		{
-                    xtype: 'proxmoxtextfield',
-                    fieldLabel: gettext('Fallback Server'),
-		    deleteEmpty: !me.isCreate,
-		    name: 'server2'
-		},
-		{
-                    xtype: 'proxmoxintegerfield',
-                    name: 'port',
-                    fieldLabel: gettext('Port'),
-                    minValue: 1,
-                    maxValue: 65535,
-		    emptyText: gettext('Default'),
-		    submitEmptyText: false
-		},
-		{
-                    xtype: 'proxmoxcheckbox',
-                    fieldLabel: 'SSL',
-                    name: 'secure',
-                    uncheckedValue: 0
-		}
-            );
-	}
-
-	column2.push({
-	    xtype: 'pveTFASelector',
-	});
-
-	var ipanel = Ext.create('Proxmox.panel.InputPanel', {
-	    column1: column1,
-	    column2: column2,
-	    columnB: [{
-		xtype: 'textfield',
-		name: 'comment',
-		fieldLabel: gettext('Comment')
-            }],
-	    onGetValues: function(values) {
-		if (!values.port) {
-		    if (!me.isCreate) {
-			Proxmox.Utils.assemble_field_data(values, { 'delete': 'port' });
-		    }
-		    delete values.port;
-		}
-
-		if (me.isCreate) {
-		    values.type = me.authType;
-		}
-
-		return values;
-	    }
-	});
-
-	Ext.applyIf(me, {
-            url: url,
-            method: method,
-	    fieldDefaults: {
-		labelWidth: 120
-	    },
-	    items: [ ipanel ]
-        });
-
-        me.callParent();
-
-        if (!me.isCreate) {
-            me.load({
-                success: function(response, options) {
-		    var data = response.result.data || {};
-		    // just to be sure (should not happen)
-		    if (data.type !== me.authType) {
-			me.close();
-			throw "got wrong auth type";
-		    }
-
-                    me.setValues(data);
-                }
-            });
-        }
-    }
-});
diff --git a/www/manager6/dc/AuthEditAD.js b/www/manager6/dc/AuthEditAD.js
new file mode 100644
index 00000000..31a6a360
--- /dev/null
+++ b/www/manager6/dc/AuthEditAD.js
@@ -0,0 +1,54 @@
+Ext.define('PVE.panel.ADInputPanel', {
+    extend: 'PVE.panel.AuthBase',
+    xtype: 'pveAuthADPanel',
+
+    initComponent: function() {
+	let me = this;
+
+	if (me.type !== 'ad') {
+	    throw 'invalid type';
+	}
+
+	me.column1 = [
+	    {
+		xtype: 'textfield',
+		name: 'domain',
+		fieldLabel: gettext('Domain'),
+		emptyText: 'company.net',
+		allowBlank: false,
+	    },
+	];
+
+	me.column2 = [
+	    {
+		xtype: 'textfield',
+		fieldLabel: gettext('Server'),
+		name: 'server1',
+		allowBlank: false,
+	    },
+	    {
+		xtype: 'proxmoxtextfield',
+		fieldLabel: gettext('Fallback Server'),
+		deleteEmpty: !me.isCreate,
+		name: 'server2',
+	    },
+	    {
+		xtype: 'proxmoxintegerfield',
+		name: 'port',
+		fieldLabel: gettext('Port'),
+		minValue: 1,
+		maxValue: 65535,
+		emptyText: gettext('Default'),
+		submitEmptyText: false,
+	    },
+	    {
+		xtype: 'proxmoxcheckbox',
+		fieldLabel: 'SSL',
+		name: 'secure',
+		uncheckedValue: 0,
+	    },
+	];
+
+	me.callParent();
+    },
+});
diff --git a/www/manager6/dc/AuthEditBase.js b/www/manager6/dc/AuthEditBase.js
new file mode 100644
index 00000000..5c4b6a90
--- /dev/null
+++ b/www/manager6/dc/AuthEditBase.js
@@ -0,0 +1,120 @@
+Ext.define('PVE.panel.AuthBase', {
+    extend: 'Proxmox.panel.InputPanel',
+    xtype: 'pveAuthBasePanel',
+
+    type: '',
+
+    onGetValues: function(values) {
+	let me = this;
+
+	if (!values.port) {
+	    if (!me.isCreate) {
+		Proxmox.Utils.assemble_field_data(values, { 'delete': 'port' });
+	    }
+	    delete values.port;
+	}
+
+	if (me.isCreate) {
+	    values.type = me.authType;
+	}
+
+	return values;
+    },
+
+    initComponent: function() {
+	let me = this;
+
+	if (!me.column1) { me.column1 = []; }
+	if (!me.column2) { me.column2 = []; }
+	if (!me.columnB) { me.columnB = []; }
+
+	// first field is name
+	me.column1.unshift({
+	    xtype: me.isCreate ? 'textfield' : 'displayfield',
+	    name: 'realm',
+	    fieldLabel: gettext('Realm'),
+	    value: me.realm,
+	    allowBlank: false,
+	});
+
+	// last field is default'
+	me.column1.push({
+	    xtype: 'proxmoxcheckbox',
+	    fieldLabel: gettext('Default'),
+	    name: 'default',
+	    uncheckedValue: 0,
+	});
+
+	// last field of column2is tfa
+	me.column2.push({
+	    xtype: 'pveTFASelector',
+	});
+
+	me.columnB.push({
+	    xtype: 'textfield',
+	    name: 'comment',
+	    fieldLabel: gettext('Comment'),
+	});
+
+	me.callParent();
+    },
+});
+
+Ext.define('PVE.dc.AuthEditBase', {
+    extend: 'Proxmox.window.Edit',
+
+    isAdd: true,
+
+    fieldDefaults: {
+	labelWidth: 120,
+    },
+
+    initComponent: function() {
+	var me = this;
+
+	me.isCreate = !me.realm;
+
+	if (me.isCreate) {
+	    me.url = '/api2/extjs/access/domains';
+	    me.method = 'POST';
+	} else {
+	    me.url = '/api2/extjs/access/domains/' + me.realm;
+	    me.method = 'PUT';
+	}
+
+	let authConfig = PVE.Utils.authSchema[me.authType];
+	if (!authConfig) {
+	    throw 'unknown auth type';
+	} else if (!authConfig.add && me.isCreate) {
+	    throw 'trying to add non addable realm';
+	}
+
+	me.subject = authConfig.name;
+
+	Ext.apply(me, {
+	    items: [{
+		realm: me.realm,
+		xtype: authConfig.ipanel,
+		isCreate: me.isCreate,
+		type: me.authType,
+	    }],
+	});
+
+	me.callParent();
+
+	if (!me.isCreate) {
+	    me.load({
+		    success: function(response, options) {
+			var data = response.result.data || {};
+			// just to be sure (should not happen)
+			if (data.type !== me.authType) {
+			    me.close();
+			    throw "got wrong auth type";
+			}
+
+			me.setValues(data);
+		    },
+	    });
+	}
+    },
+});
diff --git a/www/manager6/dc/AuthEditLDAP.js b/www/manager6/dc/AuthEditLDAP.js
new file mode 100644
index 00000000..3c32a378
--- /dev/null
+++ b/www/manager6/dc/AuthEditLDAP.js
@@ -0,0 +1,61 @@
+Ext.define('PVE.panel.LDAPInputPanel', {
+    extend: 'PVE.panel.AuthBase',
+    xtype: 'pveAuthLDAPPanel',
+
+    initComponent: function() {
+	let me = this;
+
+	if (me.type !== 'ldap') {
+	    throw 'invalid type';
+	}
+
+	me.column1 = [
+	    {
+		xtype: 'textfield',
+		name: 'base_dn',
+		fieldLabel: gettext('Base Domain Name'),
+		emptyText: 'CN=Users,DC=Company,DC=net',
+		allowBlank: false,
+	    },
+	    {
+		xtype: 'textfield',
+		name: 'user_attr',
+		emptyText: 'uid / sAMAccountName',
+		fieldLabel: gettext('User Attribute Name'),
+		allowBlank: false,
+	    },
+	];
+
+	me.column2 = [
+	    {
+		xtype: 'textfield',
+		fieldLabel: gettext('Server'),
+		name: 'server1',
+		allowBlank: false,
+	    },
+	    {
+		xtype: 'proxmoxtextfield',
+		fieldLabel: gettext('Fallback Server'),
+		deleteEmpty: !me.isCreate,
+		name: 'server2',
+	    },
+	    {
+		xtype: 'proxmoxintegerfield',
+		name: 'port',
+		fieldLabel: gettext('Port'),
+		minValue: 1,
+		maxValue: 65535,
+		emptyText: gettext('Default'),
+		submitEmptyText: false,
+	    },
+	    {
+		xtype: 'proxmoxcheckbox',
+		fieldLabel: 'SSL',
+		name: 'secure',
+		uncheckedValue: 0,
+	    },
+	];
+
+	me.callParent();
+    },
+});
diff --git a/www/manager6/dc/AuthView.js b/www/manager6/dc/AuthView.js
index 841b2c06..94ed0e13 100644
--- a/www/manager6/dc/AuthView.js
+++ b/www/manager6/dc/AuthView.js
@@ -30,13 +30,13 @@ Ext.define('PVE.dc.AuthView', {
 	    if (!rec) {
 		return;
 	    }
-
-            var win = Ext.create('PVE.dc.AuthEdit',{
-                realm: rec.data.realm,
-		authType: rec.data.type
-            });
-            win.on('destroy', reload);
-            win.show();
+	    Ext.create('PVE.dc.AuthEditBase', {
+		realm: rec.data.realm,
+		authType: rec.data.type,
+		listeners: {
+		    destroy: reload,
+		},
+	    }).show();
 	};
 
 	var edit_btn = new Proxmox.button.Button({
@@ -57,33 +57,29 @@ Ext.define('PVE.dc.AuthView', {
 	    }
         });
 
+	let items = [];
+	for (const [authType, config] of Object.entries(PVE.Utils.authSchema)) {
+	    if (!config.add) { continue; }
+
+	    items.push({
+		text: config.name,
+		handler: function() {
+		    Ext.create('PVE.dc.AuthEditBase', {
+			authType,
+			listeners: {
+			    destroy: reload,
+			},
+		    }).show();
+		},
+	    });
+	}
+
         var tbar = [
 	    {
 		text: gettext('Add'),
 		menu: new Ext.menu.Menu({
-		    items: [
-			{
-			    text: gettext('Active Directory Server'),
-			    handler: function() {
-				var win = Ext.create('PVE.dc.AuthEdit', {
-				    authType: 'ad'
-				});
-				win.on('destroy', reload);
-				win.show();
-			    }
-			},
-			{
-			    text: gettext('LDAP Server'),
-			    handler: function() {
-				var win = Ext.create('PVE.dc.AuthEdit',{
-				    authType: 'ldap'
-				});
-				win.on('destroy', reload);
-				win.show();
-			    }
-			}
-		    ]
-		})
+		    items: items,
+		}),
 	    },
 	    edit_btn, remove_btn
         ];
-- 
2.20.1





More information about the pve-devel mailing list