merge experimental #1

Merged
jlobbes merged 25 commits from experimental into master 2023-08-17 15:16:51 +01:00
3 changed files with 160 additions and 4 deletions
Showing only changes of commit a153642f72 - Show all commits

View File

@ -45,6 +45,12 @@
</div> </div>
</a> </a>
<a href="/">Home</a> <a href="/">Home</a>
{% if request.user.is_authenticated %}
<a href="{% url 'dashboard' %}">Dashboard</a>
{% endif %}
{% if request.user.is_authenticated %}
<a class="btn text-lg" href="{% url 'mews-init' %}">Record Vitals</a>
{% endif %}
<div class="grow"></div> <div class="grow"></div>
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<a class="btn-outline text-lg" href="{% url 'logout' %}">Log Out</a> <a class="btn-outline text-lg" href="{% url 'logout' %}">Log Out</a>

View File

@ -5,8 +5,141 @@
{% endblock title %} {% endblock title %}
{% block content %} {% block content %}
<div class="flex flex-col justify-center items-center gap-2 py-4 mx-4 max-w-4xl"> <div class="flex flex-col justify-center items-center gap-8 py-4 px-8 w-full h-full">
<h1>Dashboard</h1>
<p1>There is nothing here yet.</p1> <h1 class="w-full text-center">Dashboard</h1>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">MEWS Measurements</h2>
{% if mews_data %}
<canvas id="mewsChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">Blood Pressure Measurements</h2>
{% if blood_pressure_data %}
<canvas id="bloodPressureChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">Body Temperature Measurements</h2>
{% if body_temp_data %}
<canvas id="bodyTempChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">Heart Rate Measurements</h2>
{% if heart_rate_data %}
<canvas id="heartRateChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">Blood Oxygenation Measurements</h2>
{% if spo2_level_data %}
<canvas id="spo2LevelChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
<div class="flex flex-col justify-center items-center gap-2 p-4 w-full max-h-96">
<h2 class="w-full text-center">Respiration Score Measurements</h2>
{% if respiration_score_data %}
<canvas id="respirationScoreChart"></canvas>
{% else %}
<div class="flex flex-col justify-center items-center h-32 bg-primary-200/25 px-16 rounded-lg">
<p class="italic text-center text-primary/25 font-semibold text-lg px-4">There is no data yet</p>
</div>
{% endif %}
</div>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.3.2/dist/chart.umd.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/date-fns@2.30.0/index.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns@3.0.0/dist/chartjs-adapter-date-fns.bundle.min.js"></script>
<script>
async function createChart(id, data, label) {
new Chart(document.getElementById(id), {
type: 'scatter',
data: {
datasets: [{
label: label,
data: data,
backgroundColor: 'rgba(75, 192, 192, 0.2)', // color for point fill
borderColor: 'rgba(75, 192, 192, 1)', // color for point border
pointBackgroundColor: 'rgba(75, 192, 192, 1)', // color for point fill (on hover)
pointBorderColor: '#fff', // color for point border (on hover)
pointBorderWidth: 1, // border width for point (on hover)
}]
},
options: {
scales: {
x: {
type: 'time',
position: 'bottom'
},
y: {
type: 'linear',
position: 'left'
}
}
}
});
}
const mewsData = JSON.parse('{{ mews_data|safe }}');
const bloodPressureData = JSON.parse('{{ blood_pressure_data|safe }}');
const bodyTempData = JSON.parse('{{ body_temp_data|safe }}');
const heartRateData = JSON.parse('{{ heart_rate_data|safe }}');
const spo2LevelData = JSON.parse('{{ spo2_level_data|safe }}');
const respirationScoreData = JSON.parse('{{ respiration_score_data|safe }}');
for (let dataset of [mewsData, bloodPressureData, bodyTempData, heartRateData, spo2LevelData, respirationScoreData]) {
dataset.forEach((data) => {
data.x = new Date(data.x * 1000).toISOString();
});
}
{% if mews_data %}
createChart("mewsChart", mewsData, "Modified Early Warning Score");
{% endif %}
{% if blood_pressure_data %}
createChart("bloodPressureChart", bloodPressureData, "Systolic Blood Pressure (mmHg)");
{% endif %}
{% if body_temp_data %}
createChart("bodyTempChart", bodyTempData, "Body Temperature (°C)");
{% endif %}
{% if heart_rate_data %}
createChart("heartRateChart", heartRateData, "Heart Rate (bpm)");
{% endif %}
{% if spo2_level_data %}
createChart("spo2LevelChart", spo2LevelData, "Blood Oxygenation (%)");
{% endif %}
{% if respiration_score_data %}
createChart("respirationScoreChart", respirationScoreData, "Respiration Score");
{% endif %}
</script>
{% endblock content %} {% endblock content %}

View File

@ -1,4 +1,5 @@
from datetime import timedelta from datetime import timedelta
import json
from django.shortcuts import redirect, render from django.shortcuts import redirect, render
from django.http import HttpResponse, JsonResponse from django.http import HttpResponse, JsonResponse
@ -18,7 +19,23 @@ def index(request):
@login_required @login_required
@require_http_methods(["GET"]) @require_http_methods(["GET"])
def dashboard(request): def dashboard(request):
return render(request, 'medwings/dashboard.html') mews_records = models.MewsRecord.objects.filter(user=request.user)
blood_pressure_records = models.BloodPressureRecord.objects.filter(user=request.user)
body_temp_records = models.BodyTempRecord.objects.filter(user=request.user)
heart_rate_records = models.HeartRateRecord.objects.filter(user=request.user)
spo2_level_records = models.Spo2LevelRecord.objects.filter(user=request.user)
respiration_score_records = models.RespirationScoreRecord.objects.filter(user=request.user)
context = {
"mews_data": json.dumps([{"x": record.recorded.timestamp(), "y": record.value_n} for record in mews_records]),
"blood_pressure_data": json.dumps([{"x": record.recorded.timestamp(), "y": record.value_systolic_mmhg} for record in blood_pressure_records]),
"body_temp_data": json.dumps([{"x": record.recorded.timestamp(), "y": float(record.value_celsius)} for record in body_temp_records]),
"heart_rate_data": json.dumps([{"x": record.recorded.timestamp(), "y": record.value_bpm} for record in heart_rate_records]),
"spo2_level_data": json.dumps([{"x": record.recorded.timestamp(), "y": record.value_percent} for record in spo2_level_records]),
"respiration_score_data": json.dumps([{"x": record.recorded.timestamp(), "y": record.value_severity} for record in respiration_score_records]),
}
return render(request, 'medwings/dashboard.html', context)
@login_required @login_required