{% extends "base.html" %}

{% block title %}{{ title }} — ЧитайГород{% endblock %}

{% block extra_head %}
<script src="/static/products.js" defer></script>
{% endblock %}

{% block content %}
<div class="toolbar">
    {% if can_manage_products %}
        <a href="{% url 'product_add' %}" class="btn btn-accent">Добавить товар</a>
    {% endif %}
    {% if can_view_orders %}
        <a href="{% url 'order_list' %}" class="btn btn-secondary">Заказы</a>
    {% endif %}
    <a href="{% url 'login' %}" class="btn btn-secondary">Назад</a>
</div>

{% if can_filter %}
<form id="product-filter-form" class="filter-panel" method="get" action="{% url 'product_list' %}">
    <div class="field">
        <label for="id_search">Поиск</label>
        <input type="search" name="search" id="id_search" value="{{ request.GET.search }}">
    </div>
    <div class="field">
        <label for="id_sort">Сортировка</label>
        <select name="sort" id="id_sort">
            <option value="">Без сортировки</option>
            <option value="price_asc" {% if request.GET.sort == 'price_asc' %}selected{% endif %}>Цена по возрастанию</option>
            <option value="price_desc" {% if request.GET.sort == 'price_desc' %}selected{% endif %}>Цена по убыванию</option>
            <option value="quantity_asc" {% if request.GET.sort == 'quantity_asc' %}selected{% endif %}>Количество по возрастанию</option>
            <option value="quantity_desc" {% if request.GET.sort == 'quantity_desc' %}selected{% endif %}>Количество по убыванию</option>
        </select>
    </div>
    <div class="field">
        <label for="id_discount_range">Диапазон скидки</label>
        <select name="discount_range" id="id_discount_range">
            <option value="">Все диапазоны</option>
            <option value="0-12.99" {% if request.GET.discount_range == '0-12.99' %}selected{% endif %}>0–12,99%</option>
            <option value="13-16.99" {% if request.GET.discount_range == '13-16.99' %}selected{% endif %}>13–16,99%</option>
            <option value="17+" {% if request.GET.discount_range == '17+' %}selected{% endif %}>17% и более</option>
        </select>
    </div>
</form>
{% endif %}

<div class="table-wrap">
    <table class="product-table">
        <thead>
            <tr>
                <th>Фото</th>
                <th>Наименование</th>
                <th>Категория</th>
                <th>Описание</th>
                <th>Производитель</th>
                <th>Поставщик</th>
                <th>Цена</th>
                <th>Ед. изм.</th>
                <th>На складе</th>
                <th>Скидка</th>
                {% if can_manage_products %}<th></th>{% endif %}
            </tr>
        </thead>
        <tbody id="product-table-body">
            {% include "shop/_product_rows.html" %}
        </tbody>
    </table>
</div>
{% endblock %}