316 lines
13 KiB
HTML
316 lines
13 KiB
HTML
{% extends "base.html" %}
|
||
|
||
{% block title %}Список заказов{% endblock %}
|
||
|
||
{% block content %}
|
||
<!-- Заголовок -->
|
||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||
<h2 class="page-title">Список заказов</h2>
|
||
</div>
|
||
|
||
<!-- Статистика -->
|
||
<div class="row mb-4">
|
||
<div class="col-md-4">
|
||
<div class="card text-white bg-primary mb-3">
|
||
<div class="card-body">
|
||
<h5 class="card-title">Всего заказов</h5>
|
||
<p class="card-text display-6">{{ total_stats.total_orders or 0 }}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card text-white bg-success mb-3">
|
||
<div class="card-body">
|
||
<h5 class="card-title">Всего единиц</h5>
|
||
<p class="card-text display-6">{{ "{:,}".format(total_stats.total_quantity or 0) }}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<!-- ИСПРАВЛЕНО: цвет #4682B4 (Стальной синий) и белый текст -->
|
||
<div class="card text-white mb-3" style="background-color: #4682B4;">
|
||
<div class="card-body">
|
||
<h5 class="card-title">Общая сумма</h5>
|
||
<p class="card-text display-6">{{ "{:,.2f}".format(total_stats.total_amount or 0) }} руб.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Таблица заказов -->
|
||
{% if orders %}
|
||
<div class="table-responsive">
|
||
<table class="table table-striped table-hover">
|
||
<thead class="table-dark">
|
||
<tr>
|
||
<th>ID</th>
|
||
<th>Дата</th>
|
||
<th>Клиент</th>
|
||
<th>ИНН</th>
|
||
<th>Состав заказа</th>
|
||
<th>Всего единиц</th>
|
||
<th>Наценка (25%)</th>
|
||
<th>Итого</th>
|
||
<th>Статус</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for order in orders %}
|
||
{% set markup = order.assembly_cost + order.delivery_cost %}
|
||
<tr>
|
||
<td>{{ order.id }}</td>
|
||
<td>{{ order.order_date[:10] if order.order_date else '-' }}</td>
|
||
<td>
|
||
{% if order.client_id %}
|
||
<a href="{{ url_for('order_history', client_id=order.client_id) }}">
|
||
{{ order.client_name or 'Неизвестный клиент' }}
|
||
</a>
|
||
{% else %}
|
||
{{ order.client_name or 'Общий заказ' }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ order.client_inn or '-' }}</td>
|
||
<td>
|
||
{% if order['items'] and order['items']|length > 0 %}
|
||
<button class="btn btn-sm btn-info" type="button"
|
||
data-bs-toggle="collapse"
|
||
data-bs-target="#items-{{ order.id }}"
|
||
aria-expanded="false">
|
||
<i class="fas fa-eye"></i> {{ order['items']|length }} товаров
|
||
</button>
|
||
<div class="collapse mt-2" id="items-{{ order.id }}">
|
||
<div class="card card-body p-2">
|
||
<table class="table table-sm table-bordered mb-0">
|
||
<thead>
|
||
<tr>
|
||
<th>Товар</th>
|
||
<th>Артикул</th>
|
||
<th>Кол-во</th>
|
||
<th>Цена за ед.</th>
|
||
<th>Сумма</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for item in order['items'] %}
|
||
{% set item_sum = item.price_at_moment * item.quantity %}
|
||
<tr>
|
||
<td>{{ item.product_name }}</td>
|
||
<td>{{ item.article }}</td>
|
||
<td>{{ "{:,}".format(item.quantity) }} ед.</td>
|
||
<td>{{ "{:,.2f}".format(item.price_at_moment) }} руб.</td>
|
||
<td>{{ "{:,.2f}".format(item_sum) }} руб.</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
<tfoot class="table-info">
|
||
<tr>
|
||
<td colspan="4" class="text-end"><strong>Базовая сумма:</strong></td>
|
||
<td><strong>{{ "{:,.2f}".format(order.base_amount) }} руб.</strong></td>
|
||
</tr>
|
||
<tr>
|
||
<td colspan="4" class="text-end">Сборка ({{ order.assembly_percent }}%):</td>
|
||
<td>+{{ "{:,.2f}".format(order.assembly_cost) }} руб.</td>
|
||
</tr>
|
||
<tr>
|
||
<td colspan="4" class="text-end">Доставка ({{ order.delivery_percent }}%):</td>
|
||
<td>+{{ "{:,.2f}".format(order.delivery_cost) }} руб.</td>
|
||
</tr>
|
||
<tr class="table-success">
|
||
<td colspan="4" class="text-end"><strong>ИТОГО:</strong></td>
|
||
<td><strong>{{ "{:,.2f}".format(order.total_amount) }} руб.</strong></td>
|
||
</tr>
|
||
</tfoot>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
{% else %}
|
||
<span class="text-muted">Нет товаров</span>
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ "{:,}".format(order.total_items or 0) }} ед.</td>
|
||
<td class="text-info"><strong>+{{ "{:,.2f}".format(markup) }}</strong> руб.</td>
|
||
<td><strong>{{ "{:,.2f}".format(order.total_amount) }}</strong> руб.</td>
|
||
<td>
|
||
<span class="badge {% if order.status == 'Выполнен' %}bg-success{% elif order.status == 'Отменен' %}bg-danger{% elif order.status == 'В обработке' %}bg-warning{% else %}bg-secondary{% endif %}">
|
||
{{ order.status }}
|
||
</span>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
{% else %}
|
||
<div class="alert alert-info">
|
||
<i class="fas fa-info-circle"></i>
|
||
Нет данных о заказах. <a href="{{ url_for('index') }}" class="alert-link">Вернуться на главную</a>.
|
||
</div>
|
||
{% endif %}
|
||
|
||
<style>
|
||
.page-title {
|
||
color: var(--steel-blue);
|
||
font-size: 1.8rem;
|
||
font-weight: 600;
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
}
|
||
|
||
.table {
|
||
background-color: white;
|
||
border-radius: 10px;
|
||
overflow: hidden;
|
||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
||
}
|
||
|
||
.table thead th {
|
||
background-color: var(--steel-blue);
|
||
color: white;
|
||
font-weight: 600;
|
||
border: none;
|
||
padding: 12px;
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
vertical-align: middle;
|
||
}
|
||
|
||
.table tbody tr:hover {
|
||
background-color: rgba(176, 196, 222, 0.2);
|
||
}
|
||
|
||
.table tbody td {
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
color: #2c3e50;
|
||
vertical-align: middle;
|
||
padding: 12px;
|
||
}
|
||
|
||
.table a {
|
||
color: var(--steel-blue);
|
||
text-decoration: none;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.table a:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
.btn-info {
|
||
background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
|
||
color: white;
|
||
border: none;
|
||
font-size: 0.85rem;
|
||
padding: 4px 8px;
|
||
transition: all 0.2s ease;
|
||
}
|
||
|
||
.btn-info:hover {
|
||
background: linear-gradient(135deg, #138496 0%, #17a2b8 100%);
|
||
transform: translateY(-1px);
|
||
box-shadow: 0 4px 8px rgba(23, 162, 184, 0.3);
|
||
}
|
||
|
||
.badge {
|
||
padding: 6px 10px;
|
||
font-size: 0.8rem;
|
||
border-radius: 20px;
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.badge.bg-success {
|
||
background: linear-gradient(135deg, #28a745 0%, #218838 100%) !important;
|
||
color: white !important;
|
||
}
|
||
|
||
.badge.bg-warning {
|
||
background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%) !important;
|
||
color: #2c3e50 !important;
|
||
}
|
||
|
||
.badge.bg-danger {
|
||
background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
|
||
color: white !important;
|
||
}
|
||
|
||
.badge.bg-secondary {
|
||
background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%) !important;
|
||
color: white !important;
|
||
}
|
||
|
||
.card {
|
||
border: 1px solid var(--light-steel-blue);
|
||
border-radius: 12px;
|
||
}
|
||
|
||
/* ИСПРАВЛЕНО: явно задаем цвет для карточки Общая сумма */
|
||
.bg-primary {
|
||
background-color: var(--steel-blue) !important;
|
||
}
|
||
|
||
.bg-success {
|
||
background: linear-gradient(135deg, #3a6d99 0%, var(--steel-blue) 100%);
|
||
}
|
||
|
||
.display-6 {
|
||
font-size: 2rem;
|
||
font-weight: 300;
|
||
line-height: 1.2;
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
}
|
||
|
||
.alert {
|
||
border-radius: 12px;
|
||
border: 1px solid var(--light-steel-blue);
|
||
background: linear-gradient(135deg, var(--alice-blue) 0%, #E6F2FF 100%);
|
||
border-left: 6px solid var(--steel-blue);
|
||
font-family: 'Franklin Gothic', 'Arial Narrow', Arial, sans-serif;
|
||
}
|
||
|
||
.alert-link {
|
||
color: var(--steel-blue);
|
||
font-weight: 600;
|
||
}
|
||
|
||
.collapse .card {
|
||
border: 1px solid var(--light-steel-blue);
|
||
background-color: #f8f9fa;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
.table-sm {
|
||
font-size: 0.85rem;
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.table-sm th {
|
||
background-color: var(--light-steel-blue);
|
||
color: #2c3e50;
|
||
font-weight: 600;
|
||
padding: 6px;
|
||
}
|
||
|
||
.table-sm td {
|
||
padding: 6px;
|
||
}
|
||
|
||
.table-info {
|
||
background-color: #d1ecf1 !important;
|
||
}
|
||
|
||
.table-success {
|
||
background-color: #d4edda !important;
|
||
}
|
||
|
||
.text-end {
|
||
text-align: right;
|
||
}
|
||
|
||
.text-info {
|
||
color: #17a2b8 !important;
|
||
}
|
||
|
||
/* Убираем лишний класс bg-warning */
|
||
.bg-warning {
|
||
background-color: transparent !important;
|
||
}
|
||
</style>
|
||
{% endblock %} |