144 lines
7.9 KiB
PHP
144 lines
7.9 KiB
PHP
<?php
|
|
require_once 'db/config.php';
|
|
$pdo = db();
|
|
$settings = get_company_settings();
|
|
$customer = null;
|
|
$orders = [];
|
|
$points_history = [];
|
|
$error = '';
|
|
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['phone'])) {
|
|
$phone = trim($_POST['phone']);
|
|
$stmt = $pdo->prepare("SELECT * FROM customers WHERE phone = ?");
|
|
$stmt->execute([$phone]);
|
|
$customer = $stmt->fetch(PDO::FETCH_ASSOC);
|
|
if ($customer) {
|
|
$stmt_orders = $pdo->prepare("SELECT o.id, o.created_at, o.total_amount, o.status, o.car_plate, o.ready_time,
|
|
(SELECT GROUP_CONCAT(CONCAT(oi.quantity, 'x ', oi.product_name) SEPARATOR ', ') FROM order_items oi WHERE oi.order_id = o.id) as items_summary
|
|
FROM orders o WHERE o.customer_id = ? ORDER BY o.created_at DESC");
|
|
$stmt_orders->execute([$customer['id']]);
|
|
$orders = $stmt_orders->fetchAll(PDO::FETCH_ASSOC);
|
|
$stmt_points = $pdo->prepare("SELECT * FROM loyalty_points_history WHERE customer_id = ? ORDER BY created_at DESC");
|
|
$stmt_points->execute([$customer['id']]);
|
|
$points_history = $stmt_points->fetchAll(PDO::FETCH_ASSOC);
|
|
} else {
|
|
$error = "Customer not found with this phone number.";
|
|
}
|
|
}
|
|
?>
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
|
|
<title>My Profile - <?= htmlspecialchars($settings['company_name'] ?? 'Order Online') ?></title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<style>
|
|
:root { --primary-color: #2563eb; --bg-light: #f8fafc; --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --primary-font: 'Plus Jakarta Sans', sans-serif; }
|
|
body { background-color: var(--bg-light); font-family: var(--primary-font); color: #1e293b; }
|
|
.hero-section { background: linear-gradient(135deg, #1e293b 0%, #334155 100%); color: white; padding: 2rem 1rem 4rem; border-bottom-left-radius: 2.5rem; border-bottom-right-radius: 2.5rem; margin-bottom: -2rem; text-align: center; }
|
|
.back-btn { position: absolute; top: 1.5rem; left: 1.5rem; color: white; font-size: 1.5rem; }
|
|
.card-custom { background: white; border-radius: 1.25rem; box-shadow: var(--card-shadow); border: none; margin-bottom: 1.5rem; padding: 1.5rem; }
|
|
.points-display { font-size: 2.5rem; font-weight: 700; color: var(--primary-color); }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="hero-section position-relative">
|
|
<a href="online_order.php" class="back-btn"><i class="bi bi-arrow-left"></i></a>
|
|
<h2 class="fw-bold mb-1 mt-2">My Profile</h2>
|
|
<p class="opacity-75 mb-0 small">View orders & loyalty points</p>
|
|
</header>
|
|
<div class="container py-4 position-relative" style="z-index: 10;">
|
|
<?php if (!$customer): ?>
|
|
<div class="card-custom">
|
|
<h4 class="fw-bold mb-3">Login to view profile</h4>
|
|
<?php if ($error): ?>
|
|
<div class="alert alert-danger"><?= htmlspecialchars($error) ?></div>
|
|
<?php endif; ?>
|
|
<form method="POST">
|
|
<div class="mb-3">
|
|
<label class="form-label">Phone Number</label>
|
|
<input type="tel" name="phone" class="form-control form-control-lg" placeholder="Enter your registered phone" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary btn-lg w-100 rounded-pill fw-bold">View Profile</button>
|
|
</form>
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="card-custom text-center">
|
|
<div class="mb-2 text-muted small">Welcome back,</div>
|
|
<h3 class="fw-bold mb-3"><?= htmlspecialchars($customer['name']) ?></h3>
|
|
<div class="d-flex justify-content-center align-items-center gap-3 bg-light rounded-4 py-3 px-4 d-inline-flex mx-auto">
|
|
<div><div class="text-muted small">Available Points</div><div class="points-display"><?= (int)$customer['points'] ?></div></div>
|
|
<i class="bi bi-star-fill text-warning fs-1"></i>
|
|
</div>
|
|
</div>
|
|
<h5 class="fw-bold mb-3 ms-2">Order History</h5>
|
|
<?php if (empty($orders)): ?>
|
|
<p class="text-muted ms-2">No orders found.</p>
|
|
<?php else: ?>
|
|
<?php foreach ($orders as $order): ?>
|
|
<div class="card-custom p-3">
|
|
<div class="d-flex justify-content-between align-items-center mb-2">
|
|
<span class="fw-bold">Order #<?= $order['id'] ?></span>
|
|
<span class="badge bg-<?= $order['status'] === 'completed' ? 'success' : ($order['status'] === 'cancelled' ? 'danger' : 'warning') ?>"><?= ucfirst($order['status']) ?></span>
|
|
</div>
|
|
<div class="text-muted small mb-2"><i class="bi bi-calendar3 me-1"></i> <?= date('M d, Y h:i A', strtotime($order['created_at'])) ?></div>
|
|
<div class="small mb-2"><?= htmlspecialchars($order['items_summary']) ?></div>
|
|
<?php if(!empty($order['car_plate'])): ?><div class="small text-muted mb-2"><i class="bi bi-car-front me-1"></i> <?= htmlspecialchars($order['car_plate']) ?></div><?php endif; ?>
|
|
<?php if(!empty($order['ready_time']) && !in_array($order['status'], ['completed', 'cancelled'])): ?>
|
|
<div class="small mb-2 text-danger fw-bold countdown-timer" data-ready-time="<?= strtotime($order['ready_time']) * 1000 ?>"><i class="bi bi-clock-history me-1"></i> <span></span></div>
|
|
<?php endif; ?>
|
|
<div class="fw-bold text-primary text-end"><?= number_format($order['total_amount'], 3) ?> OMR</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
<h5 class="fw-bold mb-3 ms-2 mt-4">Points History</h5>
|
|
<?php if (empty($points_history)): ?>
|
|
<p class="text-muted ms-2">No points history found.</p>
|
|
<?php else: ?>
|
|
<div class="card-custom p-0 overflow-hidden">
|
|
<div class="list-group list-group-flush">
|
|
<?php foreach ($points_history as $hist): ?>
|
|
<div class="list-group-item p-3">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<div class="fw-bold small"><?= htmlspecialchars($hist['reason']) ?></div>
|
|
<div class="text-muted" style="font-size: 0.75rem;"><?= date('M d, Y h:i A', strtotime($hist['created_at'])) ?></div>
|
|
</div>
|
|
<div class="fw-bold <?= $hist['points_change'] > 0 ? 'text-success' : 'text-danger' ?>">
|
|
<?= $hist['points_change'] > 0 ? '+' : '' ?><?= $hist['points_change'] ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|
|
<div class="text-center mt-4">
|
|
<a href="customer_profile.php" class="btn btn-outline-secondary rounded-pill px-4">Logout</a>
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
<script>
|
|
function updateTimers() {
|
|
document.querySelectorAll('.countdown-timer').forEach(el => {
|
|
const readyTime = parseInt(el.getAttribute('data-ready-time'));
|
|
const now = new Date().getTime();
|
|
const diff = readyTime - now;
|
|
|
|
if (diff > 0) {
|
|
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
|
|
const seconds = Math.floor((diff % (1000 * 60)) / 1000);
|
|
el.querySelector('span').innerText = 'Ready in: ' + minutes + 'm ' + seconds + 's';
|
|
} else {
|
|
el.querySelector('span').innerText = 'Should be ready soon!';
|
|
}
|
|
});
|
|
}
|
|
setInterval(updateTimers, 1000);
|
|
updateTimers();
|
|
</script>
|
|
</body>
|
|
</html>
|