From 0361fcb9b5feaf2df625bc624ade9b87ad7bf7fe Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 15:07:01 +0100
Subject: [PATCH 01/16] fix: mr issue

---
 src/app/app.module.ts                         |  2 ++
 .../footer-form/footer-form.component.html    | 22 ++++++++++--
 .../footer-form/footer-form.component.scss    | 21 ++++++++++++
 .../form/footer-form/footer-form.component.ts |  8 +++++
 .../orientation-modal.component.html          | 30 ++++++++++++++++
 .../orientation-modal.component.scss          | 29 ++++++++++++++++
 .../orientation-modal.component.spec.ts       | 26 ++++++++++++++
 .../orientation-modal.component.ts            | 25 ++++++++++++++
 .../structure-detail-print.component.html     |  4 +--
 .../structure-detail-print.component.scss     |  5 ++-
 .../structure-detail-print.component.ts       |  1 +
 .../structure-list-print.component.html       | 17 +++++-----
 .../structure-list-print.component.scss       | 26 ++++++++++++--
 .../structure-list-print.component.ts         |  9 +----
 .../structure-print-header.component.html     | 34 +++++++++----------
 .../structure-print-header.component.scss     | 19 +++++++++--
 .../orientation-form.component.html           | 15 ++++++--
 .../orientation-form.component.ts             | 16 +++++++++
 src/assets/ico/flag.svg                       | 16 +++++++++
 19 files changed, 276 insertions(+), 49 deletions(-)
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
 create mode 100644 src/assets/ico/flag.svg

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index c07a408ad..eb67d95d7 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -39,6 +39,7 @@ import { OrientationFormComponent } from './form/orientation-form/orientation-fo
 import { StructureDetailPrintComponent } from './form/orientation-form/component/structure-detail-print/structure-detail-print.component';
 import { StructureListPrintComponent } from './form/orientation-form/component/structure-list-print/structure-list-print.component';
 import { StructurePrintHeaderComponent } from './form/orientation-form/component/structure-print-header/structure-print-header.component';
+import { OrientationComponent } from './form/orientation-form/component/orientation-modal/orientation-modal.component';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { environment } from '../environments/environment';
 import { StructureResolver } from './resolvers/structure.resolver';
@@ -71,6 +72,7 @@ import { UpdateService } from './services/update.service';
     StructureDetailPrintComponent,
     StructureListPrintComponent,
     StructurePrintHeaderComponent,
+    OrientationComponent,
   ],
   imports: [
     BrowserModule,
diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 84e1517f2..6ea671ae0 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -7,6 +7,16 @@
       {{ btnName[0] }}
     </div>
   </button>
+
+  <button *ngIf="hasFinishButton()" class="btn-primary small previous" (click)="finishedModal()">
+    <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+      <svg class="flag" aria-hidden="true">
+        <use [attr.xlink:href]="'/assets/ico/flag.svg'"></use>
+      </svg>
+      {{ btnName[2] }}
+    </div>
+  </button>
+
   <button
     class="btn-primary small next"
     (click)="goToNextPage()"
@@ -14,9 +24,15 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
-      {{ btnName[1]
-      }}<svg class="chevronRight" aria-hidden="true">
+    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
+      <svg class="print" aria-hidden="true">
+        <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
+      </svg>
+      {{ btnName[1] }}
+    </div>
+    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+      {{ btnName[1] }}
+      <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
       </svg>
     </div>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 61ae2b385..7e92f0a59 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -15,6 +15,10 @@
   &.invalid {
     opacity: 0.4;
   }
+
+  &:focus .print {
+    background-color: $secondary-color;
+  }
 }
 
 .chevronLeft {
@@ -29,3 +33,20 @@
   // stroke: inherit;
   margin-left: 10px;
 }
+
+.print {
+  stroke: $white;
+  width: 20px;
+  height: 20px;
+  padding-right: 20px;
+  background-color: $white;
+  mask: url(/assets/ico/print.svg) no-repeat center;
+}
+.flag {
+  padding-right: 10px;
+  stroke: $black;
+  width: 20px;
+  height: 20px;
+  background-color: $grey-1;
+  mask: url(/assets/ico/flag.svg) no-repeat center;
+}
diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 12736e3ac..3a0fa9237 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -11,6 +11,7 @@ export class FooterFormComponent {
   @Input() displayPreviousButton: boolean = true;
   @Output() nextPage = new EventEmitter<any>();
   @Output() previousPage = new EventEmitter<any>();
+  @Output() endPage = new EventEmitter<any>();
 
   public goToNextPage(): void {
     this.nextPage.emit();
@@ -19,4 +20,11 @@ export class FooterFormComponent {
   public goToPreviousPage(): void {
     this.previousPage.emit();
   }
+
+  public hasFinishButton(): boolean {
+    return this.btnName.length == 3;
+  }
+  public finishedModal(): void {
+    this.endPage.emit();
+  }
 }
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
new file mode 100644
index 000000000..b2e923ef4
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
@@ -0,0 +1,30 @@
+<div *ngIf="openned" class="modalBackground">
+  <div class="modal">
+    <div
+      (clickOutside)="closeModal(false)"
+      class="contentModal"
+      fxLayout="row-reverse"
+      fxLayoutAlign="space-around start"
+    >
+      <div class="ico-close" fxLayout="row" fxLayoutAlign="end center">
+        <div class="ico-close-wrapper">
+          <div (click)="closeModal()" class="ico-close-details"></div>
+        </div>
+      </div>
+
+      <div class="modalContent">
+        <h3 fxLayoutAlign="center center">Souhaitez-vous terminer cette orientation ?</h3>
+
+        <div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center">
+          <button type="button" class="btn confirm" (click)="goToPreviousPage()">Revenir aux résultats</button>
+          <button class="btn-primary small previous" routerLink="../home">
+            <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+              <img class="flag" src="/assets/ico/flag.svg" alt />
+              Terminer
+            </div>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
new file mode 100644
index 000000000..24dd3a35c
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
@@ -0,0 +1,29 @@
+@import '../../../../../assets/scss/typography';
+@import '../../../../../assets/scss/color';
+
+.ico-close {
+  width: 100%;
+  margin: 0 20px;
+}
+h3 {
+  margin: 8% 15%;
+  width: 60%;
+  text-align: center;
+  margin-left: 30%;
+  font-weight: lighter;
+}
+.modalContent {
+  margin: 0 32px;
+  width: 100%;
+}
+.footerModal {
+  margin: 25px;
+}
+.modalBackground .modal .footerModal .btn.confirm {
+  font-size: 14px;
+  font-weight: normal;
+}
+.flag {
+  padding-right: 10px;
+  stroke: $white;
+}
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
new file mode 100644
index 000000000..4950443e7
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
@@ -0,0 +1,26 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OrientationComponent } from './orientation-modal.component';
+
+describe('OrientationModalComponent', () => {
+  let component: OrientationComponent;
+  let fixture: ComponentFixture<OrientationComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [OrientationComponent],
+      imports: [HttpClientTestingModule],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OrientationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
new file mode 100644
index 000000000..d95283005
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
@@ -0,0 +1,25 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+
+@Component({
+  selector: 'app-orientation-modal',
+  templateUrl: './orientation-modal.component.html',
+  styleUrls: ['./orientation-modal.component.scss'],
+})
+export class OrientationComponent implements OnInit {
+  constructor() {}
+
+  @Input() public openned: boolean;
+  @Output() closed = new EventEmitter();
+  @Output() previousPage = new EventEmitter();
+
+  ngOnInit(): void {}
+
+  public closeModal(): void {
+    this.closed.emit();
+  }
+  public goToPreviousPage(): void {
+    this.closeModal();
+    this.previousPage.emit();
+  }
+}
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
index 7d7ed3c9e..408b63935 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
@@ -1,4 +1,4 @@
-<div class="structrue-details-container" *ngIf="structure">
+<div class="structrue-details-container preview" *ngIf="structure" [ngClass]="{ preview: preview == true }">
   <!-- Header info -->
   <div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
     <div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
@@ -6,7 +6,7 @@
         <h3 class="bold">{{ structure.structureName }}</h3>
       </div>
       <div class="mobile-column">
-        <div fxLayout="column" fxFlex="50%">
+        <div fxLayout="column" fxFlex="100%">
           <div *ngIf="structure.address" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
             <app-svg-icon [type]="'ico'" [icon]="'adress'" [title]="'Adresse'"></app-svg-icon>
             <p>{{ structure.address.numero }} {{ structure.address.street }}, {{ structure.address.commune }}</p>
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
index 155566070..32ac3a98e 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
@@ -14,6 +14,10 @@ a {
   width: 64%;
   margin-top: 1%;
   float: right;
+  &.preview {
+    border-bottom: solid 1px $grey-3;
+    margin-bottom: 4%;
+  }
   @media #{$tablet} {
     width: calc(100% - 2 * 24px);
     position: inherit;
@@ -28,7 +32,6 @@ a {
 }
 
 .structrue-details-container > .structure-details-block {
-  padding: 0px 0px 24px 0;
   .subtitle {
     text-transform: uppercase;
     @include cn-bold-16;
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
index d1e0fb6ed..3a7c37910 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
@@ -13,6 +13,7 @@ import { PublicCategorie } from '../../../../structure-list/enum/public.enum';
 })
 export class StructureDetailPrintComponent implements OnInit {
   @Input() public structure: Structure;
+  @Input() public preview: boolean;
   @Output() public closeDetails: EventEmitter<boolean> = new EventEmitter<boolean>();
   @Output() public dataReady: EventEmitter<boolean> = new EventEmitter<boolean>();
   public accessModality = AccessModality;
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
index 1c55aece5..aac3ee4c5 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
@@ -1,12 +1,11 @@
-<app-structure-print-header
-  class="multi-print"
-  [beneficiaryNeedCommentary]="beneficiaryNeedCommentary"
-  [beneficiaryName]="beneficiaryName"
-  [structureAccompaniment]="structureAccompaniment"
-  [beneficiaryPassNumeric]="beneficiaryPassNumeric"
-  [contactAccompaniment]="contactAccompaniment"
-  [filters]="filters"
-></app-structure-print-header>
 <div class="multi-print" *ngFor="let structure of structures">
+  <app-structure-print-header
+    [beneficiaryNeedCommentary]="beneficiaryNeedCommentary"
+    [beneficiaryName]="beneficiaryName"
+    [structureAccompaniment]="structureAccompaniment"
+    [beneficiaryPassNumeric]="beneficiaryPassNumeric"
+    [contactAccompaniment]="contactAccompaniment"
+    [filters]="filters"
+  ></app-structure-print-header>
   <app-structure-detail-print [structure]="structure"></app-structure-detail-print>
 </div>
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
index 768bc8ad1..da65f0f4c 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
@@ -1,3 +1,5 @@
+@import '../../../../../assets/scss/color';
+
 .list-to-print {
   height: 600px;
   overflow-x: hidden;
@@ -5,14 +7,32 @@
 }
 
 .multi-print {
+  :host {
+    background-color: $grey-6;
+  }
   ::ng-deep {
     .structrue-details-container {
-      page-break-after: always;
-      height: 100%;
+      margin-top: 2%;
+      margin-left: 34%;
+      height: 98%;
     }
     .print-header {
-      page-break-after: always;
       height: 100%;
     }
   }
+  page-break-after: always;
+  -webkit-print-color-adjust: exact;
+  width: 50%;
+  margin-left: 23%;
+  margin-right: 23%;
+  padding-left: 2%;
+  padding-right: 2%;
+  height: 80%;
+  overflow-x: hidden;
+  background-color: $white;
+  @media print {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+  }
 }
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
index 540db118a..dc15a3df0 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
@@ -1,16 +1,13 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { Structure } from '../../../../models/structure.model';
 import * as _ from 'lodash';
-import { ActivatedRoute } from '@angular/router';
-import { PrintService } from '../../../../shared/service/print.service';
 import { Filter } from '../../../../structure-list/models/filter.model';
-import Module from 'module';
 @Component({
   selector: 'app-structure-list-print',
   templateUrl: './structure-list-print.component.html',
   styleUrls: ['./structure-list-print.component.scss'],
 })
-export class StructureListPrintComponent implements OnInit {
+export class StructureListPrintComponent {
   @Input() public structures: Structure[];
   @Input() public filters: Filter[];
   @Input() public beneficiaryNeedCommentary: string;
@@ -18,8 +15,4 @@ export class StructureListPrintComponent implements OnInit {
   @Input() public structureAccompaniment: string;
   @Input() public beneficiaryPassNumeric: boolean;
   @Input() public contactAccompaniment: string;
-
-  constructor(private printService: PrintService, private route: ActivatedRoute) {}
-
-  async ngOnInit(): Promise<void> {}
 }
diff --git a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
index 616b544b1..7c09be927 100644
--- a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
+++ b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
@@ -9,14 +9,14 @@
         <h3>Fiche d'orientation</h3>
       </div>
     </div>
-    <p class="typeInformationHeader date">{{ date }}</p>
+    <p class="informationHeader date">{{ date }}</p>
   </div>
 
   <div class="informations">
     <div class="helper">
       <!-- Accompaniment -->
       <div *ngIf="structureAccompaniment">
-        <div class="typeInformationHeader">{{ 'Orienté par' | uppercase }}</div>
+        <div class="informationHeader">{{ 'Orienté par' | uppercase }}</div>
         <p class="bold">{{ structureAccompaniment }}</p>
         <!-- Contact -->
         <p class="bold" *ngIf="contactAccompaniment">{{ contactAccompaniment }}</p>
@@ -24,39 +24,39 @@
       </div>
     </div>
     <div class="beneficiary">
-      <div class="typeInformationHeader">{{ 'Bénéficiaire' | uppercase }}</div>
+      <div class="informationHeader">{{ 'Bénéficiaire' | uppercase }}</div>
       <!-- Name -->
-      <table>
+      <table class="beneficiaryNeeds">
         <tr>
-          <td class="typeInformationHeader">Nom</td>
+          <td class="informationHeader">Nom</td>
           <td class="bold">{{ beneficiaryName }}</td>
         </tr>
         <tr *ngIf="equipments.length > 0">
-          <td class="typeInformationHeader">Besoin(s) en matériel</td>
+          <td class="informationHeader">Besoin(s) en matériel</td>
           <td class="bold">
             <div *ngFor="let equipmentTag of equipments">
               {{ equipmentTag.text ? equipmentTag.text : equipmentTag.value }}
             </div>
           </td>
         </tr>
-        <tr *ngIf="formations.length > 0">
-          <td class="typeInformationHeader">Besoin(s) en formation</td>
+        <tr *ngIf="assistances.length > 0">
+          <td class="informationHeader">Besoin(s) en formation</td>
           <td class="bold">
-            <div *ngFor="let formationTag of formations">
-              {{ formationTag.text ? formationTag.text : formationTag.value }}
+            <div *ngFor="let assistanceTag of assistances">
+              {{ assistanceTag.text ? assistanceTag.text : assistanceTag.value }}
             </div>
           </td>
         </tr>
-        <tr *ngIf="assistances.length > 0">
-          <td class="typeInformationHeader">Besoin(s) d'accompagnement</td>
+        <tr *ngIf="formations.length > 0">
+          <td class="informationHeader">Besoin(s) d'accompagnement</td>
           <td class="bold">
-            <div *ngFor="let assistanceTag of assistances">
-              {{ assistanceTag.text ? assistanceTag.text : assistanceTag.value }}
+            <div *ngFor="let formationTag of formations">
+              {{ formationTag.text ? formationTag.text : formationTag.value }}
             </div>
           </td>
         </tr>
         <tr *ngIf="specificNeeds.length > 0">
-          <td class="typeInformationHeader">Besoin(s) spécifiques</td>
+          <td class="informationHeader">Besoin(s) spécifiques</td>
           <td class="bold">
             <div *ngFor="let specificNeed of specificNeeds">
               {{ specificNeed.text ? specificNeed.text : specificNeed.value }}
@@ -64,11 +64,11 @@
           </td>
         </tr>
         <tr *ngIf="beneficiaryPassNumeric">
-          <td class="typeInformationHeader">Pass Numérique</td>
+          <td class="informationHeader">Pass Numérique</td>
           <td class="bold">Oui</td>
         </tr>
         <tr *ngIf="beneficiaryNeedCommentary">
-          <td class="typeInformationHeader">Informations</td>
+          <td class="informationHeader">Informations</td>
           <td class="bold">{{ beneficiaryNeedCommentary }}</td>
         </tr>
       </table>
diff --git a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
index b9cce0c61..d82510988 100644
--- a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
+++ b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
@@ -35,9 +35,18 @@
   float: right;
 }
 
-.print-header {
-  page-break-after: always;
-  height: 100%;
+.beneficiaryNeeds {
+  td {
+    vertical-align: top;
+  }
+  border-collapse: separate;
+  border-spacing: 10px 15px;
+}
+
+.informationsHeader {
+  min-width: 35%;
+  margin-bottom: 5px;
+  color: $black;
 }
 
 .typeInformationHeader {
@@ -104,4 +113,8 @@
     padding: 2%;
     width: 70%;
   }
+
+  tr {
+    margin-bottom: 8px;
+  }
 }
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index 2b0d6d985..b340c16c5 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -333,6 +333,7 @@
         <app-structure-detail-print
           *ngFor="let structure of structuresToPrint"
           [structure]="structure"
+          [preview]="structure._id != structuresToPrint[structuresToPrint.length - 1]._id"
         ></app-structure-detail-print>
       </div>
     </div>
@@ -427,9 +428,10 @@
   <div *ngIf="currentPage == pageTypeEnum.printResults" class="form-footer">
     <div fxLayout="row" fxLayoutAlign="center center">
       <app-footer-form
-        [btnName]="['Précédent', 'Imprimer']"
+        [btnName]="['Précédent', 'Imprimer', 'Terminer']"
         (previousPage)="previousPage()"
         (nextPage)="runMultiPrint(true)"
+        (endPage)="displayFinishModal(true)"
         [isValid]="isPageValid"
       ></app-footer-form>
     </div>
@@ -443,12 +445,19 @@
   [beneficiaryName]="getOrientationControl('beneficiaryName').value"
   [structureAccompaniment]="getOrientationControl('structureAccompaniment').value"
   [beneficiaryPassNumeric]="getOrientationControl('passNumeric').value"
-  [contactAccompaniment]="getOrientationControl('contactAccompaniment').value"
+  [contactAccompaniment]="getOrientationControl('contactAccompanimentPhone').value"
   [filters]="filters"
 ></app-structure-list-print>
 
 <app-structure-details
-  *ngIf="showStructureDetails"
+  *ngFor="let structure of selectedStructure"
   [structure]="selectedStructure"
   (closeDetails)="closeDetails()"
 ></app-structure-details>
+
+<app-orientation-modal
+  *ngIf="displayModal"
+  [openned]="true"
+  (closed)="closeFinishModal($event)"
+  (previousPage)="previousPage()"
+></app-orientation-modal>
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index 7f6b8721d..be84bf160 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -77,6 +77,7 @@ export class OrientationFormComponent implements OnInit {
   public showFormation: boolean;
 
   public multiPrint: boolean = false;
+  public displayModal = false;
 
   public structuresList: Structure[];
   public structuresToPrint: Structure[] = [];
@@ -250,6 +251,9 @@ export class OrientationFormComponent implements OnInit {
     this.pagesValidation[PageTypeEnum.beneficiaryAddress] = {
       valid: true,
     };
+    this.pagesValidation[PageTypeEnum.beneficiaryAddress] = {
+      valid: true,
+    };
     this.pagesValidation[PageTypeEnum.printResults] = { valid: true };
     this.pagesValidation[PageTypeEnum.structuresSelection] = { valid: this.structuresToPrint.length > 0 };
 
@@ -535,4 +539,16 @@ export class OrientationFormComponent implements OnInit {
   onWindowAfterPrint() {
     this.multiPrint = false;
   }
+
+  public endPage() {
+    this.displayFinishModal(true);
+  }
+
+  public displayFinishModal(event: boolean): void {
+    this.displayModal = true;
+  }
+
+  public closeFinishModal(): void {
+    this.displayModal = false;
+  }
 }
diff --git a/src/assets/ico/flag.svg b/src/assets/ico/flag.svg
new file mode 100644
index 000000000..af8498d85
--- /dev/null
+++ b/src/assets/ico/flag.svg
@@ -0,0 +1,16 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6.01176" y="2.61237" width="1" height="17" rx="0.5" transform="rotate(15 6.01176 2.61237)" stroke="white"/>
+<rect x="6.90824" y="6.99372" width="1" height="1" transform="rotate(15 6.90824 6.99372)" stroke="white"/>
+<rect x="5.87308" y="10.8574" width="1" height="1" transform="rotate(15 5.87308 10.8574)" stroke="white"/>
+<rect x="10.7715" y="8.029" width="1" height="1" transform="rotate(15 10.7715 8.029)" stroke="white"/>
+<rect x="9.73637" y="11.8926" width="1" height="1" transform="rotate(15 9.73637 11.8926)" stroke="white"/>
+<rect x="14.6348" y="9.06428" width="1" height="1" transform="rotate(15 14.6348 9.06428)" stroke="white"/>
+<rect x="13.5996" y="12.9279" width="1" height="1" transform="rotate(15 13.5996 12.9279)" stroke="white"/>
+<rect x="8.3223" y="9.44318" width="1" height="1" transform="rotate(15 8.3223 9.44318)" stroke="white"/>
+<rect x="12.1856" y="10.4785" width="1" height="1" transform="rotate(15 12.1856 10.4785)" stroke="white"/>
+<rect x="16.0489" y="11.5137" width="1" height="1" transform="rotate(15 16.0489 11.5137)" stroke="white"/>
+<rect x="9.35746" y="5.57941" width="1" height="1" transform="rotate(15 9.35746 5.57941)" stroke="white"/>
+<rect x="13.2207" y="6.61469" width="1" height="1" transform="rotate(15 13.2207 6.61469)" stroke="white"/>
+<rect x="17.086" y="7.64997" width="1" height="1" transform="rotate(15 17.086 7.64997)" stroke="white"/>
+<rect x="6.71879" y="3.8371" width="13" height="9" transform="rotate(15 6.71879 3.8371)" stroke="white"/>
+</svg>
-- 
GitLab


From 581ef0b2fc2ad864d74e311aab65ac4e1c81fee8 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 15:10:44 +0100
Subject: [PATCH 02/16] fix: fix structure detail openning

---
 src/app/form/orientation-form/orientation-form.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index b340c16c5..ea2b77f6c 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -450,7 +450,7 @@
 ></app-structure-list-print>
 
 <app-structure-details
-  *ngFor="let structure of selectedStructure"
+  *ngIf="showStructureDetails"
   [structure]="selectedStructure"
   (closeDetails)="closeDetails()"
 ></app-structure-details>
-- 
GitLab


From ba14002dd37a2876f0fc404fe90a84526178adbd Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Fri, 18 Feb 2022 17:19:06 +0100
Subject: [PATCH 03/16] feat(orientation-form): add loader before print

---
 .../structure-detail-print.component.html           |  2 +-
 .../structure-detail-print.component.scss           |  4 ----
 .../structure-list-print.component.html             |  4 ++++
 .../structure-list-print.component.scss             | 13 ++++++++++++-
 .../orientation-form.component.html                 |  2 +-
 .../orientation-form.component.scss                 | 13 +++++++++++++
 6 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
index 408b63935..eb6736c0e 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
@@ -1,4 +1,4 @@
-<div class="structrue-details-container preview" *ngIf="structure" [ngClass]="{ preview: preview == true }">
+<div class="structrue-details-container" *ngIf="structure">
   <!-- Header info -->
   <div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
     <div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
index 32ac3a98e..8a463c255 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
@@ -14,10 +14,6 @@ a {
   width: 64%;
   margin-top: 1%;
   float: right;
-  &.preview {
-    border-bottom: solid 1px $grey-3;
-    margin-bottom: 4%;
-  }
   @media #{$tablet} {
     width: calc(100% - 2 * 24px);
     position: inherit;
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
index aac3ee4c5..0a11c4df1 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
@@ -9,3 +9,7 @@
   ></app-structure-print-header>
   <app-structure-detail-print [structure]="structure"></app-structure-detail-print>
 </div>
+<div class="loader">
+  <img class="loader-gif" src="/assets/gif/loader_circle.gif" alt />
+  <p>Liste en cours d'impression</p>
+</div>
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
index da65f0f4c..50e6aa8ff 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
@@ -1,4 +1,5 @@
 @import '../../../../../assets/scss/color';
+@import '../../../../../assets/scss/layout';
 
 .list-to-print {
   height: 600px;
@@ -27,12 +28,22 @@
   margin-right: 23%;
   padding-left: 2%;
   padding-right: 2%;
-  height: 80%;
+  height: 100%;
   overflow-x: hidden;
   background-color: $white;
+  @media screen {
+    display: none;
+  }
   @media print {
     width: 100%;
     margin: 0;
     padding: 0;
   }
 }
+
+.loader {
+  height: calc(100vh - #{$header-height} - #{$footer-height});
+  @media print {
+    display: none;
+  }
+}
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index ea2b77f6c..238770ffd 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -333,7 +333,7 @@
         <app-structure-detail-print
           *ngFor="let structure of structuresToPrint"
           [structure]="structure"
-          [preview]="structure._id != structuresToPrint[structuresToPrint.length - 1]._id"
+          class="print-structure-container"
         ></app-structure-detail-print>
       </div>
     </div>
diff --git a/src/app/form/orientation-form/orientation-form.component.scss b/src/app/form/orientation-form/orientation-form.component.scss
index b83f7a12b..c0d9b713d 100644
--- a/src/app/form/orientation-form/orientation-form.component.scss
+++ b/src/app/form/orientation-form/orientation-form.component.scss
@@ -288,3 +288,16 @@ input {
     font-style: italic;
   }
 }
+
+.print-structure-container {
+  ::ng-deep .structrue-details-container {
+    border-bottom: solid 1px $grey-3;
+    margin-bottom: 4%;
+  }
+}
+
+.print-structure-container:last-child {
+  ::ng-deep .structrue-details-container {
+    border-bottom: none;
+  }
+}
-- 
GitLab


From 499748b111852e3d50dd440a80d71ced31d32aa9 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 17:27:31 +0100
Subject: [PATCH 04/16] fix: carto height

---
 src/app/map/components/map.component.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss
index bac0c2f7f..3fe53bca3 100644
--- a/src/app/map/components/map.component.scss
+++ b/src/app/map/components/map.component.scss
@@ -24,7 +24,7 @@
     height: calc(100vh - #{$header-height} - 28px);
   }
   &.orientation {
-    height: calc(96vh - #{$header-height} - #{$footer-height} - 68px);
+    height: calc(96vh - #{$header-height} - #{$footer-height} - 68px - #{$footer-height-phone});
   }
 }
 
-- 
GitLab


From dc8d09a4193d4c3c483d2243639cc024f5d26017 Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Fri, 18 Feb 2022 17:43:00 +0100
Subject: [PATCH 05/16] feat(orientation-form): change print footer form
 responsive

---
 src/app/form/footer-form/footer-form.component.html | 2 +-
 src/app/form/footer-form/footer-form.component.scss | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 6ea671ae0..71e448b1d 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 7e92f0a59..5f304f554 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -1,5 +1,6 @@
 @import '../../../assets/scss/color';
 @import '../../../assets/scss/typography';
+@import '../../../assets/scss/breakpoint';
 
 .btn-primary {
   &.previous {
@@ -21,6 +22,12 @@
   }
 }
 
+.column {
+  @media #{$tablet} {
+    flex-direction: column !important;
+  }
+}
+
 .chevronLeft {
   height: 24px;
   width: 24px;
-- 
GitLab


From c0e3368cb00735a789c163bec760c6d271e4ea63 Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Mon, 21 Feb 2022 09:59:51 +0100
Subject: [PATCH 06/16] remove ghost code, add responsive to print buttons

---
 src/app/form/footer-form/footer-form.component.html           | 2 +-
 .../structure-detail-print.component.ts                       | 1 -
 src/app/form/orientation-form/orientation-form.component.html | 2 +-
 src/app/form/orientation-form/orientation-form.component.ts   | 4 ++--
 4 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 71e448b1d..e94576fc5 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
index 3a7c37910..d1e0fb6ed 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
@@ -13,7 +13,6 @@ import { PublicCategorie } from '../../../../structure-list/enum/public.enum';
 })
 export class StructureDetailPrintComponent implements OnInit {
   @Input() public structure: Structure;
-  @Input() public preview: boolean;
   @Output() public closeDetails: EventEmitter<boolean> = new EventEmitter<boolean>();
   @Output() public dataReady: EventEmitter<boolean> = new EventEmitter<boolean>();
   public accessModality = AccessModality;
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index 238770ffd..5dd05aaf7 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -431,7 +431,7 @@
         [btnName]="['Précédent', 'Imprimer', 'Terminer']"
         (previousPage)="previousPage()"
         (nextPage)="runMultiPrint(true)"
-        (endPage)="displayFinishModal(true)"
+        (endPage)="displayFinishModal()"
         [isValid]="isPageValid"
       ></app-footer-form>
     </div>
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index be84bf160..d267a2dee 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -541,10 +541,10 @@ export class OrientationFormComponent implements OnInit {
   }
 
   public endPage() {
-    this.displayFinishModal(true);
+    this.displayFinishModal();
   }
 
-  public displayFinishModal(event: boolean): void {
+  public displayFinishModal(): void {
     this.displayModal = true;
   }
 
-- 
GitLab


From 28ea61ed0e847d504326d4f193392e8f04b1f46e Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Mon, 21 Feb 2022 10:19:37 +0100
Subject: [PATCH 07/16] add space after print button

---
 src/app/form/footer-form/footer-form.component.html      | 6 +++---
 src/app/form/footer-form/footer-form.component.scss      | 9 +++------
 .../form/orientation-form/orientation-form.component.ts  | 4 ----
 3 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index e94576fc5..6f16e9909 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
@@ -24,13 +24,13 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Imprimer'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="print" aria-hidden="true">
         <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
       </svg>
       {{ btnName[1] }}
     </div>
-    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Suivant'" fxLayout="row" fxLayoutAlign="center center">
       {{ btnName[1] }}
       <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 5f304f554..76cc3752f 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -8,11 +8,6 @@
     color: $grey-2;
     border: solid $grey-4 1px;
   }
-  &.next {
-    .rowBtn {
-      margin-left: 24px;
-    }
-  }
   &.invalid {
     opacity: 0.4;
   }
@@ -25,6 +20,9 @@
 .column {
   @media #{$tablet} {
     flex-direction: column !important;
+    .next {
+      margin-right: 10px;
+    }
   }
 }
 
@@ -37,7 +35,6 @@
 .chevronRight {
   height: 24px;
   width: 24px;
-  // stroke: inherit;
   margin-left: 10px;
 }
 
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index d267a2dee..0a32de362 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -540,10 +540,6 @@ export class OrientationFormComponent implements OnInit {
     this.multiPrint = false;
   }
 
-  public endPage() {
-    this.displayFinishModal();
-  }
-
   public displayFinishModal(): void {
     this.displayModal = true;
   }
-- 
GitLab


From 9008c7f842e9b2d0a7850ce4beb44e8f75e5bb17 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Mon, 21 Feb 2022 14:30:29 +0100
Subject: [PATCH 08/16] fix: modal design and button display for mobile

---
 src/app/form/footer-form/footer-form.component.html   |  4 ++--
 src/app/form/footer-form/footer-form.component.scss   | 11 +++++++++--
 .../orientation-modal.component.html                  |  2 +-
 .../orientation-modal.component.scss                  | 10 ++++------
 .../orientation-modal/orientation-modal.component.ts  |  9 ++-------
 5 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 6f16e9909..71e448b1d 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -24,13 +24,13 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div *ngIf="btnName[1] == 'Imprimer'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
       <svg class="print" aria-hidden="true">
         <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
       </svg>
       {{ btnName[1] }}
     </div>
-    <div *ngIf="btnName[1] == 'Suivant'" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       {{ btnName[1] }}
       <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index a0cdff8ba..1fb5bf381 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -15,13 +15,20 @@
   &:focus .print {
     background-color: $secondary-color;
   }
+
+  &.next {
+    .rowBtn {
+      margin-left: 24px;
+    }
+  }
 }
 
 .column {
   @media #{$phone} {
     flex-direction: column !important;
-    .next {
-      margin-right: 10px;
+    button {
+      margin-bottom: 10px !important;
+      margin-right: 0 !important;
     }
   }
 }
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
index b2e923ef4..0e8de2f85 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
@@ -6,7 +6,7 @@
       fxLayout="row-reverse"
       fxLayoutAlign="space-around start"
     >
-      <div class="ico-close" fxLayout="row" fxLayoutAlign="end center">
+      <div class="ico-close">
         <div class="ico-close-wrapper">
           <div (click)="closeModal()" class="ico-close-details"></div>
         </div>
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
index 24dd3a35c..2fd765960 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
@@ -1,16 +1,14 @@
 @import '../../../../../assets/scss/typography';
 @import '../../../../../assets/scss/color';
 
-.ico-close {
-  width: 100%;
-  margin: 0 20px;
+.ico-close-details {
+  margin-right: 16px;
 }
 h3 {
   margin: 8% 15%;
-  width: 60%;
   text-align: center;
-  margin-left: 30%;
-  font-weight: lighter;
+  @include cn-regular-18;
+  color: $grey-2;
 }
 .modalContent {
   margin: 0 32px;
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
index d95283005..dfc3f86ab 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
@@ -1,20 +1,15 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { FormGroup } from '@angular/forms';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 
 @Component({
   selector: 'app-orientation-modal',
   templateUrl: './orientation-modal.component.html',
   styleUrls: ['./orientation-modal.component.scss'],
 })
-export class OrientationComponent implements OnInit {
-  constructor() {}
-
+export class OrientationComponent {
   @Input() public openned: boolean;
   @Output() closed = new EventEmitter();
   @Output() previousPage = new EventEmitter();
 
-  ngOnInit(): void {}
-
   public closeModal(): void {
     this.closed.emit();
   }
-- 
GitLab


From bfa6f0ce6df2daf49cc2b5e34c14fd481e7dc373 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 15:07:01 +0100
Subject: [PATCH 09/16] fix: mr issue

---
 src/app/app.module.ts                         |  2 ++
 .../footer-form/footer-form.component.html    | 22 ++++++++++--
 .../footer-form/footer-form.component.scss    | 21 ++++++++++++
 .../form/footer-form/footer-form.component.ts |  8 +++++
 .../orientation-modal.component.html          | 30 ++++++++++++++++
 .../orientation-modal.component.scss          | 29 ++++++++++++++++
 .../orientation-modal.component.spec.ts       | 26 ++++++++++++++
 .../orientation-modal.component.ts            | 25 ++++++++++++++
 .../structure-detail-print.component.html     |  4 +--
 .../structure-detail-print.component.scss     |  5 ++-
 .../structure-detail-print.component.ts       |  1 +
 .../structure-list-print.component.html       | 17 +++++-----
 .../structure-list-print.component.scss       | 26 ++++++++++++--
 .../structure-list-print.component.ts         |  9 +----
 .../structure-print-header.component.html     | 34 +++++++++----------
 .../structure-print-header.component.scss     | 19 +++++++++--
 .../orientation-form.component.html           | 15 ++++++--
 .../orientation-form.component.ts             | 16 +++++++++
 src/assets/ico/flag.svg                       | 16 +++++++++
 19 files changed, 276 insertions(+), 49 deletions(-)
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
 create mode 100644 src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
 create mode 100644 src/assets/ico/flag.svg

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index c07a408ad..eb67d95d7 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -39,6 +39,7 @@ import { OrientationFormComponent } from './form/orientation-form/orientation-fo
 import { StructureDetailPrintComponent } from './form/orientation-form/component/structure-detail-print/structure-detail-print.component';
 import { StructureListPrintComponent } from './form/orientation-form/component/structure-list-print/structure-list-print.component';
 import { StructurePrintHeaderComponent } from './form/orientation-form/component/structure-print-header/structure-print-header.component';
+import { OrientationComponent } from './form/orientation-form/component/orientation-modal/orientation-modal.component';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { environment } from '../environments/environment';
 import { StructureResolver } from './resolvers/structure.resolver';
@@ -71,6 +72,7 @@ import { UpdateService } from './services/update.service';
     StructureDetailPrintComponent,
     StructureListPrintComponent,
     StructurePrintHeaderComponent,
+    OrientationComponent,
   ],
   imports: [
     BrowserModule,
diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 84e1517f2..6ea671ae0 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -7,6 +7,16 @@
       {{ btnName[0] }}
     </div>
   </button>
+
+  <button *ngIf="hasFinishButton()" class="btn-primary small previous" (click)="finishedModal()">
+    <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+      <svg class="flag" aria-hidden="true">
+        <use [attr.xlink:href]="'/assets/ico/flag.svg'"></use>
+      </svg>
+      {{ btnName[2] }}
+    </div>
+  </button>
+
   <button
     class="btn-primary small next"
     (click)="goToNextPage()"
@@ -14,9 +24,15 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
-      {{ btnName[1]
-      }}<svg class="chevronRight" aria-hidden="true">
+    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
+      <svg class="print" aria-hidden="true">
+        <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
+      </svg>
+      {{ btnName[1] }}
+    </div>
+    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+      {{ btnName[1] }}
+      <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
       </svg>
     </div>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 61ae2b385..7e92f0a59 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -15,6 +15,10 @@
   &.invalid {
     opacity: 0.4;
   }
+
+  &:focus .print {
+    background-color: $secondary-color;
+  }
 }
 
 .chevronLeft {
@@ -29,3 +33,20 @@
   // stroke: inherit;
   margin-left: 10px;
 }
+
+.print {
+  stroke: $white;
+  width: 20px;
+  height: 20px;
+  padding-right: 20px;
+  background-color: $white;
+  mask: url(/assets/ico/print.svg) no-repeat center;
+}
+.flag {
+  padding-right: 10px;
+  stroke: $black;
+  width: 20px;
+  height: 20px;
+  background-color: $grey-1;
+  mask: url(/assets/ico/flag.svg) no-repeat center;
+}
diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 12736e3ac..3a0fa9237 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -11,6 +11,7 @@ export class FooterFormComponent {
   @Input() displayPreviousButton: boolean = true;
   @Output() nextPage = new EventEmitter<any>();
   @Output() previousPage = new EventEmitter<any>();
+  @Output() endPage = new EventEmitter<any>();
 
   public goToNextPage(): void {
     this.nextPage.emit();
@@ -19,4 +20,11 @@ export class FooterFormComponent {
   public goToPreviousPage(): void {
     this.previousPage.emit();
   }
+
+  public hasFinishButton(): boolean {
+    return this.btnName.length == 3;
+  }
+  public finishedModal(): void {
+    this.endPage.emit();
+  }
 }
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
new file mode 100644
index 000000000..b2e923ef4
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
@@ -0,0 +1,30 @@
+<div *ngIf="openned" class="modalBackground">
+  <div class="modal">
+    <div
+      (clickOutside)="closeModal(false)"
+      class="contentModal"
+      fxLayout="row-reverse"
+      fxLayoutAlign="space-around start"
+    >
+      <div class="ico-close" fxLayout="row" fxLayoutAlign="end center">
+        <div class="ico-close-wrapper">
+          <div (click)="closeModal()" class="ico-close-details"></div>
+        </div>
+      </div>
+
+      <div class="modalContent">
+        <h3 fxLayoutAlign="center center">Souhaitez-vous terminer cette orientation ?</h3>
+
+        <div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center">
+          <button type="button" class="btn confirm" (click)="goToPreviousPage()">Revenir aux résultats</button>
+          <button class="btn-primary small previous" routerLink="../home">
+            <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+              <img class="flag" src="/assets/ico/flag.svg" alt />
+              Terminer
+            </div>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
new file mode 100644
index 000000000..24dd3a35c
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
@@ -0,0 +1,29 @@
+@import '../../../../../assets/scss/typography';
+@import '../../../../../assets/scss/color';
+
+.ico-close {
+  width: 100%;
+  margin: 0 20px;
+}
+h3 {
+  margin: 8% 15%;
+  width: 60%;
+  text-align: center;
+  margin-left: 30%;
+  font-weight: lighter;
+}
+.modalContent {
+  margin: 0 32px;
+  width: 100%;
+}
+.footerModal {
+  margin: 25px;
+}
+.modalBackground .modal .footerModal .btn.confirm {
+  font-size: 14px;
+  font-weight: normal;
+}
+.flag {
+  padding-right: 10px;
+  stroke: $white;
+}
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
new file mode 100644
index 000000000..4950443e7
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.spec.ts
@@ -0,0 +1,26 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OrientationComponent } from './orientation-modal.component';
+
+describe('OrientationModalComponent', () => {
+  let component: OrientationComponent;
+  let fixture: ComponentFixture<OrientationComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [OrientationComponent],
+      imports: [HttpClientTestingModule],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OrientationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
new file mode 100644
index 000000000..d95283005
--- /dev/null
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
@@ -0,0 +1,25 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+
+@Component({
+  selector: 'app-orientation-modal',
+  templateUrl: './orientation-modal.component.html',
+  styleUrls: ['./orientation-modal.component.scss'],
+})
+export class OrientationComponent implements OnInit {
+  constructor() {}
+
+  @Input() public openned: boolean;
+  @Output() closed = new EventEmitter();
+  @Output() previousPage = new EventEmitter();
+
+  ngOnInit(): void {}
+
+  public closeModal(): void {
+    this.closed.emit();
+  }
+  public goToPreviousPage(): void {
+    this.closeModal();
+    this.previousPage.emit();
+  }
+}
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
index 7d7ed3c9e..408b63935 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
@@ -1,4 +1,4 @@
-<div class="structrue-details-container" *ngIf="structure">
+<div class="structrue-details-container preview" *ngIf="structure" [ngClass]="{ preview: preview == true }">
   <!-- Header info -->
   <div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
     <div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
@@ -6,7 +6,7 @@
         <h3 class="bold">{{ structure.structureName }}</h3>
       </div>
       <div class="mobile-column">
-        <div fxLayout="column" fxFlex="50%">
+        <div fxLayout="column" fxFlex="100%">
           <div *ngIf="structure.address" fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
             <app-svg-icon [type]="'ico'" [icon]="'adress'" [title]="'Adresse'"></app-svg-icon>
             <p>{{ structure.address.numero }} {{ structure.address.street }}, {{ structure.address.commune }}</p>
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
index 155566070..32ac3a98e 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
@@ -14,6 +14,10 @@ a {
   width: 64%;
   margin-top: 1%;
   float: right;
+  &.preview {
+    border-bottom: solid 1px $grey-3;
+    margin-bottom: 4%;
+  }
   @media #{$tablet} {
     width: calc(100% - 2 * 24px);
     position: inherit;
@@ -28,7 +32,6 @@ a {
 }
 
 .structrue-details-container > .structure-details-block {
-  padding: 0px 0px 24px 0;
   .subtitle {
     text-transform: uppercase;
     @include cn-bold-16;
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
index d1e0fb6ed..3a7c37910 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
@@ -13,6 +13,7 @@ import { PublicCategorie } from '../../../../structure-list/enum/public.enum';
 })
 export class StructureDetailPrintComponent implements OnInit {
   @Input() public structure: Structure;
+  @Input() public preview: boolean;
   @Output() public closeDetails: EventEmitter<boolean> = new EventEmitter<boolean>();
   @Output() public dataReady: EventEmitter<boolean> = new EventEmitter<boolean>();
   public accessModality = AccessModality;
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
index 1c55aece5..aac3ee4c5 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
@@ -1,12 +1,11 @@
-<app-structure-print-header
-  class="multi-print"
-  [beneficiaryNeedCommentary]="beneficiaryNeedCommentary"
-  [beneficiaryName]="beneficiaryName"
-  [structureAccompaniment]="structureAccompaniment"
-  [beneficiaryPassNumeric]="beneficiaryPassNumeric"
-  [contactAccompaniment]="contactAccompaniment"
-  [filters]="filters"
-></app-structure-print-header>
 <div class="multi-print" *ngFor="let structure of structures">
+  <app-structure-print-header
+    [beneficiaryNeedCommentary]="beneficiaryNeedCommentary"
+    [beneficiaryName]="beneficiaryName"
+    [structureAccompaniment]="structureAccompaniment"
+    [beneficiaryPassNumeric]="beneficiaryPassNumeric"
+    [contactAccompaniment]="contactAccompaniment"
+    [filters]="filters"
+  ></app-structure-print-header>
   <app-structure-detail-print [structure]="structure"></app-structure-detail-print>
 </div>
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
index 768bc8ad1..da65f0f4c 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
@@ -1,3 +1,5 @@
+@import '../../../../../assets/scss/color';
+
 .list-to-print {
   height: 600px;
   overflow-x: hidden;
@@ -5,14 +7,32 @@
 }
 
 .multi-print {
+  :host {
+    background-color: $grey-6;
+  }
   ::ng-deep {
     .structrue-details-container {
-      page-break-after: always;
-      height: 100%;
+      margin-top: 2%;
+      margin-left: 34%;
+      height: 98%;
     }
     .print-header {
-      page-break-after: always;
       height: 100%;
     }
   }
+  page-break-after: always;
+  -webkit-print-color-adjust: exact;
+  width: 50%;
+  margin-left: 23%;
+  margin-right: 23%;
+  padding-left: 2%;
+  padding-right: 2%;
+  height: 80%;
+  overflow-x: hidden;
+  background-color: $white;
+  @media print {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+  }
 }
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
index 540db118a..dc15a3df0 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.ts
@@ -1,16 +1,13 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { Structure } from '../../../../models/structure.model';
 import * as _ from 'lodash';
-import { ActivatedRoute } from '@angular/router';
-import { PrintService } from '../../../../shared/service/print.service';
 import { Filter } from '../../../../structure-list/models/filter.model';
-import Module from 'module';
 @Component({
   selector: 'app-structure-list-print',
   templateUrl: './structure-list-print.component.html',
   styleUrls: ['./structure-list-print.component.scss'],
 })
-export class StructureListPrintComponent implements OnInit {
+export class StructureListPrintComponent {
   @Input() public structures: Structure[];
   @Input() public filters: Filter[];
   @Input() public beneficiaryNeedCommentary: string;
@@ -18,8 +15,4 @@ export class StructureListPrintComponent implements OnInit {
   @Input() public structureAccompaniment: string;
   @Input() public beneficiaryPassNumeric: boolean;
   @Input() public contactAccompaniment: string;
-
-  constructor(private printService: PrintService, private route: ActivatedRoute) {}
-
-  async ngOnInit(): Promise<void> {}
 }
diff --git a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
index 616b544b1..7c09be927 100644
--- a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
+++ b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.html
@@ -9,14 +9,14 @@
         <h3>Fiche d'orientation</h3>
       </div>
     </div>
-    <p class="typeInformationHeader date">{{ date }}</p>
+    <p class="informationHeader date">{{ date }}</p>
   </div>
 
   <div class="informations">
     <div class="helper">
       <!-- Accompaniment -->
       <div *ngIf="structureAccompaniment">
-        <div class="typeInformationHeader">{{ 'Orienté par' | uppercase }}</div>
+        <div class="informationHeader">{{ 'Orienté par' | uppercase }}</div>
         <p class="bold">{{ structureAccompaniment }}</p>
         <!-- Contact -->
         <p class="bold" *ngIf="contactAccompaniment">{{ contactAccompaniment }}</p>
@@ -24,39 +24,39 @@
       </div>
     </div>
     <div class="beneficiary">
-      <div class="typeInformationHeader">{{ 'Bénéficiaire' | uppercase }}</div>
+      <div class="informationHeader">{{ 'Bénéficiaire' | uppercase }}</div>
       <!-- Name -->
-      <table>
+      <table class="beneficiaryNeeds">
         <tr>
-          <td class="typeInformationHeader">Nom</td>
+          <td class="informationHeader">Nom</td>
           <td class="bold">{{ beneficiaryName }}</td>
         </tr>
         <tr *ngIf="equipments.length > 0">
-          <td class="typeInformationHeader">Besoin(s) en matériel</td>
+          <td class="informationHeader">Besoin(s) en matériel</td>
           <td class="bold">
             <div *ngFor="let equipmentTag of equipments">
               {{ equipmentTag.text ? equipmentTag.text : equipmentTag.value }}
             </div>
           </td>
         </tr>
-        <tr *ngIf="formations.length > 0">
-          <td class="typeInformationHeader">Besoin(s) en formation</td>
+        <tr *ngIf="assistances.length > 0">
+          <td class="informationHeader">Besoin(s) en formation</td>
           <td class="bold">
-            <div *ngFor="let formationTag of formations">
-              {{ formationTag.text ? formationTag.text : formationTag.value }}
+            <div *ngFor="let assistanceTag of assistances">
+              {{ assistanceTag.text ? assistanceTag.text : assistanceTag.value }}
             </div>
           </td>
         </tr>
-        <tr *ngIf="assistances.length > 0">
-          <td class="typeInformationHeader">Besoin(s) d'accompagnement</td>
+        <tr *ngIf="formations.length > 0">
+          <td class="informationHeader">Besoin(s) d'accompagnement</td>
           <td class="bold">
-            <div *ngFor="let assistanceTag of assistances">
-              {{ assistanceTag.text ? assistanceTag.text : assistanceTag.value }}
+            <div *ngFor="let formationTag of formations">
+              {{ formationTag.text ? formationTag.text : formationTag.value }}
             </div>
           </td>
         </tr>
         <tr *ngIf="specificNeeds.length > 0">
-          <td class="typeInformationHeader">Besoin(s) spécifiques</td>
+          <td class="informationHeader">Besoin(s) spécifiques</td>
           <td class="bold">
             <div *ngFor="let specificNeed of specificNeeds">
               {{ specificNeed.text ? specificNeed.text : specificNeed.value }}
@@ -64,11 +64,11 @@
           </td>
         </tr>
         <tr *ngIf="beneficiaryPassNumeric">
-          <td class="typeInformationHeader">Pass Numérique</td>
+          <td class="informationHeader">Pass Numérique</td>
           <td class="bold">Oui</td>
         </tr>
         <tr *ngIf="beneficiaryNeedCommentary">
-          <td class="typeInformationHeader">Informations</td>
+          <td class="informationHeader">Informations</td>
           <td class="bold">{{ beneficiaryNeedCommentary }}</td>
         </tr>
       </table>
diff --git a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
index b9cce0c61..d82510988 100644
--- a/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
+++ b/src/app/form/orientation-form/component/structure-print-header/structure-print-header.component.scss
@@ -35,9 +35,18 @@
   float: right;
 }
 
-.print-header {
-  page-break-after: always;
-  height: 100%;
+.beneficiaryNeeds {
+  td {
+    vertical-align: top;
+  }
+  border-collapse: separate;
+  border-spacing: 10px 15px;
+}
+
+.informationsHeader {
+  min-width: 35%;
+  margin-bottom: 5px;
+  color: $black;
 }
 
 .typeInformationHeader {
@@ -104,4 +113,8 @@
     padding: 2%;
     width: 70%;
   }
+
+  tr {
+    margin-bottom: 8px;
+  }
 }
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index 2b0d6d985..b340c16c5 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -333,6 +333,7 @@
         <app-structure-detail-print
           *ngFor="let structure of structuresToPrint"
           [structure]="structure"
+          [preview]="structure._id != structuresToPrint[structuresToPrint.length - 1]._id"
         ></app-structure-detail-print>
       </div>
     </div>
@@ -427,9 +428,10 @@
   <div *ngIf="currentPage == pageTypeEnum.printResults" class="form-footer">
     <div fxLayout="row" fxLayoutAlign="center center">
       <app-footer-form
-        [btnName]="['Précédent', 'Imprimer']"
+        [btnName]="['Précédent', 'Imprimer', 'Terminer']"
         (previousPage)="previousPage()"
         (nextPage)="runMultiPrint(true)"
+        (endPage)="displayFinishModal(true)"
         [isValid]="isPageValid"
       ></app-footer-form>
     </div>
@@ -443,12 +445,19 @@
   [beneficiaryName]="getOrientationControl('beneficiaryName').value"
   [structureAccompaniment]="getOrientationControl('structureAccompaniment').value"
   [beneficiaryPassNumeric]="getOrientationControl('passNumeric').value"
-  [contactAccompaniment]="getOrientationControl('contactAccompaniment').value"
+  [contactAccompaniment]="getOrientationControl('contactAccompanimentPhone').value"
   [filters]="filters"
 ></app-structure-list-print>
 
 <app-structure-details
-  *ngIf="showStructureDetails"
+  *ngFor="let structure of selectedStructure"
   [structure]="selectedStructure"
   (closeDetails)="closeDetails()"
 ></app-structure-details>
+
+<app-orientation-modal
+  *ngIf="displayModal"
+  [openned]="true"
+  (closed)="closeFinishModal($event)"
+  (previousPage)="previousPage()"
+></app-orientation-modal>
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index 7f6b8721d..be84bf160 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -77,6 +77,7 @@ export class OrientationFormComponent implements OnInit {
   public showFormation: boolean;
 
   public multiPrint: boolean = false;
+  public displayModal = false;
 
   public structuresList: Structure[];
   public structuresToPrint: Structure[] = [];
@@ -250,6 +251,9 @@ export class OrientationFormComponent implements OnInit {
     this.pagesValidation[PageTypeEnum.beneficiaryAddress] = {
       valid: true,
     };
+    this.pagesValidation[PageTypeEnum.beneficiaryAddress] = {
+      valid: true,
+    };
     this.pagesValidation[PageTypeEnum.printResults] = { valid: true };
     this.pagesValidation[PageTypeEnum.structuresSelection] = { valid: this.structuresToPrint.length > 0 };
 
@@ -535,4 +539,16 @@ export class OrientationFormComponent implements OnInit {
   onWindowAfterPrint() {
     this.multiPrint = false;
   }
+
+  public endPage() {
+    this.displayFinishModal(true);
+  }
+
+  public displayFinishModal(event: boolean): void {
+    this.displayModal = true;
+  }
+
+  public closeFinishModal(): void {
+    this.displayModal = false;
+  }
 }
diff --git a/src/assets/ico/flag.svg b/src/assets/ico/flag.svg
new file mode 100644
index 000000000..af8498d85
--- /dev/null
+++ b/src/assets/ico/flag.svg
@@ -0,0 +1,16 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="6.01176" y="2.61237" width="1" height="17" rx="0.5" transform="rotate(15 6.01176 2.61237)" stroke="white"/>
+<rect x="6.90824" y="6.99372" width="1" height="1" transform="rotate(15 6.90824 6.99372)" stroke="white"/>
+<rect x="5.87308" y="10.8574" width="1" height="1" transform="rotate(15 5.87308 10.8574)" stroke="white"/>
+<rect x="10.7715" y="8.029" width="1" height="1" transform="rotate(15 10.7715 8.029)" stroke="white"/>
+<rect x="9.73637" y="11.8926" width="1" height="1" transform="rotate(15 9.73637 11.8926)" stroke="white"/>
+<rect x="14.6348" y="9.06428" width="1" height="1" transform="rotate(15 14.6348 9.06428)" stroke="white"/>
+<rect x="13.5996" y="12.9279" width="1" height="1" transform="rotate(15 13.5996 12.9279)" stroke="white"/>
+<rect x="8.3223" y="9.44318" width="1" height="1" transform="rotate(15 8.3223 9.44318)" stroke="white"/>
+<rect x="12.1856" y="10.4785" width="1" height="1" transform="rotate(15 12.1856 10.4785)" stroke="white"/>
+<rect x="16.0489" y="11.5137" width="1" height="1" transform="rotate(15 16.0489 11.5137)" stroke="white"/>
+<rect x="9.35746" y="5.57941" width="1" height="1" transform="rotate(15 9.35746 5.57941)" stroke="white"/>
+<rect x="13.2207" y="6.61469" width="1" height="1" transform="rotate(15 13.2207 6.61469)" stroke="white"/>
+<rect x="17.086" y="7.64997" width="1" height="1" transform="rotate(15 17.086 7.64997)" stroke="white"/>
+<rect x="6.71879" y="3.8371" width="13" height="9" transform="rotate(15 6.71879 3.8371)" stroke="white"/>
+</svg>
-- 
GitLab


From 99ae55f7710a628b2a2359adf8992fa0aa25d209 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 15:10:44 +0100
Subject: [PATCH 10/16] fix: fix structure detail openning

---
 src/app/form/orientation-form/orientation-form.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index b340c16c5..ea2b77f6c 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -450,7 +450,7 @@
 ></app-structure-list-print>
 
 <app-structure-details
-  *ngFor="let structure of selectedStructure"
+  *ngIf="showStructureDetails"
   [structure]="selectedStructure"
   (closeDetails)="closeDetails()"
 ></app-structure-details>
-- 
GitLab


From 9bb1c1e7b4dd0e394c0be28ac7a1a99d6d4b2e34 Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Fri, 18 Feb 2022 17:19:06 +0100
Subject: [PATCH 11/16] feat(orientation-form): add loader before print

---
 .../structure-detail-print.component.html           |  2 +-
 .../structure-detail-print.component.scss           |  4 ----
 .../structure-list-print.component.html             |  4 ++++
 .../structure-list-print.component.scss             | 13 ++++++++++++-
 .../orientation-form.component.html                 |  2 +-
 .../orientation-form.component.scss                 | 13 +++++++++++++
 6 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
index 408b63935..eb6736c0e 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.html
@@ -1,4 +1,4 @@
-<div class="structrue-details-container preview" *ngIf="structure" [ngClass]="{ preview: preview == true }">
+<div class="structrue-details-container" *ngIf="structure">
   <!-- Header info -->
   <div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
     <div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
index 32ac3a98e..8a463c255 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.scss
@@ -14,10 +14,6 @@ a {
   width: 64%;
   margin-top: 1%;
   float: right;
-  &.preview {
-    border-bottom: solid 1px $grey-3;
-    margin-bottom: 4%;
-  }
   @media #{$tablet} {
     width: calc(100% - 2 * 24px);
     position: inherit;
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
index aac3ee4c5..0a11c4df1 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.html
@@ -9,3 +9,7 @@
   ></app-structure-print-header>
   <app-structure-detail-print [structure]="structure"></app-structure-detail-print>
 </div>
+<div class="loader">
+  <img class="loader-gif" src="/assets/gif/loader_circle.gif" alt />
+  <p>Liste en cours d'impression</p>
+</div>
diff --git a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
index da65f0f4c..50e6aa8ff 100644
--- a/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
+++ b/src/app/form/orientation-form/component/structure-list-print/structure-list-print.component.scss
@@ -1,4 +1,5 @@
 @import '../../../../../assets/scss/color';
+@import '../../../../../assets/scss/layout';
 
 .list-to-print {
   height: 600px;
@@ -27,12 +28,22 @@
   margin-right: 23%;
   padding-left: 2%;
   padding-right: 2%;
-  height: 80%;
+  height: 100%;
   overflow-x: hidden;
   background-color: $white;
+  @media screen {
+    display: none;
+  }
   @media print {
     width: 100%;
     margin: 0;
     padding: 0;
   }
 }
+
+.loader {
+  height: calc(100vh - #{$header-height} - #{$footer-height});
+  @media print {
+    display: none;
+  }
+}
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index ea2b77f6c..238770ffd 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -333,7 +333,7 @@
         <app-structure-detail-print
           *ngFor="let structure of structuresToPrint"
           [structure]="structure"
-          [preview]="structure._id != structuresToPrint[structuresToPrint.length - 1]._id"
+          class="print-structure-container"
         ></app-structure-detail-print>
       </div>
     </div>
diff --git a/src/app/form/orientation-form/orientation-form.component.scss b/src/app/form/orientation-form/orientation-form.component.scss
index b83f7a12b..c0d9b713d 100644
--- a/src/app/form/orientation-form/orientation-form.component.scss
+++ b/src/app/form/orientation-form/orientation-form.component.scss
@@ -288,3 +288,16 @@ input {
     font-style: italic;
   }
 }
+
+.print-structure-container {
+  ::ng-deep .structrue-details-container {
+    border-bottom: solid 1px $grey-3;
+    margin-bottom: 4%;
+  }
+}
+
+.print-structure-container:last-child {
+  ::ng-deep .structrue-details-container {
+    border-bottom: none;
+  }
+}
-- 
GitLab


From 4ae85418ba9c5daa6585ef8e0c29f5d1ba9a2f5a Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Fri, 18 Feb 2022 17:43:00 +0100
Subject: [PATCH 12/16] feat(orientation-form): change print footer form
 responsive

---
 src/app/form/footer-form/footer-form.component.html | 2 +-
 src/app/form/footer-form/footer-form.component.scss | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 6ea671ae0..71e448b1d 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 7e92f0a59..5f304f554 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -1,5 +1,6 @@
 @import '../../../assets/scss/color';
 @import '../../../assets/scss/typography';
+@import '../../../assets/scss/breakpoint';
 
 .btn-primary {
   &.previous {
@@ -21,6 +22,12 @@
   }
 }
 
+.column {
+  @media #{$tablet} {
+    flex-direction: column !important;
+  }
+}
+
 .chevronLeft {
   height: 24px;
   width: 24px;
-- 
GitLab


From 6257f4dce66996d3ccb0f87d5c4c1556a55dc8bc Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Mon, 21 Feb 2022 09:59:51 +0100
Subject: [PATCH 13/16] remove ghost code, add responsive to print buttons

---
 src/app/form/footer-form/footer-form.component.html           | 2 +-
 .../structure-detail-print.component.ts                       | 1 -
 src/app/form/orientation-form/orientation-form.component.html | 2 +-
 src/app/form/orientation-form/orientation-form.component.ts   | 4 ++--
 4 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 71e448b1d..e94576fc5 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
diff --git a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
index 3a7c37910..d1e0fb6ed 100644
--- a/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
+++ b/src/app/form/orientation-form/component/structure-detail-print/structure-detail-print.component.ts
@@ -13,7 +13,6 @@ import { PublicCategorie } from '../../../../structure-list/enum/public.enum';
 })
 export class StructureDetailPrintComponent implements OnInit {
   @Input() public structure: Structure;
-  @Input() public preview: boolean;
   @Output() public closeDetails: EventEmitter<boolean> = new EventEmitter<boolean>();
   @Output() public dataReady: EventEmitter<boolean> = new EventEmitter<boolean>();
   public accessModality = AccessModality;
diff --git a/src/app/form/orientation-form/orientation-form.component.html b/src/app/form/orientation-form/orientation-form.component.html
index 238770ffd..5dd05aaf7 100644
--- a/src/app/form/orientation-form/orientation-form.component.html
+++ b/src/app/form/orientation-form/orientation-form.component.html
@@ -431,7 +431,7 @@
         [btnName]="['Précédent', 'Imprimer', 'Terminer']"
         (previousPage)="previousPage()"
         (nextPage)="runMultiPrint(true)"
-        (endPage)="displayFinishModal(true)"
+        (endPage)="displayFinishModal()"
         [isValid]="isPageValid"
       ></app-footer-form>
     </div>
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index be84bf160..d267a2dee 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -541,10 +541,10 @@ export class OrientationFormComponent implements OnInit {
   }
 
   public endPage() {
-    this.displayFinishModal(true);
+    this.displayFinishModal();
   }
 
-  public displayFinishModal(event: boolean): void {
+  public displayFinishModal(): void {
     this.displayModal = true;
   }
 
-- 
GitLab


From f75e9f0916cde162b328dfaaa5879e60efc26cd7 Mon Sep 17 00:00:00 2001
From: Augustin Leconte <ext.sopra.aleconte@grandlyon.com>
Date: Mon, 21 Feb 2022 10:19:37 +0100
Subject: [PATCH 14/16] add space after print button

---
 src/app/form/footer-form/footer-form.component.html      | 6 +++---
 src/app/form/footer-form/footer-form.component.scss      | 9 +++------
 .../form/orientation-form/orientation-form.component.ts  | 4 ----
 3 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index e94576fc5..6f16e9909 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutAlign="center center">
+<div fxLayout="row" [ngClass]="{ column: hasFinishButton() }" fxLayoutGap="10px" fxLayoutAlign="center center">
   <button *ngIf="displayPreviousButton" class="btn-primary small previous" (click)="goToPreviousPage()">
     <div class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="chevronLeft" aria-hidden="true">
@@ -24,13 +24,13 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Imprimer'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       <svg class="print" aria-hidden="true">
         <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
       </svg>
       {{ btnName[1] }}
     </div>
-    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Suivant'" fxLayout="row" fxLayoutAlign="center center">
       {{ btnName[1] }}
       <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 5f304f554..76cc3752f 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -8,11 +8,6 @@
     color: $grey-2;
     border: solid $grey-4 1px;
   }
-  &.next {
-    .rowBtn {
-      margin-left: 24px;
-    }
-  }
   &.invalid {
     opacity: 0.4;
   }
@@ -25,6 +20,9 @@
 .column {
   @media #{$tablet} {
     flex-direction: column !important;
+    .next {
+      margin-right: 10px;
+    }
   }
 }
 
@@ -37,7 +35,6 @@
 .chevronRight {
   height: 24px;
   width: 24px;
-  // stroke: inherit;
   margin-left: 10px;
 }
 
diff --git a/src/app/form/orientation-form/orientation-form.component.ts b/src/app/form/orientation-form/orientation-form.component.ts
index d267a2dee..0a32de362 100644
--- a/src/app/form/orientation-form/orientation-form.component.ts
+++ b/src/app/form/orientation-form/orientation-form.component.ts
@@ -540,10 +540,6 @@ export class OrientationFormComponent implements OnInit {
     this.multiPrint = false;
   }
 
-  public endPage() {
-    this.displayFinishModal();
-  }
-
   public displayFinishModal(): void {
     this.displayModal = true;
   }
-- 
GitLab


From 072e8935cff35fcef84f503dafee9ace300b19df Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Fri, 18 Feb 2022 17:27:31 +0100
Subject: [PATCH 15/16] fix: carto height

---
 src/app/map/components/map.component.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/map/components/map.component.scss b/src/app/map/components/map.component.scss
index bac0c2f7f..3fe53bca3 100644
--- a/src/app/map/components/map.component.scss
+++ b/src/app/map/components/map.component.scss
@@ -24,7 +24,7 @@
     height: calc(100vh - #{$header-height} - 28px);
   }
   &.orientation {
-    height: calc(96vh - #{$header-height} - #{$footer-height} - 68px);
+    height: calc(96vh - #{$header-height} - #{$footer-height} - 68px - #{$footer-height-phone});
   }
 }
 
-- 
GitLab


From 32c12fcead707c57cf3f6c5038a9ec6106f705ca Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Mon, 21 Feb 2022 14:30:29 +0100
Subject: [PATCH 16/16] fix: modal design and button display for mobile

---
 src/app/form/footer-form/footer-form.component.html   |  4 ++--
 src/app/form/footer-form/footer-form.component.scss   | 11 +++++++++--
 .../orientation-modal.component.html                  |  2 +-
 .../orientation-modal.component.scss                  | 10 ++++------
 .../orientation-modal/orientation-modal.component.ts  |  9 ++-------
 5 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index 6f16e9909..71e448b1d 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -24,13 +24,13 @@
     type="submit"
     [ngClass]="{ invalid: !isValid }"
   >
-    <div *ngIf="btnName[1] == 'Imprimer'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Imprimer'" fxLayout="row" fxLayoutAlign="center center">
       <svg class="print" aria-hidden="true">
         <use [attr.xlink:href]="'/assets/ico/print.svg'"></use>
       </svg>
       {{ btnName[1] }}
     </div>
-    <div *ngIf="btnName[1] == 'Suivant'" fxLayout="row" fxLayoutAlign="center center">
+    <div *ngIf="btnName[1] == 'Suivant'" class="rowBtn" fxLayout="row" fxLayoutAlign="center center">
       {{ btnName[1] }}
       <svg class="chevronRight" aria-hidden="true">
         <use [attr.xlink:href]="'assets/form/sprite.svg#chevronRight'"></use>
diff --git a/src/app/form/footer-form/footer-form.component.scss b/src/app/form/footer-form/footer-form.component.scss
index 76cc3752f..e8a7d6e78 100644
--- a/src/app/form/footer-form/footer-form.component.scss
+++ b/src/app/form/footer-form/footer-form.component.scss
@@ -15,13 +15,20 @@
   &:focus .print {
     background-color: $secondary-color;
   }
+
+  &.next {
+    .rowBtn {
+      margin-left: 24px;
+    }
+  }
 }
 
 .column {
   @media #{$tablet} {
     flex-direction: column !important;
-    .next {
-      margin-right: 10px;
+    button {
+      margin-bottom: 10px !important;
+      margin-right: 0 !important;
     }
   }
 }
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
index b2e923ef4..0e8de2f85 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.html
@@ -6,7 +6,7 @@
       fxLayout="row-reverse"
       fxLayoutAlign="space-around start"
     >
-      <div class="ico-close" fxLayout="row" fxLayoutAlign="end center">
+      <div class="ico-close">
         <div class="ico-close-wrapper">
           <div (click)="closeModal()" class="ico-close-details"></div>
         </div>
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
index 24dd3a35c..2fd765960 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.scss
@@ -1,16 +1,14 @@
 @import '../../../../../assets/scss/typography';
 @import '../../../../../assets/scss/color';
 
-.ico-close {
-  width: 100%;
-  margin: 0 20px;
+.ico-close-details {
+  margin-right: 16px;
 }
 h3 {
   margin: 8% 15%;
-  width: 60%;
   text-align: center;
-  margin-left: 30%;
-  font-weight: lighter;
+  @include cn-regular-18;
+  color: $grey-2;
 }
 .modalContent {
   margin: 0 32px;
diff --git a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
index d95283005..dfc3f86ab 100644
--- a/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
+++ b/src/app/form/orientation-form/component/orientation-modal/orientation-modal.component.ts
@@ -1,20 +1,15 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { FormGroup } from '@angular/forms';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 
 @Component({
   selector: 'app-orientation-modal',
   templateUrl: './orientation-modal.component.html',
   styleUrls: ['./orientation-modal.component.scss'],
 })
-export class OrientationComponent implements OnInit {
-  constructor() {}
-
+export class OrientationComponent {
   @Input() public openned: boolean;
   @Output() closed = new EventEmitter();
   @Output() previousPage = new EventEmitter();
 
-  ngOnInit(): void {}
-
   public closeModal(): void {
     this.closed.emit();
   }
-- 
GitLab