diff --git a/src/app/structure-list/components/structure-details/structure-details.component.html b/src/app/structure-list/components/structure-details/structure-details.component.html
index 7cce092a5486a9a1f52ba792061a61e88579246b..8f2f48ab42d90b2f693d1eb78d74cfde47c09dda 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.html
+++ b/src/app/structure-list/components/structure-details/structure-details.component.html
@@ -101,6 +101,60 @@
</div>
</div>
</div>
+ <!-- Accueil -->
+ <div
+ *ngIf="structure.accessModality.length > 0 || structure.hours.hasData()"
+ fxLayout="column"
+ class="structure-details-block"
+ fxLayoutAlign="baseline baseline"
+ fxLayoutGap="20px"
+ >
+ <div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="8px">
+ <app-svg-icon [type]="'ico'" [icon]="'accueil'" [iconClass]="'icon-32'"></app-svg-icon>
+ <h2>Accueil</h2>
+ </div>
+ <!-- Openning Hours -->
+ <div fxLayout="row" class="w-100" fxLayout.lt-sm="column">
+ <div *ngIf="structure.hours.hasData()" fxFlex="50%">
+ <h3 class="subtitle">Horaires d’ouverture au public</h3>
+ <div fxLayout="column">
+ <div *ngFor="let day of structure.hours | keyvalue: keepOriginalOrder">
+ <div *ngIf="day.value.open">
+ <h4>{{ day.key | day }}</h4>
+ <div class="openning-time" fxLayout="row" fxLayoutAlign="none flex-end">
+ <div *ngFor="let timeRange of day.value.time; let isFirst = first">
+ <p *ngIf="isFirst">de {{ timeRange.formatOpenningDate() }} Ã {{ timeRange.formatClosingDate() }}</p>
+ <p *ngIf="!isFirst && timeRange.openning">
+ et de {{ timeRange.formatOpenningDate() }} Ã {{ timeRange.formatClosingDate() }}
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- accessModality -->
+ <div *ngIf="structure.accessModality.length > 0" fxFlex="50%">
+ <h3 class="subtitle">Accès</h3>
+ <div fxLayout="column" fxLayoutGap="10px">
+ <div fxLayout="column" fxLayoutGap="8px">
+ <div
+ fxLayout="row"
+ fxLayoutAlign="none flex-end"
+ fxLayoutGap="8px"
+ *ngFor="let acces of structure.accessModality"
+ >
+ <p class="no-margin">{{ getAccessLabel(acces) }}</p>
+ </div>
+ <p class="no-margin">Accessibles aux personnes à mobilité réduite</p>
+ </div>
+ <div *ngFor="let public of structure.publics" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="8px">
+ <p class="no-margin">{{ getPublicLabel(public) }}</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
<!-- Démarches en ligne -->
<div
*ngIf="structure.proceduresAccompaniment.length"
@@ -126,7 +180,7 @@
</p>
</div>
</div>
- <!-- Services -->
+ <!-- Ateliers -->
<div
*ngIf="isBaseSkills() || isAccessRights()"
fxLayout="column"
@@ -138,6 +192,7 @@
<app-svg-icon [type]="'ico'" [icon]="'services'" [iconClass]="'icon-32'"></app-svg-icon>
<h2>Ateliers</h2>
</div>
+ <span class="bold-info">L'accès à ces ateliers peut être payant</span>
<div fxLayout="row" class="w-100" fxLayout.lt-sm="column">
<div fxFlex="50%" *ngIf="isBaseSkills()">
<h3 class="subtitle">Compétences de base</h3>
@@ -149,53 +204,6 @@
</div>
</div>
</div>
- <!-- Accueil -->
- <div
- *ngIf="structure.accessModality.length > 0 || structure.hours.hasData()"
- fxLayout="column"
- class="structure-details-block"
- fxLayoutAlign="baseline baseline"
- fxLayoutGap="20px"
- >
- <div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="8px">
- <app-svg-icon [type]="'ico'" [icon]="'accueil'" [iconClass]="'icon-32'"></app-svg-icon>
- <h2>Accueil</h2>
- </div>
- <!-- Openning Hours -->
- <div fxLayout="row" class="w-100" fxLayout.lt-sm="column">
- <div *ngIf="structure.hours.hasData()" fxFlex="50%">
- <h3 class="subtitle">Horaires d’ouverture au public</h3>
- <div fxLayout="column">
- <div *ngFor="let day of structure.hours | keyvalue: keepOriginalOrder">
- <div *ngIf="day.value.open">
- <h4>{{ day.key | day }}</h4>
- <div class="openning-time" fxLayout="row" fxLayoutAlign="none flex-end">
- <div *ngFor="let timeRange of day.value.time; let isFirst = first">
- <p *ngIf="isFirst">de {{ timeRange.formatOpenningDate() }} Ã {{ timeRange.formatClosingDate() }}</p>
- <p *ngIf="!isFirst && timeRange.openning">
- et de {{ timeRange.formatOpenningDate() }} Ã {{ timeRange.formatClosingDate() }}
- </p>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <!-- accessModality -->
- <div *ngIf="structure.accessModality.length > 0" fxFlex="50%">
- <h3 class="subtitle">Accès</h3>
- <div
- *ngFor="let acces of structure.accessModality"
- fxLayout="row"
- fxLayoutAlign="none flex-end"
- fxLayoutGap="8px"
- >
- <app-svg-icon [type]="'ico'" [icon]="getAccessIcon(acces)"></app-svg-icon>
- <p>{{ getAccessLabel(acces) }}</p>
- </div>
- </div>
- </div>
- </div>
<!-- Equipements -->
<div
*ngIf="structure.hasEquipments()"
@@ -207,13 +215,8 @@
<app-svg-icon [type]="'ico'" [icon]="'equipement'" [iconClass]="'icon-32'"></app-svg-icon>
<h2>Équipements</h2>
</div>
- <div
- fxLayout="row"
- fxLayoutAlign="none flex-end"
- fxLayoutGap="13px"
- *ngFor="let equipement of structure.equipmentsAndServices"
- >
- <p>
+ <div fxLayout="column">
+ <p *ngFor="let equipement of structure.equipmentsAndServices" class="no-margin-bottom">
{{ getEquipmentsLabel(equipement) }}
<span *ngIf="equipement == 'ordinateurs' && structure.nbComputers"> : {{ structure.nbComputers }}</span>
<span *ngIf="equipement == 'tablettes' && structure.nbTablets"> : {{ structure.nbTablets }}</span>
@@ -266,7 +269,6 @@
</p>
<p *ngFor="let bus of tclStop.busLines">
<app-svg-icon [type]="'tcl'" [icon]="bus" [iconClass]="'icon-75'"></app-svg-icon>
- <!-- {{ bus }} -->
</p>
</div>
</div>
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.scss b/src/app/structure-list/components/structure-details/structure-details.component.scss
index 1717dc3476892475125ab29ca3cc245f1d5f7219..d8ea58095fe9cb0a3d540a8df867ecea8a8cc989 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.scss
+++ b/src/app/structure-list/components/structure-details/structure-details.component.scss
@@ -40,6 +40,8 @@ a {
.subtitle {
text-transform: uppercase;
@include cn-bold-16;
+ margin-bottom: 10px;
+ color: $grey-3;
}
}
@@ -53,8 +55,7 @@ a {
.openning-time {
p {
- margin-left: 0;
- margin-right: 5px;
+ margin: 0 5px 12px 0;
}
}
.typeInformationHeader {
@@ -82,6 +83,17 @@ p,
@include cn-regular-16;
margin-top: 9px;
margin-bottom: 9px;
+ &.no-margin {
+ margin-top: unset;
+ margin-bottom: unset;
+ }
+ &.no-margin-bottom {
+ margin-bottom: unset;
+ }
+}
+
+.bold-info {
+ @include cn-bold-16;
}
@media print {
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.ts b/src/app/structure-list/components/structure-details/structure-details.component.ts
index 71619679ee561c260bbb728c11b6b4191946cddb..747ca0402f88d59d7bf864b1f150f2c39b04572c 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.ts
+++ b/src/app/structure-list/components/structure-details/structure-details.component.ts
@@ -15,6 +15,7 @@ import { TclStopPoint } from '../../../models/tclStopPoint.model';
import { ProfileService } from '../../../profile/services/profile.service';
import { User } from '../../../models/user.model';
import { AuthService } from '../../../services/auth.service';
+import { PublicCategorie } from '../../enum/public.enum';
@Component({
selector: 'app-structure-details',
templateUrl: './structure-details.component.html',
@@ -130,20 +131,6 @@ export class StructureDetailsComponent implements OnInit {
this.displayForm();
this.ngOnInit();
}
- public getAccessIcon(accessModality: AccessModality): string {
- switch (accessModality) {
- case AccessModality.free:
- return 'group';
- case AccessModality.meeting:
- return 'calendar';
- case AccessModality.meetingOnly:
- return 'calendar';
- case AccessModality.numeric:
- return 'tel';
- default:
- return null;
- }
- }
public getAccessLabel(accessModality: AccessModality): string {
switch (accessModality) {
@@ -160,6 +147,21 @@ export class StructureDetailsComponent implements OnInit {
}
}
+ public getPublicLabel(tagetPublic: PublicCategorie): string {
+ switch (tagetPublic) {
+ case PublicCategorie.young:
+ return 'Jeunes (16 - 25 ans)';
+ case PublicCategorie.adult:
+ return 'Adultes (25 - 65 ans)';
+ case PublicCategorie.elderly:
+ return 'Séniors (+ de 65 ans)';
+ case PublicCategorie.all:
+ return 'Tout public';
+ default:
+ return null;
+ }
+ }
+
public setServiceCategories(): void {
this.baseSkills = this.structure.baseSkills.map((skill) =>
_.find(this.baseSkillssReferentiel.modules, { id: skill })
diff --git a/src/app/structure-list/enum/public.enum.ts b/src/app/structure-list/enum/public.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1f837130376982ac9fb26266d8218d0aa63dfa66
--- /dev/null
+++ b/src/app/structure-list/enum/public.enum.ts
@@ -0,0 +1,6 @@
+export enum PublicCategorie {
+ young = 'jeunes1625Ans',
+ adult = 'adultes',
+ elderly = 'seniorsPlusDe65Ans',
+ all = 'toutPublic',
+}