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:
@@ -81,30 +81,31 @@ function formatMoney(v) {
|
|||||||
* Обновляет отображение выбранного клиента в UI
|
* Обновляет отображение выбранного клиента в UI
|
||||||
* Обновляет:
|
* Обновляет:
|
||||||
* - Кнопку "Выбрать клиента" в корзине (показывает имя клиента)
|
* - Кнопку "Выбрать клиента" в корзине (показывает имя клиента)
|
||||||
* - Имя клиента в модалке продажи
|
* - Кнопку "Выбрать клиента" в модалке продажи (показывает имя клиента)
|
||||||
* - Видимость кнопки сброса (показываем только для не-системного клиента)
|
* - Видимость кнопок сброса в обоих местах (показываем только для не-системного клиента)
|
||||||
*/
|
*/
|
||||||
function updateCustomerDisplay() {
|
function updateCustomerDisplay() {
|
||||||
// Обновляем текст кнопки - всегда показываем имя клиента
|
// Обновляем текст кнопки в корзине
|
||||||
const btnText = document.getElementById('customerSelectBtnText');
|
const btnText = document.getElementById('customerSelectBtnText');
|
||||||
btnText.textContent = selectedCustomer.name;
|
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 (resetBtn) {
|
if (checkoutBtnText) {
|
||||||
// Показываем кнопку сброса только если выбран НЕ системный клиент
|
checkoutBtnText.textContent = selectedCustomer.name;
|
||||||
if (selectedCustomer.id !== SYSTEM_CUSTOMER.id) {
|
}
|
||||||
resetBtn.style.display = 'block';
|
|
||||||
} else {
|
// Обновляем видимость кнопок сброса (в корзине и в модалке продажи)
|
||||||
resetBtn.style.display = 'none';
|
const isSystemCustomer = selectedCustomer.id === SYSTEM_CUSTOMER.id;
|
||||||
|
|
||||||
|
[document.getElementById('resetCustomerBtn'),
|
||||||
|
document.getElementById('checkoutResetCustomerBtn')].forEach(resetBtn => {
|
||||||
|
if (resetBtn) {
|
||||||
|
resetBtn.style.display = isSystemCustomer ? 'none' : 'block';
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -1436,11 +1437,22 @@ document.getElementById('customerSelectBtn').addEventListener('click', () => {
|
|||||||
modal.show();
|
modal.show();
|
||||||
});
|
});
|
||||||
|
|
||||||
// Кнопка сброса клиента на системного
|
// Кнопка сброса клиента на системного (в корзине)
|
||||||
document.getElementById('resetCustomerBtn').addEventListener('click', () => {
|
document.getElementById('resetCustomerBtn').addEventListener('click', () => {
|
||||||
selectCustomer(SYSTEM_CUSTOMER.id, SYSTEM_CUSTOMER.name);
|
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', () => {
|
document.getElementById('createNewCustomerBtn').addEventListener('click', () => {
|
||||||
// Закрываем модалку выбора
|
// Закрываем модалку выбора
|
||||||
|
|||||||
@@ -277,9 +277,18 @@
|
|||||||
<div class="col-md-7">
|
<div class="col-md-7">
|
||||||
<!-- Информация о клиенте -->
|
<!-- Информация о клиенте -->
|
||||||
<div class="mb-3">
|
<div class="mb-3">
|
||||||
<strong>Клиент</strong>
|
<label class="form-label fw-semibold">Клиент</label>
|
||||||
<div class="border rounded p-2 mt-2 bg-light">
|
<div class="d-flex gap-1 align-items-center">
|
||||||
<div class="fw-bold" id="checkoutCustomerName">—</div>
|
<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>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user