#155395040 text area komponent (#235)

* ny kod textarea * wip * ny version 2.3.0-rc15 * fixat css wip * css pushar inte ner content, wip * wip * färdig textarea * Test tillagt för textarea. * fixat reactiveforms * tagit bort log * validationErrorMessage ändring * texarea klar * fixat css för textarea.
Vastra-Gotalandsregionen · Apr 4, 2018 · e6adce5 · e6adce5
1 parent 119d150
commit e6adce5
Show file tree

Hide file tree

Showing 28 changed files with 1,050 additions and 228 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -2,7 +2,7 @@
   <div class="back-to-top"></div>
   <vgr-modal></vgr-modal>
   <vgr-sidebar-menu>
-    <vgr-menu title="Innehåll">
+    <vgr-menu title="Utv {{currentVersion}}">
       <vgr-menu-item link="/" text="Start"></vgr-menu-item>
       <vgr-menu-item link="/theming" text="Temahantering"></vgr-menu-item>
       <vgr-menu-item link="/pagestructure" text="Sidhantering"></vgr-menu-item>
@@ -25,13 +25,15 @@
         <vgr-menu-item link="/filtertextbox" text="Filter textbox"></vgr-menu-item>
         <vgr-menu-item link="/headers" text="Header/header menu"></vgr-menu-item>
         <vgr-menu-item link="/inputFields" text="Input"></vgr-menu-item>
+        <vgr-menu-item link="/textareaField" text="Textarea"></vgr-menu-item>
         <vgr-menu-item link="/lists" text="List"></vgr-menu-item>
         <vgr-menu-item link="/loader" text="Loader"></vgr-menu-item>
         <vgr-menu-item link="/lockbutton" text="Lock button"></vgr-menu-item>
         <vgr-menu-item link="/menu" text="Menu"></vgr-menu-item>
         <vgr-menu-item link="/modaldialog" text="Modal dialog"></vgr-menu-item>
         <vgr-menu-item link="/monthpicker" text="Monthpicker"></vgr-menu-item>
         <vgr-menu-item link="/panels" text="Panel/Dashboard"></vgr-menu-item>
+        <vgr-menu-item link="/table" text="Table"></vgr-menu-item>
         <vgr-menu-item link="/titlevalue" text="Title-value"></vgr-menu-item>
         <vgr-menu-item link="/savecancel" text="Save/Cancel"></vgr-menu-item>
         <vgr-menu-item link="/radioButtons" text="Radio Group"></vgr-menu-item>

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -1,17 +1,23 @@
 import { Component, AfterViewInit, ViewChild, HostBinding, OnInit } from '@angular/core';
 import { Router, NavigationEnd } from '@angular/router';
-
 import { ModalService, IHeaderMenu, IHeaderMenuItem } from 'vgr-komponentkartan';
+declare var require: any;
 
 @Component({
     selector: 'app-komponentkartan',
     templateUrl: 'app.component.html'
 })
 
 export class KomponentkartanApplicationComponent implements OnInit {
+    currentVersion: string;
+
     constructor(private router: Router) { }
 
     ngOnInit() {
+        const { version: appVersion } = require('../../package.json');
+        this.currentVersion = appVersion;
+        this.currentVersion = this.currentVersion ? this.currentVersion.replace('^', '') : this.currentVersion;
+
         this.router.events.subscribe((evt) => {
             if (!(evt instanceof NavigationEnd)) {
                 return;

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -63,8 +63,9 @@ import { ListexamplewithexpandabledivComponent } from './lists/examples/withexpa
 import { ExamplesListwithcardsComponent } from './examples-listwithcards/examples-listwithcards.component';
 import { ExamplesListwithlistsComponent } from './examples-listwithlists/examples-listwithlists.component';
 import { UnitService } from './examples-listwithlists/unitService';
-
+import { TextareafieldComponent } from './textareaField/textareafield.component';
 import { IconsComponent } from './icons/icons.component';
+import { TableComponent } from './table/table.component';
 
 @NgModule({
     declarations: [
@@ -108,7 +109,9 @@ import { IconsComponent } from './icons/icons.component';
         UnitFilterPipe,
         UnitFilter2Pipe,
         ActionPanelsComponent,
-        ClosebuttonComponent
+        ClosebuttonComponent,
+        TableComponent,
+        TextareafieldComponent
     ],
     imports: [
         KomponentkartanModule,

diff --git a/src/app/modaldialog/modaldialog.component.html b/src/app/modaldialog/modaldialog.component.html
@@ -232,23 +232,27 @@ <h3 style="margin-bottom: 10px;">Välj vårdcentral</h3>
     </p>
     <br/>
     <p>Ditt svar:</p>
-    <textarea></textarea>
+    <vgr-textarea></vgr-textarea>
   </vgr-modal-content>
   <vgr-modal-footer>
     <vgr-button [secondary]="true" (click)="closeModal('commentAnswerWithTextModal')">Avbryt</vgr-button>
     <vgr-button [secondary]="true" (click)="closeModal('commentAnswerWithTextModal')">Svara</vgr-button>
   </vgr-modal-footer>
 </vgr-modal>
 <vgr-modal id="commentAnswerWithoutTextModal">
+
   <vgr-modal-header>Ann-Christin Berglund har skrivit en kommentar på utbetalningsunderlaget</vgr-modal-header>
   <vgr-modal-content>
     <p>Ditt svar:</p>
-    <textarea></textarea>
+    <form [formGroup]="form">
+      <vgr-textarea formControlName="textarea" [showValidation]="form.controls.textarea.touched && validateOnSubmit"></vgr-textarea>
+    </form>
   </vgr-modal-content>
   <vgr-modal-footer>
-    <vgr-button [secondary]="true" (click)="closeModal('commentAnswerWithoutTextModal')">Avbryt</vgr-button>
-    <vgr-button [secondary]="true" (click)="closeModal('commentAnswerWithoutTextModal')">Svara</vgr-button>
+    <vgr-button [secondary]="true" (click)="closeModalCancel('commentAnswerWithoutTextModal')">Avbryt</vgr-button>
+    <vgr-button [secondary]="true" (click)="closeModalSave('commentAnswerWithoutTextModal')">Svara</vgr-button>
   </vgr-modal-footer>
+
 </vgr-modal>
 <vgr-modal id="commentModal">
   <vgr-modal-header>Ann-Christin Berglund har skrivit en kommentar på utbetalningsunderlaget</vgr-modal-header>

diff --git a/src/app/modaldialog/modaldialog.component.ts b/src/app/modaldialog/modaldialog.component.ts
@@ -14,6 +14,7 @@ export class ModaldialogComponent implements OnInit {
   vardval1Answer: string;
   vardval2Answer: string;
   dropdownItems = [];
+  validateOnSubmit: boolean;
 
   exampleCodeHtml = `
   <vgr-button (click)="modalService.openDialog('myModalId')">Open Modal</vgr-button>
@@ -34,13 +35,12 @@ export class ModaldialogComponent implements OnInit {
   import { ModalService } from 'vgr-komponentkartan';
 
   constructor(modalService: ModalService) {}
-
-  doSomething() { }
 `;
 
 
   exampleCodeMarkup: string;
   exampleCodeTypescript: string;
+  form: FormGroup;
 
   constructor(public modalService: ModalService, htmlEncoder: HtmlEncodeService) {
     this.dropdownItems = [
@@ -52,6 +52,9 @@ export class ModaldialogComponent implements OnInit {
       htmlEncoder.prepareHighlightedSection(this.exampleCodeHtml, 'HTML');
     this.exampleCodeTypescript =
       htmlEncoder.prepareHighlightedSection(this.exampleCodeTs, 'typescript');
+
+
+
   }
 
   ngOnInit() {
@@ -107,6 +110,10 @@ export class ModaldialogComponent implements OnInit {
     this.vardvalForm2 = new FormGroup({
       vardval: new FormControl(null, { validators: [Validators.required] }),
     }, { updateOn: 'change' });
+
+    this.form = new FormGroup({
+      textarea: new FormControl('', { validators: [Validators.required] })
+    }, { updateOn: 'blur' });
   }
 
   selectVardval1() {
@@ -140,5 +147,17 @@ export class ModaldialogComponent implements OnInit {
     this.modalService.closeDialog(elementId);
   }
 
-  doSomething() { }
+  closeModalSave(elementId: string): void {
+    this.validateOnSubmit = true;
+    if (this.form.valid) {
+      this.modalService.closeDialog(elementId);
+      this.validateOnSubmit = false;
+    }
+  }
+
+  closeModalCancel(elementId: string): void {
+    this.form.reset();
+    this.modalService.closeDialog(elementId);
+  }
+
 }