feat(employees): New component for utförande verksamheter and addresses inside employee card.(TV-361)

Squashed commit of the following:

commit f75e29597c13b5d9c4232631e5c396974c6470fa
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Mon Aug 23 16:25:12 2021 +0200

    Added name to employees-list component for listing names of utförandeverksamheter as the response have changed so utforandeVerksamheter contains more then just the name.

commit a2665dc110243c3327bb4ee88099f7e19451456e
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Mon Aug 23 12:45:52 2021 +0200

    Updated avrop.js to match new mock-api

commit 71ac0c85c73615d6a638670250d390d90a673051
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Mon Aug 23 12:28:26 2021 +0200

    Reverted some changes after comparison with develop.

commit d96d3d6ae3390582d7a06a765b6667bf4733614a
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Mon Aug 23 12:17:43 2021 +0200

    Added flag allaUtforandeVerksamheter to employee mock-api

commit 833c32a63fc18a67cde498fd0e976483cff8f047
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Mon Aug 23 11:47:38 2021 +0200

    - Splitted out utförandeverksamheter from organizations.js to utforande-verksamhet.js which is included in employees.js
    - Changed layout
    - Prepared markup for all utforande verksamheter permission. Needs to be changed to mock-api data-value when we get it from backend.

commit 31d33010af049f8b3cf5ba7b7ea8e1f03cf38fb1
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Fri Aug 20 15:26:00 2021 +0200

    Added name/organizationNumber

commit 1037098f67ad9bfd4400a2b0de1daf7e969b378d
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Fri Aug 20 13:56:24 2021 +0200

    Utforande verksamheter amends to work with changed api settings

commit 436440fe3a8f2170029a4d7b418f10741e9e233a
Merge: 5cbb694 e6f8090
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Fri Aug 20 11:31:59 2021 +0200

    Merge branch 'develop' into feature/TV-361-ta-fram-komponent-for-utf-verk-adresser-i-visningslaget

    # Conflicts:
    #	apps/mina-sidor-fa/src/app/pages/administration/pages/employee-card/employee-card.component.html
    #	apps/mina-sidor-fa/src/app/pages/administration/pages/employee-card/employee-card.component.scss
    #	apps/mina-sidor-fa/src/app/pages/administration/pages/employee-form/employee-form.component.ts
    #	apps/mina-sidor-fa/src/app/shared/guards/auth.guard.ts
    #	apps/mina-sidor-fa/src/app/shared/models/api/employee.response.model.ts
    #	apps/mina-sidor-fa/src/app/shared/models/employee.model.ts
    #	apps/mina-sidor-fa/src/app/shared/services/api/authentication.service.ts
    #	apps/mina-sidor-fa/src/app/shared/services/api/employee.service.ts
    #	apps/mina-sidor-fa/src/app/shared/services/api/user.service.ts
    #	mock-api/mina-sidor-fa/scripts/employees.js
    #	mock-api/mina-sidor-fa/scripts/generate-api.js
    #	mock-api/mina-sidor-fa/scripts/tjanster.js
    #	mock-api/mina-sidor-fa/server.js

commit 5cbb694bb5b836f3826f7dadae300a0f7feba80f
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Fri Aug 20 11:19:02 2021 +0200

    Reference name changes

commit 387451b3168a101f94f2b49470521d74a4f30e65
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Fri Aug 20 10:42:56 2021 +0200

    Merge branch 'develop' into feature/TV-361-ta-fram-komponent-for-utf-verk-adresser-i-visningslaget

    # Conflicts:
    #	apps/mina-sidor-fa/src/app/pages/administration/pages/employees/components/employees-list/employees-list.component.html
    #	mock-api/mina-sidor-fa/scripts/employees.js

commit c7d31f6f926e52be9b5c4aec59eafd4d22d36e00
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Wed Aug 18 16:09:20 2021 +0200

    Renamed organization to utforandeVerksamhet and changed referenses.

commit 12d9f49f56d658da6a2082af46091eeb48b6031f
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Wed Aug 18 15:57:08 2021 +0200

    Utforande verksamheter cards created

commit e88962cd20394b54bad9904258d6876230d60f51
Merge: 5211885 b7c7b6b
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Wed Aug 18 11:04:14 2021 +0200

    Merge branch 'develop' into feature/TV-361-ta-fram-komponent-for-utf-verk-adresser-i-visningslaget

commit 52118858f20f7f63812cec44641753f1760e2300
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Wed Aug 18 10:58:40 2021 +0200

    Updated mock-api

commit 63da7e7f4cfc1b7cbd721899300357694103900b
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Tue Aug 17 10:28:57 2021 +0200

    SKapat upp komponent

apps/mina-sidor-fa/src/app/pages/administration/pages/employee-card/employee-card.component.html

@@ -34,27 +34,44 @@
             <li *ngFor="let tjanst of employee.tjanster">{{ tjanst.name }}</li>
           </ul>
         </div>
-        <div class="employee-card__organizations">
+        <div class="employee-card__utforandeverksamheter">
           <h2>Utförande verksamheter och utförande adresser</h2>
-          <p>TODO: Behöver göras så en utförande adress hamnar under rätt utförande verksamhet.</p>
+          <p *ngIf="employee.allaUtforandeVerksamheter; else specificUtforandeVerksamheter">
-          <h3>Utförande verksamheter</h3>
+            Kontot har behörighet till alla utförande verksamheter och utförande adresser inom organisationen.
-          <ul
+          </p>
-            class="employee-card__list employee-card__list--secondary"
+          <ng-template #specificUtforandeVerksamheter>
-            *ngIf="employee.utforandeVerksamhetIds.length; else emptyText"
+            <div class="employee-card__utforandeverksamheter-cards" >
-          >
+              <ng-container *ngIf="employee.utforandeVerksamhet?.length; else emptyText">
-            <li class="employee-card__list" *ngFor="let utforandeVerksamhet of employee.utforandeVerksamhetIds">
+                <digi-info-card
-              {{ utforandeVerksamhet }}
+                  *ngFor="let utforandeverksamhet of employee.utforandeVerksamhet"
-            </li>
+                  [afHeading]="utforandeverksamhet.namn"
-          </ul>
+                  af-heading-level="h2"
-          <h3>Utförande adresser</h3>
+                  af-type="info"
-          <ul
+                  class="employee-card__utforandeverksamheter-card"
-            class="employee-card__list employee-card__list--secondary"
+                >
-            *ngIf="employee.utforandeAdressIds.length; else emptyText"
+                  <digi-ng-layout-expansion-panel
-          >
+                    *ngIf="utforandeverksamhet.adresser.length > 0"
-            <li class="employee-card__list" *ngFor="let utforandeAdress of employee.utforandeAdressIds">
+                  >
-              {{ utforandeAdress }}
+                    <span data-slot-trigger>
-            </li>
+                      {{ accordionExpanded ? 'Dölj' : 'Visa' }}
-          </ul>
+                      {{utforandeverksamhet.adresser.length}}
+                      {{utforandeverksamhet.adresser.length === 1 ? 'adress' : 'adresser'}}
+                    </span>
+                    <ul class="employee-card__utforandeverksamheter-address-list">
+                      <li
+                        class="employee-card__utforandeverksamheter-address-list-item"
+                        *ngFor="let address of utforandeverksamhet.adresser"
+                      >
+                        <span>{{address.adressrad}}</span>
+                        <span>{{address.postnummer}}</span>
+                        <span>{{address.postort}}</span>
+                      </li>
+                    </ul>
+                  </digi-ng-layout-expansion-panel>
+                </digi-info-card>
+              </ng-container>
+            </div>
+          </ng-template>
         </div>
         <div class="employee-card__column">
           <h2>Behörigheter</h2>

apps/mina-sidor-fa/src/app/pages/administration/pages/employee-card/employee-card.component.scss

@@ -15,7 +15,30 @@
     max-width: var(--digi--typography--text--max-width);
   }
 
-  &__organizations {
+  &__utforandeverksamheter-cards {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+  }
+
+  &__utforandeverksamheter-card {
+    --digi-info-card--padding:
+      var(--digi--layout--padding--20)
+      var(--digi--layout--padding--40)
+      var(--digi--layout--padding--40)
+      var(--digi--layout--padding--40);
+  }
+
+  &__utforandeverksamheter-address-list {
+    @include msfa__reset-list;
+    padding-top: var(--digi--layout--padding--10);
+  }
+
+  &__utforandeverksamheter-address-list-item span:not(:empty):not(:last-child):after {
+    content: ', ';
+  }
+
+  &__utforandeverksamheter {
     display: flex;
     flex-direction: column;
   }

apps/mina-sidor-fa/src/app/pages/administration/pages/employees/components/employees-list/employees-list.component.html

@@ -39,7 +39,7 @@
           </td>
           <td>
             <ng-container *ngIf="employee.utforandeVerksamheter.length">
-              {{ employee.utforandeVerksamheter[0] }}<ng-container *ngIf="employee.utforandeVerksamheter.length > 1">
+              {{ employee.utforandeVerksamheter[0]['namn'] }}<ng-container *ngIf="employee.utforandeVerksamheter.length > 1">
                 (+{{employee.utforandeVerksamheter.length - 1}})</ng-container
               >
             </ng-container>

apps/mina-sidor-fa/src/app/shared/guards/auth.guard.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, CanActivate, Router } from '@angular/router';
+import { UserService } from '@msfa-services/api/user.service';
 import { environment } from '@msfa-environment';
 import { AuthenticationService } from '@msfa-services/api/authentication.service';
 import { Observable, of } from 'rxjs';
@@ -8,7 +9,11 @@ import { redirectUriQueryParam } from '../../pages/organization-picker/organizat
 
 @Injectable()
 export class AuthGuard implements CanActivate {
-  constructor(private authenticationService: AuthenticationService, private router: Router) {}
+  constructor(
+    private authenticationService: AuthenticationService,
+    private userService: UserService,
+    private router: Router
+  ) {}
 
   canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {
     return this.authenticationService.isLoggedIn$.pipe(

apps/mina-sidor-fa/src/app/shared/models/api/employee.response.model.ts

@@ -5,6 +5,7 @@ export interface EmployeeCompactResponse {
   ciamUserId: string;
   name: string;
   tjanst: string[];
+  allaUtforandeVerksamheter: boolean;
   utforandeVerksamhet: string[];
 }
 
@@ -16,6 +17,8 @@ export interface EmployeeResponse {
   personnummer: string;
   roles: RoleEnum[];
   tjansteKoder: string[];
+  allaUtforandeVerksamheter: boolean;
+  utforandeVerksamhet: string[];
   utforandeVerksamhetIds: number[];
   adressIds: number[];
 }

apps/mina-sidor-fa/src/app/shared/models/employee.model.ts

@@ -7,6 +7,7 @@ export interface EmployeeCompact {
   id: string;
   fullName: string;
   tjanster: string[];
+  allaUtforandeVerksamheter: boolean;
   utforandeVerksamheter: string[];
 }
 
@@ -20,6 +21,8 @@ export interface Employee {
   roles: RoleEnum[];
   tjanstCodes: string[];
   tjanster?: Tjanst[];
+  allaUtforandeVerksamheter: boolean;
+  utforandeVerksamhet: string[];
   utforandeVerksamhetIds: number[];
   utforandeAdressIds: number[];
 }
@@ -33,12 +36,14 @@ export interface EmployeeRequestData {
   email: string;
   roles: string[];
   tjansteKoder: string[];
+  allaUtforandeVerksamheter: boolean;
+  utforandeVerksamhet: string[];
   utforandeVerksamhetIds: number[];
   adressIds: number[];
 }
 
 export function mapEmployeeToRequestData(data: Employee): EmployeeRequestData {
-  const { email, roles, tjanstCodes, utforandeVerksamhetIds, utforandeAdressIds } = data;
+  const { email, roles, tjanstCodes, allaUtforandeVerksamheter, utforandeVerksamhet, utforandeVerksamhetIds, utforandeAdressIds } = data;
 
   return {
     email,
@@ -46,15 +51,18 @@ export function mapEmployeeToRequestData(data: Employee): EmployeeRequestData {
     tjansteKoder: tjanstCodes,
     utforandeVerksamhetIds,
     adressIds: utforandeAdressIds,
+    allaUtforandeVerksamheter: allaUtforandeVerksamheter,
+    utforandeVerksamhet: utforandeVerksamhet
   };
 }
 
 export function mapResponseToEmployeeCompact(data: EmployeeCompactResponse): EmployeeCompact {
-  const { ciamUserId, name, tjanst, utforandeVerksamhet } = data;
+  const { ciamUserId, name, tjanst, allaUtforandeVerksamheter, utforandeVerksamhet } = data;
   return {
     id: ciamUserId,
     fullName: name,
     tjanster: tjanst || [],
+    allaUtforandeVerksamheter: allaUtforandeVerksamheter,
     utforandeVerksamheter: utforandeVerksamhet || [],
   };
 }
@@ -68,6 +76,8 @@ export function mapResponseToEmployee(data: EmployeeResponse): Employee {
     personnummer,
     roles,
     tjansteKoder,
+    allaUtforandeVerksamheter,
+    utforandeVerksamhet,
     utforandeVerksamhetIds,
     adressIds,
   } = data;
@@ -80,6 +90,8 @@ export function mapResponseToEmployee(data: EmployeeResponse): Employee {
     ssn: personnummer,
     roles: roles || [],
     tjanstCodes: tjansteKoder || [],
+    allaUtforandeVerksamheter,
+    utforandeVerksamhet: utforandeVerksamhet || [],
     utforandeVerksamhetIds: utforandeVerksamhetIds || [],
     utforandeAdressIds: adressIds || [],
   };

apps/mina-sidor-fa/src/app/shared/services/api/user.service.ts

@@ -17,6 +17,8 @@ const API_HEADERS = { headers: environment.api.headers };
   providedIn: 'root',
 })
 export class UserService extends UnsubscribeDirective {
+  private readonly selectedUserOrganizationNumberKey = 'selectedOrganizationId';
+
   private _authApiUrl = `${environment.api.url}/auth`;
   private _user$ = new BehaviorSubject<User>(null);
 

mock-api/mina-sidor-fa/scripts/avrop.js

@@ -2,6 +2,7 @@ import faker from 'faker';
 import kommuner from './kommuner.js';
 import languages from './languages.js';
 import organizations from './organizations.js';
+import utforandeVerksamheter from './utforande-verksamheter.js';
 import tjanster from './tjanster.js';
 
 faker.locale = 'sv';
@@ -10,6 +11,7 @@ const TJANSTER = tjanster.generate();
 const SUPORTLANGUAGES = languages.generate();
 const TRACK = ['A', 'B', 'C'];
 const ORGANIZATIONS = organizations.generate();
+const UTFORANDEVERKSAMHETER = utforandeVerksamheter.generate();
 const KOMMUNER = kommuner.generate();
 const FREKVENSER = ['25%', '50%', '75%', '100%'];
 
@@ -18,6 +20,7 @@ function generateAvrop(amount = 10, deltagare) {
 
   for (let i = 1; i <= amount; ++i) {
     const organization = ORGANIZATIONS[Math.floor(Math.random() * ORGANIZATIONS.length)];
+    const utforandeVerksamhet = UTFORANDEVERKSAMHETER[Math.floor(Math.random() * UTFORANDEVERKSAMHETER.length)];
     const kommun = KOMMUNER[Math.floor(Math.random() * KOMMUNER.length)];
     const tjanst = TJANSTER[Math.floor(Math.random() * TJANSTER.length)];
     const track = TRACK[Math.floor(Math.random() * TRACK.length)];
@@ -32,12 +35,12 @@ function generateAvrop(amount = 10, deltagare) {
       orgId: faker.datatype.uuid(),
       leverantorId: faker.datatype.number({ min: 1000, max: 99999 }),
       organisationsnummer: organization.organizationNumber,
-      utforandeVerksamhetId: organization.id,
+      utforandeVerksamhetId: utforandeVerksamhet.utforandeVerksamhetId,
-      utforandeverksamhet: organization.name,
+      utforandeverksamhet: utforandeVerksamhet.namn,
       kommunKod: kommun.kommunCode,
       kommun: kommun.kommun,
       utforandeAdressId: faker.datatype.number({ min: 10000, max: 99999 }),
-      adress: `${organization.address.street} ${organization.address.houseNumber}`,
+      adress: `${utforandeVerksamhet.adresser.adressrad}`,
       ordernummer: `AKTTEST-${faker.datatype.number({ min: 10000, max: 99999 })}`,
       bokningsId: faker.datatype.number({ min: 100000, max: 999999 }),
       personnummer: currentDeltagare.personnummer,

mock-api/mina-sidor-fa/scripts/employees.js

@@ -1,12 +1,12 @@
 import faker from 'faker';
-import organizations from './organizations.js';
+import utforandeVerksamheter from './utforande-verksamheter.js';
 import tjanster from './tjanster.js';
 import chooseRandom from './utils/choose-random.util.js';
 
 faker.locale = 'sv';
 
 const TJANSTER = tjanster.generate();
-const ORGANIZATIONS = organizations.generate();
+const UTFORANDEVERKSAMHETER = utforandeVerksamheter.generate();
 const ROLES = ['ReportAndPlanning', 'ReceiveDeltagare', 'AuthAdmin', 'ContactPerson'];
 
 function generateEmployees(amount = 10) {
@@ -16,7 +16,7 @@ function generateEmployees(amount = 10) {
     const firstName = faker.name.firstName();
     const lastName = faker.name.lastName();
     const currentTjanster = chooseRandom(TJANSTER, faker.datatype.number({ min: 1, max: TJANSTER.length }));
-    const currentOrganizations = chooseRandom(ORGANIZATIONS, faker.datatype.number({ min: 1, max: 5 }));
+    const currentUtforandeVerksamheter = chooseRandom(UTFORANDEVERKSAMHETER, faker.datatype.number({ min: 1, max: 5 }));
     const hasBehorigheter = Math.random() > 0.1;
 
     const employee = {
@@ -38,8 +38,9 @@ function generateEmployees(amount = 10) {
         : ['OrganizationUser'],
       tjanst: hasBehorigheter ? currentTjanster.map(tjanst => tjanst.name) : [],
       tjansteKoder: hasBehorigheter ? currentTjanster.map(tjanst => tjanst.tjanstekod) : [],
-      utforandeVerksamhet: hasBehorigheter ? currentOrganizations.map(organization => organization.name) : [],
+      allaUtforandeVerksamheter: faker.datatype.boolean(),
-      utforandeVerksamhetIds: hasBehorigheter ? currentOrganizations.map(organization => organization.id) : [],
+      utforandeVerksamhet: hasBehorigheter ? currentUtforandeVerksamheter.map(utforandeVerksamhet => utforandeVerksamhet) : [],
+      utforandeVerksamhetIds: hasBehorigheter ? currentUtforandeVerksamheter.map(utforandeVerksamhet => utforandeVerksamhet.utforandeVerksamhetId) : [],
     };
 
     employee.email = `${employee.firstName}.${employee.lastName}@private-epost.se`.toLowerCase();

mock-api/mina-sidor-fa/scripts/organizations.js

@@ -1,32 +1,14 @@
 import faker from 'faker';
-import kommuner from './kommuner.js';
 
 faker.locale = 'sv';
 
-const KOMMUN = kommuner.generate();
-
 function generateOrganizations(amount = 10) {
   const organizations = [];
 
   for (let i = 1; i <= amount; ++i) {
     organizations.push({
-      id: faker.datatype.uuid(),
-      organizationNumber: `${faker.datatype.number({
-        min: 100000,
-        max: 999999,
-      })}${faker.datatype.number({
-        min: 1000,
-        max: 9999,
-      })}`,
       name: faker.company.companyName(),
-      kaNumber: faker.datatype.number({ min: 100000, max: 999999 }),
+      organizationNumber: faker.datatype.uuid(),
-      address: {
-        street: faker.address.streetName(),
-        houseNumber: faker.datatype.number(100),
-        postalCode: faker.address.zipCode(),
-        city: faker.address.city(),
-        kommun: KOMMUN[Math.floor(Math.random() * KOMMUN.length)].kommun,
-      },
     });
   }
 

mock-api/mina-sidor-fa/scripts/utforande-verksamheter.js

@@ -0,0 +1,37 @@
+import faker from 'faker';
+import chooseRandom from './utils/choose-random.util.js';
+
+faker.locale = 'sv';
+
+function generateUtforandeVerksamheter(amount = 10) {
+  const utforandeVerksamheter = [];
+
+  const addresses = [];
+  for (let i = 1; i <= 5; ++i) {
+    addresses.push({
+      adressId: faker.datatype.uuid(),
+      adressrad: faker.address.streetName(),
+      postort: faker.address.city(),
+      postnummer: faker.address.zipCode(),
+    });
+  }
+
+  for (let i = 1; i <= amount; ++i) {
+    utforandeVerksamheter.push({
+      utforandeVerksamhetId: faker.datatype.uuid(),
+      namn: faker.company.companyName(),
+      leverantorNamn: faker.company.companyName(),
+      tjanstId: faker.datatype.number(10),
+      tjanst: faker.name.jobTitle(),
+      adresser: chooseRandom(addresses, faker.datatype.number(4)),
+    });
+  }
+
+  console.info('Utforande verksamheter generated...');
+
+  return utforandeVerksamheter;
+}
+
+export default {
+  generate: generateUtforandeVerksamheter,
+};