remove section, field, etc multiplicity class
This commit is contained in:
parent
3e4f615cc2
commit
7116e0159f
|
@ -1,23 +1,34 @@
|
||||||
<div>
|
<div>
|
||||||
<h4>FieldSet</h4>
|
|
||||||
<div [formGroup]="form">
|
<div [formGroup]="form">
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-12">
|
<div class="form-group col-md-12">
|
||||||
<div class="form-group col-md-6">
|
<div class="form-group col-md-6">
|
||||||
<label>Multiplicity</label>
|
<label>Multiplicity</label>
|
||||||
<input type="nymber" class="form-control" formControlName="multiplicity">
|
<input type="nymber" class="form-control" formControlName="multiplicity">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div *ngFor="let field of dataModel.fields let i=index;">
|
<div *ngFor="let field of dataModel.fields let i=index;">
|
||||||
|
<h4 style="text-decoration: underline;">Fields
|
||||||
|
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteField(i);">
|
||||||
|
<span class="glyphicon glyphicon-erase"></span>
|
||||||
|
</button>
|
||||||
|
</h4>
|
||||||
<field-form [form]="form.get('fields').get(''+i)" [dataModel]="field"></field-form>
|
<field-form [form]="form.get('fields').get(''+i)" [dataModel]="field"></field-form>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<a (click)="addNewField()" style="cursor: pointer">
|
||||||
|
Add another field +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div *ngIf="dataModel.fields.length == 0;">
|
||||||
<a (click)="addNewField()" style="cursor: pointer">
|
<a (click)="addNewField()" style="cursor: pointer">
|
||||||
Add another field +
|
Add another field +
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
|
@ -17,7 +17,7 @@ export class CompositeFieldFormComponent {
|
||||||
constructon(){}
|
constructon(){}
|
||||||
|
|
||||||
ngOnInit(){
|
ngOnInit(){
|
||||||
// this.addNewField();
|
//this.addNewField();
|
||||||
}
|
}
|
||||||
|
|
||||||
addNewField(){
|
addNewField(){
|
||||||
|
@ -25,5 +25,8 @@ addNewField(){
|
||||||
this.dataModel.fields.push(field);
|
this.dataModel.fields.push(field);
|
||||||
(<FormArray>this.form.get("fields")).push(field.buildForm());
|
(<FormArray>this.form.get("fields")).push(field.buildForm());
|
||||||
}
|
}
|
||||||
|
DeleteField(index){
|
||||||
|
this.dataModel.fields.splice(index);
|
||||||
|
(<FormArray>this.form.get("fields")).removeAt(index);
|
||||||
|
}
|
||||||
}
|
}
|
|
@ -1,16 +1,15 @@
|
||||||
<div>
|
<div>
|
||||||
<h4 style="text-decoration: underline;">Fields</h4>
|
|
||||||
<div [formGroup]="form">
|
<div [formGroup]="form">
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-6">
|
||||||
<label>Title</label>
|
<label>Title</label>
|
||||||
<input type="text" class="form-control" formControlName="title">
|
<input type="text" class="form-control" formControlName="title">
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-3">
|
||||||
<label>Id</label>
|
<label>Id</label>
|
||||||
<input type="text" class="form-control" formControlName="id">
|
<input type="text" class="form-control" formControlName="id">
|
||||||
</div>
|
</div>
|
||||||
<div class="form-row col-md-4">
|
<div class="form-row col-md-3">
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label>View style</label>
|
<label>View style</label>
|
||||||
<select class="form-control" formControlName="viewStyle">
|
<select class="form-control" formControlName="viewStyle">
|
||||||
|
@ -25,46 +24,62 @@
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-6">
|
||||||
<label>description</label>
|
<label>description</label>
|
||||||
<input type="text" class="form-control" formControlName="description">
|
<input type="text" class="form-control" formControlName="description">
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-6">
|
||||||
<label>extendedDescription</label>
|
<label>extendedDescription</label>
|
||||||
<input type="text" class="form-control" formControlName="extendedDescription">
|
<input type="text" class="form-control" formControlName="extendedDescription">
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group col-md-4">
|
|
||||||
<label>Ordinal</label>
|
|
||||||
<input type="number" class="form-control" formControlName="ordinal">
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-4">
|
<div formGroupName="multiplicity">
|
||||||
<label class="radio control-label" >Default Visibility</label>
|
<div class="form-group">
|
||||||
<label class="radio-inline">
|
<div class="col-md-2">
|
||||||
<input type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1"> true
|
<label>Multiplicity</label>
|
||||||
</label>
|
<input type="number" class="form-control" formControlName="min" placeholder="Min">
|
||||||
<label class="radio-inline">
|
</div>
|
||||||
<input type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2"> false
|
|
||||||
</label>
|
<div class="col-md-2">
|
||||||
</div>
|
<!-- <label>Multiplicity</label> -->
|
||||||
<div class="form-group col-md-4">
|
<input type="number" class="form-control" formControlName="max" placeholder="Max">
|
||||||
<label>Multiplicity</label>
|
</div>
|
||||||
<input type="number" class="form-control" formControlName="multiplicity">
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="form-group col-md-2">
|
||||||
|
<label>Ordinal</label>
|
||||||
|
<input type="number" class="form-control" formControlName="ordinal">
|
||||||
|
</div>
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-4">
|
||||||
<label>Default Value</label>
|
<label>Default Value</label>
|
||||||
<input type="text" class="form-control" formControlName="value">
|
<input type="text" class="form-control" formControlName="value">
|
||||||
</div>
|
</div>
|
||||||
|
<div class="form-group col-md-2">
|
||||||
|
<label class="radio control-label">Default Visibility</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="defaultVisibility" id="inlineRadio1" value="true" formControlName="defaultVisibility"> true
|
||||||
|
</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="defaultVisibility" id="inlineRadio2" value="false" formControlName="defaultVisibility"> false
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div *ngFor="let rule of dataModel.rules let i=index;">
|
<div *ngFor="let rule of dataModel.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('rules').get(''+i)" [dataModel]="rule"></rule-form>
|
<rule-form [form]="form.get('rules').get(''+i)" [dataModel]="rule"></rule-form>
|
||||||
|
<div>
|
||||||
|
<a (click)="addNewRule(form)" style="cursor: pointer">
|
||||||
|
Add another rule +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div *ngIf="dataModel.rules.length == 0;">
|
||||||
<a (click)="addNewRule(form)" style="cursor: pointer">
|
<a (click)="addNewRule(form)" style="cursor: pointer">
|
||||||
Add another rule +
|
Add another rule +
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
|
@ -2,6 +2,7 @@ import { Component, Input } from '@angular/core';
|
||||||
import { FormGroup } from '@angular/forms';
|
import { FormGroup } from '@angular/forms';
|
||||||
import { Field } from '../models/Field';
|
import { Field } from '../models/Field';
|
||||||
import { Rule } from '../models/Rule';
|
import { Rule } from '../models/Rule';
|
||||||
|
import { Multiplicity } from '../models/Multiplicity';
|
||||||
import { FormArray } from '@angular/forms/src/model';
|
import { FormArray } from '@angular/forms/src/model';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -17,7 +18,8 @@ export class FieldFormComponent {
|
||||||
constructon(){}
|
constructon(){}
|
||||||
|
|
||||||
ngOnInit(){
|
ngOnInit(){
|
||||||
//this.addNewRule();
|
console.log("init field")
|
||||||
|
// this.addNewRule();
|
||||||
}
|
}
|
||||||
|
|
||||||
addNewRule(){
|
addNewRule(){
|
||||||
|
@ -25,5 +27,10 @@ addNewRule(){
|
||||||
this.dataModel.rules.push(rule);
|
this.dataModel.rules.push(rule);
|
||||||
(<FormArray>this.form.get("rules")).push(rule.buildForm());
|
(<FormArray>this.form.get("rules")).push(rule.buildForm());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
DeleteRule(index){
|
||||||
|
this.dataModel.rules.splice(index);
|
||||||
|
(<FormArray>this.form.get("rules")).removeAt(index);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
|
@ -1,15 +1,28 @@
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
|
<div style="background-color: #f5f5f5;border: 1px solid #e3e3e3;padding: 24px;">
|
||||||
<div *ngFor="let section of dataModel.sections; let i=index;">
|
<form novalidate [formGroup]="form" (ngSubmit)="onSubmit()">
|
||||||
<section-form [form]="form.get('sections').get(''+i)" [dataModel]="section"></section-form>
|
<div *ngFor="let section of dataModel.sections; let i=index;">
|
||||||
</div>
|
<h4 style="text-decoration: underline;">Section
|
||||||
<div style="margin-top:20px; padding-left: 15px;">
|
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteSection(i);">
|
||||||
<a (click)="addSection()" style="cursor: pointer">
|
<span class="glyphicon glyphicon-erase"></span>
|
||||||
Add another section +
|
</button>
|
||||||
</a>
|
</h4>
|
||||||
</div>
|
<section-form [form]="form.get('sections').get(''+i)" [dataModel]="section" [index]="i"></section-form>
|
||||||
<button type="submit">Save</button>
|
<div style="margin-top:20px; padding-left: 15px;">
|
||||||
|
<a (click)="addSection()" style="cursor: pointer">
|
||||||
|
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 +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
<p>Form value: {{ form.value | json }}</p>
|
<button type="submit">Save</button>
|
||||||
</form>
|
|
||||||
|
<p>Form value: {{ form.value | json }}</p>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
|
@ -7,7 +7,7 @@ import { FieldGroup } from '../models/FieldGroup';
|
||||||
import { DatasetProfileModel } from '../models/DatasetProfileModel';
|
import { DatasetProfileModel } from '../models/DatasetProfileModel';
|
||||||
import { TestModel } from '../testModel/testModel';
|
import { TestModel } from '../testModel/testModel';
|
||||||
import { FormArray } from '@angular/forms/src/model';
|
import { FormArray } from '@angular/forms/src/model';
|
||||||
|
import {RestBase} from '../services/rest-base';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'form-comp',
|
selector: 'form-comp',
|
||||||
|
@ -20,14 +20,14 @@ export class FormComponent {
|
||||||
dataModel: DatasetProfileModel ;
|
dataModel: DatasetProfileModel ;
|
||||||
form: FormGroup;
|
form: FormGroup;
|
||||||
|
|
||||||
constructor(){
|
constructor(public restBase: RestBase){
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(){
|
ngOnInit(){
|
||||||
this.dataModel = new DatasetProfileModel();
|
this.dataModel = new DatasetProfileModel();
|
||||||
this.dataModel = new JsonSerializer<DatasetProfileModel>().fromJSONObject(TestModel,DatasetProfileModel);
|
this.dataModel = new JsonSerializer<DatasetProfileModel>().fromJSONObject(TestModel,DatasetProfileModel);
|
||||||
this.form = this.dataModel.buildForm();
|
this.form = this.dataModel.buildForm();
|
||||||
this.addSection();
|
//if (!this.dataModel) this.addSection();
|
||||||
}
|
}
|
||||||
|
|
||||||
addSection(){
|
addSection(){
|
||||||
|
@ -35,5 +35,19 @@ export class FormComponent {
|
||||||
this.dataModel.sections.push(section);
|
this.dataModel.sections.push(section);
|
||||||
(<FormArray>this.form.get("sections")).push(section.buildForm());
|
(<FormArray>this.form.get("sections")).push(section.buildForm());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
DeleteSection(index){
|
||||||
|
this.dataModel.sections.splice(index);
|
||||||
|
(<FormArray>this.form.get("sections")).removeAt(index)
|
||||||
|
}
|
||||||
|
|
||||||
|
updateForm(data){
|
||||||
|
return this.restBase.post("", data);
|
||||||
|
}
|
||||||
|
|
||||||
|
onSubmit(){ debugger;
|
||||||
|
let data = JSON.stringify(this.form.value);
|
||||||
|
this.updateForm(data).subscribe();
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
|
@ -1,38 +1,57 @@
|
||||||
<div><!-- style="border-style: solid;"-->
|
|
||||||
<h4 style="text-decoration: underline;">GroupFields</h4>
|
|
||||||
<div [formGroup]="form">
|
|
||||||
<div class="form-row">
|
|
||||||
<div class="form-group col-md-4">
|
|
||||||
<label>Title</label>
|
|
||||||
<input type="text" class="form-control" formControlName="title">
|
|
||||||
</div>
|
|
||||||
<div class="form-group col-md-4">
|
|
||||||
<label>Id</label>
|
|
||||||
<input type="text" class="form-control" formControlName="id">
|
|
||||||
</div>
|
|
||||||
<div class="form-group col-md-4">
|
|
||||||
<label>DefaultVisibility</label>
|
|
||||||
<input type="text" class="form-control" formControlName="defaultVisibility">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<div class="form-group col-md-6">
|
|
||||||
<label>Description</label>
|
|
||||||
<input type="text" class="form-control" formControlName="description">
|
|
||||||
</div>
|
|
||||||
<div class="form-group col-md-6">
|
|
||||||
<label>ExtendedDescription</label>
|
|
||||||
<input type="text" class="form-control" formControlName="extendedDescription">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div *ngFor="let field of dataModel.compositeFields let i=index;">
|
|
||||||
<compositefield-form [form]="form.get('compositeFields').get(''+i)" [dataModel]="field"></compositefield-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<a (click)="addNewField()" style="cursor: pointer">
|
<!-- style="border-style: solid;"-->
|
||||||
Add another field Set (CompositeField) +
|
<div [formGroup]="form">
|
||||||
</a>
|
<div class="form-row">
|
||||||
</div>
|
<div class="form-group col-md-4">
|
||||||
|
<label>Title</label>
|
||||||
|
<input type="text" class="form-control" formControlName="title">
|
||||||
|
</div>
|
||||||
|
<div class="form-group col-md-4">
|
||||||
|
<label>Id</label>
|
||||||
|
<input type="text" class="form-control" formControlName="id">
|
||||||
|
</div>
|
||||||
|
<div class="form-group col-md-4">
|
||||||
|
<label class="radio control-label">DefaultVisibility</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" id="defaultVisibility" value="true" formControlName="defaultVisibility"> true
|
||||||
|
</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" id="defaultVisibility" value="false" formControlName="defaultVisibility"> false
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<div class="form-group col-md-6">
|
||||||
|
<label>Description</label>
|
||||||
|
<input type="text" class="form-control" formControlName="description">
|
||||||
|
</div>
|
||||||
|
<div class="form-group col-md-6">
|
||||||
|
<label>ExtendedDescription</label>
|
||||||
|
<input type="text" class="form-control" formControlName="extendedDescription">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div *ngFor="let field of dataModel.compositeFields let i=index;">
|
||||||
|
<h4 style="text-decoration: underline;">FieldSet
|
||||||
|
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteFieldSet(i);">
|
||||||
|
<span class="glyphicon glyphicon-erase"></span>
|
||||||
|
</button>
|
||||||
|
</h4>
|
||||||
|
<compositefield-form [form]="form.get('compositeFields').get(''+i)" [dataModel]="field"></compositefield-form>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<a (click)="addNewField()" style="cursor: pointer">
|
||||||
|
Add another field Set (CompositeField) +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="dataModel.compositeFields.length == 0;">
|
||||||
|
<a (click)="addNewField()" style="cursor: pointer">
|
||||||
|
Add another field Set (CompositeField) +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
|
@ -17,7 +17,8 @@ export class GroupFieldFormComponent {
|
||||||
constructor(){}
|
constructor(){}
|
||||||
|
|
||||||
ngOnInit(){
|
ngOnInit(){
|
||||||
// this.addNewField();
|
console.log("init group");
|
||||||
|
//this.addNewField();
|
||||||
}
|
}
|
||||||
|
|
||||||
addNewField(){
|
addNewField(){
|
||||||
|
@ -25,5 +26,10 @@ export class GroupFieldFormComponent {
|
||||||
this.dataModel.compositeFields.push(compositeField);
|
this.dataModel.compositeFields.push(compositeField);
|
||||||
(<FormArray>this.form.get("compositeFields")).push(compositeField.buildForm());
|
(<FormArray>this.form.get("compositeFields")).push(compositeField.buildForm());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
DeleteFieldSet(index){
|
||||||
|
this.dataModel.compositeFields.splice(index);
|
||||||
|
(<FormArray>this.form.get("compositeFields")).removeAt(index);
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
|
@ -4,6 +4,7 @@ import { FormGenerator } from './interfaces/FormGenerator';
|
||||||
import { JsonSerializer } from '../utilities/JsonSerializer';
|
import { JsonSerializer } from '../utilities/JsonSerializer';
|
||||||
import { Serializable } from './interfaces/Serializable';
|
import { Serializable } from './interfaces/Serializable';
|
||||||
import {Rule} from './Rule'
|
import {Rule} from './Rule'
|
||||||
|
import {Multiplicity} from './Multiplicity'
|
||||||
|
|
||||||
export class Field extends BaseModel implements Serializable<Field>,FormGenerator<FormGroup>{
|
export class Field extends BaseModel implements Serializable<Field>,FormGenerator<FormGroup>{
|
||||||
|
|
||||||
|
@ -15,7 +16,7 @@ export class Field extends BaseModel implements Serializable<Field>,FormGenerato
|
||||||
public viewStyle:string;
|
public viewStyle:string;
|
||||||
public defaultVisibility:boolean;
|
public defaultVisibility:boolean;
|
||||||
public page:number;
|
public page:number;
|
||||||
public multiplicity: number;
|
public multiplicity: Multiplicity = new Multiplicity();
|
||||||
public ordinal: number;
|
public ordinal: number;
|
||||||
public rules: Array<Rule> = new Array<Rule>();
|
public rules: Array<Rule> = new Array<Rule>();
|
||||||
|
|
||||||
|
@ -28,7 +29,7 @@ export class Field extends BaseModel implements Serializable<Field>,FormGenerato
|
||||||
this.viewStyle = item.viewStyle;
|
this.viewStyle = item.viewStyle;
|
||||||
this.defaultVisibility = item.defaultVisibility;
|
this.defaultVisibility = item.defaultVisibility;
|
||||||
this.page = item.page;
|
this.page = item.page;
|
||||||
this.multiplicity = item.multiplicity;
|
this.multiplicity = new JsonSerializer<Multiplicity>().fromJSONObject(item.multiplicity, Multiplicity);
|
||||||
this.ordinal = item.ordinal;
|
this.ordinal = item.ordinal;
|
||||||
this.rules = new JsonSerializer<Rule>().fromJSONArray(item.rule, Rule);
|
this.rules = new JsonSerializer<Rule>().fromJSONArray(item.rule, Rule);
|
||||||
return this;
|
return this;
|
||||||
|
@ -44,7 +45,6 @@ export class Field extends BaseModel implements Serializable<Field>,FormGenerato
|
||||||
viewStyle: [this.viewStyle],
|
viewStyle: [this.viewStyle],
|
||||||
defaultVisibility:[this.defaultVisibility],
|
defaultVisibility:[this.defaultVisibility],
|
||||||
page:[this.page] ,
|
page:[this.page] ,
|
||||||
multiplicity: [this.multiplicity],
|
|
||||||
ordinal:[this.ordinal]
|
ordinal:[this.ordinal]
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -54,9 +54,12 @@ export class Field extends BaseModel implements Serializable<Field>,FormGenerato
|
||||||
let form:FormGroup = rule.buildForm();
|
let form:FormGroup = rule.buildForm();
|
||||||
rulesFormArray.push(form);
|
rulesFormArray.push(form);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
formGroup.addControl("rules", this.formBuilder.array(rulesFormArray))
|
formGroup.addControl("multiplicity", this.multiplicity.buildForm());
|
||||||
|
formGroup.addControl("rules", this.formBuilder.array(rulesFormArray));
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
return formGroup;
|
return formGroup;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<div>
|
<div>
|
||||||
<h4 style="text-decoration: underline;">Rules</h4>
|
|
||||||
<div [formGroup]="form">
|
<div [formGroup]="form">
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-4">
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Component, Input } from '@angular/core';
|
import { Component, Input, Output, EventEmitter } from '@angular/core';
|
||||||
import { FormGroup } from '@angular/forms'
|
import { FormGroup } from '@angular/forms'
|
||||||
import { Rule } from '../models/Rule'
|
import { Rule } from '../models/Rule'
|
||||||
|
|
||||||
|
@ -11,5 +11,5 @@ import { Rule } from '../models/Rule'
|
||||||
export class RuleFormComponent {
|
export class RuleFormComponent {
|
||||||
@Input() form: FormGroup;
|
@Input() form: FormGroup;
|
||||||
@Input() dataModel: FormGroup;
|
@Input() dataModel: FormGroup;
|
||||||
|
|
||||||
}
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
<div style="background-color: #f5f5f5;border: 1px solid #e3e3e3;padding: 24px;"><!--style="border-style: solid;"-->
|
<div style="background-color: #f5f5f5;border: 1px solid #e3e3e3;padding: 24px;">
|
||||||
<h4 style="text-decoration: underline;">Section</h4>
|
<!--style="border-style: solid;"-->
|
||||||
<div [formGroup]="form">
|
<div [formGroup]="form">
|
||||||
<div class="form-row">
|
<div class="form-row">
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-4">
|
||||||
|
@ -11,8 +11,13 @@
|
||||||
<input type="text" class="form-control" formControlName="id">
|
<input type="text" class="form-control" formControlName="id">
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group col-md-4">
|
<div class="form-group col-md-4">
|
||||||
<label>defaultVisibility</label>
|
<label class="radio control-label">defaultVisibility</label>
|
||||||
<input type="text" class="form-control" formControlName="defaultVisibility">
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="defaultVisibility" id="inlineRadio1" value="true" formControlName="defaultVisibility"> true
|
||||||
|
</label>
|
||||||
|
<label class="radio-inline">
|
||||||
|
<input type="radio" name="defaultVisibility" id="inlineRadio2" value="false" formControlName="defaultVisibility"> false
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -23,13 +28,21 @@
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="dataModel.fieldGroups">
|
<div *ngIf="dataModel.fieldGroups">
|
||||||
<div *ngFor="let fieldGroup of dataModel.fieldGroups let i=index;">
|
<div *ngFor="let fieldGroup of dataModel.fieldGroups let i=index;">
|
||||||
|
<h4 style="text-decoration: underline;">GroupFields
|
||||||
|
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteFieldGroup(i);">
|
||||||
|
<span class="glyphicon glyphicon-erase"></span>
|
||||||
|
</button>
|
||||||
|
</h4>
|
||||||
<groupfield-form [form]="form.get('fieldGroups').get(''+i)" [dataModel]="fieldGroup"></groupfield-form>
|
<groupfield-form [form]="form.get('fieldGroups').get(''+i)" [dataModel]="fieldGroup"></groupfield-form>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<a (click)="addGroupField()" style="cursor: pointer">
|
||||||
|
Add another group +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
|
||||||
<a (click)="addGroupField()" style="cursor: pointer">
|
|
||||||
Add another group +
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
|
@ -3,7 +3,7 @@ import { FormGroup } from '@angular/forms';
|
||||||
import { Section } from '../models/Section';
|
import { Section } from '../models/Section';
|
||||||
import { FieldGroup } from '../models/FieldGroup';
|
import { FieldGroup } from '../models/FieldGroup';
|
||||||
import { FormArray } from '@angular/forms/src/model';
|
import { FormArray } from '@angular/forms/src/model';
|
||||||
|
import { DatasetProfileModel } from '../models/DatasetProfileModel';
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -15,6 +15,7 @@ import { FormArray } from '@angular/forms/src/model';
|
||||||
export class SectionFormComponent {
|
export class SectionFormComponent {
|
||||||
@Input() form: FormGroup;
|
@Input() form: FormGroup;
|
||||||
@Input() dataModel:Section;
|
@Input() dataModel:Section;
|
||||||
|
@Input() index:number;
|
||||||
constructor(){ }
|
constructor(){ }
|
||||||
|
|
||||||
ngOnInit(){
|
ngOnInit(){
|
||||||
|
@ -27,5 +28,10 @@ export class SectionFormComponent {
|
||||||
this.dataModel.fieldGroups.push(fieldGroup);
|
this.dataModel.fieldGroups.push(fieldGroup);
|
||||||
(<FormArray>this.form.get("fieldGroups")).push(fieldGroup.buildForm());
|
(<FormArray>this.form.get("fieldGroups")).push(fieldGroup.buildForm());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
DeleteFieldGroup(index){
|
||||||
|
this.dataModel.fieldGroups.splice(index);
|
||||||
|
(<FormArray>this.form.get("fieldGroups")).removeAt(index)
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
|
@ -18,6 +18,10 @@ export const TestModel = {
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"compositeFields": [
|
"compositeFields": [
|
||||||
{
|
{
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":3
|
||||||
|
},
|
||||||
"fields":
|
"fields":
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
|
@ -27,7 +31,11 @@ export const TestModel = {
|
||||||
"description": "",
|
"description": "",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "checkBox",
|
"viewStyle": "checkBox",
|
||||||
"rule":[]
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
@ -67,7 +75,12 @@ export const TestModel = {
|
||||||
"title": "Q2.1.1 Will you use metadata to describe the data?",
|
"title": "Q2.1.1 Will you use metadata to describe the data?",
|
||||||
"description": "User can select from a list of metadata standards. If they cannot find the standard in the list provided then they should choose \"not listed\". Selecting this will result in a field in which the user can insert the URL to the description of the metadata scheme used. A \"comments\" box should exist to allow users to add comments. They may select more than one metadata standard. They may specify more than one URL when selecting \"not listed\". They are also presented with a field in which to specify the location of the metadata service. Users can select the \"no metadata\" button to specify no metadata will be used to describe the data.",
|
"description": "User can select from a list of metadata standards. If they cannot find the standard in the list provided then they should choose \"not listed\". Selecting this will result in a field in which the user can insert the URL to the description of the metadata scheme used. A \"comments\" box should exist to allow users to add comments. They may select more than one metadata standard. They may specify more than one URL when selecting \"not listed\". They are also presented with a field in which to specify the location of the metadata service. Users can select the \"no metadata\" button to specify no metadata will be used to describe the data.",
|
||||||
"extendedDescription": "FieldGroup Description",
|
"extendedDescription": "FieldGroup Description",
|
||||||
"viewStyle": "booleanDesicion"
|
"viewStyle": "booleanDesicion",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
@ -80,7 +93,12 @@ export const TestModel = {
|
||||||
"title": "Metadata standards",
|
"title": "Metadata standards",
|
||||||
"description": "The data will be described by metadata that follows the metadata standards described in <url1>, <url2>, ? The data will be described by metadata that follows the metadata schema described in <not-listed-url1>, <not-listed-url2>. The metadata will be stored in the service located at <metadata-repo-url>",
|
"description": "The data will be described by metadata that follows the metadata standards described in <url1>, <url2>, ? The data will be described by metadata that follows the metadata schema described in <not-listed-url1>, <not-listed-url2>. The metadata will be stored in the service located at <metadata-repo-url>",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "combobox"
|
"viewStyle": "combobox",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -92,7 +110,12 @@ export const TestModel = {
|
||||||
"title": "Not listed",
|
"title": "Not listed",
|
||||||
"description": "",
|
"description": "",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "checkBox"
|
"viewStyle": "checkBox",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -104,7 +127,12 @@ export const TestModel = {
|
||||||
"title": "Url",
|
"title": "Url",
|
||||||
"description": "URL to the description of the metadata scheme used",
|
"description": "URL to the description of the metadata scheme used",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "freetext"
|
"viewStyle": "freetext",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -116,7 +144,12 @@ export const TestModel = {
|
||||||
"title": "Comments",
|
"title": "Comments",
|
||||||
"description": "",
|
"description": "",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "freetext"
|
"viewStyle": "freetext",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}]
|
}]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -128,122 +161,18 @@ export const TestModel = {
|
||||||
"title": "The data will not be described by any metadata.",
|
"title": "The data will not be described by any metadata.",
|
||||||
"description": "",
|
"description": "",
|
||||||
"extendedDescription": "",
|
"extendedDescription": "",
|
||||||
"viewStyle": "checkBox"
|
"viewStyle": "checkBox",
|
||||||
|
"rule":[],
|
||||||
|
"multiplicity":{
|
||||||
|
"min":0,
|
||||||
|
"max":1
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "VocabulariesGroup",
|
|
||||||
"defaultVisibility": "true",
|
|
||||||
"page": "1",
|
|
||||||
"title": "Vocabularies",
|
|
||||||
"description": "Vocabularies",
|
|
||||||
"extendedDescription": "FieldGroup Description",
|
|
||||||
"compositeFields": [
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "useVocabulariesQ212",
|
|
||||||
"defaultVisibility": "true",
|
|
||||||
"title": "Q2.1.2 Will your metadata use standardised vocabularies?",
|
|
||||||
"description": "User selects from a drop-down list of existing standardised vocabularies or \"not listed\" or \"none\". There should be a \"comments\" fields for additional information. If \"not listed\" is selected the user is presented with two additional fields in which the user can put the URL to the new vocabulary along with a short description. The user should be allowed to select more than one option.",
|
|
||||||
"extendedDescription": "FieldGroup Description",
|
|
||||||
"viewStyle": "booleanDesicion"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "standardisedVocabulariesA212",
|
|
||||||
"defaultVisibility": "false",
|
|
||||||
"title": "Existing standardised vocabularies",
|
|
||||||
"description": "The metadata will make use of the standardised vocabulary <url>",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "combobox"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "notlistedVocabularyA212",
|
|
||||||
"defaultVisibility": "false",
|
|
||||||
"title": "Not listed vocabulary",
|
|
||||||
"description": "",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "checkBox"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "notlistedVocUrlA212",
|
|
||||||
"defaultVisibility": "false",
|
|
||||||
"title": "Vocabulary Url",
|
|
||||||
"description": "The user can put the URL to the new vocabulary",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "freetext"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "notlistedVocCommentA212",
|
|
||||||
"defaultVisibility": "false",
|
|
||||||
"title": "Comments",
|
|
||||||
"description": "Vocabulary short description",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "freetext"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "noMetadataVocabularyA212",
|
|
||||||
"defaultVisibility": "false",
|
|
||||||
"title": "The metadata will not make use of any vocabulary",
|
|
||||||
"description": "",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "checkBox"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": "FreeOfChargeGroup",
|
|
||||||
"defaultVisibility": "true",
|
|
||||||
"page": "1",
|
|
||||||
"title": "Metadata Available",
|
|
||||||
"description": "Metadata Available",
|
|
||||||
"extendedDescription": "FieldGroup Description",
|
|
||||||
"compositeFields": [
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "freeOfChargeGroupQ213",
|
|
||||||
"defaultVisibility": "true",
|
|
||||||
"title": "Q2.1.3 Will you use standardised formats for some or all of your data.",
|
|
||||||
"description": "User is presented with a choice of ?yes?, ?no?. There should be a ?comments? field for additional information.",
|
|
||||||
"extendedDescription": "Field Description",
|
|
||||||
"viewStyle": "booleanDesicion"
|
|
||||||
}]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"fields": [
|
|
||||||
{
|
|
||||||
"id": "freeOfChargeGroupCommentA213",
|
|
||||||
"defaultVisibility": "true",
|
|
||||||
"title": "Comments",
|
|
||||||
"description": "",
|
|
||||||
"extendedDescription": "",
|
|
||||||
"viewStyle": "freetext"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
Loading…
Reference in New Issue