current.js
3.29 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
queryCurrentInfo();
function queryCurrentInfo() {
removePopoverDiv();
$.ajax({
url : getUrlBasePath() + "/dns_monitor/current",
type: "get",
dataType: "json",
success : function(data) {
updateDNSView(eval(data));
$(function () {
$("[data-toggle='popover']").popover();
});
},
error: function(e) {
}
});
}
function updateDNSView(data) {
var html = "<table class='table table-bordered mb30' valign='middle'><tbody>";
for(var i = 0; i < data.length; i ++) {
html += "<tr><td width='15%' align='center' vertical-align='middle'><span style='font-size:18px;font-weight:bold'>" + data[i].host + "</td>";
html += "<td>" + buildIpsTablesHTML(data[i].ips) + "</td>";
html += "</tr>";
}
html += "</tbody><table>";
console.log(html);
document.getElementById("div_table").innerHTML = html;
}
function buildIpsTablesHTML(ips) {
var html = "<table class='table' style='margin-bottom: 0'><tbody>";
for(var uid in ips ) {
if(uid == 1) {
html += "<tr><td width='10%'><span style='color: darkgray'><strong>QCloud</strong></span></td>";
}else {
html += "<tr><td width='10%'><span style='color: darkgray'><strong>AWS</strong></span></td>";
}
var ipList = ips[uid];
//该uid+host组合下ips为0,则显示告警数据,不为0,则根据每个ip的解析状态显示出来
if(ipList.length == 0) {
html += "<td><button class='btn btn-danger btn-rounded'>NULL</button></td>";
} else {
html += "<td><div class = 'btn-list'>";
for(var i = 0; i < ipList.length; i ++) {
if(ipList[i].status == "SUCCESSED") {
html += "<button class='btn btn-success btn-rounded'>" + ipList[i].ip + "</button>";
} else {
html += "<button class='btn btn-danger btn-rounded'>";
html += "<a data-container='body' data-toggle='popover' data-placement='bottom' title='Detail'";
html += "data-content= '" + ipList[i].info + "'><button class='btn btn-danger btn-rounded'>" + ipList[i].ip + "</button></a>";
}
}
html +="</div></td>";
}
html += "</tr>";
}
html += "</tbody></table>";
return html;
}
//当分页控件被点击时,remove掉之前的popover
function removePopoverDiv() {
var popovers = getClass('div','popover');
if(popovers.length!== 0) {
for(var i = 0; i < popovers.length; i++) {
document.body.removeChild(popovers[i]);
}
}
}
//获得标签名为tagName,类名className的元素的所有内容作为数组输出
function getClass(tagName,className)
{
if(document.getElementsByClassName) //支持这个函数
{ return document.getElementsByClassName(className);
}
else
{ var tags=document.getElementsByTagName(tagName);//获取标签
var tagArr=[];//用于返回类名为className的元素
for(var i=0;i < tags.length; i++)
{
if(tags[i].class == className)
{
tagArr[tagArr.length] = tags[i];//保存满足条件的元素
}
}
return tagArr;
}
}