www/manager6/panel/GuestSummary.js

   1 Ext.define('PVE.qemu.Summary', {
   2     extend: 'Ext.panel.Panel',
   3     xtype: 'pveGuestSummary',
   4
   5     scrollable: true,
   6     bodyPadding: 5,
   7
   8     initComponent: function() {
   9         var me = this;
  10
  11         var nodename = me.pveSelNode.data.node;
  12         if (!nodename) {
  13             throw "no node name specified";
  14         }
  15
  16         var vmid = me.pveSelNode.data.vmid;
  17         if (!vmid) {
  18             throw "no VM ID specified";
  19         }
  20
  21         if (!me.workspace) {
  22             throw "no workspace specified";
  23         }
  24
  25         if (!me.statusStore) {
  26             throw "no status storage specified";
  27         }
  28
  29         var type = me.pveSelNode.data.type;
  30         var template = !!me.pveSelNode.data.template;
  31         var rstore = me.statusStore;
  32
  33         var width = template ? 1 : 0.5;
  34         var items = [
  35             {
  36                 xtype: template ? 'pveTemplateStatusView' : 'pveGuestStatusView',
  37                 responsiveConfig: {
  38                     'width < 1900': {
  39                         columnWidth: width
  40                     },
  41                     'width >= 1900': {
  42                         columnWidth: width / 2
  43                     }
  44                 },
  45                 itemId: 'gueststatus',
  46                 pveSelNode: me.pveSelNode,
  47                 rstore: rstore
  48             },
  49             {
  50                 xtype: 'pveNotesView',
  51                 maxHeight: 330,
  52                 itemId: 'notesview',
  53                 pveSelNode: me.pveSelNode,
  54                 responsiveConfig: {
  55                     'width < 1900': {
  56                         columnWidth: width
  57                     },
  58                     'width >= 1900': {
  59                         columnWidth: width / 2
  60                     }
  61                 }
  62             }
  63         ];
  64
  65         var rrdstore;
  66         if (!template) {
  67
  68             rrdstore = Ext.create('Proxmox.data.RRDStore', {
  69                 rrdurl: `/api2/json/nodes/${nodename}/${type}/${vmid}/rrddata`,
  70                 model: 'pve-rrd-guest'
  71             });
  72
  73             items.push(
  74                 {
  75                     xtype: 'proxmoxRRDChart',
  76                     title: gettext('CPU usage'),
  77                     pveSelNode: me.pveSelNode,
  78                     fields: ['cpu'],
  79                     fieldTitles: [gettext('CPU usage')],
  80                     store: rrdstore
  81                 },
  82                 {
  83                     xtype: 'proxmoxRRDChart',
  84                     title: gettext('Memory usage'),
  85                     pveSelNode: me.pveSelNode,
  86                     fields: ['maxmem', 'mem'],
  87                     fieldTitles: [gettext('Total'), gettext('RAM usage')],
  88                     store: rrdstore
  89                 },
  90                 {
  91                     xtype: 'proxmoxRRDChart',
  92                     title: gettext('Network traffic'),
  93                     pveSelNode: me.pveSelNode,
  94                     fields: ['netin','netout'],
  95                     store: rrdstore
  96                 },
  97                 {
  98                     xtype: 'proxmoxRRDChart',
  99                     title: gettext('Disk IO'),
 100                     pveSelNode: me.pveSelNode,
 101                     fields: ['diskread','diskwrite'],
 102                     store: rrdstore
 103                 }
 104             );
 105
 106         }
 107
 108         Ext.apply(me, {
 109             tbar: [ '->', { xtype: 'proxmoxRRDTypeSelector' } ],
 110             items: [
 111                 {
 112                     xtype: 'container',
 113                     layout: {
 114                         type: 'column'
 115                     },
 116                     defaults: {
 117                         minHeight: 330,
 118                         padding: 5,
 119                         plugins: 'responsive',
 120                         responsiveConfig: {
 121                             'width < 1900': {
 122                                 columnWidth: 1
 123                             },
 124                             'width >= 1900': {
 125                                 columnWidth: 0.5
 126                             }
 127                         }
 128                     },
 129                     items: items
 130                 }
 131             ]
 132         });
 133
 134         me.callParent();
 135         if (!template) {
 136             rrdstore.startUpdate();
 137             me.on('destroy', rrdstore.stopUpdate);
 138         }
 139     }
 140 });