ui: window/Settings: add summarycolumns settings

like in pve

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>

www/Dashboard.js

@@ -111,6 +111,13 @@ Ext.define('PBS.Dashboard', {
 	    var sp = Ext.state.Manager.getProvider();
 	    var days = sp.get('dashboard-days') || 30;
 	    me.setDays(days, false);
+
+	    view.mon(sp, 'statechange', function(provider, key, value) {
+		if (key !== 'summarycolumns') {
+		    return;
+		}
+		Proxmox.Utils.updateColumns(view);
+	    });
 	},
     },
 
@@ -162,6 +169,12 @@ Ext.define('PBS.Dashboard', {
 	},
     },
 
+    listeners: {
+	resize: function(panel) {
+	    Proxmox.Utils.updateColumns(panel);
+	},
+    },
+
     title: gettext('Dashboard'),
 
     layout: {
@@ -170,6 +183,8 @@ Ext.define('PBS.Dashboard', {
 
     bodyPadding: '20 0 0 20',
 
+    minWidth: 700,
+
     defaults: {
 	columnWidth: 0.49,
 	xtype: 'panel',

www/ServerStatus.js

@@ -186,6 +186,11 @@ Ext.define('PBS.ServerStatus', {
 	    itemId: 'itemcontainer',
 	    layout: 'column',
 	    minWidth: 700,
+	    listeners: {
+		resize: function(panel) {
+		    Proxmox.Utils.updateColumns(panel);
+		},
+	    },
 	    defaults: {
 		minHeight: 320,
 		padding: 5,
@@ -267,6 +272,14 @@ Ext.define('PBS.ServerStatus', {
 	};
 
 	me.callParent();
+
+	let sp = Ext.state.Manager.getProvider();
+	me.mon(sp, 'statechange', function(provider, key, value) {
+	    if (key !== 'summarycolumns') {
+		return;
+	    }
+	    Proxmox.Utils.updateColumns(me.getComponent('itemcontainer'));
+	});
     },
 
 });

www/datastore/Summary.js

@@ -244,6 +244,9 @@ Ext.define('PBS.DataStoreSummary', {
 	activate: function() { this.rrdstore.startUpdate(); },
 	deactivate: function() { this.rrdstore.stopUpdate(); },
 	destroy: function() { this.rrdstore.stopUpdate(); },
+	resize: function(panel) {
+	    Proxmox.Utils.updateColumns(panel);
+	},
     },
 
     initComponent: function() {
@@ -256,6 +259,14 @@ Ext.define('PBS.DataStoreSummary', {
 
 	me.callParent();
 
+	let sp = Ext.state.Manager.getProvider();
+	me.mon(sp, 'statechange', function(provider, key, value) {
+	    if (key !== 'summarycolumns') {
+		return;
+	    }
+	    Proxmox.Utils.updateColumns(me);
+	});
+
 	Proxmox.Utils.API2Request({
 	    url: `/config/datastore/${me.datastore}`,
 	    waitMsgTarget: me.down('pbsDataStoreInfo'),

www/window/Settings.js

@@ -30,6 +30,9 @@ Ext.define('PBS.window.Settings', {
 	    let username = sp.get('login-username') || Proxmox.Utils.noneText;
 	    me.lookupReference('savedUserName').setValue(Ext.String.htmlEncode(username));
 
+	    let summarycolumns = sp.get('summarycolumns', 'auto');
+	    me.lookup('summarycolumns').setValue(summarycolumns);
+
 	    let settings = ['fontSize', 'fontFamily', 'letterSpacing', 'lineHeight'];
 	    settings.forEach(function(setting) {
 		let val = localStorage.getItem('pve-xterm-' + setting);
@@ -114,6 +117,12 @@ Ext.define('PBS.window.Settings', {
 		    sp.clear('login-username');
 		},
 	    },
+	    'field[reference=summarycolumns]': {
+		change: function(el, newValue) {
+		    var sp = Ext.state.Manager.getProvider();
+		    sp.set('summarycolumns', newValue);
+		},
+	    },
 	},
     },
 
@@ -174,6 +183,23 @@ Ext.define('PBS.window.Settings', {
 		    },
 		],
 	    },
+	    {
+		xtype: 'box',
+		autoEl: { tag: 'hr' },
+	    },
+	    {
+		xtype: 'proxmoxKVComboBox',
+		fieldLabel: gettext('Summary/Dashboard columns') + ':',
+		labelWidth: 150,
+		stateId: 'summarycolumns',
+		reference: 'summarycolumns',
+		comboItems: [
+		    ['auto', 'auto'],
+		    ['1', '1'],
+		    ['2', '2'],
+		    ['3', '3'],
+		],
+	    },
 	],
     },
     {