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

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>
 

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(
+      name: this.getPeriodName(period.startDate),
-        formatDate(period.startDate, 'sv-SE', { month: 'long', year: 'numeric' } as DateFormatOptions)
-      ),
       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);
 

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>
 

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 =

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';