From 01dc4b391965df679a3506be0d13e11f29631c65 Mon Sep 17 00:00:00 2001 From: Erik Tiekstra Date: Mon, 16 Aug 2021 12:51:51 +0200 Subject: [PATCH] feat(deltagare): Visual changes to deltagare-card (TV-363) Squashed commit of the following: commit 96a01004e3d814a2015c09148f0bd35ba4679f82 Author: Erik Tiekstra Date: Mon Aug 16 11:10:13 2021 +0200 Moved workLanguages below translator information commit a0c378a8221a5d363f56ee644b9728d873ae1ff1 Author: Erik Tiekstra Date: Mon Aug 16 07:19:49 2021 +0200 Updates after PR commit 479df238c712e2e14829d33b468ece91332f81c8 Author: Erik Tiekstra Date: Fri Aug 13 15:18:23 2021 +0200 Updated tolkbehov inside deltagare-card commit df95ae2a8afbcc78ba546472ae9c1db141d1e642 Author: Erik Tiekstra Date: Fri Aug 13 15:14:27 2021 +0200 Updated deltagare-kort after discussion with UX --- .../deltagare-card.component.html | 136 ++++++++++-------- .../deltagare-card.component.scss | 30 ++-- .../hide-text/hide-text.component.html | 1 + .../hide-text/hide-text.component.scss | 7 +- .../navigation/navigation.component.html | 2 +- .../src/app/shared/models/avrop.model.ts | 3 + .../shared/services/api/deltagare.service.ts | 3 +- mock-api/dafa-web/scripts/avrop.js | 4 +- 8 files changed, 109 insertions(+), 77 deletions(-) diff --git a/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.html b/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.html index 8f310bd..bcb31f5 100644 --- a/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.html +++ b/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.html @@ -7,7 +7,7 @@

Deltagarinformation

- +

Personuppgifter

@@ -37,15 +37,17 @@
{{ phoneNumber.type }}: {{phoneNumber.number}}
-
Epostadress:
-
{{ deltagare.email }}
+
E-postadress:
+
+ {{ deltagare.email }} +
-

Särskilda behov

+

Behov och språk

Funktionsnedsättningar:
- +
{{ disability.title }}
-
Tolk:
-
{{deltagare.translator ? 'Ja (' + deltagare.translator + ')' : 'Nej'}}
+
Tolkbehov:
+
+ {{deltagare.avropInformation.tolkbehov ? 'Ja (' + deltagare.avropInformation.tolkbehov + ')' : + 'Nej'}} +
+
Språkstöd:
+
+ {{deltagare.avropInformation.sprakstod ? 'Ja (' + deltagare.avropInformation.sprakstod + ')' : + 'Nej'}} +
+
Språk jag kan använda på jobbet:
+
{{ deltagare.workLanguages.join(', ')}}
@@ -81,6 +93,10 @@
{{ deltagare.avropInformation.participationFrequency }}
+
Nivå:
+
+ {{ deltagare.avropInformation.trackName }} +
Utförande verksamhet:
{{ deltagare.avropInformation.utforandeVerksamhet }} @@ -97,69 +113,67 @@
- +
-

Matchningsuppgifter

-
-
Arbetslivserfarenhet:
- - -
- - -
- {{ workExperience.employer }}
- {{ workExperience.profession }}
- {{ workExperience.description }} -
- - - - Arbetslivserfarenhet + +
    +
  • +

    {{ workExperience.employer }}

    + - +
    + {{ workExperience.profession }} +

    {{ workExperience.description }}

    +
    • +
+ + + + {{ accordionExpanded ? 'Dölj' : 'Visa' }} fler arbetsgivare - {{ accordionExpanded ? 'Dölj' : 'Visa' }} fler arbetsgivare -
+
    +
  • +

    {{ workExperience.employer }}

    -
    - {{ workExperience.employer }}
    - {{ workExperience.profession }}
    - {{ workExperience.description }} -
- - -
+ {{ workExperience.profession }} +

{{ workExperience.description }}

+ + + +
-
+

Utbildning

-
-
Utbildningar:
- -
- - -
- {{ education.organizer }}
- {{ education.education}}
- {{ education.description }} -
- -
Högsta utbildningsnivå:
{{ deltagare.highestEducation.level.description }}: {{ deltagare.highestEducation.sunKod.description }}
+

Utbildningar:

+
    +
  • +

    {{ education.organizer }}

    + - +
    + {{ education.education}} +

    {{ education.description }}

    +
    • +
-
-
Språk jag kan använda på jobbet:
-
{{ deltagare.workLanguages.join(', ')}}
-
+
+

Körkortsinformation

Har körkort
@@ -176,10 +190,6 @@ - -
- Tillbaka till deltagarlistan -
@@ -192,4 +202,10 @@ Info saknas + +

+ + Info saknas +

+ diff --git a/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.scss b/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.scss index 4e80ae4..978a45b 100644 --- a/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.scss +++ b/apps/dafa-web/src/app/pages/deltagare/pages/deltagare-card/deltagare-card.component.scss @@ -1,4 +1,5 @@ @import 'variables/gutters'; +@import 'mixins/list'; .deltagare-card { &__tab-contents { @@ -8,25 +9,34 @@ } &__tab-column { - width: 50%; + flex-grow: 1; + flex-shrink: 1; + flex-basis: 0; } dd { - margin: 0 0 var(--digi--layout--gutter--xs); + margin: 0 0 1rem; } - dt { + dt, + &__subheading { + font-size: var(--digi--typography--font-size--desktop); font-weight: var(--digi--typography--font-weight--semibold); - margin-top: var(--digi--layout--gutter--s); + margin: var(--digi--layout--gutter--s) 0 0; + + &--with-margin { + font-size: var(--digi--typography--font-size--h3); + margin-bottom: var(--digi--layout--gutter--s); + } + } + + &__experience-list { + @include dafa__reset-list; } &__accordion { - max-width: 80%; - min-width: 250px; - - dd:first-of-type { - margin-top: var(--digi--layout--gutter); - } + display: block; + margin-top: var(--digi--layout--gutter); } &__accordion-trigger { diff --git a/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.html b/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.html index 51adc9d..470dc5f 100644 --- a/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.html +++ b/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.html @@ -3,5 +3,6 @@ diff --git a/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.scss b/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.scss index 5f3208f..a23fc25 100644 --- a/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.scss +++ b/apps/dafa-web/src/app/shared/components/hide-text/hide-text.component.scss @@ -6,9 +6,8 @@ &__button { background-color: transparent; color: var(--digi--typography--color--link); - font-size: var(--digi--typography--font-size--desktop--l); + font-size: var(--digi--typography--font-size--desktop); border-width: 0; - width: 2rem; display: flex; align-items: center; justify-content: center; @@ -16,4 +15,8 @@ color: var(--digi--typography--color--link--active); } } + + &__button-text { + margin-left: var(--digi--layout--gutter--s); + } } diff --git a/apps/dafa-web/src/app/shared/components/layout/components/navigation/navigation.component.html b/apps/dafa-web/src/app/shared/components/layout/components/navigation/navigation.component.html index f7dacf2..1757b12 100644 --- a/apps/dafa-web/src/app/shared/components/layout/components/navigation/navigation.component.html +++ b/apps/dafa-web/src/app/shared/components/layout/components/navigation/navigation.component.html @@ -1,7 +1,7 @@
- +
    diff --git a/apps/dafa-web/src/app/shared/models/avrop.model.ts b/apps/dafa-web/src/app/shared/models/avrop.model.ts index aa6bf6f..83605a2 100644 --- a/apps/dafa-web/src/app/shared/models/avrop.model.ts +++ b/apps/dafa-web/src/app/shared/models/avrop.model.ts @@ -11,6 +11,7 @@ export interface AvropCompact { sprakstod: string; // sprakstod utforandeAdress: string; // adress trackCode: string; // sparkod + trackName: string; // sparNamn } export interface Avrop extends AvropCompact { @@ -31,6 +32,7 @@ export function mapAvropResponseToAvrop(data: AvropResponse): Avrop { sprakstod, adress, sparkod, + sparNamn, genomforandeReferens, deltagandeGrad, utforandeverksamhet, @@ -47,6 +49,7 @@ export function mapAvropResponseToAvrop(data: AvropResponse): Avrop { sprakstod: sprakstod, utforandeAdress: adress, trackCode: sparkod, + trackName: sparNamn, genomforandeReferens, participationFrequency: deltagandeGrad, utforandeVerksamhet: utforandeverksamhet, diff --git a/apps/dafa-web/src/app/shared/services/api/deltagare.service.ts b/apps/dafa-web/src/app/shared/services/api/deltagare.service.ts index 43d21d3..617ce54 100644 --- a/apps/dafa-web/src/app/shared/services/api/deltagare.service.ts +++ b/apps/dafa-web/src/app/shared/services/api/deltagare.service.ts @@ -183,8 +183,7 @@ export class DeltagareService extends UnsubscribeDirective { return this.httpClient .get<{ data: AvropResponse }>(`${this._apiAvropUrl}/${id}`, { ...API_HEADERS }) .pipe( - filter(response => !!response.data), - map(response => mapAvropResponseToAvrop(response.data)), + map(response => (response.data ? mapAvropResponseToAvrop(response.data) : {})), catchError(error => { this.errorService.add(errorToCustomError(error)); return of({}); diff --git a/mock-api/dafa-web/scripts/avrop.js b/mock-api/dafa-web/scripts/avrop.js index 948c1e9..f65d988 100644 --- a/mock-api/dafa-web/scripts/avrop.js +++ b/mock-api/dafa-web/scripts/avrop.js @@ -46,8 +46,8 @@ function generateAvrop(amount = 10, deltagare) { startdatumAvrop: faker.date.recent(), slutdatumAvrop: faker.date.future(), aktnummerDiariet: `Af-2021/0000 ${faker.datatype.number({ min: 1000, max: 9999 })}`, - tolkbehov: SUPORTLANGUAGES[Math.floor(Math.random() * SUPORTLANGUAGES.length)], - sprakstod: SUPORTLANGUAGES[Math.floor(Math.random() * SUPORTLANGUAGES.length)], + tolkbehov: currentDeltagare.translator.sprak.beskrivning, + sprakstod: SUPORTLANGUAGES[Math.floor(Math.random() * SUPORTLANGUAGES.length)].beskrivning, sparkod: track, sparNamn: `Nivå ${track}: ${tjanst.name}`, supervisorId: Math.random() > 0.3 && faker.datatype.uuid(),