yvachot/FlaskALED
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

frontend avec données fictif prêt

Browse source
This commit is contained in:
MiharyR 2022-01-05 20:37:31 +01:00
parent 0348c30044
commit 4cc9058887
41 changed files with 697 additions and 213 deletions
Download patch file Download diff file Expand all files Collapse all files

15
frontend/src/app/common/components/navbar/navbar.component.html
View file

@ -1,5 +1,5 @@
<!-- Login -->
<div *ngIf="pour === 'login'">
<div *ngIf="pour === 'nickname'">
<nav class="navbar navbar-expand-lg">
<!-- FlaskAled -->
@ -53,8 +53,17 @@
<span class="navbar-toggler-icon"></span>
</button>
<!-- Rien -->
<div class="collapse navbar-collapse"></div>
<!-- [userList] [myProfil] -->
<div class="collapse navbar-collapse">
<ul class="navbar-nav">
<li class="nav-item active monLi">
<a class="nav-link" routerLink="/user/registry">Annuaire</a>
</li>
<li class="nav-item active monLi">
<a class="nav-link" routerLink="/user/myProfil">Mon profil</a>
</li>
</ul>
</div>
<!-- Deconnexion -->
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/">

1
frontend/src/app/common/components/navbar/navbar.component.ts
View file

@ -14,5 +14,4 @@ export class NavbarComponent implements OnInit
ngOnInit(): void {}
onDeconnexion(): void {}
}

53
frontend/src/app/common/components/page-profil/page-profil.component.html Normal file
View file

@ -0,0 +1,53 @@
<div class="myContainer">
<!-- NavBar -->
<app-navbar [pour]="from"></app-navbar>
<!-- Boite -->
<div class="boite">
<!-- nickname -->
<div class="row myRow">
<div class="col-6 myLabel">Pseudo:</div>
<div class="col-6 myValue"> {{person.nickname}} </div>
</div>
<!-- email -->
<div class="row myRow">
<div class="col-6 myLabel">Mail:</div>
<div class="col-6 myValue"> {{person.email}} </div>
</div>
<!-- role -->
<div class="row myRow">
<div class="col-6 myLabel">Rôle:</div>
<div class="col-6 myValue">
<span *ngIf="!person.is_admin">utilisateur</span>
<span *ngIf="person.is_admin">admin</span>
</div>
<!-- boutons -->
<div class="row">
<!-- bouton modifier -->
<div class="col-6">
<div class="btnContainer">
<button mat-button class="myBtn" (click)="onModifier()">
<mat-icon>edit</mat-icon> Modifier compte <mat-icon>edit</mat-icon>
</button>
</div>
</div>
<!-- bouton supprimer -->
<div class="col-6">
<div class="btnContainer">
<button mat-button class="myBtn" (click)="onSupprimer()">
<mat-icon>delete</mat-icon> Supprimer compte <mat-icon>delete</mat-icon>
</button>
</div>
</div>
</div>
</div>
</div>

0
frontend/src/app/common/components/profil/page-profil/page-profil.component.scss → frontend/src/app/common/components/page-profil/page-profil.component.scss
View file

0
frontend/src/app/common/components/profil/page-profil/page-profil.component.spec.ts → frontend/src/app/common/components/page-profil/page-profil.component.spec.ts
View file

44
frontend/src/app/common/components/profil/page-profil/page-profil.component.ts → frontend/src/app/common/components/page-profil/page-profil.component.ts
View file

@ -1,10 +1,10 @@
import { Component, OnInit } from '@angular/core';
import {Person} from "../../../interfaces/Person";
import {MatDialog} from "@angular/material/dialog";
import {MatSnackBar} from "@angular/material/snack-bar";
import {PopupUpdateProfilComponent} from "../popup-update-profil/popup-update-profil.component";
import {FictitiousDatasService} from "../../../services/fictitiousDatas/fictitious-datas.service";
import {FictitiousDatasService} from "../../services/fictitiousDatas/fictitious-datas.service";
import {Router} from "@angular/router";
import {PopupDeleteProfilComponent} from "../popup-delete-profil/popup-delete-profil.component";
@ -15,12 +15,12 @@ import {Router} from "@angular/router";
})
export class PageProfilComponent implements OnInit
{
person: Person = {
person = {
id: "",
login: "",
nickname: "",
email: "",
hashPass: "",
role: "user",
hash_pass: "",
is_admin: false,
};
from: string = "" ;
@ -75,4 +75,36 @@ export class PageProfilComponent implements OnInit
}
}
// Appuie sur le bouton supprimer
onSupprimer(): void
{
const config = {
data: {
id: this.person.id,
email: this.person.email,
me: true,
}
};
this.dialog
.open(PopupDeleteProfilComponent, config)
.afterClosed()
.subscribe(retour => this.onSupprimerCallback(retour));
}
// Callback de onSupprimer
onSupprimerCallback(retour: any): void
{
if((retour === null) || (retour === undefined))
{
const config = { duration: 1000, panelClass: "custom-class" };
this.snackBar.open( "Opération annulé", "", config);
}
else
{
this.router.navigateByUrl("/login");
}
}
}

14
frontend/src/app/common/components/popup-delete-profil/popup-delete-profil.component.html Normal file
View file

@ -0,0 +1,14 @@
<mat-dialog-content class="mat-typography" *ngIf="me">
Êtes-vous sûr de vouloir supprimer votre compte ?
</mat-dialog-content>
<mat-dialog-content class="mat-typography" *ngIf="!me">
Êtes-vous sûr de vouloir supprimer <i>{{email}}</i> ?
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button (click)="dialogRef.close();">Annuler</button>
<button mat-button (click)="onValider()" cdkFocusInitial>Valider</button>
</mat-dialog-actions>

0
frontend/src/app/common/components/popup-delete-profil/popup-delete-profil.component.scss Normal file
View file

25
frontend/src/app/common/components/popup-delete-profil/popup-delete-profil.component.spec.ts Normal file
View file

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PopupDeleteProfilComponent } from './popup-delete-profil.component';
describe('PopupDeleteProfilComponent', () => {
let component: PopupDeleteProfilComponent;
let fixture: ComponentFixture<PopupDeleteProfilComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ PopupDeleteProfilComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(PopupDeleteProfilComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

28
frontend/src/app/common/components/popup-delete-profil/popup-delete-profil.component.ts Normal file
View file

@ -0,0 +1,28 @@
import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
@Component({
selector: 'app-popup-delete-profil',
templateUrl: './popup-delete-profil.component.html',
styleUrls: ['./popup-delete-profil.component.scss']
})
export class PopupDeleteProfilComponent implements OnInit
{
me: boolean = false; // on se supprime soi-même
email: string = "";
constructor( public dialogRef: MatDialogRef<PopupDeleteProfilComponent>,
@Inject(MAT_DIALOG_DATA) public data: any ) { }
ngOnInit(): void {
this.me = this.data.me;
this.email = this.data.email;
}
onValider(): void {
this.dialogRef.close(true);
}
}

4
frontend/src/app/common/components/profil/popup-update-profil/popup-update-profil.component.html → frontend/src/app/common/components/popup-update-profil/popup-update-profil.component.html
View file

@ -6,10 +6,10 @@
<!-- divider -->
<br><mat-divider></mat-divider><br>
<!-- login -->
<!-- nickname -->
<mat-form-field appearance="fill">
<mat-label>Pseudo</mat-label>
<input matInput type="text" [(ngModel)]="personCopy.login">
<input matInput type="text" [(ngModel)]="personCopy.nickname" required>
</mat-form-field><br>
<!-- divider -->

0
frontend/src/app/common/components/profil/popup-update-profil/popup-update-profil.component.scss → frontend/src/app/common/components/popup-update-profil/popup-update-profil.component.scss
View file

0
frontend/src/app/common/components/profil/popup-update-profil/popup-update-profil.component.spec.ts → frontend/src/app/common/components/popup-update-profil/popup-update-profil.component.spec.ts
View file

17
frontend/src/app/common/components/profil/popup-update-profil/popup-update-profil.component.ts → frontend/src/app/common/components/popup-update-profil/popup-update-profil.component.ts
View file

@ -1,8 +1,7 @@
import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
import {Person} from "../../../interfaces/Person";
import {CheckEmailService} from "../../../services/checkEmail/check-email.service";
import {HashageService} from "../../../services/hashage/hashage.service";
import {CheckEmailService} from "../../services/checkEmail/check-email.service";
import {HashageService} from "../../services/hashage/hashage.service";
@ -13,7 +12,7 @@ import {HashageService} from "../../../services/hashage/hashage.service";
})
export class PopupUpdateProfilComponent implements OnInit
{
personCopy: Person;
personCopy: any;
newPassword: string = "";
confirmNewPassword: string = "" ;
changePassword: boolean = false ;
@ -32,10 +31,10 @@ export class PopupUpdateProfilComponent implements OnInit
const person = this.data.person;
this.personCopy = {
id: person.id,
login: person.login,
nickname: person.nickname,
email: person.email,
hashPass: person.hashPass,
role: person.role
hash_pass: person.hash_pass,
is_admin: person.is_admin
};
}
@ -46,7 +45,7 @@ export class PopupUpdateProfilComponent implements OnInit
this.checkField();
if(!this.hasError)
{
if(this.changePassword) this.personCopy.hashPass = this.hashageService.run(this.newPassword);
if(this.changePassword) this.personCopy.hash_pass = this.hashageService.run(this.newPassword);
const data = { user: this.personCopy };
// ...
@ -75,7 +74,7 @@ export class PopupUpdateProfilComponent implements OnInit
// Check les champs saisis par l'utilisateur
checkField(): void
{
if(this.personCopy.login.length === 0) {
if(this.personCopy.nickname.length === 0) {
this.errorMessage = "Veuillez remplir le champ 'pseudo'" ;
this.hasError = true;
}

38
frontend/src/app/common/components/profil/page-profil/page-profil.component.html
View file

@ -1,38 +0,0 @@
<div class="myContainer">
<!-- NavBar -->
<app-navbar [pour]="from"></app-navbar>
<!-- Boite -->
<div class="boite">
<!-- login -->
<div class="row myRow">
<div class="col-6 myLabel">Pseudo:</div>
<div class="col-6 myValue"> {{person.login}} </div>
</div>
<!-- email -->
<div class="row myRow">
<div class="col-6 myLabel">Mail:</div>
<div class="col-6 myValue"> {{person.email}} </div>
</div>
<!-- role -->
<div class="row myRow">
<div class="col-6 myLabel">Rôle:</div>
<div class="col-6 myValue">
<span *ngIf="person.role === 'user'">utilisateur</span>
<span *ngIf="person.role === 'admin'">admin</span>
</div>
<!-- Modifier profil -->
<div class="btnContainer">
<button mat-button class="myBtn" (click)="onModifier()">Modifier profil</button>
</div>
</div>
</div>

9
frontend/src/app/common/interfaces/Person.ts
View file

@ -1,9 +0,0 @@
// user or admin
export interface Person
{
id: string,
login: string,
email: string,
hashPass: string,
role: string,
}

22
frontend/src/app/common/services/fictitiousDatas/fictitious-datas.service.ts
View file

@ -1,5 +1,5 @@
import { Injectable } from '@angular/core';
import {Person} from "../../interfaces/Person";
@Injectable({
providedIn: 'root'
@ -7,33 +7,33 @@ import {Person} from "../../interfaces/Person";
export class FictitiousDatasService
{
getUser(): Person
getUser()
{
const id = (Math.floor(Math.random()*100000)).toString()
return {
id: id,
login: "Riri"+id,
nickname: "Riri"+id,
email: "riri"+id+"@gmail.com",
hashPass: "blablabla",
role: "user",
hash_pass: "blablabla",
is_admin: false,
}
}
getAdmin(): Person
getAdmin()
{
const id = (Math.floor(Math.random()*100000)).toString()
return {
id: id,
login: "Fifi"+id,
nickname: "Fifi"+id,
email: "fifi"+id+"@gmail.com",
hashPass: "blablabla",
role: "admin",
hash_pass: "blablabla",
is_admin: true,
}
}
getTabPerson(n: number): Person[]
getTabPerson(n: number)
{
let tab: Person[] = [];
let tab = [];
for(let i=0 ; i<n ; i++)
{

16
frontend/src/app/common/services/profil/profil.service.spec.ts Normal file
View file

@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { ProfilService } from './profil.service';
describe('ProfilService', () => {
let service: ProfilService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(ProfilService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
});

9
frontend/src/app/common/services/profil/profil.service.ts Normal file
View file

@ -0,0 +1,9 @@
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class ProfilService {
constructor() { }
}