Aplication Notification

app/Models/Notitifation.php

@@ -6,5 +6,5 @@ use Illuminate\Database\Eloquent\Model;
 
 class Notitifation extends Model
 {
-    protected $table = "notification";
+    protected $table = "notifications";
 }

app/Providers/ComposerServiceProvider.php

@@ -1,7 +1,7 @@
 <?php
 
 namespace App\Providers;
-
+use Illuminate\Support\Facades\View;
 use Illuminate\Support\ServiceProvider;
 
 class ComposerServiceProvider extends ServiceProvider
@@ -23,9 +23,9 @@ class ComposerServiceProvider extends ServiceProvider
      */
     public function boot()
     {
-        view()->composer('application.layouts.header','App\Http\ViewComposers\ApplicationNotificationComposer');
-        view()->composer('supervisor.layout.header','App\Http\ViewComposers\SupervisorNotificationComposer');
-        view()->composer('admin.layouts.header','App\Http\ViewComposers\AdminNotificationComposer');
+        View::composer('application.layouts.header','App\Http\ViewComposers\ApplicationNotificationComposer');
+        View::composer('supervisor.layout.header','App\Http\ViewComposers\SupervisorNotificationComposer');
+        View::composer('admin.layouts.header','App\Http\ViewComposers\AdminNotificationComposer');
         
     }
 }

resources/views/application/layouts/header.blade.php

@@ -14,7 +14,7 @@
                                 <p style="color:black; font-weight:600 !important; text-transform: capitalize;">Hello, {{ Auth::user()->first_name }} {{ Auth::user()->last_name }}</p>
                         <ul class="nav navbar-nav align-items-center ml-auto header_right ps-2">
                             <li class="nav-item dropdown dropdown-notification">
-                                <div class="dropdown tooltips click_for_notification_list_popup_header" style="float: right; margin-top: 0px;" title="Notifications" id="notification_part">
+                                <div class="dropdown tooltips click_for_notification_list_popup" style="float: right; margin-top: 0px;" title="Notifications" id="notification_part">
                                 <a href="javascript:void(0)">
                                     <i class="fa fa-bell btn1" style="padding: 8px 9px; font-size: 13px; margin-top: -2px;"></i>
                                     @if(count($unreadnotifications) > 0)
@@ -24,6 +24,8 @@
                                 </div>
                             </li>
                         </ul> 
+
+                      
                         
                         <ul class="nav navbar-nav align-items-center ml-auto header_right ps-2">
                             <li class="nav-item dropdown dropdown-notification">
@@ -66,3 +68,4 @@
     </div>
     
 </header>
+{{-- @include('application.layouts.notification_list_popup') --}}

resources/views/application/layouts/notification_list_popup_header.blade.php → resources/views/application/layouts/notification_list_popup.blade.php

@@ -20,7 +20,7 @@
 }
 /*New popup*/
 
-.custom_popup_notification_list_header {
+.custom_popup_notification_list {
   overflow: hidden;
   position: fixed;
   top: 62px;
@@ -144,7 +144,7 @@
 
 
 /*Notification list design*/
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item_header {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item_header {
     background: #dedbf1;
     padding: 7px 16px;
     margin-bottom: 15px;
@@ -153,7 +153,7 @@
     font-size: 12px;
     font-weight: 700;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item {
     display: flex;
     background: #fff;
     padding: 7px 16px;
@@ -161,21 +161,21 @@
     border-radius: 30px;
     border: 1px solid #e9f0f3;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item:hover {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item:hover {
     background: #f5f4fd;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item .left {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item .left {
     width: calc(100% - 50px);
     align-self: center;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item .right {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item .right {
     width: 50px;
     align-self: center;
     text-align: -webkit-right;
 }
 /*Notification list design*/
 
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item {
     display: flex;
     background: fff;
     padding: 7px 16px;
@@ -185,29 +185,29 @@
     align-items: center;
     font-size: 13px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item:hover {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item:hover {
     background: #f5f4fd;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item strong {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item strong {
     color: rgb(57, 59, 62);
     font-size: 12px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item .fa {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item .fa {
     background: #f1f0fb;
     padding: 5px 5px;
     border-radius: 50%;
     border: 1px solid #ceccda;
     margin: 0 5px 0 -5px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item a {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item a {
     font-size: 12px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item span small {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item span small {
     color: rgb(134, 142, 150);
     font-size: 12px !important;
     margin: 0 4px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item:first-child{
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item:first-child{
     margin-top: 5px;
 }
 
@@ -215,12 +215,12 @@
     height: calc(100vh - 65px);
     position: relative;
 }*/
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .submit_button{
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .submit_button{
     position: fixed;
     right: 25px;
     bottom: 65px;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item_header .list_counter{
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_list_item_header .list_counter{
     background: #ffffff;
     font-weight: 700;
     font-size: 11px !important;
@@ -234,29 +234,44 @@
     margin-top: -1px;
 }
 
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .submit_button:hover{
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .submit_button:hover{
     color: #2e1153 !important;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item {
     border-radius: .75rem !important;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item span small {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item span small {
     margin: 0 !important;
 }
-.custom_popup_notification_list_header .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item .fa {
+.custom_popup_notification_list .custom_popup_inner_notification_list .bottom_popup_notification_list .details_content_view .single_radius_item .fa {
     margin: 0 10px 0 -3px !important;
 }
 
 </style>
 
-<div class="custom_popup_notification_list_header d-none">
+<div class="custom_popup_notification_list d-none">
   <div class="custom_popup_inner_notification_list" style="display:none;">
     <div class="bottom_popup_notification_list scroll_bar">
 
         <div class="details_content_view">
 
-             
-           <a href="{{url('applyuser/notifications/unread')}}" class="btn submit_button">See More</a>
+            <div class="single_radius_list_item_header">
+                Unread Notifications
+                @if(count($unreadnotifications) > 0)
+                <span class="badge badge-success ml-2 list_counter">
+                   {{ count($unreadnotifications) }}
+                </span>
+                 @endif
+            </div>
+
+            @forelse($unreadnotifications->take(15) as $notification)
+
+            @includeIf('notifications.'.\Str::snake(class_basename($notification->type)))
+                @empty
+                <br>
+                <p class="text-center no_notifications">0 Notifications</p>
+            @endforelse 
+           <a href="{{url('')}}" class="btn submit_button">See More</a>
             
         </div> 
         
@@ -265,29 +280,29 @@
   </div>  
   <div class="popup_open_bg_overlay_notification_list"></div>
 </div>
-
-<script>
+ 
+<script type="text/javascript">
 
     $(function(){
 
-        $(".click_for_notification_list_popup_header").on('click', function() {
-            // $('.custom_popup_notification_list').toggle("slide", {direction: "right" }, 300);
-            console.log('click_for_notification_list_popup_header');
-            $(".custom_popup_notification_list_header").removeClass('d-none');
-            $(".custom_popup_notification_list_header").addClass('popup_open_task_details');
-            $(".custom_popup_notification_list_header").addClass('.popup_open_bg_overlay_notification_list');
+        $(".click_for_notification_list_popup").on('click', function() { 
+            $(".custom_popup_notification_list").removeClass('d-none');
+            $(".custom_popup_notification_list").addClass('popup_open_task_details');
+            $(".custom_popup_notification_list").addClass('.popup_open_bg_overlay_notification_list');
 
             $(".custom_popup_inner_notification_list").hide().show("slide", { direction: "right" }, 600);
 
 
         }); 
 
-    })
+    });
 
     $(".close_button_notification_list").click(function(){
-        $(".custom_popup_notification_list_header").removeClass('popup_open_task_details');
-        $(".custom_popup_notification_list_header").addClass('d-none');
+        $(".custom_popup_notification_list").removeClass('popup_open_task_details');
+        $(".custom_popup_notification_list").addClass('d-none');
     });
 
 
-</script>
+</script>
+
+