{% extends "base.html" %}
{% block content %}
<h1>Оформление возврата</h1>

<!-- Блок подсказки о сезонном коэффициенте (по ТЗ) -->
<div class="card" style="background-color: #e6ffe6; margin-bottom: 1rem;">
    <p>
        <strong>Сейчас {{ current_season }}:</strong>
        {% if current_season == 'зима' %}
            Зимние товары — наценка 20%, летние — скидка 20%.
        {% elif current_season == 'лето' %}
            Летние товары — наценка 20%, зимние — скидка 20%.
        {% else %}
            Межсезонье — коэффициент 1.0 для всех товаров.
        {% endif %}
    </p>
</div>

<!-- Выбор выдачи -->
<div class="card">
    {% if issues %}
    <form id="selectIssueForm">
        <div class="form-group">
            <label for="issue_id">Выберите выдачу:</label>
            <select id="issue_id" name="issue_id" required>
                <option value="">-- Выберите --</option>
                {% for issue in issues %}
                <option value="{{ issue.id }}">{{ issue.issue_date.strftime('%d.%m.%Y') }} - {{ issue.partner.name }}</option>
                {% endfor %}
            </select>
        </div>
    </form>
    {% else %}
    <p>Нет открытых выдач для оформления возврата.</p>
    <a href="{{ url_for('main.issues') }}" class="btn">Перейти к выдачам</a>
    {% endif %}
</div>

<!-- Контейнер для позиций выбранной выдачи -->
<div id="itemsContainer" style="display:none;">
    <h2>Позиции возврата</h2>
    <div id="loading" style="display:none;">Загрузка...</div>
    <form id="returnForm" method="POST" action="{{ url_for('main.return_new') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <input type="hidden" name="issue_id" id="hidden_issue_id">
        <div id="itemsList"></div>
        <div class="form-group">
            <label for="notes">Примечания</label>
            <textarea name="notes" id="notes" rows="3"></textarea>
        </div>
        <p><strong>Общая сумма: <span id="totalAmount">0.00</span> ₽</strong></p>
        <button type="submit" class="btn">Оформить возврат</button>
    </form>
</div>

<script>
document.getElementById('issue_id')?.addEventListener('change', function() {
    var issueId = this.value;
    if (!issueId) {
        document.getElementById('itemsContainer').style.display = 'none';
        return;
    }
    document.getElementById('hidden_issue_id').value = issueId;
    document.getElementById('loading').style.display = 'block';
    document.getElementById('itemsContainer').style.display = 'block';
    fetch('/returns/get_issue_items/' + issueId)
        .then(response => response.json())
        .then(items => {
            document.getElementById('loading').style.display = 'none';
            var html = '';
            items.forEach(item => {
                html += `
                    <div class="card" data-item-id="${item.id}">
                        <h3>${item.inventory_name}</h3>
                        <p>Количество: ${item.quantity}</p>
                        <p>Базовая стоимость: ${item.base_price} ₽</p>
                        <input type="hidden" name="item_id[]" value="${item.id}">
                        <div class="form-group">
                            <label>Степень износа:</label>
                            <div class="radio-group">
                                <label><input type="radio" name="wear_${item.id}" value="low" checked> Малый</label>
                                <label><input type="radio" name="wear_${item.id}" value="medium"> Средний</label>
                                <label><input type="radio" name="wear_${item.id}" value="high"> Большой</label>
                            </div>
                        </div>
                        <p>Стоимость позиции: <span class="item-price" id="price_${item.id}">0.00</span> ₽</p>
                    </div>
                `;
            });
            document.getElementById('itemsList').innerHTML = html;
            attachWearListeners(items);
        });
});

function attachWearListeners(items) {
    items.forEach(item => {
        var radios = document.getElementsByName('wear_' + item.id);
        radios.forEach(radio => {
            radio.addEventListener('change', function() {
                updateItemPrice(item);
            });
        });
        updateItemPrice(item);
    });
}

function updateItemPrice(item) {
    var selectedWear = document.querySelector('input[name="wear_' + item.id + '"]:checked').value;
    fetch('/returns/calculate_preview', {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({
            base_price: item.base_price,
            quantity: item.quantity,
            wear_level: selectedWear,
            season_type: item.season_type
        })
    })
    .then(response => response.json())
    .then(data => {
        document.getElementById('price_' + item.id).innerText = data.calculated_price.toFixed(2);
        updateTotal();
    });
}

function updateTotal() {
    var total = 0;
    document.querySelectorAll('.item-price').forEach(span => {
        total += parseFloat(span.innerText) || 0;
    });
    document.getElementById('totalAmount').innerText = total.toFixed(2);
}
</script>
{% endblock %}