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

feat(ui): Added textarea component to ui-libs. (TV-849)

Browse Source 
Squashed commit of the following:

commit 61ecaf467c63cdd10f4d66131b105d3b12d60e49
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Wed Nov 3 11:14:19 2021 +0100

    Removed unused input

commit 2254c1dd547cbf3639e5232fe6d8e657491a369c
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Wed Nov 3 11:12:38 2021 +0100

    Implemented textarea component inside ui-libs
This commit is contained in:
Erik Tiekstra
2021-11-03 12:04:15 +01:00
parent 37cdf9285a
commit e51e13dfa8
17 changed files with 256 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.component.html
View File

@@ -24,19 +24,16 @@
</li>
</ol>
</div>
<digi-ng-form-textarea
<ui-textarea
formControlName="emails"
afSize="m"
afDescription="För att skicka inbjudningar till flera e-postadresser samtidigt kan e-postadresser
uiLabel="E-postadresser"
uiDescription="För att skicka inbjudningar till flera e-postadresser samtidigt kan e-postadresser
separeras med bl.a. kommatecken eller mellanslag. Se fler exempel innanför textfältet nedan.
Antalet mellanslag spelar inte roll och en blandning av tecknen går också bra."
afPlaceholder="namn@foretag.se namn@foretag.se, namn@foretag.se; namn@foretag.se:namn@foretag.se,namn@foretag.se: namn@foretag.se"
[afRequired]="true"
[afDisableValidStyle]="true"
[afInvalidMessage]="emailsControl.errors?.required || emailsControl.errors?.invalid || 'Ogiltig e-postadress'"
[afInvalid]="emailsControl.invalid && emailsControl.dirty"
afLabel="E-postadresser"
></digi-ng-form-textarea>
[uiRequired]="true"
[uiInvalid]="emailsControl.invalid && emailsControl.dirty"
[uiValidationMessage]="emailsControl.errors?.required || emailsControl.errors?.invalid || 'Ogiltig e-postadress'"
></ui-textarea>
<digi-notification-alert
*ngIf="(lastInvites$ | async) && !emailsControl.dirty"

4
apps/mina-sidor-fa/src/app/pages/administration/pages/employee-invite/employee-invite.module.ts
View File

@@ -1,4 +1,3 @@
import { DigiNgFormTextareaModule } from '@af/digi-ng/_form/form-textarea';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
@@ -6,6 +5,7 @@ import { RouterModule } from '@angular/router';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { UiLoaderModule } from '@ui/loader/loader.module';
import { UiTextareaModule } from '@ui/textarea/textarea.module';
import { EmployeeInviteComponent } from './employee-invite.component';
@NgModule({
@@ -17,7 +17,7 @@ import { EmployeeInviteComponent } from './employee-invite.component';
LayoutModule,
BackLinkModule,
ReactiveFormsModule,
DigiNgFormTextareaModule,
UiTextareaModule,
UiLoaderModule,
],
})

17
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.component.html
View File

@@ -58,16 +58,15 @@
class="avvikelse-report-form__form-item"
*ngFor="let question of questionsFormArray.controls; let i=index"
>
<digi-ng-form-textarea
<ui-textarea
[formControlName]="i"
[afLabel]="questions[i]?.name"
[afDisableValidStyle]="true"
[afRequired]="questionIsRequired(questions[i])"
[afInvalidMessage]="question.errors?.required || question.errors?.invalid"
[afAnnounceIfOptional]="true"
[afMaxLength]="2000"
[afInvalid]="formControlIsInvalid(question)"
></digi-ng-form-textarea>
[uiLabel]="questions[i]?.name"
[uiRequired]="questionIsRequired(questions[i])"
[uiValidationMessage]="question.errors?.required || question.errors?.invalid"
[uiAnnounceIfOptional]="true"
[uiMaxLength]="2000"
[uiInvalid]="formControlIsInvalid(question)"
></ui-textarea>
</div>
</div>

4
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/avvikelse-report-form/avvikelse-report-form.module.ts
View File

@@ -3,7 +3,6 @@ import { DigiNgFormDatepickerModule } from '@af/digi-ng/_form/form-datepicker';
import { DigiNgFormInputModule } from '@af/digi-ng/_form/form-input';
import { DigiNgFormRadiobuttonGroupModule } from '@af/digi-ng/_form/form-radiobutton-group';
import { DigiNgFormSelectModule } from '@af/digi-ng/_form/form-select';
import { DigiNgFormTextareaModule } from '@af/digi-ng/_form/form-textarea';
import { DigiNgProgressProgressbarModule } from '@af/digi-ng/_progress/progressbar';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@@ -14,6 +13,7 @@ import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/conf
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { UiLoaderModule } from '@ui/loader/loader.module';
import { UiSkeletonModule } from '@ui/skeleton/skeleton.module';
import { UiTextareaModule } from '@ui/textarea/textarea.module';
import { ReportDescriptionListModule } from '../../../components/report-description-list/report-description-list.module';
import { ReportLayoutModule } from '../../../components/report-layout/report-layout.module';
import { AvvikelseReportFormComponent } from './avvikelse-report-form.component';
@@ -29,7 +29,6 @@ import { AvvikelseReportFormService } from './avvikelse-report-form.service';
ReactiveFormsModule,
DigiNgFormRadiobuttonGroupModule,
DigiNgFormDatepickerModule,
DigiNgFormTextareaModule,
DigiNgProgressProgressbarModule,
ReportLayoutModule,
ConfirmDialogModule,
@@ -40,6 +39,7 @@ import { AvvikelseReportFormService } from './avvikelse-report-form.service';
ReportDescriptionListModule,
DigiNgFormInputModule,
DigiNgDialogModule,
UiTextareaModule,
],
providers: [AvvikelseReportFormService],
exports: [AvvikelseReportFormComponent],

25
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/franvaro-report-form/franvaro-report-form.component.html
View File

@@ -87,24 +87,15 @@
</div>
<div class="franvaro-report-form__form-item" *ngIf="showKnownReasonTextArea">
<digi-ng-form-textarea
[afDisableValidStyle]="true"
[afInvalid]="formControlIsInvalid(['knownReasonComment'])"
[afMaxLength]="2000"
[afAnnounceIfOptional]="true"
[afRequired]="true"
afLabel="Beskriv frånvaro"
afSize="s"
<ui-textarea
[formControl]="knownReasonCommentFormControl"
></digi-ng-form-textarea>
<div aria-atomic="true" role="alert">
<digi-ng-form-validation-message
*ngIf="formControlIsInvalid(['knownReasonComment'])"
class="franvaro-report-form__validation-message"
[afPositive]="false"
[afValidationText]="formErrors.knownReasonComment"
></digi-ng-form-validation-message>
</div>
uiLabel="Beskriv frånvaro"
[uiInvalid]="formControlIsInvalid(['knownReasonComment'])"
[uiValidationMessage]="formErrors?.knownReasonComment"
[uiMaxLength]="2000"
[uiRequired]="true"
[uiAnnounceIfOptional]="true"
></ui-textarea>
</div>
</ng-container>

4
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/franvaro-report-form/franvaro-report-form.module.ts
View File

@@ -3,7 +3,6 @@ import { DigiNgFormDatepickerModule } from '@af/digi-ng/_form/form-datepicker';
import { DigiNgFormInputModule } from '@af/digi-ng/_form/form-input';
import { DigiNgFormRadiobuttonGroupModule } from '@af/digi-ng/_form/form-radiobutton-group';
import { DigiNgFormSelectModule } from '@af/digi-ng/_form/form-select';
import { DigiNgFormTextareaModule } from '@af/digi-ng/_form/form-textarea';
import { DigiNgFormValidationMessageModule } from '@af/digi-ng/_form/form-validation-message';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@@ -13,6 +12,7 @@ import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.modu
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { UiLoaderModule } from '@ui/loader/loader.module';
import { UiSkeletonModule } from '@ui/skeleton/skeleton.module';
import { UiTextareaModule } from '@ui/textarea/textarea.module';
import { ReportDescriptionListModule } from '../../../components/report-description-list/report-description-list.module';
import { ReportLayoutModule } from '../../../components/report-layout/report-layout.module';
import { FranvaroReportFormComponent } from './franvaro-report-form.component';
@@ -34,10 +34,10 @@ import { FranvaroReportFormService } from './franvaro-report-form.service';
DigiNgFormDatepickerModule,
DigiNgFormRadiobuttonGroupModule,
UiSkeletonModule,
DigiNgFormTextareaModule,
DigiNgFormInputModule,
DigiNgFormValidationMessageModule,
DigiNgDialogModule,
UiTextareaModule,
],
providers: [FranvaroReportFormService],
exports: [FranvaroReportFormComponent],

19
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/informativ-rapport-form/informativ-rapport-form.component.html
View File

@@ -61,17 +61,16 @@
></digi-ng-form-select>
</div>
<div class="informativ-rapport-form__form-item">
<digi-ng-form-textarea
<ui-textarea
[formControl]="commentFormControl"
afLabel="Kompletterande information"
afDescription="Undvik att skriva in information som känsliga personuppgifter, skyddad identitet eller deltagarens mående. Skriv i sådant fall in det telefonnummer du vill bli kontaktad på, vi bedömer om återkoppling är relevant."
[afDisableValidStyle]="true"
[afRequired]="true"
[afInvalidMessage]="commentFormControl.errors?.required"
[afAnnounceIfOptional]="true"
[afMaxLength]="2000"
[afInvalid]="formControlIsInvalid('comment')"
></digi-ng-form-textarea>
uiLabel="Kompletterande information"
uiDescription="Undvik att skriva in information som känsliga personuppgifter, skyddad identitet eller deltagarens mående. Skriv i sådant fall in det telefonnummer du vill bli kontaktad på, vi bedömer om återkoppling är relevant."
[uiRequired]="true"
[uiInvalid]="formControlIsInvalid('comment')"
[uiValidationMessage]="commentFormControl.errors?.required"
[uiAnnounceIfOptional]="true"
[uiMaxLength]="2000"
></ui-textarea>
</div>
<footer class="informativ-rapport-form__footer">

6
apps/mina-sidor-fa/src/app/pages/deltagare/pages/deltagare-details/pages/report-forms/informativ-rapport-form/informativ-rapport-form.module.ts
View File

@@ -1,7 +1,5 @@
import { DigiNgDialogModule } from '@af/digi-ng/_dialog/dialog';
import { DigiNgFormSelectModule } from '@af/digi-ng/_form/form-select';
import { DigiNgFormTextareaModule } from '@af/digi-ng/_form/form-textarea';
import { UiSkeletonModule } from '@ui/skeleton/skeleton.module';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
@@ -9,6 +7,8 @@ import { RouterModule } from '@angular/router';
import { BackLinkModule } from '@msfa-shared/components/back-link/back-link.module';
import { ConfirmDialogModule } from '@msfa-shared/components/confirm-dialog/confirm-dialog.module';
import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
import { UiSkeletonModule } from '@ui/skeleton/skeleton.module';
import { UiTextareaModule } from '@ui/textarea/textarea.module';
import { ReportDescriptionListModule } from '../../../components/report-description-list/report-description-list.module';
import { ReportLayoutModule } from '../../../components/report-layout/report-layout.module';
import { InformativRapportFormComponent } from './informativ-rapport-form.component';
@@ -29,7 +29,7 @@ import { InformativRapportFormService } from './informativ-rapport-form.service'
UiSkeletonModule,
DigiNgDialogModule,
DigiNgFormSelectModule,
DigiNgFormTextareaModule,
UiTextareaModule,
],
providers: [InformativRapportFormService],
exports: [InformativRapportFormComponent],