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

amelioration de la partie admin

Browse source
This commit is contained in:
MiharyR 2021-11-21 22:16:48 +01:00
parent 7c24996e73
commit 2d66d182d8
10 changed files with 432 additions and 108 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,18 +1,80 @@
<div [class]="themeService.getClassTheme()">
<div class="myContainer">
<!-- Navbar -->
<app-navbar-admin></app-navbar-admin><br><br>
<!-- ---------------------------------------------------------------------------------- -->
<div style="text-align: center">
<input (keyup)="applyFilter($event)" placeholder="Filtre...">
<!-- filtre -->
<div class="filtersContainer mat-elevation-z8">
<!-- titre -->
<div style="font-weight: bold; margin-bottom: 10px;">
Filtre
</div>
<mat-divider></mat-divider>
<!-- filtre textuelle-->
<div style="margin: 10px 0px 20px 2%;">
<input class="textFilter" (keyup)="applyFilter($event)" placeholder="filtre...">
</div>
<!-- visible + tags + période -->
<div class="row myRow">
<!-- visible -->
<div class="col-2">
<mat-checkbox [(ngModel)]="visible" (change)="onFilter()">visible</mat-checkbox><br>
<mat-checkbox [(ngModel)]="noVisible" (change)="onFilter()">non visible</mat-checkbox>
</div>
<!-- tags -->
<div class="col-4">
<mat-form-field appearance="fill">
<mat-label>Tags</mat-label>
<mat-select [formControl]="formControlTags" multiple>
<mat-select-trigger>
{{formControlTags.value ? formControlTags.value[0] : ''}}
<span *ngIf="formControlTags.value?.length > 1">
(+{{formControlTags.value.length - 1}} {{formControlTags.value?.length === 2 ? 'autre' : 'autres'}})
</span>
</mat-select-trigger>
<mat-option *ngFor="let topping of allTags" [value]="topping">{{topping}}</mat-option>
</mat-select>
</mat-form-field>
<button mat-icon-button (click)="onFilter()">
<mat-icon>keyboard_tab</mat-icon>
</button>
</div>
<!-- période -->
<div class="col-6" style="text-align: right;">
Période de création: &nbsp;
<mat-form-field appearance="fill" style="width: 140px; font-size: small;">
<mat-label>Date de début</mat-label>
<input matInput type="date"
style="font-size: small; width: 140px;"
[ngModel] ="startDate | date:'yyyy-MM-dd'"
(ngModelChange)="onNewStartDate($event); onFilter();">
</mat-form-field>
&nbsp; - &nbsp;
<mat-form-field appearance="fill" style="width: 140px; font-size: small;">
<mat-label>Date de fin</mat-label>
<input matInput type="date"
style="font-size: small; width: 140px;"
[ngModel] ="endDate | date:'yyyy-MM-dd'"
(ngModelChange)="onNewEndDate($event); onFilter();">
</mat-form-field>
</div>
</div>
</div>
<br>
<!-- ---------------------------------------------------------------------------------- -->
<!-- table -->
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
<!-- Title Column -->
@ -82,9 +144,11 @@
<button mat-icon-button (click)="onVisualizeImages(advert)">
<mat-icon> insert_photo</mat-icon>
</button>
<!--
<button mat-icon-button (click)="onVisualizeInfo(advert)">
<mat-icon>aspect_ratio</mat-icon>
</button>
-->
<button mat-icon-button (click)="onDelete(advert)">
<mat-icon>delete</mat-icon>
</button>

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

@ -5,6 +5,25 @@
font-size: small;
}
// ----------------------------------------------------------
.filtersContainer {
width: 70%;
background-color: white;
padding: 10px 10px 10px 10px;
margin: 20px 3% 20px 3%
}
.myRow {
margin-left: 1%;
}
.textFilter {
width: 50%;
font-size: medium;
border-radius: 5px;
}
// ----------------------------------------------------------
@ -29,3 +48,23 @@ input {
font-size: large;
border-radius: 5px;
}
// -------------------------------------------------------------------------
// 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 {
border: solid 1px black !important;
background-color: white !important;
}

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

@ -10,6 +10,8 @@ import {PopupVisualizeAdAdminComponent} from "../popup-visualize-ad-admin/popup-
import {PopupDeleteAdAdminComponent} from "../popup-delete-ad-admin/popup-delete-ad-admin.component";
import {PopupVisualizeImagesAdminComponent} from "../popup-visualize-images-admin/popup-visualize-images-admin.component";
import {FictitiousAdvertsService} from "../../../utils/services/fictitiousDatas/fictitiousAdverts/fictitious-adverts.service";
import {FormControl} from "@angular/forms";
import {FictitiousUtilsService} from "../../../utils/services/fictitiousDatas/fictitiousUtils/fictitious-utils.service";
@ -20,14 +22,23 @@ import {FictitiousAdvertsService} from "../../../utils/services/fictitiousDatas/
})
export class PageAdListAdminComponent implements AfterViewInit
{
tabAdvert: Advert[];
displayedColumns: string[] = [ 'title', 'advertiser', 'tags', 'createdAt', 'updatedAt', 'views', 'isVisible', 'actions' ];
dataSource ;
@ViewChild(MatSort) sort: MatSort;
@ViewChild(MatPaginator) paginator: MatPaginator;
visible: boolean = true;
noVisible: boolean = true;
startDate: Date = null;
endDate: Date = null;
formControlTags = new FormControl();
allTags: string[] = [];
constructor( public themeService: ThemeService,
private fictitiousAdvertsService: FictitiousAdvertsService,
private fictitiousUtilsService: FictitiousUtilsService,
public dialog: MatDialog,
private snackBar: MatSnackBar ) { }
@ -35,11 +46,12 @@ export class PageAdListAdminComponent implements AfterViewInit
ngAfterViewInit(): void
{
// --- FAUX CODE ---
const tabAdvert = this.fictitiousAdvertsService.getTabAdvert(8);
this.dataSource = new MatTableDataSource<Advert>(tabAdvert);
this.tabAdvert = this.fictitiousAdvertsService.getTabAdvert(8);
this.dataSource = new MatTableDataSource<Advert>(this.tabAdvert);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
this.dataSource = this.dataSource;
this.allTags = this.fictitiousUtilsService.getTags();
}
@ -107,4 +119,59 @@ export class PageAdListAdminComponent implements AfterViewInit
});
}
onFilter(): void
{
console.log("b:" + this.formControlTags.value);
this.dataSource.data = [];
for(let advert of this.tabAdvert)
{
let valide: boolean = true;
if(advert.isVisible && this.visible) valide = true;
else if((!advert.isVisible) && this.noVisible) valide = true;
else valide = false;
if(valide)
{
if ((advert.createdAt === null) && (this.startDate !== null)) valide = false;
else if ((advert.createdAt === null) && (this.endDate !== null)) valide = false;
else if (this.startDate !== null)
{
if(this.startDate.getTime() > advert.createdAt.getTime()) valide = false;
else if (this.endDate !== null)
{
if(this.endDate.getTime() < advert.createdAt.getTime()) valide = false;
}
}
}
if(valide) {
if(this.formControlTags.value !== null) {
for (let tag of this.formControlTags.value) {
if (advert.tags.indexOf(tag) === -1) {
valide = false;
break;
}
}
}
}
if(valide) this.dataSource.data.push(advert);
}
this.dataSource = new MatTableDataSource(this.dataSource.data);
this.dataSource.sort = this.sort;
this.dataSource.paginator = this.paginator;
}
onNewStartDate(event): void {
this.startDate = new Date(event);
}
onNewEndDate(event): void {
this.endDate = new Date(event);
}
}