Edit task detail page and add integration methods

This commit is contained in:
Tiago Kayaya
2020-11-06 14:39:09 +01:00
parent bfa4f2ec91
commit d3dd83c8a8
13 changed files with 196 additions and 20 deletions
@@ -10,6 +10,10 @@ const routes: Routes = [
},
{
path: 'approve-event-modal',
loadChildren: () => import('./approve-event-modal/approve-event-modal.module').then( m => m.ApproveEventModalPageModule)
},
{
path: 'event-actions-popover',
loadChildren: () => import('./event-actions-popover/event-actions-popover.module').then( m => m.EventActionsPopoverPageModule)
}
@@ -28,7 +28,7 @@
<ion-item>
<ion-label>
<h3>Detalhes</h3>
<p>MINEC, MINFIN</p>
<p>{{loadedEvent.workflowInstanceDataFields.Body}}</p>
</ion-label>
</ion-item>
<ion-item lines="none">
@@ -45,8 +45,16 @@
</ion-content>
<ion-footer>
<ion-toolbar>
<ion-button class="button-edit-event" shape="round" (click)="editEvent()">Emendar</ion-button>
<ion-button class="button-options" shape="round" (click)="openOptions()"><ion-icon name="ellipsis-vertical-outline"></ion-icon></ion-button>
<ion-button shape="round" (click)="approveEvent()">Aprovar</ion-button>
<ion-item lines="none">
<p>
<ion-button class="button-edit-event" shape="round" (click)="emendarTask(loadedEvent.serialNumber)">Emendar</ion-button>
</p>
<p>
<ion-button class="button-options" shape="round" fill="clear" (click)="openOptions(loadedEvent)"><ion-icon slot="icon-only" name="ellipsis-vertical-outline"></ion-icon></ion-button>
</p>
<p>
<ion-button class="button-approve" shape="round" (click)="approveTask(loadedEvent.serialNumber)">Aprovar</ion-button>
</p>
</ion-item>
</ion-toolbar>
</ion-footer>
@@ -1,3 +1,6 @@
ion-toolbar{
padding: 10px;
}
.location-detail{
font-size: 18px;
}
@@ -5,22 +8,22 @@
width: 91px;
height: 25px;
--border-radius: 12.5px;
--background-color: #ffb703;
--background: #ffb703;
}
.button-edit-event {
width: 170px;
width: 140px;
height: 44px;
border-radius: 22.5px;
background-color: #e0e9ee;
--background: #e0e9ee;
--color:#061b52;
}
.button-options {
width: 36px;
height: 35px;
object-fit: contain;
height: 44px;
--color: #42b9fe;
}
.button-approve {
width: 170px;
width: 140px;
height: 44px;
border-radius: 22.5px;
background-color: #42b9fe;
--background: #42b9fe;
}
@@ -1,8 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ModalController, NavParams } from '@ionic/angular';
import { MenuController, ModalController, NavParams, PopoverController } from '@ionic/angular';
import { Event } from 'src/app/models/event.model';
import { ProcessesService } from 'src/app/services/processes.service';
import { EventActionsPopoverPage } from '../event-actions-popover/event-actions-popover.page';
@Component({
selector: 'app-approve-event-modal',
@@ -19,6 +20,7 @@ export class ApproveEventModalPage implements OnInit {
private modalController: ModalController,
private navParams: NavParams,
private processes:ProcessesService,
private popoverController: PopoverController,
)
{
this.serialNumber = this.navParams.get('serialNumber');
@@ -64,12 +66,32 @@ export class ApproveEventModalPage implements OnInit {
editEvent(){
}
openOptions(){
approveTask(serialNumber:string){
let body = { "serialNumber": serialNumber, "action": "Aprovar" }
console.log(body);
this.processes.PostTaskAction(body);
this.router.navigate(['/home/gabinete-digital/event-list']);
this.modalController.dismiss(null);
}
approveEvent(){
emendarTask(serialNumber:string){
let body = { "serialNumber": serialNumber, "action": "Rejeitar" }
console.log(body);
this.processes.PostTaskAction(body);
this.router.navigate(['/home/gabinete-digital/event-list']);
this.modalController.dismiss(null);
}
async openOptions(ev:any) {
const popover = await this.popoverController.create({
component: EventActionsPopoverPage,
cssClass: 'event-actions-popover',
event: ev,
translucent: true
});
return await popover.present();
}
}
@@ -0,0 +1,17 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { EventActionsPopoverPage } from './event-actions-popover.page';
const routes: Routes = [
{
path: '',
component: EventActionsPopoverPage
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class EventActionsPopoverPageRoutingModule {}
@@ -0,0 +1,20 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
import { EventActionsPopoverPageRoutingModule } from './event-actions-popover-routing.module';
import { EventActionsPopoverPage } from './event-actions-popover.page';
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
EventActionsPopoverPageRoutingModule
],
declarations: [EventActionsPopoverPage]
})
export class EventActionsPopoverPageModule {}
@@ -0,0 +1,15 @@
<ion-list>
<ion-item>
<p>
<ion-button class="button-edit-event" shape="round" (click)="editTask()">Emendar</ion-button>
</p>
<p>
<ion-button class="button-approve" shape="round" (click)="approveTask()">Aprovar</ion-button>
</p>
</ion-item>
<ion-item lines="none">
<p>
<ion-button class="button-discart-event" shape="round" (click)="deleteTask()">Rejeitar</ion-button>
</p>
</ion-item>
</ion-list>
@@ -0,0 +1,24 @@
.button-edit-event {
/* width: 140px; */
height: 44px;
border-radius: 22.5px;
--background: #e0e9ee;
--color:#061b52;
}
.button-options {
height: 44px;
--color: #42b9fe;
}
.button-approve {
/* width: 140px; */
height: 44px;
border-radius: 22.5px;
--background: #42b9fe;
}
.button-discart-event {
/* width: 140px; */
height: 44px;
border-radius: 22.5px;
--background: #d30a0a;
--color:#fff;
}
@@ -0,0 +1,24 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';
import { EventActionsPopoverPage } from './event-actions-popover.page';
describe('EventActionsPopoverPage', () => {
let component: EventActionsPopoverPage;
let fixture: ComponentFixture<EventActionsPopoverPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ EventActionsPopoverPage ],
imports: [IonicModule.forRoot()]
}).compileComponents();
fixture = TestBed.createComponent(EventActionsPopoverPage);
component = fixture.componentInstance;
fixture.detectChanges();
}));
it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,29 @@
import { Component, OnInit } from '@angular/core';
import { NavParams, PopoverController } from '@ionic/angular';
@Component({
selector: 'app-event-actions-popover',
templateUrl: './event-actions-popover.page.html',
styleUrls: ['./event-actions-popover.page.scss'],
})
export class EventActionsPopoverPage implements OnInit {
constructor(private navParams: NavParams,
private popoverController: PopoverController,) { }
ngOnInit() {
}
closePopover(){
this.popoverController.dismiss();
}
approveTask(){
}
editTask(){
}
deleteTask(){
}
}