monitoring/ffmap/web/templates/statistics.html

205 lines
8.4 KiB
HTML

{% extends "bootstrap.html" %}
{% block title %}{{super()}} :: Statistics{%- if selecthood %} for {{ selecthood }}{%- endif -%}{%- if selectgw %} for GW {{ selectgw }}{%- endif -%}{% endblock %}
{% block head %}{{super()}}
<script src="{{ url_for('static', filename='js/graph/date.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.time.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.byte.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.selection.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.downsample.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.resize.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.hiddengraphs.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.pie.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph/jquery.flot.tooltip.js') }}"></script>
<script src="{{ url_for('static', filename='js/graph.js') }}"></script>
<style type="text/css">
.table-condensed {
margin-bottom: 0;
}
.table-condensed tr:last-child td, th {
border-bottom: 1px solid #ddd;
}
@media(max-width:500px) {
th {
padding-left: 2px !important;
padding-right: 2px !important;
}
td {
padding-left: 2px !important;
padding-right: 2px !important;
}
.panel-body {
padding-left: 3px !important;
padding-right: 3px !important;
}
}
.table-hoods th {
text-align: center;
}
.table-hoods td {
text-align: center;
}
.table-hoods .firstrow {
text-align: left;
}
</style>
{% endblock %}
{% block content %}
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Hoods</div>
<div class="panel-body">
<table class="table table-condensed table-hoods">
<tr>
<th class="firstrow">Hood</th>
<th class="success" title="Online Routers">Online</th>
<th class="danger" title="Offline Routers">Offline</th>
<th class="warning" title="Unknown Routers">Unknown</th>
<th class="active" title="Total Routers">Total</th>
<th class="info">Clients</th>
<th class="stats">Stats</th>
</tr>
{%- for hood, value in hoods|dictsort %}
<tr>
<td class="firstrow"><a href="{{ url_for('router_list', q='hood:^%s$' % hood.replace(' ','_')) }}">{{ hood }}</a></td>
<td class="success">{{ value["online"] or 0 }}</td>
<td class="danger">{{ value["offline"] or 0 }}{%- if value["orphaned"] %} ({{ value["orphaned"] or 0 }}){%- endif %}</td>
<td class="warning">{{ value["unknown"] or 0 }}</td>
<td class="active">{{ hoods_sum[hood]["routers"] }}</td>
<td class="info">{{ hoods_sum[hood]["clients"] }}</td>
<td class="stats"><a href="{{ url_for('global_hoodstatistics', selecthood='%s' % hood) }}">Stats</a></td>
</tr>
{%- endfor %}
<tr>
<th class="firstrow">Sum</th>
<td class="success">{{ router_status.online or 0 }}</td>
<td class="danger">{{ router_status.offline or 0 }}</td>
<td class="warning">{{ router_status.unknown or 0 }}</td>
<td class="active">{{ router_status.sum or 0 }}</td>
<td class="info">{{ clients }}</td>
<td class="stats"><a href="{{ url_for('global_statistics') }}">Global</a></td>
</tr>
</table>
</div>
</div>
</div>
<div class="col-xs-12 col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Routers{%- if selecthood %} @ {{ selecthood }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }} (selected only){%- endif -%}</div>
<div class="panel-body">
<div id="globrouterstat" class="graph"></div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Clients{%- if selecthood %} @ {{ selecthood }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }} (selected only){%- endif -%}</div>
<div class="panel-body">
<div id="globclientstat" class="graph"></div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Newest Routers{%- if selecthood %} @ {{ selecthood }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }}{%- endif -%}</div>
<div class="panel-body" style="padding-bottom:34px">
<div class="table-responsive">
<table class="table table-condensed">
<tr>
<th>Hostname</th>
<th>Hood</th>
<th>Created</th>
</tr>
{%- for router in newest_routers|reverse %}
<tr>
<td><a href="{{ url_for('router_info', dbid=router.id) }}">{{ router.hostname }}</a></td>
<td>{{ router.hood }}</td>
<td class="text-nowrap">{{ router.created|utc2local|format_dt }}</td>
</tr>
{%- endfor %}
</table>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Gateways (selected / others){%- if selecthood %} @ {{ selecthood }}{%- endif -%}</div>
<div class="panel-body">
<table class="table table-condensed table-hoods">
<tr>
<th class="firstrow">Gateway</th>
<th class="success" title="Online Routers">Online</th>
<th class="danger" title="Offline Routers">Offline</th>
<th class="active" title="Total Routers">Total</th>
<th class="info">Clients</th>
<th class="stats">Stats</th>
</tr>
{%- for mac, value in gws.items() %}
<tr>
<td class="firstrow"><a href="{{ url_for('router_list', q='selected:^%s$' % mac) }}">{{ gws_info[mac]["label"] }}</a></td>
<td class="success"><span style="font-weight:bold">{{ value["selected"]["online"] or 0 }}</span> / {{ value["others"]["online"] or 0 }}</td>
<td class="danger"><span style="font-weight:bold">{{ value["selected"]["offline"] or 0 }}</span> / {{ value["others"]["offline"] or 0 }}</td>
<td class="active"><span style="font-weight:bold">{{ gws_sum[mac]["routers"] if gws_sum[mac] else 0 }}</span> / {{ value["others"]|sumdict if value["others"] else 0 }}</td>
<td class="info">{{ gws_sum[mac]["clients"] if gws_sum[mac] }}</td>
<td class="stats"><a href="{{ url_for('global_gwstatistics', selectgw='%s' % mac) }}">Stats</a></td>
</tr>
{%- endfor %}
</table>
</div>
</div>
</div>
<div class="col-xs-12 col-md-6">
{%- if selectgw %}
<div class="panel panel-default">
<div class="panel-heading">Gateway-Details</div>
<div class="panel-body">
<table class="table table-condensed">
<tr><th>Gateway</th><td>{{ gws_info[selectgw]["gw"] }}</td></tr>
<tr><th>Interface</th><td>{{ gws_info[selectgw]["gwif"] }}</td></tr>
<tr><th>MAC address</th><td>{{ selectgw }}</td></tr>
<tr><th>BatX interface</th><td>{{ gws_info[selectgw]["batX"] }}</td></tr>
{%- if gws_info[selectgw]["stats_page"] %}
<tr><th>Stats page</th><td>{{ gws_info[selectgw]["stats_page"] }}</td></tr>
{%- endif %}
{%- for a in gws_admin %}
<tr><th>Admin</th><td>{{ a }}</td></tr>
{%- endfor %}
</table>
</div>
</div>
{%- endif %}
<div class="panel panel-default">
<div class="panel-heading">Router Firmwares{%- if selecthood %} @ {{ selecthood }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }}{%- endif -%}</div>
<div class="panel-body">
<div id="globrouterfwstat" class="graph-pie"></div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Router Models{%- if selecthood %} @ {{ selecthood }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }}{%- endif -%}</div>
<div class="panel-body">
<div id="globroutermodelsstat" class="graph-pie"></div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
var global_stats = {{ stats|statbson2json|safe }};
var router_firmwares = {{ router_firmwares|tojson }};
var router_models = {{ router_models|tojson }};
var routers_page_url = "{{ url_for('router_list') }}";
{%- if selecthood %}
var hood = "{{selecthood}}";
var hoodstr = "hood:^" + hood.replace(/ /g, '_') + "$";
{%- else %}
var hoodstr = "";
{%- endif -%}
$(document).ready(function() {
global_client_graph();
global_router_graph();
global_router_firmwares_graph();
global_router_models_graph();
});
</script>
{% endblock %}