ngcp-panel/share/templates/widgets/admin_system_overview.tt

<script>
enqueLists.push([{
    res: 'emergency_mode',
    widgetName: "AdminSystemOverview",
    cb: function(data) {
        //console.log(data);
        var txt = (data.widget_data > 0 ? "Emergency Mode" : "Ok");
        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: '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"></span>' +
            '</div>');
        $("#admin_system_overview_lazy_items_list").prepend(
            '<li>[% c.loc('Status') %]: <strong id="status_text"></strong></li>'
        );
        if (ngcp_status) {
            $("#status_text").append(
                '<a data-toggle="modal" href="#statistics_modal">' + txt + '</a>'
            );
        }
        else{
            $("#status_text").append(txt);
        }
        $.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>

<div class="plan-container">
    <div class="plan">
        <div class="plan-header" id="admin_system_overview_lazy_items_header">
            <div class="plan-title">[% c.loc('System Status') %]</div>
            <div class="plan-price widget-loading" id="admin_system_overview_lazy_loading"><span>&#9702;</span><span class="term">processing ...</span></div>
        </div>
        <div class="plan-features">
            <ul id="admin_system_overview_lazy_items_list">
            </ul>
        </div>
        <div class="plan-actions">
            <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: -%]