ADD: Количество уведомлений

app/Models/NotificationModel.php

@@ -78,7 +78,7 @@ class NotificationModel extends \Hleb\Scheme\App\Models\MainModel
                             WHERE recipient_id = :user_id
                                 AND read_flag = 0";
 
-        return DB::run($sql, ['user_id' => $user_id])->fetch();
+        return DB::run($sql, ['user_id' => $user_id])->fetchAll();
     }
 
     // Отправка

resources/views/default/css/components/components.css

@@ -18,6 +18,20 @@ h5 {
   font-weight: 600;
 }
 
+.number {
+  display: none;  
+  font-size: .72rem;
+  color: #fff;
+  background-color: red;
+  padding: 1px 6px;
+  border-radius: 50%;
+  position: absolute;
+  top: -5px;
+  right: -10px;
+}
+
+.number.show { display: block; }
+
 /* См. https://feathericons.com/ и https://tabler-icons.io/ */
 .icons {
   width: 21px;

resources/views/default/global/base-header.php

@@ -79,10 +79,11 @@ $post   = $data['post'] ?? false;
                 <use xlink:href="/assets/svg/icons.svg#sun"></use>
               </svg></a>
 
-            <a id="notif" class="gray-600" href="<?= url('notifications'); ?>">
+            <a id="notif" class="gray-600 relative" href="<?= url('notifications'); ?>">
               <svg class="icons">
                 <use xlink:href="/assets/svg/icons.svg#bell"></use>
               </svg>
+              <span class="number"></span>
             </a>
 
             <div class="relative">

resources/views/default/scripts.php

@@ -28,8 +28,15 @@
                 return response.json();
               }).then(function (data) { 
                 if (data != false) {
+               
                   let notif = document.getElementById('notif');
+                  let number = notif.querySelector('.number');
+                
                   notif.firstElementChild.classList.add("active");
+                  
+                  number.classList.add("show");
+                  
+                  number.innerHTML = data.length;
                 }
               }).catch(function (error) {
                 // error