-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy paththresholds.html
93 lines (93 loc) · 4.19 KB
/
thresholds.html
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
<html>
<head>
<script src="/js/jquery-1.7.2.min.js"></script>
<link rel="stylesheet" type="text/css" href="/css/datatables.min.css"/>
<link href="https://fonts.googleapis.com/css?family=Red+Hat+Display&display=swap" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/menu.css"/>
<script type="text/javascript" src="/js/datatables.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script src="/js/SimpleTableCellEditor.es6.min.js"></script>
</head>
<body>
<ul id="menu">
<li><div class="logo"><font color="#ff1a1a">RHV</font><font size="4px">2</font>Prometheus</div></li>
<li><a href="/events">Events</a></li>
<li><a href="/metrics_menu">Metrics</a></li>
<li><a href="/thresholds">Thresholds</a></li>
<li><a href="/prom2nagios">Prometheus2Nagios</a></li>
<li><a href="/api_menu">Api</a></li>
<li><a href="/about">About</a></li>
<li style="float:right"><a class="active" href="/logout">Logout</a></li>
</ul>
<br>
<table id="tabla" class="data">
<thead>
<tr>
<th>id</th>
<th>Warning</th>
<th>Critical</th>
<th>Name</th>
<th>Compare method</th>
<th>perfdata</th>
<th>lastValue</th>
<th>last check</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script>
var socketThresholds = io("/thresholds");
editor = new SimpleTableCellEditor("tabla");
editor.SetEditableClass("editMe");
$("#tabla").on("cell:edited", function (event) {
//console.log(`'${event.oldValue}' changed to '${event.newValue}'`);
console.log(event.element.id + " changed to " + event.newValue);
socketThresholds.emit("updateVal", [event.element.id, event.newValue]);
});
socketThresholds.on("thresholds", function(data){
var arrayThresholds = [];
for(var t in data['rows']){
arrayThresholds.push(data['rows'][t]['doc']);
}
$(document).ready( function() {
if (!$.fn.DataTable.isDataTable( '#tabla' ) ) {
console.dir(arrayThresholds);
$('#tabla').dataTable({
data: arrayThresholds,
"pageLength": 20,
"lengthMenu": [ 20, 50, 75, 100 ],
"columnDefs": [
{ className: "editMe", "targets": [ 1,2,3,4,5 ] }
],
rowId: "_id",
columns: [
{ data: "_id"},
{ data: "warning" },
{ data: "critical" },
{ data: "name" },
{ data: "comparemethod" },
{ data: "perfdata" },
{ data: "lastvalue" },
{ data: "date" }
]
});
}else{
$('#tabla').dataTable().fnClearTable();
$('#tabla').dataTable().fnAddData(arrayThresholds);
}
var table = document.getElementById("tabla");
for (var i = 0, row; row = table.rows[i]; i++) {
//iterate through rows
//rows would be accessed using the "row" variable assigned in the for loop
for (var j = 0, col; col = row.cells[j]; j++) {
col.id = j + "---" + row.cells[0].innerHTML;
//iterate through columns
//columns would be accessed using the "col" variable assigned in the for loop
}
}
});
});
</script>
</body>
</html>