{% extends 'base.html' %}
{% block title %}Trading-Buch · Finance Dashboard{% endblock %}
{% block content %}
{% include '_trading_nav.html' %}
<div class="page-heading"><div><p class="eyebrow">DEPOT & TRANSAKTIONEN</p><h1>Trading-Buch</h1><p class="muted">Deine Käufe, Verkäufe und offenen Einstandswerte.</p></div><a class="button" href="/trading/transactions/new">+ Transaktion eintragen</a></div>
<form class="filters" method="get"><label>Auswertungswährung<select name="currency">{% for currency in stats.currencies %}<option {{ 'selected' if currency == stats.currency else '' }}>{{ currency }}</option>{% endfor %}</select></label><button>Auswerten</button><span class="muted">Alle Kennzahlen und Diagramme nur in {{ stats.currency }} · keine Währungsumrechnung</span></form>
<div class="kpi-grid">
<article class="kpi"><h2>Investiertes Kapital</h2><strong>{{ stats.invested_capital|decimal }} {{ stats.currency }}</strong><small>Einstand der offenen Positionen inkl. Gebühren</small></article>
<article class="kpi"><h2>Aktive Positionen</h2><strong>{{ stats.active_positions }}</strong><small>Mit positivem Bestand</small></article>
<article class="kpi"><h2>Käufe dieses Jahr</h2><strong>{{ stats.buys_current_year }}</strong><small>Anzahl Kauftransaktionen</small></article>
<article class="kpi"><h2>Verkäufe dieses Jahr</h2><strong>{{ stats.sells_current_year }}</strong><small>Anzahl Verkaufstransaktionen</small></article>
<article class="kpi"><h2>Realisiert G/V dieses Jahr</h2><strong class="{{ 'negative' if stats.realized_profit_loss_current_year.startswith('-') else 'positive' }}">{{ stats.realized_profit_loss_current_year|decimal }} {{ stats.currency }}</strong><small>Nach Gebühren · Durchschnittseinstand</small></article>
<article class="kpi"><h2>Transaktionen gesamt</h2><strong>{{ stats.transactions_total }}</strong><small>Alle Jahre · {{ stats.currency }}</small></article>
</div>
<p class="notice warning">Portfolioanalyse mit gleitendem Durchschnittseinstand. Keine deutsche steuerliche FIFO-Berechnung.</p>
<section class="panel"><div class="section-heading"><h2>Aktuelle Positionen · {{ stats.currency }}</h2><a href="/trading/positions">Alle Währungen →</a></div>{% set positions = stats.positions %}{% include '_trading_positions.html' %}</section>
<div class="chart-grid">
{% for field,title in [('by_source','Investiertes Kapital nach Source'),('by_strategy','Investiertes Kapital nach Strategie')] %}
<section class="panel"><h2>{{ title }}</h2><p class="muted">Offener Einstand · Verkäufe reduzieren ursprüngliche Anteile proportional.</p><div class="chart"><canvas id="{{ field }}" role="img" aria-label="{{ title }}; Werte in der nachfolgenden Tabelle"></canvas></div><div class="table-scroll"><table><thead><tr><th>{{ 'Source' if field == 'by_source' else 'Strategie' }}</th><th>Betrag ({{ stats.currency }})</th><th>Anteil</th></tr></thead><tbody>{% for row in stats[field] %}<tr><td><span class="tag">{{ sources[row.key] if field == 'by_source' else strategies.get(row.key, 'Ohne Tag') }}</span></td><td class="numeric">{{ row.amount|decimal }}</td><td class="numeric">{{ row.percentage|decimal if row.percentage is not none else '–' }}{{ ' %' if row.percentage is not none else '' }}</td></tr>{% endfor %}</tbody></table></div></section>
{% endfor %}
<section class="panel chart-wide"><h2>Käufe pro Monat und Jahr</h2><div class="chart"><canvas id="trading-monthly" role="img" aria-label="Anzahl Käufe nach Monat und Jahr"></canvas></div><details><summary>Monatswerte anzeigen</summary><div class="table-scroll"><table><thead><tr><th>Jahr</th>{% for month in months %}<th>{{ month }}</th>{% endfor %}</tr></thead><tbody>{% for year in stats.monthly %}<tr><th>{{ year.year }}</th>{% for count in year.counts %}<td>{{ count }}</td>{% endfor %}</tr>{% endfor %}</tbody></table></div></details></section>
</div><p class="muted" id="trading-chart-status">Diagramme werden geladen. Alle Werte sind auch als Tabellen verfügbar.</p>
<section class="panel"><div class="section-heading"><h2>Letzte Transaktionen · alle Währungen</h2><a href="/trading/transactions">Vollständige Historie →</a></div>{% include '_trading_entries.html' %}</section>
{% endblock %}
{% block scripts %}<script id="trading-data" type="application/json">{{ {'stats':stats, 'sources':sources, 'strategies':strategies, 'months':months}|tojson }}</script><script defer src="https://cdn.jsdelivr.net/npm/chart.js@4.5.1/dist/chart.umd.min.js"></script><script defer src="{{ url_for('static', path='js/trading.js') }}"></script>{% endblock %}