diff --git a/api/server.js b/api/server.js
index 43c5b108c566c6204a2c079437caef6942178907..e85ef232a7d69299e0ce3c9ceffd20b3d44a868a 100644
--- a/api/server.js
+++ b/api/server.js
@@ -11,7 +11,6 @@ server.use(middlewares);
// Add custom routes before JSON Server router
server.get('/structures/count', (req, res) => {
- console.log('ok');
let structureCountTab = [];
// Compétences de base
structureCountTab.push({ id: 260, count: 3 });
@@ -62,9 +61,7 @@ server.get('/structures/count', (req, res) => {
structureCountTab.push({ id: 164, count: 1 });
structureCountTab.push({ id: 163, count: 1 });
structureCountTab.push({ id: 162, count: 2 });
- return res.status(200).jsonp({
- structureCountTab,
- });
+ return res.status(200).jsonp(structureCountTab);
});
// Use default router
diff --git a/src/app/structure-list/components/modal-filter/modal-filter.component.scss b/src/app/structure-list/components/modal-filter/modal-filter.component.scss
index 5275c294543a0743a845ac0022090821f5160188..ccb052e16e72530dad866f449d4f9807a3bcced1 100644
--- a/src/app/structure-list/components/modal-filter/modal-filter.component.scss
+++ b/src/app/structure-list/components/modal-filter/modal-filter.component.scss
@@ -5,14 +5,14 @@
@import '../../../../assets/scss/shapes';
@import '../../../../assets/scss/buttons';
-.modalformations {
+.modaltraining {
@media #{$desktop} {
margin-left: 0;
}
margin-left: 196px;
}
-.modalplusFiltres {
+.modalmoreFilters {
@media #{$desktop} {
margin-left: 0;
}
diff --git a/src/app/structure-list/components/search/search.component.html b/src/app/structure-list/components/search/search.component.html
index 44fa60bd243c9e040eb1420b1df8335bb2135bc8..9de95de2431a81f9a7bc1da82ed11a7a77416087 100644
--- a/src/app/structure-list/components/search/search.component.html
+++ b/src/app/structure-list/components/search/search.component.html
@@ -14,7 +14,7 @@
<div class="icon close" (click)="clearInput()">
<div class="ico-close grey"></div>
</div>
- <div class="separator"></div>
+ <span class="separator"></span>
<div class="icon pin">
<div class="ico-pin-search blue"></div>
</div>
@@ -28,8 +28,8 @@
<div class="btnSection" fxLayout="row" fxLayoutAlign="space-between center">
<button
type="button"
- [ngClass]="{ selected: modalTypeOpened === modalType[0] }"
- (click)="openModal(this.modalType[0])"
+ [ngClass]="{ selected: modalTypeOpened === TypeModal[0] }"
+ (click)="openModal(TypeModal[0])"
fxLayout="row"
fxLayoutAlign="space-between center"
>
@@ -38,8 +38,8 @@
</button>
<button
type="button"
- [ngClass]="{ selected: modalTypeOpened === modalType[1] }"
- (click)="openModal(this.modalType[1])"
+ [ngClass]="{ selected: modalTypeOpened === TypeModal[1] }"
+ (click)="openModal(TypeModal[1])"
fxLayout="row"
fxLayoutAlign="space-between center"
>
@@ -48,8 +48,8 @@
</button>
<button
type="button"
- [ngClass]="{ selected: modalTypeOpened === modalType[2] }"
- (click)="openModal(this.modalType[2])"
+ [ngClass]="{ selected: modalTypeOpened === TypeModal[2] }"
+ (click)="openModal(TypeModal[2])"
fxLayout="row"
fxLayoutAlign="space-between center"
>
diff --git a/src/app/structure-list/components/search/search.component.ts b/src/app/structure-list/components/search/search.component.ts
index d95cf649b57f013d5eb3b9b43cebac5dfee6d867..1fb011826031bd219af6e65d190468901b0f277f 100644
--- a/src/app/structure-list/components/search/search.component.ts
+++ b/src/app/structure-list/components/search/search.component.ts
@@ -1,8 +1,11 @@
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
+import { forkJoin } from 'rxjs';
+import { TypeModal } from '../../enum/typeModal.enum';
import { Category } from '../../models/category.model';
import { Filter } from '../../models/filter.model';
import { Module } from '../../models/module.model';
+import { StructureCounter } from '../../models/structureCounter.model';
import { SearchService } from '../../services/search.service';
@Component({
@@ -20,24 +23,26 @@ export class SearchComponent implements OnInit {
@Output() searchEvent = new EventEmitter();
// Form search input
- searchForm: FormGroup;
-
- // Button variable
- modalType: string[] = ['accompagnement', 'formations', 'plusFiltres'];
-
+ private searchForm: FormGroup;
// Modal variable
- categories: Category[];
- modalTypeOpened: string;
-
+ private categories: Category[];
+ private modalTypeOpened: string;
// Checkbox variable
- checkedModulesFilter: Module[];
+ private checkedModulesFilter: Module[];
ngOnInit(): void {
// Will store the different categories
this.categories = [];
this.checkedModulesFilter = new Array();
+ console.log(TypeModal[0]);
}
+
+ // Accessor to template angular.
+ public get TypeModal(): typeof TypeModal {
+ return TypeModal;
+ }
+
// Clear input search
public clearInput(): void {
this.searchForm.reset();
@@ -110,22 +115,22 @@ export class SearchComponent implements OnInit {
module.push(category);
}
- // Fake data
+ // Get the correct list of checkbox/modules depending on the type of modal.
private fakeData(option: string): void {
- if (option === this.modalType[0]) {
+ if (option === TypeModal[0]) {
this.mockService(this.categories, 'Accompagnement des démarches', { name: 'CAF', id: 5 }, 7);
- } else if (option === this.modalType[1]) {
- this.searchService.getCategoriesFormations().subscribe((categories: Category[]) => {
- this.searchService
- .getFakeCounterModule()
- .subscribe((res: { structureCountTab: { id: number; count: number }[] }) => {
- categories.forEach((category) => {
- category = this.searchService.setCountModules(category, res.structureCountTab);
- this.categories.push(category);
- });
+ } else if (option === TypeModal[1]) {
+ forkJoin([this.searchService.getCategoriesFormations(), this.searchService.getFakeCounterModule()]).subscribe(
+ (res) => {
+ const categories: Category[] = res[0];
+ const structureCounter: StructureCounter[] = res[1];
+ categories.forEach((category) => {
+ category = this.searchService.setCountModules(category, structureCounter);
+ this.categories.push(category);
});
- });
- } else if (option === this.modalType[2]) {
+ }
+ );
+ } else if (option === TypeModal[2]) {
this.mockService(
this.categories,
'Équipements',
diff --git a/src/app/structure-list/enum/typeModal.enum.ts b/src/app/structure-list/enum/typeModal.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ab391e2f6ccbeeb72f81aea06ff806c764a27d2e
--- /dev/null
+++ b/src/app/structure-list/enum/typeModal.enum.ts
@@ -0,0 +1,5 @@
+export enum TypeModal {
+ accompaniment,
+ training,
+ moreFilters,
+}
diff --git a/src/app/structure-list/models/structureCounter.model.ts b/src/app/structure-list/models/structureCounter.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d208192f08299466b39fc4659fba3574804d04c4
--- /dev/null
+++ b/src/app/structure-list/models/structureCounter.model.ts
@@ -0,0 +1,8 @@
+export class StructureCounter {
+ id: number;
+ count: number;
+
+ constructor(obj?: any) {
+ Object.assign(this, obj);
+ }
+}
diff --git a/src/app/structure-list/services/search.service.ts b/src/app/structure-list/services/search.service.ts
index 906fc3aee4fcf5d8cee5c5a67889b89f93895544..1b6a33b59d159fd9f30a32e1b3051971819e67a2 100644
--- a/src/app/structure-list/services/search.service.ts
+++ b/src/app/structure-list/services/search.service.ts
@@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { Category } from '../models/category.model';
import { Module } from '../models/module.model';
+import { StructureCounter } from '../models/structureCounter.model';
@Injectable({
providedIn: 'root',
@@ -16,10 +17,13 @@ export class SearchService {
.get('/api/CategoriesFormations')
.pipe(map((data: any[]) => data.map((item) => new Category(item))));
}
- public getFakeCounterModule(): Observable<any> {
- return this.http.get('/api/structures/count');
+
+ public getFakeCounterModule(): Observable<StructureCounter[]> {
+ return this.http
+ .get('/api/structures/count')
+ .pipe(map((data: any[]) => data.map((item) => new StructureCounter(item))));
}
- public setCountModules(category: Category, structureCountTab: { id: number; count: number }[]): Category {
+ public setCountModules(category: Category, structureCountTab: StructureCounter[]): Category {
category.modules.forEach((m: Module) => {
for (let i = 0; i < structureCountTab.length; i++) {
if (structureCountTab[i].id === m.id) {
diff --git a/src/app/structure-list/structure-list.component.html b/src/app/structure-list/structure-list.component.html
index e0de815eeef078bfd17a202d85efb6ddf1e6c3c6..95735d1d1920e6b0565c4c7819ed4634722478b6 100644
--- a/src/app/structure-list/structure-list.component.html
+++ b/src/app/structure-list/structure-list.component.html
@@ -1,6 +1,5 @@
<div class="topBlock">
<app-structure-list-search (searchEvent)="fetchResults($event)"></app-structure-list-search>
- <div class="divider"></div>
<span class="nbStructuresLabel">{{ structureList.length }} structures</span>
</div>
diff --git a/src/app/structure-list/structure-list.component.scss b/src/app/structure-list/structure-list.component.scss
index 5b09b7ee8d25d43210b2b3bad2872a9a040b5bfd..ee31dcc056b43f50abb653733d9be53ee293cf92 100644
--- a/src/app/structure-list/structure-list.component.scss
+++ b/src/app/structure-list/structure-list.component.scss
@@ -2,11 +2,6 @@
@import '../../assets/scss/icons';
@import '../../assets/scss/typography';
-.divider {
- width: 100%;
- height: 1px;
- background-color: $grey-4;
-}
.nbStructuresLabel {
color: $grey;
@include cn-regular-16;