From 12f9e9ede927497209b66d1f0ea70c4948bf6863 Mon Sep 17 00:00:00 2001 From: Kristan Ntavidi Date: Sat, 27 Mar 2021 19:52:53 +0200 Subject: [PATCH] Dataset Profile Editor. Move validators from tempate to models. (Fixing issue of form classified as valid when not all formcontrols are rendered.) --- .../field-data/auto-complete-single-data.ts | 6 +- .../admin/field-editor-model.ts | 57 +- .../admin/field-set-editor-model.ts | 2 +- .../admin/section-editor-model.ts | 5 +- ...file-editor-composite-field.component.html | 2 +- ...rofile-editor-composite-field.component.ts | 391 +++++++++++--- ...rofile-editor-default-value.component.html | 14 +- ...-profile-editor-default-value.component.ts | 2 +- ...-editor-auto-complete-field.component.html | 14 +- ...ataset-profile-editor-field.component.html | 4 +- .../dataset-profile-editor-field.component.ts | 504 +++++++++++++----- ...ofile-editor-section-fieldset.component.ts | 4 +- ...aset-profile-editor-section.component.html | 2 +- .../editor-custom-validators.ts | 8 +- .../editor/dataset-profile-editor-model.ts | 5 + .../dataset-profile-editor.component.html | 12 +- .../dataset-profile-editor.component.ts | 62 ++- 17 files changed, 848 insertions(+), 246 deletions(-) diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-data/auto-complete-single-data.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-data/auto-complete-single-data.ts index 929edc891..3bffd86d1 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-data/auto-complete-single-data.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-data/auto-complete-single-data.ts @@ -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 { @@ -16,8 +16,8 @@ export class AutoCompleteSingleDataEditorModel extends FieldDataEditorModel = []): 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)); diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-editor-model.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-editor-model.ts index fcaf00324..66dd8928d 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-editor-model.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-editor-model.ts @@ -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){ + + // } } diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-set-editor-model.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-set-editor-model.ts index 37e9f1fe4..052bd353b 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-set-editor-model.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/field-set-editor-model.ts @@ -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')) }], diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/section-editor-model.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/section-editor-model.ts index 8edc81899..9d7c7825b 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/admin/section-editor-model.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/admin/section-editor-model.ts @@ -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; } } diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html index c0a869bb5..8728acf2b 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.html @@ -72,7 +72,7 @@ + [formControl]="this.form.get('title')"> diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts index 69e75370c..f04ba1980 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts @@ -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; + } } - (this.form.get('fields')).push(fieldForm); + (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(); } diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.html index 49f8f0267..31648ff9a 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.html +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.html @@ -2,7 +2,7 @@ {{placeHolder}} - + {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate}} {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.BOOLEAN-DECISION.YES' @@ -18,7 +18,7 @@ {{placeHolder}} - + {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.CHECK-BOX.CHECKED' | translate}} {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.CHECK-BOX.UNCHECKED' | translate}} @@ -32,7 +32,7 @@ --> {{placeHolder}} - + {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate }} {{opt.get('label').value}} @@ -56,14 +56,14 @@ {{placeHolder}} - + {{'GENERAL.VALIDATION.REQUIRED' | translate}} {{placeHolder}} - + {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate}} {{opt.get('label').value}} @@ -73,7 +73,7 @@ {{placeHolder}} - + {{'GENERAL.VALIDATION.REQUIRED' | translate}} @@ -81,7 +81,7 @@ {{placeHolder}} - + {{'GENERAL.VALIDATION.REQUIRED' | translate}} diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.ts index aedb1fa72..a62bc0cb4 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-profile-editor-default-value/component-profile-editor-default-value.component.ts @@ -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; diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field-type/auto-complete/dataset-profile-editor-auto-complete-field.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field-type/auto-complete/dataset-profile-editor-auto-complete-field.component.html index 02bd5705b..6037dbc05 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field-type/auto-complete/dataset-profile-editor-auto-complete-field.component.html +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field-type/auto-complete/dataset-profile-editor-auto-complete-field.component.html @@ -47,24 +47,28 @@ {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-URL' | translate}} - + + {{'GENERAL.VALIDATION.REQUIRED' | translate}} {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-OPTIONS-ROOT' | translate}} + [formControl]="singleForm.get('optionsRoot')"> + {{'GENERAL.VALIDATION.REQUIRED' | translate}} {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-LABEL' | translate}} - + + {{'GENERAL.VALIDATION.REQUIRED' | translate}} {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-VALUE' | translate}} - + {{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.FIELD-AUTOCOMPLETE-SOURCE' | translate}} - + + {{'GENERAL.VALIDATION.REQUIRED' | translate}} diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html index 755b9a78e..617ac73fd 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html @@ -140,7 +140,7 @@ + placeHolder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.DEFAULT-VALUE' | translate}}"> @@ -224,4 +224,4 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts index 4cef20a53..4ca3a48ec 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts @@ -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; - // } - // } } \ No newline at end of file diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts index 10365e5b1..1f681384c 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.ts @@ -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; } }); diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html index c45a936f0..d71a7fe3d 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html @@ -13,7 +13,7 @@
{{'DATASET-PROFILE-EDITOR.STEPS.SECTION-INFO.SECTION-NAME-HINT' | translate}}
+ formControlName="title"> {{'GENERAL.VALIDATION.REQUIRED' | translate}} - + diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts index c5f17a54f..42dcc0bd3 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts @@ -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 = 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{