313 lines
13 KiB
HTML
313 lines
13 KiB
HTML
{% extends "bootstrap.html" %}
|
|
{% block title %}{{super()}} :: Statistics{%- if selecthood %} for {{ selecthoodname }}{%- 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>
|
|
<script src="{{ url_for('static', filename='js/datatables/jquery.dataTables.min.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/datatables/dataTables.bootstrap.min.js') }}"></script>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/datatables/dataTables.bootstrap.min.css') }}">
|
|
<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 - V1: <a href="#" id="enablev1">On</a>, V2: <a href="#" id="enablev2">On</a>, Local: <a href="#" id="enablelocal">On</a></div>
|
|
<div class="panel-body">
|
|
<table id="hoodlist" class="table table-condensed table-hoods">
|
|
<thead>
|
|
<tr>
|
|
<th class="firstrow">Hood</th>
|
|
<th class="stats" title="Gateways">G</th>
|
|
<th class="success" title="Online Routers">On</th>
|
|
<th class="danger" title="Offline Routers">Off</th>
|
|
<th class="warning" title="Unknown Routers">Unk.</th>
|
|
<th class="active" title="Total Routers">Sum</th>
|
|
<th class="info">User</th>
|
|
<th class="stats">Stat</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{%- for hoodid, value in hoods|dictsort %}
|
|
<tr{%- if hoods_sum[hoodid]["local"] %} class="rowlocal"{%- elif hoods_sum[hoodid]["v2"] %} class="rowv2"{%- else %} class="rowv1"{%- endif %}>
|
|
<td class="firstrow{%- if hoods_sum[hoodid]["local"] %} hoodlocal{%- elif hoods_sum[hoodid]["v2"] %} hoodv2{%- endif %}"><a href="{{ url_for('router_list', q='hood:^%s$' % value['name'].replace(' ','_')) }}">{{ value['name'] }}</a></td>
|
|
<td class="stats">{{ hoods_gws[hoodid] or "-" }}</td>
|
|
<td class="success">{{ value["online"] or 0 }}</td>
|
|
<td class="danger" data-order="{{ value["offline"] or 0 }}">{{ 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[hoodid]["routers"] }}</td>
|
|
<td class="info">{{ hoods_sum[hoodid]["clients"] }}</td>
|
|
<td class="stats"><a href="{{ url_for('global_hoodstatistics', selecthood='%s' % hoodid) }}">Stats</a></td>
|
|
</tr>
|
|
{%- endfor %}
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<th class="firstrow">Sum</th>
|
|
<td class="stats"> </td>
|
|
<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>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-xs-12 col-md-6">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">Routers{%- if selecthood %} @ {{ selecthoodname }}{%- 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 %} @ {{ selecthoodname }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }} (selected only){%- endif -%}</div>
|
|
<div class="panel-body">
|
|
<div id="globclientstat" class="graph"></div>
|
|
</div>
|
|
</div>
|
|
{%- if not selectgw %}
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">Traffic{%- if selecthood %} @ {{ selecthoodname }}{%- endif -%}</div>
|
|
<div class="panel-body">
|
|
<div id="netstat" class="graph"></div>
|
|
</div>
|
|
</div>
|
|
{%- endif -%}
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">Newest Routers{%- if selecthood %} @ {{ selecthoodname }}{%- 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 %} @ {{ selecthoodname }}{%- endif -%}</div>
|
|
<div class="panel-body">
|
|
<table id="gwlist" class="table table-condensed table-hoods">
|
|
<thead>
|
|
<tr>
|
|
<th class="firstrow">Gateway</th>
|
|
<th class="success" title="Online Routers">On</th>
|
|
<th class="danger" title="Offline Routers">Off</th>
|
|
<th class="warning" title="Unknown Routers">Unk.</th>
|
|
<th class="active" title="Total Routers">Sum</th>
|
|
<th class="stats">Stat</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{%- for mac, value in gws.items() %}
|
|
<tr>
|
|
<td class="firstrow" data-order="{{ value["sort"] }}"><p style="margin:0"><a href="{{ url_for('router_list', q='selected:^%s$' % mac|int2shortmac) }}">{{ gws_info[mac]["label"] }}</a></p>
|
|
{%- if gws_info[mac]["gw"] %}
|
|
<p style="margin:0;font-size:12px">{{ mac|int2mac }}
|
|
{%- if gws_info[mac]["batmac"] %}
|
|
/ {{ gws_info[mac]["batmac"]|int2mac }}
|
|
{%- endif %}
|
|
</p>
|
|
{%- endif %}
|
|
</td>
|
|
<td class="success" data-order="{{ (value["selected"]["online"] or 0) + (value["others"]["online"] or 0) }}"><span style="font-weight:bold">{{ value["selected"]["online"] or 0 }}</span> / {{ value["others"]["online"] or 0 }}</td>
|
|
<td class="danger" data-order="{{ (value["selected"]["offline"] or 0) + (value["others"]["offline"] or 0) }}"><span style="font-weight:bold">{{ value["selected"]["offline"] or 0 }}</span> / {{ value["others"]["offline"] or 0 }}</td>
|
|
<td class="warning" data-order="{{ (value["selected"]["unknown"] or 0) + (value["others"]["unknown"] or 0) }}"><span style="font-weight:bold">{{ value["selected"]["unknown"] or 0 }}</span> / {{ value["others"]["unknown"] or 0 }}</td>
|
|
<td class="active" data-order="{{ (value["selected"]|sumdict if value["selected"] else 0) + (value["others"]|sumdict if value["others"] else 0) }}"><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="stats"><a href="{{ url_for('global_gwstatistics', selectgw='%s' % mac|int2shortmac) }}">Stats</a></td>
|
|
</tr>
|
|
{%- endfor %}
|
|
</tbody>
|
|
</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[selectgwint]["gw"] }}</td></tr>
|
|
<tr><th>Interface</th><td>{{ gws_info[selectgwint]["gwif"] }}</td></tr>
|
|
<tr><th>MAC address</th><td>{{ selectgw }}</td></tr>
|
|
<tr><th>BatX interface</th><td>{{ gws_info[selectgwint]["batX"] }}</td></tr>
|
|
{%- if gws_info[selectgwint]["ipv4"] %}
|
|
<tr><th>Internal IPv4</th><td>{{ gws_info[selectgwint]["ipv4"] }}</td></tr>
|
|
{%- endif %}
|
|
{%- if gws_info[selectgwint]["ipv6"] %}
|
|
<tr><th>Internal IPv6</th><td>{{ gws_info[selectgwint]["ipv6"] }}</td></tr>
|
|
{%- endif %}
|
|
{%- if gws_info[selectgwint]["dhcpstart"] %}
|
|
<tr><th>DHCP range</th><td>{{ gws_info[selectgwint]["dhcpstart"] }} - {{ gws_info[selectgwint]["dhcpend"] }}</td></tr>
|
|
{%- endif %}
|
|
{%- if gws_info[selectgwint]["stats_page"] %}
|
|
<tr><th>Stats page</th><td>{{ gws_info[selectgwint]["stats_page"] }}</td></tr>
|
|
{%- endif %}
|
|
{%- for a in gws_admin %}
|
|
<tr><th>Admin</th><td>{{ a }}</td></tr>
|
|
{%- endfor %}
|
|
<tr><th>gwinfo version</th><td>{{ gws_info[selectgwint]["version"] if gws_info[selectgwint]["version"] else "< 1.4 or custom" }}</td></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{%- endif %}
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">Router Firmwares{%- if selecthood %} @ {{ selecthoodname }}{%- 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 %} @ {{ selecthoodname }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }}{%- endif -%}</div>
|
|
<div class="panel-body">
|
|
<div id="globroutermodelsstat" class="graph-pie"></div>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">Router Models per Client{%- if selecthood %} @ {{ selecthoodname }}{%- endif -%}{%- if selectgw %} @ {{ selectgw }}{%- endif -%}</div>
|
|
<div class="panel-body">
|
|
<div id="globroutermodelsperclient" 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 = "{{selecthoodname}}";
|
|
var hoodstr = "hood:^" + hood.replace(/ /g, '_') + "$";
|
|
{%- else %}
|
|
var hoodstr = "";
|
|
{%- endif -%}
|
|
$(document).ready(function() {
|
|
global_client_graph(global_stats,"globclientstat");
|
|
global_router_graph(global_stats,"globrouterstat");
|
|
global_router_firmwares_graph();
|
|
global_router_models_graph("globroutermodelsstat","count");
|
|
global_router_models_graph("globroutermodelsperclient","clients");
|
|
{%- if not selectgw %}
|
|
network_graph(global_stats,"netstat","sent to clients","received from clients");
|
|
{%- endif -%}
|
|
|
|
$("#hoodlist").DataTable({
|
|
"order": [[0,'asc']],
|
|
"paging": false,
|
|
"info": false,
|
|
"searching": false,
|
|
/*"responsive": {
|
|
"details": false
|
|
},*/
|
|
"columnDefs": [
|
|
{"orderable": false, "targets": -1},
|
|
]
|
|
});
|
|
|
|
$("#gwlist").DataTable({
|
|
"order": [],
|
|
"paging": false,
|
|
"info": false,
|
|
"searching": false,
|
|
/*"responsive": {
|
|
"details": false
|
|
},*/
|
|
"columnDefs": [
|
|
{"orderable": false, "targets": -1},
|
|
]
|
|
});
|
|
|
|
function enableHood(aid,classname) {
|
|
var avx = document.getElementById(aid)
|
|
var rows = document.getElementsByClassName(classname)
|
|
if(avx.text=="On") {
|
|
avx.text = "Off";
|
|
for (var i = 0; i < rows.length; i++) {
|
|
rows[i].style.display = 'none';
|
|
}
|
|
} else {
|
|
avx.text = "On";
|
|
for (var i = 0; i < rows.length; i++) {
|
|
rows[i].style.display = '';
|
|
}
|
|
}
|
|
return true
|
|
}
|
|
|
|
document.getElementById("enablev1").onclick = function() {
|
|
enableHood("enablev1","rowv1")
|
|
return false;
|
|
}
|
|
document.getElementById("enablev2").onclick = function() {
|
|
enableHood("enablev2","rowv2")
|
|
return false;
|
|
}
|
|
document.getElementById("enablelocal").onclick = function() {
|
|
enableHood("enablelocal","rowlocal")
|
|
return false;
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %}
|