Add interactive customer selection to checkout modal

Replaced static customer display in the checkout/sale modal with the same interactive button functionality from the cart sidebar.

Changes:
- **HTML**: Replaced static div with interactive button + reset button in checkout modal
- **JavaScript**:
  - Updated updateCustomerDisplay() to handle both locations (cart + checkout modal)
  - Added event listeners for checkout modal customer buttons
  - Both buttons now synchronized and use the same selection modal

Benefits:
 Consistent UX across cart and checkout modal
 Full code reuse - same selection modal, search, and logic
 Both locations stay synchronized automatically
 Can search, select, and reset customer directly from checkout modal

Implementation:
- Cart sidebar button: customerSelectBtn, resetCustomerBtn
- Checkout modal button: checkoutCustomerSelectBtn, checkoutResetCustomerBtn
- Single updateCustomerDisplay() updates both locations
- Single selectCustomer() used by all buttons

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-11-20 10:31:42 +03:00
parent 763ad2ce07
commit 07c8819936
2 changed files with 43 additions and 22 deletions

View File

@@ -81,30 +81,31 @@ function formatMoney(v) {
* Обновляет отображение выбранного клиента в UI
* Обновляет:
* - Кнопку "Выбрать клиента" в корзине (показывает имя клиента)
* - Имя клиента в модалке продажи
* - Видимость кнопки сброса (показываем только для не-системного клиента)
* - Кнопку "Выбрать клиента" в модалке продажи (показывает имя клиента)
* - Видимость кнопок сброса в обоих местах (показываем только для не-системного клиента)
*/
function updateCustomerDisplay() {
// Обновляем текст кнопки - всегда показываем имя клиента
// Обновляем текст кнопки в корзине
const btnText = document.getElementById('customerSelectBtnText');
if (btnText) {
btnText.textContent = selectedCustomer.name;
// Обновляем имя клиента в модалке продажи
const checkoutCustomerName = document.getElementById('checkoutCustomerName');
if (checkoutCustomerName) {
checkoutCustomerName.textContent = selectedCustomer.name;
}
// Показываем/скрываем кнопку сброса
const resetBtn = document.getElementById('resetCustomerBtn');
// Обновляем текст кнопки в модалке продажи
const checkoutBtnText = document.getElementById('checkoutCustomerSelectBtnText');
if (checkoutBtnText) {
checkoutBtnText.textContent = selectedCustomer.name;
}
// Обновляем видимость кнопок сброса (в корзине и в модалке продажи)
const isSystemCustomer = selectedCustomer.id === SYSTEM_CUSTOMER.id;
[document.getElementById('resetCustomerBtn'),
document.getElementById('checkoutResetCustomerBtn')].forEach(resetBtn => {
if (resetBtn) {
// Показываем кнопку сброса только если выбран НЕ системный клиент
if (selectedCustomer.id !== SYSTEM_CUSTOMER.id) {
resetBtn.style.display = 'block';
} else {
resetBtn.style.display = 'none';
}
resetBtn.style.display = isSystemCustomer ? 'none' : 'block';
}
});
}
/**
@@ -1436,11 +1437,22 @@ document.getElementById('customerSelectBtn').addEventListener('click', () => {
modal.show();
});
// Кнопка сброса клиента на системного
// Кнопка сброса клиента на системного (в корзине)
document.getElementById('resetCustomerBtn').addEventListener('click', () => {
selectCustomer(SYSTEM_CUSTOMER.id, SYSTEM_CUSTOMER.name);
});
// Кнопка "Выбрать клиента" в модалке продажи
document.getElementById('checkoutCustomerSelectBtn').addEventListener('click', () => {
const modal = new bootstrap.Modal(document.getElementById('selectCustomerModal'));
modal.show();
});
// Кнопка сброса клиента на системного (в модалке продажи)
document.getElementById('checkoutResetCustomerBtn').addEventListener('click', () => {
selectCustomer(SYSTEM_CUSTOMER.id, SYSTEM_CUSTOMER.name);
});
// Кнопка "Создать нового клиента" в модалке выбора
document.getElementById('createNewCustomerBtn').addEventListener('click', () => {
// Закрываем модалку выбора

View File

@@ -277,9 +277,18 @@
<div class="col-md-7">
<!-- Информация о клиенте -->
<div class="mb-3">
<strong>Клиент</strong>
<div class="border rounded p-2 mt-2 bg-light">
<div class="fw-bold" id="checkoutCustomerName"></div>
<label class="form-label fw-semibold">Клиент</label>
<div class="d-flex gap-1 align-items-center">
<button class="btn btn-outline-primary btn-sm d-flex align-items-center" id="checkoutCustomerSelectBtn">
<i class="bi bi-person me-1"></i>
<div class="d-flex flex-column align-items-start lh-1">
<small class="text-muted" style="font-size: 0.65rem;">Клиент</small>
<span id="checkoutCustomerSelectBtnText" class="fw-semibold">Выбрать</span>
</div>
</button>
<button class="btn btn-sm btn-outline-danger" id="checkoutResetCustomerBtn" title="Сброс на системного клиента" style="display: none;">
<i class="bi bi-x-lg"></i>
</button>
</div>
</div>