profile.php

<?php
require_once __DIR__ . '/config/constants.php';
require_once __DIR__ . '/config/db.php';
if (session_status() === PHP_SESSION_NONE) {
    session_start();
}

if (!isset($_SESSION['user_id'])) {
    header('Location: login.php');
    exit;
}

$user_id = intval($_SESSION['user_id']);

$user_sql  = 'SELECT name, email, phone, image, created_at FROM users WHERE id = ?';
$user_stmt = mysqli_prepare($conn, $user_sql);
mysqli_stmt_bind_param($user_stmt, 'i', $user_id);
mysqli_stmt_execute($user_stmt);
$user_result = mysqli_stmt_get_result($user_stmt);
$user = mysqli_fetch_assoc($user_result);

$orders_sql  = 'SELECT id, total_amount, status, payment_method, payment_status, created_at FROM orders WHERE user_id = ? ORDER BY created_at DESC LIMIT 5';
$orders_stmt = mysqli_prepare($conn, $orders_sql);
mysqli_stmt_bind_param($orders_stmt, 'i', $user_id);
mysqli_stmt_execute($orders_stmt);
$orders_result = mysqli_stmt_get_result($orders_stmt);

$orders = [];
while ($row = mysqli_fetch_assoc($orders_result)) {
    $orders[] = $row;
}

$payment_labels = [
    'cod'    => 'COD',
    'esewa'  => 'eSewa',
    'khalti' => 'Khalti',
];

include __DIR__ . '/includes/header.php';
?>
<link rel="stylesheet" href="<?php echo CSS_PATH; ?>profile.css">

<h1 class="page-title">My Account</h1>

<?php if (isset($_SESSION['profile_success'])): ?>
    <div class="auth-alert" style="max-width: 1100px; margin: 0 auto 20px;"><?php echo htmlspecialchars($_SESSION['profile_success']); ?></div>
    <?php unset($_SESSION['profile_success']); ?>
<?php endif; ?>

<?php if (isset($_SESSION['profile_error'])): ?>
    <div class="auth-alert" style="max-width: 1100px; margin: 0 auto 20px;"><?php echo htmlspecialchars($_SESSION['profile_error']); ?></div>
    <?php unset($_SESSION['profile_error']); ?>
<?php endif; ?>

<div class="profile-wrapper">
    <div class="profile-layout">

        <div class="profile-card">
            <form action="actions/update-avatar.php" method="POST" enctype="multipart/form-data" id="avatarForm">
                <div class="avatar-wrapper">
                    <img class="profile-avatar" id="avatarPreview"
                         src="<?php echo htmlspecialchars(user_img($user['image'] ?? 'user.png')); ?>"
                         alt="<?php echo htmlspecialchars($user['name']); ?>">
                    <label for="avatarInput" class="avatar-change-btn" title="Change photo">
                        <i class="fas fa-camera"></i>
                    </label>
                    <input type="file" id="avatarInput" name="avatar" accept="image/jpeg,image/png,image/webp" style="display:none;">
                </div>
            </form>
            <h2><?php echo htmlspecialchars($user['name']); ?></h2>
            <p><?php echo htmlspecialchars($user['email']); ?></p>
            <p>Member since <?php echo date('d M Y', strtotime($user['created_at'])); ?></p>
            <a href="logout.php" class="logout-link"><i class="fas fa-sign-out-alt"></i> Logout</a>
        </div>

        <div class="profile-right">

            <div class="profile-section">
                <h3>Account Details</h3>
                <form action="actions/update-profile.php" method="POST">
                    <div class="form-row">
                        <div class="form-group">
                            <label>Full Name</label>
                            <input type="text" name="name" value="<?php echo htmlspecialchars($user['name']); ?>" required>
                        </div>
                        <div class="form-group">
                            <label>Phone Number</label>
                            <input type="text" name="phone" value="<?php echo htmlspecialchars($user['phone']); ?>" required>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="form-group full">
                            <label>Email Address</label>
                            <input type="email" name="email" value="<?php echo htmlspecialchars($user['email']); ?>" required>
                        </div>
                    </div>
                    <button type="submit" class="save-btn">Save Changes</button>
                </form>
            </div>

            <div class="profile-section">
                <h3>Order History <a href="my-orders.php" style="float:right;font-size:13px;">View All</a></h3>

                <?php if (count($orders) > 0): ?>
                    <table class="order-table">
                        <tr>
                            <th>Order ID</th>
                            <th>Date</th>
                            <th>Payment</th>
                            <th>Total</th>
                            <th>Status</th>
                        </tr>
                        <?php foreach ($orders as $order):
                            $p_method = $payment_labels[$order['payment_method']] ?? ucfirst($order['payment_method']);
                            $p_status = ucfirst($order['payment_status'] ?? 'pending');
                            ?>
                            <tr>
                                <td><strong>#<?php echo $order['id']; ?></strong></td>
                                <td><?php echo date('d M Y', strtotime($order['created_at'])); ?></td>
                                <td><?php echo htmlspecialchars($p_method); ?> (<?php echo htmlspecialchars($p_status); ?>)</td>
                                <td>Rs. <?php echo number_format($order['total_amount'], 2); ?></td>
                                <td><span class="order-status <?php echo strtolower($order['status']); ?>"><?php echo ucfirst($order['status']); ?></span></td>
                            </tr>
                        <?php endforeach; ?>
                    </table>
                <?php else: ?>
                    <p class="no-orders">You haven't placed any orders yet.</p>
                <?php endif; ?>
            </div>

        </div>

    </div>
</div>

<?php include __DIR__ . '/includes/footer.php'; ?>

<script>
(function () {
    const input   = document.getElementById('avatarInput');
    const preview = document.getElementById('avatarPreview');
    const form    = document.getElementById('avatarForm');

    if (!input || !form) return;

    input.addEventListener('change', function () {
        const file = this.files[0];
        if (!file) return;

        const reader = new FileReader();
        reader.onload = function (e) {
            if (preview) preview.src = e.target.result;
        };
        reader.readAsDataURL(file);

        form.submit();
    });
})();
</script>