From 384daa0e542d0b72e30f7988ecc6d14a8de11ec1 Mon Sep 17 00:00:00 2001 From: Khwezi Mngoma Date: Sat, 23 May 2026 17:05:59 +0200 Subject: [PATCH] Added cart page --- MidrandBookshop/Components/Pages/Cart.razor | 106 ++++++++++++++++++ .../Components/Pages/Checkout.razor | 105 +++++++++++++++++ 2 files changed, 211 insertions(+) create mode 100644 MidrandBookshop/Components/Pages/Cart.razor create mode 100644 MidrandBookshop/Components/Pages/Checkout.razor diff --git a/MidrandBookshop/Components/Pages/Cart.razor b/MidrandBookshop/Components/Pages/Cart.razor new file mode 100644 index 0000000..a3de54b --- /dev/null +++ b/MidrandBookshop/Components/Pages/Cart.razor @@ -0,0 +1,106 @@ +@page "/cart" + +
+
+

Your Cart

+ CONTINUE SHOPPING +
+ + @if (!CartItems.Any()) + { +
+

Your collection is currently empty.

+ Browse Catalog +
+ } + else + { +
+ @foreach (var item in CartItems) + { +
+ +
+
+ [COVER] +
+
+
@item.Title
+

by @item.Author

+
+
+ + +
+
+ + @item.Quantity + +
+
+ + +
+ R @(item.Price * item.Quantity) + +
+
+ } +
+ + +
+
+
+
+ Subtotal + R @Subtotal.ToString("F2") +
+
+ VAT (15%) + R @VatAmount.ToString("F2") +
+
+
+ Total + R @Total.ToString("F2") +
+ Proceed to Checkout +
+
+
+ } +
+ +@code { + public class CartItem + { + public int Id { get; set; } + public string Title { get; set; } = string.Empty; + public string Author { get; set; } = string.Empty; + public int Price { get; set; } + public int Quantity { get; set; } + } + + private List CartItems = new() + { + new CartItem { Id = 1, Title = "Letters from M/M (Paris)", Author = "M/M Paris", Price = 720, Quantity = 1 }, + new CartItem { Id = 2, Title = "Daan Paans: Floating Signifiers", Author = "Daan Paans", Price = 540, Quantity = 1 }, + new CartItem { Id = 3, Title = "Album Architectures, Maputo", Author = "Guedes Archive", Price = 350, Quantity = 1 } + }; + + // Computed Properties for Calculations + private decimal Subtotal => CartItems.Sum(i => (decimal)i.Price * i.Quantity); + private decimal VatAmount => Subtotal * 0.15m; + private decimal Total => Subtotal + VatAmount; + + private void ChangeQuantity(CartItem item, int delta) + { + item.Quantity += delta; + if (item.Quantity <= 0) CartItems.Remove(item); + } + + private void RemoveFromCart(CartItem item) => CartItems.Remove(item); +} \ No newline at end of file diff --git a/MidrandBookshop/Components/Pages/Checkout.razor b/MidrandBookshop/Components/Pages/Checkout.razor new file mode 100644 index 0000000..8fdd8f0 --- /dev/null +++ b/MidrandBookshop/Components/Pages/Checkout.razor @@ -0,0 +1,105 @@ +@page "/checkout" + +
+

Checkout

+
+ + +
+ +
+
Your Items
+ @foreach (var item in CartItems) + { +
+
@item.Title
@item.Author
+
+
+ + @item.Quantity + +
+ +
+
+ } +
+ + +
+
Shipping Method
+
+ + +
+
+ + +
+
+ + +
+
Shipping Address
+
+ + +
+ +
+
+ + +
+
+
Order Summary
+
SubtotalR @Subtotal.ToString("F2")
+
VAT (15%)R @VatAmount.ToString("F2")
+
ShippingR @ShippingCost.ToString("F2")
+
+
+ Total Due +

R @((Subtotal + VatAmount + ShippingCost).ToString("F2"))

+
+ +
+
+
+
+ +@code { + private decimal ShippingCost = 0; + private bool IsSameAddress = true; + + // Calculations + private decimal Subtotal => CartItems.Sum(i => (decimal)i.Price * i.Quantity); + private decimal VatAmount => Subtotal * 0.15m; + + // Assuming your CartItems list is managed via a Service or cascading parameter + // Here it is locally mocked for this example + private List CartItems = new() + { + new CartItem { Id = 1, Title = "Letters from M/M (Paris)", Author = "M/M Paris", Price = 720, Quantity = 1 }, + new CartItem { Id = 2, Title = "Daan Paans: Floating Signifiers", Author = "Daan Paans", Price = 540, Quantity = 1 } + }; + + private void ChangeQuantity(CartItem item, int delta) + { + item.Quantity += delta; + if (item.Quantity <= 0) CartItems.Remove(item); + } + + private void RemoveFromCart(CartItem item) => CartItems.Remove(item); + private int GetCartTotal() => CartItems.Sum(i => i.Price * i.Quantity); + + public class CartItem + { + public int Id { get; set; } + public string Title { get; set; } = ""; + public string Author { get; set; } = ""; + public int Price { get; set; } + public int Quantity { get; set; } + } +} \ No newline at end of file