TT#66754 - Implement panel statistics

* Retrieve statistics details from
	   ngcp-collective-check

	 * Restore statistics widget to display
	   either "All services running", "Errors"
	   or "Warnings" according to collective-
	   check result

	 * Create pop-up modal to display ngcp-
	   collective-check results

Change-Id: I094a51ad1905d2bf968775dd43480c94a7a440b8

lib/NGCP/Panel/Utils/Statistics.pm

@@ -86,6 +86,11 @@ sub get_dpkg_support_status {
     }
 }
 
+sub get_ngcp_status {
+    my ($self) = @_;
+    return `/usr/sbin/ngcp-collective-check json`;
+}
+
 1;
 
 # vim: set tabstop=4 expandtab:

lib/NGCP/Panel/Widget/Dashboard/AdminSystemOverview.pm

@@ -4,11 +4,12 @@ use warnings;
 use strict;
 
 use NGCP::Panel::Utils::Preferences;
+use NGCP::Panel::Utils::Statistics;
+use JSON qw(decode_json);
 
 sub template {
-    # disabled
+    return unless ( -e '/usr/sbin/ngcp-collective-check' );
-    #return 'widgets/admin_system_overview.tt';
+    return 'widgets/admin_system_overview.tt';
-    return;
 }
 
 sub filter {
@@ -37,18 +38,12 @@ sub emergency_mode {
     return $em_count.'';
 }
 
-sub system_status {
-    my ($self, $c) = @_;
-    return { color => "#000000", text => $c->loc("OK") };
-}
-
-sub hardware {
-    my ($self, $c) = @_;
-    return { color => "#000000", text => $c->loc("OK") };
-}
-
 sub overall_status {
     my ($self, $c) = @_;
+
+    my $ngcp_status = decode_json(NGCP::Panel::Utils::Statistics::get_ngcp_status());
+    return { class => "ngcp-red-error", text => $c->loc("Errors"), data => $ngcp_status->{data} } if ( $ngcp_status->{system_status} eq 'ERRORS' );
+    return { class => "ngcp-orange-warning", text => $c->loc("Warnings"), , data => $ngcp_status->{data} } if ( $ngcp_status->{system_status} eq 'WARNINGS' );
     return { class => "ngcp-green-ok", text => $c->loc("All services running") };
 }
 

share/static/css/main.css

@@ -503,6 +503,14 @@ div.ngcp-modal .control-group.error .dataTables_wrapper input[type="text"] {
     color:#0f0;
 }
 
+.plan .ngcp-orange-warning {
+    color:#ff6700;
+}
+
+.plan .ngcp-red-error {
+    color:#ff0000;
+}
+
 .ngcp-quickform div.form-actions {
     padding-left: 0px;
 }

share/templates/dashboard.tt

@@ -29,7 +29,7 @@ $(document).ready(function () {
         [% enabled_widgets.push(w) -%]
     [% END -%]
 [% END -%]
-[% wcount = enabled_widgets.size() > 3 ? 3 : enabled_widgets.size() -%]
+[% wcount = enabled_widgets.size() > 4 ? 4 : enabled_widgets.size() -%]
 
 <div class="row">
     <div class="span12">

share/templates/widgets/admin_system_overview.tt

@@ -8,37 +8,31 @@ enqueLists.push([{
         var col = (data.widget_data > 0 ? "#FFC200" : "#000");
         $("#admin_system_overview_lazy_items_list").prepend('<li>[% c.loc('Applications') %] <strong style="color:' + col + '">' + txt + '</strong></li>');
     }
-},{
+},
-    res: 'system_status',
+{
-    widgetName: "AdminSystemOverview",
-    cb: function(data) {
-        //console.log(data);
-        var txt = data.widget_data.text;
-        var col = data.widget_data.color;
-        $("#admin_system_overview_lazy_items_list").append('<li>[% c.escape_js(c.loc('System')) %] <strong style="color:' + col + '">' + txt + '</strong></li>');
-    }
-},{
-    res: 'hardware',
-    widgetName: "AdminSystemOverview",
-    cb: function(data) {
-        //console.log(data);
-        var txt = data.widget_data.text;
-        var col = data.widget_data.color;
-        $("#admin_system_overview_lazy_items_list").append('<li>[% c.escape_js(c.loc('Hardware')) %] <strong style="color:' + col + '">' + txt + '</strong></li>');
-    }
-},{
     res: 'overall_status',
     widgetName: "AdminSystemOverview",
     cb: function(data) {
         //console.log(data);
         var txt = data.widget_data.text;
         var cls = data.widget_data.class;
+        var ngcp_status = data.widget_data.data;
         $("#admin_system_overview_lazy_loading").remove();
         $("#admin_system_overview_lazy_items_header").append(
             '<div class="plan-price">' +
                 '<span class="' + cls + '">&#9702;</span>' +
-                '<span class="term">' + txt + '</span>' +
+                '<span class="term"></span>' +
             '</div>');
+        $("#admin_system_overview_lazy_items_list").prepend(
+            '<li>[% c.loc('Status') %]: <strong>' + txt + ' </strong>' +
+            '<a data-toggle="modal" href="#statistics_modal">(details)</a></li>'
+        );
+        $.each( ngcp_status, function( i, val ) {
+            $("#statistics_modal_content").append( "<h2>" + val.title + "</h2>" );
+            $.each( val.messages, function( i, message ) {
+                $("#statistics_modal_content").append( "<p>" + message + "</p>" );
+            });
+        });
     }
 }]);
 </script>
@@ -54,8 +48,20 @@ enqueLists.push([{
             </ul>
         </div>
         <div class="plan-actions">
-            <a href="/grafana/dashboard/file/system-statistics.json" class="btn">[% c.loc('View Statistics') %]</a>
+            <a href="/grafana/dashboard/file/system-statistics" class="btn">[% c.loc('View Statistics') %]</a>
         </div>
     </div>
 </div>
+
+<div id="statistics_modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="statistics_modal_label" aria-hidden="true">
+  <div class="modal-header">
+    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+    <h3 id="statistics_modal_label">Messages</h3>
+  </div>
+  <div id="statistics_modal_content" class="modal-body">
+  </div>
+  <div class="modal-footer">
+    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
+  </div>
+</div>
 [% # vim: set tabstop=4 syntax=html expandtab: -%]