Files
bloodpressure/app/templates/partials/dashboard_weekly.html
2026-03-10 16:25:52 +11:00

56 lines
3.2 KiB
HTML

<div>
<!-- Weekly Navigation -->
<div class="flex justify-between items-center mb-4 px-2">
<button hx-get="{{ url_for('main.dashboard_weekly', week_offset=week_offset - 1) }}"
hx-target="#dashboard-content"
class="flex items-center text-primary-600 hover:text-primary-800 font-medium transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 mr-1" fill="none" viewBox="0 0 24 24"
stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" />
</svg>
Previous Week
</button>
<span class="text-gray-600 font-semibold {% if week_offset == 0 %}text-primary-600{% endif %}">
{% if week_offset == 0 %}This Week{% elif week_offset == -1 %}Last Week{% elif week_offset == 1 %}Next
Week{% else %}{{ week_offset|abs }} weeks {% if week_offset < 0 %}ago{% else %}from now{% endif %}{% endif
%} </span>
<button hx-get="{{ url_for('main.dashboard_weekly', week_offset=week_offset + 1) }}"
hx-target="#dashboard-content"
class="flex items-center text-primary-600 hover:text-primary-800 font-medium transition-colors {% if week_offset >= 0 %}opacity-50 pointer-events-none{% endif %}">
Next Week
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-1" fill="none" viewBox="0 0 24 24"
stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" />
</svg>
</button>
</div>
<div class="grid grid-cols-7 text-center">
{% for day in week %}
<div class="border p-2 bg-gray-50 flex flex-col min-h-[140px]">
<div class="text-sm font-bold text-gray-500 mb-2">{{ day.date }}</div>
{% if day.readings %}
<div class="space-y-1.5 flex-grow">
{% for reading in day.readings %}
<a href="{{ url_for('reading.edit_reading', reading_id=reading.id) }}"
class="flex flex-col 2xl:flex-row justify-between items-center px-1.5 py-1 bg-white border border-gray-200 rounded shadow-sm hover:border-primary-400 hover:bg-primary-50 transition-colors">
<span class="text-xs font-bold text-gray-800">{{ reading.systolic }}/{{ reading.diastolic
}}</span>
<div class="flex items-center gap-1 2xl:mt-0 mt-0.5">
<span class="text-[10px] font-medium bg-red-50 text-red-600 px-1 rounded" title="Heart Rate">{{
reading.heart_rate }}</span>
<span class="text-[10px] text-gray-400 font-medium whitespace-nowrap">{{
reading.local_timestamp.strftime('%H:%M') }}</span>
</div>
</a>
{% endfor %}
</div>
{% else %}
<div class="flex-grow"></div> <!-- Spacer -->
{% endif %}
</div>
{% endfor %}
</div>
</div>