arbetsformedlingen/mina-sidor-fa-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

changed code according to comments from pull request

Browse Source
This commit is contained in:
Zaid Abed Jaser
2021-04-29 16:47:53 +02:00
parent 9a947d65c7
commit b6c9219818
15 changed files with 107 additions and 253 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/dafa-web/src/app/data/models/staff.model.ts
View File

@@ -6,7 +6,7 @@ export interface Staff {
staffId: string;
firstName: string;
lastName: string;
kommun: string;
Utforandeverksamhet: string;
active: boolean;
service: string;
fullName?: string;

107
apps/dafa-web/src/app/pages/administration/pages/create-account/create-account.component.html
View File

@@ -8,7 +8,7 @@
</p>
</digi-typography>
<form [formGroup]="formGroup" (ngSubmit)="submitForm()">
<div class="create-account__block-ssn">
<div class="create-account__block">
<h2>Personuppgifter</h2>
<div class="create-account__combined-inputs">
<digi-ng-form-input
@@ -37,81 +37,56 @@
[afInvalid]="ssnControl.invalid && ssnControl.dirty"
></digi-ng-form-input>
</div>
<div class="create-account__block-service">
<div class="create-account__block">
<h2>Tjänst</h2>
<digi-ng-form-select afPlaceholder=" " afLabel="Välj tjänst" formControlName="service" [afSelectItems]="list">
</digi-ng-form-select>
</div>
<fieldset class="create-account__fieldset">
<legend>Tilldela behörigheter</legend>
<div class="create-account__block-permissions">
<h2>Tilldela behörigheter</h2>
<div class="assign-permissions">
<div class="assign-permissions__child">
<h3>Behörighet: administrera behörigheter</h3>
<digi-ng-popover [afOrientation]="popoverOrientation" [afDirection]="popoverDirection">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div>
<digi-ng-form-checkbox formControlName="permissions" afLabel="Välj administrera behörigheter">
</digi-ng-form-checkbox>
</div>
<div class="assign-permissions__child">
<h3>Behörighet: ta emot deltagare</h3>
<digi-ng-popover [afOrientation]="popoverOrientation" [afDirection]="popoverDirection">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div>
<digi-ng-form-checkbox formControlName="participant" afLabel="Välj ta emot deltagare"></digi-ng-form-checkbox>
</div>
<div class="assign-permissions__child">
<h3>Behörighet: rapportering, planering och information om deltagare</h3>
<digi-ng-popover [afOrientation]="popoverOrientation" [afDirection]="popoverDirection">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div>
<digi-ng-form-checkbox
formControlName="infoParticipant"
afLabel="Välj rapportering, planering och infomration om deltagare"
>
</digi-ng-form-checkbox>
</div>
<div class="assign-permissions__child">
<h3>Behörighet: administrera ordrar och fakturor</h3>
<digi-ng-popover [afOrientation]="popoverOrientation" [afDirection]="popoverDirection">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div>
<digi-ng-form-checkbox formControlName="orderBills" afLabel="Välj administrera ordrar och fakturor">
</digi-ng-form-checkbox>
</div>
<div class="create-account__permission-checkbox">
<digi-ng-form-checkbox formControlName="permissions" afLabel="Välj administrera behörigheter">
</digi-ng-form-checkbox>
<digi-ng-popover afDirection="block-start">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
</div>
<div class="create-account__block-address">
<form class="search-address" (ngSubmit)="handleSearchSubmit()">
<h2>utförandeverksamheter</h2>
<digi-form-input-search
af-label-description="Sök på utförandeverksamheter"
(afOnInput)="handleSearchInput($event)"
></digi-form-input-search>
</form>
</div>
<div class="create-account__permission-checkbox">
<digi-ng-form-checkbox formControlName="participant" afLabel="Välj ta emot deltagare"></digi-ng-form-checkbox>
<digi-ng-popover afDirection="block-start">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div class="create-account__permission-checkbox">
<digi-ng-form-checkbox
formControlName="infoParticipant"
afLabel="Välj rapportering, planering och infomration om deltagare"
>
</digi-ng-form-checkbox>
<digi-ng-popover afDirection="block-start">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
<div class="create-account__permission-checkbox">
<digi-ng-form-checkbox formControlName="orderBills" afLabel="Välj administrera ordrar och fakturor">
</digi-ng-form-checkbox>
<digi-ng-popover afDirection="block-start">
<p>Jag har tillräckligt med utrymme för att öppnas till höger (inline-start).</p>
<a href="#">Tab to me</a>
</digi-ng-popover>
</div>
</fieldset>
<div class="create-account__footer">
<digi-button (afOnClick)="handleSearchSubmit()" af-type="reset" af-variation="secondary">Avbryt</digi-button>
<digi-button af-type="reset" af-variation="secondary">Avbryt</digi-button>
<digi-button af-type="submit">Registrera konto</digi-button>
</div>
</form>

44
apps/dafa-web/src/app/pages/administration/pages/create-account/create-account.component.scss
View File

@@ -1,16 +1,9 @@
@import 'mixins/list';
.create-account {
&__block-ssn {
&__block {
max-width: var(--digi--typography--text--max-width);
}
&__block-service {
max-width: var(--digi--typography--text--max-width);
}
&__block-address {
max-width: var(--digi--typography--text--max-width);
}
&__combined-inputs {
display: flex;
gap: var(--digi--layout--gutter);
@@ -22,11 +15,16 @@
margin-bottom: var(--digi--layout--gutter);
}
&__permission-checkbox {
display: flex;
height: 5em;
align-items: center;
}
&__fieldset {
margin: 0;
margin-bottom: var(--digi--layout--gutter);
padding: 0;
border-width: 0;
border: 0;
margin-top: 2em;
legend {
width: 100%;
@@ -34,7 +32,7 @@
align-items: center;
margin: 0;
font-weight: var(--digi--typography--font-weight--bold);
font-size: var(--digi--typography--font-size);
font-size: 1.5em;
padding-bottom: var(--digi--layout--gutter--s);
}
}
@@ -57,32 +55,22 @@
}
&__footer {
margin-top: 50px;
margin-top: 2em;
display: flex;
gap: var(--digi--layout--gutter);
}
}
.assign-permissions {
&__child {
&:first-child {
margin-top: 0px;
}
display: flex;
flex-direction: row;
height: 100px;
width: 100%;
align-items: center;
margin-right: 330px;
margin-top: 80px;
}
.assign-permission-checkbox {
display: flex;
height: 5em;
align-items: center;
}
.search-address {
margin-top: 80px;
width: 30%;
}
digi-ng-popover {
margin-left: 20px;
margin-left: 1em;
}

5
apps/dafa-web/src/app/pages/administration/pages/create-account/create-account.component.ts
View File

@@ -1,5 +1,6 @@
import { RadiobuttonModel } from '@af/digi-ng/_form/form-radiobutton-group';
import { FormSelectBaseItem } from '@af/digi-ng/_form/form-select-base';
import { PopoverDirection, PopoverOrientation } from '@af/digi-ng/_popover/popover';
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { AbstractControl, FormBuilder, FormGroup } from '@angular/forms';
import { Router } from '@angular/router';
@@ -37,9 +38,6 @@ export class CreateAccountComponent {
},
];
popoverOrientation: string;
popoverDirection: string;
constructor(private formBuilder: FormBuilder, private staffService: StaffService, private router: Router) {
this.formGroup = this.formBuilder.group({
firstName: this.formBuilder.control('', [RequiredValidator('Förnamn')]),
@@ -55,7 +53,6 @@ export class CreateAccountComponent {
}
handleSearchSubmit(): void {
console.log(this.formGroup.value);
// skicka searchvalue till en service och filtrera
}

29
apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.html
View File

@@ -3,7 +3,6 @@
<thead>
<tr>
<th scope="col" class="staff-list__column-head">
<button class="staff-list__sort-button" (click)="handleSort('fullName')">
Namn
<ng-container *ngIf="sortBy?.key === 'fullName'">
@@ -22,9 +21,9 @@
</button>
</th>
<th scope="col" class="staff-list__column-head">
<button class="staff-list__sort-button" (click)="handleSort('kommun')">
<button class="staff-list__sort-button" (click)="handleSort('Utforandeverksamhet')">
Utförandeverksamhet
<ng-container *ngIf="sortBy?.key === 'kommun'">
<ng-container *ngIf="sortBy?.key === 'Utforandeverksamhet'">
<digi-icon-caret-up class="staff-list__sort-icon" *ngIf="!sortBy.reverse"></digi-icon-caret-up>
<digi-icon-caret-down class="staff-list__sort-icon" *ngIf="sortBy.reverse"></digi-icon-caret-down>
</ng-container>
@@ -35,25 +34,23 @@
<tbody>
<tr *ngFor="let staff of pagedStaff">
<th scope="row">
<!-- <a (click)="popup()" style="cursor: pointer;">
{{staff.fullName}}
<div class="staff-list__modal">
<p>asdasdasdasd</p>>
</div>
</a > -->
<a [routerLink]="staff.id" class="staff-list__link">{{ staff.fullName }}</a>
</th>
<td>{{ staff.service }}</td>
<td>{{ staff.kommun }}</td>
</tr>
</tbody>
</table>
</digi-ng-table>
<digi-navigation-pagination *ngIf="staff.length > pagedStaff.length" class="staff-list__pagination"
[afTotalPages]="totalPages" [afCurrentResultStart]="currentResultStart" [afCurrentResultEnd]="currentResultEnd"
[afTotalResults]="staff.length" (afOnPageChange)="handlePagination($event.detail)" af-result-name="deltagare">
</digi-navigation-pagination>
<digi-navigation-pagination
*ngIf="staff.length > pagedStaff.length"
class="staff-list__pagination"
[afTotalPages]="totalPages"
[afCurrentResultStart]="currentResultStart"
[afCurrentResultEnd]="currentResultEnd"
[afTotalResults]="staff.length"
(afOnPageChange)="handlePagination($event.detail)"
af-result-name="deltagare"
>
</digi-navigation-pagination>

14
apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.scss
View File

@@ -20,7 +20,7 @@
align-items: center;
gap: var(--digi--layout--gutter);
cursor: pointer;
color: #1616B2;
color: #1616b2;
}
&__sort-icon {
@@ -33,16 +33,4 @@
display: block;
margin-top: var(--digi--layout--gutter);
}
// &__modal{
// visibility: hidden;
// position: fixed; /* Stay in place */
// z-index: 1; /* Sit on top */
// width: 25%; /* Full width */
// height: 25%; /* Full height */
// overflow: auto; /* Enable scroll if needed */
// background-color:white; /* Fallback color */
// border: 1px solid black;
// }
}

21
apps/dafa-web/src/app/pages/administration/pages/staff/components/staff-list/staff-list.component.ts
View File

@@ -14,8 +14,6 @@ export class StaffListComponent {
@Input() sortBy: SortBy | null;
@Output() sorted = new EventEmitter<keyof Staff>();
private _currentPage$ = new BehaviorSubject<number>(1);
private _staffPerPage = 10;
@@ -33,7 +31,6 @@ export class StaffListComponent {
return [...this.staff].slice(this.currentResultStart - 1, this.currentResultEnd - 1);
}
get currentResultStart(): number {
return (this.currentPage - 1) * this._staffPerPage + 1;
}
@@ -49,22 +46,4 @@ export class StaffListComponent {
handlePagination(page: number): void {
this._currentPage$.next(page);
}
// popup()
// {
// var open = document.getElementsByClassName('staff-list__modal');
// for (let i = 0; i < open.length; i++) {
// const slide = open[i] as HTMLElement;
// if(slide.style.visibility == "hidden")
// {
// slide.style.visibility = "visible";
// }else
// slide.style.visibility = "hidden";
// }
// }
}

3
apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.html
View File

@@ -11,8 +11,7 @@
<digi-ng-link-button afText="Skapa nytt konto" afRoute="/administration/skapa-konto"></digi-ng-link-button>
</div>
<h3>Personallista</h3>
<hr />
<h2>Personallista</h2>
<form class="staff__search-wrapper" (ngSubmit)="handleSearchSubmit()">
<digi-form-input-search

5
apps/dafa-web/src/app/pages/administration/pages/staff/staff.component.scss
View File

@@ -1,7 +1,5 @@
@import 'variables/gutters';
.staff {
text-decoration: none;
&__cta-wrapper {
margin-top: var(--digi--layout--gutter);
}
@@ -17,7 +15,4 @@
margin-top: $digi--layout--gutter--l;
margin-bottom: $digi--layout--gutter--xl;
}
hr {
border: 1px solid #00005a;
}
}

3
apps/dafa-web/src/app/pages/administration/pages/staff/staff.module.ts
View File

@@ -6,7 +6,7 @@ import { RouterModule } from '@angular/router';
import { StaffListModule } from './components/staff-list/staff-list.module';
import { StaffComponent } from './staff.component';
import { DigiNgLinkButtonModule } from '@af/digi-ng/_link/link-button';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FormsModule } from '@angular/forms';
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
@@ -18,7 +18,6 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
DigiNgSkeletonBaseModule,
StaffListModule,
DigiNgLinkButtonModule,
ReactiveFormsModule,
FormsModule,
],
})

82
apps/dafa-web/src/app/pages/start/start.component.html
View File

@@ -4,84 +4,42 @@
<p>Här finner du de senaste nyheterna om uppdateringar, notiser och mer.</p>
</digi-typography>
<div class="start__wrapper">
<div class="start__item-b">
<digi-ng-card
afHeading="Notiser"
[afHeadingLevel]="afHeadingLevel"
afLinkText="Deltagare"
afLinkHref="/mina-deltagare"
[afCardVariation]="afCardVariation"
<div class="start__main">
<!-- Syntax fel i digi info card? -->
<digi-info-card
af-heading="Notiser"
af-heading-level="h1"
af-type="info"
af-link-text="Deltagare"
af-link-href="/mina-deltagare"
>
<p>
Det har kommit in nya avrop med deltagare, länken nedan tar dig till fliken Nya deltagare. Du finner den också
i vänster menyn på sidan
</p>
</digi-ng-card>
</digi-info-card>
</div>
<div class="start__item-c">
<digi-ng-notification-alert
[afVariation]="variation"
[afSize]="notificationAlertSize"
afHeading="Viktig information"
[afHeadingLevel]="afHeading"
>
<div class="start__sidebar">
<digi-ng-notification-alert afVariation="info" afSize="l" afHeading="Viktig information" afHeadingLevel="h3">
<p>Large alert! Check the knobs section and play around!</p>
</digi-ng-notification-alert>
<div class="start__item-c-alert">
<div class="start__sidebar-alert">
<digi-ng-notification-alert
[afVariation]="variation"
[afSize]="notificationAlertSize"
afVariation="success"
afSize="l"
afCloseable="true"
(afOnClose)="closed()"
afHeading="Viktig information"
[afHeadingLevel]="afHeading"
afHeading="Allt gick bra"
afHeadingLevel="h3"
>
<p>Large alert! Check the knobs section and play around!</p>
<p>Dina skickade tilldelningar har nått fram till handledare som godkänt och arbetat vidare med deltagarna</p>
</digi-ng-notification-alert>
</div>
</div>
<div class="start__item-d">
<digi-ng-card afHeading="Statistik" [afHeadingLevel]="afHeadingLevel" [afCardVariation]="afCardVariation">
<div class="start__footer">
<digi-info-card af-heading="Statistik" af-heading-level="h1" af-type="info">
<p><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></p>
</digi-ng-card>
</digi-info-card>
</div>
</div>
<!-- <digi-typography>
<h1>Välkommen till DAFA 2.0</h1>
<p>Här finner du de senaste nyheterna om uppdateringar, notiser och mer.</p>
</digi-typography>
<div class="start__wrapper">
<div class="start__card-info">
<div>
<digi-ng-card
afHeading="Notiser"
[afHeadingLevel]="afHeadingLevel"
afLinkText="Deltagare"
afLinkHref="/mina-deltagare"
[afCardVariation]="afCardVariation"
>
<p>
Det har kommit in nya avrop med deltagare, länken nedan tar dig till fliken Nya deltagare. Du finner den
också i vänster menyn på sidan
</p>
</digi-ng-card>
</div>
<div class="start__card-info-notice">
<digi-ng-form-error-list afHeading="Viktig Information"> </digi-ng-form-error-list>
<digi-ng-form-error-list afHeading="Viktig Information"> </digi-ng-form-error-list>
</div>
</div>
<div class="start__statistics">
<div style="width: 100%; max-height: 100%">
<digi-ng-card afHeading="Statistik" [afHeadingLevel]="afHeadingLevel" [afCardVariation]="afCardVariation">
<p><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></p>
</digi-ng-card>
</div>
</div>
</div> -->
</section>

16
apps/dafa-web/src/app/pages/start/start.component.scss
View File

@@ -6,22 +6,18 @@
'header header '
'main sidebar'
'footer footer ';
grid-gap: 50px;
grid-gap: 3em;
}
&__item-a {
grid-area: header;
}
&__item-b {
&__main {
grid-area: main;
}
&__item-c {
&__sidebar {
grid-area: sidebar;
}
&__item-c-alert {
visibility: visible;
margin-top: 30px;
&__sidebar-alert {
margin-top: 5%;
}
&__item-d {
&__footer {
grid-area: footer;
}
}

23
apps/dafa-web/src/app/pages/start/start.component.ts
View File

@@ -5,6 +5,8 @@ import {
NotificationAlertVariation,
} from '@af/digi-ng/_notification/notification-alert';
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { InfoCardHeadingLevel } from '@digi/core/dist/types/components/_info-card/info-card/info-card-heading-level.enum';
import { InfoCardType } from '@digi/core/dist/types/components/_info-card/info-card/info-card-type.enum';
@Component({
selector: 'dafa-start',
@@ -12,23 +14,4 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
styleUrls: ['./start.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class StartComponent {
afHeadingLevel: CardHeadingLevel = CardHeadingLevel.H3;
afCardVariation: CardVariation = CardVariation.INFO;
variation: NotificationAlertVariation = NotificationAlertVariation.INFO;
notificationAlertSize: NotificationAlertSize = NotificationAlertSize.M;
afHeading: NotificationAlertHeadingLevel = NotificationAlertHeadingLevel.H3;
closed() {
var open = document.getElementsByClassName('start__item-c-alert');
for (let i = 0; i < open.length; i++) {
const slide = open[i] as HTMLElement;
if (slide.style.visibility == 'hidden') {
slide.style.visibility = 'visible';
} else slide.style.visibility = 'hidden';
}
}
}
export class StartComponent {}

2
apps/dafa-web/src/app/pages/start/start.module.ts
View File

@@ -3,7 +3,6 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { StartComponent } from './start.component';
import { DigiNgCardModule } from '@af/digi-ng/_card/card';
import { DigiNgFormErrorListModule } from '@af/digi-ng/_form/form-error-list';
import { DigiNgNotificationAlertModule } from '@af/digi-ng/_notification/notification-alert';
@NgModule({
@@ -13,7 +12,6 @@ import { DigiNgNotificationAlertModule } from '@af/digi-ng/_notification/notific
CommonModule,
RouterModule.forChild([{ path: '', component: StartComponent }]),
DigiNgCardModule,
DigiNgFormErrorListModule,
DigiNgNotificationAlertModule,
],
})

4
package-lock.json generated
View File

@@ -58,7 +58,7 @@
"typescript": "~4.0.3"
},
"engines": {
"node": "16.0.0"
"node": "14.16.1"
}
},
"node_modules/@af/auth": {
@@ -22669,6 +22669,7 @@
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
"integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"dependencies": {
"bindings": "^1.5.0",
@@ -23076,6 +23077,7 @@
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz",
"integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"dependencies": {
"bindings": "^1.5.0",