Bidly_Website/notifications.php at master · Febriyandy/Bidly_Website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<?php
session_start();
require_once 'connect.php';

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

// Mark notification as read
if (isset($_POST['mark_read']) && isset($_POST['notification_id'])) {
    $notif_id = mysqli_real_escape_string($conn, $_POST['notification_id']);
    $update_sql = "UPDATE notifications SET is_read = 1 WHERE notification_id = ? AND user_id = ?";
    $stmt = mysqli_prepare($conn, $update_sql);
    mysqli_stmt_bind_param($stmt, "ii", $notif_id, $_SESSION['user_id']);
    mysqli_stmt_execute($stmt);
    exit;
}

// Get notifications
$sql = "SELECT
            n.*,
            c.model,
            c.foto1,
            a.current_highest_bid,
            a.end_time,
            a.status
        FROM notifications n
        JOIN auctions a ON n.auction_id = a.auction_id
        JOIN cars c ON a.car_id = c.car_id
        WHERE n.user_id = ?
        ORDER BY n.created_at DESC";

$stmt = mysqli_prepare($conn, $sql);
mysqli_stmt_bind_param($stmt, "i", $_SESSION['user_id']);
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
?>

<!DOCTYPE html>
<html lang="id">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Notifikasi - Bidly</title>
    <link rel="icon" type="image/png" sizes="32x32" href="assets/logo2.png">
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&display=swap" rel="stylesheet">
    <script>
        tailwind.config = {
            theme: {
                extend: {
                    fontFamily: {
                        body: ['Plus Jakarta Sans']
                    },
                    colors: {
                        primary: '#1b9af5',
                        secondary: '#bcedff',
                        tertiary: '#1767b6',
                        accent: '#143557',
                    },
                },
            }
        }
    </script>
</head>

<body class="bg-gray-50 font-body">
    <?php include 'navbar.php'; ?>

    <main class="container mx-auto px-4 py-8">
        <h1 class="text-2xl font-bold text-accent mb-6">Notifikasi</h1>

        <?php if (mysqli_num_rows($result) > 0): ?>
            <div class="space-y-4">
                <?php while ($row = mysqli_fetch_assoc($result)): ?>
                    <div class="bg-white rounded-lg shadow-lg overflow-hidden <?php echo !$row['is_read'] ? 'border-l-4 border-primary' : ''; ?>"
                        data-notification-id="<?php echo $row['notification_id']; ?>">
                        <div class="p-6">
                            <div class="flex items-start space-x-4">
                                <div class="flex-shrink-0">
                                    <img src="<?php echo htmlspecialchars($row['foto1']); ?>"
                                        alt="<?php echo htmlspecialchars($row['model']); ?>"
                                        class="w-20 h-20 object-cover rounded">
                                </div>
                                <div class="flex-1">
                                    <p class="text-gray-800 mb-2"><?php echo htmlspecialchars($row['message']); ?></p>
                                    <div class="flex items-center text-sm text-gray-500 space-x-4">
                                        <span><?php echo date('d/m/Y H:i', strtotime($row['created_at'])); ?></span>
                                        <span>•</span>
                                        <span>Status: <?php echo ucfirst($row['status']); ?></span>
                                    </div>
                                    <div class="mt-4">
                                        <a href="detail_lelang.php?id=<?php echo $row['auction_id']; ?>"
                                            class="inline-block bg-primary text-white px-4 py-2 rounded-lg hover:bg-tertiary transition-colors text-sm">
                                            Lihat Lelang
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                <?php endwhile; ?>
            </div>
        <?php else: ?>
            <div class="bg-white p-8 rounded-lg shadow-md text-center">
                <p class="text-gray-600">Tidak ada notifikasi</p>
            </div>
        <?php endif; ?>
    </main>

    <?php include 'footer.php'; ?>

    <script>
        $(document).ready(function() {
            // Mark notification as read when clicked
            $('.bg-white').on('click', function() {
                const notificationId = $(this).data('notification-id');
                const $notification = $(this);

                $.ajax({
                    type: 'POST',
                    url: window.location.href,
                    data: {
                        mark_read: 1,
                        notification_id: notificationId
                    },
                    success: function() {
                        $notification.removeClass('border-l-4 border-primary');
                    }
                });
            });
        });
    </script>
</body>

</html>

<?php mysqli_close($conn); ?>