Update: build && server frontend
This commit is contained in:
parent
38098497a5
commit
db79c561c7
90 changed files with 6 additions and 6 deletions
|
|
@ -1,7 +0,0 @@
|
|||
La page "admin/myProfil" contient:
|
||||
- les informations de l'admin (composant "page-profil")
|
||||
- un bouton "modifier profil" pour modifier les informations de l'admin (composant "popup-update-profil")
|
||||
|
||||
Cette page est la même que la page de la partie utilisateur.
|
||||
|
||||
Ainsi, on a rangé cette page dans le dossier "common/components/profil".
|
||||
|
|
@ -1,67 +0,0 @@
|
|||
<div>
|
||||
|
||||
<app-navbar pour="admin"></app-navbar>
|
||||
|
||||
|
||||
<div class="btnContainer">
|
||||
<button mat-button class="btnAjouter" (click)="onCreate()">
|
||||
<mat-icon>add_circle</mat-icon> Ajouter un utilisateur
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div style="text-align: center">
|
||||
<mat-form-field appearance="standard" class="filtre">
|
||||
<mat-label>Filter</mat-label>
|
||||
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Riri" #input>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
|
||||
<table *ngIf="(dataSource !== undefined) && (dataSource !== null) && (dataSource.data.length !== 0)"
|
||||
mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
|
||||
|
||||
<!-- Pseudo Column -->
|
||||
<ng-container matColumnDef="nickname">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Pseudo</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.nickname}}</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Email Column -->
|
||||
<ng-container matColumnDef="email">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Email</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.email}}</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Role Column -->
|
||||
<ng-container matColumnDef="role">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Rôle</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.role}}</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Actions Column -->
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Actions</th>
|
||||
<td mat-cell *matCellDef="let person">
|
||||
<button mat-icon-button (click)="onUpdate(person)">
|
||||
<mat-icon>edit</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button (click)="onDelete(person)">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
|
||||
|
||||
<mat-paginator [pageSizeOptions]="[10, 20, 50, 100]"
|
||||
showFirstLastButtons
|
||||
aria-label="Select page of periodic elements"
|
||||
class="mat-elevation-z8"></mat-paginator>
|
||||
|
||||
|
||||
</div>
|
||||
<br><br>
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
mat-paginator, table {
|
||||
width: 80%;
|
||||
margin: auto 10%;
|
||||
}
|
||||
|
||||
.btnContainer {
|
||||
margin: 50px 10% 20px 0px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btnAjouter {
|
||||
border: solid 1px black;
|
||||
}
|
||||
|
||||
.filtre {
|
||||
text-align: center;
|
||||
width: 33%;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageUserListComponent } from './page-user-list.component';
|
||||
|
||||
describe('PageAdminComponent', () => {
|
||||
let component: PageUserListComponent;
|
||||
let fixture: ComponentFixture<PageUserListComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageUserListComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageUserListComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,152 +0,0 @@
|
|||
import {AfterViewInit, Component, ViewChild} from '@angular/core';
|
||||
import {MatTableDataSource} from "@angular/material/table";
|
||||
import {MatSort} from "@angular/material/sort";
|
||||
import {MatPaginator} from "@angular/material/paginator";
|
||||
import {MatDialog} from "@angular/material/dialog";
|
||||
import {PopupCreatePersonComponent} from "../popup-create-person/popup-create-person.component";
|
||||
import {MatSnackBar} from "@angular/material/snack-bar";
|
||||
import {PopupUpdatePersonAdminComponent} from "../popup-update-person-admin/popup-update-person-admin.component";
|
||||
import {PopupDeleteProfilComponent} from "../../../common/components/popup-delete-profil/popup-delete-profil.component";
|
||||
import {MessageService} from "../../../common/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-user-list',
|
||||
templateUrl: './page-user-list.component.html',
|
||||
styleUrls: ['./page-user-list.component.scss']
|
||||
})
|
||||
export class PageUserListComponent implements AfterViewInit
|
||||
{
|
||||
displayedColumns: string[] = [ "nickname", "email", "role", "actions" ];
|
||||
dataSource: MatTableDataSource<any> = new MatTableDataSource<any>();
|
||||
@ViewChild(MatSort) sort: MatSort;
|
||||
@ViewChild(MatPaginator) paginator: MatPaginator;
|
||||
configSnackBar = { duration: 2000, panelClass: "custom-class" };
|
||||
|
||||
|
||||
constructor( private messageService: MessageService,
|
||||
public dialog: MatDialog,
|
||||
private snackBar: MatSnackBar) { }
|
||||
|
||||
|
||||
ngAfterViewInit(): void
|
||||
{
|
||||
this.messageService
|
||||
.get('users?order_by=nickname')
|
||||
.subscribe(retour => this.ngAfterViewInitCallback(retour), err => this.ngAfterViewInitCallback(err));
|
||||
}
|
||||
|
||||
|
||||
ngAfterViewInitCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success") {
|
||||
console.log(retour);
|
||||
}
|
||||
else {
|
||||
let tabPerson: { id: number, email: string, nickname: string, is_admin: boolean }[] = retour.data;
|
||||
tabPerson = tabPerson.map( person => {
|
||||
if(!person.is_admin) return Object.assign(person, {role: "utilisateur"});
|
||||
else return Object.assign(person, {role: "admin"});
|
||||
});
|
||||
this.dataSource = new MatTableDataSource(tabPerson);
|
||||
this.dataSource.sort = this.sort;
|
||||
this.dataSource.paginator = this.paginator;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
applyFilter(event: Event)
|
||||
{
|
||||
const filterValue = (event.target as HTMLInputElement).value;
|
||||
this.dataSource.filter = filterValue.trim().toLowerCase();
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton "create"
|
||||
onCreate(): void
|
||||
{
|
||||
const config = { width: '50%' };
|
||||
this.dialog
|
||||
.open(PopupCreatePersonComponent, config)
|
||||
.afterClosed()
|
||||
.subscribe( retour => {
|
||||
|
||||
if((retour === null) || (retour === undefined))
|
||||
{
|
||||
this.snackBar.open( "Opération annulée", "", this.configSnackBar);
|
||||
}
|
||||
else {
|
||||
if(retour.data.is_admin) retour.data.role = "admin" ;
|
||||
else retour.data.role = "utilisateur" ;
|
||||
this.dataSource.data.push(retour.data);
|
||||
this.dataSource.data = this.dataSource.data;
|
||||
this.dataSource = this.dataSource;
|
||||
this.snackBar.open( "L'utilisateur a bien été créé ✔", "", this.configSnackBar);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton "edit"
|
||||
onUpdate(personToUpdate: any): void
|
||||
{
|
||||
const config = {
|
||||
width: '50%',
|
||||
data: { person: personToUpdate }
|
||||
};
|
||||
this.dialog
|
||||
.open(PopupUpdatePersonAdminComponent, config)
|
||||
.afterClosed()
|
||||
.subscribe( is_admin => {
|
||||
|
||||
if((is_admin === null) || (is_admin === undefined))
|
||||
{
|
||||
this.snackBar.open("Opération annulée", "", this.configSnackBar);
|
||||
}
|
||||
else {
|
||||
const index = this.dataSource.data.findIndex(elt => (elt.id === personToUpdate.id));
|
||||
this.dataSource.data[index].is_admin = is_admin;
|
||||
if(is_admin) this.dataSource.data[index].role = "admin";
|
||||
else this.dataSource.data[index].role = "utilisateur";
|
||||
this.snackBar.open("L'utilisateur a bien été modifié ✔", "", this.configSnackBar);
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton "delete"
|
||||
onDelete(personToDelete: any): void
|
||||
{
|
||||
const config = {
|
||||
data: {
|
||||
id: personToDelete.id,
|
||||
email: personToDelete.email,
|
||||
me: false,
|
||||
}
|
||||
};
|
||||
this.dialog
|
||||
.open(PopupDeleteProfilComponent, config)
|
||||
.afterClosed()
|
||||
.subscribe( retour => {
|
||||
|
||||
if((retour === null) || (retour === undefined))
|
||||
{
|
||||
this.snackBar.open("Opération annulée", "", this.configSnackBar);
|
||||
}
|
||||
else if(retour.status === "error")
|
||||
{
|
||||
this.snackBar.open(retour.error.message, "", this.configSnackBar);
|
||||
}
|
||||
else {
|
||||
const index = this.dataSource.data.findIndex( elt => (elt.id === personToDelete.id));
|
||||
this.dataSource.data.splice(index, 1);
|
||||
this.dataSource.data = this.dataSource.data;
|
||||
this.dataSource = this.dataSource;
|
||||
this.snackBar.open("L'utilisateur a bien été supprimé ✔", "", this.configSnackBar);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
<div class="myContainer">
|
||||
|
||||
<h3>Ajouter un utilisateur</h3>
|
||||
|
||||
<mat-divider style="margin: 20px 0px 20px 0px"></mat-divider>
|
||||
|
||||
<!-- nickname -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Pseudo</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="nickname" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- email -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Email</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="email" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="password" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- confirmation mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Confirmation mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="confirmPassword" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- role -->
|
||||
<mat-radio-group aria-labelledby="label-radio-group" [(ngModel)]="is_admin">
|
||||
<mat-radio-button [value]="false" checked>Utilisateur </mat-radio-button>
|
||||
<mat-radio-button [value]="true">Admin</mat-radio-button>
|
||||
</mat-radio-group><br><br>
|
||||
|
||||
<mat-divider style="margin-bottom: 10px"></mat-divider>
|
||||
|
||||
<!-- message d'erreur -->
|
||||
<div *ngIf="hasError">
|
||||
<mat-error>{{errorMessage}}</mat-error>
|
||||
</div>
|
||||
|
||||
<!-- bouton -->
|
||||
<button mat-button (click)="onValider()">Valider</button>
|
||||
|
||||
</div>
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
.myContainer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
::ng-deep .mat-radio-inner-circle {
|
||||
color: black !important;
|
||||
background-color: black !important;
|
||||
}
|
||||
|
||||
::ng-deep .mat-radio-outer-circle{
|
||||
color: black !important;
|
||||
border: solid 1px gray !important;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupCreatePersonComponent } from './popup-create-person.component';
|
||||
|
||||
describe('PopupCreerUtilisateurComponent', () => {
|
||||
let component: PopupCreatePersonComponent;
|
||||
let fixture: ComponentFixture<PopupCreatePersonComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupCreatePersonComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupCreatePersonComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,95 +0,0 @@
|
|||
import {Component, Inject} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {CheckEmailService} from "../../../common/services/checkEmail/check-email.service";
|
||||
import {MessageService} from "../../../common/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-create-person',
|
||||
templateUrl: './popup-create-person.component.html',
|
||||
styleUrls: ['./popup-create-person.component.scss']
|
||||
})
|
||||
export class PopupCreatePersonComponent
|
||||
{
|
||||
nickname: string = "";
|
||||
email: string = "";
|
||||
is_admin: boolean = false;
|
||||
password: string = "";
|
||||
|
||||
confirmPassword: string = "" ;
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "" ;
|
||||
|
||||
|
||||
constructor( public dialogRef: MatDialogRef<PopupCreatePersonComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any,
|
||||
private checkEmailService: CheckEmailService,
|
||||
private messageService: MessageService ) { }
|
||||
|
||||
|
||||
// Appuie sur le bouton "valider"
|
||||
onValider(): void
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
const data = {
|
||||
email: this.email,
|
||||
nickname: this.nickname,
|
||||
password: this.password,
|
||||
is_admin: this.is_admin
|
||||
};
|
||||
this.messageService
|
||||
.post("admin/create/user", data)
|
||||
.subscribe(ret => this.onValiderCallback(ret), err => this.onValiderCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de 'onValider'
|
||||
onValiderCallback(retour: any)
|
||||
{
|
||||
if(retour.status !== 'success')
|
||||
{
|
||||
console.log(retour);
|
||||
this.errorMessage = retour.error.message;
|
||||
this.hasError = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.dialogRef.close(retour);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Check les champs saisis par l'utilisateur
|
||||
checkField(): void
|
||||
{
|
||||
if(this.nickname.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'pseudo'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.email.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'email'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(!this.checkEmailService.isValidEmail(this.email)) {
|
||||
this.errorMessage = "Email invalide.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.password.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'mot de passe'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.password !== this.confirmPassword) {
|
||||
this.errorMessage = "Le mot de passe est différent de sa confirmation.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
<div class="myContainer">
|
||||
<div class="boite">
|
||||
|
||||
<h3>Modifier</h3>
|
||||
|
||||
<!-- divider -->
|
||||
<mat-divider></mat-divider><br>
|
||||
|
||||
<!-- role -->
|
||||
<mat-radio-group [(ngModel)]="is_admin">
|
||||
<mat-radio-button [value]="false"
|
||||
[checked]="!is_admin">Utilisateur</mat-radio-button>
|
||||
<mat-radio-button [value]="true"
|
||||
[checked]="is_admin">Admin</mat-radio-button>
|
||||
</mat-radio-group><br><br>
|
||||
|
||||
<!-- divider -->
|
||||
<mat-divider></mat-divider><br>
|
||||
|
||||
<!-- Modifier mot de passe -->
|
||||
<div>
|
||||
Modifier mot de passe:
|
||||
<mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
|
||||
</div>
|
||||
|
||||
<!-- nouveau mot de passe -->
|
||||
<div *ngIf="changePassword" style="margin-top: 10px">
|
||||
<!-- Nouveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="newPassword">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
<!-- Confirmation npuveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Confirmation nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="confirmNewPassword">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="!changePassword"><br></div>
|
||||
|
||||
<!-- divider -->
|
||||
<mat-divider></mat-divider><br>
|
||||
|
||||
<!-- message d'erreur -->
|
||||
<div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
|
||||
<span class="mat-error">{{errorMessage}}</span>
|
||||
</div>
|
||||
|
||||
<!-- boutons -->
|
||||
<div style="width: 100%; text-align: right">
|
||||
<button mat-button (click)="this.dialogRef.close(null)"> Annuler </button>
|
||||
<button mat-button (click)="onValider()"> Enregistrer </button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.boite {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
img {
|
||||
margin: 0px 0px 10px 0px;
|
||||
width: 5vw;
|
||||
height: 5vw;
|
||||
border: solid 2px black;
|
||||
border-radius: 50%;
|
||||
font-size: xxx-large;
|
||||
}
|
||||
|
||||
// -------------------------------------------------------------------------
|
||||
|
||||
// aura
|
||||
::ng-deep .mat-checkbox-ripple .mat-ripple-element {
|
||||
background-color: grey !important;
|
||||
}
|
||||
|
||||
// contenu coche
|
||||
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
|
||||
background-color: black !important;
|
||||
}
|
||||
|
||||
// indeterminate
|
||||
::ng-deep .mat-checkbox .mat-checkbox-frame {
|
||||
background-color: white !important;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupUpdatePersonAdminComponent } from './popup-update-person-admin.component';
|
||||
|
||||
describe('PopupUpdatePersonAdminComponent', () => {
|
||||
let component: PopupUpdatePersonAdminComponent;
|
||||
let fixture: ComponentFixture<PopupUpdatePersonAdminComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupUpdatePersonAdminComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupUpdatePersonAdminComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,87 +0,0 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {CheckEmailService} from "../../../common/services/checkEmail/check-email.service";
|
||||
import {MessageService} from "../../../common/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-update-person-admin',
|
||||
templateUrl: './popup-update-person-admin.component.html',
|
||||
styleUrls: ['./popup-update-person-admin.component.scss']
|
||||
})
|
||||
export class PopupUpdatePersonAdminComponent implements OnInit
|
||||
{
|
||||
id: number = 0;
|
||||
is_admin: boolean = false;
|
||||
newPassword: string = "";
|
||||
|
||||
confirmNewPassword: string = "" ;
|
||||
changePassword: boolean = false ;
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "" ;
|
||||
|
||||
|
||||
constructor( public dialogRef: MatDialogRef<PopupUpdatePersonAdminComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any,
|
||||
private checkEmailService: CheckEmailService,
|
||||
private messageService: MessageService ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
this.id = this.data.person.id;
|
||||
this.is_admin = this.data.person.is_admin;
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton "valider"
|
||||
onValider(): void
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
let data = {};
|
||||
if(this.changePassword) data = { id: this.id, is_admin: this.is_admin, password: this.newPassword }
|
||||
else data = { id: this.id, is_admin: this.is_admin };
|
||||
this.messageService
|
||||
.put("admin/update/user", data)
|
||||
.subscribe(ret => this.onValiderCallback(ret), err => this.onValiderCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de 'onValider'
|
||||
onValiderCallback(retour: any)
|
||||
{
|
||||
if(retour.status !== 'success')
|
||||
{
|
||||
console.log(retour);
|
||||
this.errorMessage = retour.error.message;
|
||||
this.hasError = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.dialogRef.close(this.is_admin);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Check les champs saisis par l'utilisateur
|
||||
checkField(): void
|
||||
{
|
||||
if((this.changePassword) && (this.newPassword.length === 0)) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'mot de passe'";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if((this.changePassword) && (this.newPassword !== this.confirmNewPassword)) {
|
||||
this.errorMessage = "Le mot de passe est différent de sa confirmation";
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import {PageLoginComponent} from "./login/page-login/page-login.component";
|
||||
import {PageRegisterComponent} from "./register/page-register/page-register.component";
|
||||
import {PageProfilComponent} from "./common/components/page-profil/page-profil.component";
|
||||
import {PageUserListComponent} from "./admin/userList/page-user-list/page-user-list.component";
|
||||
import {PageRegistryComponent} from "./user/page-registry/page-registry.component";
|
||||
import {UserGuard} from "./common/guards/user/user.guard";
|
||||
import {AdminGuard} from "./common/guards/admin/admin.guard";
|
||||
|
||||
const routes: Routes = [
|
||||
|
||||
{ path: "", component: PageLoginComponent },
|
||||
{ path: "login", component: PageLoginComponent },
|
||||
|
||||
{ path: "register", component: PageRegisterComponent },
|
||||
|
||||
{ path: "user", component: PageRegistryComponent, canActivate: [UserGuard] },
|
||||
{ path: "user/registry", component: PageRegistryComponent, canActivate: [UserGuard] },
|
||||
{ path: "user/myProfil", component: PageProfilComponent, canActivate: [UserGuard] },
|
||||
|
||||
{ path: "admin", component: PageUserListComponent, canActivate: [AdminGuard] },
|
||||
{ path: "admin/userList", component: PageUserListComponent, canActivate: [AdminGuard] },
|
||||
{ path: "admin/myProfil", component: PageProfilComponent, canActivate: [AdminGuard] },
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forRoot(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class AppRoutingModule { }
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<router-outlet></router-outlet>
|
||||
|
|
@ -1,35 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
import { RouterTestingModule } from '@angular/router/testing';
|
||||
import { AppComponent } from './app.component';
|
||||
|
||||
describe('AppComponent', () => {
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
imports: [
|
||||
RouterTestingModule
|
||||
],
|
||||
declarations: [
|
||||
AppComponent
|
||||
],
|
||||
}).compileComponents();
|
||||
});
|
||||
|
||||
it('should create the app', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.componentInstance;
|
||||
expect(app).toBeTruthy();
|
||||
});
|
||||
|
||||
it(`should have as title 'frontend'`, () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.componentInstance;
|
||||
expect(app.title).toEqual('frontend');
|
||||
});
|
||||
|
||||
it('should render title', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
fixture.detectChanges();
|
||||
const compiled = fixture.nativeElement as HTMLElement;
|
||||
expect(compiled.querySelector('.content span')?.textContent).toContain('frontend app is running!');
|
||||
});
|
||||
});
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
templateUrl: './app.component.html',
|
||||
styleUrls: ['./app.component.scss']
|
||||
})
|
||||
export class AppComponent {
|
||||
title = 'frontend';
|
||||
}
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { BrowserModule } from '@angular/platform-browser';
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { PageRegisterComponent } from './register/page-register/page-register.component';
|
||||
import {FormsModule} from "@angular/forms";
|
||||
import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
|
||||
import {MatFormFieldModule} from "@angular/material/form-field";
|
||||
import {MatInputModule} from "@angular/material/input";
|
||||
import {PageLoginComponent} from "./login/page-login/page-login.component";
|
||||
import { NavbarComponent } from './common/components/navbar/navbar.component';
|
||||
import {MatButtonModule} from "@angular/material/button";
|
||||
import { PageProfilComponent } from './common/components/page-profil/page-profil.component';
|
||||
import { PopupUpdateProfilComponent } from './common/components/popup-update-profil/popup-update-profil.component';
|
||||
import {MatDividerModule} from "@angular/material/divider";
|
||||
import {MatCheckboxModule} from "@angular/material/checkbox";
|
||||
import {MatDialogModule} from "@angular/material/dialog";
|
||||
import {MatSnackBarModule} from "@angular/material/snack-bar";
|
||||
import { PageUserListComponent } from './admin/userList/page-user-list/page-user-list.component';
|
||||
import { PopupCreatePersonComponent } from './admin/userList/popup-create-person/popup-create-person.component';
|
||||
import {MatTableModule} from "@angular/material/table";
|
||||
import {MatPaginatorModule} from "@angular/material/paginator";
|
||||
import { PopupConfirmRegisterComponent } from './register/popup-confirm-register/popup-confirm-register.component';
|
||||
import {MatIconModule} from "@angular/material/icon";
|
||||
import {MatRadioModule} from "@angular/material/radio";
|
||||
import { PageRegistryComponent } from './user/page-registry/page-registry.component';
|
||||
import { PopupDeleteProfilComponent } from './common/components/popup-delete-profil/popup-delete-profil.component';
|
||||
import {MatSortModule} from "@angular/material/sort";
|
||||
import { PopupUpdatePersonAdminComponent } from './admin/userList/popup-update-person-admin/popup-update-person-admin.component';
|
||||
import {HttpClientModule} from "@angular/common/http";
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AppComponent,
|
||||
PageLoginComponent,
|
||||
PageRegisterComponent,
|
||||
NavbarComponent,
|
||||
PageProfilComponent,
|
||||
PopupUpdateProfilComponent,
|
||||
PageUserListComponent,
|
||||
PopupCreatePersonComponent,
|
||||
PopupConfirmRegisterComponent,
|
||||
PageRegistryComponent,
|
||||
PopupDeleteProfilComponent,
|
||||
PopupUpdatePersonAdminComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
AppRoutingModule,
|
||||
FormsModule,
|
||||
BrowserAnimationsModule,
|
||||
HttpClientModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatButtonModule,
|
||||
MatDividerModule,
|
||||
MatCheckboxModule,
|
||||
MatDialogModule,
|
||||
MatSnackBarModule,
|
||||
MatTableModule,
|
||||
MatPaginatorModule,
|
||||
MatSortModule,
|
||||
MatIconModule,
|
||||
MatRadioModule
|
||||
],
|
||||
providers: [],
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
export class AppModule { }
|
||||
|
|
@ -1,108 +0,0 @@
|
|||
<!-- Login -->
|
||||
<div *ngIf="pour === 'nickname'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- FlaskAled -->
|
||||
<a class="navbar-brand" routerLink=""> FlaskAled </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
<!-- S'inscrire -->
|
||||
<button mat-button class="btnDeconnexion" routerLink="/register">
|
||||
S'inscrire
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Register -->
|
||||
<div *ngIf="pour === 'register'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- FlaskAled -->
|
||||
<a class="navbar-brand" routerLink=""> FlaskAled </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- Rien -->
|
||||
<div class="collapse navbar-collapse"></div>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- User -->
|
||||
<div *ngIf="pour === 'user'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- FlaskAled -->
|
||||
<a class="navbar-brand" routerLink="/user"> FlaskAled </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [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="/login">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- --------------------------------------------------------------------------------------------------------- -->
|
||||
|
||||
|
||||
<!-- Admin -->
|
||||
<div *ngIf="pour === 'admin'">
|
||||
<nav class="navbar navbar-expand-lg">
|
||||
|
||||
<!-- FlaskAled -->
|
||||
<a class="navbar-brand" routerLink="/admin/userList"> FlaskAled </a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<!-- [userList] [myProfil] -->
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/userList">Liste des utillisateurs</a>
|
||||
</li>
|
||||
<li class="nav-item active monLi">
|
||||
<a class="nav-link" routerLink="/admin/myProfil">Mon profil</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Deconnexion -->
|
||||
<button mat-button class="btnDeconnexion" (click)="onDeconnexion()" routerLink="/login">
|
||||
Deconnexion
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
</div>
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
.navbar {
|
||||
background-color: black;
|
||||
height: 60px;
|
||||
font-size: medium;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
.navbar-expand-lg {
|
||||
border-bottom: solid;
|
||||
border-color: white;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
|
||||
// PolyNotFound
|
||||
.navbar-brand {
|
||||
font-family: cursive;
|
||||
font-weight: bold;
|
||||
font-size: x-large;
|
||||
margin-left: 15px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
||||
// Recherche, Mes Playlists, Historique
|
||||
.nav-link {
|
||||
color: white;
|
||||
}
|
||||
.nav-link:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
// Bonton deconnexion
|
||||
.btnDeconnexion {
|
||||
font-size: medium;
|
||||
margin: 0px 10px 0px 10px
|
||||
}
|
||||
.btnDeconnexion:hover {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
.monLi {
|
||||
margin: 0px 10px 0px 10px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border: solid 2px white;
|
||||
border-radius: 50px;
|
||||
margin: 0px 10px 0px 15px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { NavbarComponent } from './navbar.component';
|
||||
|
||||
describe('NavbarComponent', () => {
|
||||
let component: NavbarComponent;
|
||||
let fixture: ComponentFixture<NavbarComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ NavbarComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(NavbarComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,32 +0,0 @@
|
|||
import {Component, Input, OnInit} from '@angular/core';
|
||||
import {ProfilService} from "../../services/profil/profil.service";
|
||||
import {MessageService} from "../../services/message/message.service";
|
||||
|
||||
@Component({
|
||||
selector: 'app-navbar',
|
||||
templateUrl: './navbar.component.html',
|
||||
styleUrls: ['./navbar.component.scss']
|
||||
})
|
||||
export class NavbarComponent implements OnInit
|
||||
{
|
||||
@Input() pour = "login";
|
||||
|
||||
constructor(private profilService: ProfilService, private messageService: MessageService) { }
|
||||
|
||||
ngOnInit(): void {}
|
||||
|
||||
onDeconnexion(): void
|
||||
{
|
||||
this.messageService
|
||||
.delete('logout')
|
||||
.subscribe(retour => this.onDeconnexionCallback(retour), err => this.onDeconnexionCallback(err));
|
||||
this.profilService.setId(-1);
|
||||
this.profilService.setIsAdmin(false);
|
||||
}
|
||||
|
||||
onDeconnexionCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success") console.log(retour);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
<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="this.from === 'user'">utilisateur</span>
|
||||
<span *ngIf="this.from === '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
|
||||
</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
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
.myContainer {
|
||||
max-width: 100vw;
|
||||
height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
|
||||
.boite {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 50%;
|
||||
margin-top: 10vh;
|
||||
border: solid 3px;
|
||||
border-radius: 10px;
|
||||
padding: 20px 40px 20px 40px;
|
||||
background-color: #ffffff;
|
||||
text-align: center;
|
||||
box-shadow: 10px 5px 5px black;
|
||||
}
|
||||
|
||||
|
||||
.myRow {
|
||||
margin: 15px 0px 15px 0px;
|
||||
}
|
||||
.myLabel {
|
||||
text-align: right;
|
||||
padding: 0px 5px 0px 0px;
|
||||
margin: 0px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.myValue {
|
||||
text-align: left;
|
||||
padding: 0px 0px 0px 5px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
|
||||
.btnContainer {
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.myBtn {
|
||||
border: solid 1px black;
|
||||
background-color: white;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageProfilComponent } from './page-profil.component';
|
||||
|
||||
describe('PageUtilisateurComponent', () => {
|
||||
let component: PageProfilComponent;
|
||||
let fixture: ComponentFixture<PageProfilComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageProfilComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageProfilComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,110 +0,0 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import {MatDialog} from "@angular/material/dialog";
|
||||
import {MatSnackBar} from "@angular/material/snack-bar";
|
||||
import {PopupUpdateProfilComponent} from "../popup-update-profil/popup-update-profil.component";
|
||||
import {Router} from "@angular/router";
|
||||
import {PopupDeleteProfilComponent} from "../popup-delete-profil/popup-delete-profil.component";
|
||||
import {MessageService} from "../../services/message/message.service";
|
||||
import {HttpParams} from "@angular/common/http";
|
||||
import {ProfilService} from "../../services/profil/profil.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-profil',
|
||||
templateUrl: './page-profil.component.html',
|
||||
styleUrls: ['./page-profil.component.scss']
|
||||
})
|
||||
export class PageProfilComponent implements OnInit
|
||||
{
|
||||
person = {
|
||||
id: "",
|
||||
nickname: "",
|
||||
email: "",
|
||||
is_admin: false,
|
||||
};
|
||||
from: string = "" ;
|
||||
configSnackbar = { duration: 3000, panelClass: "custom-class" };
|
||||
|
||||
|
||||
constructor( private messageService: MessageService,
|
||||
private profilService: ProfilService,
|
||||
public dialog: MatDialog,
|
||||
private snackBar: MatSnackBar,
|
||||
private router: Router ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
if(this.router.url.startsWith("/user")) this.from = "user" ;
|
||||
else if(this.router.url.startsWith("/admin")) this.from = "admin" ;
|
||||
|
||||
let params = new HttpParams()
|
||||
params = params.set("order_by", "nickname");
|
||||
params = params.set("id", this.profilService.getId());
|
||||
this.messageService
|
||||
.get("users", params)
|
||||
.subscribe(ret => this.ngOnInitCallback(ret), err => this.ngOnInitCallback(err));
|
||||
}
|
||||
|
||||
|
||||
// Callback de ngOnInit
|
||||
ngOnInitCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success") {
|
||||
console.log(retour);
|
||||
}
|
||||
else {
|
||||
this.person = retour.data[0];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton modifier
|
||||
onModifier(): void
|
||||
{
|
||||
const config = {
|
||||
width: '25%',
|
||||
data: { person: this.person }
|
||||
};
|
||||
this.dialog
|
||||
.open(PopupUpdateProfilComponent, config)
|
||||
.afterClosed()
|
||||
.subscribe(retour => this.onModifierCallback(retour));
|
||||
}
|
||||
|
||||
|
||||
// Callback de onModifier
|
||||
onModifierCallback(retour: any): void
|
||||
{
|
||||
if((retour === null) || (retour === undefined)) this.snackBar.open( "Opération annulé", "", this.configSnackbar);
|
||||
else if(retour.status === "success") this.person = retour.data;
|
||||
}
|
||||
|
||||
|
||||
// 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)) this.snackBar.open( "Opération annulé", "", this.configSnackbar);
|
||||
else if(retour.status === "error") this.snackBar.open(retour.error.message, "", this.configSnackbar);
|
||||
else if(retour.status === "success") this.router.navigateByUrl("/login");
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,14 +0,0 @@
|
|||
<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>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
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();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,68 +0,0 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {MessageService} from "../../services/message/message.service";
|
||||
import {HttpParams} from "@angular/common/http";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-delete-profil',
|
||||
templateUrl: './popup-delete-profil.component.html',
|
||||
styleUrls: ['./popup-delete-profil.component.scss']
|
||||
})
|
||||
export class PopupDeleteProfilComponent implements OnInit
|
||||
{
|
||||
id: number;
|
||||
me: boolean = false; // on se supprime soi-même
|
||||
email: string = "";
|
||||
|
||||
|
||||
constructor( private messageService: MessageService,
|
||||
public dialogRef: MatDialogRef<PopupDeleteProfilComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any ) { }
|
||||
|
||||
|
||||
ngOnInit(): void {
|
||||
this.id = this.data.id;
|
||||
this.me = this.data.me;
|
||||
this.email = this.data.email;
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur 'valider'
|
||||
onValider(): void
|
||||
{
|
||||
if(this.me)
|
||||
{
|
||||
this.messageService
|
||||
.delete("user/delete")
|
||||
.subscribe(ret => this.onValiderCallback(ret), err => this.onValiderCallback(err));
|
||||
}
|
||||
else {
|
||||
//let params = (new HttpParams()).set("id", this.id);
|
||||
this.messageService
|
||||
.delete("admin/delete/user/"+this.id)
|
||||
.subscribe(ret => this.onValiderCallback(ret), err => this.onValiderCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de onValider
|
||||
onValiderCallback(retour: any): void
|
||||
{
|
||||
if(retour.status === "success")
|
||||
{
|
||||
this.dialogRef.close(retour);
|
||||
}
|
||||
else if(retour.status === "error")
|
||||
{
|
||||
console.log(retour);
|
||||
this.dialogRef.close(retour);
|
||||
}
|
||||
else {
|
||||
console.log(retour);
|
||||
this.dialogRef.close(null);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
<div class="myContainer">
|
||||
<div class="boite">
|
||||
|
||||
<h3>Modifier</h3>
|
||||
|
||||
<!-- divider -->
|
||||
<br><mat-divider></mat-divider><br>
|
||||
|
||||
<!-- nickname -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Pseudo</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="personCopy.nickname" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- divider -->
|
||||
<mat-divider></mat-divider><br>
|
||||
|
||||
<!-- Modifier mot de passe -->
|
||||
<div>
|
||||
Modifier mot de passe:
|
||||
<mat-checkbox [(ngModel)]="changePassword"></mat-checkbox>
|
||||
</div>
|
||||
|
||||
<!-- nouveau mot de passe -->
|
||||
<div *ngIf="changePassword" style="margin-top: 10px">
|
||||
<!-- Nouveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="newPassword">
|
||||
</mat-form-field>
|
||||
<br>
|
||||
<!-- Confirmation npuveau mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Confirmation nouveau mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="confirmNewPassword">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div *ngIf="!changePassword"><br></div>
|
||||
|
||||
<!-- divider -->
|
||||
<mat-divider></mat-divider><br>
|
||||
|
||||
<!-- message d'erreur -->
|
||||
<div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
|
||||
<span class="mat-error">{{errorMessage}}</span>
|
||||
</div>
|
||||
|
||||
<!-- boutons -->
|
||||
<div style="width: 100%; text-align: right">
|
||||
<button mat-button (click)="this.dialogRef.close(null)"> Annuler </button>
|
||||
<button mat-button (click)="onValider()"> Enregistrer </button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
.boite {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: small;
|
||||
}
|
||||
|
||||
img {
|
||||
margin: 0px 0px 10px 0px;
|
||||
width: 5vw;
|
||||
height: 5vw;
|
||||
border: solid 2px black;
|
||||
border-radius: 50%;
|
||||
font-size: xxx-large;
|
||||
}
|
||||
|
||||
// -------------------------------------------------------------------------
|
||||
|
||||
// aura
|
||||
::ng-deep .mat-checkbox-ripple .mat-ripple-element {
|
||||
background-color: grey !important;
|
||||
}
|
||||
|
||||
// contenu coche
|
||||
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
|
||||
background-color: black !important;
|
||||
}
|
||||
|
||||
// indeterminate
|
||||
::ng-deep .mat-checkbox .mat-checkbox-frame {
|
||||
background-color: white !important;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupUpdateProfilComponent } from './popup-update-profil.component';
|
||||
|
||||
describe('PopupModifierUtilisateurComponent', () => {
|
||||
let component: PopupUpdateProfilComponent;
|
||||
let fixture: ComponentFixture<PopupUpdateProfilComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupUpdateProfilComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupUpdateProfilComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,108 +0,0 @@
|
|||
import {Component, Inject, OnInit} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {CheckEmailService} from "../../services/checkEmail/check-email.service";
|
||||
import {MessageService} from "../../services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-update-profil',
|
||||
templateUrl: './popup-update-profil.component.html',
|
||||
styleUrls: ['./popup-update-profil.component.scss']
|
||||
})
|
||||
export class PopupUpdateProfilComponent implements OnInit
|
||||
{
|
||||
personCopy: any;
|
||||
newPassword: string = "";
|
||||
confirmNewPassword: string = "" ;
|
||||
changePassword: boolean = false ;
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "" ;
|
||||
|
||||
|
||||
constructor( private checkEmailService: CheckEmailService,
|
||||
private messageService: MessageService,
|
||||
public dialogRef: MatDialogRef<PopupUpdateProfilComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any ) { }
|
||||
|
||||
|
||||
ngOnInit(): void
|
||||
{
|
||||
const person = this.data.person;
|
||||
this.personCopy = {
|
||||
id: person.id,
|
||||
nickname: person.nickname,
|
||||
email: person.email,
|
||||
is_admin: person.is_admin
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// Appuie sur le bouton "valider"
|
||||
onValider(): void
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
let data: any = {nickname: this.personCopy.nickname};
|
||||
if(this.changePassword) data = {
|
||||
nickname: this.personCopy.nickname,
|
||||
password: this.newPassword
|
||||
};
|
||||
this.messageService
|
||||
.put("user/update", data)
|
||||
.subscribe(ret => this.onValiderCallback(ret), err => this.onValiderCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de 'onValider'
|
||||
onValiderCallback(retour: any)
|
||||
{
|
||||
if(retour.status === "success")
|
||||
{
|
||||
this.dialogRef.close(retour);
|
||||
}
|
||||
else if(retour.status === "error")
|
||||
{
|
||||
console.log(retour);
|
||||
this.errorMessage = retour.message;
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
console.log(retour);
|
||||
this.dialogRef.close(null);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Check les champs saisis par l'utilisateur
|
||||
checkField(): void
|
||||
{
|
||||
if(this.personCopy.nickname.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'pseudo'" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.personCopy.email.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'email'" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(!this.checkEmailService.isValidEmail(this.personCopy.email)) {
|
||||
this.errorMessage = "Email invalide" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if((this.changePassword) && (this.newPassword.length === 0)) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'mot de passe'";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if((this.changePassword) && (this.newPassword !== this.confirmNewPassword)) {
|
||||
this.errorMessage = "Le mot de passe est différent de sa confirmation";
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AdminGuard } from './admin.guard';
|
||||
|
||||
describe('AdminGuard', () => {
|
||||
let guard: AdminGuard;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
guard = TestBed.inject(AdminGuard);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(guard).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree} from '@angular/router';
|
||||
import { Observable } from 'rxjs';
|
||||
import {ProfilService} from "../../services/profil/profil.service";
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class AdminGuard implements CanActivate
|
||||
{
|
||||
|
||||
constructor(private profilService: ProfilService, private router: Router) {}
|
||||
|
||||
|
||||
canActivate( route: ActivatedRouteSnapshot, state: RouterStateSnapshot ): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree
|
||||
{
|
||||
if(this.profilService.getId() === -1) // si non connecté
|
||||
{
|
||||
this.router.navigateByUrl("/login");
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
if(this.profilService.isAdmin()) return true;
|
||||
else {
|
||||
this.router.navigateByUrl("/login");
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { UserGuard } from './user.guard';
|
||||
|
||||
describe('UserGuard', () => {
|
||||
let guard: UserGuard;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
guard = TestBed.inject(UserGuard);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(guard).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree} from '@angular/router';
|
||||
import { Observable } from 'rxjs';
|
||||
import {ProfilService} from "../../services/profil/profil.service";
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class UserGuard implements CanActivate
|
||||
{
|
||||
|
||||
constructor(private profilService: ProfilService, private router: Router) {}
|
||||
|
||||
|
||||
canActivate( route: ActivatedRouteSnapshot, state: RouterStateSnapshot ): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree
|
||||
{
|
||||
if(this.profilService.getId() === -1) // si non connecté
|
||||
{
|
||||
this.router.navigateByUrl("/login");
|
||||
return false;
|
||||
}
|
||||
else {
|
||||
if(!this.profilService.isAdmin()) return true;
|
||||
else {
|
||||
this.router.navigateByUrl("/login");
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CheckEmailService } from './check-email.service';
|
||||
|
||||
describe('CheckEmailService', () => {
|
||||
let service: CheckEmailService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(CheckEmailService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class CheckEmailService
|
||||
{
|
||||
|
||||
isValidEmail(email: string): boolean
|
||||
{
|
||||
let re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||
return re.test(email);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FictitiousDatasService } from './fictitious-datas.service';
|
||||
|
||||
describe('FictitiousDatasService', () => {
|
||||
let service: FictitiousDatasService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(FictitiousDatasService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class FictitiousDatasService
|
||||
{
|
||||
|
||||
getUser()
|
||||
{
|
||||
const id = (Math.floor(Math.random()*100000)).toString()
|
||||
return {
|
||||
id: id,
|
||||
nickname: "Riri"+id,
|
||||
email: "riri"+id+"@gmail.com",
|
||||
hash_pass: "blablabla",
|
||||
is_admin: false,
|
||||
}
|
||||
}
|
||||
|
||||
getAdmin()
|
||||
{
|
||||
const id = (Math.floor(Math.random()*100000)).toString()
|
||||
return {
|
||||
id: id,
|
||||
nickname: "Fifi"+id,
|
||||
email: "fifi"+id+"@gmail.com",
|
||||
hash_pass: "blablabla",
|
||||
is_admin: true,
|
||||
}
|
||||
}
|
||||
|
||||
getTabPerson(n: number)
|
||||
{
|
||||
let tab = [];
|
||||
|
||||
for(let i=0 ; i<n ; i++)
|
||||
{
|
||||
if(Math.random() < 0.5) tab.push(this.getUser());
|
||||
else tab.push(this.getAdmin());
|
||||
}
|
||||
|
||||
return tab;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { HashageService } from './hashage.service';
|
||||
|
||||
describe('HashageService', () => {
|
||||
let service: HashageService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(HashageService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class HashageService
|
||||
{
|
||||
// Fonction de hashage (faible)
|
||||
run(input: string): string
|
||||
{
|
||||
let hash = 0;
|
||||
for (let i = 0; i < input.length; i++) {
|
||||
let ch = input.charCodeAt(i);
|
||||
hash = ((hash << 5) - hash) + ch;
|
||||
hash = hash & hash;
|
||||
}
|
||||
return hash.toString();
|
||||
}
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { MessageService } from './message.service';
|
||||
|
||||
describe('MessageService', () => {
|
||||
let service: MessageService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(MessageService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
import {HttpClient, HttpParams} from "@angular/common/http";
|
||||
import {Observable} from "rxjs";
|
||||
import {environment} from "../../../../environments/environment";
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class MessageService
|
||||
{
|
||||
|
||||
constructor( private http: HttpClient ) { }
|
||||
|
||||
post(url: string, data: any): Observable<any>
|
||||
{
|
||||
const urlComplete = environment.debutUrl + url ;
|
||||
return this.http.post<any>(urlComplete, data, {withCredentials: true});
|
||||
}
|
||||
|
||||
get(url: string, params:HttpParams = new HttpParams()): Observable<any>
|
||||
{
|
||||
const urlComplete = environment.debutUrl + url ;
|
||||
return this.http.get<any>(urlComplete,{ withCredentials: true, params: params });
|
||||
}
|
||||
|
||||
put(url: string, data: any): Observable<any>
|
||||
{
|
||||
const urlComplete = environment.debutUrl + url ;
|
||||
return this.http.put<any>(urlComplete, data, {withCredentials: true});
|
||||
}
|
||||
|
||||
delete(url: string, params:HttpParams = new HttpParams()): Observable<any>
|
||||
{
|
||||
const urlComplete = environment.debutUrl + url ;
|
||||
return this.http.delete<any>(urlComplete,{withCredentials: true});
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
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();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class ProfilService
|
||||
{
|
||||
|
||||
constructor()
|
||||
{
|
||||
if(localStorage.getItem('id') === null) this.setId(-1);
|
||||
if(localStorage.getItem('isAdmin') === null) this.setIsAdmin(false);
|
||||
}
|
||||
|
||||
getId(): number
|
||||
{
|
||||
let idString = localStorage.getItem('id');
|
||||
if(idString === null) return -1;
|
||||
else return parseInt(idString);
|
||||
}
|
||||
|
||||
setId(id: number): void
|
||||
{
|
||||
localStorage.setItem('id', id.toString());
|
||||
}
|
||||
|
||||
isAdmin(): boolean
|
||||
{
|
||||
let isAdminString = localStorage.getItem('isAdmin');
|
||||
if(isAdminString === "T") return true;
|
||||
else return false;
|
||||
}
|
||||
|
||||
setIsAdmin(isAdmin: boolean): void
|
||||
{
|
||||
let isAdminString = "" ;
|
||||
if(isAdmin) isAdminString = "T";
|
||||
else isAdminString = "F";
|
||||
localStorage.setItem('isAdmin', isAdminString);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
<div>
|
||||
<div class="bg">
|
||||
|
||||
|
||||
<!-- NavBar -->
|
||||
<app-navbar pour="nickname"></app-navbar>
|
||||
|
||||
|
||||
<!--contenu -->
|
||||
<div class="wrapper fadeInDown">
|
||||
<div id="formContent">
|
||||
|
||||
<!-- Icon -->
|
||||
<div class="fadeIn first">
|
||||
<h1 style="font-family: cursive; font-size: 45px; margin-top: 20px; margin-bottom: 10px">FlaskAled</h1>
|
||||
<img src="/assets/logo.png" id="icon" alt="User Icon" style="margin-top: 10px"/>
|
||||
</div>
|
||||
|
||||
<!-- Login Form -->
|
||||
<form>
|
||||
<input [(ngModel)]="email" type="text" id="email" class="fadeIn second" name="email" placeholder="Email">
|
||||
<input [(ngModel)]="password" type="password" id="password" class="fadeIn third" name="password" placeholder="Mot de passe">
|
||||
<!-- Message d'erreur -->
|
||||
<div *ngIf="hasError" style="text-align: center; margin-bottom: 20px;">
|
||||
<span class="mat-error"> {{errorMessage}} </span>
|
||||
</div>
|
||||
<input type="submit" class="fadeIn fourth" value="Se connecter" (click)="onSeConnecter()">
|
||||
</form>
|
||||
|
||||
<!-- Oubli mot de passe -->
|
||||
<div id="formFooter">
|
||||
<a class="underlineHover" href="https://disney.fandom.com/fr/wiki/Tristesse">J'ai oublié mon mot de passe</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,271 +0,0 @@
|
|||
html {
|
||||
background-color: #56baed;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Poppins", sans-serif;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #5E89FF;
|
||||
display:inline-block;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
display:inline-block;
|
||||
margin: 40px 8px 10px 8px;
|
||||
color: #cccccc;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* STRUCTURE */
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
min-height: 80%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
#formContent {
|
||||
-webkit-border-radius: 10px 10px 10px 10px;
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
background: #fff;
|
||||
padding: 30px;
|
||||
width: 90%;
|
||||
max-width: 450px;
|
||||
position: relative;
|
||||
padding: 0px;
|
||||
-webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
|
||||
box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#formFooter {
|
||||
background-color: #f6f6f6;
|
||||
border-top: 1px solid #dce8f1;
|
||||
padding: 25px;
|
||||
text-align: center;
|
||||
-webkit-border-radius: 0 0 10px 10px;
|
||||
border-radius: 0 0 10px 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* TABS */
|
||||
|
||||
h2.inactive {
|
||||
color: #cccccc;
|
||||
}
|
||||
|
||||
h2.active {
|
||||
color: #0d0d0d;
|
||||
border-bottom: 2px solid #5fbae9;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* FORM TYPOGRAPHY*/
|
||||
|
||||
input[type=button], input[type=submit], input[type=reset] {
|
||||
background-color: #5E89FF;
|
||||
border: none;
|
||||
color: white;
|
||||
padding: 15px 80px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
text-transform: uppercase;
|
||||
font-size: 13px;
|
||||
-webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
|
||||
box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
|
||||
-webkit-border-radius: 5px 5px 5px 5px;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
margin: 5px 20px 40px 20px;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
-moz-transition: all 0.3s ease-in-out;
|
||||
-ms-transition: all 0.3s ease-in-out;
|
||||
-o-transition: all 0.3s ease-in-out;
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
|
||||
background-color: #39ace7;
|
||||
}
|
||||
|
||||
input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
|
||||
-moz-transform: scale(0.95);
|
||||
-webkit-transform: scale(0.95);
|
||||
-o-transform: scale(0.95);
|
||||
-ms-transform: scale(0.95);
|
||||
transform: scale(0.95);
|
||||
}
|
||||
|
||||
input[type=text], input[type=password] {
|
||||
background-color: #f6f6f6;
|
||||
border: none;
|
||||
color: #0d0d0d;
|
||||
padding: 15px 32px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
font-size: 16px;
|
||||
margin: 5px;
|
||||
width: 85%;
|
||||
border: 2px solid #f6f6f6;
|
||||
-webkit-transition: all 0.5s ease-in-out;
|
||||
-moz-transition: all 0.5s ease-in-out;
|
||||
-ms-transition: all 0.5s ease-in-out;
|
||||
-o-transition: all 0.5s ease-in-out;
|
||||
transition: all 0.5s ease-in-out;
|
||||
-webkit-border-radius: 5px 5px 5px 5px;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
input[type=text]:focus, input[type=password]:focus {
|
||||
background-color: #fff;
|
||||
border-bottom: 2px solid #5fbae9;
|
||||
}
|
||||
|
||||
input[type=text]::placeholder, input[type=password]::placeholder {
|
||||
color: #cccccc;
|
||||
}
|
||||
|
||||
.bg{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
overflow-y: hidden;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* ANIMATIONS */
|
||||
|
||||
/* Simple CSS3 Fade-in-down Animation */
|
||||
.fadeInDown {
|
||||
-webkit-animation-name: fadeInDown;
|
||||
animation-name: fadeInDown;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeInDown {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: translate3d(0, -100%, 0);
|
||||
transform: translate3d(0, -100%, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeInDown {
|
||||
0% {
|
||||
opacity: 0;
|
||||
-webkit-transform: translate3d(0, -100%, 0);
|
||||
transform: translate3d(0, -100%, 0);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
-webkit-transform: none;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Simple CSS3 Fade-in Animation */
|
||||
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
|
||||
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
|
||||
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
|
||||
|
||||
.fadeIn {
|
||||
opacity:0;
|
||||
-webkit-animation:fadeIn ease-in 1;
|
||||
-moz-animation:fadeIn ease-in 1;
|
||||
animation:fadeIn ease-in 1;
|
||||
|
||||
-webkit-animation-fill-mode:forwards;
|
||||
-moz-animation-fill-mode:forwards;
|
||||
animation-fill-mode:forwards;
|
||||
|
||||
-webkit-animation-duration:1s;
|
||||
-moz-animation-duration:1s;
|
||||
animation-duration:1s;
|
||||
}
|
||||
|
||||
.fadeIn.first {
|
||||
-webkit-animation-delay: 0.4s;
|
||||
-moz-animation-delay: 0.4s;
|
||||
animation-delay: 0.4s;
|
||||
}
|
||||
|
||||
.fadeIn.second {
|
||||
-webkit-animation-delay: 0.6s;
|
||||
-moz-animation-delay: 0.6s;
|
||||
animation-delay: 0.6s;
|
||||
}
|
||||
|
||||
.fadeIn.third {
|
||||
-webkit-animation-delay: 0.8s;
|
||||
-moz-animation-delay: 0.8s;
|
||||
animation-delay: 0.8s;
|
||||
}
|
||||
|
||||
.fadeIn.fourth {
|
||||
-webkit-animation-delay: 1s;
|
||||
-moz-animation-delay: 1s;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
|
||||
/* Simple CSS3 Fade-in Animation */
|
||||
.underlineHover:after {
|
||||
display: block;
|
||||
left: 0;
|
||||
bottom: -10px;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
//background-color: #5E89FF;
|
||||
background-color: #5E89FF;
|
||||
content: "";
|
||||
transition: width 0.2s;
|
||||
}
|
||||
|
||||
.underlineHover:hover {
|
||||
color: #0d0d0d;
|
||||
}
|
||||
|
||||
.underlineHover:hover:after{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
h1{
|
||||
color: black;
|
||||
}
|
||||
|
||||
/* OTHERS */
|
||||
|
||||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#icon {
|
||||
width:30%;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageConnexionComponent } from './page-connexion.component';
|
||||
|
||||
describe('PageConnexionComponent', () => {
|
||||
let component: PageConnexionComponent;
|
||||
let fixture: ComponentFixture<PageConnexionComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageConnexionComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageConnexionComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
import {Component} from '@angular/core';
|
||||
import {Router} from "@angular/router";
|
||||
import {MessageService} from "../../common/services/message/message.service";
|
||||
import {ProfilService} from "../../common/services/profil/profil.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-nickname',
|
||||
templateUrl: './page-login.component.html',
|
||||
styleUrls: ['./page-login.component.scss']
|
||||
})
|
||||
export class PageLoginComponent
|
||||
{
|
||||
email: string = "" ;
|
||||
password: string = "" ;
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "";
|
||||
|
||||
|
||||
constructor( private messageService: MessageService,
|
||||
private router: Router,
|
||||
private profilService: ProfilService ) { }
|
||||
|
||||
|
||||
// Appuie sur le bouton "seConnecter"
|
||||
onSeConnecter(): void
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
const data = {
|
||||
email: this.email,
|
||||
password: this.password
|
||||
};
|
||||
this.messageService
|
||||
.post('login', data)
|
||||
.subscribe( retour => this.onSeConnecterCallback(retour), err => this.onSeConnecterCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de "onSeConnecter"
|
||||
onSeConnecterCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success")
|
||||
{
|
||||
console.log(retour);
|
||||
this.errorMessage = retour.error.message;
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.profilService.setId(retour.data.id);
|
||||
this.profilService.setIsAdmin(retour.data.is_admin)
|
||||
if(retour.data.is_admin) this.router.navigateByUrl('admin/userList');
|
||||
else this.router.navigateByUrl('user/registry');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Check les champs saisis par l'utilisateur
|
||||
checkField(): void
|
||||
{
|
||||
if(this.email === "") {
|
||||
this.errorMessage = "Veuillez remplir le champ email" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.password === "") {
|
||||
this.errorMessage = "Veuillez remplir le champ mot de passe" ;
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<div class="myContainer">
|
||||
|
||||
|
||||
<!-- navbar -->
|
||||
<app-navbar pour="register"></app-navbar>
|
||||
|
||||
|
||||
<!-- contenu -->
|
||||
<div class="boite">
|
||||
|
||||
<!-- nickname -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Pseudo</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="nickname" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- email -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Email</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="email" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- Mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="password" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- Confirmation mot de passe -->
|
||||
<mat-form-field appearance="fill">
|
||||
<mat-label>Confirmation mot de passe</mat-label>
|
||||
<input matInput type="password" [(ngModel)]="confirmPassword" required>
|
||||
</mat-form-field><br>
|
||||
|
||||
<!-- Message d'erreur -->
|
||||
<div *ngIf="hasError">
|
||||
<mat-error>{{errorMessage}}</mat-error>
|
||||
</div>
|
||||
|
||||
<!-- bouton -->
|
||||
<button mat-button style="border: solid 1px black" (click)="onValider()">
|
||||
Valider
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
.contenuContainer {
|
||||
padding: 20px 20px 20px 20px;
|
||||
width: 30%;
|
||||
margin: auto auto;
|
||||
margin-top: 50px;
|
||||
border: solid 1px black;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.boite {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 50%;
|
||||
margin-top: 10vh;
|
||||
border: solid 3px;
|
||||
border-radius: 10px;
|
||||
padding: 20px 40px 20px 40px;
|
||||
background-color: #ffffff;
|
||||
text-align: center;
|
||||
box-shadow: 10px 5px 5px black;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageRegisterComponent } from './page-register.component';
|
||||
|
||||
describe('PageInscriptionComponent', () => {
|
||||
let component: PageRegisterComponent;
|
||||
let fixture: ComponentFixture<PageRegisterComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageRegisterComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageRegisterComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,98 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
import {HashageService} from "../../common/services/hashage/hashage.service";
|
||||
import {Router} from "@angular/router";
|
||||
import {CheckEmailService} from "../../common/services/checkEmail/check-email.service";
|
||||
import {MatDialog} from "@angular/material/dialog";
|
||||
import {PopupConfirmRegisterComponent} from "../popup-confirm-register/popup-confirm-register.component";
|
||||
import {MessageService} from "../../common/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-register',
|
||||
templateUrl: './page-register.component.html',
|
||||
styleUrls: ['./page-register.component.scss']
|
||||
})
|
||||
export class PageRegisterComponent
|
||||
{
|
||||
email: string = "";
|
||||
nickname: string = "";
|
||||
password: string = "";
|
||||
confirmPassword: string = "";
|
||||
hasError: boolean = false;
|
||||
errorMessage: string = "";
|
||||
|
||||
|
||||
constructor( private checkEmailService: CheckEmailService,
|
||||
private messageService: MessageService,
|
||||
private router: Router,
|
||||
public dialog: MatDialog ) { }
|
||||
|
||||
|
||||
// Envoie de l'utilisateur au backend
|
||||
onValider(): void
|
||||
{
|
||||
this.checkField();
|
||||
if(!this.hasError)
|
||||
{
|
||||
const data = {
|
||||
email: this.email,
|
||||
nickname: this.nickname,
|
||||
password: this.password,
|
||||
is_admin: false
|
||||
};
|
||||
this.messageService
|
||||
.post('register', data)
|
||||
.subscribe( retour => this.onValiderCallback(retour), err => this.onValiderCallback(err));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Callback de "onValider"
|
||||
onValiderCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success")
|
||||
{
|
||||
console.log(retour);
|
||||
this.errorMessage = retour.error.message;
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.dialog
|
||||
.open(PopupConfirmRegisterComponent, {})
|
||||
.afterClosed()
|
||||
.subscribe(retour => this.router.navigateByUrl("/login"));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Check les champs saisis par l'utilisateur
|
||||
checkField(): void
|
||||
{
|
||||
if(this.nickname.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'pseudo'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.email.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'email'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(!this.checkEmailService.isValidEmail(this.email)) {
|
||||
this.errorMessage = "Email invalide.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.password.length === 0) {
|
||||
this.errorMessage = "Veuillez remplir le champ 'mot de passe'.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else if(this.password !== this.confirmPassword) {
|
||||
this.errorMessage = "Le mot de passe est différent de sa confirmation.";
|
||||
this.hasError = true;
|
||||
}
|
||||
else {
|
||||
this.errorMessage = "" ;
|
||||
this.hasError = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
<p> Votre inscription a bien été pris en compte </p>
|
||||
<button mat-button [mat-dialog-close]="true" cdkFocusInitial>Continuer</button>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PopupConfirmRegisterComponent } from './popup-confirm-register.component';
|
||||
|
||||
describe('PopupConfirmRegisterComponent', () => {
|
||||
let component: PopupConfirmRegisterComponent;
|
||||
let fixture: ComponentFixture<PopupConfirmRegisterComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PopupConfirmRegisterComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PopupConfirmRegisterComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-popup-confirm-register',
|
||||
templateUrl: './popup-confirm-register.component.html',
|
||||
styleUrls: ['./popup-confirm-register.component.scss']
|
||||
})
|
||||
export class PopupConfirmRegisterComponent
|
||||
{
|
||||
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
La page "admin/myProfil" contient:
|
||||
- les informations de l'utilisateur (composant "page-profil")
|
||||
- un bouton "modifier profil" pour modifier les informations de l'utilisateur (composant "popup-update-profil")
|
||||
|
||||
Cette page est la même que la page de la partie admin.
|
||||
|
||||
Ainsi, on a rangé cette page dans le dossier "common/components/profil".
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
<div>
|
||||
|
||||
<app-navbar pour="user"></app-navbar><br><br>
|
||||
|
||||
|
||||
<div style="text-align: center">
|
||||
<mat-form-field appearance="standard" class="filtre">
|
||||
<mat-label>Filter</mat-label>
|
||||
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Riri" #input>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
|
||||
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
|
||||
|
||||
<!-- Pseudo Column -->
|
||||
<ng-container matColumnDef="nickname">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Pseudo</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.nickname}}</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Email Column -->
|
||||
<ng-container matColumnDef="email">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Email</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.email}}</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Role Column -->
|
||||
<ng-container matColumnDef="role">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Rôle</th>
|
||||
<td mat-cell *matCellDef="let person">{{person.role}}</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
|
||||
|
||||
<mat-paginator [pageSizeOptions]="[10, 20, 50, 100]"
|
||||
showFirstLastButtons
|
||||
aria-label="Select page of periodic elements"
|
||||
class="mat-elevation-z8"></mat-paginator>
|
||||
|
||||
</div>
|
||||
<br><br>
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
mat-paginator, table {
|
||||
width: 80%;
|
||||
margin: auto 10%;
|
||||
}
|
||||
|
||||
.filtre {
|
||||
text-align: center;
|
||||
width: 33%;
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PageRegistryComponent } from './page-registry.component';
|
||||
|
||||
describe('RegistryComponent', () => {
|
||||
let component: PageRegistryComponent;
|
||||
let fixture: ComponentFixture<PageRegistryComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ PageRegistryComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PageRegistryComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
import {AfterViewInit, Component, ViewChild} from '@angular/core';
|
||||
import {MatTableDataSource} from "@angular/material/table";
|
||||
import {MatSort} from "@angular/material/sort";
|
||||
import {MatPaginator} from "@angular/material/paginator";
|
||||
import {MessageService} from "../../common/services/message/message.service";
|
||||
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-page-registry',
|
||||
templateUrl: './page-registry.component.html',
|
||||
styleUrls: ['./page-registry.component.scss']
|
||||
})
|
||||
export class PageRegistryComponent implements AfterViewInit
|
||||
{
|
||||
displayedColumns: string[] = [ "nickname", "email", "role" ];
|
||||
dataSource: MatTableDataSource<any> = new MatTableDataSource<any>();
|
||||
@ViewChild(MatSort) sort: MatSort;
|
||||
@ViewChild(MatPaginator) paginator: MatPaginator;
|
||||
|
||||
|
||||
constructor( private messageService: MessageService ) { }
|
||||
|
||||
|
||||
ngAfterViewInit(): void
|
||||
{
|
||||
this.messageService
|
||||
.get('users?order_by=nickname')
|
||||
.subscribe(retour => this.ngAfterViewInitCallback(retour), err => this.ngAfterViewInitCallback(err));
|
||||
}
|
||||
|
||||
|
||||
ngAfterViewInitCallback(retour: any): void
|
||||
{
|
||||
if(retour.status !== "success") {
|
||||
console.log(retour);
|
||||
}
|
||||
else {
|
||||
let tabPerson: { id: number, email: string, nickname: string, is_admin: boolean }[] = retour.data;
|
||||
tabPerson = tabPerson.map( person => {
|
||||
if(!person.is_admin) return Object.assign(person, {role: "utilisateur"});
|
||||
else return Object.assign(person, {role: "admin"});
|
||||
});
|
||||
this.dataSource = new MatTableDataSource(tabPerson);
|
||||
this.dataSource.sort = this.sort;
|
||||
this.dataSource.paginator = this.paginator;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
applyFilter(event: Event): void
|
||||
{
|
||||
const filterValue = (event.target as HTMLInputElement).value;
|
||||
this.dataSource.filter = filterValue.trim().toLowerCase();
|
||||
}
|
||||
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 197 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.7 KiB |
|
|
@ -1,4 +0,0 @@
|
|||
export const environment = {
|
||||
production: true,
|
||||
debutUrl: 'http://10.1.2.10:5000/api/'
|
||||
};
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
// This file can be replaced during build by using the `fileReplacements` array.
|
||||
// `ng build` replaces `environment.ts` with `environment.prod.ts`.
|
||||
// The list of file replacements can be found in `angular.json`.
|
||||
|
||||
|
||||
export const environment = {
|
||||
production: false,
|
||||
debutUrl: 'http://127.0.0.1:5000/api/'
|
||||
};
|
||||
|
||||
/*
|
||||
* For easier debugging in development mode, you can import the following file
|
||||
* to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
|
||||
*
|
||||
* This import should be commented out in production mode because it will have a negative impact
|
||||
* on performance if an error is thrown.
|
||||
*/
|
||||
// import 'zone.js/plugins/zone-error'; // Included with Angular CLI.
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 948 B |
|
|
@ -1,13 +0,0 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Frontend</title>
|
||||
<base href="/">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/x-icon" href="favicon.ico">
|
||||
</head>
|
||||
<body>
|
||||
<app-root></app-root>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import { enableProdMode } from '@angular/core';
|
||||
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
||||
|
||||
import { AppModule } from './app/app.module';
|
||||
import { environment } from './environments/environment';
|
||||
|
||||
if (environment.production) {
|
||||
enableProdMode();
|
||||
}
|
||||
|
||||
platformBrowserDynamic().bootstrapModule(AppModule)
|
||||
.catch(err => console.error(err));
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
/**
|
||||
* This file includes polyfills needed by Angular and is loaded before the app.
|
||||
* You can add your own extra polyfills to this file.
|
||||
*
|
||||
* This file is divided into 2 sections:
|
||||
* 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
|
||||
* 2. Application imports. Files imported after ZoneJS that should be loaded before your main
|
||||
* file.
|
||||
*
|
||||
* The current setup is for so-called "evergreen" browsers; the last versions of browsers that
|
||||
* automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
|
||||
* Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
|
||||
*
|
||||
* Learn more in https://angular.io/guide/browser-support
|
||||
*/
|
||||
|
||||
/***************************************************************************************************
|
||||
* BROWSER POLYFILLS
|
||||
*/
|
||||
|
||||
/**
|
||||
* By default, zone.js will patch all possible macroTask and DomEvents
|
||||
* user can disable parts of macroTask/DomEvents patch by setting following flags
|
||||
* because those flags need to be set before `zone.js` being loaded, and webpack
|
||||
* will put import in the top of bundle, so user need to create a separate file
|
||||
* in this directory (for example: zone-flags.ts), and put the following flags
|
||||
* into that file, and then add the following code before importing zone.js.
|
||||
* import './zone-flags';
|
||||
*
|
||||
* The flags allowed in zone-flags.ts are listed here.
|
||||
*
|
||||
* The following flags will work for all browsers.
|
||||
*
|
||||
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
|
||||
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
|
||||
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
|
||||
*
|
||||
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
|
||||
* with the following flag, it will bypass `zone.js` patch for IE/Edge
|
||||
*
|
||||
* (window as any).__Zone_enable_cross_context_check = true;
|
||||
*
|
||||
*/
|
||||
|
||||
/***************************************************************************************************
|
||||
* Zone JS is required by default for Angular itself.
|
||||
*/
|
||||
import 'zone.js'; // Included with Angular CLI.
|
||||
|
||||
|
||||
/***************************************************************************************************
|
||||
* APPLICATION IMPORTS
|
||||
*/
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
/* You can add global styles to this file, and also import other style files */
|
||||
html, body { height: 100%; }
|
||||
body { margin: 0; }
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
|
||||
|
||||
import 'zone.js/testing';
|
||||
import { getTestBed } from '@angular/core/testing';
|
||||
import {
|
||||
BrowserDynamicTestingModule,
|
||||
platformBrowserDynamicTesting
|
||||
} from '@angular/platform-browser-dynamic/testing';
|
||||
|
||||
declare const require: {
|
||||
context(path: string, deep?: boolean, filter?: RegExp): {
|
||||
keys(): string[];
|
||||
<T>(id: string): T;
|
||||
};
|
||||
};
|
||||
|
||||
// First, initialize the Angular testing environment.
|
||||
getTestBed().initTestEnvironment(
|
||||
BrowserDynamicTestingModule,
|
||||
platformBrowserDynamicTesting(),
|
||||
{ teardown: { destroyAfterEach: true }},
|
||||
);
|
||||
|
||||
// Then we find all the tests.
|
||||
const context = require.context('./', true, /\.spec\.ts$/);
|
||||
// And load the modules.
|
||||
context.keys().map(context);
|
||||
Loading…
Add table
Add a link
Reference in a new issue