Add success message

This commit is contained in:
Peter Maquiran
2021-06-08 15:59:06 +01:00
parent 8ff7458b98
commit 1089628ef3
54 changed files with 2351 additions and 478 deletions
+61 -8
View File
@@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { AlertController, ModalController, NavParams } from '@ionic/angular';
import { AlertController, AnimationController, ModalController, NavParams } from '@ionic/angular';
import { Event } from 'src/app/models/event.model'
import { EventBody } from 'src/app/models/eventbody.model';
import { ProcessesService } from 'src/app/services/processes.service';
@@ -11,8 +11,8 @@ import { AddParticipantsModalPage } from 'src/app/pages/gabinete-digital/expedie
import { AddParticipantsCcModalPage } from 'src/app/pages/gabinete-digital/expediente/add-participants-cc-modal/add-participants-cc-modal.page';
import { DiscartExpedientModalPage } from 'src/app/pages/gabinete-digital/discart-expedient-modal/discart-expedient-modal.page';
import { AlertService } from 'src/app/services/alert.service';
import { BadRequestComponent } from 'src/app/shared/popover/bad-request/bad-request.component';
import { SuccessMessageComponent } from 'src/app/shared/popover/success-message/success-message.component';
import { BadRequestPage } from 'src/app/shared/popover/bad-request/bad-request.page';
import { SuccessMessagePage } from 'src/app/shared/popover/success-message/success-message.page';
@Component({
selector: 'app-delegar',
@@ -47,6 +47,7 @@ export class DelegarPage implements OnInit {
private calendarService: EventsService,
public alertController: AlertController,
private alertService: AlertService,
private animationController: AnimationController,
) {
this.task = this.navParams.get('task');
this.postData = new Event();
@@ -175,12 +176,38 @@ export class DelegarPage implements OnInit {
async successMessage(message?: string) {
const enterAnimation = (baseEl: any) => {
const backdropAnimation = this.animationController.create()
.addElement(baseEl.querySelector('ion-backdrop')!)
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
const wrapperAnimation = this.animationController.create()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.keyframes([
{ offset: 0, opacity: '1', right: '-100%' },
{ offset: 1, opacity: '1', right: '0px' }
]);
return this.animationController.create()
.addElement(baseEl)
.easing('ease-out')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
}
const leaveAnimation = (baseEl: any) => {
return enterAnimation(baseEl).direction('reverse');
}
const modal = await this.modalController.create({
component: SuccessMessageComponent,
enterAnimation,
leaveAnimation,
component: SuccessMessagePage,
componentProps: {
message: message || 'Processo efetuado' ,
},
cssClass: 'modal modal-desktop'
cssClass: 'notification-modal'
});
modal.present()
@@ -192,12 +219,38 @@ export class DelegarPage implements OnInit {
}
async badRequest(message?: string) {
const enterAnimation = (baseEl: any) => {
const backdropAnimation = this.animationController.create()
.addElement(baseEl.querySelector('ion-backdrop')!)
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
const wrapperAnimation = this.animationController.create()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.keyframes([
{ offset: 0, opacity: '1', right: '-100%' },
{ offset: 1, opacity: '1', right: '0px' }
]);
return this.animationController.create()
.addElement(baseEl)
.easing('ease-out')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
}
const leaveAnimation = (baseEl: any) => {
return enterAnimation(baseEl).direction('reverse');
}
const modal = await this.modalController.create({
component: BadRequestComponent,
enterAnimation,
leaveAnimation,
component: BadRequestPage,
componentProps: {
message: message || 'Processo não efetuado' ,
message: message || 'Processo efetuado' ,
},
cssClass: 'modal modal-desktop'
cssClass: 'notification-modal'
});
modal.present()