%PDF- %GIF98; %PNG;
Server : ApacheSystem : Linux sh00666.bluehost.com 5.14.0-687.26.1.el9_8.x86_64 #1 SMP PREEMPT_DYNAMIC Tue Jul 14 16:32:02 EDT 2026 x86_64 User : ndkhermy ( 1200) PHP Version : 8.5.12 Disable Function : NONE Directory : /home1/ndkhermy/www/website_6ca89795/admin/ |
Upload File : |
<?php
session_start();
/*
|--------------------------------------------------------------------------
| ADMIN AUTH CHECK
|--------------------------------------------------------------------------
*/
if (!isset($_SESSION["username"])) {
header('Location: ../admin.php');
exit;
}
include('header.php');
include("../dbcon.php");
/*
|--------------------------------------------------------------------------
| HELPERS
|--------------------------------------------------------------------------
*/
function e($value)
{
return htmlspecialchars(
(string)$value,
ENT_QUOTES,
'UTF-8'
);
}
function tableExists($conn, $table)
{
$table = mysqli_real_escape_string($conn, $table);
$qry = mysqli_query(
$conn,
"SHOW TABLES LIKE '$table'"
);
return $qry && mysqli_num_rows($qry) > 0;
}
function columnExists($conn, $table, $column)
{
$table = mysqli_real_escape_string($conn, $table);
$column = mysqli_real_escape_string($conn, $column);
$qry = mysqli_query(
$conn,
"SHOW COLUMNS
FROM `$table`
LIKE '$column'"
);
return $qry && mysqli_num_rows($qry) > 0;
}
function getCount($conn, $sql)
{
$qry = mysqli_query($conn, $sql);
if ($qry) {
$row = mysqli_fetch_assoc($qry);
return (int)($row['total'] ?? 0);
}
return 0;
}
function getAmount($conn, $sql)
{
$qry = mysqli_query($conn, $sql);
if ($qry) {
$row = mysqli_fetch_assoc($qry);
return (float)($row['amount'] ?? 0);
}
return 0;
}
function money($amount, $symbol = '€')
{
return $symbol . number_format(
(float)$amount,
2
);
}
function orderBadge($status)
{
$status = strtolower(trim((string)$status));
switch ($status) {
case 'pending':
return [
'class' => 'status-warning',
'icon' => 'fa-clock',
'label' => 'Pending'
];
case 'processing':
return [
'class' => 'status-info',
'icon' => 'fa-gears',
'label' => 'Processing'
];
case 'shipped':
return [
'class' => 'status-primary',
'icon' => 'fa-truck-fast',
'label' => 'Shipped'
];
case 'delivered':
case 'completed':
return [
'class' => 'status-success',
'icon' => 'fa-circle-check',
'label' => ucfirst($status)
];
case 'cancelled':
case 'canceled':
return [
'class' => 'status-danger',
'icon' => 'fa-circle-xmark',
'label' => 'Cancelled'
];
default:
return [
'class' => 'status-secondary',
'icon' => 'fa-circle-info',
'label' => $status
? ucfirst($status)
: 'Unknown'
];
}
}
/*
|--------------------------------------------------------------------------
| TABLE DETECTION
|--------------------------------------------------------------------------
*/
$hasUsers = tableExists($conn, 'user');
$hasProducts = tableExists($conn, 'areawecover');
$hasCategories = tableExists($conn, 'arawecovercategory');
$hasOrders = tableExists($conn, 'orders');
$hasOrderItems = tableExists($conn, 'order_items');
$hasCart = tableExists($conn, 'cart_items');
$hasWishlist = tableExists($conn, 'wishlist_items');
$hasNotify = tableExists($conn, 'notify_me');
$hasAddresses = tableExists($conn, 'user_address');
$hasPasswordResets = tableExists($conn, 'password_resets');
$hasContacts = tableExists($conn, 'contact_messages');
/*
|--------------------------------------------------------------------------
| CURRENCY SETTINGS
|--------------------------------------------------------------------------
*/
$currency_symbol = '€';
$currency_code = 'EUR';
if (tableExists($conn, 'app_setting')) {
$settingQry = mysqli_query(
$conn,
"SELECT *
FROM app_setting
LIMIT 1"
);
if ($settingQry && mysqli_num_rows($settingQry) > 0) {
$setting = mysqli_fetch_assoc($settingQry);
if (!empty($setting['currency_symbol'])) {
$currency_symbol = $setting['currency_symbol'];
}
if (!empty($setting['currency_code'])) {
$currency_code = $setting['currency_code'];
}
}
}
/*
|--------------------------------------------------------------------------
| USERS ANALYTICS
|--------------------------------------------------------------------------
*/
$total_users = 0;
$today_users = 0;
$social_users = 0;
$google_users = 0;
$facebook_users = 0;
if ($hasUsers) {
$total_users = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user"
);
if (columnExists($conn, 'user', 'created_date')) {
$today_users = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user
WHERE DATE(created_date) = CURDATE()"
);
}
if (columnExists($conn, 'user', 'social_type')) {
$social_users = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user
WHERE social_type IS NOT NULL
AND social_type != ''"
);
$google_users = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user
WHERE LOWER(social_type) = 'google'"
);
$facebook_users = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user
WHERE LOWER(social_type) = 'facebook'"
);
}
}
/*
|--------------------------------------------------------------------------
| PRODUCT ANALYTICS
|--------------------------------------------------------------------------
*/
$total_products = 0;
$active_products = 0;
$out_of_stock = 0;
$low_stock = 0;
$total_categories = 0;
if ($hasProducts) {
$total_products = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM areawecover"
);
if (columnExists($conn, 'areawecover', 'status')) {
$active_products = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM areawecover
WHERE status = '1'"
);
}
if (columnExists($conn, 'areawecover', 'stock')) {
$out_of_stock = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM areawecover
WHERE stock <= 0"
);
$low_stock = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM areawecover
WHERE stock > 0
AND stock <= 5"
);
}
}
if ($hasCategories) {
$total_categories = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM arawecovercategory"
);
}
/*
|--------------------------------------------------------------------------
| ORDER ANALYTICS
|--------------------------------------------------------------------------
*/
$total_orders = 0;
$today_orders = 0;
$pending_orders = 0;
$processing_orders = 0;
$shipped_orders = 0;
$delivered_orders = 0;
$cancelled_orders = 0;
$total_revenue = 0;
$today_revenue = 0;
$average_order = 0;
$online_orders = 0;
$cod_orders = 0;
if ($hasOrders) {
$total_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders"
);
if (columnExists($conn, 'orders', 'created_at')) {
$today_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE DATE(created_at) = CURDATE()"
);
}
if (columnExists($conn, 'orders', 'order_status')) {
$pending_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(order_status) = 'pending'"
);
$processing_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(order_status) = 'processing'"
);
$shipped_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(order_status) = 'shipped'"
);
$delivered_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(order_status)
IN ('delivered','completed')"
);
$cancelled_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(order_status)
IN ('cancelled','canceled')"
);
}
if (columnExists($conn, 'orders', 'total_amount')) {
$total_revenue = getAmount(
$conn,
"SELECT
COALESCE(SUM(total_amount), 0)
AS amount
FROM orders
WHERE LOWER(order_status)
NOT IN ('cancelled','canceled')"
);
if (columnExists($conn, 'orders', 'created_at')) {
$today_revenue = getAmount(
$conn,
"SELECT
COALESCE(SUM(total_amount), 0)
AS amount
FROM orders
WHERE DATE(created_at) = CURDATE()
AND LOWER(order_status)
NOT IN ('cancelled','canceled')"
);
}
if ($total_orders > 0) {
$average_order =
$total_revenue / $total_orders;
}
}
if (columnExists($conn, 'orders', 'payment_type')) {
$online_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(payment_type) = 'online'"
);
$cod_orders = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM orders
WHERE LOWER(payment_type) = 'cod'"
);
}
}
/*
|--------------------------------------------------------------------------
| CART / WISHLIST / NOTIFY / ADDRESS
|--------------------------------------------------------------------------
*/
$total_cart_items = 0;
$total_wishlist = 0;
$total_notify = 0;
$total_addresses = 0;
$pending_otp = 0;
$total_contacts = 0;
if ($hasCart) {
$total_cart_items = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM cart_items"
);
}
if ($hasWishlist) {
$total_wishlist = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM wishlist_items"
);
}
if ($hasNotify) {
$total_notify = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM notify_me"
);
}
if ($hasAddresses) {
$total_addresses = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM user_address"
);
}
if ($hasPasswordResets) {
$pending_otp = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM password_resets
WHERE is_verified = '0'"
);
}
if ($hasContacts) {
$total_contacts = getCount(
$conn,
"SELECT COUNT(*) AS total
FROM contact_messages"
);
}
/*
|--------------------------------------------------------------------------
| PERFORMANCE RATES
|--------------------------------------------------------------------------
*/
$completion_rate = 0;
$cancellation_rate = 0;
if ($total_orders > 0) {
$completion_rate = round(
($delivered_orders / $total_orders) * 100,
1
);
$cancellation_rate = round(
($cancelled_orders / $total_orders) * 100,
1
);
}
/*
|--------------------------------------------------------------------------
| LAST 6 MONTHS CHART
|--------------------------------------------------------------------------
*/
$months_array = [];
$orders_trend = [];
$revenue_trend = [];
$cancel_trend = [];
$monthMap = [];
for ($i = 5; $i >= 0; $i--) {
$monthKey = date(
'Y-m',
strtotime("-$i months")
);
$monthLabel = date(
'M Y',
strtotime("-$i months")
);
$months_array[] = $monthLabel;
$monthMap[$monthKey] = [
'orders' => 0,
'revenue' => 0,
'cancelled' => 0
];
}
if (
$hasOrders &&
columnExists($conn, 'orders', 'created_at')
) {
$revenueExpression =
columnExists($conn, 'orders', 'total_amount')
? "COALESCE(SUM(total_amount), 0)"
: "0";
$cancelExpression =
columnExists($conn, 'orders', 'order_status')
? "
SUM(
CASE
WHEN LOWER(order_status)
IN ('cancelled','canceled')
THEN 1
ELSE 0
END
)
"
: "0";
$trendQry = mysqli_query(
$conn,
"
SELECT
DATE_FORMAT(created_at, '%Y-%m')
AS month_key,
COUNT(*) AS total_orders,
$revenueExpression
AS total_revenue,
$cancelExpression
AS cancelled_orders
FROM orders
WHERE created_at >=
DATE_FORMAT(
DATE_SUB(
CURDATE(),
INTERVAL 5 MONTH
),
'%Y-%m-01'
)
GROUP BY
YEAR(created_at),
MONTH(created_at)
ORDER BY
YEAR(created_at) ASC,
MONTH(created_at) ASC
"
);
if ($trendQry) {
while ($row = mysqli_fetch_assoc($trendQry)) {
$key = $row['month_key'];
if (isset($monthMap[$key])) {
$monthMap[$key]['orders'] =
(int)$row['total_orders'];
$monthMap[$key]['revenue'] =
(float)$row['total_revenue'];
$monthMap[$key]['cancelled'] =
(int)$row['cancelled_orders'];
}
}
}
}
foreach ($monthMap as $monthData) {
$orders_trend[] =
$monthData['orders'];
$revenue_trend[] =
$monthData['revenue'];
$cancel_trend[] =
$monthData['cancelled'];
}
/*
|--------------------------------------------------------------------------
| RECENT ORDERS
|--------------------------------------------------------------------------
*/
$recentOrders = [];
if ($hasOrders) {
$selectFields = "
id,
user_id
";
$selectFields .=
columnExists($conn, 'orders', 'unique_order_id')
? ", unique_order_id"
: ", id AS unique_order_id";
$selectFields .=
columnExists($conn, 'orders', 'full_name')
? ", full_name"
: ", '' AS full_name";
$selectFields .=
columnExists($conn, 'orders', 'total_amount')
? ", total_amount"
: ", 0 AS total_amount";
$selectFields .=
columnExists($conn, 'orders', 'payment_type')
? ", payment_type"
: ", '' AS payment_type";
$selectFields .=
columnExists($conn, 'orders', 'order_status')
? ", order_status"
: ", '' AS order_status";
$selectFields .=
columnExists($conn, 'orders', 'created_at')
? ", created_at"
: ", NOW() AS created_at";
$recentQry = mysqli_query(
$conn,
"
SELECT
$selectFields
FROM orders
ORDER BY id DESC
LIMIT 7
"
);
if ($recentQry) {
while ($row = mysqli_fetch_assoc($recentQry)) {
$recentOrders[] = $row;
}
}
}
/*
|--------------------------------------------------------------------------
| LOW STOCK PRODUCTS
|--------------------------------------------------------------------------
*/
$lowStockProducts = [];
if (
$hasProducts &&
columnExists($conn, 'areawecover', 'stock')
) {
$lowStockQry = mysqli_query(
$conn,
"
SELECT
id,
title,
stock,
price,
image
FROM areawecover
WHERE stock <= 5
ORDER BY stock ASC, id DESC
LIMIT 5
"
);
if ($lowStockQry) {
while ($row = mysqli_fetch_assoc($lowStockQry)) {
$lowStockProducts[] = $row;
}
}
}
/*
|--------------------------------------------------------------------------
| RECENT USERS
|--------------------------------------------------------------------------
*/
$recentUsers = [];
if ($hasUsers) {
$userDateField =
columnExists($conn, 'user', 'created_date')
? "created_date"
: "NULL AS created_date";
$profileField =
columnExists($conn, 'user', 'profile_image')
? "profile_image"
: "'' AS profile_image";
$socialField =
columnExists($conn, 'user', 'social_type')
? "social_type"
: "'' AS social_type";
$recentUserQry = mysqli_query(
$conn,
"
SELECT
id,
username,
email,
phone,
$profileField,
$socialField,
$userDateField
FROM user
ORDER BY id DESC
LIMIT 5
"
);
if ($recentUserQry) {
while ($row = mysqli_fetch_assoc($recentUserQry)) {
$recentUsers[] = $row;
}
}
}
?>
<!-- ==========================================================
FONT AWESOME
========================================================== -->
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
>
<style>
/* ==========================================================
HIGH LEVEL ADMIN DASHBOARD
========================================================== */
:root {
--primary: #696cff;
--primary-soft: rgba(105,108,255,.12);
--success: #28c76f;
--success-soft: rgba(40,199,111,.12);
--danger: #ea5455;
--danger-soft: rgba(234,84,85,.12);
--warning: #ff9f43;
--warning-soft: rgba(255,159,67,.14);
--info: #00cfe8;
--info-soft: rgba(0,207,232,.12);
--dark: #2f3349;
--muted: #8a8d93;
--border: #ebeef2;
--page-bg: #f7f7fb;
}
.dashboard-page {
background: var(--page-bg);
min-height: 100vh;
}
.dashboard-container {
padding: 28px;
}
.dashboard-page a {
text-decoration: none !important;
}
/* HERO */
.dashboard-hero {
background:
linear-gradient(
135deg,
#696cff 0%,
#5b5eea 55%,
#7367f0 100%
);
border-radius: 20px;
padding: 30px;
color: #fff;
position: relative;
overflow: hidden;
box-shadow:
0 15px 35px
rgba(105,108,255,.22);
}
.dashboard-hero::before {
content: "";
position: absolute;
width: 280px;
height: 280px;
border-radius: 50%;
background:
rgba(255,255,255,.08);
right: -80px;
top: -140px;
}
.dashboard-hero::after {
content: "";
position: absolute;
width: 170px;
height: 170px;
border-radius: 50%;
background:
rgba(255,255,255,.06);
right: 180px;
bottom: -120px;
}
.hero-content {
position: relative;
z-index: 2;
}
.hero-title {
font-size: 27px;
font-weight: 800;
margin-bottom: 7px;
}
.hero-subtitle {
opacity: .85;
font-size: 14px;
margin: 0;
}
.hero-chip {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 15px;
border-radius: 12px;
background:
rgba(255,255,255,.14);
border:
1px solid
rgba(255,255,255,.18);
backdrop-filter: blur(8px);
font-size: 13px;
}
/* METRIC CARD */
.metric-card {
border: 0;
border-radius: 17px;
background: #fff;
height: 100%;
box-shadow:
0 5px 20px
rgba(47,51,73,.06);
transition:
transform .25s ease,
box-shadow .25s ease;
}
.metric-card:hover {
transform:
translateY(-5px);
box-shadow:
0 15px 32px
rgba(47,51,73,.11);
}
.metric-card .card-body {
padding: 22px;
}
.metric-label {
font-size: 11px;
font-weight: 800;
color: var(--muted);
text-transform: uppercase;
letter-spacing: .06em;
}
.metric-value {
font-size: 28px;
line-height: 1.2;
font-weight: 800;
color: var(--dark);
margin-top: 10px;
}
.metric-note {
font-size: 12px;
color: var(--muted);
margin-top: 7px;
}
.metric-icon {
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 14px;
font-size: 20px;
}
.icon-primary {
color: var(--primary);
background: var(--primary-soft);
}
.icon-success {
color: var(--success);
background: var(--success-soft);
}
.icon-danger {
color: var(--danger);
background: var(--danger-soft);
}
.icon-warning {
color: var(--warning);
background: var(--warning-soft);
}
.icon-info {
color: var(--info);
background: var(--info-soft);
}
/* PREMIUM CARD */
.premium-card {
border: 0;
border-radius: 17px;
background: #fff;
box-shadow:
0 5px 20px
rgba(47,51,73,.06);
overflow: hidden;
}
.premium-header {
padding: 20px 22px;
background: #fff;
border-bottom:
1px solid var(--border);
}
.section-title {
font-size: 16px;
font-weight: 800;
color: var(--dark);
margin: 0;
}
.section-subtitle {
font-size: 12px;
color: var(--muted);
margin-top: 4px;
}
/* MINI CARDS */
.mini-card {
padding: 18px;
border-radius: 15px;
background: #fff;
border:
1px solid #eef0f5;
box-shadow:
0 4px 15px
rgba(47,51,73,.04);
}
.mini-value {
font-size: 21px;
font-weight: 800;
color: var(--dark);
}
.mini-label {
font-size: 11px;
color: var(--muted);
margin-top: 3px;
}
/* TABLE */
.dashboard-table {
margin-bottom: 0;
}
.dashboard-table thead th {
border: 0;
background: #fafafe;
color: #7d8089;
font-size: 11px;
text-transform: uppercase;
letter-spacing: .045em;
padding: 14px 18px;
white-space: nowrap;
}
.dashboard-table tbody td {
padding: 16px 18px;
border-color: #f0f1f5;
vertical-align: middle;
}
.order-number {
font-weight: 800;
color: var(--primary);
}
/* STATUS */
.status-badge {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 7px 11px;
border-radius: 30px;
font-size: 11px;
font-weight: 700;
white-space: nowrap;
}
.status-warning {
color: #b76e00;
background: var(--warning-soft);
}
.status-info {
color: #008ca0;
background: var(--info-soft);
}
.status-primary {
color: #5255d9;
background: var(--primary-soft);
}
.status-success {
color: #168a4c;
background: var(--success-soft);
}
.status-danger {
color: #c63d3e;
background: var(--danger-soft);
}
.status-secondary {
color: #6c757d;
background: rgba(108,117,125,.12);
}
/* QUICK ACTION */
.quick-action {
padding: 14px;
border-radius: 14px;
border:
1px solid #eef0f5;
background: #fafafe;
color: var(--dark);
transition: all .25s ease;
}
.quick-action:hover {
transform:
translateX(4px);
background: #fff;
border-color:
rgba(105,108,255,.25);
box-shadow:
0 8px 18px
rgba(47,51,73,.07);
}
.quick-icon {
width: 43px;
height: 43px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
}
/* PRODUCT IMAGE */
.product-thumb {
width: 45px;
height: 45px;
object-fit: cover;
border-radius: 11px;
border:
1px solid #eee;
}
/* USER AVATAR */
.user-avatar {
width: 42px;
height: 42px;
border-radius: 50%;
object-fit: cover;
background: var(--primary-soft);
display: flex;
align-items: center;
justify-content: center;
color: var(--primary);
font-weight: 800;
}
/* PROGRESS */
.performance-progress {
height: 7px;
background: #f0f1f5;
border-radius: 20px;
overflow: hidden;
}
.performance-bar {
height: 100%;
border-radius: 20px;
}
/* RESPONSIVE */
@media(max-width: 767px) {
.dashboard-container {
padding: 16px;
}
.dashboard-hero {
padding: 22px;
}
.hero-title {
font-size: 21px;
}
.hero-chip {
margin-top: 15px;
}
}
</style>
<div class="content-wrapper dashboard-page">
<div class="container-fluid dashboard-container">
<!-- ==========================================================
HERO
========================================================== -->
<div class="dashboard-hero mb-4">
<div class="hero-content">
<div class="row align-items-center">
<div class="col-lg-8">
<div class="hero-title">
Welcome back,
<?= e($_SESSION["username"]); ?> 👋
</div>
<p class="hero-subtitle">
Monitor customers, products,
orders, payments and store
performance from one place.
</p>
</div>
<div class="col-lg-4 text-lg-end">
<div class="hero-chip">
<i class="fa-regular fa-calendar"></i>
<?= date('l, d M Y'); ?>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
MAIN KPI CARDS
========================================================== -->
<div class="row g-4 mb-4">
<!-- Revenue -->
<div class="col-sm-6 col-xl-3">
<div class="card metric-card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<div class="metric-label">
Total Revenue
</div>
<div class="metric-value">
<?= money(
$total_revenue,
$currency_symbol
); ?>
</div>
<div class="metric-note">
Today:
<span class="text-success fw-bold">
<?= money(
$today_revenue,
$currency_symbol
); ?>
</span>
</div>
</div>
<div class="metric-icon icon-success">
<i class="fa-solid fa-wallet"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Orders -->
<div class="col-sm-6 col-xl-3">
<div class="card metric-card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<div class="metric-label">
Total Orders
</div>
<div class="metric-value">
<?= number_format(
$total_orders
); ?>
</div>
<div class="metric-note">
<span class="text-primary fw-bold">
<?= number_format(
$today_orders
); ?>
</span>
orders today
</div>
</div>
<div class="metric-icon icon-primary">
<i class="fa-solid fa-bag-shopping"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Users -->
<div class="col-sm-6 col-xl-3">
<div class="card metric-card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<div class="metric-label">
Customers
</div>
<div class="metric-value">
<?= number_format(
$total_users
); ?>
</div>
<div class="metric-note">
<span class="text-success fw-bold">
<?= number_format(
$today_users
); ?>
</span>
joined today
</div>
</div>
<div class="metric-icon icon-info">
<i class="fa-solid fa-users"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Products -->
<div class="col-sm-6 col-xl-3">
<div class="card metric-card">
<div class="card-body">
<div class="d-flex justify-content-between">
<div>
<div class="metric-label">
Products
</div>
<div class="metric-value">
<?= number_format(
$total_products
); ?>
</div>
<div class="metric-note">
<span class="text-danger fw-bold">
<?= number_format(
$out_of_stock
); ?>
</span>
out of stock
</div>
</div>
<div class="metric-icon icon-warning">
<i class="fa-solid fa-box-open"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
SECONDARY API MODULE METRICS
========================================================== -->
<div class="row g-4 mb-4">
<div class="col-md-6 col-xl-3">
<div class="mini-card">
<div class="d-flex align-items-center gap-3">
<div class="metric-icon icon-warning">
<i class="fa-solid fa-cart-shopping"></i>
</div>
<div>
<div class="mini-value">
<?= number_format(
$total_cart_items
); ?>
</div>
<div class="mini-label">
Active Cart Items
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="mini-card">
<div class="d-flex align-items-center gap-3">
<div class="metric-icon icon-danger">
<i class="fa-solid fa-heart"></i>
</div>
<div>
<div class="mini-value">
<?= number_format(
$total_wishlist
); ?>
</div>
<div class="mini-label">
Wishlist Items
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="mini-card">
<div class="d-flex align-items-center gap-3">
<div class="metric-icon icon-info">
<i class="fa-solid fa-bell"></i>
</div>
<div>
<div class="mini-value">
<?= number_format(
$total_notify
); ?>
</div>
<div class="mini-label">
Notify Me Requests
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-xl-3">
<div class="mini-card">
<div class="d-flex align-items-center gap-3">
<div class="metric-icon icon-primary">
<i class="fa-solid fa-location-dot"></i>
</div>
<div>
<div class="mini-value">
<?= number_format(
$total_addresses
); ?>
</div>
<div class="mini-label">
Saved Addresses
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
ANALYTICS CHART + ORDER HEALTH
========================================================== -->
<div class="row g-4 mb-4">
<!-- Chart -->
<div class="col-xl-8">
<div class="premium-card h-100">
<div class="premium-header">
<div class="d-flex
justify-content-between
align-items-center">
<div>
<h5 class="section-title">
<i class="fa-solid
fa-chart-line
text-primary
me-2"></i>
Store Performance
</h5>
<div class="section-subtitle">
Orders, revenue and cancellations
for last 6 months
</div>
</div>
<span class="badge
bg-primary
bg-opacity-10
text-primary
rounded-pill
px-3 py-2">
<?= e($currency_code); ?>
</span>
</div>
</div>
<div class="card-body">
<div
id="storeAnalyticsChart"
style="min-height:370px;"
></div>
</div>
</div>
</div>
<!-- Health -->
<div class="col-xl-4">
<div class="premium-card h-100">
<div class="premium-header">
<h5 class="section-title">
<i class="fa-solid
fa-gauge-high
text-success
me-2"></i>
Order Health
</h5>
<div class="section-subtitle">
Current store operations
</div>
</div>
<div class="card-body p-4">
<!-- Completion -->
<div class="mb-4">
<div class="d-flex
justify-content-between
mb-2">
<span class="small fw-bold">
Completion Rate
</span>
<span class="small
fw-bold
text-success">
<?= e($completion_rate); ?>%
</span>
</div>
<div class="performance-progress">
<div
class="performance-bar bg-success"
style="width:
<?= min(
100,
$completion_rate
); ?>%;"
></div>
</div>
</div>
<!-- Cancellation -->
<div class="mb-4">
<div class="d-flex
justify-content-between
mb-2">
<span class="small fw-bold">
Cancellation Rate
</span>
<span class="small
fw-bold
text-danger">
<?= e(
$cancellation_rate
); ?>%
</span>
</div>
<div class="performance-progress">
<div
class="performance-bar bg-danger"
style="width:
<?= min(
100,
$cancellation_rate
); ?>%;"
></div>
</div>
</div>
<hr class="my-4">
<div class="row g-3">
<div class="col-6">
<div class="mini-card">
<div class="mini-value text-warning">
<?= number_format(
$pending_orders
); ?>
</div>
<div class="mini-label">
Pending
</div>
</div>
</div>
<div class="col-6">
<div class="mini-card">
<div class="mini-value text-info">
<?= number_format(
$processing_orders
); ?>
</div>
<div class="mini-label">
Processing
</div>
</div>
</div>
<div class="col-6">
<div class="mini-card">
<div class="mini-value text-primary">
<?= number_format(
$shipped_orders
); ?>
</div>
<div class="mini-label">
Shipped
</div>
</div>
</div>
<div class="col-6">
<div class="mini-card">
<div class="mini-value text-success">
<?= number_format(
$delivered_orders
); ?>
</div>
<div class="mini-label">
Completed
</div>
</div>
</div>
</div>
<hr class="my-4">
<div class="d-flex
justify-content-between
align-items-center">
<div>
<div class="small text-muted">
Average Order Value
</div>
<div class="fw-bold fs-4">
<?= money(
$average_order,
$currency_symbol
); ?>
</div>
</div>
<div class="metric-icon icon-success">
<i class="fa-solid fa-chart-pie"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
RECENT ORDERS + QUICK ACTIONS
========================================================== -->
<div class="row g-4 mb-4">
<!-- Recent Orders -->
<div class="col-xl-8">
<div class="premium-card">
<div class="premium-header">
<div class="d-flex
justify-content-between
align-items-center">
<div>
<h5 class="section-title">
<i class="fa-solid
fa-clock-rotate-left
text-primary
me-2"></i>
Recent Orders
</h5>
<div class="section-subtitle">
Latest customer order activity
</div>
</div>
<a
href="orders.php"
class="btn
btn-sm
btn-primary
rounded-pill
px-3"
>
View All
</a>
</div>
</div>
<div class="table-responsive">
<table class="table dashboard-table">
<thead>
<tr>
<th>Order</th>
<th>Customer</th>
<th>Payment</th>
<th>Status</th>
<th>Amount</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<?php if (!empty($recentOrders)): ?>
<?php foreach ($recentOrders as $order): ?>
<?php
$badge = orderBadge(
$order['order_status']
);
?>
<tr>
<td>
<div class="order-number">
#<?= e(
$order['unique_order_id']
); ?>
</div>
<small class="text-muted">
ID:
<?= (int)$order['id']; ?>
</small>
</td>
<td>
<div class="fw-semibold">
<?= e(
$order['full_name']
?: 'Customer'
); ?>
</div>
<small class="text-muted">
User ID:
<?= (int)$order['user_id']; ?>
</small>
</td>
<td>
<span class="badge
bg-light
text-dark
rounded-pill">
<?= e(
strtoupper(
$order['payment_type']
)
); ?>
</span>
</td>
<td>
<span class="
status-badge
<?= e(
$badge['class']
); ?>
">
<i class="fa-solid
<?= e(
$badge['icon']
); ?>"></i>
<?= e(
$badge['label']
); ?>
</span>
</td>
<td>
<strong>
<?= money(
$order['total_amount'],
$currency_symbol
); ?>
</strong>
</td>
<td>
<div class="small fw-semibold">
<?= date(
'd M Y',
strtotime(
$order['created_at']
)
); ?>
</div>
<small class="text-muted">
<?= date(
'h:i A',
strtotime(
$order['created_at']
)
); ?>
</small>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td
colspan="6"
class="text-center
py-5
text-muted"
>
<i class="fa-solid
fa-box-open
fa-2x
mb-3"></i>
<div class="fw-bold">
No Orders Found
</div>
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</div>
</div>
<!-- Quick Actions -->
<div class="col-xl-4">
<div class="premium-card h-100">
<div class="premium-header">
<h5 class="section-title">
<i class="fa-solid
fa-bolt
text-warning
me-2"></i>
Quick Actions
</h5>
<div class="section-subtitle">
Manage important store modules
</div>
</div>
<div class="card-body p-4">
<div class="d-grid gap-3">
<a
href="orders.php"
class="quick-action"
>
<div class="d-flex
align-items-center
justify-content-between">
<div class="d-flex
align-items-center
gap-3">
<div class="
quick-icon
icon-primary
">
<i class="fa-solid
fa-bag-shopping"></i>
</div>
<div>
<div class="fw-bold small">
Manage Orders
</div>
<small class="text-muted">
<?= number_format(
$pending_orders
); ?>
pending orders
</small>
</div>
</div>
<i class="fa-solid
fa-chevron-right
text-muted"></i>
</div>
</a>
<a
href="product.php"
class="quick-action"
>
<div class="d-flex
align-items-center
justify-content-between">
<div class="d-flex
align-items-center
gap-3">
<div class="
quick-icon
icon-success
">
<i class="fa-solid
fa-boxes-stacked"></i>
</div>
<div>
<div class="fw-bold small">
Manage Products
</div>
<small class="text-muted">
<?= number_format(
$low_stock
); ?>
low stock items
</small>
</div>
</div>
<i class="fa-solid
fa-chevron-right
text-muted"></i>
</div>
</a>
<a
href="users.php"
class="quick-action"
>
<div class="d-flex
align-items-center
justify-content-between">
<div class="d-flex
align-items-center
gap-3">
<div class="
quick-icon
icon-info
">
<i class="fa-solid
fa-users"></i>
</div>
<div>
<div class="fw-bold small">
Customers
</div>
<small class="text-muted">
<?= number_format(
$total_users
); ?>
registered users
</small>
</div>
</div>
<i class="fa-solid
fa-chevron-right
text-muted"></i>
</div>
</a>
<div class="quick-action">
<div class="d-flex
align-items-center
justify-content-between">
<div class="d-flex
align-items-center
gap-3">
<div class="
quick-icon
icon-warning
">
<i class="fa-solid
fa-key"></i>
</div>
<div>
<div class="fw-bold small">
Pending OTP
</div>
<small class="text-muted">
<?= number_format(
$pending_otp
); ?>
reset requests
</small>
</div>
</div>
<span class="badge
bg-warning
text-dark
rounded-pill">
Live
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
LOW STOCK + CUSTOMER ACTIVITY
========================================================== -->
<div class="row g-4">
<!-- Low Stock -->
<div class="col-xl-6">
<div class="premium-card h-100">
<div class="premium-header">
<h5 class="section-title">
<i class="fa-solid
fa-triangle-exclamation
text-warning
me-2"></i>
Stock Attention
</h5>
<div class="section-subtitle">
Products requiring inventory action
</div>
</div>
<div class="table-responsive">
<table class="table dashboard-table">
<thead>
<tr>
<th>Product</th>
<th>Stock</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<?php if (!empty($lowStockProducts)): ?>
<?php foreach ($lowStockProducts as $product): ?>
<tr>
<td>
<div class="d-flex
align-items-center
gap-3">
<?php if (!empty($product['image'])): ?>
<img
src="../admin/dataimg/<?= e(
$product['image']
); ?>"
class="product-thumb"
alt=""
>
<?php else: ?>
<div class="
product-thumb
d-flex
align-items-center
justify-content-center
bg-light
">
<i class="fa-solid
fa-image
text-muted"></i>
</div>
<?php endif; ?>
<div>
<div class="fw-bold small">
<?= e(
$product['title']
); ?>
</div>
<small class="text-muted">
Product ID:
<?= (int)$product['id']; ?>
</small>
</div>
</div>
</td>
<td>
<?php if ((int)$product['stock'] <= 0): ?>
<span class="
status-badge
status-danger
">
Sold Out
</span>
<?php else: ?>
<span class="
status-badge
status-warning
">
<?= (int)$product['stock']; ?>
left
</span>
<?php endif; ?>
</td>
<td>
<strong>
<?= money(
$product['price'],
$currency_symbol
); ?>
</strong>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td
colspan="3"
class="text-center
py-5
text-muted"
>
No low stock products
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</div>
</div>
<!-- Recent Users -->
<div class="col-xl-6">
<div class="premium-card h-100">
<div class="premium-header">
<h5 class="section-title">
<i class="fa-solid
fa-user-plus
text-info
me-2"></i>
Recent Customers
</h5>
<div class="section-subtitle">
Latest registered and social users
</div>
</div>
<div class="table-responsive">
<table class="table dashboard-table">
<thead>
<tr>
<th>Customer</th>
<th>Login Type</th>
<th>Joined</th>
</tr>
</thead>
<tbody>
<?php if (!empty($recentUsers)): ?>
<?php foreach ($recentUsers as $customer): ?>
<tr>
<td>
<div class="d-flex
align-items-center
gap-3">
<?php if (!empty($customer['profile_image'])): ?>
<img
src="<?= e(
$customer['profile_image']
); ?>"
class="user-avatar"
alt=""
>
<?php else: ?>
<div class="user-avatar">
<?= e(
strtoupper(
substr(
$customer['username']
?: 'U',
0,
1
)
)
); ?>
</div>
<?php endif; ?>
<div>
<div class="fw-bold small">
<?= e(
$customer['username']
?: 'User'
); ?>
</div>
<small class="text-muted">
<?= e(
$customer['email']
); ?>
</small>
</div>
</div>
</td>
<td>
<?php
$socialType =
strtolower(
trim(
$customer['social_type']
)
);
?>
<?php if ($socialType === 'google'): ?>
<span class="badge
bg-danger
bg-opacity-10
text-danger
rounded-pill">
<i class="fa-brands
fa-google
me-1"></i>
Google
</span>
<?php elseif ($socialType === 'facebook'): ?>
<span class="badge
bg-primary
bg-opacity-10
text-primary
rounded-pill">
<i class="fa-brands
fa-facebook
me-1"></i>
Facebook
</span>
<?php else: ?>
<span class="badge
bg-light
text-dark
rounded-pill">
Email
</span>
<?php endif; ?>
</td>
<td>
<?php if (!empty($customer['created_date'])): ?>
<div class="small fw-semibold">
<?= date(
'd M Y',
strtotime(
$customer['created_date']
)
); ?>
</div>
<?php else: ?>
<small class="text-muted">
-
</small>
<?php endif; ?>
</td>
</tr>
<?php endforeach; ?>
<?php else: ?>
<tr>
<td
colspan="3"
class="text-center
py-5
text-muted"
>
No customers found
</td>
</tr>
<?php endif; ?>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- ==========================================================
API ECOSYSTEM SNAPSHOT
========================================================== -->
<div class="row g-4 mt-1">
<div class="col-12">
<div class="premium-card">
<div class="premium-header">
<h5 class="section-title">
<i class="fa-solid
fa-layer-group
text-primary
me-2"></i>
Mobile App Ecosystem Snapshot
</h5>
<div class="section-subtitle">
Live usage indicators from implemented APIs
</div>
</div>
<div class="card-body p-4">
<div class="row g-3">
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-primary">
<?= number_format(
$social_users
); ?>
</div>
<div class="mini-label">
Social Users
</div>
</div>
</div>
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-danger">
<?= number_format(
$google_users
); ?>
</div>
<div class="mini-label">
Google Login
</div>
</div>
</div>
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-primary">
<?= number_format(
$facebook_users
); ?>
</div>
<div class="mini-label">
Facebook Login
</div>
</div>
</div>
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-success">
<?= number_format(
$online_orders
); ?>
</div>
<div class="mini-label">
Online Orders
</div>
</div>
</div>
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-warning">
<?= number_format(
$cod_orders
); ?>
</div>
<div class="mini-label">
COD Orders
</div>
</div>
</div>
<div class="col-6 col-md-3 col-xl-2">
<div class="mini-card text-center">
<div class="mini-value text-info">
<?= number_format(
$total_contacts
); ?>
</div>
<div class="mini-label">
Enquiries
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ==========================================================
JS
========================================================== -->
<script src="../assets/vendor/libs/jquery/jquery.js"></script>
<script src="../assets/vendor/js/bootstrap.js"></script>
<script src="../assets/vendor/libs/apex-charts/apexcharts.js"></script>
<script src="../assets/js/main.js"></script>
<!-- ==========================================================
HIGH LEVEL CHART
========================================================== -->
<script>
document.addEventListener(
"DOMContentLoaded",
function () {
const chartElement =
document.querySelector(
"#storeAnalyticsChart"
);
if (!chartElement) {
return;
}
const options = {
series: [
{
name: "Orders",
type: "column",
data:
<?= json_encode(
$orders_trend,
JSON_NUMERIC_CHECK
); ?>
},
{
name: "Revenue",
type: "area",
data:
<?= json_encode(
$revenue_trend,
JSON_NUMERIC_CHECK
); ?>
},
{
name: "Cancelled",
type: "line",
data:
<?= json_encode(
$cancel_trend,
JSON_NUMERIC_CHECK
); ?>
}
],
chart: {
height: 370,
type: "line",
stacked: false,
toolbar: {
show: false
},
zoom: {
enabled: false
},
fontFamily:
"Public Sans, sans-serif"
},
colors: [
"#696cff",
"#28c76f",
"#ea5455"
],
stroke: {
width: [
0,
3,
3
],
curve: "smooth"
},
plotOptions: {
bar: {
columnWidth: "38%",
borderRadius: 6
}
},
fill: {
opacity: [
1,
.18,
1
],
gradient: {
shadeIntensity: 1,
opacityFrom: .35,
opacityTo: .05,
stops: [
0,
90,
100
]
}
},
dataLabels: {
enabled: false
},
markers: {
size: [
0,
4,
4
],
strokeWidth: 0,
hover: {
size: 7
}
},
xaxis: {
categories:
<?= json_encode(
$months_array
); ?>,
labels: {
style: {
colors: "#8a8d93",
fontSize: "12px"
}
},
axisBorder: {
show: false
},
axisTicks: {
show: false
}
},
yaxis: [
{
title: {
text: "Orders"
},
min: 0,
labels: {
formatter:
function (value) {
return Math.round(
value
);
}
}
},
{
opposite: true,
title: {
text:
"Revenue (<?= e(
$currency_symbol
); ?>)"
},
min: 0,
labels: {
formatter:
function (value) {
return "<?= e(
$currency_symbol
); ?>" +
Math.round(value);
}
}
}
],
grid: {
borderColor: "#ebeef2",
strokeDashArray: 5
},
legend: {
position: "top",
horizontalAlign: "right"
},
tooltip: {
shared: true,
intersect: false
},
responsive: [
{
breakpoint: 768,
options: {
chart: {
height: 320
},
legend: {
position: "bottom"
}
}
}
]
};
const chart = new ApexCharts(
chartElement,
options
);
chart.render();
}
);
</script>
</body>
</html>