sachin.ganesh/anwi_website
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

My Account page UI

Browse Source
This commit is contained in:
Abhiram
2023-04-24 14:31:15 +05:30
parent 9aed733cc5
commit 0bfbd9cabf
7 changed files with 98 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/Js/main.js
Vendored
+1 -1
View File
@@ -16,7 +16,7 @@
setTimeout(naChanges, 1000); setTimeout(naChanges, 1000);
win.on('scroll', function() { win.on('scroll', function() {
var scroll = win.scrollTop(); var scroll = win.scrollTop();
if (scroll < 200) { if (scroll < 100) {
header.removeClass('stick'); header.removeClass('stick');
$(".header-bottom.sticky-bar.stick").removeClass("sticky-bar stick"); $(".header-bottom.sticky-bar.stick").removeClass("sticky-bar stick");
let img_src = `./dist/assets/imgs/anwi-logo-2.png`; let img_src = `./dist/assets/imgs/anwi-logo-2.png`;
dist/Js/myaccount/orderdetails.js
Vendored
+59 -1
View File
@@ -32,7 +32,65 @@ let port = "https://anwi.bizgaze.app";
order_netTotal = current.nettotal; order_netTotal = current.nettotal;
order_quantity =current.Quantity; order_quantity =current.Quantity;
order_taxAmount =current.taxamount; order_taxAmount =current.taxamount;
user_order_details+= `<a href="" class="order_details_main_container"><div class="border-3 mb-3 card"> <div class="text-dark card-body px-0 pt-0"><div class="d-none"><span class="order_itemTotal">${order_itemTotal}</span><span class="order_netTotal">${order_netTotal}</span><span class="order_tax">${order_taxAmount}</span> <span class="order_qty">${order_quantity}</span></div> <div class="bg-gray-4 p-2 row g-0"> <div class="col-md-6 "> <div class="d-flex justify-content-between align-items-center"> <div> <p class="mb-1">ORDER PLACED</p><p class="mb-1 order_date">${current.OrderDate}</p></div><div> <p class="mb-1"> TOTAL</p><p class="mb-1 Current_netTotal"> ₹${updatedCurent_total}</p></div><div> <p class="mb-1">Delivered TO </p><p class="mb-1">${current.OrganizationName}</p></div></div></div><div class="col-md-4 ms-auto"> <div> <p class="mb-1 text-end">ORDER NO: <span class="text-secondary fs-9 serial_no">${current.OrderNo}</span> </p></div><div class="d-flex justify-content-between"> <p class="mb-1 text-info"> View order details </p><p class="mb-0 text-info">Invoice</p></div></div></div><div class="border-0 card rounded-0 order-cards py-3"> <div class="row align-items-center text-center"> <div class="col-md-3"> <img src="https://appassets.bizgaze.app/${current.imageurl}" class="img-fluid w-75 order_item_name"/> </div><div class="col-md-9"> <div class="row align-items-center"> <div class="col-md-8"> <div class="order_item_name">${current.itemname}</div></div><div class="col-md-4"> <button type="button" class="btn btn-sm rounded order_details_btn primary_btn py-0 mb-3" onClick="event.preventDefault();">Track Package</button> <button type="button" class="btn btn-sm btn-light rounded order_details_btn py-0 mb-3 shadow-sm" onClick="event.preventDefault();">Cancel Item</button> </div></div></div></div></div></div></div></a>`; user_order_details+= `<a href="" class="order_details_main_container">
<div class="border-3 mb-3 card">
<div class="text-dark card-body px-0 pt-0">
<div class="d-none">
<span class="order_itemTotal">${order_itemTotal}</span>
<span class="order_netTotal">${order_netTotal}</span>
<span class="order_tax">${order_taxAmount}</span>
<span class="order_qty">${order_quantity}</span>
</div>
<div class="bg-gray-4 p-2 m-0 border-bottom">
<p class="m-0 fw-600 text-secondary">ORDER NO: <span class="text-blue fs-9 serial_no ">${current.OrderNo}</span>
</p>
</div>
<div class="bg-gray-4 p-2 row g-0">
<div class="col-md-6 ">
<div class="d-flex justify-content-between align-items-center">
<div>
<p class="mb-1">ORDER PLACED</p>
<p class="mb-1 fw-500 order_date">${current.OrderDate}</p>
</div>
<div>
<p class="mb-1"> TOTAL</p>
<p class="mb-1 fw-500 Current_netTotal"> ₹${updatedCurent_total}</p>
</div>
<div>
<p class="mb-1">Delivered TO </p>
<p class="mb-1 fw-500">${current.OrganizationName}</p>
</div>
</div>
</div>
<div class="col-md-4 ms-auto">
<div class="d-flex justify-content-between">
<p class="mb-1 text-info fw-500"> View order details </p>
<p class="mb-0 text-info fw-500">Invoice</p>
</div>
</div>
</div>
<div class="border-0 card rounded-0 order-cards py-3">
<div class="d-flex flex-wrap px-2 align-items-center text-center">
<div class="col-md-3">
<img src="https://appassets.bizgaze.app/${current.imageurl}" class="img-fluid w-75 order_item_name" />
</div>
<div class="col-md-9">
<div class="row align-items-center">
<div class="col-md-8">
<div class="order_item_name">${current.itemname}</div>
</div>
<div class="col-md-4">
<button type="button" class="btn btn-sm rounded order_details_btn bg-gradient-anwi-outline py-0 mb-3" onClick="event.preventDefault();">Track Package</button>
<button type="button" class="btn btn-sm btn-light rounded order_details_btn py-0 mb-3 shadow-sm" onClick="event.preventDefault();">Cancel Item</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</a>`;
} }
$(".user_order_details").append(user_order_details); $(".user_order_details").append(user_order_details);
$('.order_details_main_container').click(function(){ $('.order_details_main_container').click(function(){
dist/Js/orderDetails/order_summary.js
Vendored
+2 -2
View File
@@ -25,7 +25,7 @@ let filteredOrders = new_arrr.filter(function(order) {
$.each(filteredOrders, function(index, order) { $.each(filteredOrders, function(index, order) {
console.log(order.OrderNo) console.log(order.OrderNo)
let Delivery_status =order.stageshortcode let Delivery_status =order.stageshortcode
let deliverdCard=`<div class="card rounded-0 border-0 bg-white mb-3 "><div class=card-body><div class="align-items-center row"><div class=col-md-6><div class=d-flex><img class=img-fluid src=""></div><div class="d-flex align-items-center"><div>Delivery Status :</div><div class="text-secondary delivery_status" data-status="${order.stageshortcode}"></div></div></div><div class="col-md-6 text-end"><button class="bg-return btn ">Claim warranty</button> <button class="bg-return btn ">Support</button></div></div><div><small class=" text-secondary me-2">Delivered To</small><small class="fw-600 user_name">${order.OrganizationName}</div><div class="row pb-4 pb-md-0 align-items-center"><div class="col-md-4 text-center"><img class="img-fluid order_img w-75"src=https://appassets.bizgaze.app/${order.imageurl}></div><div class="col-md-8 position-relative"><small class=" mb-0 order_itemname">${order.itemname} (${order.Quantity} items)<small class=" align-items-center d-flex fw-600 mb-3"><svg class="bi bi-currency-rupee"fill=currentColor height=16 viewBox="0 0 16 16"width=16 xmlns=http://www.w3.org/2000/svg><path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"></path></svg><small class="order_price fs-6">${order.itemtotal}</small><p class=" mb-0 close_exchange position-absolute d-none text-secondary">Return/Exchange window closed on Friday,24 March <a class=text-primary href=#>Why?</a></div></div></div></div>`; let deliverdCard=`<div class="card rounded-0 border-0 bg-white mb-3 "><div class=card-body><div class="align-items-center row"><div class=col-md-6><div class=d-flex><img class=img-fluid src=""></div><div class="d-flex align-items-center"><div class="text-secondary">Delivery Status : </div><div class=" delivery_status text-blue fw-600" data-status="${order.stageshortcode}"></div></div></div><div class="col-md-6 text-end"><button class=" bg-gradient-anwi-outline btn-sm btn ">Claim warranty</button> <button class=" bg-gradient-anwi-outline btn-sm btn ">Support</button></div></div><div><small class=" text-secondary me-2">Delivered To : </small><small class="fw-600 user_name">${order.OrganizationName}</div><div class="row pb-4 pb-md-0 align-items-center"><div class="col-md-4 text-center"><img class="img-fluid order_img w-75"src=https://appassets.bizgaze.app/${order.imageurl}></div><div class="col-md-8 position-relative"><small class=" mb-0 order_itemname">${order.itemname} (${order.Quantity} items)<small class=" align-items-center d-flex fw-600 mb-3"><svg class="bi bi-currency-rupee"fill=currentColor height=16 viewBox="0 0 16 16"width=16 xmlns=http://www.w3.org/2000/svg><path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"></path></svg><small class="order_price fs-6">${order.itemtotal}</small><p class=" mb-0 close_exchange position-absolute d-none text-secondary">Return/Exchange window closed on Friday,24 March <a class=text-primary href=#>Why?</a></div></div></div></div>`;
$('.deliverd-card').append(deliverdCard) $('.deliverd-card').append(deliverdCard)
if(Delivery_status == 'CMD'){ if(Delivery_status == 'CMD'){
$('.delivery_status').html('Deliverd') $('.delivery_status').html('Deliverd')
@@ -35,7 +35,7 @@ if(Delivery_status == 'APL'){
} }
}); });
console.log(filteredOrders) console.log(filteredOrders)
let summary =`<div class=card-body><div><p class="mb-0 fw-500">Order<span>${orderNumber}</span><span class=" text-secondary"> (${filteredOrders.length} items)<p class="mb-0 ">Order placed on ${filteredOrders[0].OrderDate}</p></div>`; let summary =`<div class=card-body><div><p class="mb-0 fw-500">Order : <span>${orderNumber}</span><small class=" "> ( ${filteredOrders.length} items )</samll><p class="mb-0 ">Order placed on ${filteredOrders[0].OrderDate}</p></div>`;
$('.order_tax').html(filteredOrders[0].taxamount) $('.order_tax').html(filteredOrders[0].taxamount)
$('.Order_total').html(filteredOrders[0].nettotal) $('.Order_total').html(filteredOrders[0].nettotal)
dist/css/main.css
Vendored
+7 -1
View File
@@ -1911,4 +1911,10 @@ background: linear-gradient(75deg, rgb(56 89 118) 51%, rgb(107 18 111) 89%)
min-height: 100%; min-height: 100%;
max-height: 100% !important; max-height: 100% !important;
} }
.user_order_details.rounded.mb-3 .text-info {
color:#0a1322 !important;
}
.text-blue{
color:#0a1322 !important;
}
dist/css/style.css
Vendored
+3 -3
View File
@@ -6409,9 +6409,9 @@ margin-bottom: 0.5rem !important;
} }
.myaccount-tab-menu a:hover, .myaccount-tab-menu a.active { .myaccount-tab-menu a:hover, .myaccount-tab-menu a.active {
background-color: #0A1039; background: linear-gradient(145deg,rgb(27,45,83,0.9),rgb(10,19,34)) !important;
border-color: #0A1039; /* border: solid 2px rgb(10,19,34)!important; */
color: #ffffff; color: white !important;
} }
.myaccount-tab-menu a i.fa { .myaccount-tab-menu a i.fa {
myaccount.html
+13 -13
View File
@@ -41,13 +41,13 @@
</div> </div>
</div> </div>
</section> </section>
<section class="pt-5"> <section class="">
<div class="my-account-wrapper bg-gradient-violet py-md-5"> <div class="my-account-wrapper bg-gradient-violet py-md-5">
<div class="container pt-5"> <div class="container">
<div> <div>
<h4>My Account </h4> <h4>My Account </h4>
</div> </div>
<div class="row pt-md-5 pt-3"> <div class="row pt-3 ">
<div class="col-lg-12"> <div class="col-lg-12">
<!-- My Account Page Start --> <!-- My Account Page Start -->
<div class="myaccount-page-wrapper"> <div class="myaccount-page-wrapper">
@@ -72,21 +72,21 @@
<div class="tab-pane fade " id="dashboad" role="tabpanel"> <div class="tab-pane fade " id="dashboad" role="tabpanel">
<div class="myaccount-content p-lg-4"> <div class="myaccount-content p-lg-4">
<div class="row bg-gray p-lg-4 align-items-end"> <div class="row bg-gray p-lg-4 align-items-end">
<div class="col-md-5 col-12"> <div class="col-md-7 col-12">
<div class="row align-items-center"> <div class="row align-items-center">
<div class="col-md-5"> <div class="col-md-3">
<img src="./dist/assets/imgs/account_warrenty/profile-icon.png" class="w-md-65 w-50"/> <img src="./dist/assets/imgs/account_warrenty/profile-icon.png" class="w-md-65 w-50"/>
</div> </div>
<div class="col-md-7"> <div class="col-md-9">
<h6>Name :<span class="text-black-50"> Anwi</span></h6> <h6>Name :<span class="text-black-50"> Anwi</span></h6>
<h6>Phone :<span class="text-black-50 User_phoneum">9542494949</span></h6> <h6>Phone :<span class="text-black-50 User_phoneum">9542494949</span></h6>
<!-- <h6>Phone :<span class="text-black-50 User_phoneum">9030076615</span></h6> --> <!-- <h6>Phone :<span class="text-black-50 User_phoneum">9030076615</span></h6> -->
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-5"></div> <div class="col-md-3"></div>
<div class="col-md-2 col-12 text-end"> <div class="col-md-2 col-12 text-end">
<a href="#" class="btn btn-outline-primary px-4">Edit</a> <a href="#" class="btn bg-gradient-anwi-outline px-4 btn-sm">Edit</a>
</div> </div>
</div> </div>
<div class="row py-4 justify-content-md-between"> <div class="row py-4 justify-content-md-between">
@@ -212,7 +212,7 @@
<h3 class="mb-0 border-0 pb-0">Saved Address</h3> <h3 class="mb-0 border-0 pb-0">Saved Address</h3>
</div> </div>
<div class="col-md-6 text-end py-md-2"> <div class="col-md-6 text-end py-md-2">
<a href="#" class="btn btn-outline-primary">+ ADD NEW ADDRESS</a> <a href="#" class="btn bg-gradient-anwi-outline btn-sm">+ ADD NEW ADDRESS</a>
</div> </div>
</div> </div>
<address> <address>
@@ -269,8 +269,8 @@
</div> </div>
<div class="p-3"> <div class="p-3">
<div class="d-none"> <div class="d-none">
<button class="btn btn-primary me-2">Send Remainder</button> <button class="btn bg-gradient-anwi-outline me-2">Send Remainder</button>
<button class="btn btn-primary">Extended warranty History</button> <button class="btn bg-gradient-anwi">Extended warranty History</button>
</div> </div>
</div> </div>
</div> </div>
@@ -298,8 +298,8 @@
</div> </div>
<div class="p-3"> <div class="p-3">
<div class="d-none"> <div class="d-none">
<button class="btn btn-primary me-2">Send Remainder</button> <button class="btn bg-gradient-anwi-outline me-2">Send Remainder</button>
<button class="btn btn-primary">Extended warranty History</button> <button class="btn bg-gradient-anwi">Extended warranty History</button>
</div> </div>
</div> </div>
</div> </div>
orderdetails.html
+13 -7
View File
@@ -34,8 +34,14 @@
<div id="navbar-head"></div> <div id="navbar-head"></div>
<!-- end-navbar --> <!-- end-navbar -->
<!-- main-body --> <!-- main-body -->
<main class="main-body home-main-container pt-5"> <main class="main-body home-main-container">
<section class="bg-gray-7 pt-md-5 pt-5"> <section class="services h-100 pt-3 bg-gradient-anwi">
<div class="container pt-5 ">
<div class="text-center text-white ">
</div>
</div>
</section>
<section class="bg-gray-7 pt-md-5 pt-5 bg-gradient-violet">
<div class="container pb-5"> <div class="container pb-5">
<div class="row pb-4"> <div class="row pb-4">
<div class="col-6"> <div class="col-6">
@@ -51,11 +57,11 @@
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<div class="Order_details_section mb-2"> <div class="Order_details_section mb-2">
<div class="card rounded-0 border-0 order-summary"> <div class="card rounded-0 border-0 order-summary bg-gradient-anwi text-white" >
</div> </div>
<div class="card rounded-0 border-top-0"> <div class="card rounded-0 border-top-0">
<div class="card-body"> <div class="card-body" >
<div class="payement details"> <div class="payement details">
<p class="fs-6 fw-600 mb-0 pb-1 border-bottom">Order Payment Details</p> <p class="fs-6 fw-600 mb-0 pb-1 border-bottom">Order Payment Details</p>
<div class="py-1"> <div class="py-1">
@@ -80,13 +86,13 @@
<div class="col-6 text-end"> <div class="col-6 text-end">
<!-- <p class="fs-7 mb-0 text-order-brown order_tax">-₹1000.00</p> --> <!-- <p class="fs-7 mb-0 text-order-brown order_tax">-₹1000.00</p> -->
<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" <svg xmlns="http://www.w3.org/2000/svg" width="8" height="8"
fill="currentColor" class="bi bi-currency-rupee text-order-brown" fill="currentColor" class="bi bi-currency-rupee text-blue"
viewBox="0 0 16 16"> viewBox="0 0 16 16">
<path <path
d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"> d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z">
</path> </path>
</svg> </svg>
<span class="fs-7 mb-0 text-order-brown order_tax"></span> <span class="fs-7 mb-0 text-blue order_tax"></span>
</div> </div>
</div> </div>
<div class="row align-items-center"> <div class="row align-items-center">
@@ -94,7 +100,7 @@
<p class="fs-9 mb-0">Shipping Fee</p> <p class="fs-9 mb-0">Shipping Fee</p>
</div> </div>
<div class="col-6 text-end"> <div class="col-6 text-end">
<p class="fs-7 mb-0 text-order-brown">Free</p> <p class="fs-7 mb-0 text-blue">Free</p>
</div> </div>
</div> </div>
<div class="row align-items-center"> <div class="row align-items-center">