proxmox-backup/www/ServerStatus.js

Ext.define('pve-rrd-node', {
    extend: 'Ext.data.Model',
    fields: [
	{
	    name: 'cpu',
	    // percentage
	    convert: function(value) {
		return value*100;
	    },
	},
	{
	    name: 'iowait',
	    // percentage
	    convert: function(value) {
		return value*100;
	    },
	},
	'netin',
	'netout',
	'memtotal',
	'memused',
	'swaptotal',
	'swapused',
	'total',
	'used',
	'read_ios',
	'read_bytes',
        'write_ios',
	'write_bytes',
        'io_ticks',
	{
	    name: 'io_delay', calculate: function(data) {
		let ios = 0;
		if (data.read_ios !== undefined) { ios += data.read_ios; }
		if (data.write_ios !== undefined) { ios += data.write_ios; }
		if (ios === 0 || data.io_ticks === undefined) {
		    return undefined;
		}
		return (data.io_ticks*1000.0)/ios;
	    },
	},
	'loadavg',
	{ type: 'date', dateFormat: 'timestamp', name: 'time' },
    ],
});
Ext.define('PBS.ServerStatus', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.pbsServerStatus',

    title: gettext('Server Status'),

    scrollable: true,

    showVersions: function() {
	let me = this;

	// Note: use simply text/html here, as ExtJS grid has problems with cut&paste
	let panel = Ext.createWidget('component', {
	    autoScroll: true,
	    id: 'pkgversions',
	    padding: 5,
	    style: {
		'white-space': 'pre',
		'font-family': 'monospace',
	    },
	});

	let win = Ext.create('Ext.window.Window', {
	    title: gettext('Package versions'),
	    width: 600,
	    height: 600,
	    layout: 'fit',
	    modal: true,
	    items: [panel],
	    buttons: [
		{
		    xtype: 'button',
		    iconCls: 'fa fa-clipboard',
		    handler: async function(button) {
			let el = document.getElementById('pkgversions');
			await navigator.clipboard.writeText(el.textContent);
		    },
		    text: gettext('Copy'),
		},
		{
		    text: gettext('Ok'),
		    handler: function() {
			this.up('window').close();
		    },
		},
	    ],
	});

	Proxmox.Utils.API2Request({
	    waitMsgTarget: me,
	    url: `/nodes/localhost/apt/versions`,
	    method: 'GET',
	    failure: function(response, opts) {
		win.close();
		Ext.Msg.alert(gettext('Error'), response.htmlStatus);
	    },
	    success: function(response, opts) {
		let text = '';
		Ext.Array.each(response.result.data, function(rec) {
		    let version = "not correctly installed";
		    let pkg = rec.Package;
		    if (rec.OldVersion && rec.OldVersion !== 'unknown') {
			version = rec.OldVersion;
		    }
		    if (rec.ExtraInfo) {
			text += `${pkg}: ${version} (${rec.ExtraInfo})\n`;
		    } else {
			text += `${pkg}: ${version}\n`;
		    }
		});

		win.show();
		panel.update(Ext.htmlEncode(text));
	    },
	});
    },

    initComponent: function() {
        var me = this;

	var node_command = function(cmd) {
	    Proxmox.Utils.API2Request({
		params: { command: cmd },
		url: '/nodes/localhost/status',
		method: 'POST',
		waitMsgTarget: me,
		failure: function(response, opts) {
		    Ext.Msg.alert(gettext('Error'), response.htmlStatus);
		},
	    });
	};

	var restartBtn = Ext.create('Proxmox.button.Button', {
	    text: gettext('Reboot'),
	    dangerous: true,
	    confirmMsg: gettext("Reboot backup server?"),
	    handler: function() {
		node_command('reboot');
	    },
	    iconCls: 'fa fa-undo',
	});

	var shutdownBtn = Ext.create('Proxmox.button.Button', {
	    text: gettext('Shutdown'),
	    dangerous: true,
	    confirmMsg: gettext("Shutdown backup server?"),
	    handler: function() {
		node_command('shutdown');
	    },
	    iconCls: 'fa fa-power-off',
	});

	var consoleBtn = Ext.create('Proxmox.button.Button', {
	    text: gettext('Console'),
	    iconCls: 'fa fa-terminal',
	    handler: function() {
		Proxmox.Utils.openXtermJsViewer('shell', 0, Proxmox.NodeName);
	    },
	});

	let version_btn = new Ext.Button({
	    text: gettext('Package versions'),
	    iconCls: 'fa fa-gift',
	    handler: function() {
		Proxmox.Utils.checked_command(function() { me.showVersions(); });
	    },
	});

	me.tbar = [version_btn, '-', consoleBtn, '-', restartBtn, shutdownBtn, '->', { xtype: 'proxmoxRRDTypeSelector' }];

	var rrdstore = Ext.create('Proxmox.data.RRDStore', {
	    rrdurl: "/api2/json/nodes/localhost/rrd",
	    model: 'pve-rrd-node',
	});

	me.items = {
	    xtype: 'container',
	    itemId: 'itemcontainer',
	    layout: 'column',
	    minWidth: 700,
	    listeners: {
		resize: function(panel) {
		    Proxmox.Utils.updateColumns(panel);
		},
	    },
	    defaults: {
		minHeight: 320,
		padding: 5,
		columnWidth: 1,
	    },
	    items: [
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('CPU usage'),
		    fields: ['cpu', 'iowait'],
		    fieldTitles: [gettext('CPU usage'), gettext('IO wait')],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Server load'),
		    fields: ['loadavg'],
		    fieldTitles: [gettext('Load average')],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Memory usage'),
		    fields: ['memtotal', 'memused'],
		    fieldTitles: [gettext('Total'), gettext('RAM usage')],
		    unit: 'bytes',
		    powerOfTwo: true,
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Swap usage'),
		    fields: ['swaptotal', 'swapused'],
		    fieldTitles: [gettext('Total'), gettext('Swap usage')],
		    unit: 'bytes',
		    powerOfTwo: true,
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Network traffic'),
		    fields: ['netin', 'netout'],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Root Disk usage'),
		    fields: ['total', 'used'],
		    fieldTitles: [gettext('Total'), gettext('Disk usage')],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Root Disk Transfer Rate (bytes/second)'),
		    fields: ['read_bytes', 'write_bytes'],
		    fieldTitles: [gettext('Read'), gettext('Write')],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Root Disk Input/Output Operations per Second (IOPS)'),
		    fields: ['read_ios', 'write_ios'],
		    fieldTitles: [gettext('Read'), gettext('Write')],
		    store: rrdstore,
		},
		{
		    xtype: 'proxmoxRRDChart',
		    title: gettext('Root Disk IO Delay (ms)'),
		    fields: ['io_delay'],
		    fieldTitles: [gettext('IO Delay')],
		    store: rrdstore,
		},
	    ],
	};

	me.listeners = {
	    activate: function() {
		rrdstore.startUpdate();
	    },
	    destroy: function() {
		rrdstore.stopUpdate();
	    },
	};

	me.callParent();

	let sp = Ext.state.Manager.getProvider();
	me.mon(sp, 'statechange', function(provider, key, value) {
	    if (key !== 'summarycolumns') {
		return;
	    }
	    Proxmox.Utils.updateColumns(me.getComponent('itemcontainer'));
	});
    },

});