project/templates/incoming.html

141 lines
5.7 KiB
HTML

{% 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 %}