diff --git a/app.js b/app.js index b005c1fe188789b526067dc8e171636d19b9b397..f674a113e29119100e50296d66d917004d94193f 100644 --- a/app.js +++ b/app.js @@ -187,6 +187,39 @@ app.get('/api/user/products', (req, res) => { }); }); +// GET: ดึงข้อมูลสินค้าจากตะกร้า +app.get('/api/cart', (req, res) => { + // สมมติว่ามีตะกร้าใน session ของผู้ใช้ + const cart = req.session.cart || []; // สมมติว่าใช้ session สำหรับเก็บข้อมูลตะกร้า + res.json(cart); +}); + +// PUT: อัพเดทจำนวนสินค้าในตะกร้า +app.put('/api/cart/:productId', (req, res) => { + const productId = req.params.productId; + const { quantity } = req.body; + let cart = req.session.cart || []; + + const itemIndex = cart.findIndex(item => item.product_id === productId); + if (itemIndex !== -1) { + cart[itemIndex].quantity = quantity; + req.session.cart = cart; // อัพเดทข้อมูลใน session + res.status(200).send('Cart updated'); + } else { + res.status(404).send('Product not found in cart'); + } +}); + +// DELETE: ลบสินค้าจากตะกร้า +app.delete('/api/cart/:productId', (req, res) => { + const productId = req.params.productId; + let cart = req.session.cart || []; + + cart = cart.filter(item => item.product_id !== productId); + req.session.cart = cart; // อัพเดทข้อมูลใน session + res.status(200).send('Product removed from cart'); +}); + // Fetch all products app.get('/api/products', (req, res) => { pool.query('SELECT * FROM products', (err, results) => { diff --git a/public/cart.html b/public/cart.html index 4f90180cd370784e695327e5c4a39e4d242c21d0..6323d8ef4ee972812c172bb065ab6ddda7a58cc3 100644 --- a/public/cart.html +++ b/public/cart.html @@ -10,7 +10,7 @@ <header> <h1>ASA Cart</h1> </header> - + <div class="cart-items" id="cart-items"> <!-- Cart items will be dynamically loaded here --> </div> @@ -21,44 +21,45 @@ <footer> <p>© 2025 ASA</p> - </footer> <script> - // Load cart items from the API + // ฟังก์ชันดึงข้อมูลสินค้าจากตะกร้า async function loadCart() { try { + // ดึงข้อมูลจาก API ตะกร้าสินค้า const response = await fetch('/api/cart'); const cart = await response.json(); const cartItemsContainer = document.getElementById('cart-items'); - cartItemsContainer.innerHTML = ''; + cartItemsContainer.innerHTML = ''; // เคลียร์ข้อมูลที่มีอยู่เดิม if (cart.length === 0) { cartItemsContainer.innerHTML = '<p>Your cart is empty!</p>'; + } else { + cart.forEach(item => { + const itemDiv = document.createElement('div'); + itemDiv.classList.add('cart-item'); + itemDiv.innerHTML = ` + <img src="${item.product_img}" alt="${item.product_name}"> + <div> + <h3>${item.product_name}</h3> + <p>Price: $${item.product_price}</p> + <p>Total Price: $<span id="total-price-${item.product_id}">${item.total_price}</span></p> + </div> + <div> + <input type="number" value="${item.quantity}" min="1" onchange="updateQuantity(${item.product_id}, this.value)"> + <button onclick="removeFromCart(${item.product_id})">Remove</button> + </div> + `; + cartItemsContainer.appendChild(itemDiv); + }); } - - cart.forEach(item => { - const itemDiv = document.createElement('div'); - itemDiv.classList.add('cart-item'); - itemDiv.innerHTML = ` - <img src="${item.product_img}" alt="${item.product_name}"> - <div> - <h3>${item.product_name}</h3> - <p>Price: $${item.product_price}</p> - <p>Total Price: $<span id="total-price-${item.product_id}">${item.total_price}</span></p> - </div> - <div> - <input type="number" value="${item.quantity}" min="1" onchange="updateQuantity(${item.product_id}, this.value)"> - <button onclick="removeFromCart(${item.product_id})">Remove</button> - </div> - `; - cartItemsContainer.appendChild(itemDiv); - }); } catch (error) { console.error('Error loading cart items:', error); } } + // ฟังก์ชันอัพเดทจำนวนสินค้าในตะกร้า async function updateQuantity(productId, newQuantity) { await fetch(`/api/cart/${productId}`, { method: 'PUT', @@ -66,19 +67,21 @@ body: JSON.stringify({ quantity: newQuantity }) }); - loadCart(); // Reload the cart after updating + loadCart(); // รีโหลดตะกร้าหลังจากอัพเดท } + // ฟังก์ชันลบสินค้าจากตะกร้า async function removeFromCart(productId) { await fetch(`/api/cart/${productId}`, { method: 'DELETE' }); - loadCart(); // Reload the cart after removal + loadCart(); // รีโหลดตะกร้าหลังจากลบสินค้า } + // ฟังก์ชันสำหรับไปที่หน้าชำระเงิน function goToCheckout() { window.location.href = 'checkout.html'; } - // Load cart items when page loads + // โหลดข้อมูลสินค้าจากตะกร้าทันทีที่หน้าเว็บโหลด loadCart(); </script> </body>