gui: set minWidth for node/guest Summary

[pve-manager.git] / www / manager6 / panel / GuestStatusView.js

diff --git a/www/manager6/panel/GuestStatusView.js b/www/manager6/panel/GuestStatusView.js
index 250a93a76f46a78157f52d2d9c6b6a892d4050a6..2a9198cf38387eba2257be76db89df3e08e5fbe6 100644 (file)
--- a/www/manager6/panel/GuestStatusView.js
+++ b/www/manager6/panel/GuestStatusView.js
@@ -1,45 +1,73 @@
 Ext.define('PVE.panel.GuestStatusView', {
     extend: 'PVE.panel.StatusView',
     alias: 'widget.pveGuestStatusView',
+    mixins: ['Proxmox.Mixin.CBind'],
 
     height: 300,
 
+    cbindData: function (initialConfig) {
+       var me = this;
+       return {
+           isQemu: me.pveSelNode.data.type === 'qemu',
+           isLxc: me.pveSelNode.data.type === 'lxc'
+       };
+    },
+
+    layout: {
+       type: 'vbox',
+       align: 'stretch'
+    },
+
     defaults: {
        xtype: 'pveInfoWidget',
-       padding: '0 30 5 30',
-       // parent panel is 400 wide
-       // minus 2 pixels for the border
-       width: 398
+       padding: '2 25'
     },
     items: [
        {
            xtype: 'box',
-           height: 30
+           height: 20
        },
        {
            itemId: 'status',
            title: gettext('Status'),
+           iconCls: 'fa fa-info fa-fw',
            printBar: false,
-           textField: 'status'
+           multiField: true,
+           renderer: function(record) {
+               var me = this;
+               var text = record.data.status;
+               var qmpstatus = record.data.qmpstatus;
+               if (qmpstatus && qmpstatus !== record.data.status) {
+                   text += ' (' + qmpstatus + ')';
+               }
+               return text;
+           }
        },
        {
            itemId: 'hamanaged',
+           iconCls: 'fa fa-heartbeat fa-fw',
            title: gettext('HA State'),
            printBar: false,
            textField: 'ha',
            renderer: PVE.Utils.format_ha
        },
        {
+           xtype: 'pveInfoWidget',
            itemId: 'node',
+           iconCls: 'fa fa-building fa-fw',
            title: gettext('Node'),
+           cbind: {
+               text: '{pveSelNode.data.node}'
+           },
            printBar: false
        },
        {
            xtype: 'box',
-           height: 20
+           height: 15
        },
        {
            itemId: 'cpu',
+           iconCls: 'fa fa-fw pve-itype-icon-processor pve-icon',
            title: gettext('CPU usage'),
            valueField: 'cpu',
            maxField: 'cpus',
@@ -50,18 +78,26 @@ Ext.define('PVE.panel.GuestStatusView', {
        },
        {
            itemId: 'memory',
+           iconCls: 'fa fa-fw pve-itype-icon-memory pve-icon',
            title: gettext('Memory usage'),
            valueField: 'mem',
            maxField: 'maxmem'
        },
        {
            itemId: 'swap',
+           xtype: 'pveInfoWidget',
+           iconCls: 'fa fa-refresh fa-fw',
            title: gettext('SWAP usage'),
            valueField: 'swap',
-           maxField: 'maxswap'
+           maxField: 'maxswap',
+           cbind: {
+               hidden: '{isQemu}',
+               disabled: '{isQemu}'
+           }
        },
        {
            itemId: 'rootfs',
+           iconCls: 'fa fa-hdd-o fa-fw',
            title: gettext('Bootdisk size'),
            valueField: 'disk',
            maxField: 'maxdisk',
@@ -75,6 +111,20 @@ Ext.define('PVE.panel.GuestStatusView', {
                    return PVE.Utils.render_size_usage(used,max);
                }
            }
+       },
+       {
+           xtype: 'box',
+           height: 15
+       },
+       {
+           itemId: 'ips',
+           xtype: 'pveAgentIPView',
+           cbind: {
+               rstore: '{rstore}',
+               pveSelNode: '{pveSelNode}',
+               hidden: '{isLxc}',
+               disabled: '{isLxc}'
+           }
        }
     ],
 
@@ -89,15 +139,5 @@ Ext.define('PVE.panel.GuestStatusView', {
        }
 
        me.setTitle(me.getRecordValue('name') + text);
-    },
-
-    initComponent: function() {
-       var me = this;
-
-       me.callParent();
-       if (me.pveSelNode.data.type !== 'lxc') {
-           me.remove(me.getComponent('swap'));
-       }
-       me.getComponent('node').updateValue(me.pveSelNode.data.node);
     }
 });