{% extends "base.html" %}

{% block content %}
<h1>📥 Поступление товара на склад</h1>

<div style="max-width: 600px; margin: 0 auto;">
    <form method="POST" style="background: #FDF5E6; padding: 2rem; border-radius: 10px;" oninput="calculatePrice()">
        <div class="form-group">
            <label>Поставщик *</label>
            <select name="supplier_id" required style="width: 100%; padding: 0.5rem;">
                <option value="">Выберите поставщика</option>
                {% for supplier in suppliers %}
                <option value="{{ supplier.id }}">{{ supplier.name }}</option>
                {% endfor %}
            </select>
        </div>
        
        <div class="form-group">
            <label>Товар *</label>
            <select name="product_id" id="product_id" required style="width: 100%; padding: 0.5rem;" onchange="updateProductInfo()">
                <option value="">Выберите товар</option>
                {% for product in products %}
                <option value="{{ product.id }}" 
                        data-price="{{ product.purchase_price }}"
                        data-expiry="{{ product.expiry_date }}">
                    {{ product.name }} (закупка: {{ product.purchase_price }} ₽, срок: {{ product.expiry_date or 'не указан' }})
                </option>
                {% endfor %}
            </select>
        </div>
        
        <div class="form-group">
            <label>Количество *</label>
            <input type="number" name="quantity" id="quantity" min="1" value="1" required style="width: 100%; padding: 0.5rem;">
        </div>
        
        <div class="form-group">
            <label>Цена закупки (₽) *</label>
            <input type="number" name="purchase_price" id="purchase_price" step="0.01" required style="width: 100%; padding: 0.5rem;">
        </div>
        
        <div style="background: white; padding: 1rem; border-radius: 5px; margin: 1rem 0;">
            <p><strong>💰 Расчет стоимости:</strong></p>
            <p>Сумма: <span id="total">0</span> ₽</p>
            <p>Скидка по сроку годности: <span id="discount_percent">0</span>% (<span id="discount_amount">0</span> ₽)</p>
            <p style="font-size: 1.2rem;"><strong>Итого к оплате: <span id="final_total">0</span> ₽</strong></p>
        </div>
        
        <div style="background: #FFF3E0; padding: 0.5rem; border-radius: 5px; margin-bottom: 1rem;">
            <small>📅 <strong>Условия скидки по сроку годности:</strong></small>
            <ul style="margin: 0.5rem 0 0 1rem; font-size: 0.85rem;">
                <li>Менее 30 дней → 50% скидка</li>
                <li>30-90 дней → 30% скидка</li>
                <li>90-180 дней → 15% скидка</li>
                <li>Более 180 дней → 0% скидка</li>
                <li>Просрочен → 100% скидка (не принимается)</li>
            </ul>
        </div>
        
        <button type="submit" class="btn-submit">✅ Оприходовать на склад</button>
    </form>
</div>

<script>
function updateProductInfo() {
    let select = document.getElementById('product_id');
    let selectedOption = select.options[select.selectedIndex];
    let price = selectedOption.getAttribute('data-price') || 0;
    let expiry = selectedOption.getAttribute('data-expiry') || '';
    
    document.getElementById('purchase_price').value = price;
    calculatePrice();
}

function calculatePrice() {
    let quantity = parseInt(document.getElementById('quantity').value) || 0;
    let price = parseFloat(document.getElementById('purchase_price').value) || 0;
    let total = quantity * price;
    
    // Расчет скидки по сроку годности
    let select = document.getElementById('product_id');
    let selectedOption = select.options[select.selectedIndex];
    let expiry = selectedOption.getAttribute('data-expiry') || '';
    
    let discountPercent = 0;
    if (expiry) {
        let parts = expiry.split('.');
        if (parts.length === 3) {
            let expiryDate = new Date(parts[2], parts[1] - 1, parts[0]);
            let today = new Date();
            let daysUntil = Math.ceil((expiryDate - today) / (1000 * 60 * 60 * 24));
            
            if (daysUntil < 0) discountPercent = 100;
            else if (daysUntil < 30) discountPercent = 50;
            else if (daysUntil < 90) discountPercent = 30;
            else if (daysUntil < 180) discountPercent = 15;
        }
    }
    
    let discountAmount = total * discountPercent / 100;
    let finalTotal = total - discountAmount;
    
    document.getElementById('total').innerText = total.toFixed(2);
    document.getElementById('discount_percent').innerText = discountPercent;
    document.getElementById('discount_amount').innerText = discountAmount.toFixed(2);
    document.getElementById('final_total').innerText = finalTotal.toFixed(2);
}

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('product_id').addEventListener('change', updateProductInfo);
    document.getElementById('quantity').addEventListener('input', calculatePrice);
    updateProductInfo();
});
</script>

<style>
.form-group {
    margin-bottom: 1rem;
}
.form-group label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: bold;
    color: #CD853F;
}
.btn-submit {
    background: #CD853F;
    color: white;
    padding: 0.75rem;
    border: none;
    border-radius: 5px;
    width: 100%;
    cursor: pointer;
    font-size: 1rem;
}
.btn-submit:hover {
    background: #B87333;
}
</style>
{% endblock %}