[pve-devel] [PATCH pve-manager 8/8] better formating and UI of task viewer and task list

[Thomas Lamprecht]

[TaskList]:
* format task date on the same node as the title. If space isn't
  there, the date goes on it's own line.
* Truncate output of task status to a maximum of 160 characters to
  fix formating, also the list should only give an overview.
* set list flex to 1, this fixes height and scrolling issues
* Put affected node and status on a own line.

[TaskViewer]
* Only show task status, the exit status is in the log below,
  also some long statuses break this page completely.

Signed-off-by: Thomas Lamprecht <t.lamprecht at proxmox.com>
---
 www/mobile/TaskList.js   | 17 +++++++++++------
 www/mobile/TaskViewer.js |  2 +-
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/www/mobile/TaskList.js b/www/mobile/TaskList.js
index dccb5a0..3d0f711 100644
--- a/www/mobile/TaskList.js
+++ b/www/mobile/TaskList.js
@@ -9,8 +9,7 @@ Ext.define('PVE.TaskListBase', {
 	    },
 	    {
 		xtype: 'list',
-		//flex: 1,
-		height: 800,
+		flex: 1,
 		disableSelection: true,
 		listeners: {
 		    itemsingletap: function(list, index, target, record) {
@@ -19,12 +18,18 @@ Ext.define('PVE.TaskListBase', {
 		    }
 		},
 		itemTpl: [
-		    '<small>{starttime:date("M d H:i:s")} - {endtime:date("M d H:i:s")}</small><br>', 
-		    '{[this.desc(values)]}<br>',
-		    '<small>node: {node} Status: {status}</small>',
+		    '<div style="vertical-align: middle;">' +
+		    '<span>{[this.desc(values)]}</span>',
+		    '<span style=" font-size:small; float: right;">' +
+		    '{starttime:date("M d H:i:s")} - {endtime:date("H:i:s")}' +
+		    '</span></div>',
+		    '<small>node: {node}<br /> Status: {[this.status(values)]}</small>',
 		    {
 			desc: function(values) {
 			    return PVE.Utils.format_task_description(values.type, values.id);
+			},
+			status: function(values) {
+			    return Ext.String.ellipsis(values.status, 160);
 			}
 		    }
 		]
@@ -74,7 +79,7 @@ Ext.define('PVE.ClusterTaskList', {
     },
 
     config: {
-	baseUrl: '/cluster/tasks',
+	baseUrl: '/cluster/tasks'
     },
 
     initialize: function() {
diff --git a/www/mobile/TaskViewer.js b/www/mobile/TaskViewer.js
index 1e6143c..a66f708 100644
--- a/www/mobile/TaskViewer.js
+++ b/www/mobile/TaskViewer.js
@@ -89,7 +89,7 @@ Ext.define('PVE.TaskViewer', {
 		var d = response.result.data;
 		var kv = [];
 
-		kv.push({ key: gettext('Status'), value: d.exitstatus || d.status });
+		kv.push({ key: gettext('Taskstatus'), value: d.status });
 		kv.push({ key: gettext('Node'), value: d.node });
 		kv.push({ key: gettext('User'), value: d.user });
 		kv.push({ key: gettext('Starttime'), value: PVE.Utils.render_timestamp(d.starttime) });
-- 
2.1.4