obanana_b2b_test/vendor-refund-history.php

990 lines
65 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?php
include "functions.php";
session_start();
$_SESSION["url"] = $_SERVER['REQUEST_URI'];
if ($_SESSION["userId"] <> "") {
$_SESSION["isLoggedIn"] = true;
$vendorLoginId = searchVendorbyLoginId($_SESSION["userId"]);
$vendorLoginIdjson = json_decode($vendorLoginId, true);
if (isset($vendorLoginIdjson['results'][0])) {
$vendorData = $vendorLoginIdjson['results'][0];
$vendorId = $vendorData['_id'];
$_SESSION["LoggedInVendorId"] = $vendorId;
}
} else {
$_SESSION["isLoggedIn"] = false;
header("location: login.php");
}
$products = productList();
$shopOrders = getOrderbyVendorId($vendorId);
$vendorOrderss = json_decode($shopOrders);
if (is_array($vendorOrderss)) {
$vendorOrders = json_decode($shopOrders);
} elseif (is_object($vendorOrderss) && property_exists($vendorOrderss, 'message')) {
$vendorOrders = [];
} else {
echo "Unknown type or no 'message' property found.";
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<title>oBanana B2B - Elevate Your Business</title>
<meta name="keywords" content="apparel, catalog, clean, ecommerce, ecommerce HTML, electronics, fashion, html eCommerce, html store, minimal, multipurpose, multipurpose ecommerce, online store, responsive ecommerce template, shops" />
<meta name="description" content="Best ecommerce html template for single and multi vendor store.">
<meta name="author" content="ashishmaraviya">
<!-- site Favicon -->
<link rel="icon" href="assets/images/favicon/favicon.png" sizes="32x32" />
<link rel="apple-touch-icon" href="assets/images/favicon/favicon.png" />
<meta name="msapplication-TileImage" content="assets/images/favicon/favicon.png" />
<!-- css Icon Font -->
<link rel="stylesheet" href="assets/css/vendor/ecicons.min.css" />
<!-- css All Plugins Files -->
<link rel="stylesheet" href="assets/css/plugins/animate.css" />
<link rel="stylesheet" href="assets/css/plugins/swiper-bundle.min.css" />
<link rel="stylesheet" href="assets/css/plugins/jquery-ui.min.css" />
<link rel="stylesheet" href="assets/css/plugins/countdownTimer.css" />
<link rel="stylesheet" href="assets/css/plugins/slick.min.css" />
<link rel="stylesheet" href="assets/css/plugins/bootstrap.css" />
<!-- Main Style -->
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="stylesheet" href="assets/css/style2.css" />
<link rel="stylesheet" href="assets/css/responsive.css" />
<!-- Background css -->
<link rel="stylesheet" id="bg-switcher-css" href="assets/css/backgrounds/bg-4.css">
<style>
.tab.active {
background-color: #3498db;
/* Set your desired background color for the active tab */
color: #ffffff;
/* Set your desired text color for the active tab */
}
</style>
<script>
function updateCartItemCount() {
$.get("cartitems.php?id=<?php echo $_SESSION['customerId']; ?>", function(data, status) {
if (data != "") {
console.log("Data: " + data + "\nStatus: " + status);
document.getElementById("cartItemCount").innerHTML = data;
}
});
}
</script>
</head>
<body onload="updateCartItemCount()" class="shop_page">
<div id="ec-overlay">
<div class="ec-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- Header start -->
<?php include "header.php" ?>
<!-- Header End -->
<!-- ekka Cart Start -->
<!-- ekka Cart End -->
<!-- Ec breadcrumb start -->
<div class="sticky-header-next-sec ec-breadcrumb section-space-mb">
<div class="container">
<div class="row">
<div class="col-12">
<div class="row ec_breadcrumb_inner">
<div class="col-md-6 col-sm-12">
<h2 class="ec-breadcrumb-title">User History</h2>
</div>
<div class="col-md-6 col-sm-12">
<!-- ec-breadcrumb-list start -->
<ul class="ec-breadcrumb-list">
<li class="ec-breadcrumb-item"><a href="index.php">Home</a></li>
<li class="ec-breadcrumb-item active">History</li>
</ul>
<!-- ec-breadcrumb-list end -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Ec breadcrumb end -->
<!-- User history section -->
<section class="ec-page-content ec-vendor-uploads ec-user-account section-space-p">
<div class="container">
<div class="row">
<!-- Sidebar Area Start -->
<div class="ec-shop-leftside ec-vendor-sidebar col-lg-3 col-md-12">
<div class="ec-sidebar-wrap ec-border-box">
<!-- Sidebar Category Block -->
<div class="ec-sidebar-block">
<div class="ec-vendor-block">
<div class="ec-vendor-block-items">
<ul>
<li><a href="vendor-dashboard.php">Dashboard</a></li>
<li><a onclick="addProduct();" href="">Upload Product</a></li>
<li><a href="vendor-settings.php">Settings (Edit)</a></li>
<li><a href="user-refund-history.php">User Refund History</a></li>
<!-- <li><a href="cart.html">Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="track-order.html">Track Order</a></li>
<li><a href="user-invoice.html">Invoice</a></li> -->
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="ec-shop-rightside col-lg-9 col-md-12">
<div class="ec-vendor-dashboard-card">
<div class="ec-vendor-card-header">
<h5>Refund History</h5>
<div class="ec-header-btn">
<a class="btn btn-lg btn-primary" href="#">Shop Now</a>
</div>
</div>
<div class="ec-vendor-card-body">
<div class="ec-vendor-card-table">
<div class="tab-container">
<div class="tab" data-tab-name="toApprove" onclick="showTab('toApprove')">To Approve</div>
<div class="tab" data-tab-name="toShip" onclick="showTab('toShip')">To Ship</div>
<div class="tab" data-tab-name="toReceive" onclick="showTab('toReceive')">To Receive</div>
<div class="tab" data-tab-name="toRefund" onclick="showTab('toRefund')">To Refund</div>
<div class="tab" data-tab-name="returnComplete" onclick="showTab('returnComplete')">Return Complete</div>
</div>
<div id="toApprove" class="tab-content active">
<!-- Content for "To Pay" tab -->
<table class="table ec-table">
<thead>
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
<th scope="col">Quantity</th>
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Refund Status</th>
<th scope="col">Refund Reason</th>
<th scope="col">Refund Proof</th>
<th scope="col">Date</th>
<th scope="col">Action</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
$order = $vendorOrders;
$orderArray = json_encode($order, true);
$orderItems = json_decode($orderArray, true);
foreach ($orderItems as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['return_order']['status']) && (strtoupper($order['return_order']['status']) === 'TO APPROVE') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<td><img class="prod-img" src="<?php echo $order['items'][0]['product']['product_image']; ?>" alt="product"></td>
<td><span><?php echo $order['items'][0]['product']['name']; ?></span></td>
<td><span><?php echo $order['items'][0]['quantity']; ?></span></td>
<td><span><?php echo $order['items'][0]['price']; ?></span></td>
<td><span><?php echo $order['total_amount'] ?></span></td>
<td><span><?php echo $order['return_order']['status']; ?></span></td>
<td><span><?php echo $order['return_order']['reason']; ?></span></td>
<td><img class="prod-img" src="<?php echo $order['return_order']['image']; ?>" alt="product"></td>
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<td>
<span class="tbl-btn">
<a class="btn btn-lg btn-primary" onclick="updateRefundShipStatus('<?php echo $order['_id']; ?>', '<?php echo $order['return_order']['image']; ?>', '<?php echo $order['return_order']['reason']; ?>')">Approve Refund</a>
</span>
</td>
<!-- <td><span class="tbl-btn"><a class="btn btn-lg btn-primary" href="#">View</a></span></td> -->
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
<div id="toShip" class="tab-content">
<!-- Content for "To Ship" tab -->
<table class="table ec-table">
<thead>
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
<th scope="col">Quantity</th>
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Refund Status</th>
<th scope="col">Refund Reason</th>
<th scope="col">Refund Proof</th>
<th scope="col">Date</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
$order = $vendorOrders;
$orderArray = json_encode($order, true);
$orderItems = json_decode($orderArray, true);
foreach ($orderItems as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['return_order']['status']) && (strtoupper($order['return_order']['status']) === 'TO SHIP') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<td><img class="prod-img" src="<?php echo $order['items'][0]['product']['product_image']; ?>" alt="product"></td>
<td><span><?php echo $order['items'][0]['product']['name']; ?></span></td>
<td><span><?php echo $order['items'][0]['quantity']; ?></span></td>
<td><span><?php echo $order['items'][0]['price']; ?></span></td>
<td><span><?php echo $order['total_amount'] ?></span></td>
<td><span><?php echo $order['return_order']['status']; ?></span></td>
<td><span><?php echo $order['return_order']['reason']; ?></span></td>
<td><img class="prod-img" src="<?php echo $order['return_order']['image']; ?>" alt="product"></td>
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<!-- <td><span class="tbl-btn"><a class="btn btn-lg btn-primary" href="#">View</a></span></td> -->
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
<div id="toReceive" class="tab-content">
<table class="table ec-table">
<thead>
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
<th scope="col">Quantity</th>
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Refund Status</th>
<th scope="col">Refund Reason</th>
<th scope="col">Refund Proof</th>
<th scope="col">Date</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<?php
$order = $vendorOrders;
$orderArray = json_encode($order, true);
$orderItems = json_decode($orderArray, true);
foreach ($orderItems as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['return_order']['status']) && (strtoupper($order['return_order']['status']) === 'TO RECEIVE') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<td><img class="prod-img" src="<?php echo $order['items'][0]['product']['product_image']; ?>" alt="product"></td>
<td><span><?php echo $order['items'][0]['product']['name']; ?></span></td>
<td><span><?php echo $order['items'][0]['quantity']; ?></span></td>
<td><span><?php echo $order['items'][0]['price']; ?></span></td>
<td><span><?php echo $order['total_amount'] ?></span></td>
<td><span><?php echo $order['return_order']['status']; ?></span></td>
<td><span><?php echo $order['return_order']['reason']; ?></span></td>
<td><img class="prod-img" src="<?php echo $order['return_order']['image']; ?>" alt="product"></td>
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<td>
<span class="tbl-btn">
<a class="btn btn-lg btn-primary" onclick="updateRefundReceiveStatus('<?php echo $order['_id']; ?>', '<?php echo $order['return_order']['image']; ?>', '<?php echo $order['return_order']['reason']; ?>')">Received</a>
</span>
</td>
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
<div id="toRefund" class="tab-content">
<table class="table ec-table">
<thead>
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
<th scope="col">Quantity</th>
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Refund Status</th>
<th scope="col">Refund Reason</th>
<th scope="col">Refund Proof</th>
<th scope="col">Date</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
$order = $vendorOrders;
$orderArray = json_encode($order, true);
$orderItems = json_decode($orderArray, true);
foreach ($orderItems as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['return_order']['status']) && (strtoupper($order['return_order']['status']) === 'TO REFUND') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<td><img class="prod-img" src="<?php echo $order['items'][0]['product']['product_image']; ?>" alt="product"></td>
<td><span><?php echo $order['items'][0]['product']['name']; ?></span></td>
<td><span><?php echo $order['items'][0]['quantity']; ?></span></td>
<td><span><?php echo $order['items'][0]['price']; ?></span></td>
<td><span><?php echo $order['total_amount'] ?></span></td>
<td><span><?php echo $order['return_order']['status']; ?></span></td>
<td><span><?php echo $order['return_order']['reason']; ?></span></td>
<td><img class="prod-img" src="<?php echo $order['return_order']['image']; ?>" alt="product"></td>
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<!-- <td>
<span class="tbl-btn">
<a class="btn btn-lg btn-primary" onclick="updateCompletedStatus('<?php echo $order['_id']; ?>')">Received</a>
</span>
</td> -->
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
<div id="returnComplete" class="tab-content">
<table class="table ec-table">
<thead>
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
<th scope="col">Quantity</th>
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Refund Status</th>
<th scope="col">Refund Reason</th>
<th scope="col">Refund Proof</th>
<th scope="col">Date</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
$order = $vendorOrders;
$orderArray = json_encode($order, true);
$orderItems = json_decode($orderArray, true);
foreach ($orderItems as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['return_order']['status']) && (strtoupper($order['return_order']['status']) === 'RETURN COMPLETE') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<td><img class="prod-img" src="<?php echo $order['items'][0]['product']['product_image']; ?>" alt="product"></td>
<td><span><?php echo $order['items'][0]['product']['name']; ?></span></td>
<td><span><?php echo $order['items'][0]['quantity']; ?></span></td>
<td><span><?php echo $order['items'][0]['price']; ?></span></td>
<td><span><?php echo $order['total_amount'] ?></span></td>
<td><span><?php echo $order['return_order']['status']; ?></span></td>
<td><span><?php echo $order['return_order']['reason']; ?></span></td>
<td><img class="prod-img" src="<?php echo $order['return_order']['image']; ?>" alt="product"></td>
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<!-- <td>
<span class="tbl-btn">
<a class="btn btn-lg btn-primary" data-bs-toggle="modal" data-bs-target="#modal-refund-<?php echo $order['_id']; ?>">Return/Refund</a>
</span>
</td> -->
<!-- <td><span class="tbl-btn"><a class="btn btn-lg btn-primary" href="#">View</a></span></td> -->
</tr>
<!-- <div class="modal fade" id="modal-refund-<?php echo $order['_id']; ?>" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header justify-content-end border-bottom-0">
<button type="button" class="btn-close-icon" data-bs-dismiss="modal" aria-label="Close">
<i class="mdi mdi-close"></i>
</button>
</div>
<div class="modal-body pt-0">
<form enctype="multipart/form-data" method="POST">
<div class="form-group">
<label for="reason-<?php echo $order['_id']; ?>">Reason:</label>
<input type="text" class="form-control" id="reason-<?php echo $order['_id']; ?>" name="reason" value="<?php echo $order['return_order']['reason']; ?>" placeholder="Enter your Reason">
</div>
<div class="form-group">
<label for="image-<?php echo $order['_id']; ?>">Upload Image:</label>
<div class="input-group">
<label for="image-<?php echo $order['_id']; ?>" class="custom-file-label">
<span class="mdi mdi-cloud-upload" style="font-size: 50px; margin-right:10px;"></span>
</label>
<input type="file" class="ec-image-upload" id="image-<?php echo $order['_id']; ?>" name="uploadedImage" accept="image/*" onchange="displaySelectedImage(this, '<?php echo $order['_id']; ?>')" style="display: none;">
<div id="image-preview-container-<?php echo $order['_id']; ?>"></div>
</div>
</div>
<button type="submit" class="btn btn-primary" id="submit-button-<?php echo $order['_id']; ?>">Submit</button>
</form>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font/css/materialdesignicons.min.css">
<script>
function displaySelectedImage(input, orderId) {
var previewContainer = document.getElementById('image-preview-container-' + orderId);
var file = input.files[0];
previewContainer.innerHTML = ''; // Clear the previous image
var reader = new FileReader();
reader.onload = function(e) {
var img = document.createElement('img');
img.src = e.target.result;
img.style.width = '80px'; // Set the width for a small square
img.style.height = '80px'; // Set the height for a small square
img.style.objectFit = 'cover';
previewContainer.appendChild(img);
};
reader.readAsDataURL(file);
}
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('submit-button-<?php echo $order['_id']; ?>').addEventListener('click', function(event) {
event.preventDefault();
// Get the order ID and reason
var orderId = '<?php echo $order['_id']; ?>';
var reason = document.getElementById('reason-' + orderId).value;
console.log('Order ID:', orderId);
console.log('Reason:', reason);
// Upload image
var formData = new FormData();
var file = document.getElementById('image-' + orderId).files[0];
// console.log(fileInput);
// var file = fileInput.files[0];
console.log(file);
if (file) {
formData.append('image_id', orderId);
formData.append('category', 'order');
formData.append('image', file);
console.log('FormData:', formData);
fetch('https://api.obanana.shop/api/v1/upload_image', {
method: 'POST',
body: formData
})
.then(response => {
if (response.ok) {
console.log('success')
return response.json();
} else {
console.error('File upload failed');
console.log('fail')
throw new Error('File upload failed');
}
})
.then(data => {
console.log('Upload response:', data);
// Update the order with the returned filename and other details
var imageUrl = 'https://api.obanana.shop/images/storage/product_uploads/' + data.filename;
var orderUpdate = {
return_order: {
reason: reason,
image: imageUrl,
status: 'To Approve',
},
};
fetch('https://api.obanana.shop/api/v1/orders/' + orderId, {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(orderUpdate),
})
.then(response => response.json())
.then(updatedOrder => {
// Handle the updated order response as needed
console.log('Order updated successfully:', updatedOrder);
})
.catch(error => {
console.error('Error updating order:', error);
});
})
.catch(error => {
console.error('Error uploading image:', error);
});
}
});
});
</script>
</div>
</div>
</div>
</div> -->
<?php
}
}
?>
</tbody>
</table>
</div>
<script>
var sessionToken = '<?php echo isset($_SESSION["token"]) ? $_SESSION["token"] : ""; ?>';
var email = '<?php echo isset($_SESSION["email"]) ? $_SESSION["email"] : ""; ?>';
var password = '<?php echo isset($_SESSION["password"]) ? $_SESSION["password"] : ""; ?>';
function login(username, password, callback) {
fetch("https://api.obanana.shop/api/v1/login", {
method: "POST",
headers: {
"Content-Type": "application/json",
"X-Api-Key": "{{apiKey}}"
},
body: JSON.stringify({
username: username,
password: password
})
})
.then(response => {
if (response.ok) {
return response.json();
} else {
throw new Error("Unable to login");
}
})
.then(data => {
// Update the session token on the server side
fetch("update-token-session.php", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
token: data.token
})
})
.then(response => response.json())
.then(result => {
if (result.status === 'success') {
// Update the session token in the client-side variable
sessionToken = data.token;
console.log("New Token:", sessionToken);
callback();
} else {
throw new Error("Unable to update session token");
}
});
})
.catch(error => {
console.error("Error:", error.message);
});
}
document.addEventListener("DOMContentLoaded", function() {
// Check if there's an activeTab in local storage
var activeTab = localStorage.getItem('activeTab');
if (activeTab) {
showTab(activeTab);
}
});
function showTab(tabName) {
// Hide all tab contents
var tabContents = document.getElementsByClassName('tab-content');
for (var i = 0; i < tabContents.length; i++) {
tabContents[i].classList.remove('active');
}
// Remove the 'active' class from all tabs
var tabs = document.getElementsByClassName('tab');
for (var i = 0; i < tabs.length; i++) {
tabs[i].classList.remove('active');
}
// Show the selected tab content
document.getElementById(tabName).classList.add('active');
// Add the 'active' class to the clicked tab
document.querySelector(`.tab[data-tab-name="${tabName}"]`).classList.add('active');
// Save the active tab to local storage
localStorage.setItem('activeTab', tabName);
}
function updateRefundShipStatus(orderId, image, reason) {
login(email, password, function() {
fetch(`https://api.obanana.shop/api/v1/orders/${orderId}`, {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + sessionToken,
},
body: JSON.stringify({
return_order: {
reason: reason,
image: image,
status: 'To Ship',
}
}),
})
.then(response => response.json())
.then(data => {
// Assuming the server responds with a JSON object indicating success or failure
if (data && data !== "") {
// Update the status in the table without reloading the page
// document.querySelector(`[data-order-id="${orderId}"] .order-status`).innerText = 'COMPLETED';
// location.reload();
} else {
alert('Failed to update order status');
}
})
.catch(error => {
console.error('Error:', error);
alert('An error occurred while updating order status');
});
})
}
function updateRefundReceiveStatus(orderId, image, reason) {
login(email, password, function() {
fetch(`https://api.obanana.shop/api/v1/orders/${orderId}`, {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + sessionToken,
},
body: JSON.stringify({
return_order: {
reason: reason,
image: image,
status: 'To Refund',
}
}),
})
.then(response => response.json())
.then(data => {
// Assuming the server responds with a JSON object indicating success or failure
if (data && data !== "") {
// Update the status in the table without reloading the page
// document.querySelector(`[data-order-id="${orderId}"] .order-status`).innerText = 'COMPLETED';
location.reload();
} else {
alert('Failed to update order status');
}
})
.catch(error => {
console.error('Error:', error);
alert('An error occurred while updating order status');
});
})
}
</script>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End User history section -->
<!-- Footer Start -->
<?php include "footer.php" ?>
<!-- Footer Area End -->
<!-- Footer navigation panel for responsive display -->
<div class="ec-nav-toolbar">
<div class="container">
<div class="ec-nav-panel">
<div class="ec-nav-panel-icons">
<a href="#ec-mobile-menu" class="navbar-toggler-btn ec-header-btn ec-side-toggle"><i class="fi-rr-menu-burger"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="#ec-side-cart" class="toggle-cart ec-header-btn ec-side-toggle"><i class="fi-rr-shopping-bag"></i><span class="ec-cart-noti ec-header-count cart-count-lable">3</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="index.php" class="ec-header-btn"><i class="fi-rr-home"></i></a>
</div>
<div class="ec-nav-panel-icons">
<a href="wishlist.html" class="ec-header-btn"><i class="fi-rr-heart"></i><span class="ec-cart-noti">4</span></a>
</div>
<div class="ec-nav-panel-icons">
<a href="login.php" class="ec-header-btn"><i class="fi-rr-user"></i></a>
</div>
</div>
</div>
</div>
<!-- Footer navigation panel for responsive display end -->
<!-- Recent Purchase Popup -->
<div class="recent-purchase">
<img src="assets/images/product-image/1.jpg" alt="payment image">
<div class="detail">
<p>Someone in new just bought</p>
<h6>stylish baby shoes</h6>
<p>10 Minutes ago</p>
</div>
<a href="javascript:void(0)" class="icon-btn recent-close">×</a>
</div>
<!-- Recent Purchase Popup end -->
<!-- Cart Floating Button -->
<div class="ec-cart-float">
<a href="#ec-side-cart" class="ec-header-btn ec-side-toggle">
<div class="header-icon"><i class="fi-rr-shopping-basket"></i>
</div>
<span class="ec-cart-count cart-count-lable">3</span>
</a>
</div>
<!-- Cart Floating Button end -->
<!-- Whatsapp -->
<div class="ec-style ec-right-bottom">
<!-- Start Floating Panel Container -->
<div class="ec-panel">
<!-- Panel Header -->
<div class="ec-header">
<strong>Need Help?</strong>
<p>Chat with us on WhatsApp</p>
</div>
<!-- Panel Content -->
<div class="ec-body">
<ul>
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_01.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Sahar Darya</span>
<p>Sahar left 7 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_02.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-online"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Yolduz Rafi</span>
<p>Yolduz is online</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_03.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-offline"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Nargis Hawa</span>
<p>Nargis left 30 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
<!-- Start Single Contact List -->
<li>
<a class="ec-list" data-number="918866774266" data-message="Please help me! I have got wrong product - ORDER ID is : #654321485">
<div class="d-flex bd-highlight">
<!-- Profile Picture -->
<div class="ec-img-cont">
<img src="assets/images/whatsapp/profile_04.jpg" class="ec-user-img" alt="Profile image">
<span class="ec-status-icon ec-offline"></span>
</div>
<!-- Display Name & Last Seen -->
<div class="ec-user-info">
<span>Khadija Mehr</span>
<p>Khadija left 50 mins ago</p>
</div>
<!-- Chat iCon -->
<div class="ec-chat-icon">
<i class="fa fa-whatsapp"></i>
</div>
</div>
</a>
</li>
<!--/ End Single Contact List -->
</ul>
</div>
</div>
<!--/ End Floating Panel Container -->
<!-- Start Right Floating Button-->
<div class="ec-right-bottom">
<div class="ec-box">
<div class="ec-button rotateBackward">
<img class="whatsapp" src="assets/images/common/whatsapp.png" alt="whatsapp icon" />
</div>
</div>
</div>
<!--/ End Right Floating Button-->
</div>
<!-- Whatsapp end -->
<!-- Feature tools -->
<div class="ec-tools-sidebar-overlay"></div>
<div class="ec-tools-sidebar">
<div class="tool-title">
<h3>Features</h3>
</div>
<a href="#" class="ec-tools-sidebar-toggle in-out">
<img alt="icon" src="assets/images/common/settings.png" />
</a>
<div class="ec-tools-detail">
<div class="ec-tools-sidebar-content ec-change-color ec-color-desc">
<h3>Color Scheme</h3>
<ul class="bg-panel">
<li class="active" data-color="01"><a href="#" class="colorcode1"></a></li>
<li data-color="02"><a href="#" class="colorcode2"></a></li>
<li data-color="03"><a href="#" class="colorcode3"></a></li>
<li data-color="04"><a href="#" class="colorcode4"></a></li>
<li data-color="05"><a href="#" class="colorcode5"></a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Backgrounds</h3>
<ul class="bg-panel">
<li class="bg"><a class="back-bg-1" id="bg-1">Background-1</a></li>
<li class="bg"><a class="back-bg-2" id="bg-2">Background-2</a></li>
<li class="bg"><a class="back-bg-3" id="bg-3">Background-3</a></li>
<li class="bg"><a class="back-bg-4" id="bg-4">Default</a></li>
</ul>
</div>
<div class="ec-tools-sidebar-content">
<h3>Full Screen mode</h3>
<div class="ec-fullscreen-mode">
<div class="ec-fullscreen-switch">
<div class="ec-fullscreen-btn">Mode</div>
<div class="ec-fullscreen-on">On</div>
<div class="ec-fullscreen-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Dark mode</h3>
<div class="ec-change-mode">
<div class="ec-mode-switch">
<div class="ec-mode-btn">Mode</div>
<div class="ec-mode-on">On</div>
<div class="ec-mode-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>RTL mode</h3>
<div class="ec-change-rtl">
<div class="ec-rtl-switch">
<div class="ec-rtl-btn">Rtl</div>
<div class="ec-rtl-on">On</div>
<div class="ec-rtl-off">Off</div>
</div>
</div>
</div>
<div class="ec-tools-sidebar-content">
<h3>Clear local storage</h3>
<a class="clear-cach" href="javascript:void(0)">Clear Cache & Default</a>
</div>
</div>
</div>
<!-- Feature tools end -->
<!-- Vendor JS -->
<script src="assets/js/vendor/jquery-3.5.1.min.js"></script>
<script src="assets/js/vendor/popper.min.js"></script>
<script src="assets/js/vendor/bootstrap.min.js"></script>
<script src="assets/js/vendor/jquery-migrate-3.3.0.min.js"></script>
<script src="assets/js/vendor/modernizr-3.11.2.min.js"></script>
<!--Plugins JS-->
<script src="assets/js/plugins/swiper-bundle.min.js"></script>
<script src="assets/js/plugins/countdownTimer.min.js"></script>
<script src="assets/js/plugins/scrollup.js"></script>
<script src="assets/js/plugins/jquery.zoom.min.js"></script>
<script src="assets/js/plugins/slick.min.js"></script>
<script src="assets/js/plugins/infiniteslidev2.js"></script>
<script src="assets/js/vendor/jquery.magnific-popup.min.js"></script>
<script src="assets/js/plugins/jquery.sticky-sidebar.js"></script>
<script src="assets/js/plugins/nouislider.js"></script>
<!-- Main Js -->
<script src="assets/js/vendor/index.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>