Commit 74849be5 authored by Hugo SUBTIL's avatar Hugo SUBTIL
Browse files

Merge branch 'dev' into 'master'

Dev

See merge request !156
parents 032e65c1 f29b00c7
Pipeline #14722 canceled with stages
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AboutComponent } from './about/about.component';
import { FormComponent } from './form/form.component';
import { FormComponent } from './form/structure-form/form.component';
import { AdminGuard } from './guards/admin.guard';
import { AuthGuard } from './guards/auth.guard';
import { DeactivateGuard } from './guards/deactivate.guard';
......@@ -15,9 +15,16 @@ import { StructureDetailsComponent } from './structure-list/components/structure
import { StructureListComponent } from './structure-list/structure-list.component';
import { UserVerificationComponent } from './user-verification/user-verification.component';
import { NewsletterSubscriptionComponent } from './newsletter-subscription/newsletter-subscription.component';
import { OrientationFormComponent } from './form/orientation-form/orientation-form.component';
import { StructureListPrintComponent } from './form/orientation-form/component/structure-list-print/structure-list-print.component';
const routes: Routes = [
{ path: 'print', outlet: 'print', children: [{ path: 'structure', component: StructureDetailsComponent }] },
{ path: 'print', outlet: 'print', children: [{ path: 'structures', component: StructureListPrintComponent }] },
{
path: 'orientation',
component: OrientationFormComponent,
},
{
path: 'acteurs',
component: CartoComponent,
......
......@@ -19,7 +19,7 @@ import { StructureOpeningStatusComponent } from './structure-list/components/str
import { ModalFilterComponent } from './structure-list/components/modal-filter/modal-filter.component';
import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
import { AboutComponent } from './about/about.component';
import { FormComponent } from './form/form.component';
import { FormComponent } from './form/structure-form/form.component';
import { UserVerificationComponent } from './user-verification/user-verification.component';
import { AuthGuard } from './guards/auth.guard';
import { CustomHttpInterceptor } from './config/http-interceptor';
......@@ -34,6 +34,10 @@ import { TempUserResolver } from './resolvers/temp-user.resolver';
import { StructureJoinComponent } from './structure-join/structure-join.component';
import { RouterListenerService } from './services/routerListener.service';
import { NewsletterSubscriptionComponent } from './newsletter-subscription/newsletter-subscription.component';
import { OrientationFormComponent } from './form/orientation-form/orientation-form.component';
import { StructureDetailPrintComponent } from './form/orientation-form/component/structure-detail-print/structure-detail-print.component';
import { StructureListPrintComponent } from './form/orientation-form/component/structure-list-print/structure-list-print.component';
import { StructurePrintHeaderComponent } from './form/orientation-form/component/structure-print-header/structure-print-header.component';
@NgModule({
declarations: [
......@@ -56,6 +60,10 @@ import { NewsletterSubscriptionComponent } from './newsletter-subscription/newsl
FooterFormComponent,
StructureJoinComponent,
NewsletterSubscriptionComponent,
OrientationFormComponent,
StructureDetailPrintComponent,
StructureListPrintComponent,
StructurePrintHeaderComponent,
],
imports: [BrowserModule, HttpClientModule, AppRoutingModule, SharedModule, MapModule],
providers: [
......
<div class="structrue-details-container" *ngIf="structure">
<!-- Header info -->
<div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
<div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
<div fxLayout="column" class="no-margin" fxLayoutAlign="space-between start">
<h2 class="bold">{{ structure.structureName }}</h2>
</div>
<div fxLayout="row" fxLayoutAlign="space-between center">
<div class="typeInformationHeader" fxLayout="column">
<h3>{{ structure.getLabelTypeStructure() }}</h3>
</div>
</div>
<div fxLayout="row" class="mobile-column">
<div fxLayout="column" fxFlex="50%">
<div *ngIf="structure.address" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'adress'" [title]="'Adresse'"></app-svg-icon>
<p>{{ structure.address.numero }} {{ structure.address.street }}, {{ structure.address.commune }}</p>
</div>
<div *ngIf="structure.website" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'web'" [title]="'Site web'"></app-svg-icon>
<a
target="_blank"
class="custom-link"
rel="noopener noreferrer"
[href]="structure.website.includes('http') ? structure.website : 'http://' + structure.website"
>{{ structure.website | url }}</a
>
</div>
<div *ngIf="structure.hasSocialNetwork()" fxLayout="row" fxLayoutAlign="none baseline" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'network'"></app-svg-icon>
<div fxLayout="row" fxLayoutAlign="none baseline" fxLayoutGap="8px">
<a
*ngIf="structure.facebook"
target="_blank"
class="custom-link"
rel="noopener noreferrer"
[href]="'http://' + structure.facebook"
>
<app-svg-icon [type]="'ico'" [icon]="'facebook'" [title]="'Facebook'"></app-svg-icon
></a>
<a
*ngIf="structure.twitter"
target="_blank"
class="custom-link"
rel="noopener noreferrer"
[href]="'http://' + structure.twitter"
>
<app-svg-icon [type]="'ico'" [icon]="'twitter'" [title]="'Twitter'"></app-svg-icon
></a>
<a
*ngIf="structure.instagram"
target="_blank"
class="custom-link"
rel="noopener noreferrer"
[href]="'http://' + structure.instagram"
>
<app-svg-icon [type]="'ico'" [icon]="'instagram'" [title]="'Instagram'"></app-svg-icon
></a>
<a
*ngIf="structure.linkedin"
target="_blank"
class="custom-link"
rel="noopener noreferrer"
[href]="'http://' + structure.linkedin"
>
<app-svg-icon [type]="'ico'" [icon]="'linkedin'" [title]="'Linkedin'"></app-svg-icon
></a>
</div>
</div>
<div *ngIf="structure.contactPhone" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'tel'" [title]="'Téléphone'"></app-svg-icon>
<p>{{ structure.contactPhone | phone }}</p>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div
*ngIf="structure.contactMail && structure.contactMail !== 'unknown@unknown.com'"
fxLayout="row"
fxLayoutAlign="none center"
fxLayoutGap="13px"
>
<app-svg-icon [type]="'ico'" [iconClass]="'grey-1'" [icon]="'email'" [title]="'Email'"></app-svg-icon>
<p>{{ structure.contactMail }}</p>
</div>
<div *ngIf="structure.hasPassNumeric()" fxLayout="row" fxLayoutAlign="none center" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'pass'" [title]="'Pass numérique'"></app-svg-icon>
<p>agréé Pass Numérique</p>
</div>
<div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'calendar'"></app-svg-icon>
<p>Mise à jour le {{ structure.updatedAt | date: 'mediumDate' }}</p>
</div>
</div>
</div>
<div>
{{ structure.description }}
</div>
<div class="info">
{{ structure.lockdownActivity }}
</div>
</div>
</div>
<!-- Accueil -->
<div
*ngIf="structure.accessModality.length > 0 || structure.hours.hasData() || structure.remoteAccompaniment"
fxLayout="column"
class="structure-details-block"
fxLayoutAlign="baseline baseline"
fxLayoutGap="20px"
>
<!-- Opening Hours -->
<div fxLayout="row" class="w-100 mobile-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="opening-time" fxLayout="row" fxLayoutAlign="none flex-end">
<div *ngFor="let timeRange of day.value.time; let isFirst = first">
<p *ngIf="isFirst">de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}</p>
<p *ngIf="!isFirst && timeRange.opening">
et de {{ timeRange.formatOpeningDate() }} à {{ timeRange.formatClosingDate() }}
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- accessModality -->
<div *ngIf="structure.accessModality.length > 0" fxFlex="40%">
<h3 class="subtitle">Accès transports en commun</h3>
<div fxLayout="column">
<div *ngFor="let tclStop of tclStopPoints">
<div fxLayout="row wrap" fxLayoutGap="5px">
<p>{{ tclStop.name }}:</p>
<p *ngIf="tclStop.subLines.length > 0">Métro</p>
<p *ngFor="let sub of tclStop.subLines">{{ sub }}</p>
<p *ngIf="tclStop.tramLines.length > 0">Tram</p>
<p *ngFor="let tram of tclStop.tramLines">{{ tram }}</p>
<p *ngIf="tclStop.busLines.length > 0">Bus</p>
<p *ngFor="let bus of tclStop.busLines">{{ bus }}</p>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="structure.exceptionalClosures" class="bold-info">
<h3 class="subtitle">Précisions sur les horaires</h3>
<p>{{ structure.exceptionalClosures }}</p>
</div>
<div *ngIf="structure.remoteAccompaniment" class="bold-info">
<h3>Cette structure propose un accompagnement à distance.</h3>
</div>
</div>
</div>
@import '../../../../../assets/scss/icons';
@import '../../../../../assets/scss/color';
@import '../../../../../assets/scss/typography';
@import '../../../../../assets/scss/z-index';
@import '../../../../../assets/scss/layout';
@import '../../../../../assets/scss/breakpoint';
a {
padding: unset;
}
.structrue-details-container {
border-right: solid 1px $grey-4;
page-break-after: always;
background-color: $white;
top: 0;
left: 0;
max-width: 980px;
width: 100%;
margin-bottom: 50px;
padding: 10px 24px;
@media #{$tablet} {
width: calc(100% - 2 * 24px);
position: fixed;
height: 100%;
.printButton {
display: none !important;
}
}
.printButton {
margin-right: 75px;
}
}
.structrue-details-container > .structure-details-block {
padding: 0px 0px 24px 0;
border-bottom: 1px dashed $grey-2;
.subtitle {
text-transform: uppercase;
@include cn-bold-16;
margin-bottom: 10px;
color: $grey-3;
}
}
.structrue-details-container > .structure-details-block ~ .structure-details-block {
padding: 24px 0;
}
.structure-details-block:last-child {
border-bottom: none;
}
.opening-time {
p {
margin: 0 5px 12px 0;
}
}
.typeInformationHeader {
color: $grey-3;
}
h2 {
margin-top: 0;
margin-bottom: 5px;
@include cn-regular-26;
}
h3 {
margin: 0 0 8px 0;
@include cn-regular-16;
}
h4 {
margin-left: 0;
margin-bottom: 0;
margin-top: 4px;
@include cn-regular-14;
color: $grey-2;
text-transform: uppercase;
}
p,
.custom-link {
@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 {
.structrue-details-container {
background-color: unset;
z-index: unset;
position: unset;
top: unset;
left: unset;
max-width: unset;
width: unset;
height: unset;
padding: unset;
overflow: hidden;
border-right: 0;
}
.hide-on-print {
display: none !important;
}
}
.info {
color: $ram-hover-principal;
}
.wrapper {
width: 100%;
display: grid;
gap: 20px 30px;
grid-template-columns: 1fr 1fr;
}
.tags-cloud {
font-style: normal;
justify-content: center;
align-items: center;
height: 25px;
border-radius: 20px;
padding: 5px 15px;
color: white;
border-style: none;
margin-top: 15px;
background: #348899;
}
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Structure } from '../../../../models/structure.model';
import * as _ from 'lodash';
import { TclService } from '../../../../services/tcl.service';
import { TclStopPoint } from '../../../../models/tclStopPoint.model';
import { AuthService } from '../../../../services/auth.service';
import { AccessModality } from '../../../../structure-list/enum/access-modality.enum';
import { PublicCategorie } from '../../../../structure-list/enum/public.enum';
@Component({
selector: 'app-structure-detail-print',
templateUrl: './structure-detail-print.component.html',
styleUrls: ['./structure-detail-print.component.scss'],
})
export class StructureDetailPrintComponent implements OnInit {
@Input() public structure: Structure;
@Output() public closeDetails: EventEmitter<boolean> = new EventEmitter<boolean>();
@Output() public dataReady: EventEmitter<boolean> = new EventEmitter<boolean>();
public accessModality = AccessModality;
public tclStopPoints: TclStopPoint[] = [];
constructor(private tclService: TclService, private authService: AuthService) {}
async ngOnInit(): Promise<void> {
// GetTclStopPoints
this.getTclStopPoints();
const index = this.structure.proceduresAccompaniment.indexOf('autres');
if (index > -1) {
this.structure.proceduresAccompaniment.splice(index, 1);
}
}
public userIsLoggedIn(): boolean {
return this.authService.isLoggedIn();
}
public getAccessLabel(accessModality: AccessModality): string {
switch (accessModality) {
case AccessModality.free:
return 'Accès libre';
case AccessModality.meeting:
return 'Sur rendez-vous';
case AccessModality.meetingOnly:
return 'Uniquement sur RDV';
case AccessModality.numeric:
return 'Téléphone / Visio';
default:
return null;
}
}
public getPublicLabel(tagetPublic: PublicCategorie): string {
switch (tagetPublic) {
case PublicCategorie.young:
return 'Jeunes (16 - 25 ans)';
case PublicCategorie.adult:
return 'Adultes';
case PublicCategorie.elderly:
return 'Séniors (+ de 65 ans)';
case PublicCategorie.all:
return 'Tout public';
case PublicCategorie.under16Years:
return 'Moins de 16 ans';
case PublicCategorie.women:
return 'Uniquement femmes';
default:
return null;
}
}
public getTclStopPoints(): void {
this.tclService.getTclStopPointBycoord(this.structure.getLon(), this.structure.getLat()).subscribe((res) => {
this.tclStopPoints = res;
});
}
}
<app-structure-print-header
class="multi-print"
[beneficiaryNeedCommentary]="beneficiaryNeedCommentary"
[beneficiaryName]="beneficiaryName"
[structureAccompaniment]="structureAccompaniment"
[beneficiaryPassNumeric]="beneficiaryPassNumeric"
[contactAccompaniment]="contactAccompaniment"
[filters]="filters"
></app-structure-print-header>
<div class="multi-print" *ngFor="let structure of structures">
<app-structure-detail-print [structure]="structure"></app-structure-detail-print>
</div>
.list-to-print {
height: 600px;
overflow-x: hidden;
overflow-y: auto;
}
.multi-print {
::ng-deep {
.structrue-details-container {
page-break-after: always;
height: 100%;
}
.print-header {
page-break-after: always;
height: 100%;
}
}
}
import { Component, Input, OnInit } from '@angular/core';
import { Structure } from '../../../../models/structure.model';
import * as _ from 'lodash';
import { ActivatedRoute } from '@angular/router';
import { PrintService } from '../../../../shared/service/print.service';
import { Filter } from '../../../../structure-list/models/filter.model';
import Module from 'module';
@Component({
selector: 'app-structure-list-print',
templateUrl: './structure-list-print.component.html',
styleUrls: ['./structure-list-print.component.scss'],
})
export class StructureListPrintComponent implements OnInit {
@Input() public structures: Structure[];
@Input() public filters: Filter[];
@Input() public beneficiaryNeedCommentary: string;
@Input() public beneficiaryName: string;
@Input() public structureAccompaniment: string;
@Input() public beneficiaryPassNumeric: boolean;
@Input() public contactAccompaniment: string;
constructor(private printService: PrintService, private route: ActivatedRoute) {}
async ngOnInit(): Promise<void> {}
}
<div class="print-header" fxLayout="column">
<div class="header-print" fxLayout="row" fxLayoutAlign="space-between center">
<h3>Fiche d'orientation</h3>
<h4 class="typeInformationHeader">{{ date }}</h4>
</div>
<!-- Name -->
<div *ngIf="beneficiaryName">
<p class="bold">{{ beneficiaryName }}</p>
</div>
<!-- Accompaniment -->
<div *ngIf="structureAccompaniment">
<div class="typeInformationHeader">Orienté par</div>
<div class="contactAccompaniment" fxLayout="row" fxLayoutAlign="space-between center">
<div class="bold">{{ structureAccompaniment }}</div>
<!-- Contact -->
<div class="bold" *ngIf="contactAccompaniment">{{ contactAccompaniment }}</div>
</div>
</div>
<!-- Needs -->
<div *ngIf="equipments.length > 0">
<p class="typeInformationHeader">Besoins en matériel</p>
<div fxLayout="row wrap" fxLayoutGap="16px">
<div *ngFor="let equipmentTag of equipments" class="tags-cloud" fxLayout="row">
{{ equipmentTag.text ? equipmentTag.text : equipmentTag.value }}
</div>
</div>
</div>
<div *ngIf="formations.length > 0">
<p class="typeInformationHeader">Besoins en formation</p>
<div fxLayout="row wrap" fxLayoutGap="16px">
<div *ngFor="let formationTag of formations" class="tags-cloud" fxLayout="row">
{{ formationTag.text ? formationTag.text : formationTag.value }}
</div>
</div>
</div>
<div *ngIf="assistances.length > 0">
<p class="typeInformationHeader">Besoins d'accompagnement</p>
<div fxLayout="row wrap" fxLayoutGap="16px">
<div *ngFor="let assistanceTag of assistances" class="tags-cloud" fxLayout="row">
{{ assistanceTag.text ? assistanceTag.text : assistanceTag.value }}
</div>
</div>
</div>
<div *ngIf="specificNeeds.length > 0">
<div class="typeInformationHeader">Besoins spécifiques'</div>
<div fxLayout="row wrap" fxLayoutGap="16px">
<div *ngFor="let specificNeed of specificNeeds" class="tags-cloud" fxLayout="row">
{{ specificNeed.text ? specificNeed.text : specificNeed.value }}
</div>
</div>
</div>
<!-- Pass Numeric -->
<div *ngIf="beneficiaryPassNumeric" class="inputRow" fxLayout="row" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'passNumeric'"></app-svg-icon>
<p class="bold">Pass Numérique</p>
</div>
<!-- Comments -->