From 242dd7f84af8717864e30307cc79eb2e3e8583bb Mon Sep 17 00:00:00 2001
From: 65160270 <65160270@go.buu.ac.th>
Date: Mon, 24 Mar 2025 14:57:20 +0700
Subject: [PATCH] update-edit
---
public/css/style.css | 6 ++---
views/cart.ejs | 61 ++++++++++++++++++++++++++------------------
2 files changed, 38 insertions(+), 29 deletions(-)
diff --git a/public/css/style.css b/public/css/style.css
index 3f81362..bd42a06 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -436,18 +436,16 @@ footer {
background-color: #3d38b1;
}
-.edit-order-btn {
+.edit-btn {
background-color: #ffc107;
color: black;
padding: 5px 10px;
text-decoration: none;
border-radius: 5px;
- display: inline-block;
- margin-left: 5px;
border: 1px solid #ffc107;
}
-.edit-order-btn:hover {
+.edit-btn:hover {
background-color: #e0a800;
border-color: #e0a800;
}
\ No newline at end of file
diff --git a/views/cart.ejs b/views/cart.ejs
index c1e4431..cd4268a 100644
--- a/views/cart.ejs
+++ b/views/cart.ejs
@@ -8,31 +8,42 @@
<a href="/" class="continue-shopping">Continue Shopping</a>
</div>
<% } else { %>
- <div class="cart-item">
- <div class="item-info">
- <h3><%= item.name %></h3>
- <p>Price: ฿<%= item.price.toLocaleString() %></p>
- <p class="price">Total: ฿<%= (item.price * item.quantity).toLocaleString() %></p>
- <% if (item.stock < 5) { %>
- <p style="color: var(--primary);">Only <%= item.stock %> items left!</p>
- <% } %>
- </div>
-
- <form method="POST" action="/cart/update" style="display: flex; gap: 0.8rem; align-items: center;">
- <input type="hidden" name="cartItemId" value="<%= item.id %>">
- <input type="number" name="quantity" value="<%= item.quantity %>" min="1" max="<%= item.stock %>" style="width: 70px;">
- <button type="button" class="update-btn" style="margin: 0; padding: 0.5rem 1rem;">
- Update
- </button>
- </form>
-
- <div class="cart-actions">
- <a href="/edit-cart/<%= item.id %>" class="edit-btn">Edit</a> <!-- ปุ่ม Edit -->
- <form action="/cart/remove" method="POST">
- <input type="hidden" name="cartItemId" value="<%= item.id %>">
- <button type="submit" class="remove-btn">Remove</button>
- </form>
- </div>
+ <div class="cart-items">
+ <% cartItems.forEach(item => { %>
+ <div class="cart-item">
+ <div class="item-info">
+ <h3><%= item.name %></h3>
+ <p>Price: ฿<%= item.price.toLocaleString() %></p>
+ <p class="price">
+ Total: ฿<%= (item.price * item.quantity).toLocaleString() %>
+ </p>
+ <% if (item.stock < 5) { %>
+ <p style="color: var(--primary);">Only <%= item.stock %> items left!</p>
+ <% } %>
+ </div>
+
+ <form method="POST" action="/cart/update" style="display: flex; gap: 0.8rem; align-items: center;">
+ <input type="hidden" name="cartItemId" value="<%= item.id %>">
+ <input type="number"
+ name="quantity"
+ value="<%= item.quantity %>"
+ min="1"
+ max="<%= item.stock %>"
+ style="width: 70px;">
+ <button type="button" class="update-btn" style="margin: 0; padding: 0.5rem 1rem;">
+ Update
+ </button>
+ </form>
+
+ <form action="/cart/remove" method="POST" style="text-align: right;">
+ <input type="hidden" name="cartItemId" value="<%= item.id %>">
+ <button type="submit" class="back-btn" style="margin: 0; padding: 0.5rem 1rem; background-color: red;">
+ Remove
+ </button>
+ </form>
+ <a href="/edit-cart/<%= item.id %>" class="edit-btn">Edit</a> <!-- ปุ่ม Edit -->
+ </div>
+ <% }); %>
</div>
<div class="cart-summary">
--
GitLab