smaa/octopus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Сворачиваемые секции истории на странице клиента

Browse Source 
- История кошелька и история заказов теперь под collapse (свёрнуты по умолчанию)
- Кликабельные заголовки с иконкой chevron для раскрытия
- Badge с количеством элементов в заголовке
- Кнопка 'Новый заказ' доступна в свёрнутом состоянии (event.stopPropagation)
- Компактный и удобный интерфейс для работы с большими списками
This commit is contained in:
Andrey Smakotin
2025-11-29 18:53:14 +03:00
parent 915efa16dc
commit 22fad84545
1 changed files with 37 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
myproject/customers/templates/customers/customer_detail.html
View File

@@ -158,11 +158,22 @@
<!-- История транзакций кошелька --> <!-- История транзакций кошелька -->
<div class="col-md-12"> <div class="col-md-12">
<div class="card mb-4"> <div class="card mb-4">
<div class="card-header d-flex justify-content-between align-items-center"> <div class="card-header">
<h5>История кошелька (последние 20)</h5> <button class="btn btn-link w-100 text-start text-decoration-none p-0 d-flex justify-content-between align-items-center"
<span class="badge bg-primary">{{ wallet_transactions|length }}</span> type="button"
data-bs-toggle="collapse"
data-bs-target="#walletHistoryCollapse"
aria-expanded="false"
aria-controls="walletHistoryCollapse">
<h5 class="mb-0">История кошелька (последние 20)</h5>
<div>
<span class="badge bg-primary me-2">{{ wallet_transactions|length }}</span>
<i class="bi bi-chevron-down"></i>
</div>
</button>
</div> </div>
<div class="card-body"> <div class="collapse" id="walletHistoryCollapse">
<div class="card-body">
{% if wallet_transactions %} {% if wallet_transactions %}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-hover"> <table class="table table-striped table-hover">
@@ -215,6 +226,7 @@
{% else %} {% else %}
<p class="text-muted mb-0">История транзакций пуста.</p> <p class="text-muted mb-0">История транзакций пуста.</p>
{% endif %} {% endif %}
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -222,16 +234,27 @@
<!-- История заказов --> <!-- История заказов -->
<div class="col-md-12"> <div class="col-md-12">
<div class="card mb-4"> <div class="card mb-4">
<div class="card-header d-flex justify-content-between align-items-center"> <div class="card-header">
<h5>История заказов</h5> <button class="btn btn-link w-100 text-start text-decoration-none p-0 d-flex justify-content-between align-items-center"
<div> type="button"
<span class="badge bg-primary">{{ orders_page.paginator.count }}</span> data-bs-toggle="collapse"
<a href="{% url 'orders:order-create' %}?customer={{ customer.pk }}" class="btn btn-sm btn-success ms-2"> data-bs-target="#ordersHistoryCollapse"
<i class="bi bi-plus-circle"></i> Новый заказ aria-expanded="false"
</a> aria-controls="ordersHistoryCollapse">
</div> <h5 class="mb-0">История заказов</h5>
<div>
<span class="badge bg-primary me-2">{{ orders_page.paginator.count }}</span>
<a href="{% url 'orders:order-create' %}?customer={{ customer.pk }}"
class="btn btn-sm btn-success me-2"
onclick="event.stopPropagation();">
<i class="bi bi-plus-circle"></i> Новый заказ
</a>
<i class="bi bi-chevron-down"></i>
</div>
</button>
</div> </div>
<div class="card-body"> <div class="collapse" id="ordersHistoryCollapse">
<div class="card-body">
{% if orders_page %} {% if orders_page %}
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-hover"> <table class="table table-striped table-hover">
@@ -356,6 +379,7 @@
{% else %} {% else %}
<p class="text-muted mb-0">У клиента пока нет заказов.</p> <p class="text-muted mb-0">У клиента пока нет заказов.</p>
{% endif %} {% endif %}
</div>
</div> </div>
</div> </div>
</div> </div>