2019-12-18 17:29:05 +01:00
Ext . define ( 'PBS.Dashboard' , {
extend : 'Ext.panel.Panel' ,
xtype : 'pbsDashboard' ,
controller : {
xclass : 'Ext.app.ViewController' ,
openDashboardOptions : function ( ) {
var me = this ;
var viewModel = me . getViewModel ( ) ;
Ext . create ( 'Ext.window.Window' , {
modal : true ,
width : 300 ,
title : gettext ( 'Dashboard Options' ) ,
layout : {
2020-09-25 18:29:42 +02:00
type : 'auto' ,
2019-12-18 17:29:05 +01:00
} ,
items : [ {
xtype : 'form' ,
bodyPadding : '10 10 10 10' ,
defaultButton : 'savebutton' ,
items : [ {
xtype : 'proxmoxintegerfield' ,
2020-10-06 12:25:25 +02:00
itemId : 'days' ,
2019-12-18 17:29:05 +01:00
labelWidth : 100 ,
anchor : '100%' ,
allowBlank : false ,
minValue : 1 ,
2020-10-06 12:25:25 +02:00
maxValue : 60 ,
value : viewModel . get ( 'days' ) ,
2020-10-06 15:15:18 +02:00
fieldLabel : gettext ( 'Days to show' ) ,
2019-12-18 17:29:05 +01:00
} ] ,
buttons : [ {
text : gettext ( 'Save' ) ,
2020-10-06 12:25:25 +02:00
reference : 'savebutton' ,
2019-12-18 17:29:05 +01:00
formBind : true ,
handler : function ( ) {
var win = this . up ( 'window' ) ;
2020-10-06 12:25:25 +02:00
var days = win . down ( '#days' ) . getValue ( ) ;
me . setDays ( days , true ) ;
2019-12-18 17:29:05 +01:00
win . close ( ) ;
2020-09-25 18:29:42 +02:00
} ,
} ] ,
} ] ,
2019-12-18 17:29:05 +01:00
} ) . show ( ) ;
} ,
2020-10-06 12:25:25 +02:00
setDays : function ( days , setState ) {
2019-12-18 17:29:05 +01:00
var me = this ;
var viewModel = me . getViewModel ( ) ;
2020-10-06 12:25:25 +02:00
viewModel . set ( 'days' , days ) ;
2019-12-18 17:29:05 +01:00
viewModel . notify ( ) ;
2020-10-06 12:25:25 +02:00
viewModel . getStore ( 'tasks' ) . reload ( ) ;
2019-12-18 17:29:05 +01:00
if ( setState ) {
var sp = Ext . state . Manager . getProvider ( ) ;
2020-10-06 12:25:25 +02:00
sp . set ( 'dashboard-days' , days ) ;
2019-12-18 17:29:05 +01:00
}
} ,
updateSubscription : function ( store , records , success ) {
2020-06-12 13:34:07 +02:00
if ( ! success ) { return ; }
let me = this ;
2020-11-02 08:08:25 +01:00
let status = records [ 0 ] . data . status || 'unknown' ;
// 2 = all good, 1 = different leves, 0 = none
let subStatus = status . toLowerCase ( ) === 'active' ? 2 : 0 ;
2020-06-12 13:34:07 +02:00
me . lookup ( 'subscription' ) . setSubStatus ( subStatus ) ;
2019-12-18 17:29:05 +01:00
} ,
updateUsageStats : function ( store , records , success ) {
if ( ! success ) {
return ;
}
if ( records === undefined || records . length < 1 ) {
return ;
}
let me = this ;
let viewmodel = me . getViewModel ( ) ;
let res = records [ 0 ] . data ;
2020-07-10 10:51:13 +02:00
viewmodel . set ( 'fingerprint' , res . info . fingerprint || Proxmox . Utils . unknownText ) ;
2019-12-18 17:29:05 +01:00
let cpu = res . cpu ,
mem = res . memory ,
2020-06-09 10:01:10 +02:00
root = res . root ;
2019-12-18 17:29:05 +01:00
var cpuPanel = me . lookup ( 'cpu' ) ;
cpuPanel . updateValue ( cpu ) ;
var memPanel = me . lookup ( 'mem' ) ;
memPanel . updateValue ( mem . used / mem . total ) ;
2020-06-09 10:01:10 +02:00
var hdPanel = me . lookup ( 'root' ) ;
hdPanel . updateValue ( root . used / root . total ) ;
2019-12-18 17:29:05 +01:00
} ,
2020-07-10 10:51:13 +02:00
showFingerPrint : function ( ) {
let me = this ;
let vm = me . getViewModel ( ) ;
let fingerprint = vm . get ( 'fingerprint' ) ;
Ext . create ( 'Ext.window.Window' , {
modal : true ,
width : 600 ,
title : gettext ( 'Fingerprint' ) ,
layout : 'form' ,
bodyPadding : '10 0' ,
items : [
{
xtype : 'textfield' ,
2020-07-10 11:13:54 +02:00
inputId : 'fingerprintField' ,
2020-07-10 10:51:13 +02:00
value : fingerprint ,
editable : false ,
} ,
] ,
buttons : [
{
2020-07-10 11:13:54 +02:00
xtype : 'button' ,
2020-07-10 11:17:20 +02:00
iconCls : 'fa fa-clipboard' ,
2020-07-10 11:13:54 +02:00
handler : function ( b ) {
var el = document . getElementById ( 'fingerprintField' ) ;
el . select ( ) ;
document . execCommand ( "copy" ) ;
} ,
2020-09-25 18:29:42 +02:00
text : gettext ( 'Copy' ) ,
2020-07-10 11:13:54 +02:00
} ,
{
2020-07-10 11:17:20 +02:00
text : gettext ( 'Ok' ) ,
2020-07-10 10:51:13 +02:00
handler : function ( ) {
this . up ( 'window' ) . close ( ) ;
} ,
} ,
] ,
} ) . show ( ) ;
} ,
2020-06-12 13:34:06 +02:00
updateTasks : function ( store , records , success ) {
if ( ! success ) return ;
let me = this ;
2020-10-06 12:25:27 +02:00
let viewModel = me . getViewModel ( ) ;
2020-06-12 13:34:06 +02:00
records . sort ( ( a , b ) => a . data . duration - b . data . duration ) ;
let top10 = records . slice ( - 10 ) ;
me . lookup ( 'longesttasks' ) . updateTasks ( top10 ) ;
let data = {
2020-09-25 18:29:42 +02:00
backup : { error : 0 , warning : 0 , ok : 0 } ,
prune : { error : 0 , warning : 0 , ok : 0 } ,
garbage _collection : { error : 0 , warning : 0 , ok : 0 } ,
sync : { error : 0 , warning : 0 , ok : 0 } ,
2020-10-06 12:25:27 +02:00
verify : { error : 0 , warning : 0 , ok : 0 } ,
2020-06-12 13:34:06 +02:00
} ;
records . forEach ( record => {
2020-10-06 15:16:00 +02:00
let task = record . data ;
let type = task . worker _type ;
2020-06-12 13:34:06 +02:00
if ( type === 'syncjob' ) {
type = 'sync' ;
}
2021-02-03 14:15:57 +01:00
if ( type . startsWith ( 'verif' ) ) {
2020-10-06 12:25:27 +02:00
type = 'verify' ;
}
2020-10-06 15:16:00 +02:00
if ( data [ type ] && task . status ) {
let parsed = Proxmox . Utils . parse _task _status ( task . status ) ;
2020-06-12 13:34:06 +02:00
data [ type ] [ parsed ] ++ ;
}
} ) ;
2020-10-06 12:25:28 +02:00
me . lookup ( 'tasksummary' ) . updateTasks ( data , viewModel . get ( 'sinceEpoch' ) ) ;
2020-06-12 13:34:06 +02:00
} ,
2019-12-18 17:29:05 +01:00
init : function ( view ) {
var me = this ;
var sp = Ext . state . Manager . getProvider ( ) ;
2020-10-06 12:25:25 +02:00
var days = sp . get ( 'dashboard-days' ) || 30 ;
me . setDays ( days , false ) ;
2020-09-25 18:29:42 +02:00
} ,
2019-12-18 17:29:05 +01:00
} ,
viewModel : {
data : {
2020-07-10 10:51:13 +02:00
fingerprint : "" ,
2020-10-06 12:25:25 +02:00
days : 30 ,
2019-12-18 17:29:05 +01:00
} ,
2020-07-10 10:51:13 +02:00
formulas : {
disableFPButton : ( get ) => get ( 'fingerprint' ) === "" ,
2020-10-06 12:25:25 +02:00
sinceEpoch : ( get ) => ( Date . now ( ) / 1000 - get ( 'days' ) * 24 * 3600 ) . toFixed ( 0 ) ,
2020-07-10 10:51:13 +02:00
} ,
2019-12-18 17:29:05 +01:00
stores : {
usage : {
storeid : 'dash-usage' ,
type : 'update' ,
interval : 3000 ,
autoStart : true ,
autoLoad : true ,
autoDestroy : true ,
proxy : {
type : 'proxmox' ,
2020-09-25 18:29:42 +02:00
url : '/api2/json/nodes/localhost/status' ,
2019-12-18 17:29:05 +01:00
} ,
listeners : {
2020-09-25 18:29:42 +02:00
load : 'updateUsageStats' ,
} ,
2019-12-18 17:29:05 +01:00
} ,
subscription : {
storeid : 'dash-subscription' ,
type : 'update' ,
interval : 10000 ,
autoStart : true ,
autoLoad : true ,
autoDestroy : true ,
proxy : {
type : 'proxmox' ,
2020-09-25 18:29:42 +02:00
url : '/api2/json/nodes/localhost/subscription' ,
2019-12-18 17:29:05 +01:00
} ,
listeners : {
2020-09-25 18:29:42 +02:00
load : 'updateSubscription' ,
} ,
2019-12-18 17:29:05 +01:00
} ,
2020-06-12 13:34:06 +02:00
tasks : {
storeid : 'dash-tasks' ,
type : 'update' ,
interval : 15000 ,
autoStart : true ,
autoLoad : true ,
autoDestroy : true ,
model : 'proxmox-tasks' ,
proxy : {
type : 'proxmox' ,
2020-10-30 15:02:12 +01:00
url : '/api2/json/nodes/localhost/tasks' ,
2020-10-06 12:25:25 +02:00
extraParams : {
2020-10-30 15:02:12 +01:00
limit : 0 ,
2020-10-06 12:25:25 +02:00
since : '{sinceEpoch}' ,
} ,
2020-06-12 13:34:06 +02:00
} ,
listeners : {
2020-09-25 18:29:42 +02:00
load : 'updateTasks' ,
} ,
2020-06-12 13:34:06 +02:00
} ,
2020-09-25 18:29:42 +02:00
} ,
2019-12-18 17:29:05 +01:00
} ,
2020-10-06 12:25:25 +02:00
title : gettext ( 'Dashboard' ) ,
2019-12-18 17:29:05 +01:00
layout : {
2020-09-25 18:29:42 +02:00
type : 'column' ,
2019-12-18 17:29:05 +01:00
} ,
bodyPadding : '20 0 0 20' ,
defaults : {
columnWidth : 0.49 ,
xtype : 'panel' ,
2020-09-25 18:29:42 +02:00
margin : '0 20 20 0' ,
2019-12-18 17:29:05 +01:00
} ,
2020-10-06 12:25:25 +02:00
tools : [
{
type : 'gear' ,
2020-10-06 15:15:43 +02:00
tooltip : gettext ( 'Edit dashboard settings' ) ,
2020-10-06 12:25:25 +02:00
handler : 'openDashboardOptions' ,
} ,
] ,
2019-12-18 17:29:05 +01:00
scrollable : true ,
items : [
{
height : 250 ,
iconCls : 'fa fa-tasks' ,
title : gettext ( 'Server Resources' ) ,
bodyPadding : '0 20 0 20' ,
2020-07-10 10:51:13 +02:00
tools : [
{
xtype : 'button' ,
text : gettext ( 'Show Fingerprint' ) ,
handler : 'showFingerPrint' ,
bind : {
disabled : '{disableFPButton}' ,
} ,
} ,
] ,
2019-12-18 17:29:05 +01:00
layout : {
type : 'hbox' ,
2020-09-25 18:29:42 +02:00
align : 'center' ,
2019-12-18 17:29:05 +01:00
} ,
defaults : {
xtype : 'proxmoxGauge' ,
spriteFontSize : '20px' ,
2020-09-25 18:29:42 +02:00
flex : 1 ,
2019-12-18 17:29:05 +01:00
} ,
items : [
{
title : gettext ( 'CPU' ) ,
2020-09-25 18:29:42 +02:00
reference : 'cpu' ,
2019-12-18 17:29:05 +01:00
} ,
{
title : gettext ( 'Memory' ) ,
2020-09-25 18:29:42 +02:00
reference : 'mem' ,
2019-12-18 17:29:05 +01:00
} ,
{
2020-06-09 10:01:10 +02:00
title : gettext ( 'Root Disk' ) ,
2020-09-25 18:29:42 +02:00
reference : 'root' ,
} ,
] ,
2019-12-18 17:29:05 +01:00
} ,
2020-06-09 10:01:14 +02:00
{
xtype : 'pbsDatastoresStatistics' ,
height : 250 ,
} ,
2019-12-18 17:29:05 +01:00
{
2020-06-12 13:34:06 +02:00
xtype : 'pbsLongestTasks' ,
2020-10-06 12:25:25 +02:00
bind : {
title : gettext ( 'Longest Tasks' ) + ' (' +
Ext . String . format ( gettext ( '{0} days' ) , '{days}' ) + ')' ,
} ,
2020-06-12 13:34:06 +02:00
reference : 'longesttasks' ,
2019-12-18 17:29:05 +01:00
height : 250 ,
2020-06-12 13:34:06 +02:00
} ,
{
xtype : 'pbsRunningTasks' ,
height : 250 ,
} ,
{
2020-10-06 12:25:25 +02:00
bind : {
title : gettext ( 'Task Summary' ) + ' (' +
Ext . String . format ( gettext ( '{0} days' ) , '{days}' ) + ')' ,
} ,
2020-06-12 13:34:06 +02:00
xtype : 'pbsTaskSummary' ,
2020-11-10 08:12:35 +01:00
height : 200 ,
2020-06-12 13:34:06 +02:00
reference : 'tasksummary' ,
} ,
{
iconCls : 'fa fa-ticket' ,
title : 'Subscription' ,
2020-11-10 08:12:35 +01:00
height : 200 ,
2020-06-12 13:34:06 +02:00
reference : 'subscription' ,
2020-06-12 13:34:07 +02:00
xtype : 'pbsSubscriptionInfo' ,
2019-12-18 17:29:05 +01:00
} ,
2020-09-25 18:29:42 +02:00
] ,
2019-12-18 17:29:05 +01:00
} ) ;
2020-06-12 13:34:07 +02:00
Ext . define ( 'PBS.dashboard.SubscriptionInfo' , {
2019-12-18 17:29:05 +01:00
extend : 'Ext.panel.Panel' ,
2020-06-12 13:34:07 +02:00
xtype : 'pbsSubscriptionInfo' ,
2019-12-18 17:29:05 +01:00
style : {
2020-09-25 18:29:42 +02:00
cursor : 'pointer' ,
2019-12-18 17:29:05 +01:00
} ,
2020-06-12 13:34:07 +02:00
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>' ,
} ,
] ,
2019-12-18 17:29:05 +01:00
setSubStatus : function ( status ) {
var me = this ;
2020-06-12 13:34:07 +02:00
let icon = '' ;
let message = '' ;
2019-12-18 17:29:05 +01:00
switch ( status ) {
case 2 :
2020-06-12 13:34:07 +02:00
icon = 'check good' ;
message = gettext ( 'Your subscription status is valid.' ) ;
2019-12-18 17:29:05 +01:00
break ;
2019-12-18 19:21:59 +01:00
case 1 :
2020-06-12 13:34:07 +02:00
icon = 'exclamation-triangle warning' ;
message = gettext ( 'Warning: Your subscription levels are not the same.' ) ;
2019-12-18 17:29:05 +01:00
break ;
2019-12-18 19:21:59 +01:00
case 0 :
2020-06-12 13:34:07 +02:00
icon = 'times-circle critical' ;
2020-11-25 00:21:04 +01:00
message = ` <h1> ${ gettext ( 'No valid subscription' ) } </h1> ${ PBS . Utils . noSubKeyHtml } ` ;
2019-12-18 17:29:05 +01:00
break ;
default :
throw 'invalid subscription status' ;
}
2020-06-12 13:34:07 +02:00
me . getComponent ( 'icon' ) . update ( { icon } ) ;
me . getComponent ( 'message' ) . update ( { message } ) ;
2019-12-18 17:29:05 +01:00
} ,
listeners : {
click : {
element : 'body' ,
fn : function ( ) {
var mainview = this . component . up ( 'mainview' ) ;
2020-06-12 13:34:07 +02:00
mainview . getController ( ) . redirectTo ( 'pbsSubscription' ) ;
2020-09-25 18:29:42 +02:00
} ,
} ,
} ,
2019-12-18 17:29:05 +01:00
} ) ;