From cc49a89ea4e6762c0e71e6956bff404ecdedb2ab Mon Sep 17 00:00:00 2001 From: Sebastian Seedorf Date: Fri, 9 Jun 2017 14:56:35 +0200 Subject: [PATCH] Dropdown foreign implementation --- .idea/workspace.xml | 603 +++++++++++------- src/app/app.component.html | 4 +- src/app/app.component.ts | 16 +- .../dyn-form/dyn-question.component.ts | 3 +- .../inputs/checkbox-input.component.ts | 6 +- .../inputs/dropdown-input.component.ts | 44 +- .../inputs/textarea-input.component.ts | 3 +- .../inputs/textbox-input.component.ts | 2 + 8 files changed, 410 insertions(+), 271 deletions(-) diff --git a/.idea/workspace.xml b/.idea/workspace.xml index 56d33c5..3242d1b 100644 --- a/.idea/workspace.xml +++ b/.idea/workspace.xml @@ -1,9 +1,15 @@ - + - + + + + + + + @@ -21,111 +27,124 @@ - - + + - - + + - - + + - - + + - - + + - - + + - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + - - + + - - + + - + + - - + + - - + + - + + + + + + + + + + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -147,24 +166,25 @@ @@ -214,8 +234,8 @@ - + @@ -368,6 +388,70 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -497,7 +581,8 @@ - + + 1496129612668 @@ -562,11 +647,18 @@ - \ No newline at end of file diff --git a/src/app/app.component.html b/src/app/app.component.html index c03d6ed..a638866 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,3 +1,5 @@ + +

{{formName}}

{{formDescription}}

- \ No newline at end of file + diff --git a/src/app/app.component.ts b/src/app/app.component.ts index cd5880a..c1f2750 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,4 +1,4 @@ -import {Component} from '@angular/core'; +import {Component, Input, OnChanges, SimpleChanges} from '@angular/core'; import {QuestionInterface} from './modules/dyn-form/types/question.interface'; import {FormService} from './modules/dyn-form/services/form.service'; import {ValueService} from './modules/dyn-form/services/value.service'; @@ -8,14 +8,20 @@ import {ValueService} from './modules/dyn-form/services/value.service'; templateUrl: './app.component.html' }) -export class AppComponent { +export class AppComponent { public formQuestions: QuestionInterface[] = null; public formValue: Object = null; public formName: string = ""; public formDescription =""; + private uri: string = '/crf/fields'; constructor(private questionService: FormService, private valueService: ValueService) { - this.questionService.getForm('/crf/domains', (res, err) => { + this.loadValues(); + } + + private loadValues() { + console.log(this.uri); + this.questionService.getForm(this.uri, (res, err) => { if (err) console.error(err); else { @@ -25,7 +31,7 @@ export class AppComponent { console.log("questions", this.formQuestions); } }); - this.valueService.getValue('/crf/domains', 3, (res, err) => { + this.valueService.getValue(this.uri, 3, (res, err) => { if (err) console.error(err); else { @@ -35,7 +41,7 @@ export class AppComponent { }); } - submit(value: any) { + public submit(value: any) { console.log('send', value); } } diff --git a/src/app/modules/dyn-form/dyn-question.component.ts b/src/app/modules/dyn-form/dyn-question.component.ts index fe648aa..a8f2c6d 100644 --- a/src/app/modules/dyn-form/dyn-question.component.ts +++ b/src/app/modules/dyn-form/dyn-question.component.ts @@ -22,7 +22,7 @@ import {FormGroup, ValidationErrors} from '@angular/forms'; { this.errorList = []; let control = this.form.controls[this.question.properties.key]; - console.log("XX", this.question.properties.key, control.untouched, control.valid); if (control.untouched || control.valid) return null; let errors: ValidationErrors = control.errors; diff --git a/src/app/modules/dyn-form/inputs/checkbox-input.component.ts b/src/app/modules/dyn-form/inputs/checkbox-input.component.ts index 8767273..f14dd7e 100644 --- a/src/app/modules/dyn-form/inputs/checkbox-input.component.ts +++ b/src/app/modules/dyn-form/inputs/checkbox-input.component.ts @@ -6,9 +6,9 @@ import {CustomInputComponent} from "./custom-input.component"; selector: 'checkbox-input', template: ` -
-
-
+
+
+
{{value ? "Yes" : (value===false ? "No" : "N/A")}} `, providers: [ diff --git a/src/app/modules/dyn-form/inputs/dropdown-input.component.ts b/src/app/modules/dyn-form/inputs/dropdown-input.component.ts index 8891776..5600ed3 100644 --- a/src/app/modules/dyn-form/inputs/dropdown-input.component.ts +++ b/src/app/modules/dyn-form/inputs/dropdown-input.component.ts @@ -1,6 +1,8 @@ import {Component, forwardRef, Input, OnChanges, SimpleChanges} from '@angular/core'; import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormControl, ValidationErrors } from '@angular/forms'; import {CustomInputComponent} from "./custom-input.component"; +import {ValueService} from '../services/value.service'; +import {consoleTestResultHandler} from 'tslint/lib/test'; @Component({ selector: 'dropdown-input', @@ -21,34 +23,51 @@ import {CustomInputComponent} from "./custom-input.component"; provide: NG_VALIDATORS, useExisting: forwardRef(() => DropdownInputComponent), multi: true, - }] + }, + ValueService + ] }) export class DropdownInputComponent extends CustomInputComponent implements OnChanges { @Input() readonly: boolean = false; @Input() nullable: boolean = false; @Input() items: Array<{key: string, value: string}> = []; + @Input() foreign: {uri: string, keys: string, values: string, options?: {key: string, value: string}[]}; private listedItems: Array<{key: string, value: string}> = []; + private foreignItems: Array<{key: string, value: string}> = []; private constVal: string; + constructor(private valueService: ValueService) { + super(); + } + // set initial value public writeValue(obj: any): void { - console.log("init: ", obj); this.value = obj; this.updateConst(); } public ngOnChanges(changes: SimpleChanges) { - console.log("onchnage: ", this.value); if (changes['items'] || changes['nullable'] || changes['readonly']) { - if (this.nullable) - this.listedItems = [{key: "", value: "N/A"}, {key: null, value: "N/A"}].concat(this.items); - else - this.listedItems = this.items; - this.updateConst(); + this.setListedItems(); + } + if (changes['foreign'] && this.foreign) { + this.valueService.getValues(this.foreign.uri, {}, (res, err) => { + this.foreignItems = []; + for (let item of res as any) { + this.foreignItems.push({key: item[this.foreign.keys], value: item[this.foreign.values]}); + } + this.setListedItems(); + }); } } - + private setListedItems() { + if (this.nullable) + this.listedItems = [{key: "", value: "N/A"}, {key: null, value: "N/A"}].concat(this.items || []).concat(this.foreignItems || []); + else + this.listedItems = [].concat(this.items || []).concat(this.foreignItems || []); + this.updateConst(); + } private updateConst() { if (this.readonly) { @@ -63,7 +82,6 @@ export class DropdownInputComponent extends CustomInputComponent implements OnCh // validates the form, returns null when valid else the validation object public validate(c: FormControl): ValidationErrors { - console.log("validate", this.value, this.initComplete, this.nullable, this.items); if (!this.initComplete) return null; if (this.value===null) { @@ -72,12 +90,10 @@ export class DropdownInputComponent extends CustomInputComponent implements OnCh message: "This field is required!" }}; } - for (let i=0; i