Added all order tab on customer purchase history

This commit is contained in:
Stacy 2024-03-20 13:54:50 +08:00
parent 25bb47e57e
commit 877e2c6a81
7 changed files with 986 additions and 1287 deletions

561
admin/header.php Normal file
View File

@ -0,0 +1,561 @@
<!-- 03-13-2024 Stacy separated header -->
<!-- Header -->
<header class="ec-main-header" id="header">
<nav class="navbar navbar-static-top navbar-expand-lg">
<!-- Sidebar toggle button -->
<button id="sidebar-toggler" class="sidebar-toggle"></button>
<!-- search form -->
<!-- 03-07-2024 Stacy & Raymart modified this block of code -->
<div class="search-form d-lg-inline-block">
<form method="POST" action="vendor-card-action.php">
<div class="input-group">
<input type="text" name="search" id="search-input" class="form-control" placeholder="search.." autofocus autocomplete="off" />
<button class="submit" type="submit" id="search-btn" class="btn btn-flat">
<i class="mdi mdi-magnify" style="font-size:20px; color:gray; padding-right:8px;"></i>
</button>
</div>
</form>
<div id="search-results-container">
<ul id="search-results"></ul>
</div>
</div>
<!-- 03-07-2024 Stacy & Raymart modified this block of code -->
<!-- navbar right -->
<div class="navbar-right">
<ul class="nav navbar-nav">
<!-- User Account -->
<li class="dropdown user-menu">
<button class="dropdown-toggle nav-link ec-drop" data-bs-toggle="dropdown" aria-expanded="false">
<img src="assets/img/user/user.png" class="user-image" alt="User Image" />
</button>
<ul class="dropdown-menu dropdown-menu-right ec-dropdown-menu">
<!-- User image -->
<li class="dropdown-header">
<img src="assets/img/user/user.png" class="img-circle" alt="User Image" />
<div class="d-inline-block">
John Deo <small class="pt-1">john.example@gmail.com</small>
</div>
</li>
<li>
<a href="user-profile.html">
<i class="mdi mdi-account"></i> My Profile
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-email"></i> Message
</a>
</li>
<li>
<a href="#"> <i class="mdi mdi-diamond-stone"></i> Projects </a>
</li>
<li class="right-sidebar-in">
<a href="javascript:0"> <i class="mdi mdi-settings-outline"></i> Setting </a>
</li>
<li class="dropdown-footer">
<a href="/logout.php"> <i class="mdi mdi-logout"></i> Log Out </a>
</li>
</ul>
</li>
<li class="dropdown notifications-menu custom-dropdown">
<button class="dropdown-toggle notify-toggler custom-dropdown-toggler">
<i class="mdi mdi-bell-outline"></i>
</button>
<div class="card card-default dropdown-notify dropdown-menu-right mb-0">
<div class="card-header card-header-border-bottom px-3">
<h2>Notifications</h2>
</div>
<div class="card-body px-0 py-0">
<ul class="nav nav-tabs nav-style-border p-0 justify-content-between" id="myTab" role="tablist">
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link active pb-3" id="home2-tab" data-bs-toggle="tab" data-bs-target="#home2" role="tab" aria-controls="home2" aria-selected="true">All (10)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="profile2-tab" data-bs-toggle="tab" data-bs-target="#profile2" role="tab" aria-controls="profile2" aria-selected="false">Msgs (5)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="contact2-tab" data-bs-toggle="tab" data-bs-target="#contact2" role="tab" aria-controls="contact2" aria-selected="false">Others (5)</a>
</li>
</ul>
<div class="tab-content" id="myTabContent3">
<div class="tab-pane fade show active" id="home2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Nitin</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg" alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Lovina</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Crinali</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification event-active">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Yearly Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span class="my-1 btn btn-sm btn-success">Accept</span>
<span class="my-1 btn btn-sm btn-secondary">Delete</span>
<span class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="profile2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u6.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Hardiko</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u7.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browin</h4>
<p class="last-msg">Nam ut nisi erat. Ut quis tortor
varius, hendrerit arcu quis, congue nisl. In
scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg" alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">jenelia</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Bhavlio</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browini</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="contact2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification event-active">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span class="my-1 btn btn-sm btn-success">Accept</span>
<span class="my-1 btn btn-sm btn-secondary">Delete</span>
<span class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<ul class="dropdown-menu dropdown-menu-right d-none">
<li class="dropdown-header">You have 5 notifications</li>
<li>
<a href="#">
<i class="mdi mdi-account-plus"></i> New user registered
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-remove"></i> User deleted
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 07 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-chart-areaspline"></i> Sales report is ready
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 12 PM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-supervisor"></i> New client
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-server-network-off"></i> Server overloaded
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 05 AM</span>
</a>
</li>
<li class="dropdown-footer">
<a class="text-center" href="#"> View All </a>
</li>
</ul>
</li>
<li class="right-sidebar-in right-sidebar-2-menu">
<i class="mdi mdi-settings-outline mdi-spin"></i>
</li>
</ul>
</div>
</nav>
</header>

View File

@ -83,560 +83,8 @@ $users = getUsers();
<!-- PAGE WRAPPER -->
<div class="ec-page-wrapper">
<!-- Header -->
<header class="ec-main-header" id="header">
<nav class="navbar navbar-static-top navbar-expand-lg">
<!-- Sidebar toggle button -->
<button id="sidebar-toggler" class="sidebar-toggle"></button>
<!-- search form -->
<div class="search-form d-lg-inline-block">
<div class="input-group">
<input type="text" name="query" id="search-input" class="form-control" placeholder="search.." autofocus autocomplete="off" />
<button type="button" name="search" id="search-btn" class="btn btn-flat">
<i class="mdi mdi-magnify"></i>
</button>
</div>
<div id="search-results-container">
<ul id="search-results"></ul>
</div>
</div>
<!-- navbar right -->
<div class="navbar-right">
<ul class="nav navbar-nav">
<!-- User Account -->
<li class="dropdown user-menu">
<button class="dropdown-toggle nav-link ec-drop" data-bs-toggle="dropdown" aria-expanded="false">
<img src="assets/img/user/user.png" class="user-image" alt="User Image" />
</button>
<ul class="dropdown-menu dropdown-menu-right ec-dropdown-menu">
<!-- User image -->
<li class="dropdown-header">
<img src="assets/img/user/user.png" class="img-circle" alt="User Image" />
<div class="d-inline-block">
John Deo <small class="pt-1">john.example@gmail.com</small>
</div>
</li>
<li>
<a href="user-profile.html">
<i class="mdi mdi-account"></i> My Profile
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-email"></i> Message
</a>
</li>
<li>
<a href="#"> <i class="mdi mdi-diamond-stone"></i> Projects </a>
</li>
<li class="right-sidebar-in">
<a href="javascript:0"> <i class="mdi mdi-settings-outline"></i> Setting </a>
</li>
<li class="dropdown-footer">
<a href="index.php"> <i class="mdi mdi-logout"></i> Log Out </a>
</li>
</ul>
</li>
<li class="dropdown notifications-menu custom-dropdown">
<button class="dropdown-toggle notify-toggler custom-dropdown-toggler">
<i class="mdi mdi-bell-outline"></i>
</button>
<div class="card card-default dropdown-notify dropdown-menu-right mb-0">
<div class="card-header card-header-border-bottom px-3">
<h2>Notifications</h2>
</div>
<div class="card-body px-0 py-0">
<ul class="nav nav-tabs nav-style-border p-0 justify-content-between" id="myTab" role="tablist">
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link active pb-3" id="home2-tab" data-bs-toggle="tab" data-bs-target="#home2" role="tab" aria-controls="home2" aria-selected="true">All (10)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="profile2-tab" data-bs-toggle="tab" data-bs-target="#profile2" role="tab" aria-controls="profile2" aria-selected="false">Msgs (5)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="contact2-tab" data-bs-toggle="tab" data-bs-target="#contact2" role="tab" aria-controls="contact2" aria-selected="false">Others (5)</a>
</li>
</ul>
<div class="tab-content" id="myTabContent3">
<div class="tab-pane fade show active" id="home2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Nitin</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg" alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Lovina</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Crinali</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification event-active">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Yearly Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span class="my-1 btn btn-sm btn-success">Accept</span>
<span class="my-1 btn btn-sm btn-secondary">Delete</span>
<span class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="profile2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u6.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Hardiko</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u7.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browin</h4>
<p class="last-msg">Nam ut nisi erat. Ut quis tortor
varius, hendrerit arcu quis, congue nisl. In
scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg" alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">jenelia</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Bhavlio</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg" alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browini</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="contact2" role="tabpanel">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)" class="media media-message media-notification event-active">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span class="my-1 btn btn-sm btn-success">Accept</span>
<span class="my-1 btn btn-sm btn-secondary">Delete</span>
<span class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)" class="media media-message media-notification">
<div class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<ul class="dropdown-menu dropdown-menu-right d-none">
<li class="dropdown-header">You have 5 notifications</li>
<li>
<a href="#">
<i class="mdi mdi-account-plus"></i> New user registered
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-remove"></i> User deleted
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 07 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-chart-areaspline"></i> Sales report is ready
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 12 PM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-supervisor"></i> New client
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-server-network-off"></i> Server overloaded
<span class=" font-size-12 d-inline-block float-right"><i class="mdi mdi-clock-outline"></i> 05 AM</span>
</a>
</li>
<li class="dropdown-footer">
<a class="text-center" href="#"> View All </a>
</li>
</ul>
</li>
<li class="right-sidebar-in right-sidebar-2-menu">
<i class="mdi mdi-settings-outline mdi-spin"></i>
</li>
</ul>
</div>
</nav>
</header>
<!-- HEADER -->
<?php include 'header.php' ?>
<!-- CONTENT WRAPPER -->
<div class="ec-content-wrapper ec-ec-content-wrapper mb-m-24px">

View File

@ -68,636 +68,7 @@ $array = json_decode($vendor,true);
<div class="ec-page-wrapper">
<!-- Header -->
<header class="ec-main-header" id="header">
<nav class="navbar navbar-static-top navbar-expand-lg">
<!-- Sidebar toggle button -->
<button id="sidebar-toggler" class="sidebar-toggle"></button>
<!-- search form -->
<div class="search-form d-lg-inline-block">
<div class="input-group">
<input type="text" name="query" id="search-input" class="form-control"
placeholder="search.." autofocus autocomplete="off" />
<button type="button" name="search" id="search-btn" class="btn btn-flat">
<i class="mdi mdi-magnify"></i>
</button>
</div>
<div id="search-results-container">
<ul id="search-results"></ul>
</div>
</div>
<!-- navbar right -->
<div class="navbar-right">
<ul class="nav navbar-nav">
<!-- User Account -->
<li class="dropdown user-menu">
<button class="dropdown-toggle nav-link ec-drop" data-bs-toggle="dropdown"
aria-expanded="false">
<img src="assets/img/user/user.png" class="user-image" alt="User Image" />
</button>
<ul class="dropdown-menu dropdown-menu-right ec-dropdown-menu">
<!-- User image -->
<li class="dropdown-header">
<img src="assets/img/user/user.png" class="img-circle" alt="User Image" />
<div class="d-inline-block">
John Deo <small class="pt-1">john.example@gmail.com</small>
</div>
</li>
<li>
<a href="user-profile.html">
<i class="mdi mdi-account"></i> My Profile
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-email"></i> Message
</a>
</li>
<li>
<a href="#"> <i class="mdi mdi-diamond-stone"></i> Projects </a>
</li>
<li class="right-sidebar-in">
<a href="javascript:0"> <i class="mdi mdi-settings-outline"></i> Setting </a>
</li>
<li class="dropdown-footer">
<a href="/logout.php"> <i class="mdi mdi-logout"></i> Log Out </a>
</li>
</ul>
</li>
<li class="dropdown notifications-menu custom-dropdown">
<button class="dropdown-toggle notify-toggler custom-dropdown-toggler">
<i class="mdi mdi-bell-outline"></i>
</button>
<div class="card card-default dropdown-notify dropdown-menu-right mb-0">
<div class="card-header card-header-border-bottom px-3">
<h2>Notifications</h2>
</div>
<div class="card-body px-0 py-0">
<ul class="nav nav-tabs nav-style-border p-0 justify-content-between" id="myNotificationTab"
role="tablist">
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link active pb-3" id="home2-tab"
data-bs-toggle="tab" data-bs-target="#home2" role="tab"
aria-controls="home2" aria-selected="true">All (10)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="profile2-tab" data-bs-toggle="tab"
data-bs-target="#profile2" role="tab" aria-controls="profile2"
aria-selected="false">Msgs (5)</a>
</li>
<li class="nav-item mx-3 my-0 py-0">
<a href="#" class="nav-link pb-3" id="contact2-tab" data-bs-toggle="tab"
data-bs-target="#contact2" role="tab" aria-controls="contact2"
aria-selected="false">Others (5)</a>
</li>
</ul>
<div class="tab-content" id="myTabContent3">
<div class="tab-pane fade show active" id="home2" role="tabpanel"
aria-labelledby="home2-tab">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Nitin</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg"
alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Lovina</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span
class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Crinali</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification event-active">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Yearly Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i
class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span
class="my-1 btn btn-sm btn-success">Accept</span>
<span
class="my-1 btn btn-sm btn-secondary">Delete</span>
<span
class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="profile2" role="tabpanel"
aria-labelledby="profile2-tab">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u6.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Hardiko</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u7.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browin</h4>
<p class="last-msg">Nam ut nisi erat. Ut quis tortor
varius, hendrerit arcu quis, congue nisl. In
scelerisque, sem ut ve.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification media-active">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u1.jpg"
alt="Image">
<span class="status active"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">jenelia</h4>
<p class="last-msg">Donec mattis augue a nisl
consequat, nec imperdiet ex rutrum. Fusce et
vehicula enim. Sed in enim eu odio vehic.</p>
<span
class="font-size-12 font-weight-medium text-white">
<i class="mdi mdi-clock-outline"></i> Just
now...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u2.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Bhavlio</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div class="position-relative mr-3">
<img class="rounded-circle" src="assets/img/user/u5.jpg"
alt="Image">
<span class="status away"></span>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Browini</h4>
<p class="last-msg">Lorem ipsum dolor sit, amet
consectetur adipisicing elit. Nam itaque
doloremque odio, eligendi delectus vitae.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
<div class="tab-pane fade" id="contact2" role="tabpanel"
aria-labelledby="contact2-tab">
<ul class="list-unstyled" data-simplebar style="height: 360px">
<li>
<a href="javscript:void(0)"
class="media media-message media-notification event-active">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-info text-white">
<i class="mdi mdi-calendar-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Upcomming event added</h4>
<p class="last-msg font-size-14">03/Jan/2020 (1pm -
2pm)</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 10 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-warning text-white">
<i class="mdi mdi-chart-areaspline font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Sales report</h4>
<p class="last-msg font-size-14">Lorem ipsum dolor
sit, amet consectetur adipisicing elit. Nam
itaque doloremque odio, eligendi delectus vitae.
</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 1 hrs
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-primary text-white">
<i
class="mdi mdi-account-multiple-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Request</h4>
<p class="last-msg font-size-14">Add Dany Jones as
your contact consequat nec imperdiet ex rutrum.
Fusce et vehicula enim. Sed in enim.</p>
<span
class="my-1 btn btn-sm btn-success">Accept</span>
<span
class="my-1 btn btn-sm btn-secondary">Delete</span>
<span
class="font-size-12 font-weight-medium text-secondary d-block">
<i class="mdi mdi-clock-outline"></i> 5 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-danger text-white">
<i class="mdi mdi-server-network-off font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">Server overloaded</h4>
<p class="last-msg font-size-14">Donec mattis augue
a nisl consequat, nec imperdiet ex rutrum. Fusce
et vehicula enim. Sed in enim eu odio vehic.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 30 min
ago...
</span>
</div>
</div>
</a>
</li>
<li>
<a href="javscript:void(0)"
class="media media-message media-notification">
<div
class="d-flex rounded-circle align-items-center justify-content-center mr-3 media-icon iconbox-45 bg-purple text-white">
<i class="mdi mdi-playlist-check font-size-20"></i>
</div>
<div class="media-body d-flex justify-content-between">
<div class="message-contents">
<h4 class="title">New Task complete</h4>
<p class="last-msg font-size-14">Nam ut nisi erat.
Ut quis tortor varius, hendrerit arcu quis,
congue nisl. In scelerisque, sem ut ve.</p>
<span
class="font-size-12 font-weight-medium text-secondary">
<i class="mdi mdi-clock-outline"></i> 2 hrs
ago...
</span>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<ul class="dropdown-menu dropdown-menu-right d-none">
<li class="dropdown-header">You have 5 notifications</li>
<li>
<a href="#">
<i class="mdi mdi-account-plus"></i> New user registered
<span class=" font-size-12 d-inline-block float-right"><i
class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-remove"></i> User deleted
<span class=" font-size-12 d-inline-block float-right"><i
class="mdi mdi-clock-outline"></i> 07 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-chart-areaspline"></i> Sales report is ready
<span class=" font-size-12 d-inline-block float-right"><i
class="mdi mdi-clock-outline"></i> 12 PM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-account-supervisor"></i> New client
<span class=" font-size-12 d-inline-block float-right"><i
class="mdi mdi-clock-outline"></i> 10 AM</span>
</a>
</li>
<li>
<a href="#">
<i class="mdi mdi-server-network-off"></i> Server overloaded
<span class=" font-size-12 d-inline-block float-right"><i
class="mdi mdi-clock-outline"></i> 05 AM</span>
</a>
</li>
<li class="dropdown-footer">
<a class="text-center" href="#"> View All </a>
</li>
</ul>
</li>
<li class="right-sidebar-in right-sidebar-2-menu">
<i class="mdi mdi-settings-outline mdi-spin"></i>
</li>
</ul>
</div>
</nav>
</header>
<?php include 'header.php' ?>
<!-- CONTENT WRAPPER -->
<div class="ec-content-wrapper">

View File

@ -505,7 +505,7 @@ if (isset($_GET['id'])) {
echo '" id="qty-input" />';
echo '<div class="qty-btn" style="color:#ffaa00; font-size:25px; padding-left:5px; cursor: pointer;" onclick="increment()">+</div>';
// echo '<div id="addToCartMessage" style="border:1px solid red;"></div>';
echo '<div> <div id="addToCartMessage" style="padding-left:45px;"></div> <button class="btn btn-primary" id="addToCartButton" style="background:#ffaa00; margin-left:55px;"><i class="fi-rr-shopping-bag" style="font-size:20px; margin-bottom:-3px; margin-right:10px;"></i>Add To Cart</button></div>';
echo '<div> <div id="addToCartMessage" style="padding-left:45px;"></div> <button class="btn btn-primary" id="addToCartButton" style="text-wrap:nowrap; background:#ffaa00; margin-left:55px;"><i class="fi-rr-shopping-bag" style="font-size:20px; margin-bottom:-3px; margin-right:10px;"></i>Add To Cart</button></div>';
echo '<div class="ec-single-wishlist">
<a class="ec-btn-group wishlist" title="Wishlist" onclick="wishlist()"><i class="fi fi-rr-heart" style="color:#B80F0A; font-size:20px;"></i></a>
</div>';

View File

@ -38,6 +38,9 @@ if ($_SESSION["userId"] <> "") {
<link rel="stylesheet" href="assets/css/plugins/slick.min.css" />
<link rel="stylesheet" href="assets/css/plugins/bootstrap.css" />
<!-- FLATICON -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet">
<!-- Main Style -->
<link rel="stylesheet" href="assets/css/style.css" />
<link rel="stylesheet" href="assets/css/style2.css" />
@ -45,15 +48,58 @@ if ($_SESSION["userId"] <> "") {
<!-- Background css -->
<link rel="stylesheet" id="bg-switcher-css" href="assets/css/backgrounds/bg-4.css">
<style>
.tab.active {
background-color: #3498db;
background-color: #ffffff;
/* Set your desired background color for the active tab */
color: #ffffff;
color: #ffaa00;
/* Set your desired text color for the active tab */
border: 1px solid #ffaa00
/* Set your desired border color for the active tab */
}
.tab {
background-color: #ffaa00;
color: #ffffff;
font-family: "Poppins, sans-serif";
font-weight: 400;
/* margin: 2px; */
text-align: center;
margin-right: -25px;
}
.tab i {
font-size: 15px;
/* padding-left: 3px; */
}
.tableView:hover {
background-color: #f5f5f5;
}
.tab-content {
border: none;
}
.theadTitle {
background-color: #dddddd;
padding-top: -50px;
}
@media only screen and (max-width: 640px) {
#tableTitle {
font-size: 14px;
}
#shopNow {
font-size: 12px;
}
}
@media only screen and (max-width: 460px) {
#tableTitle {
font-size: 12px;
}
#shopNow {
font-size: 10px;
}
}
</style>
<script>
function updateCartItemCount() {
$.get("cartitems.php?id=<?php echo $_SESSION['customerId']; ?>", function(data, status) {
@ -134,33 +180,76 @@ if ($_SESSION["userId"] <> "") {
<img class="v-img" src="assets/images/user/1.jpg" alt="vendor image">
<h5>Mariana Johns</h5>
</div> -->
<!-- 03-14-2024 Stacy added customer image -->
<div class="ec-vendor-block-bg" style="background-color: orange; background-image: url(<?php echo $customer_data['customer_banner'] ?>) !important;">
</div>
<div class="ec-vendor-block-detail">
<?php
$customer_image = isset($customer_data[0]['customer_image']) ? $customer_data[0]['customer_image'] : 'https://yourteachingmentor.com/wp-content/uploads/2020/12/istockphoto-1223671392-612x612-1.jpg';
?>
<img class="v-img" src=<?php echo $customer_image ?> alt="vendor image">
</div>
<?php include 'user-profile-tabs.php' ?>
</div>
</div>
</div>
</div>
<div class="ec-shop-rightside col-lg-9 col-md-12">
<!-- 03-14-2024 Stacy added cards -->
<div class="row" id="rowTabs" style="justify-content:center; padding-bottom:20px; padding-right:20px; display:flex; align-items:center; text-align:center;">
<div id="tableTabs" class="col-lg-3 col-md-6" style="width:8rem;">
<div class="tab h-40" data-tab-name="allOrders" onclick="showTab('allOrders'), document.getElementById('tableTitle').innerHTML = 'All Order History'">All Orders
<i class="fa-solid fa-cubes"></i>
</div>
</div>
<div id="tableTabs" class="col-lg-3 col-md-6" style="width:8rem;">
<div class="tab h-40" data-tab-name="toPay" onclick="showTab('toPay'), document.getElementById('tableTitle').innerHTML = 'All To Pay Products'">To Pay
<i class="fa-solid fa-money-bill-1-wave"></i>
</div>
</div>
<div id="tableTabs" class="col-lg-3 col-md-6" style="width:8rem;">
<div class="tab h-40" data-tab-name="toShip" onclick="showTab('toShip'), document.getElementById('tableTitle').innerHTML = 'All To Ship Products'">To Ship
<i class="fa-solid fa-truck"></i>
</div>
</div>
<div id="tableTabs" class="col-lg-3 col-md-6" style="width:8rem;">
<div class="tab h-40" data-tab-name="toReceive" onclick="showTab('toReceive'), document.getElementById('tableTitle').innerHTML = 'All To Receive Products'">To Receive
<i class="fa-solid fa-box-archive"></i>
</div>
</div>
<div id="tableTabs" class="col-lg-3 col-md-6" style="width:8rem;">
<div class="tab h-40" data-tab-name="completed" onclick="showTab('completed'), document.getElementById('tableTitle').innerHTML = 'All Completed Purchase'">Completed
<i class="fa-solid fa-square-check"></i>
</div>
</div>
</div>
<div class="ec-vendor-dashboard-card">
<div class="ec-vendor-card-header">
<h5>Product History</h5>
<div class="ec-header-btn">
<a class="btn btn-lg btn-primary" href="#">Shop Now</a>
<h5 id="tableTitle">All Order History</h5>
<!-- <div class="ec-header-btn" style="border:1px solid red; padding-right:-50px;">
<a class="btn btn-lg btn-primary" style="background:none; color:#3474d4;" href="#">View All</a>
</div> -->
<div class="ec-header-btn" id="tableTitle">
<!-- <a class="btn btn-lg btn-primary" style="background:none; color:#3474d4;" href="#">View All</a> -->
<a class="btn btn-lg btn-primary" id="shopNow" style="background:none; color:#3474d4;" href="index.php">Shop Now</a>
</div>
</div>
<div class="ec-vendor-card-body">
<div class="ec-vendor-card-table">
<div class="tab-container">
<!-- <div class="tab-container">
<div class="tab" data-tab-name="toPay" onclick="showTab('toPay')">To Pay</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="completed" onclick="showTab('completed')">Completed</div>
</div> -->
</div>
<div id="toPay" class="tab-content active">
<!-- Content for "To Pay" tab -->
<!-- 03-15-2024 Stacy added tab for all orders -->
<div id="allOrders" class="tab-content active">
<!-- Content for "all Orders" tab -->
<table class="table ec-table">
<thead>
<thead class="theadTitle">
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
@ -175,6 +264,73 @@ if ($_SESSION["userId"] <> "") {
</thead>
<tbody>
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
$totalAmount = 0;
if ($orders) {
$order_data = json_decode($orders, true);
$_SESSION['cart_items'] = $order_data;
foreach ($order_data as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<?php
$jsonorder = json_encode($order);
?>
<tr class="tableView" data-value=' <?php echo $jsonorder; ?>' data-bs-toggle="modal" data-bs-target="#productDetails">
<td>
<?php
// if (isset($order['items'][0]['product']['product_image'])) {
// echo '<img class="prod-img" src="' . $order['items'][0]['product']['product_image'] . '" alt="product"> ';
// } else {
// echo '<img class="prod-img" src="https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png" alt="product">';
// }
?>
</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['status']; ?></span></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 } else { ?>
<td> <img class="prod-img" src="https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png" alt="product"> </td>
<?php
}
}
}
}
?>
</tbody>
</table>
</div>
<div id="toPay" class="tab-content">
<!-- Content for "To Pay" tab -->
<table class="table ec-table">
<thead class="theadTitle">
<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">Status</th>
<th scope="col">Date</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
@ -187,7 +343,10 @@ if ($_SESSION["userId"] <> "") {
if (isset($order['status']) && (strtoupper($order['status']) === 'TO PAY') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<?php
$jsonorder = json_encode($order);
?>
<tr class="tableView" data-value=' <?php echo $jsonorder; ?>' data-bs-toggle="modal" data-bs-target="#productDetails">
<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>
@ -207,11 +366,12 @@ if ($_SESSION["userId"] <> "") {
</tbody>
</table>
</div>
<div id="toShip" class="tab-content">
<div id="toShip" class="tab-content">
<!-- Content for "To Ship" tab -->
<table class="table ec-table">
<thead>
<thead class="theadTitle">
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
@ -219,53 +379,56 @@ if ($_SESSION["userId"] <> "") {
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Status</th>
<th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th>
<!-- <th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th> -->
<th scope="col">Date</th>
<!-- <th scope="col">Actions</th> -->
</tr>
</thead>
<tbody>
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
$totalAmount = 0;
if ($orders) {
$order_data = json_decode($orders, true);
$_SESSION['cart_items'] = $order_data;
foreach ($order_data as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && (strtoupper($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['status']; ?></span></td>
<td><span><?php echo $order['tracking_number']; ?></span></td>
<td><span><?php echo $order['courirer_name']; ?></span></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
}
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
$totalAmount = 0;
if ($orders) {
$order_data = json_decode($orders, true);
$_SESSION['cart_items'] = $order_data;
foreach ($order_data as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && (strtoupper($order['status']) === 'TO SHIP') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<?php
$jsonorder = json_encode($order);
?>
<tr class="tableView" data-value=' <?php echo $jsonorder; ?>' data-bs-toggle="modal" data-bs-target="#productDetails">
<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['status']; ?></span></td>
<!-- <td><span><?php echo $order['tracking_number']; ?></span></td>
<td><span><?php echo $order['courier_name']; ?></span></td> -->
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
</tr>
<?php
}
}
}
?>
}
?>
</tbody>
</table>
</div>
<div id="toReceive" class="tab-content">
<!-- Content for "To Receive" tab -->
<table class="table ec-table">
<thead>
<thead class="theadTitle">
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
@ -273,55 +436,67 @@ if ($_SESSION["userId"] <> "") {
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Status</th>
<th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th>
<!-- <th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th> -->
<th scope="col">Date</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
$totalAmount = 0;
if ($orders) {
$order_data = json_decode($orders, true);
$_SESSION['cart_items'] = $order_data;
foreach ($order_data as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && (strtoupper($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['status']; ?></span></td>
<td><span><?php echo $order['tracking_number']; ?></span></td>
<td><span><?php echo $order['courier_name']; ?></span></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']; ?>', '<?php echo htmlspecialchars($order['payment']['reference_number']); ?>')">Received</a>
</span>
</td>
</tr>
<?php
}
<?php
if ($_SESSION["isLoggedIn"] && $customer_data) {
$customer = $customer_data[0];
$orders = getOrderbyCustomerId($customer['_id']);
$totalAmount = 0;
if ($orders) {
$order_data = json_decode($orders, true);
$_SESSION['cart_items'] = $order_data;
foreach ($order_data as $order) {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && (strtoupper($order['status']) === 'TO RECEIVE') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<?php
$jsonorder = json_encode($order);
?>
<tr class="tableView" data-value=' <?php echo $jsonorder; ?>' data-bs-toggle="modal" data-bs-target="#productDetails">
<td>
<!-- <?php if (isset($order['product_image'])) : ?>
<img src="<?php echo $order['items'][0]['product']['product_image']; ?>" class="prod-img">
<?php else : ?>
<img src="https://api.obanana.com/images/storage/web_images/1708588564876-viber_image_2024-02-22_15-54-42-498.png" class="prod-img">
<?php endif; ?> -->
<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['status']; ?></span></td>
<!-- <td><span><?php # echo $order['tracking_number']; ?></span></td>
<td><span><?php # echo $order['courier_name']; ?></span></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="completed" class="tab-content">
<!-- Content for "Completed" tab -->
<table class="table ec-table">
<thead>
<thead class="theadTitle">
<tr>
<th scope="col">Image</th>
<th scope="col">Name</th>
@ -329,8 +504,8 @@ if ($_SESSION["userId"] <> "") {
<th scope="col">Unit Price</th>
<th scope="col">Price</th>
<th scope="col">Status</th>
<th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th>
<!-- <th scope="col">Tracking Number</th>
<th scope="col">Courier Name</th> -->
<th scope="col">Date</th>
<th scope="col">Actions</th>
</tr>
@ -348,34 +523,26 @@ if ($_SESSION["userId"] <> "") {
// Ensure that the required data is available before accessing it
if (isset($order['status']) && (strtoupper($order['status']) === 'COMPLETED') && isset($order['items'][0]['product'])) {
$totalAmount += $order['total_amount'];
?>
<tr>
<tr class="tableView" data-value=' <?php echo $jsonorder; ?>' data-bs-toggle="modal" data-bs-target="#productDetails">
<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['status']; ?></span></td>
<td><span><?php echo $order['tracking_number']; ?></span></td>
<td><span><?php echo $order['courier_name']; ?></span></td>
<!-- <td><span><?php echo $order['tracking_number']; ?></span></td>
<td><span><?php echo $order['courier_name']; ?></span></td> -->
<td><span><?php echo date("F j, Y", strtotime($order['updatedAt'])); ?></span></td>
<td>
<?php
$currentDate = time(); // Current Unix timestamp
<?php
if ($order['return_order']['status'] === 'To Approve') {
echo '<span class="tbl-btn">Refund Requested</span>';
} elseif ($order['return_order']['status'] === 'To Ship') {
echo '<span class="tbl-btn">For Refund</span>';
} else {
$orderDate = strtotime($order['updatedAt']);
$sevenDaysAfterOrder = strtotime('+7 days', $orderDate); // Seven days after the order date
if ($currentDate >= $sevenDaysAfterOrder) {
echo '<span class="tbl-btn" disabled></span>';
} else {
echo '<a class="btn btn-lg btn-primary" data-bs-toggle="modal" data-bs-target="#modal-refund-' . $order['_id'] . '">Return/Refund</a>';
}
}else {
echo '<a class="btn btn-lg btn-primary" data-bs-toggle="modal" data-bs-target="#modal-refund-' . $order['_id'] . '">Return/Refund</a>';
}
?>
</td>
@ -714,9 +881,151 @@ if ($_SESSION["userId"] <> "") {
<!-- Footer Start -->
<?php include "footer.php" ?>
<!-- Footer Area End -->
<!-- Modal -->
<!-- 03-15-2024 Stacy added modal -->
<div class="modal fade" id="productDetails" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="modal-header" style="height:5px;">
<button type="button" class="btn-close-icon" style="align-items: end;" data-bs-dismiss="modal" aria-label="Close">
<i class="mdi mdi-close"></i>
</button>
</div>
<div class="row" id="modalContent" style="justify-content:center; align-items:center;">
<!-- modal content placed under script -->
</div>
</div>
</div>
</div>
</div>
<!-- Modal end -->
<script>
// 03-18-2024 Stacy added script for showing productDetails modal
document.getElementById('productDetails').addEventListener('shown.bs.modal', function (event) {
var jsonString = $(event.relatedTarget).data('value');
var jsonObject = JSON.parse(jsonString);
const modal = document.getElementById('modalContent'); // No changes here
const date = new Date(jsonObject.updatedAt); const formatter = new Intl. DateTimeFormat('en-US', { day: '2-digit', month: '2-digit', year: 'numeric' }); const formattedDate = formatter. format(date);
if (jsonObject.status === 'TO PAY') { // Changed $order['status'] to jsonObject.status
modal.innerHTML = `
<div class="row" style="margin-left:20px;">
<div class="col-md-6">
<img class="image-thumb-preview" style="width:100%; height:100%; padding-left:20px;" src="${jsonObject.items[0].product.product_image}" alt="product" />
</div>
<div class="col-md-6" style="margin:auto;">
<ul style="font-size:14px;">
<li><b>Product Name:</b> ${jsonObject.items[0].product.name}</li>
<li><b>Quantity:</b> ${jsonObject.items[0].quantity}</li>
<li><b>Unit Price:</b> ${jsonObject.items[0].price}</li>
<li><b>Price:</b> ${jsonObject.total_amount}</li>
<li><b>Status:</b> ${jsonObject.status}</li>
<li><b>Date:</b> ${formattedDate}</li>
</ul>
</div>
</div>`;
}
if (jsonObject.status === 'TO SHIP') {
modal.innerHTML = `
<div class="row" style="margin-left:20px;">
<div class="col-md-6">
<img class="image-thumb-preview" style="width:100%; height:100%; padding-left:20px;" src="${jsonObject.items[0].product.product_image}" alt="product" />
</div>
<div class="col-md-6" style="margin:auto;">
<ul style="font-size:14px;">
<li><b>Product Name:</b> ${jsonObject.items[0].product.name}</li>
<li><b>Quantity:</b> ${jsonObject.items[0].quantity}</li>
<li><b>Unit Price:</b> ${jsonObject.items[0].price}</li>
<li><b>Price:</b> ${jsonObject.total_amount}</li>
<li><b>Status:</b> ${jsonObject.status}</li>
<li><b>Tracking Number:</b> ${jsonObject.tracking_number}</li>
<li><b>Courier Name:</b> ${jsonObject.courier_name}</li>
<li><b>Date:</b> ${formattedDate}</li>
</ul>
</div>
</div>`;
}
if (jsonObject.status === 'TO RECEIVE') {
modal.innerHTML = `
<div class="row" style="margin-left:20px;">
<div class="col-md-6">
<img class="image-thumb-preview" style="width:100%; height:100%; padding-left:20px;" src="${jsonObject.items[0].product.product_image}" alt="product" />
</div>
<div class="col-md-6" style="margin:auto;">
<ul style="font-size:14px;">
<li><b>Product Name:</b> ${jsonObject.items[0].product.name}</li>
<li><b>Quantity:</b> ${jsonObject.items[0].quantity}</li>
<li><b>Unit Price:</b> ${jsonObject.items[0].price}</li>
<li><b>Price:</b> ${jsonObject.total_amount}</li>
<li><b>Status:</b> ${jsonObject.status}</li>
<li><b>Tracking Number:</b> ${jsonObject.tracking_number}</li>
<li><b>Courier Name:</b> ${jsonObject.courier_name}</li>
<li><b>Date:</b> ${formattedDate}</li>
</ul>
</div>
</div>`;
}
if (jsonObject.status === 'COMPLETED') {
modal.innerHTML = `
<div class="row" style="margin-left:20px;">
<div class="col-md-6">
<img class="image-thumb-preview" style="width:100%; height:100%; padding-left:20px;" src="${jsonObject.items[0].product.product_image}" alt="product" />
</div>
<div class="col-md-6" style="margin:auto;">
<ul style="font-size:14px;">
<li><b>Product Name:</b> ${jsonObject.items[0].product.name}</li>
<li><b>Quantity:</b> ${jsonObject.items[0].quantity}</li>
<li><b>Unit Price:</b> ${jsonObject.items[0].price}</li>
<li><b>Price:</b> ${jsonObject.total_amount}</li>
<li><b>Status:</b> ${jsonObject.status}</li>
<li><b>Tracking Number:</b> ${jsonObject.tracking_number}</li>
<li><b>Courier Name:</b> ${jsonObject.courier_name}</li>
<li><b>Date:</b> ${formattedDate}</li>
</ul>
</div>
</div>`;
}
if (jsonObject.status === 'RETURNED') {
modal.innerHTML = `
<div class="row" style="margin-left:20px;">
<div class="col-md-6">
<img class="image-thumb-preview" style="width:100%; height:100%; padding-left:20px;" src="${jsonObject.items[0].product.product_image}" alt="product" />
</div>
<div class="col-md-6" style="margin:auto;">
<ul style="font-size:14px;">
<li><b>Product Name:</b> ${jsonObject.items[0].product.name}</li>
<li><b>Quantity:</b> ${jsonObject.items[0].quantity}</li>
<li><b>Unit Price:</b> ${jsonObject.items[0].price}</li>
<li><b>Price:</b> ${jsonObject.total_amount}</li>
<li><b>Status:</b> ${jsonObject.status}</li>
<li><b>Tracking Number:</b> ${jsonObject.tracking_number}</li>
<li><b>Courier Name:</b> ${jsonObject.courier_name}</li>
<li><b>Date:</b> ${formattedDate}</li>
</ul>
</div>
</div>`;
}
console.log(jsonObject);
});
const modal = document.getElementById('productDetails');
console.log(modal);
</script>
<!-- Footer navigation panel for responsive display -->
<div class="ec-nav-toolbar">
<div class="container">

View File

@ -114,7 +114,7 @@ if ($_SESSION["userId"] <> "") {
<!-- ekka Cart End -->
<!-- Category Sidebar start -->
<?php #include "category-slider.php" ?>
<?php include "category-slider.php" ?>
<!-- Ec breadcrumb start -->
<div class="sticky-header-next-sec ec-breadcrumb section-space-mb">
@ -168,7 +168,7 @@ if ($_SESSION["userId"] <> "") {
<div class="col-md-12">
<div class="ec-vendor-block-profile">
<div class="ec-vendor-block-img space-bottom-30 ">
<div class="ec-vendor-block-bg" style="background-color: orange;">
<div class="ec-vendor-block-bg" style="background-color: orange; background-image: url(<?php echo $customer_data['customer_banner'] ?>) !important;">
<a href="#" class="btn btn-lg btn-primary" data-link-action="editmodal" title="Edit Detail" data-bs-toggle="modal" data-bs-target="#edit_modal">Edit Detail</a>
</div>

View File

@ -49,7 +49,7 @@ if ($_SESSION["userId"] <> "") {
<link rel="stylesheet" id="bg-switcher-css" href="assets/css/backgrounds/bg-4.css">
<style>
.tab.active {
background-color: #3498db;
background-color: #ffaa00;
/* Set your desired background color for the active tab */
color: #ffffff;
/* Set your desired text color for the active tab */
@ -136,6 +136,16 @@ if ($_SESSION["userId"] <> "") {
<img class="v-img" src="assets/images/user/1.jpg" alt="vendor image">
<h5>Mariana Johns</h5>
</div> -->
<!-- 03-142024 Stacy added customer image -->
<div class="ec-vendor-block-bg" style="background-color: orange; background-image: url(<?php echo $customer_data['customer_banner'] ?>) !important;">
</div>
<div class="ec-vendor-block-detail">
<?php
$customer_image = isset($customer_data[0]['customer_image']) ? $customer_data[0]['customer_image'] : 'https://yourteachingmentor.com/wp-content/uploads/2020/12/istockphoto-1223671392-612x612-1.jpg';
?>
<img class="v-img" src=<?php echo $customer_image ?> alt="vendor image">
</div>
<?php include 'user-profile-tabs.php' ?>
</div>
</div>