From 7aa4851b773140f01f68a7f9e9efd476913ab800 Mon Sep 17 00:00:00 2001
From: Dietmar Maurer <dietmar@proxmox.com>
Date: Thu, 18 Feb 2021 12:48:54 +0100
Subject: [PATCH] ui: start tape backup job GUI

---
 www/Makefile               |   1 +
 www/tape/BackupJobs.js     | 111 +++++++++++++++++++++++++++++++++++++
 www/tape/TapeManagement.js |   5 ++
 3 files changed, 117 insertions(+)
 create mode 100644 www/tape/BackupJobs.js

diff --git a/www/Makefile b/www/Makefile
index b82a91ed..bfe6fe25 100644
--- a/www/Makefile
+++ b/www/Makefile
@@ -31,6 +31,7 @@ TAPE_UI_FILES=						\
 	tape/EncryptionKeys.js				\
 	tape/PoolConfig.js				\
 	tape/TapeInventory.js				\
+	tape/BackupJobs.js				\
 	tape/TapeManagement.js				\
 
 endif
diff --git a/www/tape/BackupJobs.js b/www/tape/BackupJobs.js
new file mode 100644
index 00000000..e2c03365
--- /dev/null
+++ b/www/tape/BackupJobs.js
@@ -0,0 +1,111 @@
+Ext.define('pbs-tape-backup-job-status', {
+    extend: 'Ext.data.Model',
+    fields: [
+	'id', 'store', 'pool', 'drive', 'store', 'schedule', 'comment',
+	{ name: 'eject-media', type: 'boolean' },
+	{ name: 'export-media-set', type: 'boolean' }
+    ],
+    idProperty: 'id',
+    proxy: {
+	type: 'proxmox',
+	url: '/api2/json/config/tape-backup-job',
+    },
+});
+
+Ext.define('PBS.config.TapeBackupJobView', {
+    extend: 'Ext.grid.GridPanel',
+    alias: 'widget.pbsTapeBackupJobView',
+
+    stateful: true,
+    stateId: 'grid-tape-backup-jobs-v1',
+
+    title: gettext('Tape Backup Jobs'),
+
+    controller: {
+	xclass: 'Ext.app.ViewController',
+
+	startStore: function() { this.getView().getStore().rstore.startUpdate(); },
+
+	stopStore: function() { this.getView().getStore().rstore.stopUpdate(); },
+
+	reload: function() { this.getView().getStore().rstore.load(); },
+
+	init: function(view) {
+	    Proxmox.Utils.monStoreErrors(view, view.getStore().rstore);
+	}
+    },
+
+    listeners: {
+	activate: 'startStore',
+	deactivate: 'stopStore',
+	//itemdblclick: 'editSyncJob',
+    },
+
+    store: {
+	type: 'diff',
+	autoDestroy: true,
+	autoDestroyRstore: true,
+	sorters: 'id',
+	rstore: {
+	    type: 'update',
+	    storeid: 'pbs-tape-backup-job-status',
+	    model: 'pbs-tape-backup-job-status',
+	    interval: 5000,
+	},
+    },
+
+    viewConfig: {
+	trackOver: false,
+    },
+
+    columns: [
+	{
+	    header: gettext('Job ID'),
+	    dataIndex: 'id',
+	    renderer: Ext.String.htmlEncode,
+	    maxWidth: 220,
+	    minWidth: 75,
+	    flex: 1,
+	    sortable: true,
+	},
+	{
+	    header: gettext('Datastore'),
+	    dataIndex: 'store',
+	    width: 120,
+	    sortable: true,
+	},
+	{
+	    header: gettext('Media Pool'),
+	    dataIndex: 'pool',
+	    width: 120,
+	    sortable: true,
+	},
+	{
+	    header: gettext('Drive'),
+	    dataIndex: 'drive',
+	    width: 120,
+	    sortable: true,
+	},
+	{
+	    header: gettext('Schedule'),
+	    dataIndex: 'schedule',
+	    maxWidth: 220,
+	    minWidth: 80,
+	    flex: 1,
+	    sortable: true,
+	},
+	{
+	    header: gettext('Comment'),
+	    dataIndex: 'comment',
+	    renderer: Ext.String.htmlEncode,
+	    flex: 2,
+	    sortable: true,
+	},
+    ],
+
+    initComponent: function() {
+	let me = this;
+
+	me.callParent();
+    }
+});
diff --git a/www/tape/TapeManagement.js b/www/tape/TapeManagement.js
index c0c4409c..265b2b77 100644
--- a/www/tape/TapeManagement.js
+++ b/www/tape/TapeManagement.js
@@ -46,5 +46,10 @@ Ext.define('PBS.TapeManagement', {
 	    itemId: 'encryption-keys',
 	    xtype: 'pbsEncryptionKeys',
 	},
+	{
+	    title: gettext('Backup Jobs'),
+	    itemId: 'tape-backup-jobs',
+	    xtype: 'pbsTapeBackupJobView',
+	},
     ],
 });