Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add some fetures on tracker page and checkout page #4

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 8 additions & 17 deletions shop/templates/shop/checkout.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,17 +5,9 @@
<div class="col my-4">
<h2>Step 1 - My Awesome Cart Express Checkout - Review Your Cart Items</h2>
<div class="my-4">
<ul class="list-group" id="items">
</ul>

<nav aria-label="breadcrumb">
<ol class="breadcrumb mt-3">
<li class="breadcrumb-item active" aria-current="page">Your Cart Total Is <b>Rs. <span id="totalPrice"></span></b>. Enter your details below & place your order. Thanks for using My Awesome Cart!</li>
</ol>
<ul class="list-group" id="items"></ul>
<nav aria-label="breadcrumb">
</nav>




</div>
</div>
Expand Down Expand Up @@ -73,7 +65,6 @@ <h2>Step 2 - Enter Address & Other Details:</h2>
cart = JSON.parse(localStorage.getItem('cart'));

}
console.log(cart);
var sum = 0;
var totalPrice = 0;

Expand All @@ -82,23 +73,23 @@ <h2>Step 2 - Enter Address & Other Details:</h2>
mystr = `<p>Your cart is empty, please add some items to your cart before checking out!</p>`
$('#items').append(mystr);
} else {
var i = 0;
for (item in cart) {
let name = cart[item][1];
let qty = cart[item][0];
let itemPrice = cart[item][2];
sum = sum + qty;
totalPrice = totalPrice + qty* itemPrice;
mystr = `<li class="list-group-item d-flex justify-content-between align-items-center">
${name}
<span class="badge badge-primary badge-pill">${qty}</span>
</li>`
sumPrice = qty * itemPrice;
totalPrice = totalPrice + sumPrice;
mystr = `<li class="list-group-item d-flex justify-content-between align-items-center">${++i} : ${name}<span class="badge badge-primary badge-pill">${qty} x Rs. ${itemPrice} = Rs. ${sumPrice}</span></li>`;
$('#items').append(mystr);
}
mystr = `<li class="list-group-item d-flex justify-content-between align-items-center">Total Price: <span class="badge badge-danger badge-pill"> Rs. ${totalPrice} /- </span></li>`;
$('#items').append(mystr);

}

document.getElementById('cart').innerHTML = sum;
document.getElementById('totalPrice').innerHTML = totalPrice;
$('#itemsJson').val(JSON.stringify(cart));
{% if thank %}
alert('Thanks for ordering with us. Your order is is {{id}}. Use it to track your order using our order tracker');
Expand Down
7 changes: 4 additions & 3 deletions shop/templates/shop/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,8 @@ <h5 class="my-4">Flash Sale On {{product.0.category}} - Recommended Items</h5>
<div class="card align-items-center" style="width: 18rem;">
<img src='/media/{{i.image}}' class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title" id="namepr{{i.id}}">{{i.product_name}}</h5>
<input type="hidden" id="namepr{{i.id}}" value="{{i.product_name}}">
<h5 class="card-title">{{i.product_name|slice:"0:20"}}...</h5>
<p class="card-text">{{i.desc|slice:"0:53"}}...</p>
<h6 class="card-title" >Price: <span id="pricepr{{i.id}}">{{i.price}}</span></h6>
<span id="divpr{{i.id}}" class="divpr">
Expand Down Expand Up @@ -107,7 +108,7 @@ <h6 class="card-title" >Price: <span id="pricepr{{i.id}}">{{i.price}}</span></h6
qty = cart[idstr][0] + 1;
} else {
qty = 1;
name = document.getElementById('name'+idstr).innerHTML;
name = document.getElementById('name'+idstr).value;
price = document.getElementById('price'+idstr).innerHTML;
cart[idstr] = [qty, name, parseInt(price)];

Expand All @@ -127,7 +128,7 @@ <h6 class="card-title" >Price: <span id="pricepr{{i.id}}">{{i.price}}</span></h6
var i = 1;
for (var item in cart) {
popStr = popStr + "<b>" + i + "</b>. ";
popStr = popStr + document.getElementById('name' + item).innerHTML.slice(0, 19) + "... Qty: " + cart[item][0] + '<br>';
popStr = popStr + document.getElementById('name' + item).value.slice(0, 19) + "... Qty: " + cart[item][0] + '<br>';
i = i + 1;

}
Expand Down
37 changes: 17 additions & 20 deletions shop/templates/shop/tracker.html
Original file line number Diff line number Diff line change
Expand Up @@ -17,26 +17,15 @@ <h2>Enter your Order Id and Email address to track your order</h2>
<button type="submit" class="btn btn-primary">Track Order</button>
</div>
</div>
<div class="col my-4">
<h2>Your Order Status</h2>
<div class="my-4">
<ul class="list-group" id="items">
Enter your order Id and Email and click Track Order to find details about your order!
</ul>
</div>
<h2>Your Order Details</h2>
<div class="my-4">
<ul class="list-group" id="citems">
</ul>
</div>
<div class="col my-4" id="mydiv">
</div>
</div>
{% endblock %}
{% block js %}
<script>
$('#trackerForm').submit(function(event) {

$('#items').empty();
$('#mydiv').empty();
var formData = {
'orderId': $('input[name=orderId]').val(),
'email': $('input[name=email]').val(),
Expand All @@ -51,13 +40,25 @@ <h2>Your Order Details</h2>
})

.done(function(data) {
$('#citems').empty();
console.log(data)
data = JSON.parse(data);

mydiv = `<div class="my-4">
<h2>Your Order Status</h2>
<ul class="list-group" id="items">
</ul>
</div>`;
$('#mydiv').append(mydiv);

if (data['status'] == 'success') {
updates = data['updates'];

mydiv = `<div class="my-4">
<h2>Your Order Details</h2>
<ul class="list-group" id="citems">
</ul>
</div>`;
$('#mydiv').append(mydiv);

for (i = 0; i < updates.length; i++) {
let text = updates[i]['text'];
let time = updates[i]['time'];
Expand All @@ -82,13 +83,9 @@ <h2>Your Order Details</h2>
$('#citems').append(mystr);
}


} else {
mystr = `<li class="list-group-item d-flex justify-content-between align-items-center">
Sorry, We are not able to fetch this order id and email. Make sure to type correct order Id and email</li>`
mystr = `<li class="list-group-item d-flex justify-content-between align-items-center">Sorry, We are not able to fetch this order id and email. Make sure to type correct order Id and email</li>`
$('#items').append(mystr);
$('#citems').append(mystr);


}

Expand Down