Improve add event and edit event

src/app/pages/agenda/agenda.page.ts

@@ -112,7 +112,6 @@ export class AgendaPage implements OnInit {
 
   // this will make  toggle add event and.
   showEventEditOrOpen:  "edit" | "add" | "" = ""
-
   prEventList: Event[];
   mdEventList: Event[]
 
@@ -894,7 +893,8 @@ export class AgendaPage implements OnInit {
     const modal = await this.modalCtrl.create({
       component: ViewEventPage,
       componentProps:{
-        eventId: eventId
+        eventId: eventId,
+        adding: this.adding
       },
       cssClass: 'modal  modal-desktop',
       backdropDismiss: false
@@ -986,7 +986,6 @@ export class AgendaPage implements OnInit {
   }
 
   async AproveEventEditEvent(data){
-    console.log(data)
     this.postEvent =data;
     this.mobileComponent.transparentEventToApprove= true;
     this.mobileComponent.showAddNewEvent = true;
@@ -998,8 +997,6 @@ export class AgendaPage implements OnInit {
     if(Array.isArray(data)){
       if(data.length >= 1){
       
-        console.log('save!!!',data.length);
-        console.log(data);
         this.contacts = data ;
       }
     }

src/app/pages/agenda/approve-event-modal/approve-event-modal.page.ts

@@ -34,10 +34,9 @@ export class ApproveEventModalPage implements OnInit {
     private popoverController: PopoverController,
     private menu: MenuController,
     private alertService: AlertService,
-    )
-    {
+    ) {
       this.serialNumber = this.navParams.get('serialNumber');
-     }
+    }
 
   ngOnInit() {
     this.getTask();
@@ -72,7 +71,6 @@ export class ApproveEventModalPage implements OnInit {
   }
   approveTask(serialNumber:string){
     let body = { "serialNumber": serialNumber, "action": "Aprovar" }
-    console.log(body);
     this.processes.PostTaskAction(body);
     this.alertService.presentAlert('Operação realizada com sucesso!');
     this.router.navigate(['/home/gabinete-digital/event-list']);
@@ -80,7 +78,6 @@ export class ApproveEventModalPage implements OnInit {
   }
 
   emendTask(serialNumber:string){
-    /* console.log('Emendar'); */
     this.menu.close();
     this.openEmendMessageModal(serialNumber);
     this.modalController.dismiss(null);
@@ -89,7 +86,6 @@ export class ApproveEventModalPage implements OnInit {
   rejectTask(serialNumber:string){
   
     let body = { "serialNumber": serialNumber, "action": "Rejeitar" }
-    console.log(body);
     this.processes.PostTaskAction(body);
     this.alertService.presentAlert('Operação realizada com sucesso!');
     this.router.navigate(['/home/gabinete-digital/event-list']);
@@ -134,7 +130,6 @@ export class ApproveEventModalPage implements OnInit {
        "ReviewerComments": res.data,
        }
       }
-    console.log(body);
     this.processes.PostTaskAction(body);
     this.router.navigate(['/home/gabinete-digital/event-list']);
     this.alertService.presentAlert('Operação realizada com sucesso!');

src/app/pages/agenda/edit-event/edit-event.page.html

@@ -144,7 +144,7 @@
                     <div class="list-people">
                       <ion-item lines="none">
                         <ion-list>
-                          <ion-label *ngIf="!taskParticipants" class="list-people-title">Adicionar intervenientes</ion-label>
+                          <ion-label *ngIf="taskParticipants.length == 0" class="list-people-title">Adicionar intervenientes</ion-label>
                           <ion-label *ngFor="let participant of taskParticipants">{{participant.Name}}</ion-label>
                         </ion-list>
                       </ion-item>
@@ -164,7 +164,7 @@
                     <div class="list-people">
                       <ion-item lines="none">
                         <ion-list>
-                          <ion-label *ngIf="!taskParticipantsCc" class="list-people-title">Adicionar intervenientes</ion-label>
+                          <ion-label *ngIf="taskParticipantsCc.length == 0" class="list-people-title">Adicionar intervenientes</ion-label>
                           <ion-label *ngFor="let participant of taskParticipantsCc">{{participant.Name}}</ion-label>
                         </ion-list>
                       </ion-item>
@@ -224,7 +224,7 @@
       [taskParticipants]="taskParticipants"
       [taskParticipantsCc]="taskParticipantsCc"
       [adding]="adding"
-      (dynamicSetIntervenient)="dynamicSetIntervenient($event)"
+
     ></app-attendee-modal>
 
   </div>    

src/app/pages/agenda/edit-event/edit-event.page.ts

@@ -71,9 +71,11 @@ export class EditEventPage implements OnInit {
     };
     
   }
+  
   close(){
     this.modalController.dismiss();
   }
+
   save(){
     
     this.eventsService.editEvent(this.postEvent, 2, 3).subscribe(async () => {
@@ -90,13 +92,13 @@ export class EditEventPage implements OnInit {
 
   async openAttendees() {
 
-    this.adding = 'intervenient';
-
     if(window.innerWidth <= 1024) {
       const modal = await this.modalController.create({
         component: AttendeesPage,
          componentProps: {
-          eventAttendees: this.postEvent.Attendees
+          adding: this.adding,
+          taskParticipants: this.taskParticipants,
+          taskParticipantsCc: this.taskParticipantsCc
         },
         cssClass: 'attendee',
         backdropDismiss: false
@@ -105,41 +107,39 @@ export class EditEventPage implements OnInit {
       await modal.present();
   
       modal.onDidDismiss().then((data) => {
-        if (data['data'] != null)
-        { 
-          let newattendees: EventPerson[] = data['data'];
-          this.setIntervenient(newattendees);
+        
+        if(data){
+          data = data['data'];
+
+          const newAttendees: EventPerson[] = data['taskParticipants'];
+          const newAttendeesCC: EventPerson[] = data['taskParticipantsCc'];
+
+          this.setIntervenient(newAttendees);
+          this.setIntervenientCC(newAttendeesCC);
         }
       });
     }
 
   }
 
-  async dynamicSetIntervenient(data){
-    this.taskParticipants = data['taskParticipants'];
-    this.taskParticipantsCc = data['taskParticipantsCc'];
-  }
-
-  async setIntervenient(data){
+  setIntervenient(data){
     this.taskParticipants = data;
     this.postEvent.Attendees = data;
   }
   
-  async setIntervenientCC(data){
+  setIntervenientCC(data){
     this.taskParticipantsCc = data;
   }
 
-  async addParticipants(){
+  addParticipants(){
     this.adding = 'intervenient'
 
     this.openAttendees();
   }
 
-  async addParticipantsCC(){
+  addParticipantsCC(){
     this.adding = 'CC'
-
     this.openAttendees();
   }
 
-  async closeComponent(){}
 }

src/app/pages/agenda/new-event/new-event.page.html

@@ -15,7 +15,6 @@
     <div class="ion-item-container">
       <ion-input  placeholder="Assunto" [(ngModel)]="postEvent.Subject"></ion-input>
     </div>
-    
     <div class="container-div">
       <div class="ion-item-class-2">
         <div class="ion-icon-class">
@@ -130,22 +129,30 @@
         <div class="ion-icon-class">
           <ion-icon slot="start" src="assets/images/icons-person.svg"></ion-icon>
         </div>
-        <div (click)="openAttendees()" class="ion-input-class-no-height">
+        <div  class="ion-input-class-no-height">
           <div class="list-people">
             <ion-item lines="none">
               <ion-list>
-                <ion-label class="list-people-title">Adicionar participantes</ion-label>
-                <ion-label hidden >Text</ion-label>
-              </ion-list>
+              <ion-label  *ngIf="taskParticipants.length == 0"  class="list-people-title">Adicionar interveniente</ion-label>
+                <div class="list-people">
+                    <ion-item lines="none">
+                      <ion-list>
+                        <ion-label *ngFor="let participant of taskParticipants">{{participant.Name}}</ion-label>
+                      </ion-list>
+                    </ion-item>
+                  </div>
+                </ion-list>
             </ion-item>
           </div>
-          <div class="add-people">
+          <div (click)="addParticipants()" class="add-people">
             <ion-icon slot="start" src="assets/images/icons-arrow-forward.svg"></ion-icon>
           </div>
         </div>
       </div>
     </div>
     
+
+    <!-- HIDDEN -->
     <div hidden class="container-div">
       <div class="ion-item-class-2">
         <div class="ion-icon-class">
@@ -155,12 +162,19 @@
           <div class="list-people">
             <ion-item lines="none">
               <ion-list>
-                <ion-label class="list-people-title">Com conhecimento</ion-label>
-                <ion-label hidden >Text</ion-label>
-              </ion-list>
+              <ion-label class="list-people-title">Com conhecimento</ion-label>
+                <div class="list-people">
+                    <ion-item lines="none">
+                      <ion-list>
+                        <ion-label *ngIf="!taskParticipants" class="list-people-title">Adicionar intervenientes</ion-label>
+                          <ion-label *ngFor="let participant of taskParticipants">{{participant.Name}}</ion-label>
+                      </ion-list>
+                    </ion-item>
+                  </div>
+                </ion-list>
             </ion-item>
           </div>
-          <div class="add-people">
+          <div (click)="addParticipantsCC()" class="add-people">
             <ion-icon slot="start" src="assets/images/icons-arrow-forward.svg"></ion-icon>
           </div>
         </div>

src/app/pages/agenda/new-event/new-event.page.ts

@@ -11,6 +11,7 @@ import { AttendeesPage } from '../../events/attendees/attendees.page';
   templateUrl: './new-event.page.html',
   styleUrls: ['./new-event.page.scss'],
 })
+
 export class NewEventPage implements OnInit {
   postEvent: Event;
   eventBody: EventBody;
@@ -21,6 +22,11 @@ export class NewEventPage implements OnInit {
   selectedDate: Date;
   minDate: string;
 
+  adding: "intervenient" | "CC";
+
+  taskParticipants: any = [];
+  taskParticipantsCc: any = [];
+
   constructor(
     private modalController: ModalController,
     private navParams: NavParams,
@@ -28,7 +34,7 @@ export class NewEventPage implements OnInit {
   ) { 
     this.postEvent = new Event();
     this.eventBody = { BodyType : "1", Text : ""};
-      this.postEvent.Body = this.eventBody;
+    this.postEvent.Body = this.eventBody;
     this.profile = this.navParams.get('profile');
 
     this.selectedSegment = this.navParams.get('segment');
@@ -88,21 +94,19 @@ export class NewEventPage implements OnInit {
       };
     }
 
-
     window.onresize = (event) => {
       // if not mobile remove all component
       if( window.innerWidth >= 1024){
         this.modalController.dismiss();
       }
     };
-
   }
   close(){
     this.modalController.dismiss();
   }
   save(){
-    console.log(this.postEvent);
-    console.log(this.profile);
+/*     console.log(this.postEvent);
+    console.log(this.profile); */
     
     
     if(this.profile=='mdgpr'){
@@ -114,12 +118,13 @@ export class NewEventPage implements OnInit {
     this.modalController.dismiss(this.postEvent);
   }
 
-  async openAttendees()
-  {
+  async openAttendees() {
     const modal = await this.modalController.create({
       component: AttendeesPage,
        componentProps: {
-        eventAttendees: this.postEvent.Attendees
+        eventAttendees: this.postEvent.Attendees,
+        adding: this.adding,
+        taskParticipants: this.taskParticipants
       },
       cssClass: 'attendee',
       backdropDismiss: false
@@ -128,12 +133,36 @@ export class NewEventPage implements OnInit {
     await modal.present();
 
     modal.onDidDismiss().then((data) => {
-      if (data['data'] != null)
-      { 
-        let newattendees: EventPerson[] = data['data'];
-        this.postEvent.Attendees = newattendees;
+      
+      if(data){
+        data = data['data'];
+
+        const newAttendees: EventPerson[] = data['taskParticipants'];
+        const newAttendeesCC: EventPerson[] = data['taskParticipantsCc'];
+
+        this.setIntervenient(newAttendees);
+        this.setIntervenientCC(newAttendeesCC);
       }
     });
-}
+  }
+
+  setIntervenient(data){
+    this.taskParticipants = data;
+    this.postEvent.Attendees = data;
+  }
+  
+  setIntervenientCC(data){
+    this.taskParticipantsCc = data;
+  }
+
+  addParticipants(){
+    this.adding = 'intervenient'
+    this.openAttendees();
+  }
+
+  addParticipantsCC(){
+    this.adding = 'CC'
+    this.openAttendees();
+  }
 
 }

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

@@ -1,55 +1,84 @@
-<ion-header class="ion-no-border">
-  <ion-toolbar>
-    <ion-title>Participantes</ion-title>
-  </ion-toolbar>
-  <ion-toolbar>
-    <ion-segment [(ngModel)]="segment">
-      <ion-segment-button value="true">
-        Intervenientes
-      </ion-segment-button>
-      <ion-segment-button value="false">
-        Com Conhecimento
-      </ion-segment-button>
-    </ion-segment>
+<ion-header class="ion-no-border px-20">
+  <ion-toolbar class="px-10">
+    <ion-title class="pa-0">Adicionar intervenientes</ion-title>
   </ion-toolbar>
+  <ion-searchbar class="attendee-search-bar" (ionChange)="onChange($event)" placeholder="Insira email para adicionar destinatário"></ion-searchbar><!-- [(ngModel)]="searchCountryString" -->
+  <ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
 </ion-header>
-<ion-content>
-  <ion-item-group>
-    <ion-button class="btn-ok-no-width" fill="clear" color="#fff" shape="round" (click)="addAttendees()" expand="block">
-      <ion-label>Adicionar participantes</ion-label>
-    </ion-button>
-  </ion-item-group>
-  <ion-item-group [ngSwitch]="segment" *ngFor="let attendee of eventAttendees">
-    <ion-list *ngSwitchCase="attendee.IsRequired.toString()">
-      <ion-item-sliding>
-        <ion-item-options side="end">
-          <ion-item-option color="danger" (click)="removeAttendee(attendee)">Apagar</ion-item-option>
-        </ion-item-options>
-        <ion-item lines="none">
-          <ion-icon slot="start" name="person"></ion-icon>
+
+<ion-content class="height-100 overflow-y-auto">
+  
+  <ion-item-group class="d-flex flex-column height-100 ">
+    <ion-list lines="none"  class="flex-grow-1 overflow-y-auto height-100" >
+      <ion-item-sliding class="px-20">
+        <div *ngFor="let attendee of contacts;">
+          <ion-item lines="none" (click)="selectContact(attendee)" *ngIf="filterSearchList(attendee)" >
+            <div class="pr-10">
+              <ion-icon class="font-35" src="assets/images/icons-userprofile.svg"></ion-icon>
+            </div>
+            <ion-label>
+              <h3>{{ attendee.Name }}</h3>
+              <p>{{ attendee.EmailAddress }}</p>
+            </ion-label>
+          </ion-item>
+        </div>
+
+      </ion-item-sliding>
+    </ion-list>
+    <hr/>
+
+    
+    <ion-list lines="none" *ngIf="taskParticipants.length >= 1 && adding == 'intervenient' " class="flex-grow-1 overflow-y-auto height-100 pb-0" >
+      <div  class="px-20 font-15 pt-20" style="border-top:1px solid #ebebeb;font-weight: 500;" *ngIf="taskParticipants.length >= 1 || taskParticipantsCc.length >= 1"  > Destinatário</div> 
+      <ion-item-sliding class="px-20"> 
+        <ion-item lines="none" *ngFor="let attendee of taskParticipants;" class="d-flex">
+          <div class="pr-10">
+            <ion-icon class="font-35" src="assets/images/icons-userprofile.svg"></ion-icon>
+          </div>
           <ion-label>
             <h3>{{ attendee.Name }}</h3>
             <p>{{ attendee.EmailAddress }}</p>
           </ion-label>
+          <div style="color:red" (click)="remove(attendee)">
+            X
+          </div>
+        </ion-item>
+      </ion-item-sliding>
+    </ion-list>
+    <ion-list lines="none" *ngIf="taskParticipantsCc.length >= 1 && adding == 'CC' " class="flex-grow-1 overflow-y-auto height-100 pb-0" >
+      <div  class="px-20 font-15 pt-20" style="border-top:1px solid #ebebeb;font-weight: 500;" *ngIf="taskParticipants.length >= 1 || taskParticipantsCc.length >= 1"  > Destinatário</div> 
+      
+      <ion-item-sliding  class="px-20"> 
+        <ion-item lines="none" *ngFor="let attendee of taskParticipantsCc;" class="d-flex">
+          <div class="pr-10">
+            <ion-icon class="font-35" src="assets/images/icons-userprofile.svg"></ion-icon>
+          </div>
+          <ion-label>
+            <h3>{{ attendee.Name }}</h3>
+            <p>{{ attendee.EmailAddress }}</p>
+          </ion-label>
+          <div style="color:red" (click)="remove(attendee)">
+            X
+          </div>
         </ion-item>
       </ion-item-sliding>
     </ion-list>
   </ion-item-group>
+
 </ion-content>
 
-
-<ion-footer class="ion-no-border">
-  <ion-toolbar class="btn-div">
+<!-- Hide footer in gabinete-digital -->
+<ion-footer class="ion-no-border" *ngIf="currentPath != '/home/gabinete-digital' ">
+  <ion-toolbar class="width-100 d-flex justify-space-between px-20">
     <ion-buttons slot="start">
       <ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
         <ion-label>Cancelar</ion-label>
         <ion-icon name="close" slot="start"></ion-icon>
       </ion-button>
     </ion-buttons>
-    <ion-title></ion-title>
     <ion-buttons slot="end">
       <ion-button class="btn-ok" fill="clear" color="#fff" (click)="save()">
-        <ion-label>OK</ion-label>
+        <ion-label>Gravar</ion-label>
         <ion-icon name="checkmark" slot="start"></ion-icon>
       </ion-button>
     </ion-buttons>

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

@@ -1,8 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { EventPerson } from 'src/app/models/eventperson.model';
-import { EventsService } from 'src/app/services/events.service';
-import { ModalController, NavController } from '@ionic/angular';
-import { AttendeeModalPage } from '../attendee-modal/attendee-modal.page';
+import { ModalController, NavParams } from '@ionic/angular';
+import { ContactsService } from 'src/app/services/contacts.service';
 
 @Component({
   selector: 'app-attendees',
@@ -11,69 +10,143 @@ import { AttendeeModalPage } from '../attendee-modal/attendee-modal.page';
 })
 export class AttendeesPage implements OnInit {
 
-  eventAttendees: EventPerson[];
-  segment:string = "true";
-  shouldShowCancel:boolean = true;
+  // Defined by the API
+  contacts: EventPerson[];
+  showLoader: boolean = false;
+  selectedContact: EventPerson[] =[];
+  eventPersons: EventPerson[];
+  adding: "intervenient" | "CC";
+  currentPath = window.location.pathname;
   
-  searchCountryString = ''; // initialize your searchCountryString string empty
-
-  constructor(private eventService: EventsService, private modalCtrl: ModalController, 
-    private navCtrl: NavController) { 
-  }
+  taskParticipants:EventPerson[] = [];
+  taskParticipantsCc:EventPerson[] = [];
 
+  constructor(
+    private modalCtrl: ModalController, 
+    private contactsService: ContactsService,
+    private navParams: NavParams,
+    private modalController: ModalController) {
+      this.adding = this.navParams.get('adding');
+      this.taskParticipants = this.navParams.get('taskParticipants');
+      this.taskParticipantsCc = this.navParams.get('taskParticipantsCc');
+    }
 
   ngOnInit() {
+    this.fetchContacts("");
+    
+    if(this.taskParticipants == null || this.taskParticipants == undefined){
+      this.taskParticipants = [];
+    }
+
+    if(this.taskParticipantsCc == null || this.taskParticipantsCc == undefined){
+      this.taskParticipantsCc = [];
+    }
+    
   }
   
+  ngOnChanges(event){}
+
   save(){
-    this.modalCtrl.dismiss(this.eventAttendees);
+
+    this.modalController.dismiss({
+      'taskParticipants': this.taskParticipants,
+      'taskParticipantsCc': this.taskParticipantsCc
+    });
   }
 
   close(){
-    this.modalCtrl.dismiss(null);
+    this.modalController.dismiss(false);
   }
 
-  removeAttendee(attendee: EventPerson)
-  {
-    let index: number = this.eventAttendees.findIndex((att) => {
-      return att.EmailAddress == attendee.EmailAddress
-    });
-
-    this.eventAttendees.splice(index, 1);
+  onChange(evt: any) {
+    this.fetchContacts(evt.detail.value);
   }
 
-  async addAttendees()
-  {
-    const modal = await this.modalCtrl.create({
-      component: AttendeeModalPage,
-      componentProps: {
-        eventPersons: this.eventAttendees
-      },
-      cssClass: 'attendee-modal',
-      backdropDismiss: false
-    });
+  filterSearchList(itm: EventPerson): boolean {
 
-    await modal.present();
+    if(this.adding == "intervenient"){
+      const result = this.taskParticipants.find((contact, index)=>{
         
-    modal.onDidDismiss().then((data) => {
-      let newattendees: EventPerson[] = data['data'];
+        if(contact.Name == itm.Name && contact.EmailAddress == itm.EmailAddress){
+          index = index;
+          return contact;
+        }
+      });
+      return undefined == result;
 
-      if (newattendees != null)
+    } else if (this.adding == "CC") {
+
+      const result = this.taskParticipantsCc.find((contact, index)=>{
+        
+      if(contact.Name == itm.Name && contact.EmailAddress == itm.EmailAddress){
+          index = index;
+          return contact;
+        }
+      });
+
+      return undefined == result;
+    }
+    
+  }
+
+  remove(itm: EventPerson){
+
+    if(this.adding == "intervenient"){
+
+      this.taskParticipants = this.taskParticipants.filter((contact, index) =>{
+
+        if(contact.Name != itm.Name && contact.EmailAddress != itm.EmailAddress){
+          return contact;
+        }
+        return false;
+  
+      });
+
+    } else if (this.adding == "CC") {
+
+      this.taskParticipantsCc = this.taskParticipantsCc.filter((contact, index) =>{
+
+        if(contact.Name != itm.Name && contact.EmailAddress != itm.EmailAddress){
+          return contact;
+        }
+        return false;
+  
+      });
+    }
+
+  }
+
+  async selectContact(itm: EventPerson){
+    if(this.adding == "intervenient"){
+
+      this.taskParticipants.push(itm);
+      
+    } else if (this.adding == "CC") {
+      
+      this.taskParticipantsCc.push(itm);
+    }
+  }
+
+  async fetchContacts(filter: string) {
+    this.showLoader = true;
+
+    this.contactsService.getContacts(filter).subscribe(result =>
       {
-        newattendees.forEach(newattendee => {
-          let att = {
-            "EmailAddress": newattendee.EmailAddress,
-            "Name": newattendee.Name,
-            "IsRequired": (this.segment == "true")
-          };
-          if (this.eventAttendees == null)
-          {
-            this.eventAttendees = new Array();
-          }
-          this.eventAttendees.push(att);
-        });
+        if (this.eventPersons != null)
+        {
+          this.eventPersons.forEach(attendee => {
+            const index: number = result.findIndex((cont) => {
+              return cont.EmailAddress == attendee.EmailAddress
+            });
+  
+            result.splice(index, 1);
+          });
+        }
+
+        this.contacts = result;
+        this.showLoader = false;
       }
-    });
+    );
   }
 
 }