public/lab9/task3/app.js - main - Cooolprogrammers/web-nodejs-labs

public/lab9/task3/app.js
172 строки6 KB
darkvoid6@mail.ru
ЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫЫ
18 дек 2025, 07:59
18 дек 2025, 07:59f2c4f06
const API_BASE = '/api/lab9';

// Форматирование цены: Копейки -> Рубли
const formatPrice = (cents) => {
    return (cents / 100).toLocaleString('ru-RU', { style: 'currency', currency: 'RUB' });
};

// Работа с корзиной в localStorage
const CART_KEY = 'lab9_shopping_cart';

function getCart() {
    const cart = localStorage.getItem(CART_KEY);
    return cart ? JSON.parse(cart) : {};
}

function saveCart(cart) {
    localStorage.setItem(CART_KEY, JSON.stringify(cart));
    updateCartCount();
}

function updateCartCount() {
    const cart = getCart();
    const totalItems = Object.values(cart).reduce((sum, item) => sum + item.quantity, 0);
    
    // Обновляем счетчик в шапке
    const cartCountElement = document.getElementById('cartCount');
    const currentCartCountElement = document.getElementById('currentCartCount');
    
    if (cartCountElement) cartCountElement.textContent = totalItems;
    if (currentCartCountElement) currentCartCountElement.textContent = totalItems;
}

function addToCart(productId, productTitle, productPrice, availableQuantity) {
    const cart = getCart();
    
    if (cart[productId]) {
        // Если товар уже в корзине, увеличиваем количество (макс 5)
        if (cart[productId].quantity < 5) {
            cart[productId].quantity += 1;
        } else {
            alert('Максимальное количество товара в корзине - 5');
            return;
        }
    } else {
        // Добавляем новый товар в корзину
        cart[productId] = {
            id: productId,
            title: productTitle,
            price: productPrice,
            quantity: 1,
            available: availableQuantity
        };
    }
    
    saveCart(cart);
    showMessage(`Товар "${productTitle}" добавлен в корзину!`, 'success');
}

function clearCart() {
    if (confirm('Вы уверены, что хотите очистить корзину?')) {
        localStorage.removeItem(CART_KEY);
        updateCartCount();
        showMessage('Корзина очищена', 'info');
    }
}

// Загрузка статистики склада
async function loadStockStats() {
    try {
        const res = await fetch(`${API_BASE}/task1/stock`);
        const stats = await res.json();
        
        document.getElementById('totalProducts').textContent = stats.total_products;
        document.getElementById('totalItems').textContent = stats.total_items;
        document.getElementById('totalValue').textContent = formatPrice(stats.total_value);
        
    } catch (error) {
        console.error('Ошибка при загрузке статистики:', error);
    }
}

// Загрузка всех товаров
async function loadAllProducts() {
    try {
        const res = await fetch(`${API_BASE}/`);
        const products = await res.json();
        displayProducts(products);
        document.getElementById('searchInput').value = '';
    } catch (error) {
        console.error('Ошибка при загрузке товаров:', error);
        document.getElementById('productsContainer').innerHTML = '<p class="error-message">Ошибка при загрузке товаров</p>';
    }
}

// Поиск товаров
async function searchProducts() {
    const searchTerm = document.getElementById('searchInput').value.trim();
    if (searchTerm.length < 1) {
        alert('Введите минимум 1 символ для поиска');
        return;
    }
    
    try {
        const res = await fetch(`${API_BASE}/task1/products?q=${encodeURIComponent(searchTerm)}`);
        const products = await res.json();
        displayProducts(products);
    } catch (error) {
        console.error('Ошибка при поиске товаров:', error);
        document.getElementById('productsContainer').innerHTML = '<p class="error-message">Ошибка при поиске товаров</p>';
    }
}

// Отображение списка товаров
function displayProducts(products) {
    const container = document.getElementById('productsContainer');
    const cart = getCart();
    
    if (products.length === 0) {
        container.innerHTML = '<p>Товары не найдены</p>';
        return;
    }

    container.innerHTML = products.map(product => {
        const inCart = cart[product.id];
        const availableClass = product.amount > 10 ? 'available' : product.amount > 0 ? 'low-stock' : '';
        const availableText = product.amount > 10 ? 'В наличии' : product.amount > 0 ? `Осталось: ${product.amount}` : 'Нет в наличии';
        
        return `
            <div class="product-card">
                <div class="product-header">
                    <div class="product-title">${product.title}</div>
                    <div class="product-actions">
                        ${inCart ? `
                            <span class="availability available">В корзине: ${inCart.quantity}</span>
                        ` : ''}
                        <button class="btn btn-primary btn-sm" 
                                onclick="addToCart(${product.id}, '${product.title.replace(/'/g, "\\'")}', ${product.price}, ${product.amount})"
                                ${product.amount === 0 ? 'disabled' : ''}>
                            🛒 Добавить в корзину
                        </button>
                    </div>
                </div>
                <div class="product-details">
                    <div class="price">${formatPrice(product.price)}</div>
                    <div class="availability ${availableClass}">${availableText}</div>
                    <div>ID: ${product.id}</div>
                </div>
            </div>
        `;
    }).join('');
}

// Показать сообщение
function showMessage(message, type) {
    const messageDiv = document.createElement('div');
    messageDiv.className = `message message-${type}`;
    messageDiv.textContent = message;
    
    document.querySelector('.main-content').insertBefore(messageDiv, document.querySelector('.main-content').firstChild);
    
    // Автоматически удалить сообщение через 3 секунды
    setTimeout(() => {
        messageDiv.remove();
    }, 3000);
}

// Инициализация
document.addEventListener('DOMContentLoaded', function() {
    loadAllProducts();
    loadStockStats();
    updateCartCount();
});