diff --git a/Dockerfile b/Dockerfile
index bee682a15c8297a99baf8b87a0fb52c7f50a759f..802c807ffdcbe1763122cf49cf2adcd87ca3575a 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -30,9 +30,13 @@ RUN apt-get update
COPY --from=build /app/dist/fr /usr/share/nginx/html
+# Add outdated browser page
+ADD ./nginx/outdated.html /usr/share/nginx/html
+
RUN touch /var/run/nginx.pid
RUN ls -l /usr/share/nginx/html
+
# expose port 8080
EXPOSE 8080
diff --git a/nginx/dev.conf b/nginx/dev.conf
index bb472e0c296a2dfe28b683f99901d3a1b4434c3f..7609f90b77cf963d3628bce01b5bf1e677de4952 100644
--- a/nginx/dev.conf
+++ b/nginx/dev.conf
@@ -1,3 +1,19 @@
+map $http_user_agent $outdated {
+ default 0;
+ "~MSIE [1-10]\." 1;
+ "~Trident/[5-7]\." 1;
+ "~Mozilla.*Firefox/[1-9]\." 1;
+ "~Mozilla.*Firefox/[0-2][0-9]\." 1;
+ "~Mozilla.*Firefox/3[0-1]\." 1;
+ "~Opera.*Version/[0-9]\." 1;
+ "~Opera.*Version/[0-1][0-9]\." 1;
+ "~Opera.*Version/2[0-1]\." 1;
+ "~AppleWebKit.*Version/[0-6]\..*Safari" 1;
+ "~Chrome/[0-9]\." 1;
+ "~Chrome/[0-2][0-9]\." 1;
+ "~Chrome/3[0-3]\." 1;
+}
+
server {
listen 8080 default_server;
@@ -17,6 +33,10 @@ server {
</script>";
location / {
+ # Redirect outdated nav
+ if ($outdated = 1){
+ rewrite ^ /outdated.html break;
+ }
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ /index.html;
@@ -32,7 +52,6 @@ server {
proxy_pass https://passerelle.formulaireextranet.grandlyon.com/base-adresse/base-adresse-nationale/streets;
}
-
location /geocoding/photon/api {
proxy_pass https://download.data.grandlyon.com/geocoding/photon/api;
}
@@ -51,8 +70,6 @@ server {
proxy_pass http://ghost:2368;
}
-
-
# REALLY important for JavaScript modules (type="module") to work as expected!!!
location ~ \.js {
add_header Content-Type text/javascript;
diff --git a/nginx/outdated.html b/nginx/outdated.html
new file mode 100644
index 0000000000000000000000000000000000000000..24987fe33502039d57359e6d5900027eac0fe673
--- /dev/null
+++ b/nginx/outdated.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="fr">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+ <title>RES'in: Navigateur incompatible</title>
+ </head>
+
+ <body>
+ <div>
+ <h1>Navigateur obsolète</h1>
+ <p>
+ Votre navigateur ne vous permet pas d'accéder à RES'in dans de bonnes conditions. Merci d'utiliser
+ <a href="https://www.mozilla.org/fr/firefox/new/">Firefox</a>,
+ <a href="https://www.google.com/intl/fr/chrome/">Chrome</a>, ou la dernière version d'<a
+ href="https://www.microsoft.com/fr-fr/edge"
+ >Edge</a
+ >.
+ </p>
+ </div>
+ </body>
+</html>
diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html
index 0b50d93e3869c66bd30bca115cd864e056a13b16..fcbc5f03c5e46920a8341be5ae1983f8a269c5bd 100644
--- a/src/app/about/about.component.html
+++ b/src/app/about/about.component.html
@@ -1,26 +1,37 @@
<div fxLayout="column" class="content-container full-screen">
<div class="section-container">
- <h1>Qui sommes-nous ?</h1>
- <p>
- La numérisation accélérée des différents services privés et publics ainsi que la crise sanitaire que nous
- traversons a renforcé une fracture numérique déjà forte pour un nombre important de citoyens.
- </p>
- <p>
- Au printemps 2019, la Métropole de Lyon s'est saisie des enjeux autour de l'inclusion numérique en initiant la
- structuration d'un réseau des acteurs de la médiation numérique sur son territoire. Son objectif est de mettre en
- relation les acteurs qui œuvrent au quotidien pour limiter cette fracture numérique, nombreux sur le territoire de
- la Métropole : associations, centres sociaux, structures informations jeunesses, grands opérateurs de services
- publics, collectivités...
- </p>
- <p>
- Des ateliers de travail ont été organisés en 2019 pour identifier les besoins de ces acteurs et 9 offres de
- services ont été identifiées :
- </p>
- <img src="/assets/img/about_illustration.png" alt="illustration des besoins" />
- <p>
- Cet espace vise à centraliser et mettre en commun les ressources développées dans le cadre du réseau par ses
- acteurs.
- </p>
- <p>N'hésitez pas à contribuer à cet espace en partageant vos ressources</p>
+ <div fxLayout="row" fxLayout.lt-sm="column" fxLayoutAlign="left" fxLayoutGap="5%">
+ <div class="about-container">
+ <h1>Qui sommes-nous ?</h1>
+ <p>
+ La numérisation accélérée des différents services privés et publics ainsi que la crise sanitaire que nous
+ traversons a renforcé une fracture numérique déjà forte pour un nombre important de citoyens.
+ </p>
+ <p>
+ Au printemps 2019, la Métropole de Lyon s'est saisie des enjeux autour de l'inclusion numérique en initiant la
+ structuration d'un réseau des acteurs de la médiation numérique sur son territoire. Son objectif est de mettre
+ en relation les acteurs qui œuvrent au quotidien pour limiter cette fracture numérique, nombreux sur le
+ territoire de la Métropole : associations, centres sociaux, structures informations jeunesses, grands
+ opérateurs de services publics, collectivités...
+ </p>
+ <p>
+ Des ateliers de travail ont été organisés en 2019 pour identifier les besoins de ces acteurs et 9 offres de
+ services ont été identifiées :
+ </p>
+ <h2>Recenser et partager des ressources existantes (optimisation)</h2>
+ <img src="/assets/img/about_illustration_1.jpg" alt="illustration des besoins" />
+ <h2>Co-construire de nouvelles ressources (développement)</h2>
+ <img src="/assets/img/about_illustration_2.jpg" alt="illustration des besoins" />
+ <p>
+ Cet espace vise à centraliser et mettre en commun les ressources développées dans le cadre du réseau par ses
+ acteurs.
+ </p>
+ <p>N'hésitez pas à contribuer à cet espace en partageant vos ressources</p>
+ </div>
+ <div fxLayout="column" fxLayoutAlign="center center" fxLayoutGap="20px">
+ <img src="/assets/logos/logo_europe.png" alt="logo de l'union européenne" />
+ <img src="/assets/logos/logo_region.png" alt="logo de la région Auverge-Rhône-Alpes" />
+ </div>
+ </div>
</div>
</div>
diff --git a/src/app/about/about.component.scss b/src/app/about/about.component.scss
index e077716b4eae2a1c6e04c6ade486ae11545c511d..08f1b70f14040182e176340db2ee075f95697129 100644
--- a/src/app/about/about.component.scss
+++ b/src/app/about/about.component.scss
@@ -1,3 +1,15 @@
+@import '../../assets/scss/color';
+@import '../../assets/scss/typography';
+
.content-container {
overflow: auto;
}
+
+h2 {
+ @include cn-bold-16;
+ color: $red-default;
+}
+
+.about-container {
+ max-width: 760px;
+}
diff --git a/src/app/admin/components/claim-structure/claim-structure.component.html b/src/app/admin/components/claim-structure/claim-structure.component.html
index 46494e955d1549ba97a5c20d3cc8661f0929a559..aa0adbc5878057c773c8d656acb826ee2fe6ffcb 100644
--- a/src/app/admin/components/claim-structure/claim-structure.component.html
+++ b/src/app/admin/components/claim-structure/claim-structure.component.html
@@ -1,5 +1,5 @@
<div fxLayout="row" fxLayoutAlign="center center">
- <table *ngIf="demandsAttachment" summary="demands attachment results">
+ <table *ngIf="demandsAttachment" aria-describedby="demands attachment results">
<thead>
<th scope="col">Utilisateur</th>
<th scope="col">Structure</th>
@@ -8,7 +8,7 @@
<tbody>
<tr *ngFor="let demand of demandsAttachment">
<td>{{ demand.userEmail }}</td>
- <td>{{ demand.structureId }}</td>
+ <td>{{ demand.structureName }}</td>
<td>
<button (click)="acceptDemand(demand)">Valider</button><button (click)="refuseDemand(demand)">Refuser</button>
</td>
diff --git a/src/app/admin/components/claim-structure/claim-structure.component.scss b/src/app/admin/components/claim-structure/claim-structure.component.scss
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/app/admin/components/claim-structure/claim-structure.component.ts b/src/app/admin/components/claim-structure/claim-structure.component.ts
index 019a1e68008f90072c7876877ee8e1518b3a0396..e6e8f1338949af736a38bdc97e159870bd54c018 100644
--- a/src/app/admin/components/claim-structure/claim-structure.component.ts
+++ b/src/app/admin/components/claim-structure/claim-structure.component.ts
@@ -5,7 +5,6 @@ import { AdminService } from '../../services/admin.service';
@Component({
selector: 'app-admin-claim-structure',
templateUrl: './claim-structure.component.html',
- styleUrls: ['./claim-structure.component.scss'],
})
export class ClaimStructureComponent implements OnInit {
public demandsAttachment: DemandAttachment[];
diff --git a/src/app/admin/components/panel/panel.component.scss b/src/app/admin/components/panel/panel.component.scss
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/app/admin/components/panel/panel.component.ts b/src/app/admin/components/panel/panel.component.ts
index c6d2adffa20c9abc2ade11eaaf3877f2dd80d722..c4a2164095eadf3a3269fc10d437249c9ad131d1 100644
--- a/src/app/admin/components/panel/panel.component.ts
+++ b/src/app/admin/components/panel/panel.component.ts
@@ -3,7 +3,6 @@ import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-admin-panel',
templateUrl: './panel.component.html',
- styleUrls: ['./panel.component.scss'],
})
export class PanelComponent implements OnInit {
constructor() {}
diff --git a/src/app/admin/models/demandAttachment.model.ts b/src/app/admin/models/demandAttachment.model.ts
index b19d1f375c47a3aa9c379d567ec09400ed6de655..f7b9ae4b4ebcc30ef465e7721375ba0a7e5de5d5 100644
--- a/src/app/admin/models/demandAttachment.model.ts
+++ b/src/app/admin/models/demandAttachment.model.ts
@@ -1,4 +1,5 @@
export class DemandAttachment {
userEmail: string;
structureId: number;
+ structureName: string;
}
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 993557771faefa1b05cc206b356954637ed0047f..045be83e7bbd0f56c3f29a5805bd5d48fe7b6ed6 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -11,6 +11,8 @@ import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
import { ProfileComponent } from './profile/profile.component';
import { ResetEmailComponent } from './reset-email/reset-email.component';
import { ResetPasswordComponent } from './reset-password/reset-password.component';
+import { TempUserResolver } from './resolvers/temp-user.resolver';
+import { StructureJoinComponent } from './structure-join/structure-join.component';
import { StructureDetailsComponent } from './structure-list/components/structure-details/structure-details.component';
import { StructureListComponent } from './structure-list/structure-list.component';
import { UserVerificationComponent } from './user-verification/user-verification.component';
@@ -49,6 +51,14 @@ const routes: Routes = [
path: 'users/verify/:id',
component: UserVerificationComponent,
},
+ {
+ path: 'register',
+ component: FormComponent,
+ canDeactivate: [DeactivateGuard],
+ resolve: {
+ user: TempUserResolver,
+ },
+ },
{
path: 'change-email/:id',
component: ResetEmailComponent,
@@ -58,6 +68,11 @@ const routes: Routes = [
canActivate: [AuthGuard],
component: ProfileComponent,
},
+ {
+ path: 'join',
+ canActivate: [AuthGuard],
+ component: StructureJoinComponent,
+ },
{
path: 'reset-password',
component: ResetPasswordComponent,
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 76b6da88f39b3b0733976938c3de17b5f117219d..8db542e8f1a79efb23270730473c3bcc42c0d9e2 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -30,6 +30,8 @@ import { AdminModule } from './admin/admin.module';
import { AdminGuard } from './guards/admin.guard';
import { DeactivateGuard } from './guards/deactivate.guard';
import { FooterFormComponent } from './form/footer-form/footer-form.component';
+import { TempUserResolver } from './resolvers/temp-user.resolver';
+import { StructureJoinComponent } from './structure-join/structure-join.component';
@NgModule({
declarations: [
@@ -50,6 +52,7 @@ import { FooterFormComponent } from './form/footer-form/footer-form.component';
ResetPasswordComponent,
FormComponent,
FooterFormComponent,
+ StructureJoinComponent,
],
imports: [BrowserModule, HttpClientModule, AppRoutingModule, SharedModule, MapModule, ProfileModule, AdminModule],
providers: [
@@ -59,6 +62,7 @@ import { FooterFormComponent } from './form/footer-form/footer-form.component';
AuthGuard,
AdminGuard,
DeactivateGuard,
+ TempUserResolver,
],
bootstrap: [AppComponent],
})
diff --git a/src/app/footer/footer.component.html b/src/app/footer/footer.component.html
index e043a1e4479fe890e9cf26cb3fa6acd0a0cdf61e..6cc2485c7cfcd89480be637c69891033a4d0ec25 100644
--- a/src/app/footer/footer.component.html
+++ b/src/app/footer/footer.component.html
@@ -3,7 +3,6 @@
<a class="clickable text-align-center" routerLink="/legal-notice" i18n>Mentions légales</a>
<!-- <a class="clickable text-align-center" routerLink="/sitemap" i18n>Plan du site</a> -->
<a class="clickable text-align-center" href="mailto:inclusionnumerique@grandlyon.com">Contact</a>
- <a routerLink="/about" i18n>Qui sommes-nous ?</a>
</div>
<a
class="metro-link"
diff --git a/src/app/footer/footer.component.scss b/src/app/footer/footer.component.scss
index 4c3179c71c7478231a7fb44c973d546e698536c6..7fac9223d9e84fb3799d2005d68d8b094cc358b7 100644
--- a/src/app/footer/footer.component.scss
+++ b/src/app/footer/footer.component.scss
@@ -13,6 +13,8 @@
a {
color: $white;
margin: 0px 0px 0px 10px;
+ text-decoration: none;
+ @include cn-regular-12;
&:hover {
text-decoration: underline;
}
@@ -35,12 +37,6 @@
text-align: center;
}
}
- @media #{$desktop} {
- font-size: 1em;
- }
- @media #{$tablet} {
- font-size: 0.875em;
- }
}
.metro-title {
diff --git a/src/app/form/form.component.html b/src/app/form/form.component.html
index f1b1929d9e3a227379f6cacc435da79c81e25622..b88d6be4742cbe64af2e503efdf4c887ef6648f5 100644
--- a/src/app/form/form.component.html
+++ b/src/app/form/form.component.html
@@ -5,8 +5,13 @@
(closed)="hasRedirectionAccepted($event)"
></app-modal-confirmation>
<div class="content" *ngIf="!isLoading" [ngClass]="{ editMode: isEditMode }">
- <div class="headerEditMode" *ngIf="isEditMode">
+ <div class="headerEditMode" *ngIf="isEditMode" fxLayout="row" fxLayoutAlign="space-between center">
<h2>Modification de {{ editForm.get('structureName').value }}</h2>
+ <app-structure-options-modal
+ [structure]="structureWithOwners"
+ [isEditFormView]="true"
+ (closed)="structureDeleted()"
+ ></app-structure-options-modal>
</div>
<div class="returnBtnSection" *ngIf="isEditMode && currentPage != 0">
<button class="btn-primary previous" (click)="goToSpecificPage(0, false)">
@@ -43,7 +48,7 @@
<p>Une fois réalisé cela vous permettra d'être référencé sur la platefome</p>
</div>
<div class="btnStart">
- <button class="btn-primary start" (click)="nextPage()">C'est Parti</button>
+ <button class="btn-primary start" (click)="nextPage()">C'est parti</button>
</div>
</div>
<div
@@ -53,14 +58,14 @@
fxLayoutAlign="space-between center"
fxLayoutAlign.lt-sm="center"
>
- <h2>
- Revendiquer la structure <span>{{ claimStructure.structureName }}</span>
+ <h2 class="no-wrap">
+ {{ isJoinMode ? 'Rejoindre' : 'Revendiquer' }} la structure <span>{{ claimStructure.structureName }}</span>
</h2>
<div>
<p>Une fois réalisé cela vous permettra de devenir propriétaire de cette structure</p>
</div>
<div class="btnStart">
- <button class="btn-primary start" (click)="nextPage()">C'est Parti</button>
+ <button class="btn-primary start" (click)="nextPage()">C'est parti</button>
</div>
</div>
<div
@@ -164,6 +169,8 @@
(keyup)="verifyUserExist($event.target.value)"
formControlName="email"
class="form-input"
+ [readonly]="isAccountMode"
+ [ngClass]="{ disabled: isAccountMode }"
/>
<img *ngIf="accountForm.get('email').valid" src="../../assets/form/validate.svg" alt="logo valid" />
<img
@@ -957,27 +964,6 @@
</p>
</div>
</div>
- <div *ngIf="false" class="page">
- <div class="title">
- <h3>Voulez-vous inviter d’autres personnes dans cette structure ?</h3>
- <p class="notRequired">facultatif</p>
- </div>
- <div class="collapse" [ngClass]="{ notCollapsed: true }">
- <div fxLayout="column">
- <div class="collapseHeader" fxLayout="row" fxLayoutAlign=" center">
- <div class="titleCollapse">J’ajoute d'autres personnes dans cette structure</div>
- <div class="logo">
- <svg class="show" aria-hidden="true">
- <use [attr.xlink:href]="'assets/form/sprite.svg#show'"></use>
- </svg>
- <svg class="hide" aria-hidden="true">
- <use [attr.xlink:href]="'assets/form/sprite.svg#hide'"></use>
- </svg>
- </div>
- </div>
- </div>
- </div>
- </div>
</form>
<div *ngIf="currentPage == pageTypeEnum.cgu" class="page">
<div class="title">
@@ -1008,7 +994,13 @@
démarches en ligne dans la Métropole de Lyon
</p>
</div>
- <div *ngIf="currentPage == nbPagesForm && !profile" class="page" fxLayout="column" fxLayoutGap="69px">
+ <div
+ *ngIf="currentPage == nbPagesForm && !profile"
+ class="page"
+ fxLayout="column"
+ fxLayoutAlign="center center"
+ fxLayoutGap="69px"
+ >
<svg aria-hidden="true">
<use [attr.xlink:href]="'assets/form/sprite.svg#emailVerification'"></use>
</svg>
@@ -1022,7 +1014,7 @@
</h3>
</div>
- <div class="structureInfoBlock" fxLayout="row" fxLayoutAlign=" center">
+ <div class="structureInfoBlock" fxLayout="row" fxLayoutAlign="center">
<div class="structureInfoContent" fxLayout="column">
{{ getStructureControl('structureName').value }}
<span>{{ getStructureControl('structureType').value }}</span>
diff --git a/src/app/form/form.component.scss b/src/app/form/form.component.scss
index 8ab5aa6f497016a494aa88bad2231c11d91eba64..6a6f572f731cc745fa80e7b3be08a1f8dc6f7a35 100644
--- a/src/app/form/form.component.scss
+++ b/src/app/form/form.component.scss
@@ -5,6 +5,11 @@
@import '../../assets/scss/shapes';
@import '../../assets/scss/z-index';
+.disabled {
+ opacity: 0.4;
+ cursor: not-allowed;
+}
+
h3 {
margin: 0;
}
@@ -103,15 +108,22 @@ h3 {
overflow-y: auto;
height: auto;
h2 {
- @include cn-bold-28;
+ @include cn-bold-26;
color: $black;
margin-bottom: 0;
span {
color: $secondary-color;
}
+ &.no-wrap {
+ white-space: nowrap;
+ }
}
h3 {
- @include cn-bold-22;
+ @include cn-bold-26;
+
+ @media #{$tablet} {
+ @include cn-bold-22;
+ }
}
.page {
max-width: 960px;
@@ -291,14 +303,6 @@ img {
@media #{$tablet} {
width: 296px;
}
- .logo {
- .hide {
- display: block;
- }
- .show {
- display: none;
- }
- }
&.notCollapsed {
margin-bottom: 8px;
background: $grey-6;
@@ -405,6 +409,12 @@ img {
height: 100%;
fill: $grey-1;
}
+ .hide {
+ display: block;
+ }
+ .show {
+ display: none;
+ }
}
}
diff --git a/src/app/form/form.component.spec.ts b/src/app/form/form.component.spec.ts
index 9e6733867669dbe3c32233ebfaad36ce0a0656e4..940d9cf2729552638c10bda394c40aa6839c5f91 100644
--- a/src/app/form/form.component.spec.ts
+++ b/src/app/form/form.component.spec.ts
@@ -1,7 +1,6 @@
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormArray, FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
-import { Time } from '../models/time.model';
import { SharedModule } from '../shared/shared.module';
import { FormComponent } from './form.component';
@@ -56,27 +55,27 @@ describe('FormComponent', () => {
}),
tuesday: new FormGroup({
open: new FormControl(true, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
wednesday: new FormGroup({
open: new FormControl(true, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
thursday: new FormGroup({
open: new FormControl(true, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
friday: new FormGroup({
open: new FormControl(true, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
saturday: new FormGroup({
open: new FormControl(false, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
sunday: new FormGroup({
open: new FormControl(false, Validators.required),
- time: new FormArray([]) as FormArray,
+ time: new FormArray([]),
}),
}),
exceptionalClosures: new FormControl('structure.exceptionalClosures'),
@@ -114,7 +113,7 @@ describe('FormComponent', () => {
it('should return the correct Time from a specific day', () => {
const day = 'monday';
const control = component.getTime(day);
- const TimeForm = component.structureForm.get('hours').get(day).get('time') as FormArray;
+ const TimeForm = component.structureForm.get('hours').get(day).get('time');
expect(control).toEqual(TimeForm);
});
it('should return true', () => {
diff --git a/src/app/form/form.component.ts b/src/app/form/form.component.ts
index a090151708f27ff42dc39594dc782197ec920d36..dcc151211a8f72f9e0b65eb1e66852d31a7457a1 100644
--- a/src/app/form/form.component.ts
+++ b/src/app/form/form.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup, Validators } from '@angular/forms';
import { Structure } from '../models/structure.model';
import { Time } from '../models/time.model';
@@ -16,8 +16,9 @@ import { Equipment } from '../structure-list/enum/equipment.enum';
import { ActivatedRoute, Router } from '@angular/router';
import { AuthService } from '../services/auth.service';
import { first } from 'rxjs/operators';
-import { Regex } from '../shared/enum/regex.enum';
import { PageTypeEnum } from './pageType.enum';
+import { CustomRegExp } from '../utils/CustomRegExp';
+import { StructureWithOwners } from '../models/structureWithOwners.model';
const { DateTime } = require('luxon');
@Component({
selector: 'app-structureForm',
@@ -27,7 +28,6 @@ const { DateTime } = require('luxon');
export class FormComponent implements OnInit {
public profile: User;
public createdStructure: Structure;
-
// Form var
public structureForm: FormGroup;
public accountForm: FormGroup;
@@ -42,6 +42,7 @@ export class FormComponent implements OnInit {
public trainingCategories: { category: Category; openned: boolean }[] = [];
public pageTypeEnum = PageTypeEnum;
public claimStructure: Structure = null;
+ public linkedStructureId: Array<string> = null;
// Page and progress var
public currentPage = 0;
@@ -67,15 +68,19 @@ export class FormComponent implements OnInit {
public showMenu = false;
public isEditMode = false;
public isClaimMode = false;
+ public isAccountMode = false;
+ public isJoinMode = false;
public isLoading = false;
public isWifiChoosen = false;
+ public structureWithOwners: StructureWithOwners;
constructor(
private structureService: StructureService,
private searchService: SearchService,
private profileService: ProfileService,
private authService: AuthService,
- private router: Router
+ private router: Router,
+ private route: ActivatedRoute
) {}
async ngOnInit(): Promise<void> {
@@ -89,15 +94,33 @@ export class FormComponent implements OnInit {
if (history.state.data) {
this.isEditMode = true;
this.isWifiChoosen = true;
- this.initForm(new Structure(history.state.data));
+ const editStructure = new Structure(history.state.data);
+ this.initForm(editStructure);
+ this.structureService.getStructureWithOwners(editStructure._id, this.profile).subscribe((s) => {
+ this.structureWithOwners = s;
+ });
} else if (history.state.newUser) {
this.isClaimMode = true;
+ // Handle join strucutre, the case is very similar to claim
+ if (history.state.isJoin) {
+ this.isJoinMode = true;
+ }
this.createAccountForm();
this.claimStructure = history.state.newUser;
this.setValidationsForm();
} else {
this.initForm(new Structure());
}
+ // Handle account creation when pre-register
+ this.route.data.subscribe((data) => {
+ if (data.user) {
+ this.isAccountMode = true;
+ this.createAccountForm(data.user.email);
+ this.linkedStructureId = data.user.pendingStructuresLink;
+ this.setValidationsForm();
+ this.currentPage = PageTypeEnum.accountInfo;
+ }
+ });
}
async setCategories(): Promise<void> {
@@ -162,16 +185,16 @@ export class FormComponent implements OnInit {
this.setValidationsForm();
}
- private createAccountForm(): void {
+ private createAccountForm(email?: string): void {
this.accountForm = new FormGroup(
{
- email: new FormControl('', [Validators.required, Validators.pattern(Regex.email)]), //NOSONAR
- name: new FormControl('', [Validators.required, Validators.pattern(Regex.textWithoutNumber)]), //NOSONAR
- surname: new FormControl('', [Validators.required, Validators.pattern(Regex.textWithoutNumber)]), //NOSONAR
- phone: new FormControl('', [Validators.required, Validators.pattern(Regex.phone)]), //NOSONAR
+ email: new FormControl(email ? email : '', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]),
+ name: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.TEXT_WITHOUT_NUMBER)]),
+ surname: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.TEXT_WITHOUT_NUMBER)]),
+ phone: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.PHONE)]),
password: new FormControl('', [
Validators.required,
- Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/), //NOSONAR
+ Validators.pattern(CustomRegExp.PASSWORD), //NOSONAR
]),
confirmPassword: new FormControl(''),
},
@@ -194,17 +217,17 @@ export class FormComponent implements OnInit {
}),
contactMail: new FormControl(structure.contactMail, [
Validators.required,
- Validators.pattern(Regex.email), //NOSONAR
+ Validators.pattern(CustomRegExp.EMAIL),
]),
contactPhone: new FormControl(structure.contactPhone, [
Validators.required,
- Validators.pattern(Regex.phone), //NOSONAR
+ Validators.pattern(CustomRegExp.PHONE),
]),
- website: new FormControl(structure.website, Validators.pattern(Regex.website)), //NOSONAR
- facebook: new FormControl(structure.facebook, Validators.pattern(Regex.facebook)), //NOSONAR
- twitter: new FormControl(structure.twitter, Validators.pattern(Regex.twitter)), //NOSONAR
- instagram: new FormControl(structure.instagram, Validators.pattern(Regex.instagram)), //NOSONAR
- linkedin: new FormControl(structure.linkedin, Validators.pattern(Regex.linkedIn)), //NOSONAR
+ website: new FormControl(structure.website, Validators.pattern(CustomRegExp.WEBSITE)),
+ facebook: new FormControl(structure.facebook, Validators.pattern(CustomRegExp.FACEBOOK)),
+ twitter: new FormControl(structure.twitter, Validators.pattern(CustomRegExp.TWITTER)),
+ instagram: new FormControl(structure.instagram, Validators.pattern(CustomRegExp.INSTAGRAM)),
+ linkedin: new FormControl(structure.linkedin, Validators.pattern(CustomRegExp.LINKEDIN)),
hours: new FormGroup({}),
pmrAccess: new FormControl(structure.pmrAccess, Validators.required),
exceptionalClosures: new FormControl(structure.exceptionalClosures),
@@ -222,24 +245,24 @@ export class FormComponent implements OnInit {
digitalCultureSecurity: this.loadArrayForCheckbox(structure.digitalCultureSecurity, false),
nbComputers: new FormControl(
structure.equipmentsAndServices.includes('ordinateurs') ? structure.nbComputers : 1,
- [Validators.required, Validators.pattern(Regex.noNullNumber)] //NOSONAR
+ [Validators.required, Validators.pattern(CustomRegExp.NO_NULL_NUMBER)]
),
nbPrinters: new FormControl(structure.equipmentsAndServices.includes('imprimantes') ? structure.nbPrinters : 1, [
Validators.required,
- Validators.pattern(Regex.noNullNumber), //NOSONAR
+ Validators.pattern(CustomRegExp.NO_NULL_NUMBER),
]),
nbTablets: new FormControl(structure.equipmentsAndServices.includes('tablettes') ? structure.nbTablets : 1, [
Validators.required,
- Validators.pattern(Regex.noNullNumber), //NOSONAR
+ Validators.pattern(CustomRegExp.NO_NULL_NUMBER),
]),
nbNumericTerminal: new FormControl(
structure.equipmentsAndServices.includes('bornesNumeriques') ? structure.nbNumericTerminal : 1,
- [Validators.required, Validators.pattern(Regex.noNullNumber)] //NOSONAR
- ),
- nbScanners: new FormControl(
- structure.equipmentsAndServices.includes('scanners') ? structure.nbScanners : 1,
- [Validators.required, Validators.pattern(Regex.noNullNumber)] //NOSONAR
+ [Validators.required, Validators.pattern(CustomRegExp.NO_NULL_NUMBER)]
),
+ nbScanners: new FormControl(structure.equipmentsAndServices.includes('scanners') ? structure.nbScanners : 1, [
+ Validators.required,
+ Validators.pattern(CustomRegExp.NO_NULL_NUMBER),
+ ]),
freeWorkShop: new FormControl(structure.freeWorkShop, Validators.required),
});
return form;
@@ -398,6 +421,21 @@ export class FormComponent implements OnInit {
};
this.pagesValidation[PageTypeEnum.cgu] = { valid: this.userAcceptSavedDate };
this.updatePageValid();
+ } else if (this.isAccountMode) {
+ this.pagesValidation[PageTypeEnum.accountInfo] = {
+ valid:
+ this.accountForm.get('surname').valid &&
+ this.accountForm.get('name').valid &&
+ this.accountForm.get('phone').valid,
+ };
+ this.pagesValidation[PageTypeEnum.accountCredentials] = {
+ valid:
+ this.accountForm.get('email').valid &&
+ this.accountForm.get('password').valid &&
+ this.accountForm.get('confirmPassword').valid,
+ };
+ this.pagesValidation[PageTypeEnum.cgu] = { valid: this.userAcceptSavedDate };
+ this.updatePageValid();
} else {
this.pagesValidation[PageTypeEnum.summary] = { valid: true };
this.pagesValidation[PageTypeEnum.info] = { valid: true };
@@ -506,7 +544,6 @@ export class FormComponent implements OnInit {
name: 'Informations spécifiques à la période COVID',
};
this.pagesValidation[PageTypeEnum.cgu] = { valid: this.userAcceptSavedDate };
- //this.pagesValidation[PageTypeEnum.addUserToStructure] = { valid: true };
this.updatePageValid();
}
}
@@ -523,9 +560,16 @@ export class FormComponent implements OnInit {
const user = new User(this.accountForm.value);
// Create user and claim structure
this.authService.register(user).subscribe(() => {
- this.structureService.claimStructureWithAccount(this.claimStructure._id, user).subscribe(() => {
- this.progressStatus = 100;
- });
+ // If joinMode, send join request, if not send claim request;
+ if (this.isJoinMode) {
+ this.structureService.joinStructure(this.claimStructure._id, user.email).subscribe(() => {
+ this.progressStatus = 100;
+ });
+ } else {
+ this.structureService.claimStructureWithAccount(this.claimStructure._id, user).subscribe(() => {
+ this.progressStatus = 100;
+ });
+ }
});
}
@@ -544,6 +588,31 @@ export class FormComponent implements OnInit {
this.progressStatus += 25;
}
+ /**
+ * Page algo for create account case
+ */
+ public nextPageAccount(): void {
+ if (this.currentPage == this.nbPagesForm - 1) {
+ const user = new User(this.accountForm.value);
+ // Create user with structure
+ user.structuresLink = this.linkedStructureId;
+ this.authService.register(user).subscribe(() => {
+ this.progressStatus = 100;
+ });
+ }
+
+ if (this.currentPage == PageTypeEnum.accountInfo) {
+ this.currentPage = PageTypeEnum.accountCredentials;
+ this.updatePageValid();
+ } else if (this.currentPage == PageTypeEnum.accountCredentials) {
+ this.currentPage = PageTypeEnum.cgu;
+ this.updatePageValid();
+ } else if (this.currentPage == PageTypeEnum.cgu) {
+ this.currentPage = this.nbPagesForm;
+ }
+
+ this.progressStatus += 25;
+ }
/**
* Page algo for claim structure case
@@ -563,9 +632,26 @@ export class FormComponent implements OnInit {
this.progressStatus -= 25;
}
+ /**
+ * Page algo for claim structure case
+ */
+ public previousPageAccount(): void {
+ if (this.currentPage == PageTypeEnum.accountCredentials) {
+ this.currentPage = PageTypeEnum.accountInfo;
+ this.updatePageValid();
+ } else if (this.currentPage == PageTypeEnum.cgu) {
+ this.currentPage = PageTypeEnum.accountCredentials;
+ this.updatePageValid();
+ }
+
+ this.progressStatus -= 25;
+ }
+
public nextPage(): void {
if (this.isClaimMode) {
this.nextPageClaim();
+ } else if (this.isAccountMode) {
+ this.nextPageAccount();
} else {
// Check if user already connected to skip accountForm pages.
if (this.currentPage == PageTypeEnum.info && this.profile) {
@@ -580,7 +666,6 @@ export class FormComponent implements OnInit {
this.currentPage++; // page structureOtherAccompaniment skip and go to page structureWorkshop
this.progressStatus += 100 / this.nbPagesForm;
}
-
// Check if going to the last page to submit form and send email verification.
if (this.currentPage == this.nbPagesForm - 1) {
this.validateForm();
@@ -594,6 +679,8 @@ export class FormComponent implements OnInit {
public previousPage(): void {
if (this.isClaimMode) {
this.previousPageClaim();
+ } else if (this.isAccountMode) {
+ this.previousPageAccount();
} else {
// Check if user already connected to skip accountForm pages.
if (this.currentPage == PageTypeEnum.structureNameAndAddress && this.profile) {
@@ -822,4 +909,8 @@ export class FormComponent implements OnInit {
public displayClaimStructure(): boolean {
return this.currentPage == this.pageTypeEnum.summary && !this.isEditMode && this.isClaimMode;
}
+
+ public structureDeleted(): void {
+ this.router.navigateByUrl('home');
+ }
}
diff --git a/src/app/form/pageType.enum.ts b/src/app/form/pageType.enum.ts
index 4742e76b28e9a418b5c628fde62bd60317871f27..3b3f5071add1c54b7940b04c4b7577aa94059c35 100644
--- a/src/app/form/pageType.enum.ts
+++ b/src/app/form/pageType.enum.ts
@@ -23,5 +23,4 @@ export enum PageTypeEnum {
structureDescription = 21,
structureCovidInfo = 22,
cgu = 23,
- addUserToStructure = 24,
}
diff --git a/src/app/guards/admin.guard.ts b/src/app/guards/admin.guard.ts
index 10b920afe1505bfb87f0d25e3f0003f548bf411e..2f00de8acf3a7b0df675339ec50ed435224921d3 100644
--- a/src/app/guards/admin.guard.ts
+++ b/src/app/guards/admin.guard.ts
@@ -1,10 +1,7 @@
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree } from '@angular/router';
+import { ActivatedRouteSnapshot, CanActivate, Router, UrlTree } from '@angular/router';
import { Injectable } from '@angular/core';
import { AuthService } from '../services/auth.service';
import { ProfileService } from '../profile/services/profile.service';
-import decode from 'jwt-decode';
-import { User } from '../models/user.model';
-import { UserRole } from '../shared/enum/userRole.enum';
/**
* Guard to assert that we are logged in admin. Otherwise redirect to home
*/
diff --git a/src/app/guards/auth.guard.ts b/src/app/guards/auth.guard.ts
index 3d3205c2e848f41f2425f3a04bb931ce66c15a63..9c7fb4ab22cf6e45fb1c0853fbfb49b0623bffe5 100644
--- a/src/app/guards/auth.guard.ts
+++ b/src/app/guards/auth.guard.ts
@@ -1,8 +1,6 @@
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree } from '@angular/router';
+import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
import { Injectable } from '@angular/core';
import { AuthService } from '../services/auth.service';
-import { Observable } from 'rxjs';
-
/**
* Guard to assert that we are logged in. Otherwise redirect to home
*/
@@ -10,10 +8,11 @@ import { Observable } from 'rxjs';
export class AuthGuard implements CanActivate {
constructor(private authService: AuthService, private router: Router) {}
- canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): UrlTree | boolean {
+ canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
if (this.authService.isLoggedIn()) {
return true;
}
- return this.router.parseUrl('/home');
+ this.router.navigate(['/home'], { queryParams: { returnUrl: state.url } });
+ return false;
}
}
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 713873855305afb90ed02b815b3c5550dee6b6c1..ee833e54bba24f81e6701e48a308f1c793505c1a 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -10,6 +10,7 @@
</div>
<div fxLayout="row" class="right-header" fxLayoutAlign="center center" fxLayoutGap="3vw">
<a routerLink="/home" [routerLinkActive]="'active'" i18n>Les acteurs</a>
+ <a routerLink="/about" [routerLinkActive]="'active'" i18n>Qui sommes-nous ?</a>
<!-- <a routerLink="/news" [routerLinkActive]="'active'" i18n>Actualités</a> -->
<!-- <a routerLink="/resources" [routerLinkActive]="'active'" i18n>Ressources</a> -->
<a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
@@ -32,7 +33,7 @@
</div>
<div fxLayout="column" class="right-header" fxLayoutAlign="none baseline" fxLayoutGap="5vw">
<a routerLink="/home" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Les acteurs</a>
- <a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
+ <a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'" (click)="closeMenu()">Administration</a>
</div>
</div>
<div>
@@ -45,7 +46,7 @@
</div>
<app-signup-modal *ngIf="displaySignUp" [openned]="isPopUpOpen" (closed)="closeSignUpModal($event)"></app-signup-modal>
-<app-signin-modal *ngIf="!displaySignUp" [openned]="isPopUpOpen" (closed)="closeSignInModal()"></app-signin-modal>
+<!-- <app-signin-modal *ngIf="!displaySignUp" [openned]="isPopUpOpen" (closed)="closeSignInModal()"></app-signin-modal> -->
<ng-template #customTitle>
<img class="desktop-show logo-grand-lyon" src="/assets/logos/resin.svg" alt />
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index b745464c09799bbf607ef234d54435ca7ec89f80..37b4b41bc170f8c86a8de22aaf54290bd7b36d27 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -52,6 +52,7 @@ a {
border-bottom: 2px solid $red-default;
text-decoration: none;
}
+ @include cn-regular-14;
}
@media print {
@@ -114,19 +115,11 @@ a {
}
.title {
margin-bottom: 35px;
- @include cn-regular-28;
+ @include cn-regular-26;
span {
color: $grey-2;
}
}
-.footer {
- a {
- height: unset;
- display: table-cell;
- vertical-align: middle;
- margin: auto 0 auto 0;
- }
-}
.desktop-show {
display: block;
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts
index aab75d532c60f128d51ad51bfb731bb4f8c3a9c1..ee446b18ff5ca333d21817772be67f5e96ecd839 100644
--- a/src/app/header/header.component.ts
+++ b/src/app/header/header.component.ts
@@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
-import { NavigationEnd, NavigationStart, Router } from '@angular/router';
+import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
import { ProfileService } from '../profile/services/profile.service';
import { AuthService } from '../services/auth.service';
@@ -13,22 +13,39 @@ export class HeaderComponent implements OnInit {
public isPopUpOpen = false;
public displaySignUp = true;
public currentRoute = '';
- public formeRoute = '/create-structure';
+ public formRoute = '/create-structure';
+ public returnUrl = null;
- constructor(private authService: AuthService, private profileService: ProfileService, private router: Router) {
+ constructor(
+ private authService: AuthService,
+ private profileService: ProfileService,
+ private router: Router,
+ private route: ActivatedRoute
+ ) {
this.router.events.subscribe((event) => {
if (event instanceof NavigationEnd) {
this.currentRoute = event.url;
}
});
}
- ngOnInit(): void {}
+ ngOnInit(): void {
+ this.route.queryParams.subscribe((params) => {
+ if (params.verified || params.returnUrl) {
+ Promise.resolve().then(() => {
+ if (!this.isLoggedIn) {
+ this.isPopUpOpen = true;
+ this.displaySignUp = true;
+ }
+ });
+ this.returnUrl = params.returnUrl;
+ }
+ });
+ }
public openMenu(): void {
this.showMenu = true;
}
- public closeMenu(route: string): void {
- this.router.navigateByUrl(route);
+ public closeMenu(): void {
this.showMenu = false;
}
@@ -47,6 +64,9 @@ export class HeaderComponent implements OnInit {
} else {
this.isPopUpOpen = false;
}
+ if (this.returnUrl && this.isLoggedIn) {
+ this.router.navigateByUrl(this.returnUrl);
+ }
}
public get isAdmin(): boolean {
@@ -58,6 +78,6 @@ export class HeaderComponent implements OnInit {
}
public displayLogo(): boolean {
- return this.formeRoute !== this.currentRoute;
+ return this.formRoute !== this.currentRoute;
}
}
diff --git a/src/app/home/home.component.spec.ts b/src/app/home/home.component.spec.ts
index 55739b5a3dd742e1edc04e5404ee7dc54e56a611..5606d294ab04d1634711140effed0cecb6dea0f1 100644
--- a/src/app/home/home.component.spec.ts
+++ b/src/app/home/home.component.spec.ts
@@ -1,5 +1,4 @@
import { HttpClientModule } from '@angular/common/http';
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { HomeComponent } from './home.component';
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts
index b2b2b512f33028994f6cfa6253219565fb643ab2..5a803cdb4651663e181654ccab74a43e56b3de79 100644
--- a/src/app/home/home.component.ts
+++ b/src/app/home/home.component.ts
@@ -7,7 +7,7 @@ import { StructureService } from '../services/structure.service';
import { Filter } from '../structure-list/models/filter.model';
import { GeoJson } from '../map/models/geojson.model';
import { GeojsonService } from '../services/geojson.service';
-import { ActivatedRoute } from '@angular/router';
+import { CustomRegExp } from '../utils/CustomRegExp';
@Component({
selector: 'app-home',
@@ -107,8 +107,7 @@ export class HomeComponent implements OnInit {
* @param value string
*/
private isLocationRequest(value: string): boolean {
- const regex = /^\d+\s[A-z]+\s[A-z]+/g; //NOSONAR
- if (value.match(regex)) {
+ if (value.match(CustomRegExp.LOCATION)) {
return true;
}
return false;
diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss
index de50ff0b1c4d79a19e525aba1c04afd18c95f8df..cb53c0d90700caed57c3f469322e1b66bfcd58b3 100644
--- a/src/app/map/components/map.component.scss
+++ b/src/app/map/components/map.component.scss
@@ -8,7 +8,7 @@
.map-wrapper {
border-radius: 6px;
- @include background-hash;
+ @include background-hash($grey-2);
border: 1px solid $grey-4;
}
@@ -76,6 +76,14 @@
stroke-width: unset !important;
}
}
+ &:hover {
+ svg {
+ fill: $red-info;
+ &.mdm {
+ fill: #bd9e6a;
+ }
+ }
+ }
}
::ng-deep .leaflet-left {
@@ -90,19 +98,22 @@
::ng-deep .leaflet-popup {
border-radius: 6px;
- @include background-hash;
+ @include background-hash($grey-2);
border: 1px solid $grey-4;
padding: 0 0 4px 4px;
bottom: -15px !important;
h1 {
color: $grey-1;
@include cn-bold-20;
+ font-size: 18px;
margin: 0;
}
p {
color: $grey-3;
@include cn-regular-16;
+ font-size: 16px;
margin: 0 0 13px 0;
+ font-style: italic;
}
.pop-up {
text-align: center;
@@ -111,6 +122,7 @@
button {
@include btn-search-filter;
@include cn-bold-14;
+ font-size: 16px;
}
}
span {
@@ -127,7 +139,6 @@
::ng-deep .leaflet-popup-tip-container {
display: none;
}
-
@media print {
.map-wrapper {
display: none;
diff --git a/src/app/map/components/map.component.ts b/src/app/map/components/map.component.ts
index ad2bba78c884e987a36f93fc6d634f11d4fa0f0c..a038e5759181bc0f6703cf58fa585d5c1ae26117 100644
--- a/src/app/map/components/map.component.ts
+++ b/src/app/map/components/map.component.ts
@@ -1,21 +1,11 @@
-import {
- Component,
- EventEmitter,
- HostListener,
- Input,
- OnChanges,
- Output,
- SimpleChanges,
- ViewChild,
-} from '@angular/core';
-import { latLng, MapOptions, geoJSON, tileLayer, Map, latLngBounds, layerGroup, Control } from 'leaflet';
+import { Component, EventEmitter, HostListener, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
+import { latLng, MapOptions, geoJSON, tileLayer, Map, latLngBounds, layerGroup } from 'leaflet';
import { Structure } from '../../models/structure.model';
import { GeojsonService } from '../../services/geojson.service';
import { MapService } from '../services/map.service';
import * as _ from 'lodash';
import { GeoJsonProperties } from '../models/geoJsonProperties.model';
import { MarkerType } from './markerType.enum';
-import { typeStructureEnum } from '../../shared/enum/typeStructure.enum';
import metropole from '../../../assets/geojson/metropole.json';
import brignais from '../../../assets/geojson/brignais.json';
import L from 'leaflet';
@@ -245,7 +235,7 @@ export class MapComponent implements OnChanges {
type: brignais.features[0].geometry.type,
coordinates: brignais.features[0].geometry.coordinates,
} as any,
- { style: () => ({ color: '#d50000', fillOpacity: 0 }) }
+ { style: () => ({ color: '#a00000', fillOpacity: 0, weight: 1 }) }
)
);
}
@@ -257,7 +247,7 @@ export class MapComponent implements OnChanges {
type: metropole.features[0].geometry.type,
coordinates: metropole.features[0].geometry.coordinates,
} as any,
- { style: () => ({ color: '#d50000', fillOpacity: 0 }) }
+ { style: () => ({ color: '#a00000', fillOpacity: 0, weight: 1 }) }
)
);
}
diff --git a/src/app/map/services/map.service.ts b/src/app/map/services/map.service.ts
index 52d5ba0b7e3a8f70c0c8d4aaf4d3dcfd1b0b911f..901b4d615a3b201c076ad3223320b512d51ab6c3 100644
--- a/src/app/map/services/map.service.ts
+++ b/src/app/map/services/map.service.ts
@@ -9,16 +9,9 @@ import { MarkerType } from '../components/markerType.enum';
export class MapService {
private static markersList = {};
private isMarkerActive = false;
- public markerIconHover = divIcon({
- className: null,
- html: '<svg width="40" height="46"><use xlink:href="assets/ico/sprite.svg#map-marker-locate"></use></svg>',
- iconSize: [40, 46],
- iconAnchor: [20, 46],
- popupAnchor: [0, -46],
- });
public markerIconActive = divIcon({
className: null,
- html: '<svg width="40" height="46" fill="#d50000"><use xlink:href="assets/ico/sprite.svg#map-marker"></use></svg>',
+ html: '<svg width="40" height="46" fill="#A00000"><use xlink:href="assets/ico/sprite.svg#map-marker"></use></svg>',
iconSize: [40, 46],
iconAnchor: [20, 46],
popupAnchor: [0, -46],
@@ -33,13 +26,8 @@ export class MapService {
});
public markerIconMdm = divIcon({
className: null,
- html: '<svg width="19" height="24"><use xlink:href="assets/ico/sprite.svg#mdm"></use></svg>',
- iconSize: [19, 24],
- iconAnchor: [9, 0],
- });
- public markerIconMdmHover = divIcon({
- className: null,
- html: '<svg width="19" height="24"><use xlink:href="assets/ico/sprite.svg#mdm-hover"></use></svg>',
+ html:
+ '<svg width="19" height="24" fill="#D4C4A9" class="mdm"><use xlink:href="assets/ico/sprite.svg#mdm"></use></svg>',
iconSize: [19, 24],
iconAnchor: [9, 0],
});
@@ -63,7 +51,7 @@ export class MapService {
if (id) {
MapService.markersList[id] = marker;
}
- return this.bindMouseEventOnMarker(marker, this.getMarkerIcon(markerType), this.getMarkerIconHover(markerType));
+ return marker;
}
private getLayerAttributton(markerType: MarkerType): string {
@@ -82,32 +70,11 @@ export class MapService {
}
}
- private getMarkerIconHover(markerType: MarkerType): DivIcon {
- if (markerType === MarkerType.mdm) {
- return this.markerIconMdmHover;
- } else {
- return this.markerIconHover;
- }
- }
-
- private bindMouseEventOnMarker(marker: Marker, regularIcon: DivIcon, hoverIcon: DivIcon): Marker {
- marker.on('mouseover', (e) => {
- if (marker.getIcon() === regularIcon) {
- marker.setIcon(hoverIcon);
- }
- });
-
- marker.on('mouseout', (e) => {
- marker.setIcon(regularIcon);
- });
- return marker;
- }
-
/**
* @param id marker id
*/
public setActiveMarker(id: string): void {
- this.getMarker(id).setIcon(this.getMarkerIconHover(MarkerType.structure));
+ this.getMarker(id).setIcon(this.markerIconActive);
}
public setUnactiveMarker(id: string): void {
diff --git a/src/app/models/owner.model.ts b/src/app/models/owner.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..fb682b34669acc0028c06647b6d899c2e1852ece
--- /dev/null
+++ b/src/app/models/owner.model.ts
@@ -0,0 +1,4 @@
+export class Owner {
+ email: string;
+ id: string;
+}
diff --git a/src/app/models/structureWithOwners.model.ts b/src/app/models/structureWithOwners.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..e3d2a6340abb8cf3ac225e16e43a0657c6f41d38
--- /dev/null
+++ b/src/app/models/structureWithOwners.model.ts
@@ -0,0 +1,7 @@
+import { Owner } from './owner.model';
+import { Structure } from './structure.model';
+
+export class StructureWithOwners {
+ structure: Structure;
+ owners: Owner[];
+}
diff --git a/src/app/models/temp-user.model.ts b/src/app/models/temp-user.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8540ce74e9034cc65018c679c39d06ff693449fc
--- /dev/null
+++ b/src/app/models/temp-user.model.ts
@@ -0,0 +1,5 @@
+export class TempUser {
+ _id: string;
+ email: string;
+ pendingStructuresLink: string[];
+}
diff --git a/src/app/profile/enum/TypeModalProfile.enum.ts b/src/app/profile/enum/TypeModalProfile.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4608f9bf5127e86074b1e7c50348f7cbbd7491cd
--- /dev/null
+++ b/src/app/profile/enum/TypeModalProfile.enum.ts
@@ -0,0 +1,6 @@
+export enum TypeModalProfile {
+ password = 'password',
+ email = 'email',
+ deleteAccount = 'deleteAccount',
+ addAccount = 'addAccount',
+}
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index a26b3822a5cdc7abd31c1c931049c3409d922998..4a5e03d1729859617cada8f17a4d4ec555a7ee37 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -1,100 +1,55 @@
-<div fxLayout="column" class="content-container full-screen">
- <div class="section-container" fxLayout="column" fxLayoutAlign="center center">
- <h1>Profil</h1>
- <div *ngIf="userProfile" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
- <p>Id: {{ userProfile._id }}</p>
- <p>Email: {{ userProfile.email }}</p>
- <button (click)="logout()">Se déconnecter</button>
- <p fxLayout="column" *ngIf="userProfile.structuresLink.length > 0">
- Mes structures :
- <span *ngFor="let structureId of userProfile.structuresLink">
- <strong>{{ structureId }}</strong>
- </span>
- </p>
- <p fxLayout="column" *ngIf="userProfile.pendingStructuresLink.length > 0">
- Mes structures en attente de validation:
- <span *ngFor="let structureId of userProfile.pendingStructuresLink">
- <strong>{{ structureId }}</strong>
- </span>
- </p>
- <button (click)="toogleAddStructure()">Ajouter une structure</button>
- <button (click)="toogleChangeEmail()">Changer d'email</button>
- <form
- *ngIf="changeEmail"
- fxLayout="column"
- fxLayoutGap="10px"
- [formGroup]="formEmail"
- (ngSubmit)="onSubmitEmail()"
- >
- <div class="form-group">
- <label for="email">Email</label>
- <input type="email" autocomplete="on" formControlName="email" class="form-control" />
- <div *ngIf="submitted" class="invalid-feedback">
- <app-validator-form [control]="formEmail.controls.email"></app-validator-form>
- </div>
- </div>
- <div class="form-group">
- <button type="submit" [disabled]="loading" class="btn btn-primary">Appliquer</button>
+<div fxLayout="column" class="content-container full-screen" *ngIf="userProfile">
+ <div class="profileSection">
+ <div class="section-container" fxLayout="row">
+ <svg class="cameraProfile" aria-hidden="true">
+ <use [attr.xlink:href]="'assets/ico/sprite.svg#camera'"></use>
+ </svg>
+ <div class="profileInformation" fxLayoutGap="18px" fxLayout="column">
+ <div fxLayout="row" fxLayoutAlign="space-between center">
+ <p class="profileName">{{ userProfile.name | titlecase }} {{ userProfile.surname | titlecase }}</p>
+ <button class="btn-primary" (click)="logout()">Déconnexion</button>
</div>
- </form>
- <button (click)="toogleChangePassword()">Changer de mot de passe</button>
-
- <form *ngIf="changePassword" fxLayout="column" fxLayoutGap="10px" [formGroup]="form" (ngSubmit)="onSubmit()">
- <div class="form-group">
- <label for="oldPassword">Ancien mot de passe</label>
- <input
- type="password"
- autocomplete="on"
- formControlName="oldPassword"
- class="form-control"
- [ngClass]="{ 'is-invalid': submitted && f.oldPassword.errors }"
- />
- <div *ngIf="submitted && f.oldPassword.errors" class="invalid-feedback">
- <div *ngIf="f.oldPassword.errors.required">L'Ancien mot de passe est obligatoire</div>
+ <div class="profileEmail" fxLayout="column">
+ <span>Identifiant</span>
+ <div fxLayout="row" fxLayoutAlign="space-between center">
+ <p>{{ userProfile.email }}</p>
+ <app-structure-options-modal
+ [userProfile]="userProfile"
+ (closed)="ngOnInit()"
+ ></app-structure-options-modal>
</div>
</div>
- <div class="form-group">
- <label for="password">Mot de passe</label>
- <input
- type="password"
- autocomplete="on"
- formControlName="password"
- class="form-control"
- [ngClass]="{ 'is-invalid': submitted && f.password.errors }"
- />
- <div *ngIf="submitted && f.password.errors" class="invalid-feedback">
- <div *ngIf="f.password.errors.required">Le mot de passe est obligatoire</div>
- <div *ngIf="f.password.errors.pattern">
- Le mot de passe doit avoir au minimun 8 caractères, une majuscule, une minuscule, un chiffre et un
- caractère spécial.
+ </div>
+ </div>
+ </div>
+ <div class="structureSection">
+ <div class="section-container" fxLayoutGap="18px" fxLayout="column">
+ <ng-container *ngIf="userProfile.structuresLink.length > 0 && structures">
+ <div class="structureCard" *ngFor="let s of structures; let i = index">
+ <div class="structureInfo" fxLayout="column" fxLayoutGap="14px">
+ <div fxLayout="row" fxLayoutAlign="space-between start" fxLayoutGap="20px">
+ <a class="structureName" routerLink="/home" [state]="{ data: s.structure }">{{
+ s.structure.structureName
+ }}</a>
+ <app-structure-options-modal [structure]="s" (closed)="ngOnInit()"></app-structure-options-modal>
+ </div>
+ <div fxLayout="column" fxLayoutGap="14px">
+ <p class="ownerName" *ngFor="let owner of s.owners">{{ owner.email }}</p>
</div>
</div>
</div>
- <div class="form-group">
- <label for="confirmPassword">Confirmation du mot de passe</label>
- <input
- type="password"
- autocomplete="on"
- formControlName="confirmPassword"
- class="form-control"
- [ngClass]="{ 'is-invalid': submitted && f.confirmPassword.errors }"
- />
- <div *ngIf="submitted && f.confirmPassword.errors" class="invalid-feedback">
- <div *ngIf="f.confirmPassword.errors.required">La confirmation du mot de passe est obligatoire</div>
- <div *ngIf="f.confirmPassword.errors.mustMatch">Les mot de passe ne sont pas les mêmes</div>
- </div>
- </div>
+ </ng-container>
- <div class="form-group">
- <button type="submit" [disabled]="loading" class="btn btn-primary">Appliquer</button>
- </div>
- </form>
+ <div class="addSection" fxLayout="row" fxLayoutAlign="center center">
+ <app-button
+ class="hide-on-print"
+ [type]="'button'"
+ [style]="'buttonWithHash'"
+ [text]="'Ajouter une structure'"
+ [iconBtn]="'add'"
+ (action)="addStructure()"
+ ></app-button>
+ </div>
</div>
</div>
- <app-structureForm
- *ngIf="addStructure"
- [profile]="userProfile"
- (closeEvent)="toogleAddStructure($event)"
- (clickOutside)="toogleAddStructure()"
- ></app-structureForm>
</div>
diff --git a/src/app/profile/profile.component.scss b/src/app/profile/profile.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..50f831bd0b480351d3ba1edd610a51b51604c058 100644
--- a/src/app/profile/profile.component.scss
+++ b/src/app/profile/profile.component.scss
@@ -0,0 +1,83 @@
+@import '../../assets/scss/color';
+@import '../../assets/scss/typography';
+@import '../../assets/scss/hyperlink';
+@import '../../assets/scss/shapes';
+@import '../../assets/scss/breakpoint';
+
+.content-container {
+ padding-top: 0;
+}
+.section-container {
+ width: 50%;
+ padding: 20px 0;
+ .profileInformation {
+ width: 100%;
+ }
+ .cameraProfile {
+ width: 128px;
+ margin-right: 16px;
+ height: 113px;
+ }
+ @media #{$tablet} {
+ .cameraProfile {
+ display: none;
+ }
+ width: 70%;
+ }
+ @media #{$large-phone} {
+ width: 90%;
+ }
+}
+.profileSection {
+ background: $white;
+ border-bottom: 1px solid $grey-4;
+ .profileName {
+ @include cn-bold-26;
+ margin: 0 !important;
+ }
+ .profileEmail {
+ span {
+ @include cn-regular-16;
+ color: $grey-2;
+ }
+ p {
+ margin: 0;
+ @include cn-regular-18;
+ }
+ }
+}
+.structureSection {
+ margin-bottom: 108px;
+ .structureCard {
+ border: 1px solid $grey-4;
+ border-radius: 6px;
+ .structureInfo {
+ border-radius: 6px;
+ background: $white;
+ min-height: 100px;
+ padding: 33px 55px;
+ @media #{$large-phone} {
+ padding: 33px 25px;
+ }
+ a {
+ margin: 0;
+ &.structureName {
+ @include cn-bold-26;
+ color: $secondary-color;
+ text-decoration: underline;
+ }
+ }
+ .ownerName {
+ @include cn-regular-18;
+ color: $grey-2;
+ }
+ }
+ @include background-hash($grey-2);
+ }
+}
+.addSection {
+ button {
+ background: $red-default;
+ color: $white;
+ }
+}
diff --git a/src/app/profile/profile.component.ts b/src/app/profile/profile.component.ts
index 5f3b49a7389039c7ede12fd8154d5d721944a2a7..0b3b1d36c276ff97445d274268e12faa1ce09d7a 100644
--- a/src/app/profile/profile.component.ts
+++ b/src/app/profile/profile.component.ts
@@ -1,8 +1,9 @@
import { Component, OnInit } from '@angular/core';
-import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { StructureWithOwners } from '../models/structureWithOwners.model';
import { User } from '../models/user.model';
import { AuthService } from '../services/auth.service';
-import { MustMatch } from '../shared/validator/form';
+import { StructureService } from '../services/structure.service';
import { ProfileService } from './services/profile.service';
@Component({
@@ -11,96 +12,30 @@ import { ProfileService } from './services/profile.service';
styleUrls: ['./profile.component.scss'],
})
export class ProfileComponent implements OnInit {
- public form: FormGroup;
public userProfile: User;
- public submitted = false;
- public changePassword = false;
- public loading = false;
- public changeEmail = false;
- public formEmail: FormGroup;
- public addStructure = false;
+ public structures: StructureWithOwners[] = [];
constructor(
- private authService: AuthService,
- private formBuilder: FormBuilder,
- private profileService: ProfileService
+ private profileService: ProfileService,
+ private structureService: StructureService,
+ private router: Router,
+ private authService: AuthService
) {}
ngOnInit(): void {
this.profileService.getProfile().then((profile) => {
this.userProfile = profile;
+ this.structures = [];
+ profile.structuresLink.forEach((structureId) => {
+ this.structureService.getStructureWithOwners(structureId, profile).subscribe((s) => {
+ this.structures.push(s);
+ });
+ });
});
- this.initForm();
}
- public initForm(): void {
- this.form = this.formBuilder.group(
- {
- oldPassword: [
- '',
- [Validators.required, Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/)], //NOSONAR
- ],
- password: [
- '',
- [Validators.required, Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/)], //NOSONAR
- ],
- confirmPassword: [''],
- },
- { validator: MustMatch('password', 'confirmPassword') }
- );
- this.formEmail = this.formBuilder.group({
- email: ['', [Validators.required, Validators.pattern('[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,3}$')]],
- });
- }
-
- // getter for form fields
- get f(): { [key: string]: AbstractControl } {
- return this.form.controls;
- }
-
- public toogleChangePassword(): void {
- this.changePassword = !this.changePassword;
- }
- public toogleAddStructure(): void {
- this.addStructure = !this.addStructure;
- }
-
- public toogleChangeEmail(): void {
- this.changeEmail = !this.changeEmail;
- }
-
- public onSubmitEmail(): void {
- this.submitted = true;
- if (this.formEmail.invalid) {
- return;
- }
- this.loading = true;
- this.profileService.changeEmail(this.formEmail.value.email, this.userProfile.email).subscribe(
- () => {
- this.toogleChangeEmail();
- this.loading = false;
- },
- (err) => {
- this.loading = false;
- }
- );
- }
- public onSubmit(): void {
- this.submitted = true;
- // stop here if form is invalid
- if (this.form.invalid) {
- return;
- }
- this.loading = true;
-
- this.profileService.changePassword(this.form.value.password, this.form.value.oldPassword).subscribe(
- () => {
- this.toogleChangePassword();
- },
- (error) => {
- this.loading = false;
- }
- );
+ public addStructure(): void {
+ this.router.navigateByUrl('/create-structure');
}
public logout(): void {
diff --git a/src/app/profile/services/profile.service.ts b/src/app/profile/services/profile.service.ts
index 849d148b45d4d0ca414206768b4a165ac7b17985..5ac816cbf5135eb07f444b631b973a16c6665d71 100644
--- a/src/app/profile/services/profile.service.ts
+++ b/src/app/profile/services/profile.service.ts
@@ -15,7 +15,7 @@ export class ProfileService {
constructor(private http: HttpClient, private authService: AuthService) {}
public async getProfile(): Promise<User> {
- if (this.authService.isLoggedIn() && !this.currentProfile) {
+ if (this.authService.isLoggedIn()) {
const profile = await this.http.get<User>(`${this.baseUrl}/profile`).toPromise();
this.currentProfile = profile;
}
@@ -25,6 +25,9 @@ export class ProfileService {
public setProfile(profile: User): void {
this.currentProfile = profile;
}
+ public deleteProfile(): Observable<User> {
+ return this.http.delete<User>(`${this.baseUrl}`);
+ }
public isLinkedToStructure(idStructure: string): boolean {
if (!this.currentProfile) {
@@ -68,7 +71,7 @@ export class ProfileService {
return this.http.post<any>(`${this.baseUrl}/change-email`, { newEmail, oldEmail });
}
- public isEmailAlreadyUsed(newMail: string): Observable<Boolean> {
- return this.http.post<Boolean>(`${this.baseUrl}/verify-exist-user`, { newMail });
+ public isEmailAlreadyUsed(newMail: string): Observable<boolean> {
+ return this.http.post<boolean>(`${this.baseUrl}/verify-exist-user`, { newMail });
}
}
diff --git a/src/app/reset-email/reset-email.component.scss b/src/app/reset-email/reset-email.component.scss
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/src/app/reset-email/reset-email.component.ts b/src/app/reset-email/reset-email.component.ts
index 0c92a21cad4b9d3490cc6540cc89c2c815a84b65..705a40ecca9024dc27d8e556177891b385c81116 100644
--- a/src/app/reset-email/reset-email.component.ts
+++ b/src/app/reset-email/reset-email.component.ts
@@ -1,11 +1,10 @@
import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
import { ProfileService } from '../profile/services/profile.service';
import { AuthService } from '../services/auth.service';
@Component({
selector: 'app-reset-email',
templateUrl: './reset-email.component.html',
- styleUrls: ['./reset-email.component.scss'],
})
export class ResetEmailComponent implements OnInit {
public token: string;
diff --git a/src/app/reset-password/reset-password.component.ts b/src/app/reset-password/reset-password.component.ts
index 3f3187b999e45742c1d5574b85248dfba93094a4..153f2dc8c1fb5b591c179a6860eb6b67b5358652 100644
--- a/src/app/reset-password/reset-password.component.ts
+++ b/src/app/reset-password/reset-password.component.ts
@@ -3,6 +3,7 @@ import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/fo
import { ActivatedRoute, Router } from '@angular/router';
import { AuthService } from '../services/auth.service';
import { MustMatch } from '../shared/validator/form';
+import { CustomRegExp } from '../utils/CustomRegExp';
@Component({
selector: 'app-reset-password',
@@ -36,10 +37,7 @@ export class ResetPasswordComponent implements OnInit {
private initPasswordForm(): void {
this.resetFormChangePassword = this.formBuilder.group(
{
- password: [
- '',
- [Validators.required, Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/)], //NOSONAR
- ],
+ password: ['', [Validators.required, Validators.pattern(CustomRegExp.PASSWORD)]],
confirmPassword: [''],
},
{ validator: MustMatch('password', 'confirmPassword') }
diff --git a/src/app/resolvers/temp-user.resolver.ts b/src/app/resolvers/temp-user.resolver.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2ae604aa6396df43cb2e23ce9837efde3439ba1b
--- /dev/null
+++ b/src/app/resolvers/temp-user.resolver.ts
@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router';
+import { Observable } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
+import { TempUser } from '../models/temp-user.model';
+import { TempUserService } from '../services/temp-user.service';
+
+@Injectable()
+export class TempUserResolver implements Resolve<TempUser> {
+ constructor(private tempUserService: TempUserService, private router: Router) {}
+
+ resolve(route: ActivatedRouteSnapshot): Observable<TempUser> {
+ const userId = route.queryParams.id;
+ return this.tempUserService.getUser(userId).pipe(
+ map((res) => res),
+ catchError(() => {
+ this.router.navigate(['/home']);
+ return new Observable<TempUser>();
+ })
+ );
+ }
+}
diff --git a/src/app/services/structure.service.ts b/src/app/services/structure.service.ts
index e370f3c669393d4ecb92c227519ea2b4430cacce..b94990936c418e29db4af3b19cc086e9c2e64cf7 100644
--- a/src/app/services/structure.service.ts
+++ b/src/app/services/structure.service.ts
@@ -12,6 +12,8 @@ import { Weekday } from '../structure-list/enum/weekday.enum';
import { Time } from '../models/time.model';
import { Filter } from '../structure-list/models/filter.model';
import { User } from '../models/user.model';
+import { StructureWithOwners } from '../models/structureWithOwners.model';
+import { TempUser } from '../models/temp-user.model';
@Injectable({
providedIn: 'root',
@@ -50,10 +52,25 @@ export class StructureService {
return this.http.get<Structure>(`${this.baseUrl}/${id}`);
}
+ public validateStructureJoin(id: string, userId: string, state: boolean): Observable<Structure> {
+ return this.http.post<any>(`${this.baseUrl}/${id}/join/${userId}/${state}`, null);
+ }
+
+ public joinStructure(id: string, email: string): Observable<Structure> {
+ return this.http.post<any>(`${this.baseUrl}/${id}/join`, { email });
+ }
+
public delete(id: string): Observable<Structure> {
return this.http.delete<Structure>(`${this.baseUrl}/${id}`);
}
+ public removeOwnerFromStructure(idOwner: string, idStructure: string): Observable<any> {
+ return this.http.delete<any>(`${this.baseUrl}/${idStructure}/owner/${idOwner}`);
+ }
+ public addOwnerToStructure(user: TempUser, idStructure: string): Observable<any> {
+ return this.http.post<any>(`${this.baseUrl}/${idStructure}/addOwner`, user);
+ }
+
public getStructures(filters: Filter[]): Observable<Structure[]> {
if (filters && filters.length > 0) {
let requestUrl = `${this.baseUrl}/search`;
@@ -173,4 +190,7 @@ export class StructureService {
return tabNum[0] + 'h' + tabNum[1];
}
}
+ public getStructureWithOwners(structureId: string, profile: User): Observable<StructureWithOwners> {
+ return this.http.post<any>(`${this.baseUrl}/${structureId}/withOwners`, { emailUser: profile.email });
+ }
}
diff --git a/src/app/services/tcl.service.ts b/src/app/services/tcl.service.ts
index bb14963c6833020fa37f096f5351f409426020ad..03cefff1fee711c73b949693848c719eba986a7d 100644
--- a/src/app/services/tcl.service.ts
+++ b/src/app/services/tcl.service.ts
@@ -1,7 +1,6 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
import { TclStopPoint } from '../models/tclStopPoint.model';
@Injectable({
diff --git a/src/app/services/temp-user.service.ts b/src/app/services/temp-user.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4dd2b45247d4f75f59a3fe3b07f22d611ac71251
--- /dev/null
+++ b/src/app/services/temp-user.service.ts
@@ -0,0 +1,16 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { TempUser } from '../models/temp-user.model';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class TempUserService {
+ private readonly baseUrl = 'api/temp-user';
+ constructor(private http: HttpClient) {}
+
+ public getUser(id: string): Observable<TempUser> {
+ return this.http.get<TempUser>(`${this.baseUrl}/${id}`);
+ }
+}
diff --git a/src/app/shared/components/button/button.component.html b/src/app/shared/components/button/button.component.html
index 099145ec9e14669f605b90b347f249beb29d24a1..dcfb2a0f7d2a438b078f8871f7c192d9e5dd0cb1 100644
--- a/src/app/shared/components/button/button.component.html
+++ b/src/app/shared/components/button/button.component.html
@@ -6,16 +6,10 @@
fxLayout="row center"
class="searchButton withIcon"
fxLayoutAlign="space-between center"
- fxLayoutGap="13px"
+ fxLayoutGap="5px"
>
- <app-svg-icon
- style="height: 100%"
- [type]="'ico'"
- [iconClass]="'icon-32'"
- [icon]="iconBtn"
- [iconColor]="'currentColor'"
- ></app-svg-icon>
- {{ text }}
+ <app-svg-icon style="height: 100%" [type]="'ico'" [icon]="iconBtn" [iconColor]="'currentColor'"></app-svg-icon>
+ <span>{{ text }}</span>
</div>
</button>
</ng-container>
diff --git a/src/app/shared/components/button/button.component.scss b/src/app/shared/components/button/button.component.scss
index 6aecd56b10568465baba8e6b0eb62b1ccca405b2..04a71d5474b03e28d28e5f30fb4f697387116d54 100644
--- a/src/app/shared/components/button/button.component.scss
+++ b/src/app/shared/components/button/button.component.scss
@@ -22,7 +22,7 @@ button {
border: 1px solid;
}
.btnSearch {
- @include background-hash;
+ @include background-hash($grey-2);
border-color: $grey-4;
padding: 0 0 4px 5px;
&:hover {
@@ -45,7 +45,10 @@ button {
padding: 3px 16px 3px 16px;
display: table-cell;
vertical-align: middle;
+ border-radius: 4px;
@include btn-bold;
+ font-size: 16px;
+ border-radius: 4px;
&.withIcon {
color: $black;
height: 36px;
diff --git a/src/app/shared/components/create-account-form/create-account-form.component.spec.ts b/src/app/shared/components/create-account-form/create-account-form.component.spec.ts
index 79e2eb5bec60413f5161ddbd87d43cd1f3e4cc37..1a3aa14de85e4c50d0c3fa29b5f55bbe593e4df6 100644
--- a/src/app/shared/components/create-account-form/create-account-form.component.spec.ts
+++ b/src/app/shared/components/create-account-form/create-account-form.component.spec.ts
@@ -1,5 +1,6 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { CustomRegExp } from '../../../utils/CustomRegExp';
import { MustMatch } from '../../validator/form';
import { CreateAccountFormComponent } from './create-account-form.component';
@@ -12,7 +13,7 @@ describe('CreateAccountFormComponent', () => {
email: new FormControl('test@test.fr', Validators.required),
password: new FormControl('Testaze123!', [
Validators.required,
- Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/), //NOSONAR
+ Validators.pattern(CustomRegExp.PASSWORD), //NOSONAR
]),
confirmPassword: new FormControl('Testaze123!'),
},
diff --git a/src/app/shared/components/create-account-form/create-account-form.component.ts b/src/app/shared/components/create-account-form/create-account-form.component.ts
index 702924838d04cc8c4fb06b91dfaf88d291e8cb70..5d3d73098cdf13521befe8fa2945d1eb748519bf 100644
--- a/src/app/shared/components/create-account-form/create-account-form.component.ts
+++ b/src/app/shared/components/create-account-form/create-account-form.component.ts
@@ -1,6 +1,6 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { AbstractControl, FormControl, FormGroup, Validators } from '@angular/forms';
-import { Regex } from '../../enum/regex.enum';
+import { CustomRegExp } from '../../../utils/CustomRegExp';
import { MustMatch } from '../../validator/form';
@Component({
@@ -19,14 +19,11 @@ export class CreateAccountFormComponent implements OnInit {
ngOnInit(): void {
this.accountForm = new FormGroup(
{
- email: new FormControl('', [Validators.required, Validators.pattern(Regex.email)]),
- name: new FormControl('', [Validators.required, Validators.pattern(Regex.textWithoutNumber)]),
- surname: new FormControl('', [Validators.required, Validators.pattern(Regex.textWithoutNumber)]),
- phone: new FormControl('', [Validators.required, Validators.pattern('([0-9]{2} ){4}[0-9]{2}')]), //NOSONAR
- password: new FormControl('', [
- Validators.required,
- Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/), //NOSONAR
- ]),
+ email: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]),
+ name: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.TEXT_WITHOUT_NUMBER)]),
+ surname: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.TEXT_WITHOUT_NUMBER)]),
+ phone: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.PHONE)]),
+ password: new FormControl('', [Validators.required, Validators.pattern(CustomRegExp.PASSWORD)]),
confirmPassword: new FormControl(''),
},
[MustMatch('password', 'confirmPassword')]
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.ts b/src/app/shared/components/hour-picker/hour-picker.component.ts
index 63f42f543c5790b2439704108135b12edbf340b5..43c401154969cb1808515629f84c906c824b9082 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.ts
+++ b/src/app/shared/components/hour-picker/hour-picker.component.ts
@@ -1,6 +1,5 @@
import { Component, Input, Output, EventEmitter, OnDestroy, OnChanges } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup, Validators } from '@angular/forms';
-import * as _ from 'lodash';
import { Day } from '../../../models/day.model';
import { Time } from '../../../models/time.model';
import { WeekDayEnum } from '../../enum/weekDay.enum';
diff --git a/src/app/shared/components/index.ts b/src/app/shared/components/index.ts
index 4fecd7be063fdc5bf811c6f6105dca31bf35b3b4..9cad91820ad53c6195edba75cd07a1d27d01aac1 100644
--- a/src/app/shared/components/index.ts
+++ b/src/app/shared/components/index.ts
@@ -12,6 +12,8 @@ import { HourPickerComponent } from './hour-picker/hour-picker.component';
import { CopyPasteComponent } from './hour-picker/copy-paste/copy-paste.component';
import { RadioFormComponent } from './radio-form/radio-form.component';
import { ModalConfirmationComponent } from './modal-confirmation/modal-confirmation.component';
+import { StructureOptionsModalComponent } from './structure-options-modal/structure-options-modal.component';
+import { ModalOptionsComponent } from './modal-options/modal-options.component';
// tslint:disable-next-line: max-line-length
export {
@@ -29,6 +31,8 @@ export {
CopyPasteComponent,
RadioFormComponent,
ModalConfirmationComponent,
+ StructureOptionsModalComponent,
+ ModalOptionsComponent,
};
// tslint:disable-next-line:variable-name
@@ -47,4 +51,6 @@ export const SharedComponents = [
CopyPasteComponent,
RadioFormComponent,
ModalConfirmationComponent,
+ StructureOptionsModalComponent,
+ ModalOptionsComponent,
];
diff --git a/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss b/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
index 8b50ba8f37e2ece4fcd66a534a6e91027d7bc364..21be72c1313f6a4029b0ad37ac392ab271c300ef 100644
--- a/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
+++ b/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
@@ -39,7 +39,7 @@
width: 350px;
margin: auto;
border-radius: 6px;
- @include background-hash;
+ @include background-hash($grey-2);
border: 1px solid $grey-4;
margin-top: 50vh;
transform: translateY(-50%);
diff --git a/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts b/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
index 8c75b179fcbb2de19e0dc0e8c3f8f7d29af5ffed..a143aa820f4aa0785d96f603b7010f7a6c54bd0f 100644
--- a/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
+++ b/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
@@ -1,5 +1,4 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { Subject } from 'rxjs';
@Component({
selector: 'app-modal-confirmation',
diff --git a/src/app/shared/components/modal-options/modal-options.component.html b/src/app/shared/components/modal-options/modal-options.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..0e45ca7cc1e91a5f82d66650fc0b615808afc922
--- /dev/null
+++ b/src/app/shared/components/modal-options/modal-options.component.html
@@ -0,0 +1,52 @@
+<div class="modalOptions" (clickOutside)="closeModal(0)">
+ <div *ngIf="isModalProfileOpts" class="modalContent" fxLayout="column" fxLayoutGap="10px">
+ <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="9px">
+ <app-svg-icon [type]="'ico'" [iconColor]="inherit" [icon]="'email'"></app-svg-icon>
+ <p (click)="closeModal(functionType.changeEmail)">Changer mon courriel</p>
+ </div>
+ <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="9px">
+ <app-svg-icon [type]="'ico'" [iconColor]="inherit" [icon]="'password'"></app-svg-icon>
+ <p (click)="closeModal(functionType.changePassword)">Changer mon mot de passe</p>
+ </div>
+ <div fxLayout="row" class="deleteItem" fxLayoutAlign="start center" fxLayoutGap="9px">
+ <app-svg-icon [type]="'ico'" [iconColor]="inherit" [icon]="'cancel'"></app-svg-icon>
+ <p (click)="closeModal(functionType.deleteAccount)">Supprimer mon compte</p>
+ </div>
+ </div>
+ <div *ngIf="!isModalProfileOpts" class="modalContent" fxLayout="column" fxLayoutGap="10px">
+ <div (click)="closeModal(functionType.addUser)" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="9px">
+ <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'add'"></app-svg-icon>
+ <p>Ajouter un compte</p>
+ </div>
+ <div
+ (click)="hasOwners ? closeModal(functionType.removeUser) : null"
+ fxLayout="row"
+ fxLayoutAlign="start center"
+ fxLayoutGap="9px"
+ [ngClass]="{ invalid: !hasOwners }"
+ >
+ <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'remove'"></app-svg-icon>
+ <p>Supprimer un compte</p>
+ </div>
+ <div
+ *ngIf="!isEditFormView"
+ (click)="closeModal(functionType.editStructure)"
+ fxLayout="row"
+ fxLayoutAlign="start center"
+ fxLayoutGap="9px"
+ >
+ <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'edit'"></app-svg-icon>
+ <p>Modifier la structure</p>
+ </div>
+ <div
+ (click)="closeModal(functionType.removeStructure)"
+ fxLayout="row"
+ class="deleteItem"
+ fxLayoutAlign="start center"
+ fxLayoutGap="9px"
+ >
+ <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'cancel'"></app-svg-icon>
+ <p>Supprimer la structure</p>
+ </div>
+ </div>
+</div>
diff --git a/src/app/shared/components/modal-options/modal-options.component.scss b/src/app/shared/components/modal-options/modal-options.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..33159ef26d8514ce033954ebc711b493e2be634a
--- /dev/null
+++ b/src/app/shared/components/modal-options/modal-options.component.scss
@@ -0,0 +1,36 @@
+@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/typography';
+@import '../../../../assets/scss/shapes';
+@import '../../../../assets/scss/z-index';
+
+.modalOptions {
+ width: 300px;
+ background-color: $white;
+ position: absolute;
+ z-index: $modal-z-index;
+ list-style-type: none;
+ @include background-hash($secondary-color);
+ border: 1px solid $secondary-color;
+ border-radius: 6px;
+ .modalContent {
+ background: $white;
+ border-radius: 6px;
+ padding: 25px 22px 18px 22px;
+ div {
+ cursor: pointer;
+ &.invalid {
+ opacity: 0.4;
+ cursor: default;
+ }
+ }
+ p {
+ @include cn-bold-16;
+ white-space: nowrap;
+ margin: 0;
+ }
+ .deleteItem {
+ color: $red-default;
+ fill: $red-default;
+ }
+ }
+}
diff --git a/src/app/shared/components/modal-options/modal-options.component.spec.ts b/src/app/shared/components/modal-options/modal-options.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b1b9a866a01182df9eb008bd88e85a1a4da4dab5
--- /dev/null
+++ b/src/app/shared/components/modal-options/modal-options.component.spec.ts
@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ModalOptionsComponent } from './modal-options.component';
+
+describe('ModalConfirmationComponent', () => {
+ let component: ModalOptionsComponent;
+ let fixture: ComponentFixture<ModalOptionsComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ModalOptionsComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ModalOptionsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/modal-options/modal-options.component.ts b/src/app/shared/components/modal-options/modal-options.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4de502a5c414fe46cc6ebf71b77002bb53ba0276
--- /dev/null
+++ b/src/app/shared/components/modal-options/modal-options.component.ts
@@ -0,0 +1,22 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { FunctionTypeModalOptions } from '../../enum/functionTypeModalOptions.enum';
+
+@Component({
+ selector: 'app-modal-options',
+ templateUrl: './modal-options.component.html',
+ styleUrls: ['./modal-options.component.scss'],
+})
+export class ModalOptionsComponent implements OnInit {
+ functionType = FunctionTypeModalOptions;
+
+ constructor() {}
+ @Input() isModalProfileOpts = false;
+ @Input() hasOwners = true;
+ @Input() public isEditFormView? = false;
+ @Output() closed = new EventEmitter<number>();
+ ngOnInit(): void {}
+
+ public closeModal(value: number): void {
+ this.closed.emit(value);
+ }
+}
diff --git a/src/app/shared/components/signin-modal/signin-modal.component.scss b/src/app/shared/components/signin-modal/signin-modal.component.scss
index 529354b01162d978a359f67b07f344afaee3ddd9..35477fdaedbfe32561204ef93463e45fc2e9880a 100644
--- a/src/app/shared/components/signin-modal/signin-modal.component.scss
+++ b/src/app/shared/components/signin-modal/signin-modal.component.scss
@@ -5,7 +5,7 @@
width: 100%;
}
h3 {
- @include cn-bold-24;
+ @include cn-bold-26;
color: $black;
margin-top: 0;
}
diff --git a/src/app/shared/components/signup-modal/signup-modal.component.scss b/src/app/shared/components/signup-modal/signup-modal.component.scss
index e5ae20ec96de3a93f39dd838a9960550b74b7892..2133bd8f4c529f1d06136da9462d7588b900d632 100644
--- a/src/app/shared/components/signup-modal/signup-modal.component.scss
+++ b/src/app/shared/components/signup-modal/signup-modal.component.scss
@@ -11,7 +11,7 @@
color: $orange-warning;
}
h3 {
- @include cn-bold-24;
+ @include cn-bold-26;
color: $black;
margin-top: 0;
}
diff --git a/src/app/shared/components/signup-modal/signup-modal.component.ts b/src/app/shared/components/signup-modal/signup-modal.component.ts
index eb03ae8924c1ad037628ecdb7a4cbfe776bb0a59..128646d1b68fc4c64146b36cfb96170aef3b6259 100644
--- a/src/app/shared/components/signup-modal/signup-modal.component.ts
+++ b/src/app/shared/components/signup-modal/signup-modal.component.ts
@@ -3,7 +3,7 @@ import { FormGroup, FormBuilder, Validators, AbstractControl } from '@angular/fo
import { ActivatedRoute, Router } from '@angular/router';
import { first } from 'rxjs/operators';
import { AuthService } from '../../../services/auth.service';
-import { Regex } from '../../enum/regex.enum';
+import { CustomRegExp } from '../../../utils/CustomRegExp';
@Component({
selector: 'app-signup-modal',
@@ -29,14 +29,8 @@ export class SignUpModalComponent implements OnInit {
ngOnInit(): void {
this.loginForm = this.formBuilder.group({
- email: ['', [Validators.required, Validators.pattern(Regex.email)]],
- password: [
- '',
- [
- Validators.required,
- Validators.pattern(/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/), //NOSONAR
- ],
- ],
+ email: ['', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]],
+ password: ['', [Validators.required, Validators.pattern(CustomRegExp.PASSWORD)]],
});
// get return url from route parameters or default to '/'
this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';
@@ -52,7 +46,8 @@ export class SignUpModalComponent implements OnInit {
}
public sendSwitchToSignIn(): void {
- this.closed.emit(false);
+ this.closed.emit(true);
+ this.router.navigate(['/create-structure']);
}
public swithToResetPassword(): void {
diff --git a/src/app/shared/components/structure-options-modal/structure-options-modal.component.html b/src/app/shared/components/structure-options-modal/structure-options-modal.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..a5f68cc4d0a307ce11d08f91d231ff29168fd1a1
--- /dev/null
+++ b/src/app/shared/components/structure-options-modal/structure-options-modal.component.html
@@ -0,0 +1,227 @@
+<nav aria-label="modalOption">
+ <ul>
+ <li>
+ <button [ngClass]="{ active: active }" (click)="openModalOpts()" class="btn-primary transparent">
+ <app-svg-icon [type]="'ico'" [iconColor]="'inherit'" [icon]="'moreOpts'"></app-svg-icon>
+ </button>
+ <ul *ngIf="showModalOption" class="dropdown">
+ <app-modal-options
+ [isModalProfileOpts]="!structure"
+ [isEditFormView]="structure && isEditFormView"
+ [hasOwners]="structure && structure.owners.length > 0"
+ (closed)="closeModalOpts($event)"
+ ></app-modal-options>
+ </ul>
+ </li>
+ </ul>
+</nav>
+<div *ngIf="editModal" class="modalBackground">
+ <div class="modal" (clickOutside)="closeModalOptsProfile()">
+ <form
+ *ngIf="editModal == typeModalProfile.password"
+ [formGroup]="formPassword"
+ class="contentModal"
+ fxLayout="column"
+ fxLayoutAlign="center start"
+ fxLayoutGap="20px"
+ >
+ <div fxLayout="row" class="headerModal" fxLayoutAlign="space-between center">
+ <h2>Changer de mot de passe</h2>
+ <div class="ico-close-details" (click)="closeModalOptsProfile()"></div>
+ </div>
+ <div class="form-group" fxLayout="column" fxLayoutGap="4px">
+ <label for="oldPassword">Ancien mot de passe</label>
+ <p *ngIf="passwordError" class="special invalid">Votre ancien mot de passe est incorrect.</p>
+ <div fxLayout="row" fxLayoutGap="13px">
+ <input
+ [type]="isShowOldPassword ? 'text' : 'password'"
+ formControlName="oldPassword"
+ class="form-input password"
+ autocomplete="on"
+ />
+ <app-svg-icon
+ (click)="showOldPassword()"
+ [type]="'form'"
+ [iconClass]="'grey'"
+ [icon]="'eyePassword'"
+ ></app-svg-icon>
+ <app-svg-icon *ngIf="passwordError" [type]="'form'" [icon]="'notValidate'"></app-svg-icon>
+ </div>
+ </div>
+ <div class="form-group" fxLayout="column">
+ <label for="password">Nouveau mot de passe</label>
+ <p class="special" [ngClass]="{ invalid: fpass.password.invalid && fpass.password.value }">
+ Le mot de passe doit contenir au minimum : 8 caractères dont un caractère spécial, un caractère en majuscule
+ et un chiffre.
+ </p>
+ <div fxLayout="row" fxLayoutGap="13px">
+ <input
+ [type]="isShowPassword ? 'text' : 'password'"
+ formControlName="password"
+ class="form-input password"
+ autocomplete="on"
+ />
+ <app-svg-icon
+ (click)="showPassword()"
+ [type]="'form'"
+ [iconClass]="'grey'"
+ [icon]="'eyePassword'"
+ ></app-svg-icon>
+ <app-svg-icon *ngIf="fpass.password.valid" [type]="'form'" [icon]="'validate'"></app-svg-icon>
+ <app-svg-icon
+ *ngIf="fpass.password.invalid && fpass.password.value"
+ [type]="'form'"
+ [icon]="'notValidate'"
+ ></app-svg-icon>
+ </div>
+ </div>
+ <div class="form-group" fxLayout="column">
+ <label for="confirmPassword">Confirmation du mot de passe</label>
+ <div fxLayout="row" fxLayoutGap="13px">
+ <input
+ [type]="isShowConfirmPassword ? 'text' : 'password'"
+ formControlName="confirmPassword"
+ class="form-input password"
+ autocomplete="on"
+ />
+ <app-svg-icon
+ (click)="showConfirmPassword()"
+ [type]="'form'"
+ [iconClass]="'grey'"
+ [icon]="'eyePassword'"
+ ></app-svg-icon>
+ <app-svg-icon
+ *ngIf="fpass.confirmPassword.valid && fpass.password.value"
+ [type]="'form'"
+ [icon]="'validate'"
+ ></app-svg-icon>
+ <app-svg-icon
+ *ngIf="fpass.confirmPassword.invalid && fpass.confirmPassword.value"
+ [type]="'form'"
+ [icon]="'notValidate'"
+ ></app-svg-icon>
+ </div>
+ </div>
+ <div class="footerModal" fxLayout="row" fxLayoutAlign="center center">
+ <button
+ type="submit"
+ [ngClass]="{ invalid: formPassword.invalid }"
+ class="btn-primary small leave"
+ (click)="submitPassword()"
+ >
+ Valider
+ </button>
+ </div>
+ </form>
+ <form
+ *ngIf="editModal == typeModalProfile.email"
+ [formGroup]="formEmail"
+ class="contentModal"
+ fxLayout="column"
+ fxLayoutAlign="center start"
+ >
+ <div fxLayout="row" class="headerModal" fxLayoutAlign="space-between center">
+ <h2>Changer de courriel</h2>
+ <div class="ico-close-details" (click)="closeModalOptsProfile()"></div>
+ </div>
+ <div class="form-group" fxLayout="column">
+ <label for="email">Nouveau courriel</label>
+ <p class="special invalid" *ngIf="this.fmail.email.hasError('alreadyExist')">L'email est déja utilisé.</p>
+ <div fxLayout="row" fxLayoutGap="13px">
+ <input
+ type="text"
+ formControlName="email"
+ class="form-input"
+ autocomplete="on"
+ (keyup)="verifyEmailAlreadyUsed($event.target.value, this.fmail.email)"
+ />
+ <app-svg-icon *ngIf="fmail.email.valid" [type]="'form'" [icon]="'validate'"></app-svg-icon>
+ <app-svg-icon
+ *ngIf="fmail.email.invalid && fmail.email.value"
+ [type]="'form'"
+ [icon]="'notValidate'"
+ ></app-svg-icon>
+ </div>
+ </div>
+ <div class="footerModal" fxLayout="row" fxLayoutAlign="center center">
+ <button
+ type="submit"
+ [ngClass]="{ invalid: formEmail.invalid }"
+ class="btn-primary small leave"
+ (click)="submitEmail()"
+ >
+ Valider
+ </button>
+ </div>
+ </form>
+ <div
+ *ngIf="editModal == typeModalProfile.deleteAccount"
+ class="contentModal"
+ fxLayout="column"
+ fxLayoutAlign="center start"
+ fxLayoutGap="30px"
+ >
+ <div fxLayout="row" class="headerModal" fxLayoutAlign="space-between center">
+ <h2>Supprimer un compte</h2>
+ <div class="ico-close-details" (click)="closeModalOptsProfile()"></div>
+ </div>
+ <div fxLayout="column" fxLayoutGap="16px">
+ <div class="row removeOwner" *ngFor="let owner of structure.owners" fxLayoutGap="16px">
+ <button class="btn-primary small" (click)="removeOwner(owner.id)">X</button>
+ <span>
+ {{ owner.email }}
+ </span>
+ </div>
+ </div>
+ <div class="footerModal" fxLayout="row" fxLayoutAlign="center center">
+ <button type="button" class="btn-primary small leave" (click)="closeModalOptsProfile()">Terminer</button>
+ </div>
+ </div>
+ <form
+ *ngIf="editModal == typeModalProfile.addAccount"
+ [formGroup]="formAddAccount"
+ class="contentModal"
+ fxLayout="column"
+ fxLayoutAlign="center start"
+ fxLayoutGap="30px"
+ >
+ <div fxLayout="row" class="headerModal" fxLayoutAlign="space-between center">
+ <h2>Ajouter un compte</h2>
+ <div class="ico-close-details" (click)="closeModalOptsProfile()"></div>
+ </div>
+ <div class="form-group" fxLayout="column">
+ <label for="email">Courriel du compte à ajouter</label>
+ <p *ngIf="ownerAlreadyLinked" class="special invalid">L'email est déjà rattaché à la structure.</p>
+ <div fxLayout="row" fxLayoutGap="13px">
+ <input type="text" formControlName="email" class="form-input" autocomplete="on" />
+ <app-svg-icon *ngIf="fAddAccount.email.valid" [type]="'form'" [icon]="'validate'"></app-svg-icon>
+ <app-svg-icon
+ *ngIf="fAddAccount.email.invalid && fAddAccount.email.value"
+ [type]="'form'"
+ [icon]="'notValidate'"
+ ></app-svg-icon>
+ </div>
+ </div>
+ <div class="footerModal" fxLayout="row" fxLayoutAlign="center center">
+ <button
+ type="submit"
+ [ngClass]="{ invalid: formAddAccount.invalid }"
+ class="btn-primary small leave"
+ (click)="addOwner()"
+ >
+ Envoyer
+ </button>
+ </div>
+ </form>
+ </div>
+</div>
+<app-modal-confirmation
+ [openned]="deleteModalStructureOpenned"
+ [content]="'Voulez-vous vraiment supprimer cette structure ?'"
+ (closed)="deleteStructure($event)"
+></app-modal-confirmation>
+<app-modal-confirmation
+ [openned]="deleteModalAccountOpenned"
+ [content]="'Voulez-vous vraiment supprimer votre compte ?'"
+ (closed)="deleteAccount($event)"
+></app-modal-confirmation>
diff --git a/src/app/shared/components/structure-options-modal/structure-options-modal.component.scss b/src/app/shared/components/structure-options-modal/structure-options-modal.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..6edbfaaaf25e17a16eab777fc26c60686beec7d7
--- /dev/null
+++ b/src/app/shared/components/structure-options-modal/structure-options-modal.component.scss
@@ -0,0 +1,86 @@
+@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/typography';
+
+ul {
+ list-style: none;
+ margin: 0;
+ padding-left: 0;
+}
+
+li {
+ fill: $secondary-color;
+ color: $black;
+ display: block;
+ float: left;
+ position: relative;
+ text-decoration: none;
+ button {
+ width: 40px;
+ fill: $secondary-color;
+ &.active {
+ background-color: $secondary-color;
+ fill: $white;
+ border-color: $secondary-color;
+ }
+ &:hover {
+ background-color: $secondary-color;
+ fill: $white;
+ border-color: $secondary-color;
+ }
+ }
+}
+
+ul li ul {
+ position: absolute;
+ display: block;
+ margin-left: -268px;
+ margin-top: 7px;
+}
+
+button {
+ &.transparent {
+ background: none;
+ border: 1px solid $grey-4;
+ border-radius: 6px;
+ }
+}
+.contentModal {
+ padding: 35px 34px 18px 54px !important;
+ .headerModal {
+ width: 100%;
+ }
+ p {
+ &.special {
+ margin: 8px 0;
+ @include cn-regular-14;
+ color: $grey-3;
+ &.invalid {
+ color: $orange-warning;
+ }
+ }
+ }
+ .removeOwner {
+ button {
+ width: 40px;
+ background-color: $red-default;
+ }
+ span {
+ @include cn-bold-18;
+ }
+ }
+ button {
+ &.invalid {
+ opacity: 0.4;
+ }
+ }
+ .form-group {
+ width: 100%;
+ padding-right: 40px;
+ input {
+ width: 100%;
+ }
+ }
+ .ico-close-details {
+ min-width: 40px;
+ }
+}
diff --git a/src/app/shared/components/structure-options-modal/structure-options-modal.component.spec.ts b/src/app/shared/components/structure-options-modal/structure-options-modal.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3ffffb034a11840470e58c5969e4b8bedc0d616e
--- /dev/null
+++ b/src/app/shared/components/structure-options-modal/structure-options-modal.component.spec.ts
@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StructureOptionsModalComponent } from './structure-options-modal.component';
+
+describe('StructureOptionsModalComponent', () => {
+ let component: StructureOptionsModalComponent;
+ let fixture: ComponentFixture<StructureOptionsModalComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [StructureOptionsModalComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(StructureOptionsModalComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts b/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..dccf978c4e929bdb5d20882d324656e9f4a42366
--- /dev/null
+++ b/src/app/shared/components/structure-options-modal/structure-options-modal.component.ts
@@ -0,0 +1,237 @@
+import { Component, Input, OnInit, Output, EventEmitter } from '@angular/core';
+import { AbstractControl, FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { StructureWithOwners } from '../../../models/structureWithOwners.model';
+import { TempUser } from '../../../models/temp-user.model';
+import { User } from '../../../models/user.model';
+import { TypeModalProfile } from '../../../profile/enum/TypeModalProfile.enum';
+import { ProfileService } from '../../../profile/services/profile.service';
+import { AuthService } from '../../../services/auth.service';
+import { StructureService } from '../../../services/structure.service';
+import { CustomRegExp } from '../../../utils/CustomRegExp';
+import { FunctionTypeModalOptions } from '../../enum/functionTypeModalOptions.enum';
+import { MustMatch } from '../../validator/form';
+
+@Component({
+ selector: 'app-structure-options-modal',
+ templateUrl: './structure-options-modal.component.html',
+ styleUrls: ['./structure-options-modal.component.scss'],
+})
+export class StructureOptionsModalComponent implements OnInit {
+ // Global var
+ @Input() public structure?: StructureWithOwners;
+ @Input() public userProfile?: User;
+ @Input() public isEditFormView? = false;
+ @Output() closed = new EventEmitter();
+ public active: boolean;
+
+ // Password profile
+ public formPassword: FormGroup;
+ public isShowOldPassword = false;
+ public isShowPassword = false;
+ public isShowConfirmPassword = false;
+ public passwordError = false;
+
+ // AddAccount
+ public formAddAccount: FormGroup;
+ public ownerAlreadyLinked = false;
+
+ // Email profile
+ public formEmail: FormGroup;
+ public changeEmail = false;
+
+ // Modal var
+ public editModal: TypeModalProfile;
+ public deleteModalAccountOpenned = false;
+ public deleteModalStructureOpenned = false;
+ public showModalOption = false;
+ public typeModalProfile = TypeModalProfile;
+
+ constructor(
+ private router: Router,
+ private formBuilder: FormBuilder,
+ private profileService: ProfileService,
+ private authService: AuthService,
+ private structureService: StructureService
+ ) {}
+
+ ngOnInit(): void {
+ this.formPassword = this.formBuilder.group(
+ {
+ oldPassword: ['', [Validators.required, Validators.pattern(CustomRegExp.PASSWORD)]],
+ password: ['', [Validators.required, Validators.pattern(CustomRegExp.PASSWORD)]],
+ confirmPassword: [''],
+ },
+ { validator: MustMatch('password', 'confirmPassword') }
+ );
+ this.formEmail = this.formBuilder.group({
+ email: ['', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]],
+ });
+ this.formAddAccount = this.formBuilder.group({
+ email: ['', [Validators.required, Validators.pattern(CustomRegExp.EMAIL)]],
+ });
+ }
+
+ public openModalOpts(): void {
+ this.showModalOption = true;
+ this.active = true;
+ }
+
+ // getter for form fields
+ get fmail(): { [key: string]: AbstractControl } {
+ return this.formEmail.controls;
+ }
+
+ // getter for form fields
+ get fAddAccount(): { [key: string]: AbstractControl } {
+ return this.formAddAccount.controls;
+ }
+
+ // getter for form fields
+ get fpass(): { [key: string]: AbstractControl } {
+ return this.formPassword.controls;
+ }
+
+ public showOldPassword(): void {
+ this.isShowOldPassword = !this.isShowOldPassword;
+ }
+ public showPassword(): void {
+ this.isShowPassword = !this.isShowPassword;
+ }
+ public showConfirmPassword(): void {
+ this.isShowConfirmPassword = !this.isShowConfirmPassword;
+ }
+
+ public closeModalOpts(functionType: number): void {
+ switch (functionType) {
+ case FunctionTypeModalOptions.changeEmail:
+ this.editModal = TypeModalProfile.email;
+ break;
+ case FunctionTypeModalOptions.changePassword:
+ this.editModal = TypeModalProfile.password;
+ break;
+ case FunctionTypeModalOptions.deleteAccount:
+ this.toggleDeleteAccountModal();
+ break;
+ case FunctionTypeModalOptions.addUser:
+ this.editModal = TypeModalProfile.addAccount;
+ this.ownerAlreadyLinked = false;
+ break;
+ case FunctionTypeModalOptions.removeUser:
+ this.editModal = TypeModalProfile.deleteAccount;
+ break;
+ case FunctionTypeModalOptions.editStructure:
+ this.router.navigateByUrl('/create-structure', { state: { data: this.structure.structure } });
+ break;
+ case FunctionTypeModalOptions.removeStructure:
+ this.toggleDeleteStructureModal();
+ break;
+ default:
+ break;
+ }
+ this.showModalOption = false;
+ this.active = false;
+ }
+
+ // Profile Section
+ public closeModalOptsProfile(): void {
+ this.editModal = null;
+ //this.formAddAccount.reset();
+ this.formEmail.reset();
+ this.formPassword.reset();
+ }
+
+ private toggleDeleteAccountModal(): void {
+ this.deleteModalAccountOpenned = !this.deleteModalAccountOpenned;
+ }
+ private toggleDeleteStructureModal(): void {
+ this.deleteModalStructureOpenned = !this.deleteModalStructureOpenned;
+ }
+
+ public deleteAccount(shouldDelete: boolean): void {
+ this.toggleDeleteAccountModal();
+ if (shouldDelete) {
+ this.profileService.deleteProfile().subscribe(() => {
+ this.logout();
+ });
+ }
+ }
+
+ public deleteStructure(shouldDelete: boolean): void {
+ this.toggleDeleteStructureModal();
+ if (shouldDelete) {
+ this.structureService.delete(this.structure.structure._id).subscribe(() => {
+ this.closed.emit('');
+ });
+ }
+ }
+
+ public logout(): void {
+ this.authService.logout();
+ }
+
+ public submitPassword(): void {
+ // stop here if form is invalid
+ if (this.formPassword.invalid) {
+ return;
+ }
+ this.profileService.changePassword(this.formPassword.value.password, this.formPassword.value.oldPassword).subscribe(
+ () => {
+ this.closeModalOptsProfile();
+ this.formPassword.reset();
+ this.passwordError = false;
+ },
+ (error) => {
+ this.passwordError = true;
+ }
+ );
+ }
+
+ public addOwner(): void {
+ // stop here if form is invalid
+ if (this.formAddAccount.invalid) {
+ return;
+ }
+ const user = new TempUser();
+ user.email = this.fAddAccount.email.value;
+ this.structureService.addOwnerToStructure(user, this.structure.structure._id).subscribe(
+ () => {
+ this.closeModalOptsProfile();
+ this.formAddAccount.reset();
+ },
+ (err) => {
+ this.ownerAlreadyLinked = true;
+ }
+ );
+ }
+
+ public removeOwner(owner: string): void {
+ this.structureService.removeOwnerFromStructure(owner, this.structure.structure._id).subscribe(() => {
+ this.structure.owners = this.structure.owners.filter((o) => o.id !== owner);
+ if (this.structure.owners.length == 0) {
+ this.closeModalOptsProfile();
+ }
+ });
+ }
+
+ public verifyEmailAlreadyUsed(inputEmail, formControl: FormControl): void {
+ if (formControl.valid) {
+ this.profileService.isEmailAlreadyUsed(inputEmail).subscribe((isExist) => {
+ if (isExist) {
+ formControl.setErrors({ alreadyExist: true });
+ }
+ });
+ }
+ }
+
+ public submitEmail(): void {
+ // stop here if form is invalid
+ if (this.formEmail.invalid) {
+ return;
+ }
+ this.profileService.changeEmail(this.formEmail.value.email, this.userProfile.email).subscribe(() => {
+ this.closeModalOptsProfile();
+ this.formEmail.reset();
+ });
+ }
+}
diff --git a/src/app/shared/components/structure-type-picker/structure-type-picker.component.scss b/src/app/shared/components/structure-type-picker/structure-type-picker.component.scss
index bac3648addce16805e4e77c19c76de2698adfa70..bd8bc6eb760f0fad43f5f4792cb7d7a7a84690ef 100644
--- a/src/app/shared/components/structure-type-picker/structure-type-picker.component.scss
+++ b/src/app/shared/components/structure-type-picker/structure-type-picker.component.scss
@@ -55,11 +55,9 @@ button {
button {
background: none;
max-width: 114px;
- &:focus {
- }
}
.containerBtn {
- @include background-hash;
+ @include background-hash($grey-2);
padding: 0 0 4px 5px;
border-radius: 4px;
cursor: pointer;
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.scss b/src/app/shared/components/svg-icon/svg-icon.component.scss
index c1377ef4670b31e66e786366e8e6640eed29396e..30dac909497589ddf14edc394d095a23addb0c8b 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.scss
+++ b/src/app/shared/components/svg-icon/svg-icon.component.scss
@@ -1,3 +1,4 @@
+@import '../../../../assets/scss/color';
.icon {
display: inline-block;
height: 2em;
@@ -8,6 +9,10 @@
&.icon-75 {
width: 4.688em;
}
+ &.grey {
+ fill: $grey-3;
+ stroke: $grey-3;
+ }
}
svg {
diff --git a/src/app/shared/components/validator-form/validator-form.component.scss b/src/app/shared/components/validator-form/validator-form.component.scss
index 425065fba366ed1753c84b0469bca4ed8a0f16ef..2031c9c196cc60468b09d87a809290fcbd882d05 100644
--- a/src/app/shared/components/validator-form/validator-form.component.scss
+++ b/src/app/shared/components/validator-form/validator-form.component.scss
@@ -1,5 +1,5 @@
@import '../../../../assets/scss/color';
.alert {
- color: $red-metro;
+ color: $red-default;
}
diff --git a/src/app/shared/enum/functionTypeModalOptions.enum.ts b/src/app/shared/enum/functionTypeModalOptions.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2ec4677afa5704ded37b42bde9165524b78a5640
--- /dev/null
+++ b/src/app/shared/enum/functionTypeModalOptions.enum.ts
@@ -0,0 +1,9 @@
+export enum FunctionTypeModalOptions {
+ changeEmail = 1,
+ changePassword,
+ deleteAccount,
+ addUser,
+ removeUser,
+ editStructure,
+ removeStructure,
+}
diff --git a/src/app/shared/enum/regex.enum.ts b/src/app/shared/enum/regex.enum.ts
deleted file mode 100644
index 6011651df41e73e756b4bacdbcab714fcfe6afe3..0000000000000000000000000000000000000000
--- a/src/app/shared/enum/regex.enum.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export enum Regex {
- email = '[a-z0-9.-]+@[a-z0-9.-]+[.][a-z]{2,3}',
- textWithoutNumber = '[A-Za-zÀ-ÖØ-öø-ÿ- ]{1,}',
- phone = '([0-9]{2} ){4}[0-9]{2}',
- website = '(www[.])?(https://)?(http://)?[a-zA-Z0-9.-]*[.][a-z]{2,3}((/)[a-zA-Z0-9-/]*)?',
- linkedIn = '(linkedin.com/in/.{1,})',
- facebook = '(facebook.com/.{1,})',
- twitter = '(twitter.com/.{1,})',
- instagram = '(instagram.com/.{1,})',
- noNullNumber = '[1-9]{1}[0-9]*',
-}
diff --git a/src/app/structure-join/structure-join.component.html b/src/app/structure-join/structure-join.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..4d51a54ef9e1d015418c59e6fb408c7e8d61eb93
--- /dev/null
+++ b/src/app/structure-join/structure-join.component.html
@@ -0,0 +1,6 @@
+<div fxLayout="column" class="content-container full-screen">
+ <div class="section-container" fxLayout="column" fxLayoutAlign="center center">
+ <h1>Validation de la demande de rattachement</h1>
+ <p>Merci de patienter...</p>
+ </div>
+</div>
diff --git a/src/app/structure-join/structure-join.component.spec.ts b/src/app/structure-join/structure-join.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ab4d922786d1468d788fa84a37c613e4ac723f5b
--- /dev/null
+++ b/src/app/structure-join/structure-join.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StructureJoinComponent } from './structure-join.component';
+
+describe('StructureJoinComponent', () => {
+ let component: StructureJoinComponent;
+ let fixture: ComponentFixture<StructureJoinComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ StructureJoinComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(StructureJoinComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/structure-join/structure-join.component.ts b/src/app/structure-join/structure-join.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..59d6ae04f9a18ac5af666aa681adebe1c1dc3538
--- /dev/null
+++ b/src/app/structure-join/structure-join.component.ts
@@ -0,0 +1,32 @@
+import { Component, OnInit } from '@angular/core';
+import { Router, ActivatedRoute } from '@angular/router';
+import { StructureService } from '../services/structure.service';
+
+@Component({
+ selector: 'app-structure-join',
+ templateUrl: './structure-join.component.html',
+})
+export class StructureJoinComponent implements OnInit {
+ constructor(private router: Router, private route: ActivatedRoute, private structureService: StructureService) {}
+
+ ngOnInit(): void {
+ this.route.queryParamMap.subscribe((params) => {
+ if (
+ params.get('id') &&
+ params.get('userId') &&
+ (params.get('status') === 'true' || params.get('status') === 'false')
+ ) {
+ this.structureService
+ .validateStructureJoin(params.get('id'), params.get('userId'), params.get('status') === 'true' ? true : false)
+ .subscribe(
+ (res) => {
+ this.router.navigateByUrl('/home');
+ },
+ (err) => {
+ this.router.navigateByUrl('/home');
+ }
+ );
+ }
+ });
+ }
+}
diff --git a/src/app/structure-list/components/card/card.component.html b/src/app/structure-list/components/card/card.component.html
index 2a02fd3a659b8916d32cad1cebfe4fe31de54f6e..1111644351601efa7e80b94c4aed177aa1b68b5d 100644
--- a/src/app/structure-list/components/card/card.component.html
+++ b/src/app/structure-list/components/card/card.component.html
@@ -23,6 +23,4 @@
[title]="structure.getEquipmentsTitle(equipement)"
></app-svg-icon>
</div>
-
- <br />
</div>
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index ac49fb15474ee6980ea7122f7aec205bd8915175..687abf098d16804365bd2c3b0d1dd13940809f52 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -6,22 +6,26 @@
.structure {
padding: 12px 0 12px 0;
border-bottom: 1px dashed $grey !important;
+ min-height: 110px;
cursor: pointer;
+ @media #{$large-phone} {
+ height: unset;
+ }
.typeStructure {
color: $grey-3;
@include cn-regular-16;
+ font-style: italic;
}
.structure-name {
- padding-top: 13px;
color: $grey-1;
- @include cn-bold-20;
+ @include cn-bold-18;
padding-bottom: 5px;
width: 100%;
text-transform: capitalize;
}
.distanceStructure {
@include cn-regular-16;
- color: $grey-1;
+ color: $grey-3;
width: 50%;
}
&:last-child {
diff --git a/src/app/structure-list/components/card/card.component.ts b/src/app/structure-list/components/card/card.component.ts
index 8a64274b6377eaca0cc84eb713dbf5dd4067483e..ed8b3158f0c7c573c571d644a3c6eb1a1bbc3206 100644
--- a/src/app/structure-list/components/card/card.component.ts
+++ b/src/app/structure-list/components/card/card.component.ts
@@ -1,8 +1,6 @@
import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
import { Structure } from '../../../models/structure.model';
import { GeojsonService } from '../../../services/geojson.service';
-import { typeStructureEnum } from '../../../shared/enum/typeStructure.enum';
-import { Equipment } from '../../enum/equipment.enum';
@Component({
selector: 'app-card',
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 247ab736150c4e47de06114c05e836feb60b3343..29ac093688d981418ace0315f11cc205bad380ab 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
@@ -37,7 +37,7 @@
border: none;
padding: 0;
}
- @include background-hash;
+ @include background-hash($grey-2);
border: 1px solid $grey-4;
::-webkit-scrollbar {
width: 16px;
@@ -57,7 +57,7 @@
.titleFilter {
display: none !important;
margin: 27px 25px 0px 25px;
- @include cn-bold-28;
+ @include cn-bold-26;
@media #{$large-phone} {
display: flex !important;
}
@@ -109,7 +109,7 @@
padding: 5px 0;
}
h4 {
- @include cn-bold-14;
+ @include cn-bold-16;
line-height: 17px;
text-transform: uppercase;
color: $grey-3;
diff --git a/src/app/structure-list/components/search/search.component.html b/src/app/structure-list/components/search/search.component.html
index 3c933c7123e8b59703b5f923afbe6162cf033648..5294bc01946780b19cc205741efe82869243ec0b 100644
--- a/src/app/structure-list/components/search/search.component.html
+++ b/src/app/structure-list/components/search/search.component.html
@@ -101,7 +101,7 @@
(change)="numericPassCheck($event, 'labelsQualifications')"
/>
<span class="customCheck"></span>
- <div class="label">Pass numérique</div>
+ <div class="label pass">Pass numérique</div>
</label>
</div>
</div>
diff --git a/src/app/structure-list/components/search/search.component.scss b/src/app/structure-list/components/search/search.component.scss
index 8883ab5d8f658b52dfb1f16f2b7945eadecdc4bb..657eeeffebacdf3e224e973e42a0044e3630e76e 100644
--- a/src/app/structure-list/components/search/search.component.scss
+++ b/src/app/structure-list/components/search/search.component.scss
@@ -9,7 +9,7 @@
}
.header {
.title {
- @include cn-bold-20;
+ @include cn-bold-26;
padding: 16px 0 16px 0;
display: flex;
align-items: center;
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 e14724b24e1b6f6eb12813b246c2f0004d16570e..f0393fbffb4fdcaec22531c5ea93b4062d67ef57 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
@@ -102,7 +102,12 @@
</div>
</div>
<div fxLayout="column" fxFlex="50%">
- <div *ngIf="structure.contactMail" fxLayout="row" fxLayoutAlign="none center" fxLayoutGap="13px">
+ <div
+ *ngIf="structure.contactMail && structure.contactMail !== 'unknown@unknown.com'"
+ fxLayout="row"
+ fxLayoutAlign="none center"
+ fxLayoutGap="13px"
+ >
<app-svg-icon [type]="'ico'" [icon]="'email'"></app-svg-icon>
<p>{{ structure.contactMail }}</p>
</div>
@@ -118,6 +123,7 @@
</div>
<div fxLayout="row" fxLayoutAlign="center center" class="hide-on-print">
<a *ngIf="!isClaimed" (click)="handleClaim()" class="primary" tabindex="0">Revendiquer cette structure</a>
+ <a *ngIf="displayJoin()" (click)="handleJoin()" class="primary" tabindex="0">Rejoindre cette structure</a>
<!-- temporary remove edit -->
<a
*ngIf="profileService.isLinkedToStructure(structure._id) || profileService.isAdmin()"
@@ -185,7 +191,7 @@
>
<p class="no-margin">{{ getAccessLabel(acces) }}</p>
</div>
- <p class="no-margin">Accessibles aux personnes à mobilité réduite</p>
+ <p *ngIf="structure.pmrAccess" 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>
@@ -326,3 +332,11 @@
"
(closed)="claimStructure($event)"
></app-modal-confirmation>
+
+<app-modal-confirmation
+ [openned]="joinModalOpenned"
+ [content]="
+ 'Voulez-vous vraiment rejoindre cette structure ? Une demande sera envoyée aux membres pour validation'
+ "
+ (closed)="joinStructure($event)"
+></app-modal-confirmation>
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 d8ea58095fe9cb0a3d540a8df867ecea8a8cc989..5759b6c02e443a3c362e2a3eac1b0ff35c96f2d4 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
@@ -64,7 +64,7 @@ a {
h2 {
margin-top: 0;
margin-bottom: 5px;
- @include cn-regular-24;
+ @include cn-regular-26;
}
h3 {
margin: 0;
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 ecbeb3a00bbb13d79c875ef389b4fbe40fe850b6..1e12ab4d7f70d18919ceff0cf1b10afb59ee230f 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
@@ -36,6 +36,7 @@ export class StructureDetailsComponent implements OnInit {
public currentProfile: User = null;
public deleteModalOpenned = false;
public claimModalOpenned = false;
+ public joinModalOpenned = false;
constructor(
private printService: PrintService,
@@ -122,6 +123,10 @@ export class StructureDetailsComponent implements OnInit {
this.claimModalOpenned = !this.claimModalOpenned;
}
+ public toggleJoinModal(): void {
+ this.joinModalOpenned = !this.joinModalOpenned;
+ }
+
public handleClaim(): void {
if (this.userIsLoggedIn()) {
this.toggleClaimModal();
@@ -130,6 +135,14 @@ export class StructureDetailsComponent implements OnInit {
}
}
+ public handleJoin(): void {
+ if (this.userIsLoggedIn()) {
+ this.toggleJoinModal();
+ } else {
+ this.router.navigate(['create-structure'], { state: { newUser: this.structure, isJoin: true } });
+ }
+ }
+
public deleteStructure(shouldDelete: boolean): void {
this.toggleDeleteModal();
if (shouldDelete) {
@@ -156,6 +169,15 @@ export class StructureDetailsComponent implements OnInit {
}
}
+ public joinStructure(shouldClaim: boolean): void {
+ this.toggleJoinModal();
+ if (shouldClaim) {
+ this.structureService.joinStructure(this.structure._id, this.authService.userValue.username).subscribe((res) => {
+ this.isClaimed = true;
+ });
+ }
+ }
+
public getAccessLabel(accessModality: AccessModality): string {
switch (accessModality) {
case AccessModality.free:
@@ -212,7 +234,7 @@ export class StructureDetailsComponent implements OnInit {
});
}
public canDelete(): boolean {
- if (this.profileService.isAdmin() || this.profileService.isLinkedToStructure(this.structure._id)) {
+ if (this.profileService.isAdmin()) {
return true;
}
return false;
@@ -222,4 +244,10 @@ export class StructureDetailsComponent implements OnInit {
['ordinateurs', 'tablettes', 'bornesNumeriques', 'imprimantes', 'scanners', 'wifiEnAccesLibre'].includes(eqpt)
);
}
+
+ public displayJoin(): boolean {
+ return (
+ !(this.profileService.isLinkedToStructure(this.structure._id) || this.profileService.isAdmin()) && this.isClaimed
+ );
+ }
}
diff --git a/src/app/utils/CustomRegExp.ts b/src/app/utils/CustomRegExp.ts
new file mode 100644
index 0000000000000000000000000000000000000000..a4c02ad0a9a8bc495115182f25daab47e7ee213e
--- /dev/null
+++ b/src/app/utils/CustomRegExp.ts
@@ -0,0 +1,25 @@
+export class CustomRegExp {
+ /**
+ * Validate a password (at least 8 characters, 1 uppercase letter, 1 lowercase letter, 1 number, and 1 special character)
+ */
+ public static readonly PASSWORD: RegExp = /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/; //NOSONAR
+ /**
+ * Validate an email
+ */
+ public static readonly EMAIL: RegExp = /^[a-z0-9.-]+@[a-z0-9.-]+[.][a-z]{2,3}/; //NOSONAR
+ public static readonly TEXT_WITHOUT_NUMBER: RegExp = /^[A-Za-zÀ-ÖØ-öø-ÿ- ]{1,}$/; //NOSONAR
+ /**
+ * Validate a password (at least 8 characters, 1 uppercase letter, 1 lowercase letter, 1 number, and 1 special character)
+ */
+ public static readonly PHONE: RegExp = /^(?:(?:\+|00)|0)\s*[1-9](?:[\s.-]*\d{2}){4}$/; //NOSONAR
+ public static readonly WEBSITE: RegExp = /^(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.[a-zA-Z0-9]+\.[^\s]{2,})/; //NOSONAR
+ public static readonly LINKEDIN: string = '(linkedin.com/in/.{1,})';
+ public static readonly FACEBOOK: string = '(facebook.com/.{1,})';
+ public static readonly TWITTER: string = '(twitter.com/.{1,})';
+ public static readonly INSTAGRAM: string = '(instagram.com/.{1,})';
+ public static readonly NO_NULL_NUMBER: string = '[1-9]{1}[0-9]*?';
+ /**
+ * Validate a location request in search bar
+ */
+ public static readonly LOCATION: RegExp = /^\d+\s[A-z]+\s[A-z]+/g; //NOSONAR
+}
diff --git a/src/assets/form/sprite.svg b/src/assets/form/sprite.svg
index e81f41f7b908f8a64cd22c6b33c646fd3144bc84..1008b4e01af58916b33decdb18da3caa89c2a926 100644
--- a/src/assets/form/sprite.svg
+++ b/src/assets/form/sprite.svg
@@ -302,13 +302,15 @@
<g opacity="0.35" filter="url(#filter0_f)">
<rect x="74.145" y="49.134" width="94.7677" height="60.8093" transform="rotate(-19.503 74.145 49.134)" fill="#348899"/>
</g>
-<path d="M72.012 33.98C69.9322 34.3896 68.691 36.5394 69.3763 38.5454L95.4069 114.744C96.0855 116.73 98.3483 117.677 100.239 116.765L182.813 76.9455C184.422 76.1698 185.188 74.3077 184.592 72.6244L165.466 18.6229C164.886 16.9861 163.194 16.0218 161.49 16.3573L72.012 33.98Z" fill="#C9ECF3" stroke="#83B6C1" stroke-width="3"/>
-<path d="M72.2571 38.0604C70.0496 37.0427 70.4459 33.7921 72.8333 33.3347L161.294 16.3859C163.287 16.0041 164.88 18.0294 164.04 19.8761M72.2571 38.0604L164.04 19.8761M72.2571 38.0604L132.625 65.8898C137.408 68.0943 143.071 65.9885 145.25 61.195L164.04 19.8761M72.2571 38.0604L164.04 19.8761" fill="#EAF8FB" stroke="#83B6C1" stroke-width="3"/>
+<path d="M70.7961 38.0606C70.4045 36.9143 71.1137 35.6858 72.3022 35.4517L161.781 17.8291C162.754 17.6374 163.721 18.1884 164.052 19.1237L183.178 73.1252C183.519 74.0871 183.081 75.1512 182.162 75.5944L99.588 115.414C98.5074 115.935 97.2145 115.394 96.8267 114.259L70.7961 38.0606Z" fill="#C9ECF3"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M71.7226 32.5083L161.201 14.8857C163.635 14.4063 166.052 15.7839 166.88 18.1221L186.006 72.1237C186.858 74.5283 185.763 77.1886 183.465 78.2967L100.891 118.116C98.1898 119.419 94.9573 118.067 93.9878 115.229L67.9572 39.0304C66.9782 36.1647 68.7513 33.0935 71.7226 32.5083ZM72.3023 35.4517C71.1138 35.6858 70.4045 36.9143 70.7961 38.0606L96.8267 114.259C97.2145 115.394 98.5075 115.935 99.588 115.414L182.162 75.5944C183.081 75.1512 183.519 74.0871 183.178 73.1252L164.052 19.1237C163.721 18.1884 162.754 17.6374 161.781 17.8291L72.3023 35.4517Z" fill="#83B6C1"/>
+<path d="M72.8854 36.6982C72.0024 36.2911 72.1609 34.9909 73.1159 34.8079L161.577 17.8591C162.374 17.7064 163.011 18.5165 162.675 19.2552L143.885 60.5741C142.05 64.6107 137.281 66.384 133.254 64.5276L72.8854 36.6982Z" fill="#EAF8FB"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M72.8854 36.6982C72.0024 36.2911 72.1609 34.9909 73.1159 34.8079L161.577 17.8591C162.374 17.7064 163.011 18.5165 162.675 19.2552L143.885 60.5741C142.05 64.6107 137.281 66.384 133.254 64.5276L72.8854 36.6982ZM72.5513 31.8615L161.012 14.9127C164.2 14.3019 166.75 17.5423 165.406 20.4971L146.616 61.816C144.092 67.3663 137.535 69.8047 131.998 67.252L71.6294 39.4227C68.0974 37.7944 68.7316 32.5934 72.5513 31.8615Z" fill="#83B6C1"/>
<path d="M63.4997 63L2.12107 78.1767" stroke="#DC2A59" stroke-width="3" stroke-linecap="round"/>
<path d="M77.0343 97L36.1785 116.5" stroke="#DC2A59" stroke-width="3" stroke-linecap="round"/>
<path d="M70.0344 80L48.5 88" stroke="#DC2A59" stroke-width="3" stroke-linecap="round"/>
<defs>
-<filter id="filter0_f" x="62.145" y="5.49524" width="133.632" height="112.959" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<filter id="filter0_f" x="62.145" y="5.49527" width="133.632" height="112.959" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="6" result="effect1_foregroundBlur"/>
@@ -336,4 +338,9 @@
<path d="M13.25 20.6066L13.25 20" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
-</svg>
\ No newline at end of file
+<symbol id="validate" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="13" cy="13" r="13" fill="#47C562"/>
+<path d="M8 13.8182L11.8889 17L18 10" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+</symbol>
+
+</svg>
diff --git a/src/assets/ico/more_vert_24px.svg b/src/assets/ico/more_vert_24px.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4e88a75153b9bc08d097be036e494df03d3dc87d
--- /dev/null
+++ b/src/assets/ico/more_vert_24px.svg
@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.66675C12.1 7.66675 13 6.76675 13 5.66675C13 4.56675 12.1 3.66675 11 3.66675C9.9 3.66675 9 4.56675 9 5.66675C9 6.76675 9.9 7.66675 11 7.66675ZM11 9.66675C9.9 9.66675 9 10.5667 9 11.6667C9 12.7667 9.9 13.6667 11 13.6667C12.1 13.6667 13 12.7667 13 11.6667C13 10.5667 12.1 9.66675 11 9.66675ZM9 17.6667C9 16.5667 9.9 15.6667 11 15.6667C12.1 15.6667 13 16.5667 13 17.6667C13 18.7667 12.1 19.6667 11 19.6667C9.9 19.6667 9 18.7667 9 17.6667Z" fill="#348899"/>
+</svg>
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index b0ea458404cd7ef25ebac03983fa057927ce59d6..83c868b1bff9b2e989663da7811db4c16992aa04 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -1,7 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg">
<symbol id="map-marker" viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg"><path d="M19.72 43.73l.706.66.683-.683c2.038-2.04 4.04-3.864 5.934-5.588l.179-.163c6.32-5.755 11.624-10.585 11.624-18.493C38.846 9.267 30.59 1 20.402 1 10.214 1 1.957 9.267 1.957 19.463c0 4.152 1.08 7.233 3.179 10.152 2.04 2.84 5.05 5.523 8.833 8.899l.078.07c1.717 1.531 3.607 3.217 5.672 5.147zm6.508-24.267a5.83 5.83 0 01-5.826 5.833 5.83 5.83 0 01-5.826-5.833 5.83 5.83 0 015.826-5.833 5.83 5.83 0 015.826 5.833z"/></symbol>
-<symbol id="map-marker-locate" viewBox="0 0 50 50" xmlns="http://www.w3.org/2000/svg"><path d="M19.72 43.73l.706.66.683-.683c2.038-2.04 4.04-3.864 5.934-5.588l.179-.163c6.32-5.755 11.624-10.585 11.624-18.493C38.846 9.267 30.59 1 20.402 1 10.214 1 1.957 9.267 1.957 19.463c0 4.152 1.08 7.233 3.179 10.152 2.04 2.84 5.05 5.523 8.833 8.899l.078.07c1.717 1.531 3.607 3.217 5.672 5.147zm6.508-24.267a5.83 5.83 0 01-5.826 5.833 5.83 5.83 0 01-5.826-5.833 5.83 5.83 0 015.826-5.833 5.83 5.83 0 015.826 5.833z" fill="#117083" stroke="#fff" stroke-width="2"/></symbol>
-
<symbol id="adress" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M11 2C12.6055 2.0145 14.1397 2.68885 15.265 3.87463C16.3902 5.06042 17.0142 6.66048 16.9998 8.32269C16.9998 11.8208 12.1242 19 11 19C9.87584 19 5.00025 11.8208 5.00025 8.32269C4.98578 6.66048 5.60982 5.06042 6.73504 3.87463C7.86026 2.68885 9.39446 2.0145 11 2ZM10.9999 5.55695C12.0865 5.53677 13.0768 6.19906 13.5059 7.23274C13.9349 8.26643 13.7173 9.4661 12.9553 10.2683C12.1933 11.0704 11.0384 11.3157 10.0329 10.8888C9.02744 10.4619 8.37129 9.44779 8.37266 8.32272C8.36215 6.80858 9.53743 5.57133 10.9999 5.55695Z" fill="#333333"/>
</symbol>
@@ -24,9 +22,9 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 4C4 3.44771 4.44772 3 5 3H14C14.5523 3 15 3.44772 15 4V6H9C8.44772 6 8 6.44772 8 7V18H5C4.44772 18 4 17.5523 4 17V4ZM10 7C9.44772 7 9 7.44772 9 8V20C9 20.5523 9.44771 21 10 21H19C19.5523 21 20 20.5523 20 20V8C20 7.44772 19.5523 7 19 7H10Z" fill="#32383D"/>
</symbol>
-<symbol id="cancel" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M16.9498 5.36385C17.3403 4.97332 17.9734 4.97332 18.364 5.36385C18.7545 5.75437 18.7545 6.38753 18.364 6.77806L7.05026 18.0918C6.65973 18.4823 6.02657 18.4823 5.63605 18.0918C5.24552 17.7012 5.24552 17.0681 5.63605 16.6776L16.9498 5.36385Z" fill="black"/>
-<path d="M18.364 16.6777C18.7545 17.0682 18.7545 17.7013 18.364 18.0919C17.9734 18.4824 17.3403 18.4824 16.9498 18.0919L5.63605 6.77816C5.24552 6.38764 5.24552 5.75447 5.63605 5.36395C6.02657 4.97343 6.65974 4.97343 7.05026 5.36395L18.364 16.6777Z" fill="black"/>
+<symbol id="cancel" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.9498 5.36385C17.3403 4.97332 17.9734 4.97332 18.364 5.36385C18.7545 5.75437 18.7545 6.38753 18.364 6.77806L7.05026 18.0918C6.65973 18.4823 6.02657 18.4823 5.63605 18.0918C5.24552 17.7012 5.24552 17.0681 5.63605 16.6776L16.9498 5.36385Z" stroke="none"/>
+<path d="M18.364 16.6777C18.7545 17.0682 18.7545 17.7013 18.364 18.0919C17.9734 18.4824 17.3403 18.4824 16.9498 18.0919L5.63605 6.77816C5.24552 6.38764 5.24552 5.75447 5.63605 5.36395C6.02657 4.97343 6.65974 4.97343 7.05026 5.36395L18.364 16.6777Z" stroke="none"/>
</symbol>
<symbol id="nok" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -40,10 +38,17 @@
<path d="M11 16.8182L14.8889 20L21 13" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
-<symbol id="add" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M12 5C11.4477 5 11 5.44772 11 6V11H6C5.44772 11 5 11.4477 5 12C5 12.5523 5.44772 13 6 13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V13H18C18.5523 13 19 12.5523 19 12C19 11.4477 18.5523 11 18 11H13V6C13 5.44772 12.5523 5 12 5Z" fill="#333333"/>
+<symbol id="add" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 5C11.4477 5 11 5.44772 11 6V11H6C5.44772 11 5 11.4477 5 12C5 12.5523 5.44772 13 6 13H11V18C11 18.5523 11.4477 19 12 19C12.5523 19 13 18.5523 13 18V13H18C18.5523 13 19 12.5523 19 12C19 11.4477 18.5523 11 18 11H13V6C13 5.44772 12.5523 5 12 5Z" stroke="none"/>
</symbol>
+<symbol id="remove" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.97363 12.9062C6.34733 12.9062 5.89876 12.7877 5.62793 12.5507C5.36556 12.3053 5.23438 11.9879 5.23438 11.5986C5.23438 11.2092 5.36556 10.8961 5.62793 10.6591C5.89876 10.4137 6.34733 10.2952 6.97363 10.3036C14.44 10.3036 10.571 10.3036 17.0156 10.3036C17.6419 10.3036 18.0863 10.4221 18.3486 10.6591C18.6195 10.8961 18.7549 11.2092 18.7549 11.5986C18.7549 11.9879 18.6195 12.3053 18.3486 12.5507C18.0863 12.7877 17.6419 12.9062 17.0156 12.9062C9.63742 12.9062 13.3678 12.9062 6.97363 12.9062Z" stroke="none"/>
+</symbol>
+
+<symbol id="edit" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17.3745 2.62547C17.72 2.28003 18.3461 2.34613 18.7731 2.7731L20.3193 4.3193C20.7463 4.74627 20.8124 5.37243 20.4669 5.71787L18.6115 7.57331L15.5191 4.48091L17.3745 2.62547ZM17.993 8.1918L14.9006 5.0994L5.62344 14.3766L8.71584 17.469L17.993 8.1918ZM8.09736 18.0874L5.00496 14.995L4.74469 15.2553C4.60266 15.3973 4.52461 15.5949 4.52337 15.8155L3.77535 18.7134C3.7736 19.0246 4.0678 19.3188 4.37904 19.3171L7.27695 18.569C7.49751 18.5678 7.69506 18.4897 7.83709 18.3477L8.09736 18.0874Z" stroke="none"/>
+</symbol>
<symbol id="liste" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<rect x="10" y="9" width="16" height="2" rx="1" />
@@ -76,6 +81,11 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.5 4H19.5C20.3284 4 21 4.67157 21 5.5V16.0714C21 16.8998 20.3284 17.5714 19.5 17.5714H3.5C2.67157 17.5714 2 16.8998 2 16.0714V5.5C2 4.67157 2.67157 4 3.5 4ZM2.91716 6.02444C3.04832 5.78143 3.35163 5.69075 3.59464 5.8219L11.2431 9.94966C11.5474 10.1138 11.9148 10.1093 12.2149 9.93753L19.3945 5.82797C19.6341 5.69079 19.9396 5.77387 20.0768 6.01353C20.214 6.25318 20.1309 6.55867 19.8913 6.69585L12.7116 10.8054C12.1116 11.1489 11.3767 11.1581 10.7682 10.8297L3.11971 6.70192C2.8767 6.57077 2.78602 6.26745 2.91716 6.02444Z" fill="#333333"/>
</symbol>
+<symbol id="password" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.89603 10C4.40117 10 4.00001 10.4012 4.00001 10.896L4 18.2042C4 18.699 4.40116 19.1002 4.89602 19.1002H17.1043C17.5992 19.1002 18.0003 18.699 18.0003 18.2042L18.0003 10.896C18.0003 10.4012 17.5992 10 17.1043 10H4.89603ZM12.3442 13.4441C12.3442 13.9365 12.0794 14.367 11.6845 14.6011L12.3442 17.0002H9.65611L10.3158 14.6011C9.92088 14.367 9.65611 13.9365 9.65611 13.4441C9.65611 12.7018 10.2579 12.1 11.0001 12.1C11.7424 12.1 12.3442 12.7018 12.3442 13.4441Z" stroke="none"/>
+<path d="M13.8017 10.0002V7.90011C13.8017 6.35368 12.5481 5.10005 11.0017 5.10005C9.45524 5.10005 8.20161 6.35368 8.20161 7.90011V10.0002H6.10156V7.90011C6.10156 5.19386 8.29542 3 11.0017 3C13.7079 3 15.9018 5.19385 15.9018 7.90011V10.0002H13.8017Z" stroke="none"/>
+</symbol>
+
<symbol id="pass" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.55556 5C1.24873 5 1 5.24873 1 5.55556V14.4444C1 14.7513 1.24873 15 1.55556 15H20.4444C20.7513 15 21 14.7513 21 14.4444V5.55556C21 5.24873 20.7513 5 20.4444 5H1.55556ZM4.77222 8.76388C4.78333 8.77499 4.79722 8.78055 4.81389 8.78055H4.91667C4.93333 8.78055 4.94722 8.77499 4.95833 8.76388C4.96944 8.75277 4.97683 8.73888 4.98055 8.72221L5.03055 8.3861H5.43889L5.38889 8.72221C5.38705 8.73888 5.39167 8.75277 5.40278 8.76388C5.41389 8.77499 5.42778 8.78055 5.44444 8.78055H5.54722C5.56389 8.78055 5.57778 8.77499 5.58889 8.76388C5.6 8.75277 5.60739 8.73888 5.61111 8.72221L5.66111 8.3861H5.99444C6.01294 8.3861 6.02778 8.38055 6.03889 8.36943C6.05183 8.35832 6.05833 8.34349 6.05833 8.32499V8.23055C6.05833 8.21205 6.05183 8.19721 6.03889 8.1861C6.02778 8.17499 6.01294 8.16943 5.99444 8.16943H5.69444L5.76667 7.68055H6.06667C6.08517 7.68055 6.1 7.67499 6.11111 7.66388C6.12406 7.65277 6.13056 7.63793 6.13056 7.61943V7.52499C6.13056 7.50649 6.12406 7.49166 6.11111 7.48055C6.1 7.46943 6.08517 7.46388 6.06667 7.46388H5.79722L5.84722 7.12777C5.84905 7.1111 5.84444 7.09721 5.83333 7.0861C5.82222 7.07499 5.80833 7.06943 5.79167 7.06943H5.68889C5.67222 7.06943 5.65833 7.07499 5.64722 7.0861C5.63794 7.09721 5.6315 7.1111 5.62778 7.12777L5.57778 7.46388H5.16667L5.21667 7.12777C5.2185 7.1111 5.21389 7.09721 5.20278 7.0861C5.19167 7.07499 5.17778 7.06943 5.16111 7.06943H5.05833C5.04167 7.06943 5.02778 7.07499 5.01667 7.0861C5.00739 7.09721 5.00094 7.1111 4.99722 7.12777L4.94722 7.46388H4.60555C4.58705 7.46388 4.57222 7.46943 4.56111 7.48055C4.55 7.49166 4.54444 7.50649 4.54444 7.52499V7.61943C4.54444 7.63793 4.55 7.65277 4.56111 7.66388C4.57222 7.67499 4.58705 7.68055 4.60555 7.68055H4.91389L4.84167 8.16943H4.53333C4.51483 8.16943 4.5 8.17499 4.48889 8.1861C4.47778 8.19721 4.47222 8.21205 4.47222 8.23055V8.32499C4.47222 8.34349 4.47778 8.35832 4.48889 8.36943C4.5 8.38055 4.51483 8.3861 4.53333 8.3861H4.80833L4.75833 8.72221C4.7565 8.73888 4.76111 8.75277 4.77222 8.76388ZM6.34239 8.87221C6.3535 8.88332 6.3665 8.88888 6.38128 8.88888H6.52294C6.5415 8.88888 6.55628 8.88427 6.56739 8.87499C6.58039 8.86388 6.58872 8.85277 6.59239 8.84166L6.74517 8.44721H7.65628L7.80905 8.84166C7.81278 8.85277 7.82017 8.86388 7.83128 8.87499C7.84239 8.88427 7.85817 8.88888 7.8785 8.88888H8.02017C8.035 8.88888 8.04794 8.88332 8.05906 8.87221C8.07017 8.8611 8.07572 8.84816 8.07572 8.83332L8.07017 8.80277L7.38406 7.00555C7.36928 6.96482 7.33961 6.94443 7.29517 6.94443H7.10628C7.06183 6.94443 7.03222 6.96482 7.01739 7.00555L6.3285 8.80277C6.32667 8.80832 6.32572 8.81849 6.32572 8.83332C6.32572 8.84816 6.33128 8.8611 6.34239 8.87221ZM8.38939 8.87221C8.40239 8.88332 8.41811 8.88888 8.43661 8.88888H8.58383C8.60239 8.88888 8.61811 8.88332 8.63106 8.87221C8.64406 8.85927 8.6505 8.84349 8.6505 8.82499V8.13055H9.14217C9.35328 8.13055 9.51811 8.08054 9.63661 7.98054C9.757 7.87871 9.81717 7.73149 9.81717 7.53888C9.81717 7.34627 9.757 7.19904 9.63661 7.09721C9.51628 6.99538 9.35144 6.94443 9.14217 6.94443H8.43661C8.41811 6.94443 8.40239 6.95093 8.38939 6.96388C8.37828 6.97499 8.37272 6.99071 8.37272 7.0111V8.82499C8.37272 8.84349 8.37828 8.85927 8.38939 8.87221ZM10.5966 8.87221C10.6096 8.88332 10.6253 8.88888 10.6438 8.88888H10.7883C10.8068 8.88888 10.8226 8.88332 10.8355 8.87221C10.8485 8.85927 10.8549 8.84349 10.8549 8.82499V7.19166H11.3855C11.4041 7.19166 11.4198 7.1861 11.4327 7.17499C11.4457 7.16205 11.4522 7.14627 11.4522 7.12777V7.0111C11.4522 6.99071 11.4457 6.97499 11.4327 6.96388C11.4216 6.95093 11.4059 6.94443 11.3855 6.94443H10.0466C10.0281 6.94443 10.0124 6.95093 9.99939 6.96388C9.98828 6.97682 9.98272 6.9926 9.98272 7.0111V7.12777C9.98272 7.14627 9.98828 7.16205 9.99939 7.17499C10.0124 7.1861 10.0281 7.19166 10.0466 7.19166H10.5799V8.82499C10.5799 8.84349 10.5855 8.85927 10.5966 8.87221ZM11.7803 8.87221C11.7932 8.88332 11.8089 8.88888 11.8275 8.88888H11.9747C11.9932 8.88888 12.0081 8.88332 12.0192 8.87221C12.0321 8.85927 12.0386 8.84349 12.0386 8.82499V7.00832C12.0386 6.98982 12.0321 6.97499 12.0192 6.96388C12.0081 6.95093 11.9932 6.94443 11.9747 6.94443H11.8275C11.8089 6.94443 11.7932 6.95093 11.7803 6.96388C11.7692 6.97499 11.7636 6.98982 11.7636 7.00832V8.82499C11.7636 8.84349 11.7692 8.85927 11.7803 8.87221ZM12.6564 8.71666C12.7861 8.84999 12.975 8.91666 13.2231 8.91666C13.3879 8.91666 13.5278 8.88793 13.6426 8.83055C13.7574 8.77127 13.8444 8.69443 13.9037 8.59999C13.9629 8.50554 13.9953 8.40371 14.0009 8.29443C14.0028 8.27777 13.9972 8.26482 13.9842 8.25555C13.9731 8.24443 13.9592 8.23888 13.9426 8.23888H13.7898C13.7713 8.23888 13.7564 8.24349 13.7453 8.25277C13.7342 8.26204 13.7259 8.27871 13.7203 8.30277C13.6907 8.44166 13.6342 8.53982 13.5509 8.59721C13.4694 8.65277 13.3602 8.68055 13.2231 8.68055C12.9046 8.68055 12.7398 8.50371 12.7287 8.14999C12.7268 8.09627 12.7259 8.0176 12.7259 7.91388C12.7259 7.81016 12.7268 7.73332 12.7287 7.68332C12.7398 7.3296 12.9046 7.15277 13.2231 7.15277C13.3602 7.15277 13.4694 7.18149 13.5509 7.23888C13.6324 7.29443 13.6889 7.39166 13.7203 7.53055C13.7296 7.57316 13.7528 7.59443 13.7898 7.59443H13.9426C13.9574 7.59443 13.9703 7.58982 13.9814 7.58055C13.9944 7.56943 14.0009 7.55649 14.0009 7.54166V7.5361C13.9953 7.42871 13.9629 7.32777 13.9037 7.23332C13.8444 7.13888 13.7574 7.06293 13.6426 7.00555C13.5278 6.94627 13.3879 6.91666 13.2231 6.91666C12.9768 6.91666 12.7889 6.98427 12.6592 7.11943C12.5296 7.25277 12.4602 7.4361 12.4509 7.66943C12.4491 7.72127 12.4481 7.8046 12.4481 7.91943C12.4481 8.03238 12.4491 8.11388 12.4509 8.16388C12.4602 8.39904 12.5287 8.58332 12.6564 8.71666ZM4.25 11C4.11193 11 4 11.1119 4 11.25C4 11.3881 4.11193 11.5 4.25 11.5H12.7259C12.864 11.5 12.9759 11.3881 12.9759 11.25C12.9759 11.1119 12.864 11 12.7259 11H4.25ZM16.6144 11.9418H16.0068C16.0133 12.1185 16.0594 12.249 16.1451 12.3333C16.2321 12.4177 16.3749 12.4598 16.5735 12.4598C16.702 12.4598 16.8163 12.4398 16.9163 12.3996L17 12.9398C16.8273 12.9799 16.6566 13 16.4878 13C16.1373 13 15.8575 12.9063 15.6485 12.7189C15.4408 12.5315 15.3317 12.2724 15.3213 11.9418H15V11.6205H15.3213V11.3755H15V11.0562H15.3272C15.3518 10.7242 15.4726 10.4652 15.6894 10.2791C15.9062 10.093 16.1925 10 16.5482 10C16.6858 10 16.8364 10.0207 17 10.0622L16.9163 10.6044C16.815 10.5629 16.7066 10.5422 16.591 10.5422C16.4119 10.5422 16.2749 10.5843 16.1801 10.6687C16.0854 10.7517 16.0295 10.8809 16.0127 11.0562H16.6144V11.3755H16.0068V11.6205H16.6144V11.9418ZM9.12828 7.89721C9.2635 7.89721 9.36533 7.86666 9.43383 7.80554C9.50422 7.74443 9.53939 7.65554 9.53939 7.53888C9.53939 7.42221 9.50517 7.33332 9.43661 7.27221C9.36811 7.20927 9.26533 7.17777 9.12828 7.17777H8.64772V7.89721H9.12828ZM7.20072 7.22221L7.57572 8.20832H6.82572L7.20072 7.22221ZM5.54444 7.68055L5.47222 8.16943H5.06389L5.13611 7.68055H5.54444ZM19.75 6C19.6119 6 19.5 6.11193 19.5 6.25V6.75C19.5 6.88807 19.6119 7 19.75 7C19.8881 7 20 6.88807 20 6.75V6.25C20 6.11193 19.8881 6 19.75 6ZM19.5 8.25C19.5 8.11193 19.6119 8 19.75 8C19.8881 8 20 8.11193 20 8.25V10.75C20 10.8881 19.8881 11 19.75 11C19.6119 11 19.5 10.8881 19.5 10.75V8.25ZM19.75 12C19.6119 12 19.5 12.1119 19.5 12.25V13.75C19.5 13.8881 19.6119 14 19.75 14C19.8881 14 20 13.8881 20 13.75V12.25C20 12.1119 19.8881 12 19.75 12Z" fill="#333333"/>
</symbol>
@@ -212,16 +222,7 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.84054 5.57617C1.72559 6.04339 1 7.13416 1 8.34305V23H8V18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5V23H18V8.40362C18 7.1644 17.2381 6.05271 16.0823 5.60565L14.5555 5.01505C14.1291 4.85011 13.746 4.5899 13.4355 4.2543L10.9183 1.5332C10.1451 0.6974 8.83121 0.674761 8.0297 1.48343L5.19821 4.34019C4.92065 4.62023 4.5906 4.84281 4.22694 4.9952L2.84054 5.57617Z"/>
</mask>
<path d="M2.84054 5.57617L3.03378 6.03731L2.84054 5.57617ZM1 23H0.5V23.5H1V23ZM8 23V23.5H8.5V23H8ZM11 23H10.5V23.5H11V23ZM18 23V23.5H18.5V23H18ZM16.0823 5.60565L16.2627 5.13932L16.0823 5.60565ZM14.5555 5.01505L14.3751 5.48138H14.3751L14.5555 5.01505ZM13.4355 4.2543L13.0685 4.59383V4.59383L13.4355 4.2543ZM10.9183 1.5332L11.2854 1.19366V1.19366L10.9183 1.5332ZM8.0297 1.48343L8.38482 1.8354V1.8354L8.0297 1.48343ZM5.19821 4.34019L4.84309 3.98821L5.19821 4.34019ZM4.22694 4.9952L4.42019 5.45634L4.22694 4.9952ZM1.5 8.34305C1.5 7.33564 2.10466 6.42666 3.03378 6.03731L2.6473 5.11502C1.34652 5.66011 0.5 6.93268 0.5 8.34305H1.5ZM1.5 23V8.34305H0.5V23H1.5ZM8 22.5H1V23.5H8V22.5ZM8.5 23V18.5H7.5V23H8.5ZM8.5 18.5C8.5 17.9477 8.94772 17.5 9.5 17.5V16.5C8.39543 16.5 7.5 17.3954 7.5 18.5H8.5ZM9.5 17.5C10.0523 17.5 10.5 17.9477 10.5 18.5H11.5C11.5 17.3954 10.6046 16.5 9.5 16.5V17.5ZM10.5 18.5V23H11.5V18.5H10.5ZM18 22.5H11V23.5H18V22.5ZM17.5 8.40362V23H18.5V8.40362H17.5ZM15.9019 6.07197C16.865 6.44453 17.5 7.37094 17.5 8.40362H18.5C18.5 6.95786 17.6111 5.66089 16.2627 5.13932L15.9019 6.07197ZM14.3751 5.48138L15.9019 6.07197L16.2627 5.13932L14.7359 4.54872L14.3751 5.48138ZM13.0685 4.59383C13.4307 4.98537 13.8776 5.28895 14.3751 5.48138L14.7359 4.54872C14.3805 4.41127 14.0613 4.19443 13.8026 3.91476L13.0685 4.59383ZM10.5513 1.87273L13.0685 4.59383L13.8026 3.91476L11.2854 1.19366L10.5513 1.87273ZM8.38482 1.8354C8.98595 1.22891 9.97141 1.24589 10.5513 1.87273L11.2854 1.19366C10.3189 0.148915 8.67647 0.120616 7.67458 1.13145L8.38482 1.8354ZM5.55333 4.69216L8.38482 1.8354L7.67458 1.13145L4.84309 3.98821L5.55333 4.69216ZM4.42019 5.45634C4.84445 5.27856 5.22951 5.01888 5.55333 4.69216L4.84309 3.98821C4.61179 4.22158 4.33675 4.40706 4.0337 4.53405L4.42019 5.45634ZM3.03378 6.03731L4.42019 5.45634L4.0337 4.53405L2.6473 5.11502L3.03378 6.03731Z" fill="white" mask="url(#path-1-outside-1)"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.84054 5.57617C1.72559 6.04339 1 7.13416 1 8.34305V23H8V18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5V23H18V8.40362C18 7.1644 17.2381 6.05271 16.0823 5.60565L14.5555 5.01505C14.1291 4.85011 13.746 4.5899 13.4355 4.2543L10.9183 1.5332C10.1451 0.6974 8.83121 0.674761 8.0297 1.48343L5.19821 4.34018C4.92065 4.62023 4.5906 4.84281 4.22694 4.9952L2.84054 5.57617ZM11 4.5C11 5.32843 10.3284 6 9.5 6C8.67157 6 8 5.32843 8 4.5C8 3.67157 8.67157 3 9.5 3C10.3284 3 11 3.67157 11 4.5ZM4.25 15.9354C3.54057 16.0544 3 16.6714 3 17.4146V18.75H4.25V15.9354ZM3 21.9146V19.25H4.25V21.9146H3ZM4.75 21.9146V19.25H6V21.9146H4.75ZM6 17.4146V18.75H4.75V15.9354C5.45943 16.0544 6 16.6714 6 17.4146ZM13 17.4146C13 16.6714 13.5406 16.0544 14.25 15.9354V18.75H13V17.4146ZM13 19.25V21.9146H14.25V19.25H13ZM14.75 19.25V21.9146H16V19.25H14.75ZM16 18.75V17.4146C16 16.6714 15.4594 16.0544 14.75 15.9354V18.75H16ZM14.25 8C13.5406 8.11902 13 8.73601 13 9.47926V10.8146H14.25V8ZM13 13.9793V11.3146H14.25V13.9793H13ZM14.75 13.9793V11.3146H16V13.9793H14.75ZM16 9.47926V10.8146H14.75V8C15.4594 8.11902 16 8.73601 16 9.47926ZM8 9.47926C8 8.73601 8.54057 8.11902 9.25 8V10.8146H8V9.47926ZM8 11.3146V13.9793H9.25V11.3146H8ZM9.75 11.3146V13.9793H11V11.3146H9.75ZM11 10.8146V9.47926C11 8.73601 10.4594 8.11902 9.75 8V10.8146H11ZM4.25 8C3.54057 8.11902 3 8.73601 3 9.47926V10.8146H4.25V8ZM3 13.9793V11.3146H4.25V13.9793H3ZM4.75 13.9793V11.3146H6V13.9793H4.75ZM6 9.47926V10.8146H4.75V8C5.45943 8.11902 6 8.73601 6 9.47926Z" fill="#D4C4A9"/>
-</symbol>
-
-<symbol id="mdm-hover" viewBox="0 0 19 24" xmlns="http://www.w3.org/2000/svg">
-<mask id="path-1-outside-1" maskUnits="userSpaceOnUse" x="0" y="-0.108661" width="19" height="24" fill="black">
-<rect fill="white" y="-0.108661" width="19" height="24"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.84054 5.57617C1.72559 6.04339 1 7.13416 1 8.34305V23H8V18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5V23H18V8.40362C18 7.1644 17.2381 6.05271 16.0823 5.60565L14.5555 5.01505C14.1291 4.85011 13.746 4.5899 13.4355 4.2543L10.9183 1.5332C10.1451 0.6974 8.83121 0.674761 8.0297 1.48343L5.19821 4.34019C4.92065 4.62023 4.5906 4.84281 4.22694 4.9952L2.84054 5.57617Z"/>
-</mask>
-<path d="M2.84054 5.57617L3.03378 6.03731L2.84054 5.57617ZM1 23H0.5V23.5H1V23ZM8 23V23.5H8.5V23H8ZM11 23H10.5V23.5H11V23ZM18 23V23.5H18.5V23H18ZM16.0823 5.60565L16.2627 5.13932L16.0823 5.60565ZM14.5555 5.01505L14.3751 5.48138H14.3751L14.5555 5.01505ZM13.4355 4.2543L13.0685 4.59383V4.59383L13.4355 4.2543ZM10.9183 1.5332L11.2854 1.19366V1.19366L10.9183 1.5332ZM8.0297 1.48343L8.38482 1.8354V1.8354L8.0297 1.48343ZM5.19821 4.34019L4.84309 3.98821L5.19821 4.34019ZM4.22694 4.9952L4.42019 5.45634L4.22694 4.9952ZM1.5 8.34305C1.5 7.33564 2.10466 6.42666 3.03378 6.03731L2.6473 5.11502C1.34652 5.66011 0.5 6.93268 0.5 8.34305H1.5ZM1.5 23V8.34305H0.5V23H1.5ZM8 22.5H1V23.5H8V22.5ZM8.5 23V18.5H7.5V23H8.5ZM8.5 18.5C8.5 17.9477 8.94772 17.5 9.5 17.5V16.5C8.39543 16.5 7.5 17.3954 7.5 18.5H8.5ZM9.5 17.5C10.0523 17.5 10.5 17.9477 10.5 18.5H11.5C11.5 17.3954 10.6046 16.5 9.5 16.5V17.5ZM10.5 18.5V23H11.5V18.5H10.5ZM18 22.5H11V23.5H18V22.5ZM17.5 8.40362V23H18.5V8.40362H17.5ZM15.9019 6.07197C16.865 6.44453 17.5 7.37094 17.5 8.40362H18.5C18.5 6.95786 17.6111 5.66089 16.2627 5.13932L15.9019 6.07197ZM14.3751 5.48138L15.9019 6.07197L16.2627 5.13932L14.7359 4.54872L14.3751 5.48138ZM13.0685 4.59383C13.4307 4.98537 13.8776 5.28895 14.3751 5.48138L14.7359 4.54872C14.3805 4.41127 14.0613 4.19443 13.8026 3.91476L13.0685 4.59383ZM10.5513 1.87273L13.0685 4.59383L13.8026 3.91476L11.2854 1.19366L10.5513 1.87273ZM8.38482 1.8354C8.98595 1.22891 9.97141 1.24589 10.5513 1.87273L11.2854 1.19366C10.3189 0.148915 8.67647 0.120616 7.67458 1.13145L8.38482 1.8354ZM5.55333 4.69216L8.38482 1.8354L7.67458 1.13145L4.84309 3.98821L5.55333 4.69216ZM4.42019 5.45634C4.84445 5.27856 5.22951 5.01888 5.55333 4.69216L4.84309 3.98821C4.61179 4.22158 4.33675 4.40706 4.0337 4.53405L4.42019 5.45634ZM3.03378 6.03731L4.42019 5.45634L4.0337 4.53405L2.6473 5.11502L3.03378 6.03731Z" fill="white" mask="url(#path-1-outside-1)"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2.84054 5.57617C1.72559 6.04339 1 7.13416 1 8.34305V23H8V18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5V23H18V8.40362C18 7.1644 17.2381 6.05271 16.0823 5.60565L14.5555 5.01505C14.1291 4.85011 13.746 4.5899 13.4355 4.2543L10.9183 1.5332C10.1451 0.6974 8.83121 0.674761 8.0297 1.48343L5.19821 4.34018C4.92065 4.62023 4.5906 4.84281 4.22694 4.9952L2.84054 5.57617ZM11 4.5C11 5.32843 10.3284 6 9.5 6C8.67157 6 8 5.32843 8 4.5C8 3.67157 8.67157 3 9.5 3C10.3284 3 11 3.67157 11 4.5ZM4.25 15.9354C3.54057 16.0544 3 16.6714 3 17.4146V18.75H4.25V15.9354ZM3 21.9146V19.25H4.25V21.9146H3ZM4.75 21.9146V19.25H6V21.9146H4.75ZM6 17.4146V18.75H4.75V15.9354C5.45943 16.0544 6 16.6714 6 17.4146ZM13 17.4146C13 16.6714 13.5406 16.0544 14.25 15.9354V18.75H13V17.4146ZM13 19.25V21.9146H14.25V19.25H13ZM14.75 19.25V21.9146H16V19.25H14.75ZM16 18.75V17.4146C16 16.6714 15.4594 16.0544 14.75 15.9354V18.75H16ZM14.25 8C13.5406 8.11902 13 8.73601 13 9.47926V10.8146H14.25V8ZM13 13.9793V11.3146H14.25V13.9793H13ZM14.75 13.9793V11.3146H16V13.9793H14.75ZM16 9.47926V10.8146H14.75V8C15.4594 8.11902 16 8.73601 16 9.47926ZM8 9.47926C8 8.73601 8.54057 8.11902 9.25 8V10.8146H8V9.47926ZM8 11.3146V13.9793H9.25V11.3146H8ZM9.75 11.3146V13.9793H11V11.3146H9.75ZM11 10.8146V9.47926C11 8.73601 10.4594 8.11902 9.75 8V10.8146H11ZM4.25 8C3.54057 8.11902 3 8.73601 3 9.47926V10.8146H4.25V8ZM3 13.9793V11.3146H4.25V13.9793H3ZM4.75 13.9793V11.3146H6V13.9793H4.75ZM6 9.47926V10.8146H4.75V8C5.45943 8.11902 6 8.73601 6 9.47926Z" fill="#BD9E6A"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2.84054 5.57617C1.72559 6.04339 1 7.13416 1 8.34305V23H8V18.5C8 17.6716 8.67157 17 9.5 17C10.3284 17 11 17.6716 11 18.5V23H18V8.40362C18 7.1644 17.2381 6.05271 16.0823 5.60565L14.5555 5.01505C14.1291 4.85011 13.746 4.5899 13.4355 4.2543L10.9183 1.5332C10.1451 0.6974 8.83121 0.674761 8.0297 1.48343L5.19821 4.34018C4.92065 4.62023 4.5906 4.84281 4.22694 4.9952L2.84054 5.57617ZM11 4.5C11 5.32843 10.3284 6 9.5 6C8.67157 6 8 5.32843 8 4.5C8 3.67157 8.67157 3 9.5 3C10.3284 3 11 3.67157 11 4.5ZM4.25 15.9354C3.54057 16.0544 3 16.6714 3 17.4146V18.75H4.25V15.9354ZM3 21.9146V19.25H4.25V21.9146H3ZM4.75 21.9146V19.25H6V21.9146H4.75ZM6 17.4146V18.75H4.75V15.9354C5.45943 16.0544 6 16.6714 6 17.4146ZM13 17.4146C13 16.6714 13.5406 16.0544 14.25 15.9354V18.75H13V17.4146ZM13 19.25V21.9146H14.25V19.25H13ZM14.75 19.25V21.9146H16V19.25H14.75ZM16 18.75V17.4146C16 16.6714 15.4594 16.0544 14.75 15.9354V18.75H16ZM14.25 8C13.5406 8.11902 13 8.73601 13 9.47926V10.8146H14.25V8ZM13 13.9793V11.3146H14.25V13.9793H13ZM14.75 13.9793V11.3146H16V13.9793H14.75ZM16 9.47926V10.8146H14.75V8C15.4594 8.11902 16 8.73601 16 9.47926ZM8 9.47926C8 8.73601 8.54057 8.11902 9.25 8V10.8146H8V9.47926ZM8 11.3146V13.9793H9.25V11.3146H8ZM9.75 11.3146V13.9793H11V11.3146H9.75ZM11 10.8146V9.47926C11 8.73601 10.4594 8.11902 9.75 8V10.8146H11ZM4.25 8C3.54057 8.11902 3 8.73601 3 9.47926V10.8146H4.25V8ZM3 13.9793V11.3146H4.25V13.9793H3ZM4.75 13.9793V11.3146H6V13.9793H4.75ZM6 9.47926V10.8146H4.75V8C5.45943 8.11902 6 8.73601 6 9.47926Z" stroke="none"/>
</symbol>
<symbol id="borne" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
@@ -237,4 +238,20 @@
<path d="M15.227 14.2886C14.1412 13.2028 12.6412 12.5312 10.9844 12.5312C9.32752 12.5312 7.82752 13.2028 6.74173 14.2886L8.15595 15.7028C8.8798 14.979 9.8798 14.5312 10.9844 14.5312C12.0889 14.5312 13.0889 14.979 13.8128 15.7028L15.227 14.2886Z" stroke="none"/>
<path d="M12.3986 17.117C12.0367 16.7551 11.5367 16.5312 10.9844 16.5312C10.4321 16.5312 9.93209 16.7551 9.57016 17.117L10.9844 18.5312L12.3986 17.117Z" stroke="none"/>
</symbol>
+
+<symbol id="moreOpts" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.66675C12.1 7.66675 13 6.76675 13 5.66675C13 4.56675 12.1 3.66675 11 3.66675C9.9 3.66675 9 4.56675 9 5.66675C9 6.76675 9.9 7.66675 11 7.66675ZM11 9.66675C9.9 9.66675 9 10.5667 9 11.6667C9 12.7667 9.9 13.6667 11 13.6667C12.1 13.6667 13 12.7667 13 11.6667C13 10.5667 12.1 9.66675 11 9.66675ZM9 17.6667C9 16.5667 9.9 15.6667 11 15.6667C12.1 15.6667 13 16.5667 13 17.6667C13 18.7667 12.1 19.6667 11 19.6667C9.9 19.6667 9 18.7667 9 17.6667Z" stroke="none"/>
+</symbol>
+
+<symbol id="camera" width="100" height="113" viewBox="0 0 100 113" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="113" rx="12" fill="#F8F8F8"/>
+<path d="M27 11H15C13.8954 11 13 11.8954 13 13V25" stroke="#BDBDBD" stroke-width="2" stroke-linecap="round"/>
+<path d="M27 100H15C13.8954 100 13 99.1046 13 98V86" stroke="#BDBDBD" stroke-width="2" stroke-linecap="round"/>
+<path d="M73 11H85C86.1046 11 87 11.8954 87 13V25" stroke="#BDBDBD" stroke-width="2" stroke-linecap="round"/>
+<path d="M73 100H85C86.1046 100 87 99.1046 87 98V86" stroke="#BDBDBD" stroke-width="2" stroke-linecap="round"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M61.1175 39.1429H72.7941C75.6692 39.1429 78 41.5002 78 44.4082V70.7347C78 73.6426 75.6692 76 72.7941 76H24.2059C21.3308 76 19 73.6426 19 70.7347V44.4082C19 41.5002 21.3308 39.1429 24.2059 39.1429H36.7502C37.8558 35.5825 41.1444 33 45.0294 33H52.8382C56.7232 33 60.0119 35.5825 61.1175 39.1429ZM49.5 70C56.9558 70 63 63.9558 63 56.5C63 49.0442 56.9558 43 49.5 43C42.0442 43 36 49.0442 36 56.5C36 63.9558 42.0442 70 49.5 70Z" fill="#C4C4C4"/>
+<circle cx="49.5" cy="56.5" r="10.5" fill="#BDBDBD"/>
+</symbol>
+
+
</svg>
diff --git a/src/assets/img/about_illustration.png b/src/assets/img/about_illustration.png
deleted file mode 100644
index 6e9cfe47aa986fbfa52afa5308c2d0e92b532be3..0000000000000000000000000000000000000000
Binary files a/src/assets/img/about_illustration.png and /dev/null differ
diff --git a/src/assets/img/about_illustration_1.jpg b/src/assets/img/about_illustration_1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..33a703590c620c7311e236d1cfd60324a270beaa
Binary files /dev/null and b/src/assets/img/about_illustration_1.jpg differ
diff --git a/src/assets/img/about_illustration_2.jpg b/src/assets/img/about_illustration_2.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..79faca4a6331a11cc93e8de5339dc754cd1a9e0e
Binary files /dev/null and b/src/assets/img/about_illustration_2.jpg differ
diff --git a/src/assets/logos/logo_europe.png b/src/assets/logos/logo_europe.png
new file mode 100644
index 0000000000000000000000000000000000000000..89d98cf3c5a0eb7480472af3d10bb04d82407894
Binary files /dev/null and b/src/assets/logos/logo_europe.png differ
diff --git a/src/assets/logos/logo_region.png b/src/assets/logos/logo_region.png
new file mode 100644
index 0000000000000000000000000000000000000000..5bf6812f6ae13d983d0566daa05153cbbdf65209
Binary files /dev/null and b/src/assets/logos/logo_region.png differ
diff --git a/src/assets/scss/_buttons.scss b/src/assets/scss/_buttons.scss
index ec08d9b85f7cd16f8657e20ca299f4e8392773ce..3827c75d7ab29535359c501c9248b833539852fb 100644
--- a/src/assets/scss/_buttons.scss
+++ b/src/assets/scss/_buttons.scss
@@ -38,7 +38,7 @@
line-break: 18px;
}
@mixin btn-search-addStructure {
- @include btn-bold-sousligne;
+ @include btn-bold-underline;
color: $secondary-color;
outline: none;
}
diff --git a/src/assets/scss/_color.scss b/src/assets/scss/_color.scss
index b5a0368f86e54b9c0a9c93edf235f24235d9e01c..75dd41e99e0493162e4156be96636a3c079c64a3 100644
--- a/src/assets/scss/_color.scss
+++ b/src/assets/scss/_color.scss
@@ -18,11 +18,10 @@ $orange-warning: #da6c2e;
$blue: #348899;
$blue-hover: #117083;
$blue-active: #8cb6be;
-$red-metro: #d50000;
$red-info: #a00000;
$red-default: #ed3939;
/* APP COLORS */
-$primary-color: $red-metro;
+$primary-color: $red-default;
$secondary-color: $blue;
$default-link-color: $grey-2;
$button-secondary: $blue;
diff --git a/src/assets/scss/_hyperlink.scss b/src/assets/scss/_hyperlink.scss
index 5eed9c1f2ce663bbcf14ac5ed6b685ebb54aa8ac..81b49c00e5295a03e01f62285c2b010d9f6a9588 100644
--- a/src/assets/scss/_hyperlink.scss
+++ b/src/assets/scss/_hyperlink.scss
@@ -4,7 +4,7 @@
padding: 8px 8px 6px 8px;
color: $secondary-color;
outline: none;
- @include btn-bold-sousligne;
+ @include btn-bold-underline;
&:hover {
color: $blue-hover;
}
diff --git a/src/assets/scss/_shapes.scss b/src/assets/scss/_shapes.scss
index 9eb400742e995d1da5d6a163ad8b9e1771a58eab..a5497d14faa6ff59fb5c3489a65ba63ae4ba51eb 100644
--- a/src/assets/scss/_shapes.scss
+++ b/src/assets/scss/_shapes.scss
@@ -33,17 +33,17 @@ $mat-tab-shadow: 0px 2px 7px rgba(0, 0, 0, 0.25);
background-position-y: 12px;
}
-@mixin background-hash {
+@mixin background-hash($color) {
background: linear-gradient(
-45deg,
- $grey-2 2.5%,
+ $color 2.5%,
$white 2.5%,
$white 47.5%,
- $grey-2 47.5%,
- $grey-2 52.5%,
+ $color 47.5%,
+ $color 52.5%,
$white 52.5%,
$white 97.5%,
- $grey-2 97.5%
+ $color 97.5%
);
background-size: 5px 5px;
background-position: 25px 25px;
diff --git a/src/assets/scss/_typography.scss b/src/assets/scss/_typography.scss
index 8d7611006df3862e440590cf1edcabf810eff3d0..d5f92bac1c01e01d894fd86e494968119698381b 100644
--- a/src/assets/scss/_typography.scss
+++ b/src/assets/scss/_typography.scss
@@ -5,12 +5,12 @@ $title-font: 'Trebuchet MS', 'Helvetica', sans-serif;
$font-size-xxsmall: 0.75em; // 12px
$font-size-xsmall: 0.875em; // 14px
$font-size-small: 1em; // 16px
-$font-size-smedium: 1.25em; // 20px
-$font-size-medium: 1.375em; // 22px
-$font-size-xmedium: 1.5em; // 24px
-$font-size-large: 1.75em; // 28px
-$font-size-xlarge: 2em; // 32px
-$font-size-medium-mobile: 1.1em;
+
+$font-size-smedium: 1.125em; // 18px
+$font-size-medium: 1.25em; // 20px
+$font-size-xmedium: 1.375em; // 22px
+
+$font-size-large: 1.625em; // 26px
html,
body,
@@ -37,116 +37,73 @@ h6,
font-family: $title-font;
}
-@mixin btn-bold {
- @include cn-bold-16;
- line-height: 18px;
-}
-
-@mixin btn-bold-sousligne {
- @include btn-bold;
- text-decoration: underline;
-}
-@mixin btn-normal {
- @include cn-regular-16;
- line-height: 19px;
-}
-
-@mixin btn-pass {
- @include cn-regular-18;
- line-height: 21px;
-}
-
@mixin arial-regular-16 {
font-family: $footer-text-font;
font-style: normal;
font-size: $font-size-small;
}
-@mixin cn-bold-36 {
- font-family: $text-font;
- font-style: normal;
- font-weight: bold;
- font-size: $font-size-large;
-}
-@mixin cn-bold-32 {
- font-family: $title-font;
- font-style: normal;
- font-weight: bold;
- font-size: $font-size-xlarge;
-}
-@mixin cn-bold-28 {
+@mixin cn-bold-26 {
font-family: $title-font;
font-style: normal;
font-weight: bold;
font-size: $font-size-large;
}
-@mixin cn-regular-28 {
+@mixin cn-regular-26 {
font-family: $text-font;
font-style: normal;
font-weight: normal;
font-size: $font-size-large;
}
-@mixin cn-regular-24 {
- font-family: $text-font;
- font-style: normal;
- font-weight: normal;
- font-size: $font-size-xmedium;
-}
-@mixin cn-bold-24 {
- font-family: $text-font;
- font-style: normal;
- font-weight: bold;
- font-size: $font-size-xmedium;
-}
@mixin cn-regular-22 {
font-family: $text-font;
font-style: normal;
font-weight: normal;
- font-size: $font-size-medium;
+ font-size: $font-size-xmedium;
}
@mixin cn-bold-22 {
font-family: $text-font;
font-style: normal;
font-weight: bold;
- font-size: $font-size-medium;
+ font-size: $font-size-xmedium;
}
@mixin cn-bold-20 {
font-family: $text-font;
font-style: normal;
font-weight: bold;
- font-size: $font-size-smedium;
+ font-size: $font-size-medium;
}
@mixin cn-regular-20 {
font-family: $text-font;
font-style: normal;
font-weight: normal;
- font-size: $font-size-smedium;
+ font-size: $font-size-medium;
}
@mixin cn-bold-20 {
font-family: $title-font;
font-style: normal;
font-weight: bold;
- font-size: $font-size-smedium;
+ font-size: $font-size-medium;
}
@mixin cn-regular-20 {
font-family: $title-font;
font-style: normal;
font-weight: normal;
- font-size: $font-size-smedium;
+ font-size: $font-size-medium;
}
@mixin cn-regular-18 {
font-family: $title-font;
font-style: normal;
font-weight: normal;
- font-size: $font-size-medium-mobile;
+ font-size: $font-size-smedium;
}
@mixin cn-bold-18 {
font-family: $title-font;
font-style: normal;
font-weight: bold;
- font-size: $font-size-medium-mobile;
+ font-size: $font-size-smedium;
}
@mixin cn-bold-16 {
font-family: $text-font;
@@ -184,3 +141,22 @@ h6,
white-space: nowrap;
text-overflow: ellipsis;
}
+
+@mixin btn-bold {
+ @include cn-bold-16;
+ line-height: 18px;
+}
+
+@mixin btn-bold-underline {
+ @include btn-bold;
+ text-decoration: underline;
+}
+@mixin btn-normal {
+ @include cn-regular-16;
+ line-height: 19px;
+}
+
+@mixin btn-pass {
+ @include cn-regular-14;
+ line-height: 21px;
+}
diff --git a/src/styles.scss b/src/styles.scss
index c8e77507a8a1e050f7078bdfd108ee3ed0df8308..966c57e678d6dba6efa711125c2345e7b9c6a4d1 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -26,7 +26,6 @@ body {
min-height: 100vh;
min-height: -webkit-fill-available;
}
-
a {
color: $default-link-color;
text-decoration: none;
@@ -127,6 +126,9 @@ button {
padding-left: 16px;
padding-right: 10px;
@include btn-pass;
+ &.pass {
+ @include cn-regular-18;
+ }
}
.customCheck {
display: inline-grid;
@@ -193,6 +195,7 @@ button {
position: absolute;
content: '';
top: 0;
+ left: 0;
background-color: $modal-background;
.modal {
max-height: 90%;
@@ -228,7 +231,7 @@ button {
max-width: 560px;
margin: auto;
border-radius: 6px;
- @include background-hash;
+ @include background-hash($grey-2);
border: 1px solid $grey-4;
position: absolute;
top: 50%;