This commit is contained in:
Peter Maquiran
2021-05-28 07:52:16 +01:00
parent 87b900df98
commit 9528bdbb08
4 changed files with 84 additions and 75 deletions
@@ -9,52 +9,17 @@
</div>
</div>
<ion-title class="title">Digite o PIN novo</ion-title>
<div class="d-flex pt-25">
<div class="dot" [class.dot-active]="code.length >= 1"></div>
<div class="dot" [class.dot-active]="code.length >= 2"></div>
<div class="dot" [class.dot-active]="code.length >= 3"></div>
<div class="dot"[class.dot-active]="code.length >= 4"></div>
</div>
<div class="terminal">
<ion-title class="title">....</ion-title>
<div class="d-flex">
<div class="circle" (click)="setCode('1')">1</div> <div class="circle" (click)="setCode('2')">2</div> <div class="circle" (click)="setCode('3')">3</div>
</div>
<div class="terminal d-flex align-center justity-content-center flex-column">
<div class="d-flex">
<div class="circle" (click)="setCode('4')">4</div> <div class="circle" (click)="setCode('5')">5</div> <div class="circle" (click)="setCode('6')">6</div>
</div>
<div (click)="login()">Login</div>
<div class="d-flex">
<div class="circle" (click)="setCode('7')">7</div> <div class="circle" (click)="setCode('8')">8</div> <div class="circle" (click)="setCode('9')">9</div>
</div>
<div (click)="save()" class="pt-50 mt-50">Register</div>
<div class="d-flex align-center justify-center">
<div class="circle" (click)="setCode('0')">0</div>
</div>
</div>
<div (click)="clearCode()" class="d-flex align-center justify-center pt-25 clear">
Limpar
</div>
</div>
</ion-content>
<ion-footer class=" footer-container ion-no-border">
<div class="d-flex justify-space-between">
<ion-buttons slot="start" >
<ion-button (click)="close()" class="btn-cancel" fill="clear" color="#061b52" >
<ion-label>Cancelar</ion-label>
</ion-button>
</ion-buttons>
<ion-buttons slot="end" >
<ion-button (click)="save()" class="btn-ok" fill="clear" color="#fff" >
<ion-label>Gravar</ion-label>
</ion-button>
</ion-buttons>
</div>
</ion-footer>
+32 -31
View File
@@ -12,31 +12,32 @@ import { FingerprintAIO } from '@ionic-native/fingerprint-aio';
export class FingerprintPage implements OnInit {
constructor( private modalController: ModalController,
private faio: FingerprintAIO) {
//private faio: FingerprintAIO
) {
}
ngOnInit() {
}
login() {
this.faio.show({
clientId: 'Fingerprint-Demo',
clientSecret: 'password', //Only necessary for Android
disableBackup:true, //Only for Android(optional)
localizedFallbackTitle: 'Use Pin', //Only for iOS
localizedReason: 'Please authenticate' //Only for iOS
})
.then((FingerPrintHash: any) => {
console.log(FingerPrintHash)
// this.faio.show({
// clientId: 'Fingerprint-Demo',
// clientSecret: 'password', //Only necessary for Android
// disableBackup:true, //Only for Android(optional)
// localizedFallbackTitle: 'Use Pin', //Only for iOS
// localizedReason: 'Please authenticate' //Only for iOS
// })
// .then((FingerPrintHash: any) => {
// console.log(FingerPrintHash)
const storedFinderPrint = localStorage.getItem('FingerPrintHash')
if(FingerPrintHash == storedFinderPrint) {
// const storedFinderPrint = localStorage.getItem('FingerPrintHash')
// if(FingerPrintHash == storedFinderPrint) {
}
})
.catch((error: any) => {
console.log(error)
});
// }
// })
// .catch((error: any) => {
// console.log(error)
// });
}
close() {
@@ -46,20 +47,20 @@ export class FingerprintPage implements OnInit {
async save() {
this.faio.show({
clientId: 'Fingerprint-Demo',
clientSecret: 'password', //Only necessary for Android
disableBackup:true, //Only for Android(optional)
localizedFallbackTitle: 'Use Pin', //Only for iOS
localizedReason: 'Please authenticate' //Only for iOS
})
.then((FingerPrintHash: any) => {
this.successMessage()
localStorage.setItem('FingerPrintHash', FingerPrintHash)
})
.catch((error: any) => {
this.badRequest()
});
// this.faio.show({
// clientId: 'Fingerprint-Demo',
// clientSecret: 'password', //Only necessary for Android
// disableBackup:true, //Only for Android(optional)
// localizedFallbackTitle: 'Use Pin', //Only for iOS
// localizedReason: 'Please authenticate' //Only for iOS
// })
// .then((FingerPrintHash: any) => {
// this.successMessage()
// localStorage.setItem('FingerPrintHash', FingerPrintHash)
// })
// .catch((error: any) => {
// this.badRequest()
// });
}
@@ -31,15 +31,19 @@
<ion-row>
<ion-col class="align-center d-flex">
<div (click)="addPin()">
<div (click)="addPin()" class="d-flex align-center">
<ion-checkbox class="checkBox"></ion-checkbox>
PIN
</div>
</ion-col>
<ion-col class="align-center d-flex">
<div (click)="addFingerprint()" class="d-flex align-center">
<ion-checkbox class="checkBox"></ion-checkbox>
Impressão Digital
</div>
</ion-col>
<ion-col class="align-center d-flex">
<ion-checkbox class="checkBox"></ion-checkbox>
PIN
</ion-col>
</ion-row>
</div>
@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { AnimationController, ModalController } from '@ionic/angular';
import { User } from 'src/app/models/user.model';
import { AuthService } from 'src/app/services/auth.service';
import { FingerprintPage } from 'src/app/shared/fingerprint/fingerprint.page';
import { PinPage } from 'src/app/shared/pin/pin.page';
@Component({
@@ -66,4 +67,42 @@ export class ProfileComponent implements OnInit {
}
async addFingerprint() {
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({
enterAnimation,
leaveAnimation,
component: FingerprintPage,
cssClass: 'model profile-modal',
componentProps: {
}
});
modal.present();
}
}