{% extends 'base.html' %}

{% block title %}Преобразовать в постоянный комплект{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row mb-4">
        <div class="col">
            <h1>Преобразовать временный комплект в постоянный</h1>
            <p class="text-muted">
                Этот комплект был создан специально для заказа. Вы можете добавить его в каталог,
                отредактировав название, описание и добавив категории.
            </p>
        </div>
    </div>

    <div class="row">
        <div class="col-md-8">
            <!-- Форма редактирования -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Информация о комплекте</h5>
                </div>
                <div class="card-body">
                    <form method="post">
                        {% csrf_token %}

                        <div class="mb-3">
                            <label for="id_name" class="form-label">Название *</label>
                            {{ form.name }}
                            {% if form.name.errors %}
                                <div class="invalid-feedback d-block">
                                    {{ form.name.errors }}
                                </div>
                            {% endif %}
                        </div>

                        <div class="mb-3">
                            <label for="id_description" class="form-label">Описание</label>
                            {{ form.description }}
                            {% if form.description.errors %}
                                <div class="invalid-feedback d-block">
                                    {{ form.description.errors }}
                                </div>
                            {% endif %}
                        </div>

                        <div class="mb-3">
                            <label for="id_categories" class="form-label">Категории</label>
                            {{ form.categories }}
                            {% if form.categories.errors %}
                                <div class="invalid-feedback d-block">
                                    {{ form.categories.errors }}
                                </div>
                            {% endif %}
                            <small class="form-text text-muted">
                                Выберите категории, к которым относится этот комплект
                            </small>
                        </div>

                        <div class="mb-3">
                            <label for="id_tags" class="form-label">Теги</label>
                            {{ form.tags }}
                            {% if form.tags.errors %}
                                <div class="invalid-feedback d-block">
                                    {{ form.tags.errors }}
                                </div>
                            {% endif %}
                        </div>

                        <div class="mb-3">
                            <label for="id_sale_price" class="form-label">Цена со скидкой</label>
                            {{ form.sale_price }}
                            {% if form.sale_price.errors %}
                                <div class="invalid-feedback d-block">
                                    {{ form.sale_price.errors }}
                                </div>
                            {% endif %}
                            <small class="form-text text-muted">
                                Опционально. Если указано, комплект будет продаваться по этой цене.
                            </small>
                        </div>

                        <div class="d-grid gap-2 d-md-flex justify-content-md-between">
                            <a href="{% url 'orders:order-detail' kit.order.order_number %}" class="btn btn-secondary">
                                <i class="bi bi-arrow-left"></i> Отмена
                            </a>
                            <button type="submit" class="btn btn-success">
                                <i class="bi bi-check-circle"></i> Сделать постоянным
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <!-- Компоненты комплекта (только для просмотра) -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Состав комплекта</h5>
                </div>
                <div class="card-body">
                    <table class="table table-sm">
                        <thead>
                            <tr>
                                <th>Товар</th>
                                <th>Количество</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for kit_item in kit_items %}
                            <tr>
                                <td>
                                    {% if kit_item.variant_group %}
                                        <span class="text-muted">[Варианты]</span> {{ kit_item.variant_group.name }}
                                    {% elif kit_item.product %}
                                        {{ kit_item.product.name }}
                                    {% endif %}
                                </td>
                                <td>{{ kit_item.quantity }}</td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- Ценообразование -->
            <div class="card mb-3">
                <div class="card-header">
                    <h5 class="mb-0">Ценообразование</h5>
                </div>
                <div class="card-body">
                    <div class="row mb-2">
                        <div class="col-6"><strong>Базовая цена:</strong></div>
                        <div class="col-6 text-end">{{ kit.base_price }} руб.</div>
                    </div>
                    <div class="row mb-2">
                        <div class="col-6"><strong>Итоговая цена:</strong></div>
                        <div class="col-6 text-end"><strong>{{ kit.actual_price }} руб.</strong></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}
