Improve login

This commit is contained in:
Peter Maquiran
2021-07-01 09:52:36 +01:00
parent 9e7a6b0503
commit 60d6e6c53e
3 changed files with 59 additions and 97 deletions
+5 -5
View File
@@ -1,6 +1,6 @@
<ion-content class="text-white">
<div class="main-wrapper">
<div class="wrapper" *ngIf="userLoginPreference != 'pin' && userLoginPreference != 'fingerprint' && !setPint ">
<div class="wrapper" *ngIf="!hasSession || enterWithPassword">
<div class="bg-1 d-flex justify-center align-center">
<div class="bg-2 d-flex justify-center align-center">
@@ -32,7 +32,7 @@
</div>
</div>
<div class="main-content height-100" *ngIf="userLoginPreference == 'pin' || setPint">
<div class="main-content height-100" *ngIf="hasSession && !enterWithPassword">
<div class=" align-center justify-center">
<div class="div-top-header">
@@ -41,8 +41,8 @@
</div>
</div>
<ion-title *ngIf="!setPint" class="title">Digite o PIN</ion-title>
<ion-title *ngIf="setPint" class="title">Digite o novo PIN</ion-title>
<ion-title *ngIf="hasPin" class="title">Digite o PIN</ion-title>
<ion-title *ngIf="!hasPin" class="title">Digite o novo PIN</ion-title>
<div class="d-flex pt-25 align-center justify-center">
<div class="dot" [class.dot-active]="code.length >= 1"></div>
@@ -70,7 +70,7 @@
</div>
<div *ngIf="!setPint" class="voltar d-flex align-center justify-center pt-25 clear" (click)="setPint=false; userLoginPreference='none'">
<div *ngIf="hasPin" class="voltar d-flex align-center justify-center pt-25 clear" (click)="enterWithPassword=true">
Entrar com senha
</div>
+50 -92
View File
@@ -1,25 +1,12 @@
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { AuthService } from 'src/app/services/auth.service';
import { User, UserForm } from 'src/app/models/user.model';
import { UserForm } from 'src/app/models/user.model';
import { ToastService } from 'src/app/services/toast.service';
import { environment } from 'src/environments/environment';
import { AlertController, AnimationController, 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 { AlertController } from '@ionic/angular';
import { NotificationsService } from 'src/app/services/notifications.service';
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import crypto from 'crypto-js'
import { SuccessMessagePage } from 'src/app/shared/popover/success-message/success-message.page';
import { BadRequestPage } from 'src/app/shared/popover/bad-request/bad-request.page';
//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',
@@ -34,38 +21,44 @@ export class LoginPage implements OnInit {
userattempt: UserForm;
code = []
setPint = false
pin = false
hasPin: boolean
loginPreference: string
hasSession = false
enterWithPassword = false
userLoginPreference: any
constructor(
private http: HttpClient,
private notificatinsservice: NotificationsService,
private router: Router,
private authService: AuthService,
private storageService: StorageService,
private toastService: ToastService,
private photoService: PhotoService,
public alertController: AlertController,
private modalController: ModalController,
private animationController: AnimationController,
//private fcm: FCM
public alertController: AlertController
) {
// App has session
if(!localStorage.getItem('UserData')) {
this.hasSession = false
} else {
this.hasSession = true
// this.router.navigate(['/home/events']);
}
let userData = JSON.parse(localStorage.getItem('UserData')) || {}
if (userData.hasOwnProperty('loginPreference')) {
this.userLoginPreference = userData.loginPreference
this.pin = true
const loginPreference = userData?.loginPreference
const pin = userData?.PIN
if (pin) {
this.hasPin = true
} else {
this.hasPin = false
}
if (loginPreference) {
this.loginPreference = loginPreference
} else {
this.userLoginPreference = ''
this.setPint = false
this.pin = false
this.loginPreference = ''
}
}
@@ -114,13 +107,14 @@ export class LoginPage implements OnInit {
} */
getToken() {
this.notificatinsservice.getAndpostToken(this.username);
this.notificatinsservice.getAndpostToken(this.username);
}
async Login() {
if (this.validateUsername()) {
if(this.validatePassword()){
this.userattempt = {
username: this.username,
password: this.password,
@@ -128,26 +122,24 @@ export class LoginPage implements OnInit {
BasicAuthKey: ""
}
let attempt = await this.authService.login(this.userattempt);
console.log(JSON.stringify(attempt));
if (attempt) {
//this.loginRocketChat();
this.authService.loginChat(this.userattempt);
this.getToken();
this.hasSession = true
this.hasPin = false
this.enterWithPassword = false
if(!this.pin) {
this.setPint = true
this.pin = true
if(!this.hasPin) {
} else {
this.router.navigate(['/home/events']);
}
}
else {
this.toastService.badRequest('O nome de utilizador e/ou palavra-passe estão incorretas ou verifique a sua conexão com a internet e volte a tentar');
}
}
else{
else {
this.toastService.badRequest('Por favor, insira a sua palavra-passe');
}
}
@@ -158,7 +150,6 @@ export class LoginPage implements OnInit {
setCode(code: string) {
if(this.code.length < 4) {
this.code.push(code)
}
@@ -168,25 +159,32 @@ export class LoginPage implements OnInit {
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
if(this.setPint) {
if(!this.hasPin) {
// alert('storePin')
this.storePin()
} else {
// alert('pinLogin')
this.pinLogin()
}
}
}
clearCode() {
this.code =[]
}
pinLogin() {
pinLogin() {
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
let userData = JSON.parse(localStorage.getItem('UserData')) || {}
const pin = userData?.PIN
//if( encrypted == pin) {
if( encrypted == localStorage.getItem('PIN')) {
//this.toastService.successMessage()
this.router.navigate(['/home/events']);
} else {
@@ -200,6 +198,12 @@ export class LoginPage implements OnInit {
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
let userData: Object = JSON.parse(localStorage.getItem('UserData')) || {}
userData['PIN'] = encrypted
localStorage.setItem('UserData', JSON.stringify(userData) )
localStorage.setItem('PIN', encrypted)
@@ -207,50 +211,4 @@ export class LoginPage implements OnInit {
}
async badRequest(message?: string, callback?) {
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: BadRequestPage,
componentProps: {
message: message || 'Processo não efetuado' ,
},
cssClass: 'notification-modal'
});
modal.present()
setTimeout(()=> {
modal.dismiss()
},3000)
}
}
+4
View File
@@ -28,6 +28,10 @@ export class AuthService {
public alertController: AlertController,
) {
if(window.location.pathname != '' && !localStorage.getItem('UserData')) {
this.router.navigate(['/']);
}
this.headers = new HttpHeaders();
if (localStorage.getItem("user") != null) {