{% extends 'base.html' %}

{% block content %}
<div class="card shadow border-secondary mb-3">
    <div class="card-header border-secondary py-3 d-flex justify-content-between align-items-center">
        <div>
            <h3 class="text-accent mb-1"><i class="bi bi-journal-text me-2"></i>Журнал отгрузки</h3>
            <div class="small text-muted">Склад отгрузки: {{ shipping_location.name }}</div>
        </div>
        <a class="btn btn-outline-secondary btn-sm" href="{% url 'shipping' %}">
            <i class="bi bi-arrow-left me-1"></i>Назад
        </a>
    </div>

    <div class="card-body">
        <form method="get" class="row g-2 align-items-end mb-3">
            <input type="hidden" name="filtered" value="1">

            <div class="col-md-5">
                <label class="small text-muted mb-1 fw-bold">Поиск (сделка):</label>
                <input
                    type="text"
                    name="q"
                    value="{{ q }}"
                    class="form-control form-control-sm bg-body text-body border-secondary"
                    placeholder="№ сделки, описание, заказчик"
                    onchange="this.form.submit()"
                >
            </div>

            <div class="col-md-auto ms-md-auto">
                <label class="small text-muted mb-1 fw-bold">Период (с):</label>
                <input type="date" name="start_date" class="form-control form-control-sm bg-body text-body border-secondary" value="{{ start_date }}" onchange="this.form.submit()">
            </div>
            <div class="col-md-auto">
                <label class="small text-muted mb-1 fw-bold">Период (по):</label>
                <input type="date" name="end_date" class="form-control form-control-sm bg-body text-body border-secondary" value="{{ end_date }}" onchange="this.form.submit()">
            </div>

            <div class="col-md-auto">
                <a href="{% url 'shipping_journal' %}?reset=1" class="btn btn-outline-secondary btn-sm">
                    <i class="bi bi-arrow-counterclockwise me-1"></i>Сброс
                </a>
            </div>
        </form>

        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0" data-sortable="1">
                <thead>
                    <tr class="table-custom-header">
                        <th style="width:170px;">Дата</th>
                        <th style="width:120px;">Документ</th>
                        <th>Сделки</th>
                        <th>Откуда</th>
                        <th style="width:160px;">Кто</th>
                        <th data-sort="false" class="text-end" style="width:140px;"></th>
                    </tr>
                </thead>
                <tbody>
                    {% for r in rows %}
                    <tr>
                        <td class="small">{{ r.transfer.occurred_at|date:"d.m.Y H:i" }}</td>
                        <td class="fw-bold">№{{ r.transfer.id }}</td>
                        <td class="small">
                            {% if r.deals %}
                                {% for d in r.deals %}
                                    <div>
                                        <span class="fw-bold">№{{ d.number }}</span>
                                        {% if d.description %} — {{ d.description }}{% endif %}
                                    </div>
                                {% endfor %}
                            {% else %}
                                <span class="text-muted">—</span>
                            {% endif %}
                        </td>
                        <td class="small">{{ r.transfer.from_location.name }}</td>
                        <td class="small">{{ r.transfer.sender.username|default:"—" }}</td>
                        <td class="text-end">
                            <a class="btn btn-outline-secondary btn-sm" href="{{ r.admin_url }}" target="_blank">Открыть</a>
                        </td>
                    </tr>
                    {% empty %}
                    <tr><td colspan="6" class="text-center text-muted py-4">Пока нет отгрузок</td></tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}