2024-02-12 10:35:09 +08:00
< ? php
include " ../functions.php " ;
2024-02-15 20:42:37 +08:00
2024-02-12 10:35:09 +08:00
$_SESSION [ " url " ] = $_SERVER [ 'REQUEST_URI' ];
if ( $_SESSION [ " userId " ] <> " " ) {
$_SESSION [ " isLoggedIn " ] = true ;
2024-03-13 10:59:15 +08:00
$customer_data = getCustomerbyLoginId ( $_SESSION [ " userId " ]);
2024-02-12 10:35:09 +08:00
} else {
$_SESSION [ " isLoggedIn " ] = false ;
header ( " location: login.php " );
exit ();
}
if ( $_SESSION [ " user_type " ] != " admin " ) {
header ( " location: login.php?alert=Only admins allowed here! " );
}
$products = productList ();
2024-03-13 10:59:15 +08:00
$vendorSearchResult = $_SESSION [ " vendorSearchResult " ];
2024-02-12 10:35:09 +08:00
?>
<! DOCTYPE html >
< html lang = " en " dir = " ltr " >
< head >
< style >
. pagination {
display : flex ;
list - style : none ;
padding : 0 ;
margin : 0 ;
justify - content : center ;
}
. pagination a {
color : #333;
text - decoration : none ;
padding : 5 px 10 px ;
border : 1 px solid #ccc;
margin : 0 5 px ;
border - radius : 4 px ;
}
. pagination a . active {
background - color : #007bff;
color : #fff;
}
</ style >
< meta charset = " utf-8 " />
< meta http - equiv = " X-UA-Compatible " content = " IE=edge " />
< meta name = " viewport " content = " width=device-width, initial-scale=1 " />
< meta name = " description " content = " oBanana B2B - Admin Dashboard " >
< title > oBanana B2B - Admin Dashboard </ title >
<!-- GOOGLE FONTS -->
< link rel = " preconnect " href = " https://fonts.googleapis.com " >
< link rel = " preconnect " href = " https://fonts.gstatic.com " crossorigin >
< link href = " https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600;700;800&family=Poppins:wght@300;400;500;600;700;800;900&family=Roboto:wght@400;500;700;900&display=swap " rel = " stylesheet " >
< link href = " https://cdn.materialdesignicons.com/4.4.95/css/materialdesignicons.min.css " rel = " stylesheet " />
<!-- PLUGINS CSS STYLE -->
< link href = " assets/plugins/simplebar/simplebar.css " rel = " stylesheet " />
<!-- Ekka CSS -->
< link id = " ekka-css " rel = " stylesheet " href = " assets/css/ekka.css " />
<!-- FAVICON -->
2024-03-13 10:59:15 +08:00
<!-- < link href = " assets/img/favicon.png " rel = " shortcut icon " /> -->
< link href = " assets/img/favicon/favicon.png " rel = " shortcut icon " />
2024-02-12 10:35:09 +08:00
2024-02-29 16:00:50 +08:00
<!-- FONTAWESOME -->
< link rel = " stylesheet " href = " https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css " integrity = " sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA== " crossorigin = " anonymous " referrerpolicy = " no-referrer " />
2024-02-12 10:35:09 +08:00
</ head >
< body class = " ec-header-fixed ec-sidebar-fixed ec-sidebar-dark ec-header-light " id = " body " >
<!-- WRAPPER -->
< div class = " wrapper " >
<!-- LEFT MAIN SIDEBAR -->
< ? php include 'left-main-sidebar.php' ?>
<!-- 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 -->
2024-03-13 10:59:15 +08:00
<!-- 03 - 07 - 2024 Stacy & Raymart modified this block of code -->
2024-02-12 10:35:09 +08:00
< div class = " search-form d-lg-inline-block " >
2024-03-13 10:59:15 +08:00
< 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 >
2024-02-12 10:35:09 +08:00
< div id = " search-results-container " >
< ul id = " search-results " ></ ul >
</ div >
</ div >
2024-03-13 10:59:15 +08:00
<!-- 03 - 07 - 2024 Stacy & Raymart modified this block of code -->
2024-02-12 10:35:09 +08:00
<!-- 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 ( 1 pm -
2 pm ) </ 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 ( 1 pm -
2 pm ) </ 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 >
<!-- CONTENT WRAPPER -->
< div class = " ec-content-wrapper ec-vendor-wrapper " >
< div class = " content " >
< div class = " breadcrumb-wrapper d-flex align-items-center justify-content-between " >
< div >
< h1 > Vendor Cards </ h1 >
< p class = " breadcrumbs " >< span >< a href = " index.php " > Home </ a ></ span >< span >< i class = " mdi mdi-chevron-right " ></ i ></ span > Vendors </ p >
</ div >
< div >
< button type = " button " class = " btn btn-primary " data - bs - toggle = " modal " data - bs - target = " #modal-add-member " > Add Vendor
</ button >
</ div >
</ div >
< div class = " card card-default p-4 ec-card-space " >
< div class = " ec-vendor-card mt-m-24px row " >
< ? php
$vendors = vendorList ();
$totalVendors = count ( $vendors );
$vendorsPerPage = 20 ;
$totalPages = ceil ( $totalVendors / $vendorsPerPage );
$currentpage = isset ( $_GET [ 'page' ]) ? $_GET [ 'page' ] : 1 ;
$start = ( $currentpage - 1 ) * $vendorsPerPage ;
$end = $start + $vendorsPerPage - 1 ;
2024-03-13 10:59:15 +08:00
$vendorsCopy = $vendors ;
// var_dump($vendorsCopy
// );
// 03-07-2024 added searh filter
if ( ! empty ( $_GET [ 'search' ]) ) {
$filteredProducts = [];
foreach ( $vendorsCopy as $result ) {
$vendorName = strtolower ( $result [ 'user_login' ]);
if (
// $result['user_login'] == $_GET['search']
strpos ( $vendorName , $_GET [ 'search' ]) !== false
) {
$filteredProducts [] = $result ;
// var_dump("herees");
// var_dump($_GET['search']);
} else {
// var_dump("none");
}
}
$vendors = $filteredProducts ;
$totalVendors = count ( $filteredProducts );
$vendorsPerPage = 20 ;
}
else {
// $vendors=$vendorsCopy;
}
if ( $totalVendors == 0 ) {
echo '<p style="padding-top:30px; padding-left:20px;">No vendor found.</p>' ;
}
2024-02-12 10:35:09 +08:00
// $vendors = vendorList();
for ( $x = $start ; $x <= $end && $x < $totalVendors ; $x ++ ) {
$vendor = $vendors [ $x ];
?>
2024-03-13 10:59:15 +08:00
2024-02-12 10:35:09 +08:00
< div class = " col-lg-6 col-xl-4 col-xxl-3 " >
< div class = " card card-default mt-24px " >
< a href = " javascript:0 " data - bs - toggle = " modal " data - bs - target = " #modal-contact-<?php echo $vendor['_id'] ; ?> " class = " view-detail me-auto " >
< i class = " mdi mdi-eye-plus-outline " ></ i >
</ a >
< a onclick = " deleteVendor('<?php echo $vendor['_id'] ?>') " style = " margin-top:25px; " class = " view-detail me-auto " >
< i class = " mdi mdi mdi-delete-outline " ></ i >
</ a >
< div class = " vendor-info card-body text-center p-4 " >
< a href = " vendor-profile.php?id=<?php echo $vendor["_id"] ?> " class = " text-secondary d-inline-block mb-3 " >
< div class = " image mb-3 " >
< ? php
if ( isset ( $vendor [ 'vendor_image' ]) && ! empty ( $vendor [ 'vendor_image' ])) {
echo '<img src="' . $vendor [ 'vendor_image' ] . '" class="img-fluid rounded-circle" alt="Avatar Image" style="width: 150px; height: 150px; object-fit: cover; border-radius: 50%;"> ' ;
} else {
2024-03-13 10:59:15 +08:00
echo '<img src="https://api.obanana.com/images/storage/web_images/1710214273217-no_image.png" class="img-fluid rounded-circle" alt="Placeholder Image">' ;
2024-02-12 10:35:09 +08:00
}
?>
</ div >
< h5 class = " card-title text-dark " >< ? php echo $vendor [ 'user_login' ]; ?> </h5>
< ul class = " list-unstyled " >
< li class = " d-flex mb-1 " >
< i class = " mdi mdi-cellphone-basic mr-1 " ></ i >
< span >
< ? php
echo isset ( $vendor [ 'phone' ]) && ! empty ( $vendor [ 'phone' ]) ? $vendor [ 'phone' ] : 'No Number yet' ;
?>
</ span >
</ li >
< li class = " d-flex " >
< i class = " mdi mdi-email mr-1 " ></ i >
< span >
< ? php
echo isset ( $vendor [ 'user_email' ]) && ! empty ( $vendor [ 'user_email' ]) ? $vendor [ 'user_email' ] : 'No Email yet' ;
?>
</ span >
</ li >
</ ul >
</ a >
< div class = " row justify-content-center ec-vendor-detail " >
< div class = " col-4 " >
< h6 class = " text-uppercase " > Items </ h6 >
< ? php
$vendorId = $vendor [ '_id' ];
$product = array_filter ( $products , function ( $var ) use ( $vendorId ) {
return ( $var [ 'vendor_api_id' ] == $vendorId );
});
?>
< h5 >< ? php echo count ( $product ); ?> </h5>
</ div >
< div class = " col-4 " >
< h6 class = " text-uppercase " > Sell </ h6 >
< h5 > 1908 </ h5 >
</ div >
< div class = " col-4 " >
< h6 class = " text-uppercase " > Payout </ h6 >
< h5 > $ 2691 </ h5 >
</ div >
</ div >
</ div >
</ div >
</ div >
< div class = " modal fade " id = " modal-contact-<?php echo $vendor['_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-edit-icon " data - bs - dismiss = " modal " aria - label = " Close " >
< i class = " mdi mdi-pencil " ></ i >
</ button > -->
< button type = " button " class = " btn-close-icon " data - bs - dismiss = " modal " aria - label = " Close " >
< i class = " mdi mdi-close " ></ i >
</ button >
</ div >
2024-02-29 16:00:50 +08:00
<!-- 02 - 28 - 2024 Stacy modified this block of code -->
2024-02-12 10:35:09 +08:00
< div class = " modal-body pt-0 " >
2024-02-29 16:00:50 +08:00
< div style = " text-align: center; display: column; justify-content: center; align-items: center; " class = " col-md-6 " >
<!-- < input type = " file " id = " fileInput<?php #echo $vendor['_id'] ; ?> " accept = " .png, .jpg, .jpeg " /> -->
< div class = " thumb-edit " style = " padding-left:120px; margin-bottom:-40px; " >
< input style = " display:none; " type = 'file' id = " fileInput<?php echo $vendor['_id'] ; ?> " class = " ec-image-upload " accept = " .png, .jpg, .jpeg " onchange = " previewImage('<?php echo $vendor['_id'] ; ?>') " />
< label >< i class = " fa-solid fa-file-import " style = " cursor:pointer; " onclick = " document.getElementById('fileInput<?php echo $vendor['_id'] ; ?>').click() " ></ i ></ label >
</ div >
< div class = " vendor-image " style = " padding-top:20px; " >
< ? php
if ( isset ( $vendor [ 'vendor_image' ]) && ! empty ( $vendor [ 'vendor_image' ])) {
echo '<img src="' . $vendor [ 'vendor_image' ] . '" alt="edit" id="imgPrev" class="img-fluid rounded-circle" alt="Avatar Image" style="align-items:left; width:100px; height:100px; object-fit:cover; border-radius:80%;"> ' ;
} else {
echo '<img src="https://yourteachingmentor.com/wp-content/uploads/2020/12/istockphoto-1223671392-612x612-1.jpg" id="imgPrev" alt="edit" class="img-fluid rounded-circle" alt="Placeholder Image" style="align-items:left; width:80px; height:80px; object-fit:cover; border-radius:50%;">' ;
}
?>
</ div >
< script >
function updateButtonText ( input ){
var label = document . getElementById ( 'fileInputLabel' );
if ( input . files . length > 0 ) {
label . innerHTML = '<i class="fa-solid fa-file-arrow-up"></i> ' + input . files [ 0 ] . name ;
} else {
label . innerHTML = '<i class="fa-solid fa-file-arrow-up"></i> Upload file' ;
}
}
// 02-29-2024 Stacy for image preview
function previewImage ( vendorId ){
var fileInput = document . getElementById ( 'fileInput' + vendorId );
var file = fileInput . files [ 0 ];
console . log ( 'clicked hereee' )
const reader = new FileReader ();
reader . onload = function ( e ) {
const dataUri = e . target . result ;
document . getElementById ( 'imgPrev' ) . src = dataUri
};
reader . readAsDataURL ( file );
}
</ script >
2024-02-12 10:35:09 +08:00
</ div >
< form >
< div class = " row no-gutters " >
< div class = " col-md-6 " >
< div class = " profile-content-left px-4 " >
< div class = " text-center widget-profile px-0 border-0 " >
< div class = " card-body " >
< div class = " form-group " >
2024-02-29 16:00:50 +08:00
< label for = " user_login-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " >< i class = " fi-rr-edit " ></ i > Name </ label >
2024-02-12 10:35:09 +08:00
< input type = " text " class = " form-control " id = " user_login-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['user_login'] ; ?> " >
</ div >
< div class = " row " >
< div class = " col-md-6 " >
< div class = " form-group " >
< label for = " firstName-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Contact First Name </ label >
< input type = " text " class = " form-control " id = " firstName-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['first_name'] ; ?> " >
</ div >
</ div >
< div class = " col-md-6 " >
< div class = " form-group " >
< label for = " lasttName-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Contact Last Name </ label >
< input type = " text " class = " form-control " id = " lastName-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['last_name'] ; ?> " >
</ div >
</ div >
</ div >
< div class = " form-group " >
< label for = " email-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Email address </ label >
< div id = " email-error-message-<?php echo $vendor['_id'] ; ?> " class = " text-danger " style = " color: red; " ></ div >
< input type = " text " class = " form-control " id = " email-<?php echo $vendor['_id'] ; ?> " oninput = " validateEmail('<?php echo $vendor['_id'] ; ?>') " value = " <?php echo $vendor['user_email'] ; ?> " >
</ div >
< div class = " form-group " >
< label for = " phone-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Phone </ label >
< input type = " text " class = " form-control " id = " phone-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['phone'] ; ?> " >
</ div >
< div class = " form-group " >
< label for = " description-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Vendor Description </ label >
< input type = " text " class = " form-control " id = " description-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['vendor_description'] ; ?> " >
</ div >
< div class = " form-group " >
< label for = " status-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Vendor Status </ label >
<!-- < input type = " text " class = " form-control " id = " status-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['status'] ; ?> " > -->
< select class = " form-select " name = " status " id = " status-<?php echo $vendor['_id'] ; ?> " >
< option value = " " > Select Product Status </ option >
< option value = " Active " < ? php echo ( $vendor [ 'status' ] === 'Active' ) ? 'selected' : '' ; ?> >Active</option>
< option value = " Inactive " < ? php echo ( $vendor [ 'status' ] === 'Inactive' ) ? 'selected' : '' ; ?> >Inactive</option>
</ select >
</ div >
<!-- < p > john . example @ gmail . com </ p >
< a class = " btn btn-primary btn-pill my-3 " href = " # " > Follow </ a > -->
</ div >
</ div >
</ div >
</ div >
2024-02-29 16:00:50 +08:00
< div class = " col-md-6 " style = " margin-top:-100px; " >
2024-02-12 10:35:09 +08:00
< div class = " contact-info px-4 " >
< h4 class = " text-dark mb-1 " > Address </ h4 >
< div class = " form-group " >
< label for = " address_1-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Building Name , Number </ label >
< input type = " text " class = " form-control " id = " address_1-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['address_1']; ?> " >
</ div >
< div class = " form-group " >
< label for = " address_2-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Street </ label >
< input type = " text " class = " form-control " id = " address_2-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['address_2']; ?> " >
</ div >
< div class = " row " >
< div class = " col-md-6 " >
< div class = " form-group " >
< label for = " barangay-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Barangay </ label >
< input type = " text " class = " form-control " id = " barangay-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['barangay']; ?> " >
</ div >
</ div >
< div class = " col-md-6 " >
< div class = " form-group " >
< label for = " city-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > City </ label >
< input type = " text " class = " form-control " id = " city-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['city']; ?> " >
</ div >
</ div >
</ div >
< div class = " form-group " >
< label for = " province-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Province </ label >
< input type = " text " class = " form-control " id = " province-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['province']; ?> " >
</ div >
< div class = " form-group " >
< label for = " country-<?php echo $vendor['_id'] ; ?> " class = " text-dark font-weight-medium pt-3 mb-2 " > Country </ label >
< input type = " text " class = " form-control " id = " country-<?php echo $vendor['_id'] ; ?> " value = " <?php echo $vendor['address'] [0]['country']; ?> " >
</ div >
<!-- < button type = " button " class = " btn btn-primary btn-pill my-3 " onclick = " uploadImage('<?php echo $vendor['_id'] ; ?>') " > Update </ button > -->
<!-- < button type = " button " class = " btn btn-primary btn-pill my-3 " onclick = " updateVendor('<?php echo $vendor['_id'] ; ?>') " > Update </ button > -->
</ div >
</ div >
</ div >
</ form >
< button type = " button " class = " btn btn-primary btn-pill my-3 " onclick = " uploadFile('<?php echo $vendor['_id'] ; ?>') " > Upload </ button >
</ div >
</ div >
</ div >
2024-03-13 10:59:15 +08:00
</ div >
2024-02-12 10:35:09 +08:00
< script >
2024-02-27 08:56:59 +08:00
function deleteVendor ( vendorId ){
2024-02-12 10:35:09 +08:00
let text = " Please confirm delete action! \n Click OK or Cancel button. " ;
if ( confirm ( text ) == true ) {
window . open ( " vendor-delete-action.php?id= " + vendorId , " _self " );
}
}
function uploadFile ( vendorId ) {
2024-02-27 08:56:59 +08:00
const originalEmail = document . getElementById ( 'email-' + vendorId ) . defaultValue ;
const updatedEmail = document . getElementById ( 'email-' + vendorId ) . value ;
const isEmailModified = originalEmail !== updatedEmail ;
if ( isEmailModified ) {
validateEmail ( vendorId ) . then ( isEmailAvailable => {
if ( ! isEmailAvailable ) {
$ ( '#email-error-message-' + vendorId ) . text ( 'Email is already in use' ) . show ();
} else {
$ ( '#email-error-message-' + vendorId ) . text ( '' ) . hide ();
var fileInput = document . getElementById ( 'fileInput' + vendorId );
var file = fileInput . files [ 0 ];
2024-02-29 16:00:50 +08:00
2024-02-27 08:56:59 +08:00
const updatedUser = document . getElementById ( 'user_login-' + vendorId ) . value ;
const firstName = document . getElementById ( 'firstName-' + vendorId ) . value ;
const lastName = document . getElementById ( 'lastName-' + vendorId ) . value ;
const phone = document . getElementById ( 'phone-' + vendorId ) . value ;
const description = document . getElementById ( 'description-' + vendorId ) . value ;
const status = document . getElementById ( 'status-' + vendorId ) . value ;
const updatedAddress1 = document . getElementById ( 'address_1-' + vendorId ) . value ;
const updatedAddress2 = document . getElementById ( 'address_2-' + vendorId ) . value ;
const barangay = document . getElementById ( 'barangay-' + vendorId ) . value ;
const city = document . getElementById ( 'city-' + vendorId ) . value ;
const province = document . getElementById ( 'province-' + vendorId ) . value ;
const country = document . getElementById ( 'country-' + vendorId ) . value ;
var formData = new FormData ();
formData . append ( 'image_id' , vendorId );
formData . append ( 'category' , 'vendor' );
formData . append ( 'image' , file ); // Include the file data in the form data
2024-02-29 16:00:50 +08:00
if ( file ){
2024-02-27 08:56:59 +08:00
fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/upload_image' , {
method : 'POST' ,
body : formData
})
. then ( response => {
if ( response . ok ) {
return response . json ();
} else {
console . error ( 'File upload failed' );
throw new Error ( 'File upload failed' );
}
})
. then ( result => {
const filename = result . filename ;
const payload = {
vendor_image : `https://<?php echo $_SESSION["data_endpoint"]; ?>/images/storage/vendor_uploads/${filename}` ,
user_login : updatedUser ,
first_name : firstName ,
last_name : lastName ,
user_email : updatedEmail ,
phone : phone ,
vendor_description : description ,
status : status ,
address : [{
address_1 : updatedAddress1 ,
address_2 : updatedAddress2 ,
barangay : barangay ,
city : city ,
province : province ,
country : country ,
}]
};
return fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorId , {
method : 'PATCH' ,
headers : {
'Content-Type' : 'application/json'
},
body : JSON . stringify ( payload )
});
})
. then ( secondResponse => {
if ( secondResponse . ok ) {
console . log ( 'Second request successful' );
location . reload ();
} else {
console . error ( 'Second request failed' );
}
})
. catch ( error => {
console . error ( 'Error during fetch:' , error );
});
2024-02-29 16:00:50 +08:00
} else {
const payload = {
vendor_image : `https://<?php echo $_SESSION["data_endpoint"]; ?>/images/storage/vendor_uploads/${filename}` ,
user_login : updatedUser ,
first_name : firstName ,
last_name : lastName ,
user_email : updatedEmail ,
phone : phone ,
vendor_description : description ,
status : status ,
address : [{
address_1 : updatedAddress1 ,
address_2 : updatedAddress2 ,
barangay : barangay ,
city : city ,
province : province ,
country : country ,
}]
};
fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorId , {
method : 'PATCH' ,
headers : {
'Content-Type' : 'application/json'
},
body : JSON . stringify ( payload )
})
. then ( response => {
if ( response . ok ) {
location . reload ();
return response . json ();
} else {
console . error ( 'vendor Update failed' );
throw new Error ( 'vendor Update failed' );
}
})
;
}
2024-02-27 08:56:59 +08:00
}
});
} else {
$ ( '#email-error-message-' + vendorId ) . text ( '' ) . hide ();
const updatedUser = document . getElementById ( 'user_login-' + vendorId ) . value ;
const firstName = document . getElementById ( 'firstName-' + vendorId ) . value ;
const lastName = document . getElementById ( 'lastName-' + vendorId ) . value ;
const updatedEmail = document . getElementById ( 'email-' + vendorId ) . value ;
const phone = document . getElementById ( 'phone-' + vendorId ) . value ;
const description = document . getElementById ( 'description-' + vendorId ) . value ;
const status = document . getElementById ( 'status-' + vendorId ) . value ;
const updatedAddress1 = document . getElementById ( 'address_1-' + vendorId ) . value ;
const updatedAddress2 = document . getElementById ( 'address_2-' + vendorId ) . value ;
const barangay = document . getElementById ( 'barangay-' + vendorId ) . value ;
const city = document . getElementById ( 'city-' + vendorId ) . value ;
const province = document . getElementById ( 'province-' + vendorId ) . value ;
const country = document . getElementById ( 'country-' + vendorId ) . value ;
var fileInput = document . getElementById ( 'fileInput' + vendorId );
var file = fileInput . files [ 0 ];
var formData = new FormData ();
formData . append ( 'image_id' , vendorId );
formData . append ( 'category' , 'vendor' );
formData . append ( 'image' , file );
2024-02-29 16:00:50 +08:00
if ( file ){
2024-02-27 08:56:59 +08:00
fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/upload_image' , {
method : 'POST' ,
body : formData
})
. then ( response => {
if ( response . ok ) {
return response . json ();
} else {
console . error ( 'File upload failed' );
throw new Error ( 'File upload failed' );
}
})
. then ( result => {
const filename = result . filename ;
const payload = {
vendor_image : `https://<?php echo $_SESSION["data_endpoint"]; ?>/images/storage/vendor_uploads/${filename}` ,
user_login : updatedUser ,
first_name : firstName ,
last_name : lastName ,
user_email : updatedEmail ,
phone : phone ,
vendor_description : description ,
status : status ,
address : [{
address_1 : updatedAddress1 ,
address_2 : updatedAddress2 ,
barangay : barangay ,
city : city ,
province : province ,
country : country ,
}]
};
// Make API request using the extracted filename
return fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorId , {
method : 'PATCH' ,
headers : {
'Content-Type' : 'application/json'
},
body : JSON . stringify ( payload )
});
})
. then ( secondResponse => {
if ( secondResponse . ok ) {
console . log ( 'Second request successful' );
location . reload ();
} else {
console . error ( 'Second request failed' );
}
})
. catch ( error => {
console . error ( 'Error during fetch:' , error );
});
2024-02-29 16:00:50 +08:00
} else {
const payload = {
user_login : updatedUser ,
first_name : firstName ,
last_name : lastName ,
user_email : updatedEmail ,
phone : phone ,
vendor_description : description ,
status : status ,
address : [{
address_1 : updatedAddress1 ,
address_2 : updatedAddress2 ,
barangay : barangay ,
city : city ,
province : province ,
country : country ,
}]
};
fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/' + vendorId , {
method : 'PATCH' ,
headers : {
'Content-Type' : 'application/json'
},
body : JSON . stringify ( payload )
})
. then ( response => {
if ( response . ok ) {
location . reload ();
return response . json ();
} else {
console . error ( 'vendor Update failed' );
throw new Error ( 'vendor Update failed' );
}
})
;
}
2024-02-27 08:56:59 +08:00
}
}
function validateEmail ( vendorId ) {
var emailInput = document . getElementById ( 'email-' + vendorId );
var email = emailInput . value ;
if ( email . trim () !== '' ) {
return fetch ( 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/search?q=' + email )
. then ( response => {
if ( response . ok ) {
return response . json ();
} else {
throw new Error ( 'Failed to check email availability' );
}
})
. then ( data => {
const isEmailAvailable = parseInt ( data . results . length ) === 0 ;
$ ( '#email-error-message-' + vendorId ) . text ( isEmailAvailable ? '' : 'Email is already in use' ) . show ();
return isEmailAvailable ;
})
. catch ( error => {
console . error ( 'Error during email validation:' , error );
return false ;
});
} else {
$ ( '#email-error-message-' + vendorId ) . text ( '' ) . hide ();
return Promise . resolve ( true );
}
}
2024-02-12 10:35:09 +08:00
</ script >
<!-- < script >
function uploadImage ( vendorId ) {
// Get the file input element
const fileInput = document . getElementById ( 'user-image-file' );
// Add an event listener to the input element
fileInput . addEventListener ( 'change' , function () {
// Get the selected file
const selectedFile = fileInput . files [ 0 ];
// Display the file details (you can remove this part if not needed)
console . log ( 'Selected File:' , selectedFile );
console . log ( 'File Name:' , selectedFile . name );
console . log ( 'File Size:' , selectedFile . size );
console . log ( 'File Type:' , selectedFile . type );
// Store the file values in variables or use them as needed
const fileName = selectedFile . name ;
const fileSize = selectedFile . size ;
const fileType = selectedFile . type ;
// You can do further processing with the file, such as uploading it to a server
// or displaying a preview on the client side.
});
// Create a FormData object to send the file as multipart/form-data
// var formData = new FormData();
// formData.append('image_Id', vendorId);
// formData.append('category', "vendor");
// formData.append('image', fileInput.files[0]);
// Make AJAX request to the API
// $.ajax({
// url: 'https://api.obanana.shop/api/v1/upload_image',
// type: 'POST',
// data: formData,
// processData: false,
// contentType: false,
// success: function(response) {
// // Handle the successful response from the API
// console.log('Image uploaded successfully:', response);
// // You can perform additional actions here, such as updating the UI or sending additional requests
// },
// error: function(error) {
// // Handle the error response from the API
// console.error('Error uploading image:', error);
// // You can display an error message or perform other error-handling actions
// }
// });
}
</ script > -->
<!-- < script >
function uploadImage ( vendorId ) {
var formData = new FormData ();
var fileInput = document . getElementById ( 'user-image-file' );
if ( fileInput . files . length > 0 ) {
var file = fileInput . files [ 0 ];
console . log ( fileInput . files );
}
// formData.append('image_id', '6527b593f79b5deac5ad6c68');
// formData.append('category', 'vendor');
// formData.append('image', file);
// Make an AJAX request to the API endpoint
// $.ajax({
// type: 'POST',
// url: 'https://api.obanana.shop/api/v1/upload_image',
// data: formData,
// contentType: false,
// processData: false,
// success: function(response) {
// // Handle the success response
// console.log('Image uploaded successfully:', response);
// // You can perform additional actions here if needed
// },
// error: function(error) {
// // Handle the error response
// console.error('Error uploading image:', error);
// // You can display an error message or perform other actions here
// }
// });
}
</ script > -->
<!-- < script >
function updateVendor ( vendorId ) {
// Get values from the form elements
var email = document . getElementById ( 'email-' + vendorId ) . value ;
// var phone = document.getElementById('phone-' + vendorId).value;
// var birthday = document.getElementById('birthday-' + vendorId).value;
// var event = document.getElementById('event-' + vendorId).value;
// Construct the data object to be sent in the request
var data = {
user_email : email ,
// phone: phone,
// birthday: birthday,
// event: event
};
// Make a PUT request to your API endpoint
fetch ( 'https://api.obanana.shop/api/v1/vendors/' + vendorId , {
method : 'PATCH' ,
headers : {
'Content-Type' : 'application/json' ,
// You may need to include additional headers, such as authentication tokens
},
body : JSON . stringify ( data ),
})
. then ( response => {
if ( ! response . ok ) {
throw new Error ( 'Network response was not ok' );
}
return response . json ();
})
. then ( data => {
// Handle the response data as needed
console . log ( 'Vendor updated successfully' , data );
// Close the modal after successful update
$ ( '#modal-contact-' + vendorId ) . modal ( 'hide' );
})
. catch ( error => {
// Handle errors here
console . error ( 'Error updating vendor:' , error );
});
}
</ script > -->
< ? php
}
?>
</ div >
<!-- Ec Pagination Start -->
< div class = " pagination mt-3 " >
< ? php
2024-03-13 10:59:15 +08:00
if ( $totalVendors >= $vendorsPerPage ) {
for ( $i = 1 ; $i <= $totalPages ; $i ++ ) {
echo " <a href='?page= $i ' class=' " . ( $currentpage == $i ? 'active' : '' ) . " '> $i </a> " ;
}
}
2024-02-12 10:35:09 +08:00
?>
</ div >
<!-- Ec Pagination End -->
2024-03-13 10:59:15 +08:00
2024-02-12 10:35:09 +08:00
</ div >
<!-- Contact Modal -->
< div class = " modal fade " id = " modal-add-member " tabindex = " -1 " role = " dialog " aria - hidden = " true " >
< div class = " modal-dialog modal-dialog-centered modal-sm " role = " document " style = " max-width: 800px; " >
< div class = " modal-content " >
< div class = " modal-body " >
< div class = " row " >
< form action = " add_vendor_action.php " method = " post " >
< div class = " ec-vendor-block-img space-bottom-30 " >
<!-- < div class = " ec-vendor-block-bg cover-upload " >
< div class = " thumb-upload " >
< div class = " thumb-edit " >
< input type = 'file' id = " thumbUpload01 " class = " ec-image-upload "
accept = " .png, .jpg, .jpeg " />
< label >< i class = " fi-rr-edit " ></ i ></ label >
</ div >
< div class = " thumb-preview ec-preview " >
< div class = " image-thumb-preview " >
< img class = " image-thumb-preview ec-image-preview v-img "
src = " assets/images/banner/7.jpg " alt = " edit " />
</ div >
</ div >
</ div >
</ div > -->
<!-- < div class = " ec-vendor-block-detail " >
< div class = " thumb-upload " >
< div class = " thumb-edit " >
< input type = 'file' id = " thumbUpload02 " class = " ec-image-upload "
accept = " .png, .jpg, .jpeg " />
< label >< i class = " fi-rr-edit " ></ i ></ label >
</ div >
< div class = " thumb-preview ec-preview " >
< div class = " image-thumb-preview " >
< img class = " image-thumb-preview ec-image-preview v-img "
src = " assets/images/vendor/5.jpg " alt = " edit " />
</ div >
</ div >
</ div >
</ div > -->
< div class = " ec-vendor-upload-detail " >
< form class = " row g-3 " >
< div class = " col-md-12 space-t-15 " >
< label class = " form-label " > Company Name </ label >
< input type = " text " class = " form-control " name = " user_login " >
</ div >
< div class = " row " >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > First Name </ label >
< input type = " text " class = " form-control " name = " first_name " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Last Name </ label >
< input type = " text " class = " form-control " name = " last_name " >
</ div >
</ div >
< div class = " col-md-12 space-t-15 " >
< label class = " form-label " > About Vendor </ label >
< textarea class = " form-control " rows = " 3 " name = " vendor_description " ></ textarea >
</ div >
< div class = " col-md-12 space-t-15 " >
< label class = " form-label " > Building Name , Building Number </ label >
< input type = " text " class = " form-control " name = " address_1 " >
</ div >
< div class = " col-md-12 space-t-15 " >
< label class = " form-label " > Street </ label >
< input type = " text " class = " form-control " name = " address_2 " >
</ div >
< div class = " row " >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Barangay </ label >
< input type = " text " class = " form-control " name = " barangay " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > City </ label >
< input type = " text " class = " form-control " name = " city " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Province </ label >
< input type = " text " class = " form-control " name = " province " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Country </ label >
< input type = " text " class = " form-control " name = " country " >
</ div >
</ div >
< div class = " row " >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Email </ label >
< div id = " email-error-message " class = " text-danger " style = " color: red; " ></ div >
< input type = " text " class = " form-control " name = " user_email " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Phone </ label >
< input type = " text " class = " form-control " name = " phone " >
</ div >
</ div >
< div class = " row " >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Date Registered </ label >
< input type = " date " class = " form-control " name = " date_registered " >
</ div >
< div class = " col-md-6 space-t-15 " >
< label class = " form-label " > Vendor Status </ label >
< select class = " form-select " name = " status " >
< option value = " " > Select Product Status </ option >
< option value = " Active " > Active </ option >
< option value = " Inactive " > Inactive </ option >
</ select >
</ div >
</ div >
< div class = " modal-footer " >
< button type = " submit " class = " btn btn-primary " > Add Vendor </ button >
< a href = " # " class = " btn btn-secondary qty_close " data - bs - dismiss = " modal " aria - label = " Close " > Close </ a >
</ div >
</ form >
</ div >
</ div >
</ form >
</ div >
</ div >
</ div >
</ div >
</ div >
< script src = " https://code.jquery.com/jquery-3.6.4.min.js " ></ script >
< script >
$ ( document ) . ready ( function () {
$ ( 'input[name="user_email"]' ) . on ( 'input' , function () {
var email = $ ( this ) . val ();
if ( email . trim () !== '' ) {
var response ;
$ . ajax ({
2024-02-15 20:42:37 +08:00
url : 'https://<?php echo $_SESSION["data_endpoint"]; ?>/api/v1/vendors/search?q=' + email ,
2024-02-12 10:35:09 +08:00
method : 'GET' ,
success : function ( data ) {
response = data ;
if ( parseInt ( response . results . length ) == 0 ) {
$ ( '#email-error-message' ) . text ( '' ) . hide ();
} else {
$ ( '#email-error-message' ) . text ( 'Email is already in use' ) . show ();
}
},
error : function ( xhr , status , error ) {
console . error ( 'Failed to check email availability. Status:' , status , 'Error:' , error );
$ ( '#email-error-message' ) . text ( '' ) . hide ();
}
});
} else {
$ ( '#email-error-message' ) . text ( '' ) . hide ();
}
});
// Prevent form submission if email is already in use
$ ( 'form' ) . submit ( function ( event ) {
var errorMessage = $ ( '#email-error-message' ) . text ();
if ( errorMessage !== '' ) {
// Email is already in use, prevent form submission
event . preventDefault ();
// Display a message to the user
alert ( 'Please input another email. The provided email is already in use.' );
}
});
});
</ script >
<!-- Add Contact Button -->
< div class = " modal fade " id = " " tabindex = " -1 " role = " dialog " aria - hidden = " true " >
< div class = " modal-dialog modal-dialog-centered modal-sm " role = " document " >
< div class = " modal-content " >
<!-- < form class = " modal-header border-bottom-0 " >
< input type = " text " class = " form-control " placeholder = " Search... " >
</ form > -->
< div class = " modal-body p-0 " data - simplebar style = " height:320px " >
<!-- < ul class = " list-unstyled border-top mb-0 " >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u1.jpg "
alt = " Image " >
< span class = " status away " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Aaren </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " checked = " checked " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u2.jpg "
alt = " Image " >
< span class = " status active " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Leon Battista </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " checked = " checked " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u3.jpg "
alt = " Image " >
< span class = " status away " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Abriel </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u4.jpg "
alt = " Image " >
< span class = " status active " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Emma </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< 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 align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Emily </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u6.jpg "
alt = " Image " >
< span class = " status " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > William </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< 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 align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Sophia </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u8.jpg "
alt = " Image " >
< span class = " status " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Sophia </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u1.jpg "
alt = " Image " >
< span class = " status away " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Aaren </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u2.jpg "
alt = " Image " >
< span class = " status " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Abby </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u3.jpg "
alt = " Image " >
< span class = " status away " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Abriel </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u4.jpg "
alt = " Image " >
< span class = " status active " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Emma </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u5.jpg "
alt = " Image " >
< span class = " status " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Emily </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< 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 align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > William </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
< li >
< div class = " media media-message " >
< div class = " position-relative mr-3 " >
< img class = " rounded-circle " src = " assets/img/user/u7.jpg "
alt = " Image " >
< span class = " status " ></ span >
</ div >
< div
class = " media-body d-flex justify-content-between align-items-center " >
< div class = " message-contents " >
< h4 class = " title " > Sophia </ h4 >
< p class = " last-msg " > Lorem ipsum dolor sit , amet consectetur
adipisicing elit . Nam itaque doloremque
odio ,
eligendi delectus vitae .</ p >
</ div >
< div class = " control outlined control-checkbox checkbox-primary " >
< input type = " checkbox " >
< div class = " control-indicator " ></ div >
</ div >
</ div >
</ div >
</ li >
</ ul > -->
</ div >
< div class = " modal-footer px-4 " >
< button type = " button " class = " btn btn-secondary btn-pill " data - bs - dismiss = " modal " > Cancel </ button >
< button type = " button " class = " btn btn-primary btn-pill " > Add new member </ button >
</ div >
</ div >
</ div >
</ div >
</ div > <!-- End Content -->
</ div > <!-- End Content Wrapper -->
<!-- Footer -->
< footer class = " footer mt-auto " >
< div class = " copyright bg-white " >
< p >
Copyright & copy ; < span id = " ec-year " ></ span >< a class = " text-primary " href = " https://themeforest.net/user/ashishmaraviya " target = " _blank " > oBanana B2B Admin Dashboard </ a >. All Rights Reserved .
</ p >
</ div >
</ footer >
</ div > <!-- End Page Wrapper -->
</ div > <!-- End Wrapper -->
<!-- Common Javascript -->
< script src = " assets/plugins/jquery/jquery-3.5.1.min.js " ></ script >
< script src = " assets/js/bootstrap.bundle.min.js " ></ script >
< script src = " assets/plugins/simplebar/simplebar.min.js " ></ script >
< script src = " assets/plugins/jquery-zoom/jquery.zoom.min.js " ></ script >
< script src = " assets/plugins/slick/slick.min.js " ></ script >
<!-- Option Switcher -->
< script src = " assets/plugins/options-sidebar/optionswitcher.js " ></ script >
<!-- Ekka Custom -->
< script src = " assets/js/ekka.js " ></ script >
</ body >
</ html >
