133 lines
5.1 KiB
JavaScript
133 lines
5.1 KiB
JavaScript
// controller.js
|
||
export class Controller {
|
||
constructor(model, view) {
|
||
this.model = model;
|
||
this.view = view;
|
||
this.init();
|
||
}
|
||
|
||
async init() {
|
||
// Для страницы корзины
|
||
if (window.location.pathname.includes('basket.html')) {
|
||
await this.loadBasket();
|
||
this.setupBasketEventListeners();
|
||
}
|
||
|
||
// Для страницы каталога
|
||
if (window.location.pathname.includes('catalog.html')) {
|
||
this.setupCatalogEventListeners();
|
||
}
|
||
}
|
||
|
||
// Загрузить и отобразить корзину
|
||
async loadBasket() {
|
||
const basketItems = await this.model.getBasketItems();
|
||
this.view.showBasket(basketItems);
|
||
}
|
||
|
||
// Настройка обработчиков событий для корзины
|
||
setupBasketEventListeners() {
|
||
document.addEventListener('click', async (e) => {
|
||
const basketItem = e.target.closest('.basket-item');
|
||
if (!basketItem) return;
|
||
|
||
const productId = basketItem.dataset.id;
|
||
|
||
// Удаление товара
|
||
if (e.target.closest('.remove-btn')) {
|
||
await this.model.removeFromBasket(productId);
|
||
this.view.showNotification('Товар удален из корзины');
|
||
await this.loadBasket();
|
||
}
|
||
|
||
// Увеличение количества
|
||
if (e.target.closest('.increase-btn')) {
|
||
const quantityInput = basketItem.querySelector('.quantity-input');
|
||
const newQuantity = parseInt(quantityInput.value) + 1;
|
||
quantityInput.value = newQuantity;
|
||
await this.model.updateBasketItem(productId, newQuantity);
|
||
await this.loadBasket();
|
||
}
|
||
|
||
// Уменьшение количества
|
||
if (e.target.closest('.decrease-btn')) {
|
||
const quantityInput = basketItem.querySelector('.quantity-input');
|
||
let newQuantity = parseInt(quantityInput.value) - 1;
|
||
if (newQuantity < 1) newQuantity = 1;
|
||
quantityInput.value = newQuantity;
|
||
await this.model.updateBasketItem(productId, newQuantity);
|
||
await this.loadBasket();
|
||
}
|
||
});
|
||
|
||
// Обработка изменения количества через input
|
||
document.addEventListener('change', async (e) => {
|
||
if (e.target.classList.contains('quantity-input')) {
|
||
const basketItem = e.target.closest('.basket-item');
|
||
const productId = basketItem.dataset.id;
|
||
const newQuantity = parseInt(e.target.value) || 1;
|
||
|
||
if (newQuantity < 1) {
|
||
e.target.value = 1;
|
||
return;
|
||
}
|
||
|
||
await this.model.updateBasketItem(productId, newQuantity);
|
||
await this.loadBasket();
|
||
}
|
||
});
|
||
|
||
// Оформление заказа
|
||
document.addEventListener('click', async (e) => {
|
||
if (e.target.id === 'checkoutBtn') {
|
||
const basketItems = await this.model.getBasketItems();
|
||
if (basketItems.length === 0) {
|
||
this.view.showNotification('Корзина пуста', 'error');
|
||
return;
|
||
}
|
||
|
||
this.view.showNotification('Заказ оформлен! Спасибо за покупку!');
|
||
await this.model.clearBasket();
|
||
await this.loadBasket();
|
||
}
|
||
});
|
||
}
|
||
|
||
// Настройка обработчиков событий для каталога
|
||
setupCatalogEventListeners() {
|
||
document.addEventListener('click', async (e) => {
|
||
if (e.target.closest('.btn') && e.target.closest('.btn').textContent.includes('В корзину')) {
|
||
const card = e.target.closest('.card');
|
||
const product = this.extractProductData(card);
|
||
|
||
if (product) {
|
||
await this.model.addToBasket(product);
|
||
this.view.showNotification('Товар добавлен в корзину!');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
extractProductData(card) {
|
||
try {
|
||
const name = card.querySelector('.card-title').textContent;
|
||
const priceText = card.querySelector('.text-muted').textContent.replace('$', '');
|
||
const description = card.querySelector('.card-text').textContent;
|
||
const image = card.querySelector('img').src;
|
||
|
||
// Генерируем ID на основе содержимого карточки
|
||
const id = btoa(`${name}-${priceText}`).substring(0, 8);
|
||
|
||
return {
|
||
id: id,
|
||
name: name.trim(),
|
||
price: parseFloat(priceText),
|
||
description: description.trim(),
|
||
image: image
|
||
};
|
||
} catch (error) {
|
||
console.error('Ошибка при извлечении данных товара:', error);
|
||
return null;
|
||
}
|
||
}
|
||
} |