mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-19 13:02:56 +00:00
changes in profile
This commit is contained in:
tiago.kayaya
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { EditProfilePage } from './edit-profile.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: EditProfilePage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class EditProfilePageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EditProfilePageRoutingModule } from './edit-profile-routing.module';
|
||||
|
||||
import { EditProfilePage } from './edit-profile.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
EditProfilePageRoutingModule
|
||||
],
|
||||
declarations: [EditProfilePage]
|
||||
})
|
||||
export class EditProfilePageModule {}
|
||||
@@ -0,0 +1,76 @@
|
||||
<ion-content class=" bg-blue">
|
||||
<div class="btn-close d-flex" (click)="close()">
|
||||
<ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
|
||||
</div>
|
||||
|
||||
<div class="profile-content width-100">
|
||||
|
||||
<div class="d-flex justify-space-between align-center">
|
||||
<div class="go-back d-flex align-center" (click)="close()">
|
||||
<ion-icon class="icon" src="assets/images/icons-calendar-arrow-left.svg"></ion-icon> <div>Perfil</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="d-flex " (click)="close()">
|
||||
<ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<div class="d-flex align-center">
|
||||
<ion-icon class="profile-pic" src="assets/images/icons-default-profile.svg"></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-info">
|
||||
<div class="label-text">Dados Perfil</div>
|
||||
<div class="user-role">{{loggeduser.RoleDescription}}</div>
|
||||
<div class="email">{{loggeduser.Email}}</div>
|
||||
</div>
|
||||
|
||||
<div class="login-preference" (mouseover)="checkState()" (click)="checkState()">
|
||||
<div class="preference">Preferência Login</div>
|
||||
|
||||
<ion-row>
|
||||
<ion-col class="align-center d-flex">
|
||||
<div class="d-flex align-center" (click)="LoginPreferenceMethod('pin')">
|
||||
<ion-checkbox [checked]="userLoginPreference=='pin' " 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" [checked]="false"></ion-checkbox>
|
||||
Impressão Digital
|
||||
</div>
|
||||
</ion-col>
|
||||
|
||||
</ion-row>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-center mt-10">
|
||||
<button (click)="addPin()" class="btn-ok buttonSize" fill="clear" color="#fff" >
|
||||
<ion-label>Alterar PIN</ion-label>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
|
||||
<ion-footer class=" footer-container ion-no-border bg-blue">
|
||||
|
||||
<div class="d-flex justify-space-between">
|
||||
|
||||
<ion-buttons slot="start" (click)="close()">
|
||||
<button class="btn-cancel" fill="clear" color="#061b52" >
|
||||
<ion-label>Cancelar</ion-label>
|
||||
</button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end" (click)="close()">
|
||||
<button class="btn-ok" fill="clear" color="#fff" >
|
||||
<ion-label>Gravar</ion-label>
|
||||
</button>
|
||||
</ion-buttons>
|
||||
</div>
|
||||
|
||||
</ion-footer>
|
||||
@@ -0,0 +1,73 @@
|
||||
.btn-close{
|
||||
padding: 20px 20px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.profile-content{
|
||||
width: 100% !important;
|
||||
padding: 0px 20px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.icon{
|
||||
font-size: 35px;
|
||||
}
|
||||
|
||||
.go-back{
|
||||
font-family: Roboto;
|
||||
font-size: 25px;
|
||||
.icon{
|
||||
margin-right: 7px;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-pic{
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 20px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
.profile-info{
|
||||
.label-text{
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.user-role{
|
||||
background-color: white;
|
||||
border-radius: 5px;
|
||||
padding: 12px;
|
||||
font-family: Roboto;
|
||||
font-size: 13px;
|
||||
color: black;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.email {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.login-preference{
|
||||
margin-top: 44px;
|
||||
|
||||
.preference{
|
||||
font-family: Roboto;
|
||||
font-size: 15px;
|
||||
margin-bottom: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.checkBox{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.buttonSize {
|
||||
width: 100% !important;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { EditProfilePage } from './edit-profile.page';
|
||||
|
||||
describe('EditProfilePage', () => {
|
||||
let component: EditProfilePage;
|
||||
let fixture: ComponentFixture<EditProfilePage>;
|
||||
|
||||
beforeEach(waitForAsync(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ EditProfilePage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(EditProfilePage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,161 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
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';
|
||||
import { LocalstoreService } from 'src/app/store/localstore.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-edit-profile',
|
||||
templateUrl: './edit-profile.page.html',
|
||||
styleUrls: ['./edit-profile.page.scss'],
|
||||
})
|
||||
export class EditProfilePage implements OnInit {
|
||||
|
||||
loggeduser: User;
|
||||
userLoginPreference = ''
|
||||
|
||||
constructor(private modalController:ModalController,
|
||||
private authService: AuthService,
|
||||
private animationController: AnimationController,
|
||||
private router: Router,
|
||||
private localstoreService: LocalstoreService
|
||||
) {
|
||||
|
||||
this.loggeduser = authService.ValidatedUser;
|
||||
|
||||
console.log(this.loggeduser.RoleDescription)
|
||||
|
||||
this.checkState()
|
||||
}
|
||||
|
||||
ngOnInit() {}
|
||||
|
||||
close() {
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
|
||||
async addPin() {
|
||||
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: PinPage,
|
||||
cssClass: 'model profile-modal',
|
||||
componentProps: {
|
||||
}
|
||||
});
|
||||
|
||||
modal.present();
|
||||
}
|
||||
|
||||
|
||||
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();
|
||||
}
|
||||
|
||||
logout() {
|
||||
// clear local storage
|
||||
window.localStorage.clear();
|
||||
|
||||
setTimeout(()=>{
|
||||
window.location.pathname = '/'
|
||||
location.reload();
|
||||
}, 1000)
|
||||
|
||||
|
||||
}
|
||||
|
||||
LoginPreferenceMethod(type: string) {
|
||||
|
||||
let userData = this.localstoreService.get('UserData', {})
|
||||
|
||||
if (userData.hasOwnProperty('loginPreference')) {
|
||||
if (userData.loginPreference != type) {
|
||||
if (type) {
|
||||
userData.loginPreference = type
|
||||
}
|
||||
} else {
|
||||
userData.loginPreference = 'none'
|
||||
}
|
||||
|
||||
} else {
|
||||
userData.loginPreference = 'none'
|
||||
}
|
||||
|
||||
|
||||
this.localstoreService.set('UserData', userData)
|
||||
}
|
||||
|
||||
checkState() {
|
||||
|
||||
let userData = this.localstoreService.get('UserData', {})
|
||||
|
||||
if (userData.hasOwnProperty('loginPreference')) {
|
||||
this.userLoginPreference = userData.loginPreference
|
||||
} else {
|
||||
this.userLoginPreference = ''
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user