Add daily overview and part_of_day to food logs

Introduces 'overview' and 'test' routes and templates for daily nutrition summaries. Updates FoodLog model to include 'part_of_day' and 'date_' fields for better log categorization. Adjusts log creation and seed data to support new fields. Removes SSL context from app run for local development.
This commit is contained in:
2025-07-07 14:44:50 +02:00
parent 74ce42c578
commit 30e5e959cd
6 changed files with 182 additions and 5 deletions

View File

@@ -0,0 +1,69 @@
{% extends "base.html" %}
{% block title %}
Food Nutritional Info
{% endblock %}
{% block content %}
<div class="container my-4">
<div class="d-flex justify-content-center mb-4">
<h1>Daily Nutrition Overview</h1>
</div>
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-4 g-4">
<!-- Calories -->
<div class="col">
<div class="card text-bg-primary h-100">
<div class="card-body">
<h5 class="card-title">Calories</h5>
<h2>1,850 / 2,000 kcal</h2>
<div class="progress mt-3" style="height: 10px;">
<div class="progress-bar bg-warning" style="width: 92%;"></div>
</div>
</div>
</div>
</div>
<!-- Protein -->
<div class="col">
<div class="card text-bg-success h-100">
<div class="card-body">
<h5 class="card-title">Protein</h5>
<h2>120g / 150g</h2>
<div class="progress mt-3" style="height: 10px;">
<div class="progress-bar bg-light" style="width: 80%;"></div>
</div>
</div>
</div>
</div>
<!-- Carbs -->
<div class="col">
<div class="card text-bg-info h-100">
<div class="card-body">
<h5 class="card-title">Carbs</h5>
<h2>200g / 250g</h2>
<div class="progress mt-3" style="height: 10px;">
<div class="progress-bar bg-dark" style="width: 80%;"></div>
</div>
</div>
</div>
</div>
<!-- Fat -->
<div class="col">
<div class="card text-bg-danger h-100">
<div class="card-body">
<h5 class="card-title">Fat</h5>
<h2>60g / 70g</h2>
<div class="progress mt-3" style="height: 10px;">
<div class="progress-bar bg-light" style="width: 86%;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock%}

View File

@@ -0,0 +1,69 @@
{% extends "base.html" %}
{% block title %}
Food Nutritional Info
{% endblock %}
{% block content %}
<!-- Daily Overview Section -->
<div class="container">
<div class="mb-4 p-3 border rounded">
<div class="text-center">
<h2>Daily Overview ({{date}})</h2>
<p>Summary info here...</p>
</div>
</div>
<div class="p-3 border rounded">
<div class="text-center">
<h2>Detailed Information</h2>
<p>More content here...</p>
</div>
<div class="p-3 mb-2 border rounded">
<h4>Breakfast</h4>
{% for log in logs[0] %}
<p>{{log.food_item.name}}</p>
{% endfor %}
</div>
<div class="p-3 mb-2 border rounded">
<h4>Lunch</h4>
{% for log in logs[1] %}
<p>{{log.food_item.name}}</p>
{% endfor %}
</div>
<div class="p-3 mb-2 border rounded">
<h4>Dinner</h4>
{% for log in logs[2] %}
<p>{{log.food_item.name}}</p>
{% endfor %}
</div>
<div class="p-3 mb-2 border rounded">
<h4>Snacks</h4>
{% for log in logs[3] %}
<p>{{log.food_item.name}}</p>
{% endfor %}
</div>
</div>
</div>
<div class="container-fluid my-4">
<div class="d-flex justify-content-center">
<h1>Overview {{date}}</h1>
</div>
<div class="d-flex justify-content-center">
<div class="mx-2">ENERGY</div>
<div class="mx-2">PROTEIN</div>
<div class="mx-2">CARBS</div>
<div class="mx-2">FATS</div>
</div>
<div class="m-5"></div>
<div class="d-flex justify-content-center">
<div> Breakfast </div>
</div>
</div>
{% endblock%}