tyler/proxmox-backup
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ui: Dashboard: implement subscription panel

Browse Source 
and make it nicer

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
Signed-off-by: Wolfgang Bumiller <w.bumiller@proxmox.com>
This commit is contained in:
Dominik Csapak 2020-06-12 13:34:07 +02:00 committed by Wolfgang Bumiller
parent 195d7c90ce
commit 739a51459a
1 changed files with 44 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
www/Dashboard.js
View File

@ -59,14 +59,10 @@ Ext.define('PBS.Dashboard', {
updateSubscription: function(store, records, success) { updateSubscription: function(store, records, success) {
if (!success) { if (!success) { return; }
return; let me = this;
} let subStatus = records[0].data.status === 'Active' ? 2 : 0; // 2 = all good, 1 = different leves, 0 = none
var me = this; me.lookup('subscription').setSubStatus(subStatus);
var viewmodel = me.getViewModel();
var subStatus = 2; // 2 = all good, 1 = different leves, 0 = none
var subLevel = "";
}, },
updateUsageStats: function(store, records, success) { updateUsageStats: function(store, records, success) {
@ -261,60 +257,76 @@ Ext.define('PBS.Dashboard', {
title: 'Subscription', title: 'Subscription',
height: 166, height: 166,
reference: 'subscription', reference: 'subscription',
xtype: 'pmgSubscriptionInfo', xtype: 'pbsSubscriptionInfo',
}, },
] ]
}); });
Ext.define('PMG.dashboard.SubscriptionInfo', { Ext.define('PBS.dashboard.SubscriptionInfo', {
extend: 'Ext.panel.Panel', extend: 'Ext.panel.Panel',
xtype: 'pmgSubscriptionInfo', xtype: 'pbsSubscriptionInfo',
data: {
icon: 'question-circle',
message: gettext('Unknown')
},
style: { style: {
cursor: 'pointer' cursor: 'pointer'
}, },
layout: {
type: 'hbox',
align: 'middle',
},
items: [
{
xtype: 'box',
itemId: 'icon',
data: {
icon: 'question-circle',
},
width: 100,
tpl: '<center><i class="fa fa-3x fa-{icon}"></i></center>',
},
{
flex: 1,
xtype: 'box',
data: {
message: gettext('Unknown'),
},
itemId: 'message',
tpl: '<center>{message}</center>',
},
],
setSubStatus: function(status) { setSubStatus: function(status) {
var me = this; var me = this;
var data = {}; let icon = '';
let message = '';
switch (status) { switch (status) {
case 2: case 2:
data.icon = 'check green'; icon = 'check good';
data.message = gettext('Your subscription status is valid.'); message = gettext('Your subscription status is valid.');
break; break;
case 1: case 1:
data.icon = 'exclamation-triangle yellow'; icon = 'exclamation-triangle warning';
data.message = gettext('Warning: Your subscription levels are not the same.'); message = gettext('Warning: Your subscription levels are not the same.');
break; break;
case 0: case 0:
data.icon = 'times-circle red'; icon = 'times-circle critical';
data.message = gettext('You have at least one node without subscription.'); message = gettext('This node does not have a subscription.');
break; break;
default: default:
throw 'invalid subscription status'; throw 'invalid subscription status';
} }
me.update(data); me.getComponent('icon').update({ icon });
me.getComponent('message').update({ message });
}, },
tpl: [
'<table style="height: 100%;" class="dash">',
'<tr><td class="center">',
'<i class="fa fa-3x fa-{icon}"></i>',
'</td><td class="center">{message}</td></tr>',
'</table>'
],
listeners: { listeners: {
click: { click: {
element: 'body', element: 'body',
fn: function() { fn: function() {
var mainview = this.component.up('mainview'); var mainview = this.component.up('mainview');
mainview.getController().redirectTo('pmgSubscription'); mainview.getController().redirectTo('pbsSubscription');
} }
} }
} }