ui: rework prune job view/edit

Fix missing load on initial view, re-use the prune input panel for
editing and avoid using a tab panel for a single tab, rework also
some columns widths and various other small parts-

Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>

www/config/PruneView.js

@@ -34,15 +34,23 @@ Ext.define('PBS.config.PruneJobView', {
     controller: {
 	xclass: 'Ext.app.ViewController',
 
+	init: function(view) {
+	    let params = {};
+	    if (view.datastore !== undefined) {
+		params.store = view.datastore;
+	    }
+	    view.getStore().rstore.getProxy().setExtraParams(params);
+	    Proxmox.Utils.monStoreErrors(view, view.getStore().rstore);
+	    this.reload();
+	},
+
 	addPruneJob: function() {
 	    let me = this;
 	    let view = me.getView();
             Ext.create('PBS.window.PruneJobEdit', {
 		datastore: view.datastore,
 		listeners: {
-		    destroy: function() {
+		    destroy: () => me.reload(),
-			me.reload();
-		    },
 		},
             }).show();
 	},
@@ -57,9 +65,7 @@ Ext.define('PBS.config.PruneJobView', {
 		datastore: view.datastore,
                 id: selection[0].data.id,
 		listeners: {
-		    destroy: function() {
+		    destroy: () => me.reload(),
-			me.reload();
-		    },
 		},
             }).show();
 	},
@@ -74,8 +80,9 @@ Ext.define('PBS.config.PruneJobView', {
 	    if (!upid) return;
 
 	    Ext.create('Proxmox.window.TaskViewer', {
+		autoShow: true,
 		upid,
-	    }).show();
+	    });
 	},
 
 	runPruneJob: function() {
@@ -90,35 +97,19 @@ Ext.define('PBS.config.PruneJobView', {
 		url: `/admin/prune/${id}/run`,
 		success: function(response, opt) {
 		    Ext.create('Proxmox.window.TaskViewer', {
+			autoShow: true,
 		        upid: response.result.data,
-		        taskDone: function(success) {
+		        taskDone: success => me.reload(),
-			    me.reload();
-		        },
-		    }).show();
-		},
-		failure: function(response, opt) {
-		    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-		},
 		    });
 		},
-
+		failure: response => Ext.Msg.alert(gettext('Error'), response.htmlStatus),
-	render_optional_owner: function(value, metadata, record) {
+	    });
-	    if (!value) return '-';
-	    return Ext.String.htmlEncode(value);
 	},
 
 	startStore: function() { this.getView().getStore().rstore.startUpdate(); },
 	stopStore: function() { this.getView().getStore().rstore.stopUpdate(); },
-
+	reload: function() {
-	reload: function() { this.getView().getStore().rstore.load(); },
+	    this.getView().getStore().rstore.load();
-
-	init: function(view) {
-	    let params = {};
-	    if (view.datastore !== undefined) {
-		params.store = view.datastore;
-	    }
-	    view.getStore().rstore.getProxy().setExtraParams(params);
-	    Proxmox.Utils.monStoreErrors(view, view.getStore().rstore);
 	},
     },
 
@@ -186,7 +177,7 @@ Ext.define('PBS.config.PruneJobView', {
 	    dataIndex: 'id',
 	    renderer: Ext.String.htmlEncode,
 	    maxWidth: 220,
-	    minWidth: 75,
+	    minWidth: 50,
 	    flex: 1,
 	    sortable: true,
 	},
@@ -199,14 +190,15 @@ Ext.define('PBS.config.PruneJobView', {
 	{
 	    header: gettext('Namespace'),
 	    dataIndex: 'ns',
-	    width: 120,
+	    minWidth: 75,
+	    flex: 2,
 	    sortable: true,
 	    renderer: PBS.Utils.render_optional_namespace,
 	},
 	{
-	    header: gettext('Max. Recursion'),
+	    header: gettext('Max. Depth'),
 	    dataIndex: 'max-depth',
-	    width: 40,
+	    width: 90,
 	    sortable: true,
 	},
 	{
@@ -220,7 +212,8 @@ Ext.define('PBS.config.PruneJobView', {
 	{
 	    text: gettext('Keep'),
 	    defaults: {
-		width: 60,
+		minWidth: 60,
+		flex: 1,
 	    },
 	    columns: [
 		['last', gettext('Last')],

www/window/PruneJobEdit.js

@@ -11,9 +11,6 @@ Ext.define('PBS.window.PruneJobEdit', {
 
     subject: gettext('Prune Job'),
 
-    bodyPadding: 0,
-
-    fieldDefaults: { labelWidth: 120 },
     defaultFocus: 'proxmoxtextfield[name=comment]',
 
     cbindData: function(initialConfig) {
@@ -27,7 +24,6 @@ Ext.define('PBS.window.PruneJobEdit', {
 	me.method = id ? 'PUT' : 'POST';
 	me.autoLoad = !!id;
 	me.scheduleValue = id ? null : 'hourly';
-	me.authid = id ? null : Proxmox.UserName;
 	me.editDatastore = me.datastore === undefined && me.isCreate;
 	return { };
     },
@@ -47,14 +43,7 @@ Ext.define('PBS.window.PruneJobEdit', {
 	},
     },
 
-
     items: {
-	xtype: 'tabpanel',
-	bodyPadding: 10,
-	border: 0,
-	items: [
-	    {
-		title: 'Options',
 	xtype: 'inputpanel',
 	onGetValues: function(values) {
 	    let me = this;
@@ -102,6 +91,15 @@ Ext.define('PBS.window.PruneJobEdit', {
 		    },
 		},
 	    },
+	    {
+		xtype: 'pbsNamespaceMaxDepthReduced',
+		name: 'max-depth',
+		fieldLabel: gettext('Max. Depth'),
+		deleteEmpty: true,
+	    },
+	],
+
+	column2: [
 	    {
 		fieldLabel: gettext('Prune Schedule'),
 		xtype: 'pbsCalendarEvent',
@@ -122,52 +120,10 @@ Ext.define('PBS.window.PruneJobEdit', {
 	    },
 	],
 
-		column2: [
-		    {
-			xtype: 'pbsNamespaceMaxDepthReduced',
-			name: 'max-depth',
-			fieldLabel: gettext('Max. Depth'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-last',
-			fieldLabel: gettext('Keep Last'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-hourly',
-			fieldLabel: gettext('Keep Hourly'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-daily',
-			fieldLabel: gettext('Keep Daily'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-weekly',
-			fieldLabel: gettext('Keep Weekly'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-monthly',
-			fieldLabel: gettext('Keep Monthly'),
-			deleteEmpty: true,
-		    },
-		    {
-			xtype: 'pbsPruneKeepInput',
-			name: 'keep-yearly',
-			fieldLabel: gettext('Keep Yearly'),
-			deleteEmpty: true,
-		    },
-		],
-
 	columnB: [
+	    {
+		xtype: 'pbsPruneInputPanel',
+	    },
 	    {
 		fieldLabel: gettext('Comment'),
 		xtype: 'proxmoxtextfield',
@@ -191,6 +147,4 @@ Ext.define('PBS.window.PruneJobEdit', {
 	    },
 	],
     },
-	],
-    },
 });