146 lines
4.9 KiB
HTML
146 lines
4.9 KiB
HTML
{% extends 'base_AdminLTE.html' %}
|
|
|
|
{% block title %}Docklet | Hosts{% endblock %}
|
|
|
|
{% block panel_title %}Hosts Info{% endblock %}
|
|
|
|
{% block panel_list %}
|
|
<ol class="breadcrumb">
|
|
<li>
|
|
<a href="/dashboard/"><i class="fa fa-dashboard"></i>Home</a>
|
|
</li>
|
|
<li class="active">
|
|
<strong>HostsInfo</strong>
|
|
</li>
|
|
</ol>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="box box-info">
|
|
<div class="box-header with-border">
|
|
<h3 class="box-title">All Hosts Info</h3>
|
|
|
|
<div class="box-tools pull-right">
|
|
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
|
|
</button>
|
|
<button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
|
|
</div>
|
|
</div>
|
|
<div class="box-body table-responsive">
|
|
<table class="table table-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>NO</th>
|
|
<th>IP Address</th>
|
|
<th>Status</th>
|
|
<th>Nodes running</th>
|
|
<th>Cpu used</th>
|
|
<th>Mem used</th>
|
|
<th>Disk used</th>
|
|
<th>Summary</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for phym in machines %}
|
|
<tr>
|
|
<td>{{ loop.index }}</td>
|
|
<td>{{ phym['ip'] }}</td>
|
|
{% if phym['status'] == 'STOPPED' %}
|
|
<td><div id='{{ loop.index }}_status' class="label label-danger">Stopped</div></td>
|
|
{% else %}
|
|
<td><div id='{{ loop.index }}_status' class="label label-primary">Running</div></td>
|
|
{% endif %}
|
|
<td>
|
|
<label id='{{ loop.index }}_conrunning'>{{ phym['containers']['running'] }}</label> /
|
|
<a href='/hosts/{{ phym['ip'] }}/containers/' id='{{ loop.index }}_contotal' >{{ phym['containers']['total'] }}</a>
|
|
</td>
|
|
<td id='{{ loop.index }}_cpu'>--</td>
|
|
<td id='{{ loop.index }}_mem'>--</td>
|
|
<td id='{{ loop.index }}_disk'>--</td>
|
|
<td><a class="btn btn-info btn-xs" href='/hosts/{{ phym['ip'] }}/'>Realtime</a></td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block script_src %}
|
|
<script type='text/javascript'>
|
|
function update(url,index)
|
|
{
|
|
|
|
var MB = 1024;
|
|
$.post(url+"/status",{},function(data){
|
|
var status = data.monitor.status;
|
|
if(status == 'RUNNING')
|
|
{
|
|
var tmp = $("#"+index+"_status");
|
|
tmp.removeClass();
|
|
tmp.addClass("label label-primary");
|
|
tmp.html("Running");
|
|
}
|
|
else if(status == 'STOPPED')
|
|
{
|
|
var tmp = $("#"+index+"_status");
|
|
tmp.removeClass();
|
|
tmp.addClass("label label-danger");
|
|
tmp.html("Stopped");
|
|
}
|
|
|
|
$.post(url+"/containers",{},function(data){
|
|
var containers = data.monitor.containers;
|
|
$("#"+index+"_contotal").html(containers.total);
|
|
$("#"+index+"_conrunning").html(containers.running);
|
|
},"json");
|
|
|
|
if(status == 'STOPPED')
|
|
{
|
|
$("#"+index+"_cpu").html('--');
|
|
$("#"+index+"_mem").html('--');
|
|
$("#"+index+"_disk").html('--');
|
|
return;
|
|
}
|
|
|
|
$.post(url+"/cpuinfo",{},function(data){
|
|
var idle = data.monitor.cpuinfo.idle;
|
|
var usedp = (100 - idle).toFixed(2);
|
|
$("#"+index+"_cpu").html(String(usedp)+"%");
|
|
},"json");
|
|
|
|
$.post(url+"/meminfo",{},function(data){
|
|
var used = data.monitor.meminfo.used;
|
|
var total = data.monitor.meminfo.total;
|
|
var usedp = String(((used/total)*100).toFixed(2))+"%";
|
|
$("#"+index+"_mem").html(usedp);
|
|
},"json");
|
|
|
|
$.post(url+"/diskinfo",{},function(data){
|
|
var val = data.monitor.diskinfo;
|
|
var usedp = val[0].percent;
|
|
$("#"+index+"_disk").html(String(usedp)+"%");
|
|
},"json");
|
|
},"json");
|
|
}
|
|
|
|
function updateAll()
|
|
{
|
|
var host = window.location.host;
|
|
var url0 = "http://" + host + "/monitor/hosts/";
|
|
{% for phym in machines %}
|
|
url = url0 + '{{ phym['ip'] }}';
|
|
update(url,'{{ loop.index }}');
|
|
{% endfor %}
|
|
}
|
|
setInterval(updateAll,5000);
|
|
|
|
</script>
|
|
{% endblock %}
|