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

Dataset Profile Editor. Move validators from tempate to models. (Fixing issue of form classified as valid when not all formcontrols are rendered.)

This commit is contained in:
Kristian Ntavidi 2021-03-27 19:52:53 +02:00
parent fdf316a040
commit 12f9e9ede9
17 changed files with 848 additions and 246 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-data/auto-complete-single-data.ts
View File

@ -1,7 +1,7 @@
import { FieldDataEditorModel } from './field-data-editor-model';
import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type';
import { FieldDataOptionEditorModel } from './field-data-option-editor-model';
import { FormGroup } from '@angular/forms';
import { FormGroup, Validators } from '@angular/forms';
import { AutoCompleteFieldData, AutoCompleteSingleData } from '@app/core/model/dataset-profile-definition/field-data/field-data';
export class AutoCompleteSingleDataEditorModel extends FieldDataEditorModel<AutoCompleteSingleDataEditorModel> {
@ -16,8 +16,8 @@ export class AutoCompleteSingleDataEditorModel extends FieldDataEditorModel<Auto
buildForm(disabled: boolean = false, skipDisable: Array<String> = []): FormGroup {
const formGroup = this.formBuilder.group({
label: [{ value: this.label, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.label')) }],
url: [{ value: this.url, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.url')) }],
optionsRoot: [{ value: this.optionsRoot, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.optionsRoot')) }],
url: [{ value: this.url, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.url')) },[Validators.required]],
optionsRoot: [{ value: this.optionsRoot, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.optionsRoot')) }, [Validators.required]],
autoCompleteType: [{ value: this.autoCompleteType, disabled: (disabled && !skipDisable.includes('AutoCompleteSingleDataEditorModel.autoCompleteType')) }]
});
formGroup.addControl('autoCompleteOptions', this.autoCompleteOptions.buildForm(disabled, skipDisable));

57
dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-editor-model.ts
View File

@ -27,6 +27,9 @@ import { ResearchersDataEditorModel } from './field-data/researchers-data-editor
import { OrganizationsDataEditorModel } from './field-data/organizations-data-editor-models';
import { DatasetIdentifierDataEditorModel } from './field-data/dataset-identifier-data-editor-models';
import { CurrencyDataEditorModel } from './field-data/currency-data-editor-models';
import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type';
import { EditorCustomValidators } from '../editor/custom-validators/editor-custom-validators';
import { ValidationDataEditorModel } from './field-data/validation-data-editor-models';
export class FieldEditorModel extends BaseFormModel {
@ -68,13 +71,14 @@ export class FieldEditorModel extends BaseFormModel {
if (this.viewStyle.renderStyle === 'datePicker') { this.data = new DatePickerDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'externalDatasets') { this.data = new ExternalDatasetsDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'dataRepositories') { this.data = new DataRepositoriesDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'registeries') { this.data = new RegistriesDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'registries') { this.data = new RegistriesDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'services') { this.data = new ServicesDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'tags') { this.data = new TagsDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'researchers') { this.data = new ResearchersDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'organizations') { this.data = new OrganizationsDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'datasetIdentifier') { this.data = new DatasetIdentifierDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'currency') { this.data = new CurrencyDataEditorModel().fromModel(item.data); }
if (this.viewStyle.renderStyle === 'validation') { this.data = new ValidationDataEditorModel().fromModel(item.data); }
}
}
return this;
@ -96,6 +100,57 @@ export class FieldEditorModel extends BaseFormModel {
if (this.data) { formGroup.addControl('data', this.data.buildForm(disabled, skipDisable)); }
else { formGroup.addControl('data', new WordListFieldDataEditorModel().buildForm(disabled, skipDisable)); }
// //append validators
this._appendCustomValidators(formGroup);
// //setting up listeners
// formGroup.get('viewStyle').valueChanges.subscribe(changes=>{
// // const viewStyleChanges:{cssClass:string, renderStyle: string} = changes;
// this._removeCustomValidators(formGroup);
// this._appendCustomValidators(formGroup);
// })
return formGroup;
}
private _appendCustomValidators(formGroup: FormGroup){
const renderStyleValue = formGroup.get('viewStyle').get('renderStyle').value;
if(renderStyleValue === 'checkBox'){
formGroup.get('defaultValue').get('value').setValidators(Validators.required);
formGroup.get('defaultValue').get('value').updateValueAndValidity();
}else if(renderStyleValue === 'combobox'){
try{
const comboType = formGroup.get('data').get('type').value;
if(comboType === DatasetProfileComboBoxType.Autocomplete){//As 'Other' in UI
formGroup.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
}else if(comboType === DatasetProfileComboBoxType.WordList){
formGroup.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
}
}catch(e){
console.error('Error setting validators.');
console.error(e);
}
}else if(renderStyleValue === 'radiobox'){
formGroup.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
}
formGroup.get('data').updateValueAndValidity();
}
// private _removeCustomValidators(formGroup:FormGroup){
// const renderStyleValue = formGroup.get('viewStyle').get('renderStyle').value;
// if(renderStyleValue != 'checkBox'){
// formGroup.get('defaultValue').get('value').clearValidators();
// }else if(renderStyleValue === 'combobox'){
// formGroup.get('data').clearValidators();
// }
// }
// private _buildData(formGroup: FormGroup){
// }
}

2
dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-set-editor-model.ts
View File

@ -35,7 +35,7 @@ export class FieldSetEditorModel extends BaseFormModel {
const formGroup = this.formBuilder.group({
id: [{ value: this.id, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.id')) }, [Validators.required, Validators.pattern('^[^<_>]+$')]],
ordinal: [{ value: this.ordinal, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.ordinal')) }],
title: [{ value: this.title, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.title')) }],
title: [{ value: this.title, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.title')) }, [Validators.required]],
description: [{ value: this.description, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.description')) }],
extendedDescription: [{ value: this.extendedDescription, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.extendedDescription')) }],
additionalInformation: [{ value: this.additionalInformation, disabled: (disabled && !skipDisable.includes('FieldSetEditorModel.additionalInformation')) }],

5
dmp-frontend/src/app/ui/admin/dataset-profile/admin/section-editor-model.ts
View File

@ -1,6 +1,7 @@
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { Section } from '../../../../core/model/admin/dataset-profile/dataset-profile';
import { BaseFormModel } from '../../../../core/model/base-form-model';
import { EditorCustomValidators } from '../editor/custom-validators/editor-custom-validators';
import { FieldSetEditorModel } from './field-set-editor-model';
export class SectionEditorModel extends BaseFormModel {
@ -29,7 +30,7 @@ export class SectionEditorModel extends BaseFormModel {
const formGroup: FormGroup = new FormBuilder().group({
id: [{ value: this.id, disabled: (disabled && !skipDisable.includes('SectionEditorModel.id')) }, [Validators.required, Validators.pattern('^[^<_>]+$')]],
page: [{ value: this.page, disabled: (disabled && !skipDisable.includes('SectionEditorModel.page')) }, [Validators.required]],
title: [{ value: this.title, disabled: (disabled && !skipDisable.includes('SectionEditorModel.title')) }],
title: [{ value: this.title, disabled: (disabled && !skipDisable.includes('SectionEditorModel.title')) } , [Validators.required]],
description: [{ value: this.description, disabled: (disabled && !skipDisable.includes('SectionEditorModel.description')) }],
ordinal: [{ value: this.ordinal, disabled: (disabled && !skipDisable.includes('SectionEditorModel.ordinal')) }, [Validators.required]],
defaultVisibility: [{ value: this.defaultVisibility, disabled: (disabled && !skipDisable.includes('SectionEditorModel.defaultVisibility')) }]
@ -53,6 +54,8 @@ export class SectionEditorModel extends BaseFormModel {
if (!formGroup.controls['defaultVisibility'].value) { formGroup.controls['defaultVisibility'].setValue(true); }
formGroup.setValidators(EditorCustomValidators.sectionHasAtLeastOneChildOf('fieldSets','sections'));
formGroup.updateValueAndValidity();
return formGroup;
}
}

2
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html
View File

@ -72,7 +72,7 @@
<!-- [appearance]="titleControl.focused? 'legacy':'none'" floatLabel="never" -->
<mat-form-field class="col field-title" [appearance]="'none'" floatLabel="never">
<input matInput type="text" placeholder="Title" #titleControl="matInput"
[formControl]="this.form.get('title')" required>
[formControl]="this.form.get('title')">
</mat-form-field>
</div>
</div>

391
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts
View File

@ -33,6 +33,10 @@ import { ValidationDataEditorModel } from '../../../admin/field-data/validation-
import { DatasetProfileService } from '@app/core/services/dataset-profile/dataset-profile.service';
import { OrganizationsDataEditorModel } from '../../../admin/field-data/organizations-data-editor-models';
import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators';
import { Field } from '@app/core/model/admin/dataset-profile/dataset-profile';
import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type';
import { DatasetProfileInternalDmpEntitiesType } from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type';
import { AutoCompleteFieldData, BooleanDecisionFieldData, CheckBoxFieldData, CurrencyFieldData, DataRepositoriesFieldData, DatasetIdentifierFieldData, DatePickerFieldData, DmpsAutoCompleteFieldData, ExternalDatasetsFieldData, FreeTextFieldData, OrganizationsFieldData, RadioBoxFieldData, RegistriesFieldData, ResearchersAutoCompleteFieldData, ServicesFieldData, TagsFieldData, TextAreaFieldData, ValidationFieldData, WordListFieldData } from '@app/core/model/dataset-profile-definition/field-data/field-data';
@Component({
selector: 'app-dataset-profile-editor-composite-field-component',
@ -330,119 +334,352 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit, OnCh
addNewInput(type: ViewStyleType){
const fieldsArray = this.form.get('fields') as FormArray;
let targetOrdinal = fieldsArray.length;
try{
targetOrdinal = fieldsArray.controls.map(control=> control.get('ordinal').value).reduce((a,b)=>Math.max(a,b));
}catch{
}
const field: FieldEditorModel = new FieldEditorModel();
field.id=Guid.create().toString();
field.ordinal = (this.form.get('fields') as FormArray).length;
const field = {
id: Guid.create().toString(),
ordinal: targetOrdinal,
visible:{rules:[],style:null},
validations:[],
viewStyle:{}
const fieldForm = field.buildForm();
} as Field;
// const field: FieldEditorModel = new FieldEditorModel();
// field.id=Guid.create().toString();
// field.ordinal = (this.form.get('fields') as FormArray).length;
// const fieldForm = field.buildForm();
// fieldForm.setValidators(this.customFieldValidator());
// fieldForm.get('viewStyle').get('renderStyle').setValidators(Validators.required);
if (fieldForm.get('data')) {
fieldForm.removeControl('data');
}
// if (fieldForm.get('data')) {
// fieldForm.removeControl('data');
// }
switch (type) {
case this.viewTypeEnum.BooleanDecision:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision)
fieldForm.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.CheckBox:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox)
fieldForm.addControl('data', new CheckBoxFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Select:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
fieldForm.addControl('data', new WordListFieldDataEditorModel().buildForm());
case this.viewTypeEnum.BooleanDecision:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision)
// fieldForm.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm());
fieldForm.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('options'));
fieldForm.get('data').updateValueAndValidity();
break;
case this.viewTypeEnum.Other:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
fieldForm.addControl('data', new AutoCompleteFieldDataEditorModel().buildForm()); //TODO SEE
const data: BooleanDecisionFieldData = {
label:''
}
fieldForm.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
fieldForm.get('data').updateValueAndValidity();
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.BooleanDecision;
field.data = data;
break;
case this.viewTypeEnum.InternalDmpEntities:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities)
fieldForm.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE
}
case this.viewTypeEnum.CheckBox:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox)
// fieldForm.addControl('data', new CheckBoxFieldDataEditorModel().buildForm());
const data: CheckBoxFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.CheckBox;
field.data = data;
break;
case this.viewTypeEnum.FreeText:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText)
fieldForm.addControl('data', new FreeTextFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.RadioBox:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox)
fieldForm.addControl('data', new RadioBoxFieldDataEditorModel().buildForm());
fieldForm.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('options'));
fieldForm.get('data').updateValueAndValidity();
}
case this.viewTypeEnum.Select:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
// fieldForm.addControl('data', new WordListFieldDataEditorModel().buildForm());
// fieldForm.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
// fieldForm.get('data').updateValueAndValidity();
const data:WordListFieldData = {
label:'',
multiList:false,
options:[],
type:DatasetProfileComboBoxType.WordList
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ComboBox;
field.data = data;
break;
case this.viewTypeEnum.TextArea:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea)
fieldForm.addControl('data', new TextAreaFieldDataEditorModel().buildForm());
}
case this.viewTypeEnum.Other:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
// fieldForm.addControl('data', new AutoCompleteFieldDataEditorModel().buildForm()); //TODO SEE
// fieldForm.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
// fieldForm.get('data').updateValueAndValidity();
const data: AutoCompleteFieldData = {
autoCompleteSingleDataList:[],
multiAutoComplete: false,
label:'',
type: DatasetProfileComboBoxType.Autocomplete
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ComboBox;
field.data = data;
break;
case this.viewTypeEnum.DatePicker:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker)
fieldForm.addControl('data', new DatePickerDataEditorModel().buildForm());
}case this.viewTypeEnum.InternalDmpEntities:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities)
// fieldForm.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE
const data: DmpsAutoCompleteFieldData = {
label:'',
multiAutoComplete: false,
type: DatasetProfileInternalDmpEntitiesType.Dmps
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.InternalDmpEntities;
field.data = data;
break;
case this.viewTypeEnum.ExternalDatasets:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets)
fieldForm.addControl('data', new ExternalDatasetsDataEditorModel().buildForm());
}
case this.viewTypeEnum.FreeText:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText)
// fieldForm.addControl('data', new FreeTextFieldDataEditorModel().buildForm());
const data: FreeTextFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.FreeText;
field.data = data;
break;
case this.viewTypeEnum.DataRepositories:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories)
fieldForm.addControl('data', new DataRepositoriesDataEditorModel().buildForm());
}
case this.viewTypeEnum.RadioBox:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox)
// fieldForm.addControl('data', new RadioBoxFieldDataEditorModel().buildForm());
// fieldForm.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
// fieldForm.get('data').updateValueAndValidity();
const data: RadioBoxFieldData= {
label:'',
options: []
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.RadioBox;
field.data = data;
break;
case this.viewTypeEnum.Registries:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries)
fieldForm.addControl('data', new RegistriesDataEditorModel().buildForm());
}
case this.viewTypeEnum.TextArea:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea)
// fieldForm.addControl('data', new TextAreaFieldDataEditorModel().buildForm());
const data: TextAreaFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.TextArea;
field.data = data;
break;
case this.viewTypeEnum.Services:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services)
fieldForm.addControl('data', new ServicesDataEditorModel().buildForm());
}
case this.viewTypeEnum.DatePicker:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker)
// fieldForm.addControl('data', new DatePickerDataEditorModel().buildForm());
const data: DatePickerFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatePicker;
break;
case this.viewTypeEnum.Tags:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags)
fieldForm.addControl('data', new TagsDataEditorModel().buildForm());
}
case this.viewTypeEnum.ExternalDatasets:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets)
// fieldForm.addControl('data', new ExternalDatasetsDataEditorModel().buildForm());
const data: ExternalDatasetsFieldData = {
label:'',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ExternalDatasets;
field.data = data;
break;
case this.viewTypeEnum.Researchers:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers)
}
case this.viewTypeEnum.DataRepositories:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories)
// fieldForm.addControl('data', new DataRepositoriesDataEditorModel().buildForm());
const data: DataRepositoriesFieldData = {
label: '',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DataRepositories;
field.data = data;
break;
}
case this.viewTypeEnum.Registries:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries)
// fieldForm.addControl('data', new RegistriesDataEditorModel().buildForm());
const data:RegistriesFieldData = {
label: '',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Registries;
field.data = data;
break;
}
case this.viewTypeEnum.Services:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services)
// fieldForm.addControl('data', new ServicesDataEditorModel().buildForm());
const data:ServicesFieldData = {
label:'',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Services;
field.data = data;
break;
}
case this.viewTypeEnum.Tags:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags)
// fieldForm.addControl('data', new TagsDataEditorModel().buildForm());
const data: TagsFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Tags;
field.data = data;
break;
}
case this.viewTypeEnum.Researchers:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers)
// this.form.addControl('data', new ResearchersDataEditorModel().buildForm()); //TODO TO ASK
fieldForm.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());
// fieldForm.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());
// field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Researchers;
const data : ResearchersAutoCompleteFieldData = {
label:'',
multiAutoComplete: false,
type: DatasetProfileInternalDmpEntitiesType.Researchers
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.InternalDmpEntities;
field.data = data;
break;
case this.viewTypeEnum.Organizations:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations)
fieldForm.addControl('data', new OrganizationsDataEditorModel().buildForm());
}
case this.viewTypeEnum.Organizations:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations)
// fieldForm.addControl('data', new OrganizationsDataEditorModel().buildForm());
// this.form.addControl('data', new OrganizationsDataEditorModel().buildForm())
// fieldForm.addControl('data', new DatasetsAutoCompleteFieldDataEditorModel().buildForm()); //TODO
const data = {
autoCompleteSingleDataList:[],
label:'',
multiAutoComplete: false,
} as OrganizationsFieldData; //TODO
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Organizations;
field.data = data;
break;
case this.viewTypeEnum.DatasetIdentifier:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier)
fieldForm.addControl('data', new DatasetIdentifierDataEditorModel().buildForm());
}
case this.viewTypeEnum.DatasetIdentifier:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier)
// fieldForm.addControl('data', new DatasetIdentifierDataEditorModel().buildForm());
const data : DatasetIdentifierFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatasetIdentifier;
field.data = data;
break;
case this.viewTypeEnum.Currency:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency)
fieldForm.addControl('data', new CurrencyDataEditorModel().buildForm());
}
case this.viewTypeEnum.Currency:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency)
// fieldForm.addControl('data', new CurrencyDataEditorModel().buildForm());
const data: CurrencyFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Currency;
field.data = data;
break;
case this.viewTypeEnum.Validation:
fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation)
fieldForm.addControl('data', new ValidationDataEditorModel().buildForm());
}
case this.viewTypeEnum.Validation:{
// fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation)
// fieldForm.addControl('data', new ValidationDataEditorModel().buildForm());
const data:ValidationFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Validation;
field.data = data;
break;
}
}
(<FormArray>this.form.get('fields')).push(fieldForm);
(<FormArray>this.form.get('fields')).push(new FieldEditorModel().fromModel(field).buildForm());
fieldForm.get('viewStyle').get('renderStyle').updateValueAndValidity();
fieldForm.get('data').updateValueAndValidity();
// fieldForm.get('viewStyle').get('renderStyle').updateValueAndValidity();
// fieldForm.get('data').updateValueAndValidity();
}

14
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.html
View File

@ -2,7 +2,7 @@
<!-- BooleanDecision -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.BooleanDecision">
<mat-label>{{placeHolder}}</mat-label>
<mat-select [formControl]="form" [placeholder]="placeHolder" [required]="required">
<mat-select [formControl]="form" [placeholder]="placeHolder">
<mat-option [value]="null">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' |
translate}}</mat-option>
<mat-option [value]="'true'">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.BOOLEAN-DECISION.YES'
@ -18,7 +18,7 @@
<!-- CheckBox -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.CheckBox">
<mat-label>{{placeHolder}}</mat-label>
<mat-select [formControl]="form" [placeholder]="placeHolder" [required]="required">
<mat-select [formControl]="form" [placeholder]="placeHolder" >
<mat-option [value]="'true'">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.CHECK-BOX.CHECKED' | translate}}</mat-option>
<mat-option [value]="'false'">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.CHECK-BOX.UNCHECKED' | translate}}</mat-option>
</mat-select>
@ -32,7 +32,7 @@
</mat-form-field> -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.ComboBox && comboBoxType === comboBoxTypeEnum.WordList">
<mat-label>{{placeHolder}}</mat-label>
<mat-select [formControl]="form" [placeholder]="placeHolder" [required]="required">
<mat-select [formControl]="form" [placeholder]="placeHolder" >
<mat-option [value]="null">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate }}</mat-option>
<mat-option *ngFor="let opt of formArrayOptions['controls']" [value]="opt.get('value').value">{{opt.get('label').value}}</mat-option>
</mat-select>
@ -56,14 +56,14 @@
<!-- FreeText -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.FreeText">
<mat-label>{{placeHolder}}</mat-label>
<input matInput type="text" [placeholder]="placeHolder" [formControl]="form" [required]="required">
<input matInput type="text" [placeholder]="placeHolder" [formControl]="form" >
<mat-error *ngIf="form.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<!-- RadioBox -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.RadioBox">
<mat-label>{{placeHolder}}</mat-label>
<mat-select [formControl]="form" [placeholder]="placeHolder" [required]="required">
<mat-select [formControl]="form" [placeholder]="placeHolder" >
<mat-option [value]="null">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate}}</mat-option>
<mat-option *ngFor="let opt of formArrayOptions['controls']" [value]="opt.get('value').value">{{opt.get('label').value}}</mat-option>
</mat-select>
@ -73,7 +73,7 @@
<!-- TextArea -->
<mat-form-field class="col-md-12" *ngIf="viewStyle === viewStyleEnum.TextArea">
<mat-label>{{placeHolder}}</mat-label>
<input matInput type="text" [placeholder]="placeHolder" [formControl]="form" [required]="required">
<input matInput type="text" [placeholder]="placeHolder" [formControl]="form">
<mat-error *ngIf="form.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
@ -81,7 +81,7 @@
<mat-form-field class="col-12" *ngIf="viewStyle === viewStyleEnum.DatePicker">
<!--(focus)="date.open()" (click)="date.open()"-->
<mat-label>{{placeHolder}}</mat-label>
<input matInput [placeholder]="placeHolder" class="table-input" [matDatepicker]="date" [formControl]="form" [required]="required">
<input matInput [placeholder]="placeHolder" class="table-input" [matDatepicker]="date" [formControl]="form" >
<mat-datepicker-toggle matSuffix [for]="date"></mat-datepicker-toggle>
<mat-datepicker #date></mat-datepicker>
<mat-error *ngIf="form.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}

2
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.ts
View File

@ -17,7 +17,7 @@ export class DatasetProfileEditorDefaultValueComponent implements OnInit {
@Input() comboBoxType: DatasetProfileComboBoxType;
@Input() internalDmpEntitiesType: DatasetProfileInternalDmpEntitiesType;
@Input() placeHolder: String;
@Input() required: Boolean;
// @Input() required: Boolean;
comboBoxTypeEnum = DatasetProfileComboBoxType;
internalDmpEntitiesTypeEnum = DatasetProfileInternalDmpEntitiesType;

14
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field-type/auto-complete/dataset-profile-editor-auto-complete-field.component.html
View File

@ -47,24 +47,28 @@
<mat-form-field class="col-md-12">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-URL' | translate}}</mat-label>
<input matInput [formControl]="this.singleForm.get('url')" required>
<input matInput [formControl]="singleForm.get('url')">
<mat-error *ngIf="singleForm.get('url').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-md-3">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-OPTIONS-ROOT' | translate}}</mat-label>
<input matInput
[formControl]="this.singleForm.get('optionsRoot')" required>
[formControl]="singleForm.get('optionsRoot')">
<mat-error *ngIf="singleForm.get('optionsRoot').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-md-3">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-LABEL' | translate}}</mat-label>
<input matInput [formControl]="this.singleForm.get('autoCompleteOptions').get('label')">
<input matInput [formControl]="singleForm.get('autoCompleteOptions').get('label')">
<mat-error *ngIf="singleForm.get('autoCompleteOptions').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-md-3">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-VALUE' | translate}}</mat-label>
<input matInput [formControl]="this.singleForm.get('autoCompleteOptions').get('value')">
<input matInput [formControl]="singleForm.get('autoCompleteOptions').get('value')">
</mat-form-field>
<mat-form-field class="col-md-3">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-SOURCE' | translate}}</mat-label>
<input matInput [formControl]="this.singleForm.get('autoCompleteOptions').get('source')">
<input matInput [formControl]="singleForm.get('autoCompleteOptions').get('source')">
<mat-error *ngIf="singleForm.get('autoCompleteOptions').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<button mat-button type="button" (click)="removeSource(i)"><mat-icon>delete</mat-icon></button>
</div>

4
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html
View File

@ -140,7 +140,7 @@
<app-component-profile-editor-default-value-component *ngIf="form.get('viewStyle').get('renderStyle').value" class="col-12"
[viewStyle]="form.get('viewStyle').get('renderStyle').value" [form]="this.form.get('defaultValue').get('value')" [formArrayOptions]="form.get('data')?.get('options')"
[comboBoxType]="this.form.get('data')?.get('type')?.value" [internalDmpEntitiesType]="this.form.get('data')?.get('type')?.value"
placeHolder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.DEFAULT-VALUE' | translate}}" [required]="defaulValueRequired(form.get('viewStyle').get('renderStyle').value)">
placeHolder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.DEFAULT-VALUE' | translate}}">
</app-component-profile-editor-default-value-component>
</div>
@ -224,4 +224,4 @@
</ng-container>
<!-- {{form.touched|json}} -->
<!-- {{form.value |json}} -->
<!-- {{form.value |json}} -->

504
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts
View File

@ -37,6 +37,10 @@ import { Guid } from '@common/types/guid';
import { ErrorStateMatcher, MatSlideToggleChange } from '@angular/material';
import { DefaultValueEditorModel } from '../../../admin/default-value-editor-model';
import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators';
import { Field } from '@app/core/model/admin/dataset-profile/dataset-profile';
import { DatasetProfileInternalDmpEntitiesType } from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type';
import { FieldEditorModel } from '../../../admin/field-editor-model';
import { AutoCompleteFieldData, BooleanDecisionFieldData, CheckBoxFieldData, CurrencyFieldData, DataRepositoriesFieldData, DatasetIdentifierFieldData, DatePickerFieldData, DmpsAutoCompleteFieldData, ExternalDatasetsFieldData, FreeTextFieldData, OrganizationsFieldData, RadioBoxFieldData, RegistriesFieldData, ResearchersAutoCompleteFieldData, ServicesFieldData, TagsFieldData, TextAreaFieldData, ValidationFieldData, WordListFieldData } from '@app/core/model/dataset-profile-definition/field-data/field-data';
@Component({
selector: 'app-dataset-profile-editor-field-component',
@ -87,7 +91,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
this.showPreview = true;
// if (this.form.get('multiplicity')) {
// if (this.form.get('multiplicity').value.min > 1 && this.form.get('multiplicity').value.max > 1) {
// this.isFieldMultiplicityEnabled = true;
@ -146,7 +150,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
this.viewType = this.viewTypeEnum.Tags;
break;
case DatasetProfileFieldViewStyle.Researchers:
this.viewType = this.viewTypeEnum.Researchers;
this.viewType = this.viewTypeEnum.Researchers; //TODO RESEARCHERS
break;
case DatasetProfileFieldViewStyle.Organizations:
this.viewType = this.viewTypeEnum.Organizations;
@ -164,6 +168,8 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
}
this.showPreview = true;
@ -246,32 +252,32 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
// });
}
defaulValueRequired(viewStile: DatasetProfileFieldViewStyle): boolean {
switch (viewStile) {
case DatasetProfileFieldViewStyle.CheckBox:
return true;
case DatasetProfileFieldViewStyle.RadioBox:
case DatasetProfileFieldViewStyle.TextArea:
case DatasetProfileFieldViewStyle.FreeText:
case DatasetProfileFieldViewStyle.ComboBox:
case DatasetProfileFieldViewStyle.InternalDmpEntities:
case DatasetProfileFieldViewStyle.BooleanDecision:
case DatasetProfileFieldViewStyle.DatePicker:
case DatasetProfileFieldViewStyle.ExternalDatasets:
case DatasetProfileFieldViewStyle.DataRepositories:
case DatasetProfileFieldViewStyle.Registries:
case DatasetProfileFieldViewStyle.Services:
case DatasetProfileFieldViewStyle.Tags:
case DatasetProfileFieldViewStyle.Registries:
case DatasetProfileFieldViewStyle.Organizations:
case DatasetProfileFieldViewStyle.DatasetIdentifier:
case DatasetProfileFieldViewStyle.Currency:
case DatasetProfileFieldViewStyle.Validation:
return false;
default:
return false;
}
}
// defaulValueRequired(viewStile: DatasetProfileFieldViewStyle): boolean {
// switch (viewStile) {
// case DatasetProfileFieldViewStyle.CheckBox:
// return true;
// case DatasetProfileFieldViewStyle.RadioBox:
// case DatasetProfileFieldViewStyle.TextArea:
// case DatasetProfileFieldViewStyle.FreeText:
// case DatasetProfileFieldViewStyle.ComboBox:
// case DatasetProfileFieldViewStyle.InternalDmpEntities:
// case DatasetProfileFieldViewStyle.BooleanDecision:
// case DatasetProfileFieldViewStyle.DatePicker:
// case DatasetProfileFieldViewStyle.ExternalDatasets:
// case DatasetProfileFieldViewStyle.DataRepositories:
// case DatasetProfileFieldViewStyle.Registries:
// case DatasetProfileFieldViewStyle.Services:
// case DatasetProfileFieldViewStyle.Tags:
// case DatasetProfileFieldViewStyle.Registries:
// case DatasetProfileFieldViewStyle.Organizations:
// case DatasetProfileFieldViewStyle.DatasetIdentifier:
// case DatasetProfileFieldViewStyle.Currency:
// case DatasetProfileFieldViewStyle.Validation:
// return false;
// default:
// return false;
// }
// }
@ -351,7 +357,11 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
// if(this.form.get('viewStyle').get('renderStyle').value == DatasetProfileFieldViewStyle.Researchers){
// fieldEditorModel.data = new ResearchersAutoCompleteFieldDataEditorModel().buildForm().getRawValue();
// }
if(fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Validation || (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.DatasetIdentifier)
|| (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Tags)
){
fieldEditorModel.value = null;
}
// const myTicket = Guid.create().toString();
// this.validTicket = myTicket;
@ -403,111 +413,362 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
this.showPreview = false;
if (this.form.get('data')) {
this.form.removeControl('data');
}
this.form.removeControl('defaultValue');
const defaultValueModel = new DefaultValueEditorModel();
this.form.addControl('defaultValue',defaultValueModel.buildForm());
const field: Field = this.form.getRawValue();
field.defaultValue = {type:null, value: null};
// if (this.form.get('data')) {
// this.form.removeControl('data');
// }
// this.form.removeControl('defaultValue');
// const defaultValueModel = new DefaultValueEditorModel();
// this.form.addControl('defaultValue',defaultValueModel.buildForm());
switch (x) {
case this.viewTypeEnum.BooleanDecision:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision)
this.form.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.CheckBox:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox)
this.form.addControl('data', new CheckBoxFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Select:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
this.form.addControl('data', new WordListFieldDataEditorModel().buildForm());
case this.viewTypeEnum.BooleanDecision:{
this.form.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('options'));
this.form.get('data').updateValueAndValidity();
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision)
// this.form.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm());
const data: BooleanDecisionFieldData = {
label:""
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.BooleanDecision;
field.data = data;
break;
case this.viewTypeEnum.Other:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
this.form.addControl('data', new AutoCompleteFieldDataEditorModel().buildForm()); //TODO SEE
}
case this.viewTypeEnum.CheckBox:{
this.form.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
this.form.get('data').updateValueAndValidity();
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox)
// this.form.addControl('data', new CheckBoxFieldDataEditorModel().buildForm());
const data: CheckBoxFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.CheckBox;
field.data = data;
break;
}
case this.viewTypeEnum.Select:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
// this.form.addControl('data', new WordListFieldDataEditorModel().buildForm());
// this.form.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
// this.form.get('data').updateValueAndValidity();
const data:WordListFieldData = {
label:'',
multiList:false,
options:[],
type:DatasetProfileComboBoxType.WordList
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ComboBox;
field.data = data;
break;
}
case this.viewTypeEnum.Other:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox)
// this.form.addControl('data', new AutoCompleteFieldDataEditorModel().buildForm()); //TODO SEE
// this.form.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
// this.form.get('data').updateValueAndValidity();
const data: AutoCompleteFieldData = {
autoCompleteSingleDataList:[],
multiAutoComplete: false,
label:'',
type: DatasetProfileComboBoxType.Autocomplete
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ComboBox;
field.data = data;
break;
}
case this.viewTypeEnum.InternalDmpEntities:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities)
// this.form.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE
const data: DmpsAutoCompleteFieldData = {
label:'',
multiAutoComplete: false,
type: DatasetProfileInternalDmpEntitiesType.Dmps
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.InternalDmpEntities;
field.data = data;
break;
}
case this.viewTypeEnum.FreeText:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText)
// this.form.addControl('data', new FreeTextFieldDataEditorModel().buildForm());
const data: FreeTextFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.FreeText;
field.data = data;
break;
}
case this.viewTypeEnum.RadioBox:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox)
// this.form.addControl('data', new RadioBoxFieldDataEditorModel().buildForm());
// this.form.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
// this.form.get('data').updateValueAndValidity();
const data: RadioBoxFieldData= {
label:'',
options: []
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.RadioBox;
field.data = data;
break;
}
case this.viewTypeEnum.TextArea:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea)
// this.form.addControl('data', new TextAreaFieldDataEditorModel().buildForm());
const data: TextAreaFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.TextArea;
field.data = data;
break;
}
case this.viewTypeEnum.DatePicker:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker)
// this.form.addControl('data', new DatePickerDataEditorModel().buildForm());
const data: DatePickerFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatePicker;
field.data = data;
break;
}
case this.viewTypeEnum.ExternalDatasets:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets)
// this.form.addControl('data', new ExternalDatasetsDataEditorModel().buildForm());
const data: ExternalDatasetsFieldData = {
label:'',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ExternalDatasets;
field.data = data;
break;
}
case this.viewTypeEnum.DataRepositories:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories)
// this.form.addControl('data', new DataRepositoriesDataEditorModel().buildForm());
const data: DataRepositoriesFieldData = {
label: '',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DataRepositories;
field.data = data;
break;
}
case this.viewTypeEnum.Registries:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries)
// this.form.addControl('data', new RegistriesDataEditorModel().buildForm());
const data:RegistriesFieldData = {
label: '',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Registries;
field.data = data;
break;
}
case this.viewTypeEnum.Services:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services)
// this.form.addControl('data', new ServicesDataEditorModel().buildForm());
const data:ServicesFieldData = {
label:'',
multiAutoComplete: false
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Services;
field.data = data;
break;
}
case this.viewTypeEnum.Tags:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags)
// this.form.addControl('data', new TagsDataEditorModel().buildForm());
const data: TagsFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Tags;
field.data = data;
break;
}
case this.viewTypeEnum.Researchers:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers)
// // this.form.addControl('data', new ResearchersDataEditorModel().buildForm()); //TODO TO ASK
// this.form.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());
// field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Researchers;
const data : ResearchersAutoCompleteFieldData = {
label:'',
multiAutoComplete: false,
type: DatasetProfileInternalDmpEntitiesType.Researchers
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.InternalDmpEntities;
field.data = data;
break;
case this.viewTypeEnum.InternalDmpEntities:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities)
this.form.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE
break;
case this.viewTypeEnum.FreeText:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText)
this.form.addControl('data', new FreeTextFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.RadioBox:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox)
this.form.addControl('data', new RadioBoxFieldDataEditorModel().buildForm());
}
case this.viewTypeEnum.Organizations:{
this.form.get('data').setValidators(this.myCustomValidators.atLeastOneElementListValidator('options'));
this.form.get('data').updateValueAndValidity();
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations)
// this.form.addControl('data', new OrganizationsDataEditorModel().buildForm());
const data = {
autoCompleteSingleDataList:[],
label:'',
multiAutoComplete: false,
} as OrganizationsFieldData; //TODO
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Organizations;
field.data = data;
break;
case this.viewTypeEnum.TextArea:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea)
this.form.addControl('data', new TextAreaFieldDataEditorModel().buildForm());
}
case this.viewTypeEnum.DatasetIdentifier:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier)
// this.form.addControl('data', new DatasetIdentifierDataEditorModel().buildForm());
const data : DatasetIdentifierFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatasetIdentifier;
field.data = data;
break;
case this.viewTypeEnum.DatePicker:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker)
this.form.addControl('data', new DatePickerDataEditorModel().buildForm());
}
case this.viewTypeEnum.Currency:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency)
// this.form.addControl('data', new CurrencyDataEditorModel().buildForm());
const data: CurrencyFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Currency;
field.data = data;
break;
case this.viewTypeEnum.ExternalDatasets:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets)
this.form.addControl('data', new ExternalDatasetsDataEditorModel().buildForm());
break;
case this.viewTypeEnum.DataRepositories:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories)
this.form.addControl('data', new DataRepositoriesDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Registries:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries)
this.form.addControl('data', new RegistriesDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Services:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services)
this.form.addControl('data', new ServicesDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Tags:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags)
this.form.addControl('data', new TagsDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Researchers:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers)
// this.form.addControl('data', new ResearchersDataEditorModel().buildForm()); //TODO TO ASK
this.form.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Organizations:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations)
this.form.addControl('data', new OrganizationsDataEditorModel().buildForm());
break;
case this.viewTypeEnum.DatasetIdentifier:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier)
this.form.addControl('data', new DatasetIdentifierDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Currency:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency)
this.form.addControl('data', new CurrencyDataEditorModel().buildForm());
break;
case this.viewTypeEnum.Validation:
this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation)
this.form.addControl('data', new ValidationDataEditorModel().buildForm());
}
case this.viewTypeEnum.Validation:{
// this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation)
// this.form.addControl('data', new ValidationDataEditorModel().buildForm());
const data:ValidationFieldData = {
label:''
}
field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Validation;
field.data = data;
break;
}
}
// this.form.get('data').updateValueAndValidity();
// this.form.get('viewStyle').get('renderStyle').updateValueAndValidity();
// this.form.updateValueAndValidity();
const form = (new FieldEditorModel).fromModel(field).buildForm();
const fields = this.form.parent as FormArray;
let index = -1;
fields.controls.forEach((control,i)=>{
if(this.form.get('id').value === control.get('id').value){
index = i
}
});
if(index>=0){
fields.removeAt(index);
fields.insert(index, form);
this.form = form;
}
this.form.get('data').updateValueAndValidity();
this.form.get('viewStyle').get('renderStyle').updateValueAndValidity();
this.form.updateValueAndValidity();
setTimeout(() => { //TODO
this.showPreview = true;
});
@ -549,17 +810,4 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
onDelete(){
this.delete.emit();
}
// private _atLeastOneElementListValidator(arrayToCheck): ValidatorFn{
// return (control: AbstractControl): ValidationErrors | null=>{
// const fa = control.get(arrayToCheck) as FormArray;
// if(fa.length === 0){
// return {emptyArray: true};
// }
// return null;
// }
// }
}

4
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts
View File

@ -48,9 +48,9 @@ export class DatasetProfileEditorSectionFieldSetComponent implements OnInit, OnC
this.dragulaService.createGroup(this.FIELDSETS,{
moves:(el, container, handle)=>{
if(this.viewOnly) return false;
// if(this.viewOnly) return false; //uncomment if want to unable drag n drop in viewonly mode
if(el.id != (this.idprefix+this.tocentry.id)) return false;
if(handle.className.includes('handle')) return true;
if(handle.className && handle.classList.contains('handle')) return true;
return false;
}
});

2
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html
View File

@ -13,7 +13,7 @@
<div class="hint col-12">{{'DATASET-PROFILE-EDITOR.STEPS.SECTION-INFO.SECTION-NAME-HINT' | translate}}</div>
<mat-form-field class="col-12">
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.TITLE' | translate}}"
formControlName="title" required>
formControlName="title">
<mat-error >{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<!-- <mat-form-field class="col-md-3">

8
dmp-frontend/src/app/ui/admin/dataset-profile/editor/custom-validators/editor-custom-validators.ts
View File

@ -4,18 +4,18 @@ import { AbstractControl, FormArray, ValidationErrors, ValidatorFn } from "@angu
export class EditorCustomValidators{
public atLeastOneElementListValidator(arrayToCheck): ValidatorFn{
static atLeastOneElementListValidator(arrayToCheck): ValidatorFn{
return (control: AbstractControl): ValidationErrors | null=>{
const fa = control.get(arrayToCheck) as FormArray;
if(fa.length === 0){
if(!fa || fa.length === 0){
return {[EditorCustomValidatorsEnum.emptyArray]: true};
}
return null;
}
}
public pagesHaveAtLeastOneSection(pagesArrayName:string,sectionsArrayName:string ): ValidatorFn{
static pagesHaveAtLeastOneSection(pagesArrayName:string,sectionsArrayName:string ): ValidatorFn{
return (control: AbstractControl): ValidationErrors | null=>{
@ -38,7 +38,7 @@ export class EditorCustomValidators{
}
}
public sectionHasAtLeastOneChildOf(fieldsetsArrayName, sectionsArrayName): ValidatorFn{
static sectionHasAtLeastOneChildOf(fieldsetsArrayName, sectionsArrayName): ValidatorFn{
return (control: AbstractControl): ValidationErrors | null=>{

5
dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor-model.ts
View File

@ -3,6 +3,7 @@ import { DatasetProfile } from '../../../../core/model/admin/dataset-profile/dat
import { BaseFormModel } from '../../../../core/model/base-form-model';
import { PageEditorModel } from '../admin/page-editor-model';
import { SectionEditorModel } from '../admin/section-editor-model';
import { EditorCustomValidators } from './custom-validators/editor-custom-validators';
export class DatasetProfileEditorModel extends BaseFormModel {
@ -48,6 +49,10 @@ export class DatasetProfileEditorModel extends BaseFormModel {
pagesFormArray.push(form);
});
formGroup.addControl('pages', this.formBuilder.array(pagesFormArray));
formGroup.setValidators([EditorCustomValidators.atLeastOneElementListValidator('pages'), EditorCustomValidators.pagesHaveAtLeastOneSection('pages','sections')]);
formGroup.updateValueAndValidity();
return formGroup;
}
}

12
dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
View File

@ -128,7 +128,7 @@
<div class="hint">{{'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-NAME-HINT'| translate}}</div>
<mat-form-field class="full-width basic-info-input">
<input matInput [formControl]="form.get('label')"
placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-TITLE' | translate}}" required>
placeholder="{{'DATASET-PROFILE-EDITOR.FIELDS.DATASET-TITLE' | translate}}">
<mat-error *ngIf="form.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' |
translate}}
</mat-error>
@ -140,7 +140,7 @@
<div class="hint">{{'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-DESCRIPTION-HINT'| translate}}</div>
<mat-form-field class="full-width basic-info-input">
<textarea matInput [formControl]="form.get('description')" cdkTextareaAutosize cdkAutosizeMinRows="4" cdkAutosizeMaxRows="5"
placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER'| translate}}" required>
placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER'| translate}}">
</textarea>
<mat-error *ngIf="form.get('description').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED'
| translate}}
@ -501,11 +501,11 @@
console form
</button>
</div> -->
<!--
<div *ngIf="form">{{form.value | json}}</div>
<br>
<br>
<!-- <div *ngIf="form">{{form.value | json}}</div>
<br> -->
<!-- <br>
<div class="row">
{{form.controls?.sections.value |json}}
</div> -->

62
dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts
View File

@ -44,6 +44,7 @@ import { SideNavService } from '@app/core/services/sidenav/side-nav.sevice';
import { EditorCustomValidators, EditorCustomValidatorsEnum } from './custom-validators/editor-custom-validators';
import { CustomErrorValidator } from '@common/forms/validation/custom-validator';
import { STEPPER_ANIMATIONS } from './animations/animations';
import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type';
const skipDisable: any[] = require('../../../../../assets/resources/skipDisable.json');
@ -77,7 +78,7 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
colorizeInvalid:boolean = false;
customEditorValidators = new EditorCustomValidators();
// customEditorValidators = new EditorCustomValidators();
// sectionIdPreviewed:string = null;
// currentSubForm:FormGroup = null;
@ -191,7 +192,7 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
} else {
this.dataModel = new DatasetProfileEditorModel();
this.form = this.dataModel.buildForm();
this.form.setValidators([this.customEditorValidators.atLeastOneElementListValidator('pages'), this.customEditorValidators.pagesHaveAtLeastOneSection('pages', 'sections')]);
// this.form.setValidators([EditorCustomValidators.atLeastOneElementListValidator('pages'), EditorCustomValidators.pagesHaveAtLeastOneSection('pages', 'sections')]);
if (this.dataModel.status === DatasetProfileEnum.FINALIZED) {
this.form.disable();
@ -219,13 +220,16 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
if(tocentries && tocentries.length){
this.selectedTocEntry = tocentries[0];
}
// this._initializeFormValidity(tocentries);
}
prepareForm() {
this.visibilityRulesService.buildVisibilityRules([],this.form);
this.form.setValidators([this.customEditorValidators.atLeastOneElementListValidator('pages'),this.customEditorValidators.pagesHaveAtLeastOneSection('pages', 'sections')]);
// this.form.setValidators([EditorCustomValidators.atLeastOneElementListValidator('pages'),EditorCustomValidators.pagesHaveAtLeastOneSection('pages', 'sections')]);
// this.form.updateValueAndValidity();
this.form.valueChanges
.pipe(takeUntil(this._destroyed))
.subscribe(change => {
@ -239,7 +243,6 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
// this.previewerFormGroup = <FormGroup>this.dataWizardModel.buildForm().get('datasetProfileDefinition');
// });
});
this.form.updateValueAndValidity();
setTimeout(() => {
this.steps = this.stepper.steps;
});
@ -812,8 +815,8 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
const sectionAdded = sectionsArray.at(sectionsArray.length -1) as FormGroup;
sectionAdded.setValidators(this.customEditorValidators.sectionHasAtLeastOneChildOf('fieldSets','sections'));
sectionAdded.updateValueAndValidity();
// sectionAdded.setValidators(this.customEditorValidators.sectionHasAtLeastOneChildOf('fieldSets','sections'));
// sectionAdded.updateValueAndValidity();
this.refreshToCEntries();
@ -1676,6 +1679,11 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
}
}
/**
* Get all filedsets in a tocentry array;
* @param entries Tocentries to search in
* @returns The tocentries that are Fieldsets provided in the entries
*/
private _getAllFieldSets(entries: ToCEntry[]):ToCEntry[]{
const fieldsets:ToCEntry[] = [];
@ -1839,6 +1847,48 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
}
//Temporary patch
/**
* Append custom validators to fields. Some validators are applied on template. In case they are never rendereed,
* he form might be valid when it shouldnt.
* @param
*/
private _initializeFormValidity(tocentries: ToCEntry[]) {
const fieldsets = this._getAllFieldSets(tocentries);
try{
fieldsets.forEach(fs=>{
fs.form.get('title').setValidators(Validators.required);
const fieldsF = fs.form.get('fields') as FormArray;
if(fieldsF){
fieldsF.controls.forEach(field=>{
const renderStyleValue = field.get('viewStyle').get('renderStyle').value;
if(renderStyleValue === DatasetProfileFieldViewStyle.CheckBox){
field.get('defaultValue').get('value').setValidators(Validators.required);
}else if(renderStyleValue === 'combobox'){
const comboType = field.get('data').get('type').value;
if(comboType === DatasetProfileComboBoxType.Autocomplete){//As 'Other' in UI
field.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('autoCompleteSingleDataList'));
}else if(comboType === DatasetProfileComboBoxType.WordList){
field.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
}
}else if(renderStyleValue === DatasetProfileFieldViewStyle.RadioBox){
field.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options'));
}
});
}
});
}catch(e){
console.error('Error initializing validators.');
console.error(e);
}
}
}
interface InvalidControl{