[pbs-devel] [PATCH proxmox-backup 1/3] ui: tape: improve tape-erase and add it to library view

[pbs-devel] [PATCH proxmox-backup 1/3] ui: tape: improve tape-erase and add it to library view

[Dominik Csapak]

refactor erase window, limit drives to changer if given

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/Makefile              |  1 +
 www/tape/ChangerStatus.js | 23 ++++++++++++++++++
 www/tape/TapeInventory.js | 42 ++++++--------------------------
 www/tape/window/Erase.js  | 51 +++++++++++++++++++++++++++++++++++++++
 4 files changed, 83 insertions(+), 34 deletions(-)
 create mode 100644 www/tape/window/Erase.js

diff --git a/www/Makefile b/www/Makefile
index 8391e68f..b82a91ed 100644
--- a/www/Makefile
+++ b/www/Makefile
@@ -18,6 +18,7 @@ TAPE_UI_FILES=						\
 	tape/form/KeySelector.js			\
 	tape/window/ChangerEdit.js			\
 	tape/window/DriveEdit.js			\
+	tape/window/Erase.js			\
 	tape/window/EncryptionEdit.js			\
 	tape/window/LabelMedia.js			\
 	tape/window/PoolEdit.js				\
diff --git a/www/tape/ChangerStatus.js b/www/tape/ChangerStatus.js
index 017759c7..c51dea4b 100644
--- a/www/tape/ChangerStatus.js
+++ b/www/tape/ChangerStatus.js
@@ -91,6 +91,23 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 	    }).show();
 	},
 
+	erase: function(view, rI, cI, button, el, record) {
+	    let me = this;
+	    let vm = me.getViewModel();
+	    let label = record.data['label-text'];
+
+	    let changer = vm.get('changer');
+	    Ext.create('PBS.TapeManagement.EraseWindow', {
+		label,
+		changer,
+		listeners: {
+		    destroy: function() {
+			me.reload();
+		    },
+		},
+	    }).show();
+	},
+
 	load: function(view, rI, cI, button, el, record) {
 	    let me = this;
 	    let vm = me.getViewModel();
@@ -566,6 +583,12 @@ Ext.define('PBS.TapeManagement.ChangerStatus', {
 				    tooltip: gettext('Transfer'),
 				    isDisabled: (v, r, c, i, rec) => !rec.data['label-text'],
 				},
+				{
+				    iconCls: 'fa fa-trash-o',
+				    handler: 'erase',
+				    tooltip: gettext('Erase'),
+				    isDisabled: (v, r, c, i, rec) => !rec.data['label-text'],
+				},
 				{
 				    iconCls: 'fa fa-rotate-90 fa-upload',
 				    handler: 'load',
diff --git a/www/tape/TapeInventory.js b/www/tape/TapeInventory.js
index ec10f5c9..c369a393 100644
--- a/www/tape/TapeInventory.js
+++ b/www/tape/TapeInventory.js
@@ -41,40 +41,14 @@ Ext.define('PBS.TapeManagement.TapeInventory', {
 		return;
 	    }
 	    let label = selection[0].data['label-text'];
-	    Ext.create('Proxmox.window.Edit', {
-		title: gettext('Erase'),
-		url: `/api2/extjs/tape/drive`,
-		showProgress: true,
-		submitUrl: function(url, values) {
-		    let drive = values.drive;
-		    delete values.drive;
-		    return `${url}/${drive}/erase-media`;
-		},
-		method: 'POST',
-		items: [
-		    {
-			xtype: 'displayfield',
-			cls: 'pmx-hint',
-			value: gettext('Make sure to insert the tape into the selected drive.'),
-		    },
-		    {
-			xtype: 'pbsDriveSelector',
-			fieldLabel: gettext('Drive'),
-			name: 'drive',
-		    },
-		    {
-			xtype: 'displayfield',
-			name: 'label-text',
-			value: label,
-			submitValue: true,
-			fieldLabel: gettext('Media'),
-		    },
-		    {
-			xtype: 'proxmoxcheckbox',
-			fieldLabel: gettext('Fast Erase'),
-			name: 'fast',
-		    },
-		],
+	    let inChanger = selection[0].data.location.startsWith('online-');
+	    let changer;
+	    if (inChanger) {
+		changer = selection[0].data.location.slice("online-".length);
+	    }
+	    Ext.create('PBS.TapeManagement.EraseWindow', {
+		label,
+		changer,
 		listeners: {
 		    destroy: function() {
 			me.reload();
diff --git a/www/tape/window/Erase.js b/www/tape/window/Erase.js
new file mode 100644
index 00000000..61bd2130
--- /dev/null
+++ b/www/tape/window/Erase.js
@@ -0,0 +1,51 @@
+Ext.define('PBS.TapeManagement.EraseWindow', {
+    extend: 'Proxmox.window.Edit',
+    mixins: ['Proxmox.Mixin.CBind'],
+
+
+    changer: undefined,
+    label: undefined,
+
+    cbindData: function(config) {
+	let me = this;
+	return {};
+    },
+
+    title: gettext('Erase'),
+    url: `/api2/extjs/tape/drive`,
+    showProgress: true,
+    submitUrl: function(url, values) {
+	let drive = values.drive;
+	delete values.drive;
+	return `${url}/${drive}/erase-media`;
+    },
+
+    method: 'POST',
+    items: [
+	{
+	    xtype: 'displayfield',
+	    cls: 'pmx-hint',
+	    value: gettext('Make sure to insert the tape into the selected drive.'),
+	    cbind: {
+		hidden: '{changer}',
+	    },
+	},
+	{
+	    xtype: 'displayfield',
+	    name: 'label-text',
+	    submitValue: true,
+	    fieldLabel: gettext('Media'),
+	    cbind: {
+		value: '{label}',
+	    },
+	},
+	{
+	    xtype: 'pbsDriveSelector',
+	    fieldLabel: gettext('Drive'),
+	    name: 'drive',
+	    cbind: {
+		changer: '{changer}',
+	    },
+	},
+    ],
+});
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 2/3] ui: css: remove vertical align for pbs-tape-icon

[Dominik Csapak]

and combine the unnecessary duplicate definition

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/css/ext6-pbs.css | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css
index ff6cb382..ee54ddac 100644
--- a/www/css/ext6-pbs.css
+++ b/www/css/ext6-pbs.css
@@ -260,12 +260,7 @@ span.snapshot-comment-column {
 {
     background-repeat: no-repeat;
     background-position: bottom;
-    vertical-align: bottom;
     padding: 0;
-}
-
-.pbs-icon-tape
-{
     background-size: 16px;
     height: 20px;
     background-image:url(../images/icon-tape.svg);
-- 
2.20.1

[pbs-devel] [PATCH proxmox-backup 3/3] ui: tape/BackupOverview: insert the tapes between media-set and snapshot

[Dominik Csapak]

but auto-expand them, so no additional click is necessary

this shows the user which tapes are involved for the media sets

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 www/tape/BackupOverview.js | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/www/tape/BackupOverview.js b/www/tape/BackupOverview.js
index a5bbfc09..4b4c02ff 100644
--- a/www/tape/BackupOverview.js
+++ b/www/tape/BackupOverview.js
@@ -129,6 +129,8 @@ Ext.define('PBS.TapeManagement.BackupOverview', {
 
 		list.result.data.sort((a, b) => a.snapshot.localeCompare(b.snapshot));
 
+		let tapes = {};
+
 		for (let entry of list.result.data) {
 		    entry.text = entry.snapshot;
 		    entry.leaf = true;
@@ -137,7 +139,23 @@ Ext.define('PBS.TapeManagement.BackupOverview', {
 		    if (iconCls !== '') {
 			entry.iconCls = `fa ${iconCls}`;
 		    }
-		    node.appendChild(entry);
+
+		    let tape = entry['label-text'];
+		    if (tapes[tape] === undefined) {
+			tapes[tape] = {
+			    text: tape,
+			    'media-set-uuid': entry['media-set-uuid'],
+			    'seq-nr': entry['seq-nr'],
+			    iconCls: 'pbs-icon-tape',
+			    expanded: true,
+			    children: [],
+			};
+		    }
+		    tapes[tape].children.push(entry);
+		}
+
+		for (const tape of Object.values(tapes)) {
+		    node.appendChild(tape);
 		}
 
 		if (list.result.data.length === 0) {
@@ -198,7 +216,7 @@ Ext.define('PBS.TapeManagement.BackupOverview', {
 	    text: gettext('Restore Media Set'),
 	    handler: 'restore',
 	    parentXType: 'treepanel',
-	    enableFn: (rec) => !!rec.data.uuid,
+	    enableFn: (rec) => !!rec.data['media-set-uuid'],
 	},
     ],
 
-- 
2.20.1

[pbs-devel] applied: [PATCH proxmox-backup 1/3] ui: tape: improve tape-erase and add it to library view

[Dietmar Maurer]

applied all 3 patches