Badged notification added

src/app/shared/header/header.page.html

@@ -11,6 +11,7 @@
       <img src='assets/images/logo-no-bg.png' alt='logo'>
     </div>
     <div class="div-profile cursor-pointer" (click)="openProfile()">
+      <div *ngIf="this.notificationLength > 0" class="icon-badge" >{{this.notificationLength}}</div>
       <ion-icon class="icon" src='assets/images/icons-profile.svg'></ion-icon>
       <ion-label class="profile-text">{{loggeduser.Profile}}</ion-label>
     </div>

src/app/shared/header/header.page.scss

@@ -39,6 +39,19 @@
     border: none !important;
   }
 
+  .icon-badge {
+    background-color: red;
+    font-size: 12px;
+    color: white;
+    text-align: center;
+    width:20px;
+    height:20px;
+    border-radius: 35%;
+    position: absolute; /* changed */
+    top: 5px; /* changed */
+    right: 27px; /* changed */
+}
+
   .profile-text{
     font-size: 20px;
     font-weight: 300;

src/app/shared/header/header.page.ts

@@ -6,6 +6,8 @@ import { ProfileComponent } from '../headers/header-no-search/profile/profile.pa
 import { AuthService } from 'src/app/services/auth.service';
 import { User } from 'src/app/models/user.model';
 import { ProfilePage } from 'src/app/modals/profile/profile.page';
+import { StorageService } from '../../services/storage.service';
+import { NotificationsService } from '../../services/notifications.service'
 
 @Component({
   selector: 'app-header',
@@ -15,29 +17,51 @@ import { ProfilePage } from 'src/app/modals/profile/profile.page';
 export class HeaderPage implements OnInit {
 
   searchSubject: string = '';
-  showSearch=false;
+  showSearch = false;
   loggeduser: User;
-  hideSearchBtn:boolean = false;
+  hideSearchBtn: boolean = false;
+  notificationdata: any[] = [];
+  DataArray: Array<object> = [];
+  notificationLength: 0;
+
 
   constructor(
     private router: Router,
     private modalController: ModalController,
     private animationController: AnimationController,
+    private storageservice: StorageService,
+    private notificatioservice: NotificationsService,
     authService: AuthService
-    ) {
-      this.loggeduser = authService.ValidatedUser;
-      router.events.subscribe((val) => {
-        this.showSearch=false;
-        //this.modalController.dismiss();
-      });
-   }
+  ) {
+    this.loggeduser = authService.ValidatedUser;
+    router.events.subscribe((val) => {
+      this.showSearch = false;
+      //this.modalController.dismiss();
+    });
+  }
 
   ngOnInit() {
     this.hideSearch();
+    this.notificationLengthData();
+    
+
   }
 
-  hideSearch(){
-    if(this.router.url == '/home/events' || this.router.url == '/home/chat'){
+  async notificationLengthData() {
+    this.storageservice.get("Notifications").then((value) => {
+      console.log("Init get store", value)
+
+      var data = JSON.parse(value);
+      this.notificationLength = data.length;
+    })
+
+    await new Promise(resolve => setTimeout(resolve, 10000))
+    await this.notificationLengthData()
+    console.log('Timer badge count')
+  }
+
+  hideSearch() {
+    if (this.router.url == '/home/events' || this.router.url == '/home/chat') {
       this.hideSearchBtn = true;
     }
   }
@@ -49,7 +73,7 @@ export class HeaderPage implements OnInit {
   async openSearch() {
 
     let classs, showSearchInput, type;
-    if(window.innerWidth < 1366) {
+    if (window.innerWidth < 1366) {
       classs = 'modal modal-width-100'
       showSearchInput = true
     } else {
@@ -59,7 +83,7 @@ export class HeaderPage implements OnInit {
 
 
 
-    if(window.location.pathname.startsWith('/home/agenda')) {
+    if (window.location.pathname.startsWith('/home/agenda')) {
       type = "Agenda"
     } else if (window.location.pathname.startsWith('/home/gabinete-digital')) {
       type = "AccoesPresidenciais & ArquivoDespachoElect"
@@ -80,7 +104,7 @@ export class HeaderPage implements OnInit {
     return await modal.present();
   }
 
-  changeRoute(path){
+  changeRoute(path) {
     this.router.navigateByUrl(path)
   }
 
@@ -122,28 +146,28 @@ export class HeaderPage implements OnInit {
     return await modal.present();
   }
 
-  async dynamicSearch(){
+  async dynamicSearch() {
     window['dynamicSearch'](this.searchSubject)
   }
 
 
-  async closeSearch(){
+  async closeSearch() {
     this.modalController.dismiss()
   }
 
-    /**
-    * @description set empty value to searchSubject
-    */
-   clearSearchInput(){
+  /**
+  * @description set empty value to searchSubject
+  */
+  clearSearchInput() {
     this.searchSubject = "";
     window['dynamicSearch'](this.searchSubject)
-   }
+  }
 
-   async basicSearch() {
+  async basicSearch() {
     window['searchTriger']()
-   }
+  }
 
-   profileLabel(text) {
+  profileLabel(text) {
     if (text == 'MDGPR') {
       return 'MD'
     } else if (text == 'PR') {