{% extends "base.html" %}
{% block title %}{% if action=='add' %}Новая приходная{% else %}Редактировать{% endif %} — Стройка{% endblock %}
{% block page_title %}{% if action=='add' %}Новая приходная накладная{% else %}Редактировать приходную #{{ order.id }}{% endif %}{% endblock %}
{% block topbar_actions %}<a href="{{ url_for('income_list') }}" class="btn btn-secondary">← Назад</a>{% endblock %}
{% block content %}
<div class="form-card">
<form method="post">
    <div class="form-grid">
        <div class="form-group">
            <label class="form-label">Номер накладной <span class="required">*</span></label>
            <input type="text" name="number" class="form-input" required value="{{ order.number if order else '' }}" placeholder="ПН-001">
        </div>
        <div class="form-group">
            <label class="form-label">Дата <span class="required">*</span></label>
            <input type="date" name="order_date" class="form-input" required value="{{ today }}">
        </div>
        <div class="form-group">
            <label class="form-label">Поставщик <span class="required">*</span></label>
            <select name="supplier_id" class="form-input" required id="supplier_sel">
                <option value="">— выбрать —</option>
                {% for s in suppliers %}<option value="{{ s.id }}" data-dist="{{ s.distance }}" data-rate="{{ s.transport_rate }}" {% if order and order.supplier_id==s.id %}selected{% endif %}>{{ s.name }}</option>{% endfor %}
            </select>
        </div>
        <div class="form-group">
            <label class="form-label">Материал <span class="required">*</span></label>
            <select name="material_id" class="form-input" required id="material_sel">
                <option value="">— выбрать —</option>
                {% for m in materials %}<option value="{{ m.id }}" data-price="{{ m.price }}" data-weight="{{ m.weight }}" data-unit="{{ m.unit }}" {% if order and order.material_id==m.id %}selected{% endif %}>{{ m.name }}</option>{% endfor %}
            </select>
        </div>
        <div class="form-group">
            <label class="form-label">Количество <span class="required">*</span></label>
            <input type="number" name="quantity" class="form-input" required step="0.01" min="0.01" id="qty_in" value="{{ order.quantity if order else 1 }}">
        </div>
    </div>
    <div class="calc-preview">
        <div class="calc-title">📊 Расчёт стоимости (приходная)</div>
        <div class="calc-row"><span>Стоимость товара:</span><strong id="r_goods">0.00 ₽</strong></div>
        <div class="calc-row"><span>Транспортные расходы:</span><strong id="r_transport">0.00 ₽</strong></div>
        <div class="calc-row total-row"><span>ИТОГО:</span><strong id="r_total">0.00 ₽</strong></div>
    </div>
    <div class="form-actions">
        <button type="submit" class="btn btn-primary">💾 Сохранить</button>
        <a href="{{ url_for('income_list') }}" class="btn btn-secondary">Отмена</a>
    </div>
</form>
</div>
<script>
function calc(){
    var mopt = document.getElementById('material_sel').options[document.getElementById('material_sel').selectedIndex];
    var sopt = document.getElementById('supplier_sel').options[document.getElementById('supplier_sel').selectedIndex];
    var price  = parseFloat(mopt.dataset.price)  || 0;
    var weight = parseFloat(mopt.dataset.weight) || 0;
    var dist   = parseFloat(sopt.dataset.dist)   || 0;
    var rate   = parseFloat(sopt.dataset.rate)   || 0;
    var qty    = parseFloat(document.getElementById('qty_in').value) || 0;
    var goods  = price * qty;
    var transp = weight * qty * rate * dist;
    var total  = Math.max(goods + transp, 0);
    document.getElementById('r_goods').textContent     = goods.toFixed(2)  + ' ₽';
    document.getElementById('r_transport').textContent = transp.toFixed(2) + ' ₽';
    document.getElementById('r_total').textContent     = total.toFixed(2)  + ' ₽';
}
document.getElementById('material_sel').addEventListener('change', calc);
document.getElementById('supplier_sel').addEventListener('change', calc);
document.getElementById('qty_in').addEventListener('input', calc);
calc();
</script>
{% endblock %}