[pve-devel] [PATCH v2 manager] ui: storage/PBSEdit: add port to server field

[Lorenz Stechauner <l.stechauner@proxmox.com>]

this gives users the chance to supply the port nr in the gui,
without having to add a extra new field to the panel.

using the same implementation as in RemoteEdit.js in PBS.

Signed-off-by: Lorenz Stechauner <l.stechauner@proxmox.com>
---
 www/manager6/storage/PBSEdit.js | 58 ++++++++++++++++++++++++++++++---
 1 file changed, 54 insertions(+), 4 deletions(-)

diff --git a/www/manager6/storage/PBSEdit.js b/www/manager6/storage/PBSEdit.js
index fcbc9548..b273a465 100644
--- a/www/manager6/storage/PBSEdit.js
+++ b/www/manager6/storage/PBSEdit.js
@@ -453,17 +453,67 @@ Ext.define('PVE.storage.PBSInputPanel', {
 	},
     ],
 
+    setValues: function(values) {
+	let me = this;
+
+	let server = values.server;
+	if (values.port !== undefined) {
+	    if (Proxmox.Utils.IP6_match.test(server)) {
+		server = `[${server}]`;
+	    }
+	    server += `:${values.port}`;
+	}
+	values.hostport = server;
+
+	return me.callParent([values]);
+    },
+
     initComponent: function() {
 	var me = this;
 
 	me.column1 = [
 	    {
-		xtype: me.isCreate ? 'textfield' : 'displayfield',
-		name: 'server',
-		value: '',
-		vtype: 'DnsOrIp',
+		xtype: me.isCreate ? 'proxmoxtextfield' : 'displayfield',
 		fieldLabel: gettext('Server'),
 		allowBlank: false,
+		name: 'hostport',
+		submitValue: false,
+		vtype: 'HostPort',
+		listeners: {
+		    change: function(field, newvalue) {
+			let server = newvalue;
+			let port;
+
+			let match = Proxmox.Utils.HostPort_match.exec(newvalue);
+			if (match === null) {
+			    match = Proxmox.Utils.HostPortBrackets_match.exec(newvalue);
+			    if (match === null) {
+				match = Proxmox.Utils.IP6_dotnotation_match.exec(newvalue);
+			    }
+			}
+
+			if (match !== null) {
+			    server = match[1];
+			    if (match[2] !== undefined) {
+				port = match[2];
+			    }
+			}
+
+			field.up('inputpanel').down('field[name=server]').setValue(server);
+			field.up('inputpanel').down('field[name=port]').setValue(port);
+		    },
+		},
+	    },
+	    {
+		xtype: 'proxmoxtextfield',
+		hidden: true,
+		name: 'server',
+	    },
+	    {
+		xtype: 'proxmoxtextfield',
+		hidden: true,
+		deleteEmpty: !me.isCreate,
+		name: 'port',
 	    },
 	    {
 		xtype: me.isCreate ? 'textfield' : 'displayfield',
-- 
2.30.2