diff --git a/myproject/pos/static/pos/css/terminal.css b/myproject/pos/static/pos/css/terminal.css
index 6c69e67..5b72e1a 100644
--- a/myproject/pos/static/pos/css/terminal.css
+++ b/myproject/pos/static/pos/css/terminal.css
@@ -32,6 +32,56 @@ body {
flex-grow: 1;
}
+/* Стили для корзины */
+.cart-item {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ padding: 0.5rem 0;
+ border-bottom: 1px solid #e9ecef;
+}
+
+.item-name-price {
+ flex: 1;
+ min-width: 0;
+}
+
+.multiply-sign {
+ font-weight: bold;
+ color: #6c757d;
+ font-size: 0.9rem;
+ flex-shrink: 0;
+}
+
+.qty-input {
+ width: 50px;
+ padding: 0.25rem 0.5rem;
+ border: 1px solid #dee2e6;
+ border-radius: 4px;
+ text-align: center;
+ font-size: 0.9rem;
+ flex-shrink: 0;
+}
+
+.qty-input::-webkit-outer-spin-button,
+.qty-input::-webkit-inner-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+}
+
+.qty-input[type=number] {
+ -moz-appearance: textfield;
+}
+
+.item-total {
+ font-weight: 600;
+ font-size: 0.95rem;
+ color: #212529;
+ min-width: 60px;
+ text-align: right;
+ flex-shrink: 0;
+}
+
.product-card {
cursor: pointer;
user-select: none;
diff --git a/myproject/pos/static/pos/js/terminal.js b/myproject/pos/static/pos/js/terminal.js
index c85733c..072bf09 100644
--- a/myproject/pos/static/pos/js/terminal.js
+++ b/myproject/pos/static/pos/js/terminal.js
@@ -175,50 +175,54 @@ function renderCart() {
cart.forEach(item => {
const row = document.createElement('div');
- row.className = 'mb-2 pb-2 border-bottom';
+ row.className = 'cart-item mb-2';
- const nameRow = document.createElement('div');
- nameRow.className = 'd-flex justify-content-between align-items-start mb-1';
- nameRow.innerHTML = `
+ // Левая часть: Название и цена единицы
+ const namePrice = document.createElement('div');
+ namePrice.className = 'item-name-price';
+ namePrice.innerHTML = `
${item.name}
-
+ ${formatMoney(item.price)} / шт
`;
- const controlsRow = document.createElement('div');
- controlsRow.className = 'd-flex justify-content-between align-items-center';
+ // Знак умножения
+ const multiplySign = document.createElement('span');
+ multiplySign.className = 'multiply-sign';
+ multiplySign.textContent = 'x';
- const controls = document.createElement('div');
- controls.className = 'btn-group btn-group-sm';
+ // Поле ввода количества
+ const qtyInput = document.createElement('input');
+ qtyInput.type = 'number';
+ qtyInput.className = 'qty-input';
+ qtyInput.value = item.qty;
+ qtyInput.min = 1;
+ qtyInput.onchange = (e) => {
+ const newQty = parseInt(e.target.value) || 1;
+ if (newQty <= 0) {
+ removeFromCart(item.id);
+ } else {
+ cart.get(item.id).qty = newQty;
+ renderCart();
+ }
+ };
- const minus = document.createElement('button');
- minus.className = 'btn btn-outline-secondary';
- minus.innerHTML = '';
- minus.onclick = (e) => { e.stopPropagation(); updateQty(item.id, -1); };
+ // Сумма за позицию
+ const itemTotal = document.createElement('div');
+ itemTotal.className = 'item-total';
+ itemTotal.textContent = formatMoney(item.price * item.qty);
- const qtySpan = document.createElement('button');
- qtySpan.className = 'btn btn-outline-secondary disabled';
- qtySpan.textContent = item.qty;
+ // Кнопка удаления
+ const deleteBtn = document.createElement('button');
+ deleteBtn.className = 'btn btn-sm btn-link text-danger p-0';
+ deleteBtn.innerHTML = '';
+ deleteBtn.onclick = () => removeFromCart(item.id);
- const plus = document.createElement('button');
- plus.className = 'btn btn-outline-secondary';
- plus.innerHTML = '';
- plus.onclick = (e) => { e.stopPropagation(); updateQty(item.id, +1); };
+ row.appendChild(namePrice);
+ row.appendChild(multiplySign);
+ row.appendChild(qtyInput);
+ row.appendChild(itemTotal);
+ row.appendChild(deleteBtn);
- controls.appendChild(minus);
- controls.appendChild(qtySpan);
- controls.appendChild(plus);
-
- const priceDiv = document.createElement('div');
- priceDiv.className = 'text-end small';
- priceDiv.innerHTML = `${formatMoney(item.price * item.qty)}`;
-
- controlsRow.appendChild(controls);
- controlsRow.appendChild(priceDiv);
-
- row.appendChild(nameRow);
- row.appendChild(controlsRow);
list.appendChild(row);
total += item.qty * item.price;