ui: backup info: merge not-in-any-job warning into button to save space

We got reports in the forum about accessibility issues, as buttons
where cut-off due to the relatively long warning.

Use the old text as tooltip for the button and add the icon also
there.

Link: https://forum.proxmox.com/threads/120714/#post-526376
Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
This commit is contained in:
Thomas Lamprecht 2023-01-19 17:30:28 +01:00
parent 9a1678c5c5
commit 315feceaa8

View File

@ -514,14 +514,11 @@ Ext.define('PVE.dc.BackupView', {
},
});
let noBackupJobWarning, noBackupJobInfoButton;
let noBackupJobInfoButton;
let reload = function() {
store.load();
not_backed_store.load({
callback: function(records, operation, success) {
noBackupJobWarning.setVisible(records.length > 0);
noBackupJobInfoButton.setVisible(records.length > 0);
},
callback: records => noBackupJobInfoButton.setVisible(records.length > 0),
});
};
@ -726,13 +723,10 @@ Ext.define('PVE.dc.BackupView', {
handler: run_detail,
});
noBackupJobWarning = Ext.create('Ext.toolbar.TextItem', {
html: '<i class="fa fa-fw fa-exclamation-circle"></i>' + gettext('Some guests are not covered by any backup job.'),
hidden: true,
});
noBackupJobInfoButton = new Proxmox.button.Button({
text: gettext('Show'),
text: `${gettext('Show')}: ${gettext('Guests Without Backup Job')}`,
tooltip: gettext('Some guests are not covered by any backup job.'),
iconCls: 'fa fa-fw fa-exclamation-circle',
hidden: true,
handler: run_show_not_backed,
});
@ -763,7 +757,6 @@ Ext.define('PVE.dc.BackupView', {
'-',
run_btn,
'->',
noBackupJobWarning,
noBackupJobInfoButton,
'-',
{