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

commencement de la partie admin

Browse source
This commit is contained in:
MiharyR 2021-11-13 13:35:08 +01:00
parent 11472d0045
commit de939b47f1
67 changed files with 1233 additions and 554 deletions
Download patch file Download diff file Expand all files Collapse all files

112
src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.html Normal file
View file

@ -0,0 +1,112 @@
<div [class]="themeService.getClassTheme()">
<div class="myContainer">
<app-navbar-admin></app-navbar-admin><br><br>
<!-- ---------------------------------------------------------------------------------- -->
<div style="text-align: center">
<input (keyup)="applyFilter($event)" placeholder="Filtre...">
</div>
<br>
<!-- ---------------------------------------------------------------------------------- -->
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
<!-- Title Column -->
<ng-container matColumnDef="title">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Titre </th>
<td mat-cell *matCellDef="let advert">
{{advert.title}}
</td>
</ng-container>
<!-- Advertiser Column -->
<ng-container matColumnDef="advertiser">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Annonceur </th>
<td mat-cell *matCellDef="let advert">
{{advert.advertiser}}
</td>
</ng-container>
<!-- Tags Column -->
<ng-container matColumnDef="tags">
<th mat-header-cell *matHeaderCellDef> Tags </th>
<td mat-cell *matCellDef="let advert">
<span *ngFor="let tag of advert.tags; let isLast = last;">
<span *ngIf="!isLast"> {{tag}}, </span>
<span *ngIf="isLast"> {{tag}} </span>
</span>
</td>
</ng-container>
<!-- CreatedAt Column -->
<ng-container matColumnDef="createdAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Date de création </th>
<td mat-cell *matCellDef="let advert">
{{ advert.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</td>
</ng-container>
<!-- UpdatedAt Column -->
<ng-container matColumnDef="updatedAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Dernière modification </th>
<td mat-cell *matCellDef="let advert">
{{ advert.updatedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</td>
</ng-container>
<!-- Views Column -->
<ng-container matColumnDef="views">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Vues </th>
<td mat-cell *matCellDef="let advert">
{{advert.views}}
</td>
</ng-container>
<!-- IsVisible Column -->
<ng-container matColumnDef="isVisible">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Visible </th>
<td mat-cell *matCellDef="let advert">
<span *ngIf="advert.isVisible"> <mat-icon>check</mat-icon> </span>
<span *ngIf="!advert.isVisible"></span>
</td>
</ng-container>
<!-- Delete Column -->
<ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef> Supprimer </th>
<td mat-cell *matCellDef="let advert">
<button mat-icon-button (click)="onDelete(advert)">
<mat-icon>delete</mat-icon>
</button>
</td>
</ng-container>
<!-- Visualisation Column -->
<ng-container matColumnDef="visualisation">
<th mat-header-cell *matHeaderCellDef> Visualisation </th>
<td mat-cell *matCellDef="let advert">
<button mat-icon-button (click)="onVisualize(advert)">
<mat-icon>aspect_ratio</mat-icon>
</button>
</td>
</ng-container>
<!-- Directives -->
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4"> Aucune vidéo ne correspond au filtre: "{{input.value}}" </td>
</tr>
</table>
<div style="width: 94%; margin: auto auto">
<mat-paginator [pageSizeOptions]="[10, 20, 50, 100]" showFirstLastButtons aria-label="Select page of periodic elements"></mat-paginator>
</div>
<br><br>
</div>
</div>

31
src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.scss Normal file
View file

@ -0,0 +1,31 @@
.myContainer {
max-width: 100vw;
height: 100vh;
overflow-x: hidden;
font-size: small;
}
// ----------------------------------------------------------
table {
margin: 0 auto;
width: 94%;
font-size: small;
}
.darkTheme table { border: solid 2px white; }
th.mat-sort-header-sorted {
color: black;
}
td {
font-size: small;
}
input {
width: 30%;
font-size: large;
border-radius: 5px;
}

25
src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.spec.ts Normal file
View file

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

91
src/app/admin/adList/page-ad-list-admin/page-ad-list-admin.component.ts Normal file
View file

@ -0,0 +1,91 @@
import {AfterViewInit, Component, ViewChild} from '@angular/core';
import {MatSort} from "@angular/material/sort";
import {MatPaginator} from "@angular/material/paginator";
import {ThemeService} from "../../../utils/services/theme/theme.service";
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
import {MatDialog} from "@angular/material/dialog";
import {MatSnackBar} from "@angular/material/snack-bar";
import {MatTableDataSource} from "@angular/material/table";
import {Advert} from "../../../utils/interfaces/advert";
import {PopupVisualizeAdAdminComponent} from "../popup-visualize-ad-admin/popup-visualize-ad-admin.component";
import {PopupDeleteAdAdminComponent} from "../popup-delete-ad-admin/popup-delete-ad-admin.component";
@Component({
selector: 'app-page-ad-list-admin',
templateUrl: './page-ad-list-admin.component.html',
styleUrls: ['./page-ad-list-admin.component.scss']
})
export class PageAdListAdminComponent implements AfterViewInit
{
displayedColumns: string[] = [ 'title', 'advertiser', 'tags', 'createdAt', 'updatedAt', 'views', 'isVisible', 'delete', 'visualisation' ];
dataSource ;
@ViewChild(MatSort) sort: MatSort;
@ViewChild(MatPaginator) paginator: MatPaginator;
constructor( public themeService: ThemeService,
private fictitiousDatasService: FictitiousDatasService,
public dialog: MatDialog,
private snackBar: MatSnackBar ) { }
ngAfterViewInit(): void
{
// --- FAUX CODE ---
const tabAdvert = this.fictitiousDatasService.getTabAdvert(8);
this.dataSource = new MatTableDataSource<Advert>(tabAdvert);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
this.dataSource = this.dataSource;
}
applyFilter(event: Event): void
{
const filterValue = (event.target as HTMLInputElement).value;
this.dataSource.filter = filterValue.trim().toLowerCase();
}
onVisualize(advert: Advert): void
{
const config = {
width: '50%',
data: { advert: advert }
};
this.dialog
.open(PopupVisualizeAdAdminComponent, config)
.afterClosed()
.subscribe(retour => {});
}
onDelete(advert: Advert): void
{
const config = {
data: { advert: advert }
};
this.dialog
.open(PopupDeleteAdAdminComponent, config)
.afterClosed()
.subscribe( retour => {
const config = { duration: 1000, panelClass: "custom-class" };
let message = "" ;
if((retour === undefined) || (retour === null)) {
message = "Opération annulée" ;
}
else {
const index = this.dataSource.data.findIndex( elt => (elt._id === advert._id));
this.dataSource.data.splice(index, 1);
this.dataSource.data = this.dataSource.data;
this.dataSource = this.dataSource;
message = "L'annonce a bien été supprimée ✔" ;
}
this.snackBar.open( message, "", config);
});
}
}

8
src/app/admin/adList/popup-delete-ad-admin/popup-delete-ad-admin.component.html Normal file
View file

@ -0,0 +1,8 @@
<mat-dialog-content class="mat-typography">
Êtes-vous sûr de vouloir supprimer l'annonce <i>{{advert.title}}</i> ?
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button (click)="dialogRef.close();">Annuler</button>
<button mat-button (click)="onValidate()" cdkFocusInitial>Valider</button>
</mat-dialog-actions>

0
src/app/admin/adList/popup-delete-ad-admin/popup-delete-ad-admin.component.scss Normal file
View file

25
src/app/admin/adList/popup-delete-ad-admin/popup-delete-ad-admin.component.spec.ts Normal file
View file

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

49
src/app/admin/adList/popup-delete-ad-admin/popup-delete-ad-admin.component.ts Normal file
View file

@ -0,0 +1,49 @@
import {Component, Inject, OnInit} from '@angular/core';
import {Advert} from "../../../utils/interfaces/advert";
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
import {MessageService} from "../../../utils/services/message/message.service";
@Component({
selector: 'app-popup-delete-ad-admin',
templateUrl: './popup-delete-ad-admin.component.html',
styleUrls: ['./popup-delete-ad-admin.component.scss']
})
export class PopupDeleteAdAdminComponent implements OnInit
{
advert: Advert;
constructor( public dialogRef: MatDialogRef<PopupDeleteAdAdminComponent>,
@Inject(MAT_DIALOG_DATA) public data,
private messageService: MessageService) { }
ngOnInit(): void
{
this.advert = this.data.advert;
}
onValidate(): void
{
// --- FAUX CODE ---
this.dialogRef.close(true);
// --- VRAI CODE ---
/*
this.messageService
.sendMessage("advertiser/delete/ad", {"advert": this.advert})
.subscribe( retour => {
if(retour.status === "error") {
console.log(retour);
this.dialogRef.close();
}
else {
this.dialogRef.close(true);
}
});
*/
}
}

79
src/app/admin/adList/popup-visualize-ad-admin/popup-visualize-ad-admin.component.html Normal file
View file

@ -0,0 +1,79 @@
<div [class]="themeService.getClassTheme()">
<h1 mat-dialog-title>{{advert.title}}</h1>
<!-- ----------------------------------------------------------------------------------------------------------------- -->
<mat-divider></mat-divider>
<mat-dialog-content>
<!-- Advertiser -->
<div class="row myRow">
<div class="col-6 myLabel"> Annonceur: </div>
<div class="col-6 myValue"> {{advert.advertiser}} </div>
</div>
<!-- Images -->
<div class="row myRow">
<div class="col-6 myLabel" style="padding-top: 10px"> Images: </div>
<div class="col-6">
<button mat-icon-button (click)="onVisualizeImages(advert.images)">
<mat-icon>aspect_ratio</mat-icon>
</button>
</div>
</div>
<!-- Tags -->
<div class="row myRow">
<div class="col-6 myLabel"> Tags: </div>
<div class="col-6 myValue" style="border-left: solid 1px #e6e6e6">
<div *ngFor="let tag of advert.tags"> • {{tag}} </div>
</div>
</div>
<!-- Comment -->
<div class="row myRow">
<div class="col-6 myLabel"> Commentaire: </div>
<div class="col-6 myValue"> {{advert.comment}} </div>
</div>
<!-- Views -->
<div class="row myRow">
<label class="col-6 myLabel"> Vues: </label>
<div class="col-6 myValue"> {{advert.views}} </div>
</div>
<!-- Created at -->
<div class="row myRow">
<label class="col-6 myLabel"> Date de création: </label>
<div class="col-6 myValue">
{{ advert.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</div>
</div>
<!-- Last updtade -->
<div class="row myRow">
<label class="col-6 myLabel"> Date de dernière modification: </label>
<div class="col-6 myValue">
{{ advert.updatedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</div>
</div>
<!-- IsVisible -->
<div class="row myRow">
<label class="col-6 myLabel"> Visibilité: </label>
<div class="col-6 myValue">
<mat-icon *ngIf="advert.isVisible">checked</mat-icon>
<mat-icon *ngIf="!advert.isVisible">close</mat-icon>
</div>
</div>
</mat-dialog-content>
<!-- ----------------------------------------------------------------------------------------------------------------- -->
<mat-dialog-actions align="end">
<button mat-button (click)="dialogRef.close()">Fermer</button>
</mat-dialog-actions>
</div>

28
src/app/admin/adList/popup-visualize-ad-admin/popup-visualize-ad-admin.component.scss Normal file
View file

@ -0,0 +1,28 @@
.lightTheme, .darkTheme {
background-image: none;
}
h1 {
text-align: center;
font-size: xx-large;
}
.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;
}

25
src/app/admin/adList/popup-visualize-ad-admin/popup-visualize-ad-admin.component.spec.ts Normal file
View file

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

48
src/app/admin/adList/popup-visualize-ad-admin/popup-visualize-ad-admin.component.ts Normal file
View file

@ -0,0 +1,48 @@
import {Component, Inject, OnInit} from '@angular/core';
import {Advert} from "../../../utils/interfaces/advert";
import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from "@angular/material/dialog";
import {ThemeService} from "../../../utils/services/theme/theme.service";
import {PopupVisualizeImagesAdminComponent} from "../popup-visualize-images-admin/popup-visualize-images-admin.component";
@Component({
selector: 'app-popup-visualize-ad-admin',
templateUrl: './popup-visualize-ad-admin.component.html',
styleUrls: ['./popup-visualize-ad-admin.component.scss']
})
export class PopupVisualizeAdAdminComponent implements OnInit
{
advert: Advert;
constructor( public dialogRef: MatDialogRef<PopupVisualizeAdAdminComponent>,
@Inject(MAT_DIALOG_DATA) public data,
public themeService: ThemeService,
public dialog: MatDialog ) { }
ngOnInit(): void
{
this.advert = this.data.advert;
}
onVisualizeImages(images: any[])
{
const config = {
width: '400px',
height: '950px',
data: {
images: images,
width: 300,
height: 800,
}
};
this.dialog
.open(PopupVisualizeImagesAdminComponent, config)
.afterClosed()
.subscribe(retour => {});
}
}

13
src/app/admin/adList/popup-visualize-images-admin/popup-visualize-images-admin.component.html Normal file
View file

@ -0,0 +1,13 @@
<div mat-dialog-title class="dialog-title">
<h2></h2>
<button mat-icon-button aria-label="close dialog" mat-dialog-close>
<mat-icon>close</mat-icon>
</button>
</div>
<div style="text-align: center; justify-content: center">
<carousel [images]="tabImages"
cellsToShow="1"
[height]="height"
[width]="width"></carousel>
</div>

14
src/app/admin/adList/popup-visualize-images-admin/popup-visualize-images-admin.component.scss Normal file
View file

@ -0,0 +1,14 @@
carousel {
width: 100%;
margin: 0 auto;
text-align: center;
justify-content: center
}
.dialog-title {
display: flex;
justify-content: space-between;
align-items: center;
}

25
src/app/admin/adList/popup-visualize-images-admin/popup-visualize-images-admin.component.spec.ts Normal file
View file

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

35
src/app/admin/adList/popup-visualize-images-admin/popup-visualize-images-admin.component.ts Normal file
View file

@ -0,0 +1,35 @@
import {Component, Inject, OnInit} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
@Component({
selector: 'app-popup-visualize-images-admin',
templateUrl: './popup-visualize-images-admin.component.html',
styleUrls: ['./popup-visualize-images-admin.component.scss']
})
export class PopupVisualizeImagesAdminComponent implements OnInit
{
tabImages = [];
width: number = 0;
height: number = 0;
constructor( public dialogRef: MatDialogRef<PopupVisualizeImagesAdminComponent>,
@Inject(MAT_DIALOG_DATA) public data ) { }
ngOnInit(): void
{
this.width = this.data.width;
this.height = this.data.height;
for(let couple of this.data.images)
{
const elt = { path: "assets/pub/"+couple.url };
this.tabImages.push(elt);
}
console.log(this.tabImages);
}
}

137
src/app/admin/userList/page-user-list/page-user-list.component.html Normal file
View file

@ -0,0 +1,137 @@
<div [class]="themeService.getClassTheme()">
<div class="myContainer">
<!-- Navbar -->
<app-navbar-admin></app-navbar-admin><br><br>
<!-- Filtre -->
<div style="text-align: center">
<input (keyup)="applyFilter($event)" placeholder="Filtre: saisir la valeur d'une colonne">
</div>
<div class="choixRoleEtbtnAjouerAdmin">
<!-- Choix role -->
<div class="matRadioGroupContainer">
<mat-radio-group [(ngModel)]="roleName">
<mat-radio-button value="user" (click)="onChangeRoleSelected('user')">
Utilisateur
</mat-radio-button><br>
<mat-radio-button value="advertiser" (click)="onChangeRoleSelected('advertiser')">
Annonceur
</mat-radio-button><br>
<mat-radio-button value="admin" (click)="onChangeRoleSelected('admin')">
Admin
</mat-radio-button>
</mat-radio-group>
</div>
<div class="btnAjouterContainer">
<button mat-button class="btnAjouter" (click)="onAddAdmin()">
<mat-icon>add_circle</mat-icon> Ajouter un admin
</button>
</div>
</div>
<!-- Table -->
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
<!-- Login Column -->
<ng-container matColumnDef="login">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Login </th>
<td mat-cell *matCellDef="let user">
{{user.login}}
</td>
</ng-container>
<!-- Mail Column -->
<ng-container matColumnDef="mail">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Mail </th>
<td mat-cell *matCellDef="let user">
{{user.mail}}
</td>
</ng-container>
<!-- DateOfBirth Column -->
<ng-container matColumnDef="dateOfBirth">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Date de naissance </th>
<td mat-cell *matCellDef="let user">
{{ user.dateOfBirth | date:'dd/LL/YYYY à HH:mm:ss' }}
</td>
</ng-container>
<!-- Interests Column -->
<ng-container matColumnDef="interests">
<th mat-header-cell *matHeaderCellDef> Centre d'intérêts </th>
<td mat-cell *matCellDef="let user">
<span *ngFor="let interest of user.interests; let isLast = last;">
<span *ngIf="!isLast"> {{interest}}, </span>
<span *ngIf="isLast"> {{interest}} </span>
</span>
</td>
</ng-container>
<!-- CreatedAt Column -->
<ng-container matColumnDef="createdAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Date de création </th>
<td mat-cell *matCellDef="let user">
{{ user.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</td>
</ng-container>
<!-- UpdatedAt Column -->
<ng-container matColumnDef="updatedAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Dernière modification </th>
<td mat-cell *matCellDef="let user">
{{ user.updatedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
</td>
</ng-container>
<!-- IsAccepted Column -->
<ng-container matColumnDef="isAccepted">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Activé </th>
<td mat-cell *matCellDef="let user">
<span *ngIf="user.isAccepted"> <mat-icon>check</mat-icon> </span>
<span *ngIf="!user.isAccepted"></span>
</td>
</ng-container>
<!-- Delete Column -->
<ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef> Supprimer </th>
<td mat-cell *matCellDef="let user">
<button mat-icon-button (click)="onDelete(user)">
<mat-icon>delete</mat-icon>
</button>
</td>
</ng-container>
<!-- Visualisation Column -->
<ng-container matColumnDef="visualisation">
<th mat-header-cell *matHeaderCellDef> Visualisation </th>
<td mat-cell *matCellDef="let user">
<button mat-icon-button (click)="onVisualize(user)">
<mat-icon>aspect_ratio</mat-icon>
</button>
</td>
</ng-container>
<!-- Directives -->
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
<tr class="mat-row" *matNoDataRow>
<td class="mat-cell" colspan="4"> Aucune vidéo ne correspond au filtre: "{{input.value}}" </td>
</tr>
</table>
<div style="width: 94%; margin: auto auto">
<mat-paginator [pageSizeOptions]="[10, 20, 50, 100]" showFirstLastButtons aria-label="Select page of periodic elements"></mat-paginator>
</div>
<br><br>
</div>
</div>

67
src/app/admin/userList/page-user-list/page-user-list.component.scss Normal file
View file

@ -0,0 +1,67 @@
.myContainer {
max-width: 100vw;
height: 100vh;
overflow-x: hidden;
font-size: small;
}
// ----------------------------------------------------------
.matRadioGroupContainer {
float:left;
background-color: white;
width: 15%;
margin-left: 3%;
padding: 10px 10px 10px 10px;
border-bottom: 1px solid #dcdcdc;
}
.btnAjouterContainer {
float:left;
margin-left: 67%;
padding-top: 20px;
}
.btnAjouter {
background-color: white;
border: solid 1px black;
}
// ----------------------------------------------------------
input {
width: 30%;
font-size: large;
border-radius: 5px;
}
// ----------------------------------------------------------
table {
margin: 0 auto;
width: 94%;
font-size: small;
}
.darkTheme table { border: solid 2px white; }
th.mat-sort-header-sorted {
color: black;
}
td {
font-size: small;
}
// -------------------------------------------------------------------------
::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;
}

25
src/app/admin/userList/page-user-list/page-user-list.component.spec.ts Normal file
View file

@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { PageUserListComponent } from './page-user-list.component';
describe('PageUserListComponent', () => {
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();
});
});

127
src/app/admin/userList/page-user-list/page-user-list.component.ts Normal file
View file

@ -0,0 +1,127 @@
import {AfterViewInit, Component, ViewChild} from '@angular/core';
import {MatSort} from "@angular/material/sort";
import {MatPaginator} from "@angular/material/paginator";
import {ThemeService} from "../../../utils/services/theme/theme.service";
import {FictitiousDatasService} from "../../../utils/services/fictitiousDatas/fictitious-datas.service";
import {MatDialog} from "@angular/material/dialog";
import {MatSnackBar} from "@angular/material/snack-bar";
import {MatTableDataSource} from "@angular/material/table";
import {User} from "../../../utils/interfaces/user";
import {PopupVisualizeUserComponent} from "../popup-visualize-user/popup-visualize-user.component";
import {PopupDeleteUserComponent} from "../popup-delete-user/popup-delete-user.component";
@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[];
displayedColumnsUser: string[] = [ 'login', 'mail', 'dateOfBirth', 'interests', 'createdAt', 'updatedAt', 'delete', 'visualisation' ];
displayedColumnsAdvertiser: string[] = [ 'login', 'mail', 'createdAt', 'updatedAt', 'isAccepted', 'delete', 'visualisation' ];
displayedColumnsAdmin: string[] = [ 'login', 'mail', 'createdAt', 'updatedAt', 'delete', 'visualisation' ];
tabUser: User[] = [];
tabAdvertiser: User[] = [];
tabAdmin: User[] = [];
roleName: string = "user" ;
dataSource ;
@ViewChild(MatSort) sort: MatSort;
@ViewChild(MatPaginator) paginator: MatPaginator;
constructor( public themeService: ThemeService,
private fictitiousDatasService: FictitiousDatasService,
public dialog: MatDialog,
private snackBar: MatSnackBar ) { }
ngAfterViewInit(): void
{
// --- FAUX CODE ---
this.tabUser = this.fictitiousDatasService.getTabUser(32);
this.tabAdvertiser = this.fictitiousDatasService.getTabAdvertiser(8);
this.tabAdmin = this.fictitiousDatasService.getTabAdmin(4);
this.displayedColumns = this.displayedColumnsUser;
this.dataSource = new MatTableDataSource<User>(this.tabUser);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
this.dataSource = this.dataSource;
}
onChangeRoleSelected(roleName: string): void
{
if(roleName === "user") {
this.displayedColumns = this.displayedColumnsUser;
this.dataSource.data = this.tabUser;
}
else if(roleName === "advertiser") {
this.displayedColumns = this.displayedColumnsAdvertiser;
this.dataSource.data = this.tabAdvertiser;
}
else if(roleName === "admin") {
this.displayedColumns = this.displayedColumnsAdmin;
this.dataSource.data = this.tabAdmin;
}
this.dataSource = this.dataSource;
}
applyFilter(event: Event): void
{
const filterValue = (event.target as HTMLInputElement).value;
this.dataSource.filter = filterValue.trim().toLowerCase();
}
onVisualize(user: User): void
{
const config = {
width: '50%',
data: { user: user }
};
this.dialog
.open(PopupVisualizeUserComponent, config)
.afterClosed()
.subscribe(retour => {});
}
onDelete(user: User): void
{
const config = {
data: { user: user }
};
this.dialog
.open(PopupDeleteUserComponent, config)
.afterClosed()
.subscribe( retour => {
const config = { duration: 1000, panelClass: "custom-class" };
let message = "" ;
if((retour === undefined) || (retour === null)) {
message = "Opération annulée" ;
}
else {
const index = this.dataSource.data.findIndex( elt => (elt._id === user._id));
this.dataSource.data.splice(index, 1);
this.dataSource.data = this.dataSource.data;
this.dataSource = this.dataSource;
message = "L'annonce a bien été supprimée ✔" ;
}
this.snackBar.open( message, "", config);
});
}
onAddAdmin(): void
{
}
}

1
src/app/admin/userList/popup-delete-user/popup-delete-user.component.html Normal file
View file

@ -0,0 +1 @@
<p>popup-delete-user works!</p>

0
src/app/admin/userList/popup-delete-user/popup-delete-user.component.scss Normal file
View file

25
src/app/admin/userList/popup-delete-user/popup-delete-user.component.spec.ts Normal file
View file

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

15
src/app/admin/userList/popup-delete-user/popup-delete-user.component.ts Normal file
View file

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-popup-delete-user',
templateUrl: './popup-delete-user.component.html',
styleUrls: ['./popup-delete-user.component.scss']
})
export class PopupDeleteUserComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

1
src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.html Normal file
View file

@ -0,0 +1 @@
<p>popup-visualize-user works!</p>

0
src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.scss Normal file
View file

25
src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.spec.ts Normal file
View file

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

15
src/app/admin/userList/popup-visualize-user/popup-visualize-user.component.ts Normal file
View file

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-popup-visualize-user',
templateUrl: './popup-visualize-user.component.html',
styleUrls: ['./popup-visualize-user.component.scss']
})
export class PopupVisualizeUserComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}