Beautify
This commit is contained in:
Adrià
parent
b6d9fc1a28
commit
e3707750b4
|
|
@ -27,10 +27,11 @@ output = []
|
|||
|
||||
# Functions
|
||||
|
||||
|
||||
def calculate_count(data):
|
||||
count = {}
|
||||
ls = data.values()
|
||||
z, nz = 0,0
|
||||
z, nz = 0, 0
|
||||
for v in ls:
|
||||
if v == 0:
|
||||
z += 1
|
||||
|
|
@ -78,6 +79,7 @@ def getMonit():
|
|||
|
||||
# Classes
|
||||
|
||||
|
||||
class monitDashboard(web.application):
|
||||
def run(self, port=8080, *middleware):
|
||||
func = self.wsgifunc(*middleware)
|
||||
|
|
@ -89,10 +91,12 @@ class index(object):
|
|||
return render.index(output=getMonit(),
|
||||
now=datetime.datetime.now())
|
||||
|
||||
|
||||
class help(object):
|
||||
def GET(self):
|
||||
return render.help()
|
||||
|
||||
|
||||
class download(object):
|
||||
def GET(self):
|
||||
filename = 'health_report.xlsx'
|
||||
|
|
@ -100,10 +104,11 @@ class download(object):
|
|||
utils.generate_report_excel(output, filename)
|
||||
web.header('Content-Disposition',
|
||||
'attachment; filename="health_report.xlsx"')
|
||||
web.header('Content-type','application/octet-stream')
|
||||
web.header('Cache-Control','no-cache')
|
||||
web.header('Content-type', 'application/octet-stream')
|
||||
web.header('Cache-Control', 'no-cache')
|
||||
return open(filename, 'rb').read()
|
||||
|
||||
|
||||
# Main
|
||||
if __name__ == "__main__":
|
||||
app = monitDashboard(urls, globals())
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import xlsxwriter
|
||||
import os
|
||||
|
||||
|
||||
def generate_report_excel(output, filename):
|
||||
if os.path.exists(filename):
|
||||
os.remove(filename)
|
||||
|
|
|
|||
|
|
@ -97,8 +97,8 @@ div.panel.show {
|
|||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top:200;
|
||||
margin-bottom:100;
|
||||
margin-top: 200;
|
||||
margin-bottom: 100;
|
||||
}
|
||||
|
||||
.canvas-graph {
|
||||
|
|
@ -108,7 +108,7 @@ div.panel.show {
|
|||
position: relative;
|
||||
background-color: white;
|
||||
margin: 20px 0;
|
||||
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)
|
||||
}
|
||||
|
||||
.canvas-header {
|
||||
|
|
|
|||
|
|
@ -11,23 +11,23 @@ for (i = 0; i < acc.length; i++) {
|
|||
function draw(rate) {
|
||||
var count = [rate['green'], rate['red']];
|
||||
var percentage = [
|
||||
(count[0]*100)/(count[0]+count[1]),
|
||||
(count[1]*100)/(count[0]+count[1])
|
||||
(count[0] * 100) / (count[0] + count[1]),
|
||||
(count[1] * 100) / (count[0] + count[1])
|
||||
]
|
||||
var status = ['Ok', 'Error'];
|
||||
var green = (percentage[0]*2)/100;
|
||||
var red = (percentage[1]*2)/100;
|
||||
var green = (percentage[0] * 2) / 100;
|
||||
var red = (percentage[1] * 2) / 100;
|
||||
var canvas = document.getElementById("canvas");
|
||||
var ctx = canvas.getContext("2d");
|
||||
var colors = ['#00a90e','#ff9a02'];
|
||||
var colors = ['#00a90e', '#ff9a02'];
|
||||
var angles = [Math.PI * green, Math.PI * red];
|
||||
var offset = 0;
|
||||
var beginAngle = 0;
|
||||
var endAngle = 0;
|
||||
var offsetX, offsetY, medianAngle;
|
||||
|
||||
ctx.clearRect(0,0,canvas.width, canvas.height);
|
||||
for(var i = 0; i < angles.length; i = i + 1) {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
for (var i = 0; i < angles.length; i = i + 1) {
|
||||
beginAngle = endAngle;
|
||||
endAngle = endAngle + angles[i];
|
||||
medianAngle = (endAngle + beginAngle) / 2;
|
||||
|
|
@ -36,7 +36,7 @@ function draw(rate) {
|
|||
|
||||
ctx.beginPath();
|
||||
|
||||
if(percentage[i] !== 0) {
|
||||
if (percentage[i] !== 0) {
|
||||
ctx.fillStyle = colors[i % colors.length];
|
||||
ctx.moveTo(200 + offsetX, 200 + offsetY);
|
||||
ctx.arc(200 + offsetX, 200 + offsetY, 120, beginAngle, endAngle);
|
||||
|
|
|
|||
|
|
@ -1,14 +1,14 @@
|
|||
$def with (output, now)
|
||||
|
||||
<body onload="draw($output[0]['s_rate']);">
|
||||
$ errors = 0
|
||||
$ color = "green"
|
||||
<div>
|
||||
<div class="download-header">
|
||||
$ errors = 0
|
||||
$ color = "green"
|
||||
<div>
|
||||
<div class="download-header">
|
||||
<button class="download-button" onclick="window.location.href = 'download';">Download Report</button>
|
||||
</div>
|
||||
<div style="height: 100%;border-right:2px solid #ccc; padding:5px;overflow-x: hidden; float:left; width:48%">
|
||||
$for server in range(len(output)):
|
||||
</div>
|
||||
<div style="height: 100%;border-right:2px solid #ccc; padding:5px;overflow-x: hidden; float:left; width:48%">
|
||||
$for server in range(len(output)):
|
||||
$code:
|
||||
errors = 0
|
||||
color = "green"
|
||||
|
|
@ -82,21 +82,23 @@ $for server in range(len(output)):
|
|||
</div>
|
||||
|
||||
|
||||
<div class="canvas-container">
|
||||
<div class="canvas-graph">
|
||||
<div class="canvas-header"><h2 style="margin: 0">Hosts status</h2></div>
|
||||
<canvas id="canvas" width="400" height="400"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div class="canvas-container">
|
||||
<div class="canvas-graph">
|
||||
<div class="canvas-header">
|
||||
<h2 style="margin: 0">Hosts status</h2>
|
||||
</div>
|
||||
<canvas id="canvas" width="400" height="400"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="height: 10%; float:right">
|
||||
<br><br><br>
|
||||
Latest update: $now.day/$now.month/$now.year, $now.hour:$now.minute:$now.second
|
||||
<br><br>
|
||||
<a href="/">Home</a> | <a href="/help">Help</a>
|
||||
</div>
|
||||
<div style="height: 10%; float:right">
|
||||
<br><br><br>
|
||||
Latest update: $now.day/$now.month/$now.year, $now.hour:$now.minute:$now.second
|
||||
<br><br>
|
||||
<a href="/">Home</a> | <a href="/help">Help</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<script src="static/monit-dashboard.js" type="text/javascript"></script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue