WebApp Design modern

app.py

@@ -5,19 +5,98 @@ import sys
 import json
 from pathlib import Path
 from flask import redirect
+from datetime import datetime
 
 app = Flask(__name__)
 
 BASE_DIR = Path(__file__).parent
 CATEGORIES_FILE = BASE_DIR / "Kategorien.json"
 
+def get_current_week_data():
 
+    year, week, _ = datetime.now().isocalendar()
+
+    summary_file = (
+        BASE_DIR
+        / "Transaktionen"
+        / str(year)
+        / "summary"
+        / f"category_summary_{year}_KW{week:02d}.json"
+    )
+
+    transactions_file = (
+        BASE_DIR
+        / "Transaktionen"
+        / str(year)
+        / "categorized_json"
+        / f"categorized_transactions_{year}_KW{week:02d}.json"
+    )
+
+    summary = None
+    transactions = []
+
+    total_income = 0
+    total_expenses = 0
+    total_saldo = 0
+
+    if summary_file.exists():
+
+        with open(
+            summary_file,
+            encoding="utf-8"
+        ) as f:
+
+            summary = json.load(f)
+
+        for values in summary.values():
+
+            total_income += values["income"]
+            total_expenses += values["expenses"]
+            total_saldo += values["saldo"]
+
+    if transactions_file.exists():
+
+        with open(
+            transactions_file,
+            encoding="utf-8"
+        ) as f:
+
+            transactions = json.load(f)
+
+    return (
+        year,
+        week,
+        summary,
+        transactions,
+        total_income,
+        total_expenses,
+        total_saldo
+    )
 
+@app.route("/")
 @app.route("/")
 def index():
-    return render_template("index.html")
 
+    (
+        year,
+        week,
+        summary,
+        transactions,
+        total_income,
+        total_expenses,
+        total_saldo
+    ) = get_current_week_data()
 
+    return render_template(
+        "index.html",
+        year=year,
+        week=week,
+        summary=summary,
+        transactions=transactions[:10],
+        total_income=total_income,
+        total_expenses=total_expenses,
+        total_saldo=total_saldo
+    )
 @app.route("/run/balance", methods=["POST"])
 def run_balance():
 

requirements.txt

@@ -1,3 +1,4 @@
 fints
 openpyxl
-mt-940
+mt-940
+flask

static/style.css

@@ -183,4 +183,14 @@ text-decoration: underline;
 
 .tag a:hover {
     color: #202020;
+}
+
+.transaction-table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.transaction-table td {
+    padding: 6px;
+    border-bottom: 1px solid #eee;
 }

templates/index.html

@@ -88,14 +88,14 @@
             <input
                 type="text"
                 name="year"
-                placeholder="2026">
+                value="{{ year }}">
 
             KW:
 
             <input
                 type="text"
                 name="week"
-                placeholder="25">
+                value="{{ week }}">
 
             <br><br>
 
@@ -119,14 +119,14 @@
             <input
                 type="text"
                 name="year"
-                placeholder="2026">
+                value="{{ year }}">
 
             KW:
 
             <input
                 type="text"
                 name="week"
-                placeholder="25">
+                value="{{ week }}">
 
             <br><br>
 
@@ -143,8 +143,7 @@
         <h2>Kategorien</h2>
 
         <p>
-            Kategorien und Schlüsselwörter
+            Kategorien und Schlüsselwörter verwalten.
-            verwalten.
         </p>
 
         <a href="/categories">
@@ -157,6 +156,77 @@
 
     </div>
 
+    <div class="card">
+
+        <h2>
+            KW{{ week }}
+        </h2>
+
+        <p>
+            Einnahmen:
+            <strong>
+                {{ "%.2f"|format(total_income) }} €
+            </strong>
+        </p>
+
+        <p>
+            Ausgaben:
+            <strong>
+                {{ "%.2f"|format(total_expenses) }} €
+            </strong>
+        </p>
+
+        <p>
+            Saldo:
+            <strong>
+                {{ "%.2f"|format(total_saldo) }} €
+            </strong>
+        </p>
+
+    </div>
+
+    <div class="card">
+
+        <h2>
+            Letzte Transaktionen
+        </h2>
+
+        {% if transactions %}
+
+            <table class="transaction-table">
+
+                {% for t in transactions[-10:]|reverse %}
+
+                <tr>
+
+                    <td>
+                        {{ t.date }}
+                    </td>
+
+                    <td>
+                        {{ t.applicant_name }}
+                    </td>
+
+                    <td class="{% if t.amount >= 0 %}amount-positive{% else %}amount-negative{% endif %}">
+                        {{ "%.2f"|format(t.amount) }} €
+                    </td>
+
+                </tr>
+
+                {% endfor %}
+
+            </table>
+
+        {% else %}
+
+            <p>
+                Keine Transaktionen vorhanden.
+            </p>
+
+        {% endif %}
+
+    </div>
+
 </div>
 ```
 
@@ -171,4 +241,5 @@ Hintergasse © 2026
 </div>
 
 </body>
+
 </html>