this adds a new component health widget, used for cluster and ceph
status

also refactor ceph error levels and ceph status data into PVE.Utils

Signed-off-by: Dominik Csapak <d.csa...@proxmox.com>
---
 www/manager6/Makefile              |  1 +
 www/manager6/Utils.js              | 24 +++++++++++++++++++
 www/manager6/dc/Health.js          | 48 ++++++--------------------------------
 www/manager6/panel/HealthWidget.js | 37 +++++++++++++++++++++++++++++
 4 files changed, 69 insertions(+), 41 deletions(-)
 create mode 100644 www/manager6/panel/HealthWidget.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index d35ac35..da96b7c 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -79,6 +79,7 @@ JSSRC=                                                        
\
        panel/TemplateStatusView.js                     \
        panel/InputPanel.js                             \
        panel/GaugeWidget.js                            \
+       panel/HealthWidget.js                           \
        window/Edit.js                                  \
        window/LoginWindow.js                           \
        window/TaskViewer.js                            \
diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index f86eea8..a32697a 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -99,6 +99,30 @@ Ext.define('PVE.Utils', { utilities: {
        return icon;
     },
 
+    map_ceph_health: {
+       'HEALTH_OK':'good',
+       'HEALTH_WARN':'warning',
+       'HEALTH_ERR':'critical'
+    },
+
+    render_ceph_health: function(record) {
+       var state = {
+           iconCls: PVE.Utils.get_health_icon(),
+           text: ''
+       };
+
+       if (!record || !record.data) {
+           return state;
+       }
+
+       var health = 
PVE.Utils.map_ceph_health[record.data.health.overall_status];
+
+       state.iconCls = PVE.Utils.get_health_icon(health, true);
+       state.text = record.data.health.overall_status;
+
+       return state;
+    },
+
     render_kvm_ostype: function (value) {
        if (!value) {
            return gettext('Other OS types');
diff --git a/www/manager6/dc/Health.js b/www/manager6/dc/Health.js
index f4e78e3..428f95c 100644
--- a/www/manager6/dc/Health.js
+++ b/www/manager6/dc/Health.js
@@ -59,7 +59,7 @@ Ext.define('PVE.dc.Health', {
            nodes.offline = numNodes - nodes.online;
        }
 
-       me.getComponent('clusterstatus').update(cluster);
+       me.getComponent('clusterstatus').updateHealth(cluster);
        me.getComponent('nodestatus').update(nodes);
     },
 
@@ -81,27 +81,8 @@ Ext.define('PVE.dc.Health', {
 
        me.cepherrors = 0;
 
-       var cephstate = {
-           iconCls: 'faded fa-question-circle',
-           text: ''
-       };
-
-       switch (records[0].data.health.overall_status) {
-           case 'HEALTH_OK':
-               cephstate.iconCls = 'good fa-check-circle';
-               break;
-           case 'HEALTH_WARN':
-               cephstate.iconCls = 'warning fa-info-circle';
-               break;
-           case 'HEALTH_ERR':
-               cephstate.iconCls = 'critical fa-times-circle';
-               break;
-           default:
-               cephstate.iconCls = 'faded fa-question-circle';
-               break;
-       }
-       cephstate.text = records[0].data.health.overall_status;
-       cephstatus.update(cephstate);
+       var state = PVE.Utils.render_ceph_health(records[0]);
+       cephstatus.updateHealth(state);
        cephstatus.setVisible(true);
     },
 
@@ -115,16 +96,8 @@ Ext.define('PVE.dc.Health', {
     items: [
        {
            itemId: 'clusterstatus',
-           data: {
-               iconCls: 'faded fa-question-circle',
-               text: ''
-           },
-           tpl: [
-               '<h3>' + gettext('Status') + '</h3>',
-               '<i class="fa fa-5x {iconCls}"></i>',
-               '<br /><br/>',
-               '{text}'
-           ]
+           xtype: 'pveHealthWidget',
+           title: gettext('Status')
        },
        {
            itemId: 'nodestatus',
@@ -153,15 +126,8 @@ Ext.define('PVE.dc.Health', {
            itemId: 'ceph',
            width: 250,
            columnWidth: undefined,
-           data: {
-               text: '',
-               iconCls: 'faded fa-question-circle'
-           },
-           tpl: [
-               '<h3>Ceph</h3>',
-               '<i class="fa fa-5x {iconCls}"></i><br /><br />',
-               gettext("Health") + ': {text}'
-           ],
+           title: gettext('Ceph'),
+           xtype: 'pveHealthWidget',
            hidden: true
        }
     ],
diff --git a/www/manager6/panel/HealthWidget.js 
b/www/manager6/panel/HealthWidget.js
new file mode 100644
index 0000000..56990bf
--- /dev/null
+++ b/www/manager6/panel/HealthWidget.js
@@ -0,0 +1,37 @@
+Ext.define('PVE.widget.HealthWidget', {
+    extend: 'Ext.Component',
+    alias: 'widget.pveHealthWidget',
+
+    data: {
+       iconCls: PVE.Utils.get_health_icon(undefined, true),
+       text: '',
+       title: ''
+    },
+
+    style: {
+       'text-align':'center'
+    },
+
+    tpl: [
+       '<h3>{title}</h3>',
+       '<i class="fa fa-5x {iconCls}"></i>',
+       '<br /><br/>',
+       '{text}'
+    ],
+
+    updateHealth: function(data) {
+       var me = this;
+       me.update(Ext.apply(me.data, data));
+    },
+
+    initComponent: function(){
+       var me = this;
+
+       if (me.title) {
+           me.config.data.title = me.title;
+       }
+
+       me.callParent();
+    }
+
+});
-- 
2.1.4


_______________________________________________
pve-devel mailing list
pve-devel@pve.proxmox.com
http://pve.proxmox.com/cgi-bin/mailman/listinfo/pve-devel

Reply via email to