diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css index 5608a727..51d68711 100644 --- a/www/css/ext6-pbs.css +++ b/www/css/ext6-pbs.css @@ -273,3 +273,7 @@ span.snapshot-comment-column { height: 20px; background-image:url(../images/icon-tape-drive.svg); } + +.info-pointer div.right-aligned { + cursor: pointer; +} diff --git a/www/tape/DriveStatus.js b/www/tape/DriveStatus.js index 3b67ce6f..bf083851 100644 --- a/www/tape/DriveStatus.js +++ b/www/tape/DriveStatus.js @@ -400,6 +400,7 @@ Ext.define('PBS.TapeManagement.DriveInfoPanel', { }, { xtype: 'pmxInfoWidget', + reference: 'statewidget', title: gettext('State'), bind: { data: { @@ -409,6 +410,23 @@ Ext.define('PBS.TapeManagement.DriveInfoPanel', { }, ], + clickState: function(e, t, eOpts) { + let me = this; + let vm = me.getViewModel(); + let drive = vm.get('drive'); + if (t.classList.contains('right-aligned')) { + let upid = drive.state; + if (!upid || !upid.startsWith("UPID")) { + return; + } + + Ext.create('Proxmox.window.TaskViewer', { + autoShow: true, + upid, + }); + } + }, + updateData: function(store) { let me = this; if (!store) { @@ -421,6 +439,16 @@ Ext.define('PBS.TapeManagement.DriveInfoPanel', { let vm = me.getViewModel(); vm.set('drive', record.data); + let stateWidget = me.down('pmxInfoWidget[reference=statewidget]'); + let stateEl = stateWidget.getEl(); + stateEl.removeListener('click', me.clickState); + if (record.data.state) { + stateEl.on('click', me.clickState, me); + stateEl.addCls('info-pointer'); + } else { + stateEl.removeCls('info-pointer'); + } + vm.notify(); },