From 28d128c1e2422d1a5d89ad30414cb9face8d7dcc Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date: Thu, 4 Nov 2021 10:05:49 +0100
Subject: [PATCH] Added avbrott status and updated enddate to personal
 information

---
 ...tagare-tab-personal-information.component.html | 15 ++++++++++++++-
 ...tagare-tab-personal-information.component.scss |  7 +++++++
 .../pages/deltagare-card/deltagare-card.module.ts |  2 ++
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.html b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.html
index c60195e..ecfd238 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.html
@@ -58,6 +58,17 @@
         <dd *ngIf="avropInformation.endDate; else emptyDD">
           <digi-typography-time [afDateTime]="avropInformation.endDate"></digi-typography-time>
         </dd>
+        <ng-container *ngIf="avropInformation.hasAvbrott">
+          <dt>Status:</dt>
+          <dd class="deltagare-tab-personal-information__avbrott">
+            <msfa-icon icon="warning" size="l"></msfa-icon>
+            Avbrott
+          </dd>
+          <dt>Original datum för tjänstens slut:</dt>
+          <dd *ngIf="avropInformation.originalEndDate; else emptyDD">
+            <digi-typography-time [afDateTime]="avropInformation.originalEndDate"></digi-typography-time>
+          </dd>
+        </ng-container>
         <dt>Deltagandefrekvens:</dt>
         <dd *ngIf="avropInformation.participationFrequency; else emptyDD">
           {{ avropInformation.participationFrequency }}
@@ -67,7 +78,9 @@
         <dt>Utförande verksamhet:</dt>
         <dd *ngIf="avropInformation.utforandeVerksamhet; else emptyDD">{{ avropInformation.utforandeVerksamhet }}</dd>
         <dt>Utförande adress:</dt>
-        <dd *ngIf="avropInformation.utforandeAdress; else emptyDD">{{ avropInformation.utforandeAdress + ', ' + avropInformation.kommun }}</dd>
+        <dd *ngIf="avropInformation.utforandeAdress; else emptyDD">
+          {{ avropInformation.utforandeAdress + ', ' + avropInformation.kommun }}
+        </dd>
         <dt>Genomförandereferens:</dt>
         <dd *ngIf="avropInformation.genomforandeReferens; else emptyDD">{{ avropInformation.genomforandeReferens }}</dd>
       </dl>
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.scss b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.scss
index eec0807..50c555c 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.scss
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/components/deltagare-tab-personal-information/deltagare-tab-personal-information.component.scss
@@ -6,6 +6,13 @@
     flex-basis: 0;
   }
 
+  &__avbrott {
+    display: flex;
+    align-items: center;
+    gap: var(--digi--layout--gutter--xs);
+    color: var(--digi--ui--color--danger);
+  }
+
   &__loader {
     flex-grow: 1;
   }
diff --git a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.module.ts b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.module.ts
index 36f9577..4af1690 100644
--- a/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/deltagare-card/deltagare-card.module.ts
@@ -9,6 +9,7 @@ import { RouterModule } from '@angular/router';
 import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
 import { HandledarePickerFormModule } from '@msfa-shared/components/handledare-picker-form/handledare-picker-form.module';
 import { HideTextModule } from '@msfa-shared/components/hide-text/hide-text.module';
+import { IconModule } from '@msfa-shared/components/icon/icon.module';
 import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
 import { UiLoaderModule } from '@ui/loader/loader.module';
 import { UiSkeletonModule } from '@ui/skeleton/skeleton.module';
@@ -44,6 +45,7 @@ import { DeltagareCardService } from './deltagare-card.service';
     DigiNgLinkButtonModule,
     DigiNgFormSelectModule,
     UiSkeletonModule,
+    IconModule,
   ],
   providers: [DeltagareCardService],
   exports: [DeltagareCardComponent],