Skip to content

Commit

Permalink
add order summary cart
Browse files Browse the repository at this point in the history
  • Loading branch information
@kritserv
kritserv committed Oct 2, 2023
1 parent a4d35e9 commit 9cdcf6f
Show file tree
Hide file tree
Showing 5 changed files with 178 additions and 1 deletion.
2 changes: 2 additions & 0 deletions code/ddice_online_shop/urls.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@
path('headphone/', HeadphoneFormView.as_view(), name='view_headphone'),
path('cloth/', ClothFormView.as_view(), name='view_cloth'),

path('ordersummary/', views.OrderSummaryView, name='order_summary_view'),

path("product/addtocart/<str:title>", views.add_to_cart, name = "add_to_cart"),
path("product/removefromcart/<str:title>", views.remove_from_cart, name = "remove_from_cart"),
path("product/removeonefromcart/<str:title>", views.remove_single_item_from_cart, name = "remove_one_from_cart"),
Expand Down
30 changes: 30 additions & 0 deletions code/main/views.py
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
from django.shortcuts import render, get_object_or_404, redirect
from django.contrib.auth.decorators import login_required
from django.contrib import messages
from django.core.exceptions import ObjectDoesNotExist
from django.utils import timezone
from products.models import *
from order_manager.models import *
Expand Down Expand Up @@ -48,6 +49,35 @@ def product_cloth(request, id):
fullstar = "★" * floor(product.stars)
return render(request, "store/product/cloth.html", {'data': product, 'fullstar': fullstar})

@login_required
def OrderSummaryView(request):
try:
order = Order.objects.get(user=request.user, ordered=False)
quantity = order.items.values_list('quantity', flat=True)
prod_id_list = order.items.values_list('prod_item_id', flat=True)
prod_list = []
for i in range(len(prod_id_list)):
prod = ProductItem.objects.get(id=prod_id_list[i])
if 'Unisex' in prod.title or 'Female' in prod.title or 'Male' in prod.title:
prodlink = "/cloth/product/"+str(Cloth.objects.get(title=prod.title).id)
elif 'Desktop' in prod.title or 'Laptop' in prod.title:
prodlink = "/computer/product/"+str(Computer.objects.get(title=prod.title).id)
elif 'Headphone' in prod.title or 'Headset' in prod.title or 'Earphone' in prod.title:
prodlink = "/headphone/product/"+str(Headphone.objects.get(title=prod.title).id)
else:
prodlink = "/smartphone/product/"+str(Smartphone.objects.get(title=prod.title).id)

prod_list.append({'title': prod.title, 'prodlink': prodlink, 'image': prod.image, 'price': prod.price, 'totalprice': prod.price*quantity[i], 'quantity': quantity[i]})

total_item = sum([prod['quantity'] for prod in prod_list])
total_and_delivery_price = sum([prod['totalprice'] for prod in prod_list]) + 50

except ObjectDoesNotExist:
messages.error(request, "You don't have an active order")
return redirect(request.META.get('HTTP_REFERER'))

return render(request, 'store/order_summary.html', {'prodlist': prod_list, 'total_item': total_item, 'total_and_delivery_price': total_and_delivery_price})

@login_required
def add_to_cart(request, title):
prod_item = get_object_or_404(ProductItem, title=title)
Expand Down
35 changes: 35 additions & 0 deletions code/static/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -161,4 +161,39 @@ a.nav-link:hover {

#detail-table {
margin-bottom: 16rem;
}

@media (min-width: 1025px) {
.h-custom {
height: 100vh !important;
}
}

.card-registration .select-input.form-control[readonly]:not([disabled]) {
font-size: 1rem;
line-height: 2.15;
padding-left: .75em;
padding-right: .75em;
}

.card-registration .select-arrow {
top: 13px;
}

.bg-grey {
background-color: #eae8e8;
}

@media (min-width: 992px) {
.card-registration-2 .bg-grey {
border-top-right-radius: 16px;
border-bottom-right-radius: 16px;
}
}

@media (max-width: 991px) {
.card-registration-2 .bg-grey {
border-bottom-left-radius: 16px;
border-bottom-right-radius: 16px;
}
}
2 changes: 1 addition & 1 deletion code/templates/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@
<li class="nav-item">
<div data-aos="flip-right">
<div class="d-flex align-items-center">
<a class="nav-link" href="#" tabindex="-1" aria-disabled="true">
<a class="nav-link" href="/ordersummary" tabindex="-1" aria-disabled="true">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M0 24C0 10.7 10.7 0 24 0H69.5c22 0 41.5 12.8 50.6 32h411c26.3 0 45.5 25 38.6 50.4l-41 152.3c-8.5 31.4-37 53.3-69.5 53.3H170.7l5.4 28.5c2.2 11.3 12.1 19.5 23.6 19.5H488c13.3 0 24 10.7 24 24s-10.7 24-24 24H199.7c-34.6 0-64.3-24.6-70.7-58.5L77.4 54.5c-.7-3.8-4-6.5-7.9-6.5H24C10.7 48 0 37.3 0 24zM128 464a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm336-48a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/></svg>
<p>Cart</p>
</a>
Expand Down
110 changes: 110 additions & 0 deletions code/templates/store/order_summary.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
{% extends "base.html" %}

{% block content %}
{% load static %}
<link rel="stylesheet" href="{% static 'css/aos.css' %}">
<script src="{% static 'js/aos.js' %}"></script>

<script>
AOS.init();
</script>

</div>
</div>

<section>
<section class="h-100 h-custom" style="background-color: #eee;">
<div class="container py-5 h-100">
<div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-12">
<div class="card card-registration card-registration-2" style="border-radius: 15px;">
<div class="card-body p-0">
<div class="row g-0">
<div class="col-lg-8">
<div class="p-5">
<div class="d-flex justify-content-between align-items-center mb-5">
<h1 class="fw-bold mb-0 text-black">Shopping Cart</h1>
<h6 class="mb-0 text-muted">{{ total_item }} items</h6>
</div>
{% for order in prodlist %}
<hr class="my-4">

<div class="row mb-4 d-flex justify-content-between align-items-center">
<div class="col-md-2 col-lg-2 col-xl-2">
<img
src="/media/{{ order.image }}"
class="img-fluid rounded-3" alt="Cotton T-shirt">
</div>
<div class="col-md-3 col-lg-3 col-xl-3">
<a class="text-black mb-0" href="{{ order.prodlink }}">
<h6>{{ order.title }} {{ order.price }}฿</h6>
</a>
</div>
<div class="col-md-3 col-lg-3 col-xl-2 d-flex">
<div class="col-md-3 col-lg-3 col-xl-3">
<a href="/product/addtocart/{{ order.title }}">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z"/></svg>
</a>
<h3 class="text-black mb-0">{{ order.quantity }}</h3>
<a href="/product/removeonefromcart/{{ order.title }}">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z"/></svg>
</a>
</div>
</div>
<div class="col-md-3 col-lg-3 col-xl-2 d-flex">
<h6 class="mb-0">Total:{{ order.totalprice }}฿</h6>
</div>
<div class="col-md-3 col-lg-2 col-xl-2 offset-lg-1">
<a href="/product/removefromcart/{{ order.title }}" class="btn btn-danger add-to-cart">
<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z"/></svg>
</a>
</div>
<div class="col-md-1 col-lg-1 col-xl-1 text-end">
<a href="#" class="text-muted"><i class="fas fa-times"></i></a>
</div>
</div>
{% endfor %}

<hr class="my-4">

<div class="pt-5">
<h6 class="mb-0"><a href="/" class="text-body"><i
class="fas fa-long-arrow-alt-left me-2"></i>Back to shop</a></h6>
</div>
</div>
</div>
<div class="col-lg-4 bg-grey">
<div class="p-5">
<h3 class="fw-bold mb-5 mt-2 pt-1">Summary</h3>
<hr class="my-4">

<div class="d-flex justify-content-between mb-4">
<h5 class="text-uppercase">{{ total_item }} items</h5>
<h5>{{ total_and_delivery_price }}</h5>
</div>

<h5 class="text-uppercase mb-3">Shipping</h5>

<div class="mb-4 pb-2">
<select class="select">
<option value="1">Standard-Delivery- 50 ฿</option>
<option value="2" disabled>Special Delivery 1</option>
<option value="3" disabled>Special Delivery 2</option>
</select>
</div>

<button type="button" class="btn btn-dark btn-block btn-lg"
data-mdb-ripple-color="dark">Check out</button>

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</section>

{% endblock %}

0 comments on commit 9cdcf6f

Please sign in to comment.