From 549a01d454423f7406370141787b69a5a3fd0a9c Mon Sep 17 00:00:00 2001
From: dyhj625 <dyhj625@local-host.co.kr>
Date: Fri, 11 Apr 2025 09:54:41 +0900
Subject: [PATCH] =?UTF-8?q?=EC=95=8C=EB=A6=BC=20=EC=97=86=EC=9D=84?=
 =?UTF-8?q?=EB=95=8C=20=ED=83=91=EB=B0=94=20=EB=B9=A8=EA=B0=84=EB=8F=99?=
 =?UTF-8?q?=EA=B7=B8=EB=9D=BC=EB=AF=B8=20=EC=95=88=EB=B3=B4=EC=9D=B4?=
 =?UTF-8?q?=EA=B2=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/TheTop.vue | 45 +++++++++++++++++++++++++++---------------
 1 file changed, 29 insertions(+), 16 deletions(-)

diff --git a/src/layouts/TheTop.vue b/src/layouts/TheTop.vue
index 8843357..b1b13a1 100644
--- a/src/layouts/TheTop.vue
+++ b/src/layouts/TheTop.vue
@@ -38,25 +38,36 @@
                 <!-- Notification -->
                 <li class="nav-item dropdown-notifications navbar-dropdown dropdown me-3 me-xl-2 p-0">
                     <a
-                        class="nav-link dropdown-toggle hide-arrow p-0"
-                        href="javascript:void(0);"
-                        data-bs-toggle="dropdown"
-                        data-bs-auto-close="outside"
-                        aria-expanded="false"
+                    class="nav-link dropdown-toggle hide-arrow p-0"
+                    href="javascript:void(0);"
+                    data-bs-toggle="dropdown"
+                    data-bs-auto-close="outside"
+                    aria-expanded="false"
                     >
-                        <span class="position-relative">
-                            <i class="bx bx-bell bx-md"></i>
-                            <span class="badge rounded-pill bg-danger badge-dot badge-notifications border"></span>
-                        </span>
+                    <span class="position-relative">
+                        <i class="bx bx-bell bx-md"></i>
+                        <!-- 알림이 있을 경우에만 뱃지를 표시 -->
+                        <span
+                        v-if="notificationCount > 0"
+                        class="badge rounded-pill bg-danger badge-dot badge-notifications border"
+                        ></span>
+                    </span>
                     </a>
                     <ul class="dropdown-menu dropdown-menu-end p-0">
-                        <li class="dropdown-notifications-list scrollable-container p-3">
-                            알림이 없습니다.
-                            <!-- <ul class="list-group list-group-flush">
-                                <li class="list-group-item list-group-item-action dropdown-notifications-item">
-                                </li>
-                            </ul> -->
-                        </li>
+                    <li class="dropdown-notifications-list scrollable-container p-3">
+                        <!-- 알림이 없으면 "알림이 없습니다." 메시지 표시 -->
+                        <div v-if="notificationCount === 0">
+                        알림이 없습니다.
+                        </div>
+                        <!-- 알림이 있을 때 목록 렌더링-->
+                        <div v-else>
+                        <ul>
+                            <li v-for="notification in notifications" :key="notification.id">
+                            {{ notification.text }}
+                            </li>
+                        </ul>
+                        </div>
+                    </li>
                     </ul>
                 </li>
                 <!--/ Notification -->
@@ -120,6 +131,8 @@
     const selectedProject = ref(null);
     const weather = ref({});
     const dailyWeatherList = ref([]);
+    const notifications = ref([]);
+    const notificationCount = ref(0);
 
     const weatherReady = computed(() => {
         return (