From 596033f08a72d0091ee43f0320286aa9cc1903c3 Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date: Mon, 1 Nov 2021 13:29:29 +0100
Subject: [PATCH] Merge pull request #237 in TEA/mina-sidor-fa-web from
 feature/pr-view to next

Squashed commit of the following:

commit b5d578ec60b145021ccad3e6d3ff2974252802e6
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Mon Nov 1 11:56:50 2021 +0100

    Added period to PR view
---
 .../periodisk-redovisning-form.component.html        |  2 ++
 .../periodisk-redovisning-form.component.ts          | 12 +++++++-----
 .../periodisk-redovisning-view.component.html        |  2 ++
 .../periodisk-redovisning-view.component.ts          |  7 +++++++
 .../src/app/shared/utils/format-to-date.util.ts      |  1 +
 5 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.html
index f7b3ca9..80113e2 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.html
@@ -213,6 +213,8 @@
             <ui-loader *ngIf="submitIsLoading$ | async" uiType="absolute"></ui-loader>
             <msfa-report-description-list [avrop]="avrop">
               <ng-container *ngIf="submitData$ | async as submitData; else loadingRef">
+                <dt>Period</dt>
+                <dd>{{getPeriodName(submitData.period)}}</dd>
                 <dt>Har ni under perioden tillhandahållit språkstöd till deltagaren:</dt>
                 <dd>{{submitData.hasOfferedLanguageSupport ? 'Ja' : 'Nej' }}</dd>
 
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
index 6f88a3a..cc94427 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/periodisk-redovisning-form/periodisk-redovisning-form.component.ts
@@ -10,10 +10,9 @@ import {
 } from '@msfa-models/api/periodisk-redovisning.request.model';
 import { AvropPeriod } from '@msfa-models/avrop-period.model';
 import { Avrop } from '@msfa-models/avrop.model';
-import { DateFormatOptions } from '@msfa-models/date-format-options.model';
 import { CustomError } from '@msfa-models/error/custom-error';
 import { capitalizeWords } from '@msfa-utils/capitalize-words.util';
-import { formatDate } from '@msfa-utils/format-to-date.util';
+import { formatDate, formatToDate } from '@msfa-utils/format-to-date.util';
 import { RequiredValidator } from '@msfa-validators/required.validator';
 import { subMonths } from 'date-fns';
 import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
@@ -93,9 +92,7 @@ export class PeriodiskRedovisningFormComponent implements OnInit {
 
   periodsToFormselectItems(periods: AvropPeriod[]): FormSelectItem[] {
     return periods.map(period => ({
-      name: capitalizeWords(
-        formatDate(period.startDate, 'sv-SE', { month: 'long', year: 'numeric' } as DateFormatOptions)
-      ),
+      name: this.getPeriodName(period.startDate),
       value: period.periodId,
     }));
   }
@@ -129,6 +126,11 @@ export class PeriodiskRedovisningFormComponent implements OnInit {
     return this.formGroup.get(this.ACTIVITES_FORM_NAME) as FormArray;
   }
 
+  getPeriodName(period: Date | string): string {
+    const date = period instanceof Date ? period : formatToDate(period);
+    return capitalizeWords(formatDate(date, 'sv-SE', { month: 'long', year: 'numeric' }));
+  }
+
   openConfirmDialog(): void {
     this.shouldValidate$.next(true);
 
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
index d75a5d1..98b0931 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.html
@@ -6,6 +6,8 @@
   >
     <div class="periodisk-redovisning-view" *ngIf="periodiskRedovisning$ | async as report; else loadingRef">
       <dl>
+        <dt>Period</dt>
+        <dd>{{getPeriodName(report.period)}}</dd>
         <dt>Har ni under perioden tillhandahållit språkstöd till deltagaren?</dt>
         <dd>{{report.hasOfferedLanguageSupport ? 'Ja' : 'Nej' }}</dd>
 
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
index 8670434..bde4e2f 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-views/periodisk-redovisning-view/periodisk-redovisning-view.component.ts
@@ -3,6 +3,8 @@ import { ActivatedRoute } from '@angular/router';
 import { Params } from '@msfa-models/api/params.model';
 import { Avrop } from '@msfa-models/avrop.model';
 import { PeriodiskRedovisning, PeriodiskRedovisningActivity } from '@msfa-models/periodisk-redovisning.model';
+import { capitalizeWords } from '@msfa-shared/utils/capitalize-words.util';
+import { formatDate, formatToDate } from '@msfa-shared/utils/format-to-date.util';
 import { Observable } from 'rxjs';
 import { map, shareReplay, switchMap } from 'rxjs/operators';
 import { PeriodiskRedovisningViewService } from './periodisk-redovisning-view.service';
@@ -34,6 +36,11 @@ export class PeriodiskRedovisningViewComponent {
     shareReplay(1)
   );
 
+  getPeriodName(period: string): string {
+    const date = formatToDate(period);
+    return capitalizeWords(formatDate(date, 'sv-SE', { month: 'long', year: 'numeric' }));
+  }
+
   getActivityInfoAsString(activity: PeriodiskRedovisningActivity): string {
     const hours = activity.hours ? (activity.hours === 1 ? '1 timme ' : `${activity.hours} timmar `) : '';
     const location =
diff --git a/apps/mina-sidor-fa/src/app/shared/utils/format-to-date.util.ts b/apps/mina-sidor-fa/src/app/shared/utils/format-to-date.util.ts
index 705b1cf..0158542 100644
--- a/apps/mina-sidor-fa/src/app/shared/utils/format-to-date.util.ts
+++ b/apps/mina-sidor-fa/src/app/shared/utils/format-to-date.util.ts
@@ -1,6 +1,7 @@
 import { DateFormatOptions } from '@msfa-models/date-format-options.model';
 
 export function formatToDate(date: string): Date {
+  date = date.replace(/-/g, '');
   const year = date.substring(0, 4);
   const month = date.substring(4, 6) || '01';
   const day = date.substring(6, 8) || '01';