MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

autocomplete, radio box fields, bugs fixes

This commit is contained in:
annampak 2017-12-05 13:02:03 +02:00
parent 6bb4b4f3e0
commit 95c5dd4a60
18 changed files with 109 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dmp-admin/src/app/app.module.ts
View File

@ -70,6 +70,7 @@ import { CompositeFieldFormComponent } from './compositefield-form/compositefiel
import { ComboboxComponent } from './combobox/combobox-component';
import { AutocompleteComponent } from './autocomplete/autocomplete-component';
import { WordlistComponent } from './wordlist/wordlist-component';
import { RadioBoxComponent } from './radiobox/radiobox-component';
@ -97,6 +98,7 @@ import { WordlistComponent } from './wordlist/wordlist-component';
ComboboxComponent,
AutocompleteComponent,
WordlistComponent,
RadioBoxComponent,
DatasetsViewerComponent,
ProfileEditorComponent,
PropertiesEditorComponent,

1
dmp-admin/src/app/autocomplete/autocomplete-component.ts
View File

@ -15,6 +15,7 @@ export class AutocompleteComponent implements OnInit{
private data:AutocompleteData = new AutocompleteData();
ngOnInit(){
this.data.type= "autocomplete";
let autocomplete: AutocompleteData = new AutocompleteData();
this.dataModel.data = new JsonSerializer<AutocompleteData>().fromJSONObject(this.data,AutocompleteData);
//(<FormArray>this.form.get("data")).push(autocomplete.buildForm());

4
dmp-admin/src/app/compositefield-form/compositefield-form.component.html
View File

@ -18,11 +18,11 @@
</div>
<div class="form-group col-md-4">
<label>Ordinal</label>
<input type="nymber" class="form-control" formControlName="ordinal">
<input type="number" class="form-control" formControlName="ordinal">
</div>
<div class="form-group col-md-4">
<label>Id</label>
<input type="nymber" class="form-control" formControlName="id">
<input type="string" class="form-control" formControlName="id">
</div>
</div>

2
dmp-admin/src/app/compositefield-form/compositefield-form.component.ts
View File

@ -26,7 +26,7 @@ addNewField(){
(<FormArray>this.form.get("fields")).push(field.buildForm());
}
DeleteField(index){
this.dataModel.fields.splice(index);
this.dataModel.fields.splice(index, 1);
(<FormArray>this.form.get("fields")).removeAt(index);
}
}

8
dmp-admin/src/app/field-form/field-form.component.html
View File

@ -19,6 +19,7 @@
<option value='combobox'>combobox</option>
<option value="checkBox">checkBox</option>
<option value="freetext">freetext</option>
<option value="radiobox">radiobox</option>
</select>
</div>
</div>
@ -28,6 +29,9 @@
<div *ngSwitchCase="'combobox'">
<combobox-component [form]="form" [dataModel]= "dataModel"></combobox-component>
</div>
<div *ngSwitchCase="'radiobox'">
<radiobox-component [form]="form" [dataModel]= "dataModel"></radiobox-component>
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
@ -77,7 +81,7 @@
</div>
</div>
<!-- <div *ngFor="let rule of dataModel.visible.rules let i=index;">
<div *ngFor="let rule of dataModel.visible.rules let i=index;">
<h4 style="text-decoration: underline;">Rules <button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteRule(i);"><span class="glyphicon glyphicon-erase"></span></button></h4>
<rule-form [form]="form.get('visible').get('rules').get(''+i)" [dataModel]="rule"></rule-form>
<div>
@ -90,6 +94,6 @@
<a (click)="addNewRule(form)" style="cursor: pointer">
Add another rule +
</a>
</div> -->
</div>
</div>

2
dmp-admin/src/app/field-form/field-form.component.ts
View File

@ -30,7 +30,7 @@ addNewRule(){
}
DeleteRule(index){
this.dataModel.visible.rules.splice(index);
this.dataModel.visible.rules.splice(index, 1);
(<FormArray>this.form.get("visible").get("rules")).removeAt(index);
}

10
dmp-admin/src/app/form/form.component.html
View File

@ -1,6 +1,12 @@
<div class="container">
<div style="background-color: #f5f5f5;border: 1px solid #e3e3e3;padding: 24px;">
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
<div class="form-row">
<div class="form-group col-md-12">
<label>Label</label>
<input type="text" class="form-control" formControlName="label">
</div>
</div>
<div *ngFor="let section of dataModel.sections; let i=index;">
<h4 style="text-decoration: underline;">Section
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteSection(i);">
@ -13,7 +19,11 @@
Add another section +
</a>
</div>
</div>
<div *ngIf="dataModel.sections.length == 0;" style="margin-top:20px; padding-left: 15px;">
<a (click)="addSection()" style="cursor: pointer">
Add another section +

2
dmp-admin/src/app/form/form.component.ts
View File

@ -55,7 +55,7 @@ export class FormComponent {
}
DeleteSection(index) {
this.dataModel.sections.splice(index);
this.dataModel.sections.splice(index,1);
(<FormArray>this.form.get("sections")).removeAt(index)
}

2
dmp-admin/src/app/groupfield-form/groupfield-form.component.ts
View File

@ -36,7 +36,7 @@ export class GroupFieldFormComponent {
}
DeleteFieldSet(index){
this.dataModel.compositeFields.splice(index);
this.dataModel.compositeFields.splice(index, 1);
(<FormArray>this.form.get("compositeFields")).removeAt(index);
}

7
dmp-admin/src/app/models/DatasetProfileModel.ts
View File

@ -1,5 +1,5 @@
import { BaseModel } from './BaseModel';
import { FormBuilder, FormGroup } from '@angular/forms';
import { FormBuilder, FormGroup, FormControl } from '@angular/forms';
import { FormGenerator } from './interfaces/FormGenerator';
import { JsonSerializer } from '../utilities/JsonSerializer';
import { Section } from './Section';
@ -7,9 +7,11 @@ import { Serializable } from './interfaces/Serializable';
export class DatasetProfileModel extends BaseModel implements Serializable<DatasetProfileModel>,FormGenerator<FormGroup>{
public sections:Array<Section> = new Array<Section>();
public label: string;
fromJSONObject(item:any):DatasetProfileModel{
this.sections = new JsonSerializer<Section>().fromJSONArray(item.sections,Section);
this.label = item.label;
return this;
}
@ -21,6 +23,7 @@ export class DatasetProfileModel extends BaseModel implements Serializable<Datas
sectionsFormArray.push(form)
})
formGroup.addControl('sections', this.formBuilder.array(sectionsFormArray));
formGroup.addControl('label', new FormControl(this.label));
return formGroup;
}

24
dmp-admin/src/app/radiobox/radiobox-component.html Normal file
View File

@ -0,0 +1,24 @@
<div [formGroup]="form" class="form-row">
<div formGroupName="data">
<div formArrayName="options">
<div *ngFor="let option of form.get('data').get('options').controls index as i">
<div [formGroupName]="i">
<div class="form-group col-md-6">
<label>Label</label>
<input type="text" class="form-control" formControlName="label">
</div>
<div class="form-group col-md-6">
<label>Value</label>
<input type="text" class="form-control" formControlName="value">
</div>
</div>
</div>
</div>
</div>
<div>
<a (click)="addNewRow(form)" style="cursor: pointer">
Add +
</a>
</div>
</div>

32
dmp-admin/src/app/radiobox/radiobox-component.ts Normal file
View File

@ -0,0 +1,32 @@
import { FormGroup } from '@angular/forms';
import { Field } from '../models/Field';
import { Component, Input, OnInit } from '@angular/core';
import { RadioBoxData } from '../models/DataField/RadioBoxData';
import { FormArray } from '@angular/forms/src/model';
import { ListingItem } from '../models/Commons/ListingItem';
import { JsonSerializer } from '../utilities/JsonSerializer';
@Component({
selector: 'radiobox-component',
templateUrl: './radiobox-component.html'
})
export class RadioBoxComponent implements OnInit{
@Input() dataModel: Field;
@Input() form: FormGroup;
private data: RadioBoxData = new RadioBoxData();
private options = new Array<ListingItem>();
ngOnInit(){
if (this.form.get("data")) this.form.removeControl("data");
this.form.addControl("data", this.data.buildForm());
this.addNewRow();
}
addNewRow(){
let radioListOptions:ListingItem = new ListingItem();
(<FormArray>this.form.get("data").get("options")).push(radioListOptions.buildForm());
this.data.options = [];
this.data.options.push(radioListOptions);
this.dataModel.data = new JsonSerializer<RadioBoxData>().fromJSONObject(this.data,RadioBoxData);
}
}

2
dmp-admin/src/app/rule-component/rule.component.html
View File

@ -9,7 +9,7 @@
</div>
<div class="form-group col-md-4">
<label>Target</label>
<input type="text" class="form-control" placeholder="field id" formControlName="target">
<input type="text" class="form-control" placeholder="field id" formControlName="target" (change)="TargetValidation()">
</div>
<div class="form-group col-md-4">
<label>Rule style</label>

4
dmp-admin/src/app/rule-component/rule.component.ts
View File

@ -12,4 +12,8 @@ export class RuleFormComponent {
@Input() form: FormGroup;
@Input() dataModel: FormGroup;
TargetValidation(){
debugger;
}
}

13
dmp-admin/src/app/section-form/section-form.component.html
View File

@ -27,6 +27,11 @@
</div>
<div *ngIf="dataModel.sections">
<div *ngFor="let section of dataModel.sections let i=index;">
<h4 style="text-decoration: underline;">Section
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteSectionInSection(i);">
<span class="glyphicon glyphicon-erase"></span>
</button>
</h4>
<section-form [form]="form.get('sections').get(''+i)" [dataModel]="section"></section-form>
</div>
</div>
@ -48,10 +53,10 @@
</div>
<div style="margin-top:20px; padding-left: 15px;">
<a (click)="addSectioninSection()" style="cursor: pointer">
Add section +
</a>
</div>
<a (click)="addSectioninSection()" style="cursor: pointer">
Add section +
</a>
</div>
<div *ngIf="dataModel.fieldGroups.length == 0;">
<a (click)="addGroupField()" style="cursor: pointer">

7
dmp-admin/src/app/section-form/section-form.component.ts
View File

@ -30,7 +30,7 @@ export class SectionFormComponent {
}
DeleteFieldGroup(index){
this.dataModel.fieldGroups.splice(index);
this.dataModel.fieldGroups.splice(index, 1);
(<FormArray>this.form.get("fieldGroups")).removeAt(index)
}
@ -39,5 +39,10 @@ export class SectionFormComponent {
this.dataModel.sections.push(section);
(<FormArray>this.form.get("sections")).push(section.buildForm());
}
DeleteSectionInSection(index){
this.dataModel.sections.splice(index);
(<FormArray>this.form.get("sections")).removeAt(index);
}
}

4
dmp-admin/src/app/wordlist/wordlist-component.html
View File

@ -4,11 +4,11 @@
<div *ngFor="let option of form.get('data').get('options').controls index as i">
<div [formGroupName]="i">
<div class="form-group col-md-6">
<label>Value</label>
<label>Label</label>
<input type="text" class="form-control" formControlName="label">
</div>
<div class="form-group col-md-6">
<label>Id</label>
<label>Value</label>
<input type="text" class="form-control" formControlName="value">
</div>
</div>

1
dmp-admin/src/app/wordlist/wordlist-component.ts
View File

@ -17,6 +17,7 @@ export class WordlistComponent implements OnInit{
private options = new Array<ListingItem>();
ngOnInit(){
this.data.type = "wordlist";
if (this.form.get("data")) this.form.removeControl("data");
this.form.addControl("data", this.data.buildForm());
this.addNewRow();