Improve agenda

src/app/shared/agenda/approve-event/approve-event.component.html

@@ -0,0 +1,107 @@
+<ion-header class="ion-no-border">
+  <div class="header-content">
+    <div class="header-icon-left">
+      <ion-icon (click)="close()" src="assets/images/icons-arrow-arrow-left.svg"></ion-icon>
+    </div>
+    <div class="header-title">
+      <label>""{{loadedEvent.workflowInstanceDataFields.Subject}}</label>
+    </div>
+    <div class="header-icon-right">
+      <ion-icon (click)="notImplemented()" src="assets/images/icons-edit.svg"></ion-icon>
+    </div>
+  </div>
+</ion-header>
+<ion-menu autoHide="false" side="end" content-id="main-content">
+  <ion-header>
+    <ion-toolbar translucent>
+      <ion-title>Ações</ion-title>
+    </ion-toolbar>
+  </ion-header>
+  <ion-content>
+    <ion-list>
+      <ion-item (click)="approveTask(loadedEvent.serialNumber)">
+        <ion-icon name="checkmark-sharp"></ion-icon>
+        <ion-label>Aprovar</ion-label>
+      </ion-item>
+      <ion-item (click)="emendTask(loadedEvent.serialNumber)">
+        <ion-icon name="create-outline"></ion-icon>
+        <ion-label>Emendar</ion-label>
+      </ion-item>
+      <ion-item (click)="rejectTask(loadedEvent.serialNumber)">
+        <ion-icon name="close-sharp"></ion-icon>
+        <ion-label>Rejeitar</ion-label>
+      </ion-item>
+    </ion-list>
+  </ion-content>
+</ion-menu>
+
+<ion-content id="main-content">
+  <div class="upper-content">
+    <div class="content-location">
+      <div class="location-detail">
+        <ion-label >{{loadedEvent.workflowInstanceDataFields.Location}}</ion-label>
+      </div>
+      <div class="button-calendar-type">
+        <ion-button  class="button-calendar-type" slot="end">{{loadedEvent.workflowInstanceDataFields.Agenda}}</ion-button>
+      </div>
+    </div>
+    <div class="content-details">
+      <ion-label>
+        <p>{{customDate}}</p>
+        <p>das {{loadedEvent.workflowInstanceDataFields.StartDate | date: 'hh:mm'}} às {{loadedEvent.workflowInstanceDataFields.EndDate | date: 'hh:mm'}}</p>
+        <p *ngIf="!loadedEvent.workflowInstanceDataFields.IsRecurring">(Não se repete)</p>
+        <p *ngIf="loadedEvent.workflowInstanceDataFields.IsRecurring">Repete</p>
+      </ion-label>
+    </div>
+  </div>
+  <div class="middle-content">
+    <ion-item>
+      <ion-label>
+        <h3>Intervenientes</h3>
+        <p>{{loadedEvent.workflowInstanceDataFields.Participants}}</p>
+      </ion-label>
+    </ion-item>
+    <ion-item>
+      <ion-label>
+        <h3>Detalhes</h3>
+        <p>{{loadedEvent.workflowInstanceDataFields.Body}}</p>
+      </ion-label>
+    </ion-item>
+  </div>
+
+  <div *ngIf="loadedAttachments" class="bottom-content">
+    <ion-list>
+      <h3>Documentos Anexados</h3>
+      <ion-item>
+      <ion-label>
+        <p class="attach-title-item">Receita por Natureza</p>
+        <p><span class="span-left">{{loadedAttachments.Remetente}}</span><span class="span-right">{{loadedAttachments.CreateDate}}<!-- {{ task.CreateDate | date: 'dd-MM-yy' }} --></span></p>
+      </ion-label>
+    </ion-item>
+    </ion-list>
+  </div>
+</ion-content>
+<ion-footer>
+  <ion-toolbar>
+    <div class="buttons">
+    <ion-item lines="none">
+      <p>
+        <ion-button class="button-edit-event" shape="round" (click)="emendTask(loadedEvent.serialNumber)">Emendar</ion-button>
+      </p>
+      <p>
+       <ion-menu-button autoHide="false">
+        <ion-icon  (click)="openMenu()" name="ellipsis-vertical-outline"></ion-icon>
+      </ion-menu-button>
+      </p>
+      <p>
+        <ion-button class="button-approve" shape="round" (click)="approveTask(loadedEvent.serialNumber)">Aprovar</ion-button>
+      </p>
+    </ion-item>
+    <ion-item hidden>
+      <p>
+        <ion-button class="button-reject" shape="round" (click)="rejectTask(loadedEvent.serialNumber)">Rejeitar</ion-button>
+      </p>
+    </ion-item>
+  </div>
+  </ion-toolbar>
+</ion-footer>

src/app/shared/agenda/approve-event/approve-event.component.scss

@@ -0,0 +1,142 @@
+ion-content{
+    --padding-top:0px;
+    --padding-start: 20px;
+    --padding-end: 20px;
+    font-size: 18px;
+  }
+  ion-menu{
+    --height: 225px;
+  }
+  .header-content{
+    width: 360px;
+    overflow: auto;
+    margin: 25px auto;
+  }
+  .header-icon-left{
+    width: 36px;
+    font-size: 33px;
+    color: #42b9fe;
+    float: left;
+  }
+  .header-title{
+    width: 264px;
+    font-family: Roboto;
+    font-size: 25px;
+    margin: 0 5px 0 5px;
+    padding: 0;
+    color:#000;
+    float: left;
+  }
+  .header-icon-right{
+    width: 45px;
+    font-size: 45px;
+    float: left;
+    overflow: auto;
+  }
+  .upper-content{
+    margin-left: 50px;
+    overflow: auto;
+    font-size: 18px;
+  
+    .content-location{
+      width: 360px;
+      margin: 0 auto;
+      padding: 0;
+      overflow: auto;
+    }
+  
+    .location-detail{
+      width: 210px;
+      font-weight: 700;
+      font-size: 18px;
+      float: left;
+      margin: 5px 5px 5px 0px;
+    }
+    .button-calendar-type{
+        width: 91px;
+        --border-radius: 12.5px;
+        --background: #ffb703;
+        margin-left: 5px;
+        float: left;
+    }
+    .button-calendar-type ion-button{
+      height: 25px;
+    }
+    .button-edit-event {
+        width: 140px;
+        height: 44px;
+        border-radius: 22.5px;
+        --background: #e0e9ee;
+        --color:#061b52;
+    }
+    .content-details p{
+        font-size: 16px;
+    }
+  }
+  .middle-conten{
+    .middle-content h3, .middle-content p{
+      font-size: 16px;
+    }
+  }
+  
+  .bottom-content{
+    width: 360px;
+    margin: 0 auto;
+    
+    .bottom-content h3{
+      font-size: 16px;
+      margin: 0 0 0 10px;
+    }
+    .attach-document{
+      font-size: 15px;
+      color: #0d89d1;
+      margin: 5px 5px 5px 10px;
+      padding: 5px;
+      float: left;
+    }
+    .attach-icon{
+      width: 37px;
+      font-size: 35px;
+      float: left;
+    }
+    .attach-title-item{
+      width: 100%;
+      font-size: 15px;
+      color:#0d89d1;
+    }
+    /* SPAN */
+    .span-left{
+      float: left;
+      font-size: 15x;
+    }
+    .span-right{
+    text-align: right;
+    float: right;
+    font-size: 13px;
+    }
+  }
+  
+  .buttons{
+    width: 360px;
+    margin: 0 auto;
+  }
+  
+  .button-options {
+      height: 44px;
+       --color: #42b9fe;
+       /* opacity: 0; */
+  }
+  .button-approve {
+    width: 140px;
+    height: 44px;
+    border-radius: 22.5px;
+    --background: #42b9fe;
+  }
+  .button-reject {
+    width: 140px;
+    height: 44px;
+    --color: #d30a0a;
+    border-radius: 22.5px;
+    --background: #ffe0e0;
+  }
+  

src/app/shared/agenda/approve-event/approve-event.component.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { ApproveEventComponent } from './approve-event.component';
+
+describe('ApproveEventComponent', () => {
+  let component: ApproveEventComponent;
+  let fixture: ComponentFixture<ApproveEventComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ApproveEventComponent ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ApproveEventComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/shared/agenda/approve-event/approve-event.component.ts

@@ -0,0 +1,148 @@
+import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
+import { Router } from '@angular/router';
+import { MenuController, ModalController, NavParams, PopoverController } from '@ionic/angular';
+import { Event } from 'src/app/models/event.model';
+import { AlertService } from 'src/app/services/alert.service';
+import { AttachmentsService } from 'src/app/services/attachments.service';
+import { ProcessesService } from 'src/app/services/processes.service';
+import { EmendMessageModalPage } from 'src/app/pages/agenda/emend-message-modal/emend-message-modal.page';
+import { EventActionsPopoverPage } from 'src/app/pages/agenda/event-actions-popover/event-actions-popover.page';
+
+
+@Component({
+  selector: 'app-approve-event',
+  templateUrl: './approve-event.component.html',
+  styleUrls: ['./approve-event.component.scss'],
+})
+export class ApproveEventComponent implements OnInit {
+
+  event: Event;
+  loadedEvent:any;
+  loadedAttachments:any;
+  customDate:any;
+  today:any;
+  
+  months = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
+  days = ["Domingo", "Segunda-feira", "Terça-feira", "Quarta-feira", "Quinta-feira", "Sexta-feira", "Sábado"];
+
+  @Input() serialNumber:string;
+
+  @Output() approveEventDismiss = new EventEmitter<any>();
+  @Output() closeEventToApprove = new EventEmitter<any>();
+
+  constructor(
+    private router:Router,
+    private modalController: ModalController,
+    private processes:ProcessesService,
+    private attachmentsService: AttachmentsService,
+    private popoverController: PopoverController,
+    private menu: MenuController,
+    private alertService: AlertService
+  ) { }
+
+  ngOnInit() {
+    this.getTask();
+    this.getAttachments();
+  }
+
+  notImplemented(){
+    this.alertService.presentAlert('Funcionalidade em desenvolvimento');
+  }
+
+  close(){
+    /* this.router.navigate(['/home/gabinete-digital/event-list']); */
+    this.closeEventToApprove.emit();
+  }
+
+  getTask(){
+    this.processes.GetTask(this.serialNumber).subscribe(res => {
+      console.log(res);
+      this.loadedEvent = res;
+      this.today = new Date(res.workflowInstanceDataFields.StartDate);
+      console.log(new Date(this.today));
+      this.customDate = this.days[this.today.getDay()]+ ", "  + this.today.getDate() +" de "  + ( this.months[this.today.getMonth()]);
+      
+    })
+  }
+  approveTask(serialNumber:string){
+
+    this.approveEventDismiss.emit({ 
+      "serialNumber": serialNumber,
+      "action": "Aprovar", 
+      "saveData": {
+        loadedEvent: this.loadedEvent,
+        today: this.today,
+        customDate: this.customDate
+      }
+    });
+  }
+
+  emendTask(serialNumber:string){
+    /* console.log('Emendar'); */
+    this.menu.close();
+    this.openEmendMessageModal(serialNumber);
+    this.modalController.dismiss(null);
+  }
+
+  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']);
+    this.modalController.dismiss(null);
+  }
+  
+  getAttachments(){
+    this.attachmentsService.getAttachmentsBySerial(this.serialNumber).subscribe(res=>{
+      this.loadedAttachments = res;
+      console.log(res);
+    });
+  }
+
+  async openOptions(ev:any) {
+    const popover = await this.popoverController.create({
+      component: EventActionsPopoverPage,
+      cssClass: 'event-actions-popover',
+      event: ev,
+      translucent: true
+    });
+    return await popover.present();
+  }
+  
+  openMenu() {
+    this.menu.open();
+  }
+  async openEmendMessageModal(serialNumber:string) {
+    const modal = await this.modalController.create({
+      component: EmendMessageModalPage,
+      componentProps:{
+        
+      },
+      cssClass: 'emend-message-modal',
+      backdropDismiss: false
+    });
+
+    await modal.present();
+
+    modal.onDidDismiss().then(res => {
+      if(res.data !== ''){
+        let body = { "serialNumber": serialNumber, 
+        "action": "Emendar",
+        "dataFields": {
+        "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!');
+      }
+      else{
+        this.alertService.presentAlert('Operação cancelada!');
+      }
+    });
+  }
+
+}

src/app/shared/agenda/event-list/event-list.component.ts

@@ -24,6 +24,8 @@ export class EventListComponent implements OnInit {
 
   @Input() segment:string;
   @Output() cloneAllmobileComponent = new EventEmitter<any>();
+  @Output() approveEventDismiss = new EventEmitter<any>();
+
 
 
   constructor(
@@ -57,18 +59,15 @@ export class EventListComponent implements OnInit {
       });
     }
     async openApproveModal(eventSerialNumber){
-      const modal = await this.modalController.create({
-        component: ApproveEventModalPage,
-        componentProps:{
-          serialNumber: eventSerialNumber,
-        },
-        cssClass: 'cal-modal',
-        backdropDismiss: false
+
+      debugger
+
+      this.approveEventDismiss.emit({ 
+        "serialNumber": eventSerialNumber,
+        "action": "Aprovar", 
+        "saveData": {}
       });
-  
-      await modal.present();
-  
-      modal.onDidDismiss();
+
     }
     doRefresh(event) {
       this.LoadToApproveEvents();