localnet/localhost-front
10
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

알림 없을때 탑바 빨간동그라미 안보이게
All checks were successful
LocalNet_front/pipeline/head This commit looks good
Details

Browse Source
This commit is contained in:
dyhj625 2025-04-11 09:54:41 +09:00
parent 3cdba34130
commit 549a01d454
1 changed files with 29 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
src/layouts/TheTop.vue
View File

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