stef_buwalda/dashboard_test
1
0
Fork 0
mirror of https://github.com/StefBuwalda/dashboard_test.git synced 2025-10-30 03:09:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

Did some chart stuff (ugly)

Browse Source
This commit is contained in:
Stef
2025-09-05 21:09:31 +02:00
parent 7c5e15af99
commit 5617440013
2 changed files with 109 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/flask_app/templates/chart.html
View File

@@ -1,10 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en" data-bs-theme="dark">
<head> <head>
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1" charset=" UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Line Chart</title> <title>Simple Line Chart</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns"></script> <script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns"></script>
<script src="https://www.chartjs.org/docs/latest/samples/utils.js"></script> <script src="https://www.chartjs.org/docs/latest/samples/utils.js"></script>
@@ -43,14 +45,18 @@
x: { x: {
type: 'time', // Important for datetime axis type: 'time', // Important for datetime axis
time: { time: {
unit: 'hour', unit: 'minute',
tooltipFormat: 'HH:mm:ss', tooltipFormat: 'HH:mm:ss',
displayFormats: { displayFormats: { hour: 'HH:mm' }
hour: 'HH:mm'
}
}, },
min: min, min: min,
max: max max: max,
ticks: { color: '#ffffff' }, // X-axis labels
grid: { color: 'rgba(255, 255, 255, 0.1)' } // X-axis grid lines
},
y: {
ticks: { color: '#ffffff' }, // Y-axis labels
grid: { color: 'rgba(255, 255, 255, 0.1)' } // Y-axis grid lines
} }
} }
} }

95
app/routes.py Normal file
View File

@@ -0,0 +1,95 @@
from flask import Blueprint, render_template, abort, jsonify, send_file, json
from typing import cast, Optional, Any
from datetime import datetime, timedelta, timezone
from config import timeout
from .models import service, log
from app import app, db
bp = Blueprint(
"main",
"__name__",
url_prefix="/",
static_folder="static",
)
# Prepares log data for chart.js chart
def prepare_chart_data(
logs: list[log],
) -> tuple[list[str], list[Optional[int]]]:
if len(logs) <= 0: # Return empty if there are no logs
return ([], [])
x = [logs[0].dateCreatedUTC().isoformat()]
y = [logs[0].ping]
for i in range(1, len(logs)):
log1 = logs[i]
log2 = logs[i - 1]
# Check if the gap in points exceeds a threshold
if (abs(log1.dateCreatedUTC() - log2.dateCreatedUTC())) > timedelta(
milliseconds=1.5 * (timeout + 1000)
):
x.append(log2.dateCreatedUTC().isoformat())
y.append(None)
x.append(log1.dateCreatedUTC().isoformat())
y.append(log1.ping)
return (x, y)
@bp.route("/")
def homepage():
return render_template("home.html")
@bp.route("/chart/<int:id>")
def chart(id: int):
with app.app_context():
logs = []
s = db.session.query(service).filter_by(id=id).first()
if s:
logs = cast(
list[log],
s.logs.order_by(log.dateCreated.desc()) # type: ignore
.limit(300)
.all(),
)
else:
return abort(code=403)
x, y = prepare_chart_data(logs=logs)
now = datetime.now(timezone.utc)
max_ = now
min_ = now - timedelta(hours=1)
return render_template(
"chart.html",
dates=x,
values=json.dumps(y),
min=min_.isoformat(),
max=max_.isoformat(),
)
@bp.route("/api/status")
def status():
results: list[dict[str, Any]] = []
with app.app_context():
a = db.session.query(service).all()
for s in a:
b = cast(
Optional[log],
s.logs.order_by(
log.dateCreated.desc() # type: ignore
).first(),
)
if b:
results.append(s.to_dict() | b.to_dict())
return jsonify(results)
@bp.route("/favicon.svg")
def favicon():
return send_file("/static/favicon.svg")