feat: add recap page
This commit is contained in:
@@ -54,10 +54,6 @@
|
||||
border: none; border-radius: 10px; cursor: pointer;
|
||||
background: var(--button-bg); color: var(--button-fg);
|
||||
}
|
||||
.osiris-stats { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; }
|
||||
.osiris-stats div { font-size: 0.85rem; color: var(--body-quiet-color); }
|
||||
.osiris-stats strong { display: block; font-size: 1.15rem; color: var(--body-fg); }
|
||||
.osiris-chart { width: 100%; height: auto; overflow: visible; }
|
||||
.osiris-empty { color: var(--body-quiet-color); font-style: italic; }
|
||||
</style>
|
||||
{% endblock %}
|
||||
@@ -134,43 +130,7 @@
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="osiris-card" style="margin-top:16px">
|
||||
<h2 style="margin-top:0">Pulse — last 90 days</h2>
|
||||
{% if chart %}
|
||||
<svg class="osiris-chart" viewBox="0 0 {{ chart.width }} {{ chart.height }}" role="img"
|
||||
aria-label="Pulse from {{ chart.first_date }} to {{ chart.last_date }}">
|
||||
<line x1="24" y1="24" x2="{{ chart.width|add:'-24' }}" y2="24"
|
||||
stroke="currentColor" stroke-width="0.5" opacity="0.2"/>
|
||||
<line x1="24" y1="{{ chart.height|add:'-24' }}" x2="{{ chart.width|add:'-24' }}"
|
||||
y2="{{ chart.height|add:'-24' }}" stroke="currentColor" stroke-width="0.5" opacity="0.2"/>
|
||||
<polyline points="{{ chart.polyline }}" fill="none" stroke="#79aec8" stroke-width="2"
|
||||
stroke-linejoin="round" stroke-linecap="round" vector-effect="non-scaling-stroke"/>
|
||||
{% for point in chart.points %}
|
||||
<circle cx="{{ point.x }}" cy="{{ point.y }}" r="2" fill="#417690">
|
||||
<title>{{ point.reading.date }} — {{ point.reading.bpm }} bpm</title>
|
||||
</circle>
|
||||
{% endfor %}
|
||||
<text x="2" y="27" font-size="8" fill="currentColor" opacity="0.6">{{ chart.high }}</text>
|
||||
<text x="2" y="{{ chart.height|add:'-21' }}" font-size="8" fill="currentColor" opacity="0.6">{{ chart.low }}</text>
|
||||
</svg>
|
||||
<div class="osiris-stats">
|
||||
<div>Average<strong>{{ chart.average }} bpm</strong></div>
|
||||
<div>Range<strong>{{ chart.low }}–{{ chart.high }}</strong></div>
|
||||
<div>Readings<strong>{{ reading_count }}</strong></div>
|
||||
<div>
|
||||
Trend
|
||||
<strong>
|
||||
{% if chart.trend > 0 %}↑ +{{ chart.trend }}{% elif chart.trend < 0 %}↓ {{ chart.trend }}{% else %}→ steady{% endif %}
|
||||
{% if chart.trend %}<span style="font-size:0.75rem">bpm/day</span>{% endif %}
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<p class="osiris-empty">Record the pulse on at least two days to see the graph.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="osiris-card" id="reminders">
|
||||
<div class="osiris-card" id="reminders" style="margin-top:16px">
|
||||
<h2 style="margin-top:0">Reminders</h2>
|
||||
<p class="dose-detail" id="reminder-status">Checking…</p>
|
||||
<div style="display:flex; gap:8px; flex-wrap:wrap">
|
||||
@@ -200,7 +160,10 @@
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<p style="text-align:center"><a href="{% url 'admin:index' %}">Manage medication & history →</a></p>
|
||||
<p style="text-align:center">
|
||||
<a href="{% url 'tracker:recap' %}">Recap: doses, pulse & notes →</a><br>
|
||||
<a href="{% url 'admin:index' %}">Manage medication & history →</a>
|
||||
</p>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
|
||||
Reference in New Issue
Block a user