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

Add Pin

Browse Source
This commit is contained in:
Peter Maquiran
2021-05-28 14:41:56 +01:00
parent 9528bdbb08
commit 3855dedb66
10 changed files with 259 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+5
View File
@@ -7625,6 +7625,11 @@
"randomfill": "^1.0.3"
}
},
"crypto-js": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.0.0.tgz",
"integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg=="
},
"css": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/css/-/css-3.0.0.tgz",
package.json
+1
View File
@@ -50,6 +50,7 @@
"cordova-plugin-okhttp": "^2.0.0",
"cordova-res": "^0.15.3",
"cordova-sqlite-storage": "^5.1.0",
"crypto-js": "^4.0.0",
"date-fns": "^2.17.0",
"ionic-angular": "^3.9.10",
"ionic-selectable": "^4.7.1",
src/app/pages/login/login.module.ts
+3 -1
View File
@@ -15,7 +15,9 @@ import { LoginPage } from './login.page';
IonicModule,
LoginPageRoutingModule
],
declarations: [LoginPage],
declarations: [
LoginPage
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class LoginPageModule {}
src/app/pages/login/login.page.html
+46 -3
View File
@@ -1,8 +1,8 @@
<ion-content class="text-white">
<div class="wrapper">
<div class="wrapper" *ngIf="pin ==false">
<div class="div-logo">
<img src='assets/images/logo-no-bg.png' alt='logo'>
</div>
<img src='assets/images/logo-no-bg.png' alt='logo'>
</div>
<h3 class="center text-white">Inicie a sessão</h3>
<form class="form">
<p class="form-label text-white">Nome de utilizador</p>
@@ -16,5 +16,48 @@
<ion-button class="btn-ok-login" fill="clear" expand="block" shape="round" (click)="Login()">Iniciar</ion-button>
</form>
</div>
<div class="main-content height-100" *ngIf="pin">
<div class=" align-center justify-center">
<div class="div-top-header">
<div class="div-logo">
<img src='assets/images/logo-bg.png' alt='logo'>
</div>
</div>
<ion-title class="title">Digite o PIN novo</ion-title>
<div class="d-flex pt-25 align-center justify-center">
<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">
<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="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 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 class="d-flex align-center justify-center">
<div class="circle" (click)="setCode('0')">0</div>
</div>
</div>
<div class="d-flex align-center justify-center pt-25 clear" (click)="pin=!pin">
Voltar
</div>
</div>
</div>
</ion-content>
src/app/pages/login/login.page.scss
+88 -2
View File
@@ -44,9 +44,95 @@ ion-item{
color: #ffffff !important;
}
:host, app-login{
ion-content{
:host, app-login {
ion-content {
background: linear-gradient(180deg, #42B9FE 0%, #0782C9 100%) !important;
}
}
ion-content{
background-color: white !important;
}
@import '~src/function.scss';
.div-top-header{
margin: 0 em(20px);
padding-top: em(15px);
border: 0!important;
}
.div-logo {
background: transparent;
width: em(140px);
justify-content: center;
display: flex;
}
.div-logo img{
width: 100%;
margin: 0px auto;
}
.circle{
color: white;
width: 70px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
font-size: 19pt;
background: #44b5ea;
border-radius: 56px;
margin-left: 30px;
margin-bottom: 15px;
}
.title{
padding-top: 32px;
}
.terminal {
padding-top: 112px;
margin-left: -30px;
justify-content: center;
display: flex;
flex-direction: column;
align-items: center;
}
.clear{
color: #44b5ea;
font-size: 12pt;
}
.dot-active{
background: #44b5ea;
}
.dot{
width: 25px;
height: 25px;
margin: 0 10px 0 0;
border: 3px solid #44b5ea;
box-sizing: border-box;
border-radius: 50px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
-ms-border-radius: 50px;
-o-border-radius: 50px;
}
.main-content{
background-color: white;
text-align: center;
align-items: center;
justify-content: center;
background-image: url("/assets/background/auth.svg");
background-size: 686px 674px;
background-position: center;
background-position-y: 78px;
background-repeat: no-repeat;
}
src/app/pages/login/login.page.ts
+79 -7
View File
@@ -4,20 +4,22 @@ import { AuthService } from 'src/app/services/auth.service';
import { User, UserForm } from 'src/app/models/user.model';
import { ToastService } from 'src/app/services/toast.service';
import { environment } from 'src/environments/environment';
import { AlertController } from '@ionic/angular';
import { AlertController, ModalController } from '@ionic/angular';
import { StorageService } from 'src/app/services/storage.service';
import { AuthConnstants } from 'src/app/config/auth-constants';
import { PhotoService } from 'src/app/services/photo.service';
import { NotificationsService } from 'src/app/services/notifications.service';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import crypto from 'crypto-js'
import { SuccessMessageComponent } from 'src/app/shared/popover/success-message/success-message.component';
import { BadRequestComponent } from 'src/app/shared/popover/bad-request/bad-request.component';
//import { Token } from '../../models/token.model';
//import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx';
/* import { Plugins, PushNotification, PushNotificationToken, PushNotificationActionPerformed } from '@capacitor/core';
const { PushNotifications } = Plugins;
*/
*/
@Component({
selector: 'app-login',
@@ -30,6 +32,9 @@ export class LoginPage implements OnInit {
username: string = environment.defaultuser;
password: string = environment.defaultuserpwd;
userattempt: UserForm;
code = []
pin = true
constructor(
private http: HttpClient,
@@ -40,14 +45,16 @@ export class LoginPage implements OnInit {
private toastService: ToastService,
private photoService: PhotoService,
public alertController: AlertController,
private modalController: ModalController
//private fcm: FCM
) { }
ngOnInit() {
}
//Function to validade the login inputs
validateInput(){
validateInput() {
return (
this.username.trim().length > 0
&& this.password.trim().length > 0
@@ -71,6 +78,7 @@ export class LoginPage implements OnInit {
"user": this.username,
"password": this.password,
}
this.authService.loginChat(postData).subscribe((res: any) => {
console.log(res.data);
this.storageService.store(AuthConnstants.AUTH, res.data);
@@ -85,7 +93,6 @@ export class LoginPage implements OnInit {
// this.notificatinsservice.getAndpostToken(this.username);
}
async Login() {
/* try { */
//Go to our home in home/feed.
@@ -113,4 +120,69 @@ export class LoginPage implements OnInit {
this.presentAlert('Por favor, insira o seu nome de utilizador e palavra-passe.');
}
}
}
setCode(code: string) {
if(this.code.length < 4) {
this.code.push(code)
}
if(this.code.length == 4) {
this.pinLogin()
}
}
clearCode() {
this.code =[]
}
pinLogin() {
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
if( encrypted == localStorage.getItem('PIN')) {
this.successMessage()
} else {
this.badRequest()
this.code = []
}
}
async successMessage(message?: string) {
const modal = await this.modalController.create({
component: SuccessMessageComponent,
componentProps: {
message: message || 'Processo efetuado' ,
},
cssClass: 'modal modal-desktop'
});
modal.present()
setTimeout(()=>{
this.router.navigate(['/home/events']);
modal.dismiss()
},3000)
}
async badRequest(message?: string) {
const modal = await this.modalController.create({
component: BadRequestComponent,
componentProps: {
message: message || 'Processo não efetuado' ,
},
cssClass: 'modal modal-desktop'
});
modal.present()
setTimeout(()=>{
modal.dismiss()
},3000)
}
}
src/app/shared/fingerprint/fingerprint.page.html
+2 -3
View File
@@ -13,10 +13,9 @@
<div class="terminal d-flex align-center justity-content-center flex-column">
<div (click)="login()">Login</div>
<div (click)="save()" class="pt-50 mt-50">Register</div>
<div (click)="login()" class="dot">Login</div>
<div (click)="save()" class="pt-50 mt-50 dot">Register</div>
</div>
src/app/shared/fingerprint/fingerprint.page.ts
+21 -17
View File
@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { BadRequestComponent } from '../popover/bad-request/bad-request.component';
import { SuccessMessageComponent } from '../popover/success-message/success-message.component';
import { FingerprintAIO } from '@ionic-native/fingerprint-aio';
// import { FingerprintAIO } from '@ionic-native/fingerprint-aio';
@Component({
selector: 'app-fingerprint',
@@ -20,24 +20,26 @@ export class FingerprintPage implements OnInit {
}
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() {
@@ -55,8 +57,10 @@ export class FingerprintPage implements OnInit {
// localizedReason: 'Please authenticate' //Only for iOS
// })
// .then((FingerPrintHash: any) => {
// this.successMessage()
// localStorage.setItem('FingerPrintHash', FingerPrintHash)
// })
// .catch((error: any) => {
// this.badRequest()
src/app/shared/pin/pin.page.html
+2 -17
View File
@@ -36,26 +36,11 @@
</div>
<div (click)="clearCode()" class="d-flex align-center justify-center pt-25 clear">
Limpar
<div (click)="close()" class="d-flex align-center justify-center pt-25 clear">
Voltar
</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>
src/app/shared/pin/pin.page.ts
+12 -5
View File
@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { BadRequestComponent } from '../popover/bad-request/bad-request.component';
import { SuccessMessageComponent } from '../popover/success-message/success-message.component';
import crypto from 'crypto-js'
@Component({
selector: 'app-pin',
templateUrl: './pin.page.html',
@@ -19,8 +19,10 @@ export class PinPage implements OnInit {
setCode(code: string) {
if(this.code.length < 4) {
this.code.push(code)
} else {
this.clearCode()
}
if(this.code.length == 4) {
this.save()
}
}
@@ -34,11 +36,16 @@ export class PinPage implements OnInit {
this.modalController.dismiss();
}
async save() {
async save() {
if(this.code.length == 4) {
this.successMessage()
localStorage.setItem('PIN', this.code.join(''))
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
localStorage.setItem('PIN', encrypted)
} else {
this.badRequest()
}