{% extends "base.html" %}
{% block title %}Wochenplan | Nouri{% endblock %}
{% block content %}
<section class="page-intro">
    <div>
        <p class="eyebrow">Wochenplan</p>
        <h1>Struktur fuer die naechsten Tage</h1>
        <p class="lead">Der Plan bleibt bewusst leichtgewichtig. Vorhandene Dinge tauchen in der Auswahl zuerst auf.</p>
    </div>
    <div class="week-nav">
        <a class="ghost-button" href="{{ url_for('main.planner', week=prev_week.isoformat()) }}">Vorige Woche</a>
        <span>{{ days[0].strftime('%d.%m.') }} bis {{ days[-1].strftime('%d.%m.%Y') }}</span>
        <a class="ghost-button" href="{{ url_for('main.planner', week=next_week.isoformat()) }}">Naechste Woche</a>
    </div>
</section>

<section class="panel compact-form-panel">
    <form method="post" class="planner-form">
        {{ csrf_input() }}
        <label>
            Tag
            <input type="date" name="plan_date" value="{{ days[0].isoformat() }}">
        </label>
        <label>
            Tageszeit
            <select name="daypart_id">
                {% for daypart in dayparts %}
                    <option value="{{ daypart.id }}">{{ daypart.name }}</option>
                {% endfor %}
            </select>
        </label>
        <label class="wide">
            Eintrag
            <select name="item_id">
                <option value="">Etwas fuer den Plan waehlen</option>
                {% for item in selectable_items %}
                    <option value="{{ item.id }}">{{ item.name }} · {{ item_kind_labels[item.kind] }}{% if item.availability_state == 'home' %} · zuhause{% endif %}</option>
                {% endfor %}
            </select>
        </label>
        <label class="wide">
            Notiz
            <input type="text" name="note" placeholder="Optional, z. B. zuerst einkaufen">
        </label>
        <button type="submit">In den Plan legen</button>
    </form>
</section>

<section class="planner-grid">
    {% for daypart in dayparts %}
        <div class="planner-row">
            <div class="planner-label">{{ daypart.name }}</div>
            {% for day in days %}
                <div class="planner-cell">
                    <div class="planner-date">{{ day.strftime('%a %d.%m.') }}</div>
                    {% set slot_entries = entries.get((day.isoformat(), daypart.id), []) %}
                    {% if slot_entries %}
                        <div class="planner-entry-stack">
                            {% for entry in slot_entries %}
                                <article class="planner-entry">
                                    <strong>{{ entry.item_name }}</strong>
                                    <small>{{ item_kind_labels[entry.item_kind] }}</small>
                                    {% if entry.note %}
                                        <p>{{ entry.note }}</p>
                                    {% endif %}
                                    <form method="post" action="{{ url_for('main.planner_remove', entry_id=entry.id, week=week_start.isoformat()) }}">
                                        {{ csrf_input() }}
                                        <button class="ghost-button" type="submit">Entfernen</button>
                                    </form>
                                </article>
                            {% endfor %}
                        </div>
                    {% else %}
                        <p class="empty-slot">frei</p>
                    {% endif %}
                </div>
            {% endfor %}
        </div>
    {% endfor %}
</section>
{% endblock %}