peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-18 20:47:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add success message

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/publications/new-action/new-action.page.ts
+61 -7
View File
@@ -1,9 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { AnimationController, ModalController } from '@ionic/angular';
import { PublicationFolder } from 'src/app/models/publicationfolder';
import { PublicationsService } from 'src/app/services/publications.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-new-action',
@@ -17,7 +17,9 @@ export class NewActionPage implements OnInit {
constructor(
private modalController: ModalController,
private publication: PublicationsService
private publication: PublicationsService,
private animationController: AnimationController,
) {
this.folder = new PublicationFolder();
}
@@ -56,12 +58,38 @@ export class NewActionPage 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()
@@ -73,8 +101,34 @@ export class NewActionPage implements OnInit {
}
async badRequest() {
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: 'Processo não realizado com sucesso',
},
src/app/pages/publications/publication-detail/publication-detail.page.ts
+59 -6
View File
@@ -1,9 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { ModalController, NavParams } from '@ionic/angular';
import { AnimationController, ModalController, NavParams } from '@ionic/angular';
import { Publication } from 'src/app/models/publication';
import { PublicationsService } from 'src/app/services/publications.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';
import { ImageModalPage } from '../gallery/image-modal/image-modal.page';
import { NewPublicationPage } from '../new-publication/new-publication.page';
@@ -23,6 +23,7 @@ export class PublicationDetailPage implements OnInit {
private modalController: ModalController,
private navParams:NavParams,
private publications:PublicationsService,
private animationController: AnimationController
) {
this.publicationId = this.navParams.get('publicationId');
/* this.folderId = this.navParams.get('folderIdId'); */
@@ -123,12 +124,38 @@ export class PublicationDetailPage 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()
@@ -140,8 +167,34 @@ export class PublicationDetailPage implements OnInit {
}
async badRequest() {
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: 'Processo não realizado com sucesso',
},
src/app/pages/publications/view-publications/publication-detail/publication-detail.page.ts
+59 -6
View File
@@ -1,9 +1,9 @@
import { Component, OnInit } from '@angular/core';
import { ModalController, NavParams } from '@ionic/angular';
import { AnimationController, ModalController, NavParams } from '@ionic/angular';
import { Publication } from 'src/app/models/publication';
import { PublicationsService } from 'src/app/services/publications.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';
import { ImageModalPage } from '../../gallery/image-modal/image-modal.page';
import { NewPublicationPage } from '../../new-publication/new-publication.page';
@@ -22,6 +22,7 @@ export class PublicationDetailPage implements OnInit {
private modalController: ModalController,
private navParams:NavParams,
private publications:PublicationsService,
private animationController: AnimationController
) {
this.publicationId = this.navParams.get('publicationId');
this.folderId = this.navParams.get('folderId');
@@ -125,12 +126,38 @@ export class PublicationDetailPage 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()
@@ -142,8 +169,34 @@ export class PublicationDetailPage implements OnInit {
}
async badRequest() {
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: 'Processo não realizado com sucesso',
},