- Integrate combined profile events at home

-Added another button to change profile

src/app/pages/events/events.page.html

@@ -10,13 +10,21 @@
       </ion-label>
     </ion-item>
   <ion-buttons slot="end">
-  <label class="switch">
+  <!-- <label class="switch">
     <input type="checkbox" id="togBtn">
-    <div (click)="showAlert()">
+    <div (click)="changeProfile()">
     <div class="slider round">
-    <!--ADDED HTML --><span class="mdgpr">MDGPR</span></div><span class="pr">PR</span><!--END-->
+    <span class="mdgpr">MDGPR</span><span class="pr">PR</span>
   </div>
-</label>
+  </div>
+</label> -->
+<div class="toggleBox">
+  <div (click)="changeProfile()" class="toggle">
+    <input type="checkbox">
+    <label for="" class="onbtn">PR</label>
+    <label for="" class="ofbtn">MD</label>
+  </div> 
+</div>
 </ion-buttons>
 </ion-toolbar>
   <ion-toolbar>
@@ -65,7 +73,7 @@
       <ion-item-group>
         <ion-item-sliding>
           <ion-item lines="none" 
-          *ngFor="let event of eventsList"
+          *ngFor="let event of combinedEvents"
           [routerLink]="['/home/events', event.EventId, 'events']">
             <div class="div-item-{{event.CalendarName}}">
               <div class="div-up">

src/app/pages/events/events.page.scss

@@ -265,3 +265,65 @@ ion-toolbar{
       padding: 15px;
       color:red;
     }
+
+    /* NEW CSS FOR TOGGLE BUTTON */
+    input[type="checkbox"]{
+      position: relative;
+      width: 100px;
+      height: 40px;
+      background: #ffffff;
+      -webkit-appearance: none;
+      border-radius: 20px;
+      outline: none;
+      transition: .4s;
+      /* box-shadow: inset 0 0 5px rgba(0,0,0,0.2); */
+      cursor: pointer;
+      border:1px solid red;
+    }
+    input:checked[type="checkbox"]{
+      background: #e16817;
+    }
+    input[type="checkbox"]::before{
+      z-index: 2;
+      position: absolute;
+      content: "";
+      left: 0;
+      width: 38px;
+      height: 38px;
+      background: #fff;
+      border-radius: 50%;
+      /* transform: scale(1.1); */
+      box-shadow: inset 0 2px 5px rgba(0,0,0,0.2);
+      border:1px solid red;
+    }
+    input:checked[type="checkbox"]::before{
+      left: 60px;
+
+    }
+    .toggle{
+      position: relative;
+      display: inline;
+      font-family: 'Montserrat', sans-serif;
+      display: grid;
+      text-align: center;
+    }
+    label{
+      position: absolute;
+      color: #fff;
+      font-weight: 600;
+      font-size: 16px;
+      pointer-events: none;
+    }
+    .onbtn{
+      top:10px;
+      bottom: 15px;
+      left: 15px;
+      /* padding-top: 10px;
+      border: 1px solid red; */
+    }
+    .ofbtn{
+      top:10px;
+      bottom: 15px;
+      right: 14px;
+      color:  #e16817;
+    }

src/app/pages/events/events.page.ts

@@ -29,11 +29,17 @@ export class EventsPage implements OnInit {
   timeDate = this.today.getHours() + ":" + this.today.getMinutes();
   /* Set segment variable */
   segment:string;
+  profile:string;
 
   eventsList: Event[];  
   officialeventsList: Event[];
   personaleventsList: Event[];
 
+  prEventList: Event[];
+  mdEventList: Event[];
+
+  combinedEvents: Event[];
+
   customText = false;
 
   showLoader: boolean;
@@ -42,11 +48,16 @@ export class EventsPage implements OnInit {
     private router: Router, 
     public activatedRoute: ActivatedRoute,
     private alertController: AlertService,
-    private authService: AuthService) { }
+    private authService: AuthService) {
+      this.prEventList = null;
+     }
 
   ngOnInit() {
     //Inicializar segment
     this.segment = "Combinada";
+    //Initialize profile as mdgpr
+    this.profile = "mdgpr";
+
     this.showGreeting();
 
     this.router.events.forEach((event) => {
@@ -56,6 +67,7 @@ export class EventsPage implements OnInit {
     });
   }
 
+
   doRefresh(event) {
     this.RefreshEvents();
     event.target.complete();
@@ -70,31 +82,72 @@ export class EventsPage implements OnInit {
 
   RefreshEvents(){
     this.showLoader = true;
+
     switch (this.segment)
     {
       case "Combinada":
-        this.eventService.getAllEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
+        if(this.profile == "mdgpr"){
+          this.eventService.getAllEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
         .subscribe(response => {
-            this.eventsList = response;
+          this.combinedEvents = response;
+            /* this.eventsList = response; */
             this.showLoader = false;
           }
         );
+        }else{
+          this.eventService.getAllPrEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+            this.prEventList = res;
+            this.eventService.getAllMdEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+              this.mdEventList = res;
+              this.combinedEvents = this.prEventList.concat(this.mdEventList);
+              console.log(this.combinedEvents);
+              this.showLoader = false;
+            });
+          });
+        }
+        
         break;
       case "Pessoal":
-        this.eventService.getEvents(this.segment, formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
-        .subscribe(response => {
+        if(this.profile == "mdgpr"){
+          this.eventService.getEvents(this.segment, formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
+          .subscribe(response => {
             this.personaleventsList = response;
             this.showLoader = false;
-          }
-        );
+           }
+         );
+        }else{
+          this.eventService.getAllPrEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+            this.prEventList = res;
+            this.eventService.getAllMdEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+              this.mdEventList = res;
+              this.personaleventsList = this.prEventList.concat(this.mdEventList).filter(data => data.CalendarName == "Pessoal");
+              console.log(this.personaleventsList);
+              this.showLoader = false;
+            });
+          });
+
+        }
+        
         break;
       case "Oficial":
-        this.eventService.getEvents(this.segment, formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
-        .subscribe(response => {
-            this.officialeventsList = response;
-            this.showLoader = false;
-          }
-        );
+        if(this.profile == "mdgpr"){
+          this.eventService.getEvents(this.segment, formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59')
+          .subscribe(response => {
+             this.officialeventsList = response;
+             this.showLoader = false;
+           }
+         );
+        }else{
+          this.eventService.getAllPrEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+            this.prEventList = res;
+            this.eventService.getAllMdEvents(formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 00:00:00', formatDate(new Date(), 'yyyy-MM-dd', 'pt') + ' 23:59:59').subscribe(res => {
+              this.mdEventList = res;
+              this.officialeventsList = this.prEventList.concat(this.mdEventList).filter(data => data.CalendarName == "Oficial");
+              console.log(this.officialeventsList);
+              this.showLoader = false;
+            });
+          });
+        } 
         break;
     }
   }
@@ -115,8 +168,17 @@ export class EventsPage implements OnInit {
     this.router.navigate(['/home/events']);
   }
 
-  showAlert(){
-    this.alertController.presentAlert("Funcionalidade em desenvolvimento!");
+  changeProfile(){
+    if(this.profile == "mdgpr"){
+      console.log('pr');
+      this.profile ="pr";
+      this.RefreshEvents();
+    }
+    else{
+      console.log('mdgpr');
+      this.profile ="mdgpr";
+      this.RefreshEvents();
+    }
   }
 
   logout()