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

description editor frontend changes

This commit is contained in:
Diamantis Tziotzios 2024-02-02 10:29:38 +02:00
parent 5f6eab6e11
commit acc754823f
15 changed files with 553 additions and 291 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
dmp-frontend/src/app/core/model/description/description.ts
View File

@ -8,28 +8,37 @@ import { Tag } from "../tag/tag";
import { User } from "../user/user";
export interface Description extends BaseEntity {
label: string;
properties: PropertyDefinition;
status: DescriptionStatus;
label?: string;
properties?: DescriptionPropertyDefinition;
status?: DescriptionStatus;
description?: string;
createdBy: User;
finalizedAt: Date;
descriptionReferences: DescriptionReference[];
descriptionTags: DescriptionTag[];
descriptionTemplate: DescriptionTemplate;
dmpDescriptionTemplate: DmpDescriptionTemplate;
dmp: Dmp;
createdBy?: User;
finalizedAt?: Date;
descriptionReferences?: DescriptionReference[];
descriptionTags?: DescriptionTag[];
descriptionTemplate?: DescriptionTemplate;
dmpDescriptionTemplate?: DmpDescriptionTemplate;
dmp?: Dmp;
}
export interface PublicDescription extends BaseEntity {
}
export interface PropertyDefinition {
fields?: DescriptionField[];
export interface DescriptionPropertyDefinition {
fieldSets: Map<string, DescriptionPropertyDefinitionFieldSet>;
}
export interface DescriptionPropertyDefinitionFieldSet {
items?: DescriptionPropertyDefinitionFieldSetItem[];
}
export interface DescriptionPropertyDefinitionFieldSetItem {
fields?: Map<string, DescriptionField>;
comment?: string;
ordinal?: number;
}
export interface DescriptionField {
key?: string;
value: string;
}
@ -53,17 +62,26 @@ export interface DescriptionPersist extends BaseEntityPersist {
descriptionTemplateId: Guid;
status: DescriptionStatus;
description: string;
properties: PropertyDefinitionPersist;
properties: DescriptionPropertyDefinitionPersist;
tags: string[];
references: DescriptionReferencePersist[];
}
export interface PropertyDefinitionPersist {
fields: DescriptionFieldPersist[];
export interface DescriptionPropertyDefinitionPersist {
fieldSets: Map<string, DescriptionPropertyDefinitionFieldSetPersist>;
}
export interface DescriptionPropertyDefinitionFieldSetPersist {
items?: DescriptionPropertyDefinitionFieldSetItemPersist[];
}
export interface DescriptionPropertyDefinitionFieldSetItemPersist {
fields?: Map<string, DescriptionFieldPersist>;
comment?: string;
ordinal?: number;
}
export interface DescriptionFieldPersist {
key?: string;
value: string;
}

1
dmp-frontend/src/app/ui/admin/description-template/editor/description-template-editor.resolver.ts
View File

@ -59,7 +59,6 @@ export class DescriptionTemplateEditorResolver extends BaseEditorResolver {
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.numbering)].join('.'),
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.schematics)].join('.'),
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.defaultValue)].join('.'),
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.defaultValue)].join('.'),
// [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.fieldType)].join('.'),
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.includeInExport)].join('.'),
[nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.validations)].join('.'),

4
dmp-frontend/src/app/ui/description/editor/description-base-fields-editor/description-base-fields-editor.component.ts
View File

@ -26,10 +26,10 @@ export class DescriptionBaseFieldsEditorComponent extends BaseComponent {
) { super(); }
ngOnInit() {
const dmpDescriptionTemplates: DmpDescriptionTemplate[] = this.description.dmp.dmpDescriptionTemplates.filter(x => x.sectionId === this.description.dmpDescriptionTemplate.sectionId);
const dmpDescriptionTemplates: DmpDescriptionTemplate[] = this.description.dmp.dmpDescriptionTemplates.filter(x => x.sectionId == this.description.dmpDescriptionTemplate.sectionId);
const currentVersionsOfDescriptionTemplates = dmpDescriptionTemplates.map(x => x.currentDescriptionTemplate);
//Check if the used tempalte in included in the current list. If not add it.
if (currentVersionsOfDescriptionTemplates.find(x => x.id === this.description.descriptionTemplate.id) == null) {
if (currentVersionsOfDescriptionTemplates.find(x => x.id == this.description?.descriptionTemplate?.id) != null) {
this.availableDescriptionTemplates.push(this.description.descriptionTemplate)
}
this.availableDescriptionTemplates.push(...currentVersionsOfDescriptionTemplates);

5
dmp-frontend/src/app/ui/description/editor/description-editor.component.html
View File

@ -15,9 +15,9 @@
<ng-template #viewOnlyTemplate>
<div class="description-title">{{'DESCRIPTION-EDITOR.TITLE-PREVIEW-DESCRIPTION' | translate}}</div>
</ng-template>
<div class="d-flex flex-direction-row dmp-info">
<div *ngIf="item?.dmp?.id" class="d-flex flex-direction-row dmp-info">
<div class="col-auto description-to-dmp">{{'DESCRIPTION-EDITOR.TO-DMP' | translate}}</div>
<div class="dmp-title p-0">:&nbsp;{{ item.dmp.label }}</div>
<div class="dmp-title p-0">:&nbsp;{{ item?.dmp?.label }}</div>
<div class="col-auto d-flex align-items-center">
<a [routerLink]="['/overview/' + item.dmp.id]" target="_blank" class="pointer open-in-new-icon">
<mat-icon class="size-18">open_in_new</mat-icon>
@ -137,6 +137,7 @@
(fieldsetFocusChange)="fieldsetIdWithFocus = $event"></app-description-form>
</div>
</div>
{{formGroup?.value | json}}
</form>
</div>
</div>

129
dmp-frontend/src/app/ui/description/editor/description-editor.component.ts
View File

@ -33,13 +33,15 @@ import { FilterService } from '@common/modules/text-filter/filter-service';
import { Guid } from '@common/types/guid';
import { TranslateService } from '@ngx-translate/core';
import { map, takeUntil } from 'rxjs/operators';
import { DescriptionEditorModel } from './description-editor.model';
import { DescriptionEditorModel, DescriptionPropertyDefinitionEditorModel } from './description-editor.model';
import { DescriptionEditorResolver } from './description-editor.resolver';
import { DescriptionEditorService } from './description-editor.service';
import { ToCEntry } from './table-of-contents/models/toc-entry';
import { TableOfContentsComponent } from './table-of-contents/table-of-contents.component';
import { ToCEntryType } from './table-of-contents/models/toc-entry-type.enum';
import { DmpService } from '@app/core/services/dmp/dmp.service';
import { DescriptionTemplateSection } from '@app/core/model/description-template/description-template';
import { DescriptionTemplateService } from '@app/core/services/description-template/description-template.service';
@Component({
selector: 'app-description-editor-component',
@ -112,6 +114,7 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
private descriptionService: DescriptionService,
private logger: LoggingService,
private descriptionEditorService: DescriptionEditorService,
private descriptionTemplateService: DescriptionTemplateService,
private fileUtils: FileUtils,
private matomoService: MatomoService,
private dmpService: DmpService,
@ -142,6 +145,9 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
const isPublicDescription = params['public'];
const itemId = params['id'];
const newDmpId = params['newDmpId'];
// const publicId = params['publicId'];
// this.dmpId = params['dmpId'];
// this.dmpSectionIndex = parseInt(params['dmpSectionIndex']);
@ -195,6 +201,8 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
// }
// });
// }
//Regular Editor case
if (itemId != null && newDmpId == null) {
this.isNew = false;
this.lockService.checkLockStatus(itemId).pipe(takeUntil(this._destroyed)).subscribe(lockStatus => {
@ -561,13 +569,15 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
buildForm() {
this.formGroup = this.editorModel.buildForm(null, this.isDeleted || !this.authService.hasPermission(AppPermission.EditDescription));
this.visibilityRulesService.buildVisibilityRules(this.visibilityRulesService.getVisibilityRulesFromDescriptionTempalte(this.item.descriptionTemplate), this.formGroup);
//this.visibilityRulesService.buildVisibilityRules(this.visibilityRulesService.getVisibilityRulesFromDescriptionTempalte(this.item.descriptionTemplate), this.formGroup);
// this.selectedSystemFields = this.selectedSystemFieldDisabled();
this.descriptionEditorService.setValidationErrorModel(this.editorModel.validationErrorModel);
if (this.editorModel.status == DescriptionStatus.Finalized || this.isDeleted) {
this.formGroup.disable();
}
this.registerFormListeners();
}
refreshData(): void {
@ -719,56 +729,71 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
return fieldSets;
}
// registerFormListeners() {
// // const dmpSubscription =
// this.formGroup.get('dmp').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.dmpValueChanged(x);
// });
// // const profileSubscription =
// this.formGroup.get('profile').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// if (x) {
// this.showtocentriesErrors = false;
// this.descriptionProfileValueChanged(x.id);
// this.formChanged();
// }
// });
// // const labelSubscription =
// this.formGroup.get('label').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const descriptionSubscription =
// this.formGroup.get('description').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const uriSubscription =
// this.formGroup.get('uri').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const tagsSubscription =
// this.formGroup.get('tags').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// if (this.formGroup.get('descriptionProfileDefinition')) {
// // const descriptionProfileDefinitionSubscription =
// this.formGroup.get('descriptionProfileDefinition').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // this._listenersSubscription.add(descriptionProfileDefinitionSubscription);
// }
registerFormListeners() {
// // const dmpSubscription =
// this.formGroup.get('dmp').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.dmpValueChanged(x);
// });
// // const profileSubscription =
this.formGroup.get('descriptionTemplateId').valueChanges
.pipe(takeUntil(this._destroyed))
.subscribe(descriptionTemplateId => {
if (descriptionTemplateId) {
// this.showtocentriesErrors = false;
this.descriptionTemplateValueChanged(descriptionTemplateId);
// this.formChanged();
}
});
// // const labelSubscription =
// this.formGroup.get('label').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const descriptionSubscription =
// this.formGroup.get('description').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const uriSubscription =
// this.formGroup.get('uri').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // const tagsSubscription =
// this.formGroup.get('tags').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// if (this.formGroup.get('descriptionProfileDefinition')) {
// // const descriptionProfileDefinitionSubscription =
// this.formGroup.get('descriptionProfileDefinition').valueChanges
// .pipe(takeUntil(this._destroyed))
// .subscribe(x => {
// this.formChanged();
// });
// // this._listenersSubscription.add(descriptionProfileDefinitionSubscription);
}
descriptionTemplateValueChanged(descriptionTemplateId: Guid) {
if (descriptionTemplateId != null) {
this.descriptionTemplateService.getSingle(descriptionTemplateId, DescriptionEditorResolver.descriptionTemplateLookupFields()).pipe(takeUntil(this._destroyed)).subscribe(descriptionTemplate => {
this.editorModel.properties = new DescriptionPropertyDefinitionEditorModel().fromModel(null, descriptionTemplate);
this.formGroup.removeControl('properties');
this.formGroup.addControl('properties', this.editorModel.buildProperties());
this.item.descriptionTemplate = descriptionTemplate;
});
// this.formGroup.removeControl('descriptionProfileDefinition');
// this.getDefinition(profiledId);
}
}
// // this._listenersSubscription.add(dmpSubscription);
// // this._listenersSubscription.add(profileSubscription);

243
dmp-frontend/src/app/ui/description/editor/description-editor.model.ts
View File

@ -1,7 +1,7 @@
import { UntypedFormBuilder, UntypedFormGroup, Validators } from "@angular/forms";
import { FormControl, UntypedFormBuilder, UntypedFormGroup, Validators } from "@angular/forms";
import { DescriptionStatus } from "@app/core/common/enum/description-status";
import { DescriptionTemplate } from "@app/core/model/description-template/description-template";
import { Description, DescriptionField, DescriptionFieldPersist, DescriptionPersist, DescriptionReference, DescriptionReferencePersist, PropertyDefinition, PropertyDefinitionPersist } from "@app/core/model/description/description";
import { DescriptionTemplate, DescriptionTemplateFieldSet, DescriptionTemplateSection } from "@app/core/model/description-template/description-template";
import { Description, DescriptionField, DescriptionFieldPersist, DescriptionPersist, DescriptionPropertyDefinition, DescriptionPropertyDefinitionFieldSet, DescriptionPropertyDefinitionFieldSetItem, DescriptionPropertyDefinitionFieldSetItemPersist, DescriptionPropertyDefinitionFieldSetPersist, DescriptionPropertyDefinitionPersist, DescriptionReference, DescriptionReferencePersist } from "@app/core/model/description/description";
import { ReferencePersist } from "@app/core/model/reference/reference";
import { BaseEditorModel } from "@common/base/base-form-editor-model";
import { BackendErrorValidator } from '@common/forms/validation/custom-validator';
@ -36,7 +36,7 @@ export class DescriptionEditorModel extends BaseEditorModel implements Descripti
this.status = item.status;
this.description = item.description;
this.tags = item.descriptionTags?.map(x => x.tag?.label);
this.properties = new DescriptionPropertyDefinitionEditorModel().fromModel(item.properties);
this.properties = new DescriptionPropertyDefinitionEditorModel().fromModel(item.properties, descriptionTemplate);
//if (item.references) { item.references.map(x => this.references.push(new DescriptionReferenceEditorModel().fromModel(x))); }
}
return this;
@ -54,13 +54,17 @@ export class DescriptionEditorModel extends BaseEditorModel implements Descripti
status: [{ value: this.status, disabled: disabled }, context.getValidation('status').validators],
description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators],
tags: [{ value: this.tags, disabled: disabled }, context.getValidation('tags').validators],
properties: this.properties.buildForm({
rootPath: `properties.`
}),
properties: this.buildProperties(),
hash: [{ value: this.hash, disabled: disabled }, context.getValidation('hash').validators]
});
}
buildProperties() {
return this.properties.buildForm({
rootPath: `properties.`
});
}
createValidationContext(): ValidationContext {
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
@ -79,18 +83,16 @@ export class DescriptionEditorModel extends BaseEditorModel implements Descripti
}
}
export class DescriptionPropertyDefinitionEditorModel implements PropertyDefinitionPersist {
fields: DescriptionFieldEditorModel[] = [];
export class DescriptionPropertyDefinitionEditorModel implements DescriptionPropertyDefinitionPersist {
fieldSets: Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> = new Map<string, DescriptionPropertyDefinitionFieldSetEditorModel>;
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
constructor(
public validationErrorModel: ValidationErrorModel = new ValidationErrorModel()
) { }
public fromModel(item: PropertyDefinition): DescriptionPropertyDefinitionEditorModel {
if (item) {
if (item.fields) { item.fields.map(x => this.fields.push(new DescriptionFieldEditorModel().fromModel(x))); }
}
public fromModel(item: DescriptionPropertyDefinition, descriptionTemplate: DescriptionTemplate): DescriptionPropertyDefinitionEditorModel {
this.fieldSets = this.calculateProperties(item, descriptionTemplate);
return this;
}
@ -107,27 +109,198 @@ export class DescriptionPropertyDefinitionEditorModel implements PropertyDefinit
});
}
const formGroup = this.formBuilder.group({});
(this.fields ?? []).map(
(item, index) => formGroup.addControl(item.key, new DescriptionFieldEditorModel(
this.validationErrorModel
).fromModel(item).buildForm({
rootPath: `${rootPath}fields[${index}].`
})), context.getValidation('fields')
)
const fieldSetsFormGroup = this.formBuilder.group({});
if (this.fieldSets.size > 0) {
this.fieldSets.forEach((value, key) => fieldSetsFormGroup.addControl(key.toString(), value.buildForm({
rootPath: `${rootPath}fieldSets[${key}].`
})), context.getValidation('fieldSets'));
formGroup.addControl('fieldSets', fieldSetsFormGroup);
}
return formGroup;
}
static createValidationContext(params: {
rootPath?: string,
validationErrorModel: ValidationErrorModel
}): ValidationContext {
const { rootPath = '', validationErrorModel } = params;
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
baseValidationArray.push({ key: 'fieldSets', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}fieldSets`)] });
baseContext.validation = baseValidationArray;
return baseContext;
}
private calculateProperties(item: DescriptionPropertyDefinition, descriptionTemplate: DescriptionTemplate,): Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> {
let result: Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> = new Map<string, DescriptionPropertyDefinitionFieldSetEditorModel>();
if (descriptionTemplate) (
descriptionTemplate.definition.pages.forEach(definitionPage => {
definitionPage.sections.forEach(definitionSection => {
const sectionResult = this.calculateSectionProperties(definitionSection, item);
if (sectionResult != null) {
result = new Map([...result, ...sectionResult]);
}
})
})
)
return result;
}
private calculateSectionProperties(definitionSection: DescriptionTemplateSection, item: DescriptionPropertyDefinition): Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> {
if (definitionSection == null) return null;
let result: Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> = new Map<string, DescriptionPropertyDefinitionFieldSetEditorModel>();
definitionSection?.fieldSets?.forEach(definitionFieldSet => {
const fieldSetResult = this.calculateFieldSetProperties(definitionFieldSet, item);
if (fieldSetResult != null) {
result = new Map([...result, ...fieldSetResult]);
}
});
if (definitionSection.sections != null && definitionSection.sections?.length > 0) {
definitionSection.sections.forEach(nestedDefinitionSection => {
const nestedSectionResult = this.calculateSectionProperties(nestedDefinitionSection, item);
if (nestedSectionResult != null) {
result = new Map([...result, ...nestedSectionResult]);
}
});
}
return result;
}
private calculateFieldSetProperties(definitionFieldSet: DescriptionTemplateFieldSet, item: DescriptionPropertyDefinition): Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> {
if (definitionFieldSet == null) return null;
const result: Map<string, DescriptionPropertyDefinitionFieldSetEditorModel> = new Map<string, DescriptionPropertyDefinitionFieldSetEditorModel>();
// current saved values
const fieldSetValue: DescriptionPropertyDefinitionFieldSet = item?.fieldSets[definitionFieldSet.id] ?? {};
// new item case, where we need to add controls for all the containing fields.
if (fieldSetValue.items == null || fieldSetValue.items?.length == 0) {
const fields = new Map<string, DescriptionField>();
definitionFieldSet.fields.forEach(definitionField => {
fields.set(definitionField.id, { value: undefined });
})
fieldSetValue.items = [{
fields: fields
} as DescriptionPropertyDefinitionFieldSetItem]
}
result.set(definitionFieldSet.id, new DescriptionPropertyDefinitionFieldSetEditorModel().fromModel(fieldSetValue));
return result;
}
}
export class DescriptionPropertyDefinitionFieldSetEditorModel implements DescriptionPropertyDefinitionFieldSetPersist {
items?: DescriptionPropertyDefinitionFieldSetItemEditorModel[] = [];
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
constructor(
public validationErrorModel: ValidationErrorModel = new ValidationErrorModel()
) { }
public fromModel(item: DescriptionPropertyDefinitionFieldSet): DescriptionPropertyDefinitionFieldSetEditorModel {
if (item) {
if (item.items) { item.items.map(x => this.items.push(new DescriptionPropertyDefinitionFieldSetItemEditorModel().fromModel(x))); }
}
return this;
}
buildForm(params?: {
context?: ValidationContext,
disabled?: boolean,
rootPath?: string
}): UntypedFormGroup {
let { context = null, disabled = false, rootPath } = params ?? {}
if (context == null) {
context = DescriptionPropertyDefinitionFieldSetEditorModel.createValidationContext({
validationErrorModel: this.validationErrorModel,
rootPath
});
}
return this.formBuilder.group({
items: this.formBuilder.array(
(this.items ?? []).map(
(item, index) => item.buildForm({
rootPath: `${rootPath}items[${index}].`
})
), context.getValidation('items')
)
});
}
static createValidationContext(params: {
rootPath?: string,
validationErrorModel: ValidationErrorModel
}): ValidationContext {
const { rootPath = '', validationErrorModel } = params;
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
baseValidationArray.push({ key: 'items', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}items`)] });
baseContext.validation = baseValidationArray;
return baseContext;
}
}
export class DescriptionPropertyDefinitionFieldSetItemEditorModel implements DescriptionPropertyDefinitionFieldSetItemPersist {
fields: Map<string, DescriptionFieldEditorModel> = new Map<string, DescriptionFieldEditorModel>;
comment?: string;
ordinal?: number;
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
constructor(
public validationErrorModel: ValidationErrorModel = new ValidationErrorModel()
) { }
public fromModel(item: DescriptionPropertyDefinitionFieldSetItem): DescriptionPropertyDefinitionFieldSetItemEditorModel {
if (item) {
this.comment = item.comment;
this.ordinal = item.ordinal;
if (item.fields) { item.fields?.forEach((value, key) => this.fields.set(key, new DescriptionFieldEditorModel().fromModel(value))); }
}
return this;
}
buildForm(params?: {
context?: ValidationContext,
disabled?: boolean,
rootPath?: string
}): UntypedFormGroup {
let { context = null, disabled = false, rootPath } = params ?? {}
if (context == null) {
context = DescriptionPropertyDefinitionFieldSetItemEditorModel.createValidationContext({
validationErrorModel: this.validationErrorModel,
rootPath
});
}
const formGroup = this.formBuilder.group({});
formGroup.addControl('comment', new FormControl({ value: this.comment, disabled: disabled }, context.getValidation('comment').validators));
formGroup.addControl('ordinal', new FormControl({ value: this.ordinal, disabled: disabled }, context.getValidation('ordinal').validators));
const fieldsFormGroup = this.formBuilder.group({});
this.fields.forEach((value, key) => fieldsFormGroup.addControl(key.toString(), value.buildForm({
rootPath: `${rootPath}fields[${key}].`
})), context.getValidation('fields')
)
formGroup.addControl('fields', fieldsFormGroup);
return formGroup;
// return this.formBuilder.group({
// fields: this.formBuilder.array(
// (this.fields ?? []).map(
// (item, index) => new DescriptionFieldEditorModel(
// this.validationErrorModel
// ).fromModel(item).buildForm({
// rootPath: `${rootPath}fields[${index}].`
// }), context.getValidation('fields')
// )
// )
// });
}
static createValidationContext(params: {
@ -139,6 +312,8 @@ export class DescriptionPropertyDefinitionEditorModel implements PropertyDefinit
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
baseValidationArray.push({ key: 'fields', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}fields`)] });
baseValidationArray.push({ key: 'comment', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}comment`)] });
baseValidationArray.push({ key: 'ordinal', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}ordinal`)] });
baseContext.validation = baseValidationArray;
return baseContext;
@ -147,7 +322,6 @@ export class DescriptionPropertyDefinitionEditorModel implements PropertyDefinit
}
export class DescriptionFieldEditorModel implements DescriptionFieldPersist {
key?: string;
value: string;
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
@ -158,7 +332,6 @@ export class DescriptionFieldEditorModel implements DescriptionFieldPersist {
public fromModel(item: DescriptionField): DescriptionFieldEditorModel {
if (item) {
this.key = item.key;
this.value = item.value;
}
return this;
@ -178,7 +351,6 @@ export class DescriptionFieldEditorModel implements DescriptionFieldPersist {
}
return this.formBuilder.group({
key: [{ value: this.key, disabled: disabled }, context.getValidation('key').validators],
value: [{ value: this.value, disabled: disabled }, context.getValidation('value').validators]
});
}
@ -191,7 +363,6 @@ export class DescriptionFieldEditorModel implements DescriptionFieldPersist {
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
baseValidationArray.push({ key: 'key', validators: [BackendErrorValidator(validationErrorModel, `${rootPath}key`)] });
baseValidationArray.push({ key: 'value', validators: [Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}value`)] });
baseContext.validation = baseValidationArray;
return baseContext;

88
dmp-frontend/src/app/ui/description/editor/description-editor.resolver.ts
View File

@ -1,22 +1,27 @@
import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { DescriptionTemplate, DescriptionTemplateBaseFieldData, DescriptionTemplateSelectOption, DescriptionTemplateDefinition, DescriptionTemplateField, DescriptionTemplateFieldSet, DescriptionTemplatePage, DescriptionTemplateRule, DescriptionTemplateSection, DescriptionTemplateSelectData } from '@app/core/model/description-template/description-template';
import { Description, DescriptionField, DescriptionReference, DescriptionTag, PropertyDefinition } from '@app/core/model/description/description';
import { DescriptionTemplate, DescriptionTemplateBaseFieldData, DescriptionTemplateDefinition, DescriptionTemplateExternalDatasetData, DescriptionTemplateField, DescriptionTemplateFieldSet, DescriptionTemplateMultiplicity, DescriptionTemplatePage, DescriptionTemplateRule, DescriptionTemplateSection, DescriptionTemplateSelectData, DescriptionTemplateSelectOption, DescriptionTemplateUploadData, DescriptionTemplateUploadOption } from '@app/core/model/description-template/description-template';
import { Description, DescriptionField, DescriptionPropertyDefinition, DescriptionPropertyDefinitionFieldSet, DescriptionPropertyDefinitionFieldSetItem, DescriptionReference, DescriptionTag } from '@app/core/model/description/description';
import { DescriptionTemplatesInSection, DmpBlueprint, DmpBlueprintDefinition, DmpBlueprintDefinitionSection } from '@app/core/model/dmp-blueprint/dmp-blueprint';
import { Dmp, DmpDescriptionTemplate } from '@app/core/model/dmp/dmp';
import { Reference } from '@app/core/model/reference/reference';
import { Tag } from '@app/core/model/tag/tag';
import { DescriptionService } from '@app/core/services/description/description.service';
import { DmpService } from '@app/core/services/dmp/dmp.service';
import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
import { BaseEditorResolver } from '@common/base/base-editor.resolver';
import { Guid } from '@common/types/guid';
import { takeUntil, tap } from 'rxjs/operators';
import { map, takeUntil, tap } from 'rxjs/operators';
import { nameof } from 'ts-simple-nameof';
@Injectable()
export class DescriptionEditorResolver extends BaseEditorResolver {
constructor(private descriptionService: DescriptionService, private breadcrumbService: BreadcrumbService) {
constructor(
private descriptionService: DescriptionService,
private breadcrumbService: BreadcrumbService,
private dmpService: DmpService
) {
super();
}
@ -28,35 +33,17 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
nameof<Description>(x => x.status),
nameof<Description>(x => x.description),
nameof<Description>(x => x.status),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.label)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.label)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.ordinal)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.hasTemplates)].join('.'),
// [nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.descriptionTemplateGroupId)].join('.'),
// [nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.label)].join('.'),
// [nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.minMultiplicity)].join('.'),
// [nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.maxMultiplicity)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.sectionId)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.descriptionTemplateGroupId)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.label)].join('.'),
[nameof<Description>(x => x.dmp), nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.version)].join('.'),
...DescriptionEditorResolver.dmpLookupFields(nameof<Description>(x => x.dmp)),
[nameof<Description>(x => x.dmpDescriptionTemplate), nameof<DmpDescriptionTemplate>(x => x.id)].join('.'),
[nameof<Description>(x => x.dmpDescriptionTemplate), nameof<DmpDescriptionTemplate>(x => x.sectionId)].join('.'),
...DescriptionEditorResolver.descriptionTemplateLookupFields(nameof<Description>(x => x.descriptionTemplate)),
[nameof<Description>(x => x.properties), nameof<PropertyDefinition>(x => x.fields), nameof<DescriptionField>(x => x.key)].join('.'),
[nameof<Description>(x => x.properties), nameof<PropertyDefinition>(x => x.fields), nameof<DescriptionField>(x => x.value)].join('.'),
[nameof<Description>(x => x.properties), nameof<DescriptionPropertyDefinition>(x => x.fieldSets), nameof<DescriptionPropertyDefinitionFieldSet>(x => x.items), nameof<DescriptionPropertyDefinitionFieldSetItem>(x => x.comment)].join('.'),
[nameof<Description>(x => x.properties), nameof<DescriptionPropertyDefinition>(x => x.fieldSets), nameof<DescriptionPropertyDefinitionFieldSet>(x => x.items), nameof<DescriptionPropertyDefinitionFieldSetItem>(x => x.ordinal)].join('.'),
[nameof<Description>(x => x.properties), nameof<DescriptionPropertyDefinition>(x => x.fieldSets), nameof<DescriptionPropertyDefinitionFieldSet>(x => x.items), nameof<DescriptionPropertyDefinitionFieldSetItem>(x => x.fields), nameof<DescriptionField>(x => x.value)].join('.'),
[nameof<Description>(x => x.descriptionTags), nameof<DescriptionTag>(x => x.id),].join('.'),
[nameof<Description>(x => x.descriptionTags), nameof<DescriptionTag>(x => x.tag), nameof<Tag>(x => x.label)].join('.'),
@ -84,6 +71,7 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.ordinal)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.title)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.description)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.sections)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.ordinal)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.title)].join('.'),
@ -91,6 +79,10 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.extendedDescription)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.additionalInformation)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.hasCommentField)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.multiplicity), nameof<DescriptionTemplateMultiplicity>(x => x.min)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.multiplicity), nameof<DescriptionTemplateMultiplicity>(x => x.max)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.multiplicity), nameof<DescriptionTemplateMultiplicity>(x => x.placeholder)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.multiplicity), nameof<DescriptionTemplateMultiplicity>(x => x.tableView)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.defaultValue)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.validations)].join('.'),
@ -98,10 +90,38 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.visibilityRules), nameof<DescriptionTemplateRule>(x => x.value)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateBaseFieldData>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateBaseFieldData>(x => x.fieldType)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateSelectData>(x => x.options)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateSelectData>(x => x.options), nameof<DescriptionTemplateSelectOption>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateSelectData>(x => x.options), nameof<DescriptionTemplateSelectOption>(x => x.value)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateSelectData>(x => x.multipleSelect)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateExternalDatasetData>(x => x.type)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateUploadData>(x => x.maxFileSizeInMB)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateUploadData>(x => x.types), nameof<DescriptionTemplateUploadOption>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<DescriptionTemplate>(x => x.definition), nameof<DescriptionTemplateDefinition>(x => x.pages), nameof<DescriptionTemplatePage>(x => x.sections), nameof<DescriptionTemplateSection>(x => x.fieldSets), nameof<DescriptionTemplateFieldSet>(x => x.fields), nameof<DescriptionTemplateField>(x => x.data), nameof<DescriptionTemplateUploadData>(x => x.types), nameof<DescriptionTemplateUploadOption>(x => x.value)].join('.'),
]
}
public static dmpLookupFields(prefix?: string): string[] {
return [
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.ordinal)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.hasTemplates)].join('.'),
// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.descriptionTemplateGroupId)].join('.'),
// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.label)].join('.'),
// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.minMultiplicity)].join('.'),
// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.maxMultiplicity)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.sectionId)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.descriptionTemplateGroupId)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.id)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.label)].join('.'),
(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.currentDescriptionTemplate), nameof<DescriptionTemplate>(x => x.version)].join('.'),
]
}
@ -111,9 +131,21 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
...DescriptionEditorResolver.lookupFields()
];
const id = route.paramMap.get('id');
const dmpId = route.paramMap.get('dmpId');
const dmpSectionId = route.paramMap.get('dmpSectionId');
// const cloneid = route.paramMap.get('cloneid');
if (id != null) {
return this.descriptionService.getSingle(Guid.parse(id), fields).pipe(tap(x => this.breadcrumbService.addIdResolvedValue(x.id?.toString(), x.label)), takeUntil(this._destroyed));
return this.descriptionService.getSingle(Guid.parse(id), fields)
} else if (dmpId != null && dmpSectionId != null) {
return this.dmpService.getSingle(Guid.parse(dmpId), DescriptionEditorResolver.dmpLookupFields()).pipe(tap(x => this.breadcrumbService.addIdResolvedValue(x.id?.toString(), x.label)), takeUntil(this._destroyed), map(dmp => {
const description: Description = {};
description.dmp = dmp;
description.dmpDescriptionTemplate = {
sectionId: Guid.parse(dmpSectionId)
}
return description;
}));
}
//TODO: check this
// else if (cloneid != null) {

27
dmp-frontend/src/app/ui/description/editor/description-editor.routing.ts
View File

@ -27,16 +27,23 @@ const routes: Routes = [
}
}
},
// {
// path: 'new/:dmpId/:dmpSectionIndex',
// component: DescriptionWizardComponent,
// canActivate: [AuthGuard],
// data: {
// breadcrumb: true,
// title: 'GENERAL.TITLES.DATASET-NEW'
// },
// canDeactivate:[CanDeactivateGuard]
// },
{
path: ':dmpId/:dmpSectionId',
canActivate: [AuthGuard],
component: DescriptionEditorComponent,
canDeactivate: [PendingChangesGuard],
resolve: {
'entity': DescriptionEditorResolver
},
data: {
...BreadcrumbService.generateRouteDataConfiguration({
title: 'BREADCRUMBS.EDIT-DESCRIPTION'
}),
authContext: {
permissions: [AppPermission.EditDescription]
}
}
},
// {
// path: 'edit/:id/finalize',

4
dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html
View File

@ -45,8 +45,8 @@
</div>
</div>
</div>
<div *ngIf="fieldSet.hasCommentField && propertiesFormGroup.get('commentFieldValue'+fieldSet.id)?.get('value')" class="col-12">
<rich-text-editor-component [form]="propertiesFormGroup.get('commentFieldValue'+fieldSet.id).get('value')" [id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate" [wrapperClasses]="'mb-2'" [editable]="!propertiesFormGroup.get('commentFieldValue'+fieldSet.id).disabled"></rich-text-editor-component>
<div *ngIf="fieldSet.hasCommentField && propertiesFormGroup.get('comment')" class="col-12">
<rich-text-editor-component [form]="propertiesFormGroup.get('comment')" [id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate" [wrapperClasses]="'mb-2'" [editable]="!propertiesFormGroup.get('commentFieldValue'+fieldSet.id).disabled"></rich-text-editor-component>
</div>
</div>
<ng-container *ngIf="fieldSet && isVisibleByVisibilityService && tableRow">

174
dmp-frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.html
View File

@ -11,25 +11,25 @@
<i>{{fieldSet.extendedDescription}}</i>
</h5>
<mat-form-field *ngSwitchCase="descriptionTemplateFieldTypeEnum.FREE_TEXT" class="col-12">
<input matInput [formControl]="propertiesFormGroup.get(field.id).get('value')" placeholder="{{(field.data.label) + (isRequired? ' *': '')}}" [required]="isRequired">
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('pattern')">{{'GENERAL.VALIDATION.URL.MESSAGE' | translate}}</mat-error>
<input matInput [formControl]="propertiesFormGroup?.get(field.id).get('value')" placeholder="{{(field.data.label) + (isRequired? ' *': '')}}" [required]="isRequired">
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('pattern')">{{'GENERAL.VALIDATION.URL.MESSAGE' | translate}}</mat-error>
</mat-form-field>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.EXTERNAL_SELECT" class="col-12">
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '')}}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '')}}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="multipleAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '')}}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '')}}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -38,11 +38,11 @@
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.SELECT" class="col-12">
<div class="row">
<mat-form-field class="col-md-12">
<mat-select [formControl]="propertiesFormGroup.get(field.id).get('value')" placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [required]="isRequired" [multiple]="field.data.multipleSelect">
<mat-select [formControl]="propertiesFormGroup?.get(field.id).get('value')" placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [required]="isRequired" [multiple]="field.data.multipleSelect">
<mat-option *ngFor="let opt of field.data.options" [value]="opt.value">{{opt.label}}
</mat-option>
</mat-select>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
</div>
@ -51,16 +51,16 @@
<div class="row">
<mat-form-field class="col-md-12" >
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="multipleAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -70,16 +70,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="multipleAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -89,97 +89,97 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="multipleAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="singleAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
</div>
</div>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.CHECK_BOX" class="col-12">
<mat-checkbox [formControl]="propertiesFormGroup.get(field.id).get('value')" [required]="isRequired">
<mat-checkbox [formControl]="propertiesFormGroup?.get(field.id).get('value')" [required]="isRequired">
{{field.data.label}}</mat-checkbox>
</div>
<mat-form-field *ngSwitchCase="descriptionTemplateFieldTypeEnum.TEXT_AREA" class="col-12">
<textarea matInput class="text-area" [formControl]="propertiesFormGroup.get(field.id).get('value')" matTextareaAutosize matAutosizeMinRows="3" matAutosizeMaxRows="15" [required]="isRequired"
<textarea matInput class="text-area" [formControl]="propertiesFormGroup?.get(field.id).get('value')" matTextareaAutosize matAutosizeMinRows="3" matAutosizeMaxRows="15" [required]="isRequired"
placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}"></textarea>
<button mat-icon-button type="button" *ngIf="!propertiesFormGroup.get(field.id).get('value').disabled && propertiesFormGroup.get(field.id).get('value').value" matSuffix aria-label="Clear" (click)="this.propertiesFormGroup.get(field.id).get('value').patchValue('')">
<button mat-icon-button type="button" *ngIf="!propertiesFormGroup?.get(field.id).get('value').disabled && propertiesFormGroup?.get(field.id).get('value').value" matSuffix aria-label="Clear" (click)="this.propertiesFormGroup?.get(field.id).get('value').patchValue('')">
<mat-icon>close</mat-icon>
</button>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value')['errors'] && propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value')['errors'] && propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<ng-container *ngSwitchCase="descriptionTemplateFieldTypeEnum.RICH_TEXT_AREA">
<rich-text-editor-component class="col-12"
[form]="propertiesFormGroup.get(field.id).get('value')"
[form]="propertiesFormGroup?.get(field.id).get('value')"
[placeholder]="field.data.label"
[required]="isRequired"
[wrapperClasses]="'full-width editor ' +
((isRequired && propertiesFormGroup.get(field.id).get('value').touched && propertiesFormGroup.get(field.id).get('value').hasError('required')) ? 'required' : '')"
[editable]="!propertiesFormGroup.get(field.id).get('value').disabled">
((isRequired && propertiesFormGroup?.get(field.id).get('value').touched && propertiesFormGroup?.get(field.id).get('value').hasError('required')) ? 'required' : '')"
[editable]="!propertiesFormGroup?.get(field.id).get('value').disabled">
</rich-text-editor-component>
<div [class]="(propertiesFormGroup.get(field.id).get('value')['errors'] && propertiesFormGroup.get(field.id).get('value').hasError('required') && propertiesFormGroup.get(field.id).get('value').touched) ? 'visible' : 'invisible'" class="col-12">
<div [class]="(propertiesFormGroup?.get(field.id).get('value')['errors'] && propertiesFormGroup?.get(field.id).get('value').hasError('required') && propertiesFormGroup?.get(field.id).get('value').touched) ? 'visible' : 'invisible'" class="col-12">
<div class="mat-form-field form-field-subscript-wrapper">
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value')['errors'] && propertiesFormGroup.get(field.id).get('value').hasError('required') && propertiesFormGroup.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value')['errors'] && propertiesFormGroup?.get(field.id).get('value').hasError('required') && propertiesFormGroup?.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>
</div>
</ng-container>
<ng-container *ngSwitchCase="descriptionTemplateFieldTypeEnum.UPLOAD">
<div class="col-12 d-flex justify-content-center">
<ngx-dropzone #drop class="drop-file col-12" (change)="fileChangeEvent($event, true)"
[multiple]="false" [accept]="typesToString()" [disabled]="propertiesFormGroup.get(field.id).get('value').disabled">
<ngx-dropzone-preview *ngIf="propertiesFormGroup.get(field.id).get('value').value && propertiesFormGroup.get(field.id).get('value').value.name" class="file-preview"
[multiple]="false" [accept]="typesToString()" [disabled]="propertiesFormGroup?.get(field.id).get('value').disabled">
<ngx-dropzone-preview *ngIf="propertiesFormGroup?.get(field.id).get('value').value && propertiesFormGroup?.get(field.id).get('value').value.name" class="file-preview"
[removable]="true" (removed)="onRemove()">
<ngx-dropzone-label class="file-label">{{ propertiesFormGroup.get(field.id).get('value').value.name }}</ngx-dropzone-label>
<ngx-dropzone-label class="file-label">{{ propertiesFormGroup?.get(field.id).get('value').value.name }}</ngx-dropzone-label>
</ngx-dropzone-preview>
</ngx-dropzone>
</div>
<div class="col-12 d-flex justify-content-center attach-btn">
<button *ngIf="!propertiesFormGroup.get(field.id).get('value').value || filesToUpload" mat-button (click)="drop.showFileSelector()" type="button" class="attach-file-btn"
[disabled]="!!propertiesFormGroup.get(field.id).get('value').value || propertiesFormGroup.get(field.id).get('value').disabled">
<button *ngIf="!propertiesFormGroup?.get(field.id).get('value').value || filesToUpload" mat-button (click)="drop.showFileSelector()" type="button" class="attach-file-btn"
[disabled]="!!propertiesFormGroup?.get(field.id).get('value').value || propertiesFormGroup?.get(field.id).get('value').disabled">
<mat-icon class="mr-2">upload</mat-icon>
<mat-label>{{ (field.data.label | translate)}}</mat-label>
</button>
<button *ngIf="propertiesFormGroup.get(field.id).get('value').value && !filesToUpload" mat-button (click)="download()" type="button" class="attach-file-btn"
[disabled]="propertiesFormGroup.get(field.id).get('value').disabled">
<button *ngIf="propertiesFormGroup?.get(field.id).get('value').value && !filesToUpload" mat-button (click)="download()" type="button" class="attach-file-btn"
[disabled]="propertiesFormGroup?.get(field.id).get('value').disabled">
<mat-icon class="mr-2">download</mat-icon>
<mat-label>{{ "TYPES.DATASET-PROFILE-UPLOAD-TYPE.DOWNLOAD" | translate }}</mat-label>
</button>
</div>
</ng-container>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.BOOLEAN_DECISION" class="col-12">
<mat-radio-group [formControl]="propertiesFormGroup.get(field.id).get('value')" [required]="isRequired">
<mat-radio-button class="radio-button-item" name="{{propertiesFormGroup.get(field.id).get('key').value}}" value="true">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.YES" | translate }}</mat-radio-button>
<mat-radio-button class="radio-button-item" name="{{propertiesFormGroup.get(field.id).get('key').value}}" value="false">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.NO" | translate }}</mat-radio-button>
<mat-radio-group [formControl]="propertiesFormGroup?.get(field.id).get('value')" [required]="isRequired">
<mat-radio-button class="radio-button-item" name="{{propertiesFormGroup?.get(field.id).value}}" value="true">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.YES" | translate }}</mat-radio-button>
<mat-radio-button class="radio-button-item" name="{{propertiesFormGroup?.get(field.id).value}}" value="false">{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.ACTIONS.NO" | translate }}</mat-radio-button>
</mat-radio-group>
<small class="text-danger d-block" *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required') && propertiesFormGroup.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<small class="text-danger d-block" *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required') && propertiesFormGroup?.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</small>
<small class="text-muted d-inline-block" *ngIf="(isRequired) && !propertiesFormGroup.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</small>
<small class="text-muted d-inline-block" *ngIf="(isRequired) && !propertiesFormGroup?.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</small>
</div>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.RADIO_BOX" class="col-12">
<mat-radio-group [formControl]="propertiesFormGroup.get(field.id).get('value')" [required]="isRequired">
<mat-radio-group [formControl]="propertiesFormGroup?.get(field.id).get('value')" [required]="isRequired">
<mat-radio-button *ngFor="let option of field.data.options let index = index" class="radio-button-item" [value]="option.value">{{option.label}}</mat-radio-button>
</mat-radio-group>
<small class="text-danger d-block" *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required') && propertiesFormGroup.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<small class="text-danger d-block" *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required') && propertiesFormGroup?.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</small>
<small class="text-muted d-inline-block" *ngIf="(isRequired) && !propertiesFormGroup.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}} *</small>
<small class="text-muted d-inline-block" *ngIf="(isRequired) && !propertiesFormGroup?.get(field.id).get('value').touched">{{'GENERAL.VALIDATION.REQUIRED' | translate}} *</small>
</div>
<mat-form-field *ngSwitchCase="descriptionTemplateFieldTypeEnum.DATE_PICKER" class="col-12">
<input matInput placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" class="table-input" [matDatepicker]="date" [required]="isRequired"
[formControl]="propertiesFormGroup.get(field.id).get('value')">
[formControl]="propertiesFormGroup?.get(field.id).get('value')">
<mat-datepicker-toggle matSuffix [for]="date"></mat-datepicker-toggle>
<mat-datepicker #date></mat-datepicker>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">
{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
@ -188,16 +188,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="externalDatasetAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="externalDatasetAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -208,16 +208,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="dataRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="dataRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -227,16 +227,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="pubRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="pubRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -246,16 +246,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="journalRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="journalRepositoriesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -266,16 +266,16 @@
<div *ngIf="field.data" class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="taxonomiesAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="taxonomiesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -286,16 +286,16 @@
<div *ngIf="field.data" class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="licensesAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="licensesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -306,16 +306,16 @@
<div *ngIf="field.data" class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="publicationsAutoCompleteConfiguration" [required]="isRequired">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="publicationsAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -326,16 +326,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="registriesAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="registriesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -346,16 +346,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="servicesAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="servicesAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -365,7 +365,7 @@
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.TAGS" class="col-12">
<div class="row">
<mat-form-field class="col-md-12">
<app-multiple-auto-complete [configuration]="tagsAutoCompleteConfiguration" [formControl]="propertiesFormGroup.get(field.id).get('value')" placeholder="{{('DATASET-EDITOR.FIELDS.TAGS' | translate) + (isRequired? ' *': '')}}"></app-multiple-auto-complete>
<app-multiple-auto-complete [configuration]="tagsAutoCompleteConfiguration" [formControl]="propertiesFormGroup?.get(field.id).get('value')" placeholder="{{('DATASET-EDITOR.FIELDS.TAGS' | translate) + (isRequired? ' *': '')}}"></app-multiple-auto-complete>
</mat-form-field>
</div>
</div>
@ -374,16 +374,16 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="researchersAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="researchersAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
</ng-container>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
<mat-hint>{{ "TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT" | translate }}</mat-hint>
</mat-form-field>
@ -394,15 +394,15 @@
<div class="row">
<mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect">
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-multiple-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="organisationsAutoCompleteConfiguration">
</app-multiple-auto-complete>
</ng-container>
<ng-container *ngIf="!(field.data.multipleSelect)">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="organisationsAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</ng-container>
@ -415,18 +415,18 @@
<div class="row" *ngIf="datasetIdInitialized">
<mat-form-field class="col-md-12">
<input matInput class="col-md-12" [formControl]="getDatasetIdControl('identifier')" placeholder="{{(field.data.label) + (isRequired? ' *': '')}}"
[required]="isRequired" [disabled]="propertiesFormGroup.get(field.id).get('value').disabled">
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
[required]="isRequired" [disabled]="propertiesFormGroup?.get(field.id).get('value').disabled">
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
<mat-form-field class="col-md-12">
<mat-select class="col-md-12" [formControl]="getDatasetIdControl('type')" [placeholder]="('TYPES.DATASET-PROFILE-IDENTIFIER.IDENTIFIER-TYPE' | translate) + (isRequired? ' *': '')"
[disabled]="propertiesFormGroup.get(field.id).get('value').disabled">
[disabled]="propertiesFormGroup?.get(field.id).get('value').disabled">
<mat-option *ngFor="let type of datasetIdTypes" [value]="type.value">
{{ type.name }}
</mat-option>
</mat-select>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
</div>
@ -435,10 +435,10 @@
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.CURRENCY" class="col-12">
<div class="row">
<mat-form-field class="col-md-12">
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup.get(field.id).get('value')"
<app-single-auto-complete placeholder="{{ (field.data.label | translate) + (isRequired? ' *': '') }}" [formControl]="propertiesFormGroup?.get(field.id).get('value')"
[configuration]="currencyAutoCompleteConfiguration" [required]="isRequired">
</app-single-auto-complete>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
</div>
@ -448,7 +448,7 @@
<div class="row align-items-baseline">
<mat-form-field class="col-md-4">
<input matInput class="col-md-12" [formControl]="getDatasetIdControl('identifier')" placeholder="{{(field.data.label) + (isRequired? ' *': '')}}" [required]="isRequired">
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
<mat-form-field class="col-md-4">
@ -457,12 +457,12 @@
{{ type.name }}
</mat-option>
</mat-select>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</mat-form-field>
<div class="col-md-2">
<button type="button" mat-button class="lightblue-btn" (click)="validateId()" [disabled]="propertiesFormGroup.get(field.id).get('value').disabled">{{ "TYPES.DATASET-PROFILE-VALIDATOR.ACTION" | translate }}</button>
<mat-error *ngIf="propertiesFormGroup.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
<button type="button" mat-button class="lightblue-btn" (click)="validateId()" [disabled]="propertiesFormGroup?.get(field.id).get('value').disabled">{{ "TYPES.DATASET-PROFILE-VALIDATOR.ACTION" | translate }}</button>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-error>
</div>
<div class="col-md-1">

91
dmp-frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.ts
View File

@ -123,36 +123,37 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn
});
//TODO: validate that this logic is correct. Validation contenxt path might need to be fixed.
if (this.propertiesFormGroup.get(this.field.id).get('value') == null) {
const item: DescriptionFieldEditorModel = new DescriptionFieldEditorModel();
item.key = this.field.id;
this.propertiesFormGroup.addControl(this.field.id, item.buildForm());
}
// if (this.propertiesFormGroup.get(this.field.id).get('value') == null) {
// const item: DescriptionFieldEditorModel = new DescriptionFieldEditorModel();
// item.key = this.field.id;
// this.propertiesFormGroup.addControl(this.field.id, item.buildForm());
// }
if (this.propertiesFormGroup.get(this.field.id).get('value').value) {
this.visibilityRulesService.updateValueAndVisibility(this.field?.id, this.propertiesFormGroup.get(this.field.id).get('value').value);
}
// if (this.propertiesFormGroup.get(this.field.id).get('value').value) {
// this.visibilityRulesService.updateValueAndVisibility(this.field?.id, this.propertiesFormGroup.get(this.field.id).get('value').value);
// }
this.isRequired = this.field.validations?.includes(DescriptionTemplateFieldValidationType.Required);
if (this.field?.data?.fieldType === DescriptionTemplateFieldType.SELECT) {
if ((this.field.data as DescriptionTemplateSelectData).multipleSelect) {
const originalValue = <string>this.propertiesFormGroup.get(this.field.id).get('value').value;
if (originalValue !== null && typeof originalValue === 'string') {
let values = (<string>this.propertiesFormGroup.get(this.field.id).get('value').value).slice(1, -1).split(', ').filter((value) => !value.includes('"'));
let specialValue = (<string>this.propertiesFormGroup.get(this.field.id).get('value').value).split('"').filter((value) => !value.startsWith('[') && !value.endsWith(']') && !values.includes(value) && value !== ', ');
specialValue.forEach(value => values.push(value));
if (!originalValue.startsWith('[') && !originalValue.endsWith(']')) {
values = undefined;
values = [originalValue];
}
this.propertiesFormGroup.get(this.field.id).get('value').patchValue(values);
values.forEach(element => {
this.visibilityRulesService.updateValueAndVisibility(this.field?.id, element);
});
}
}
}
//TODO: refactor
// if (this.field?.data?.fieldType === DescriptionTemplateFieldType.SELECT) {
// if ((this.field.data as DescriptionTemplateSelectData).multipleSelect) {
// const originalValue = <string>this.propertiesFormGroup.get(this.field.id).get('value').value;
// if (originalValue !== null && typeof originalValue === 'string') {
// let values = (<string>this.propertiesFormGroup.get(this.field.id).get('value').value).slice(1, -1).split(', ').filter((value) => !value.includes('"'));
// let specialValue = (<string>this.propertiesFormGroup.get(this.field.id).get('value').value).split('"').filter((value) => !value.startsWith('[') && !value.endsWith(']') && !values.includes(value) && value !== ', ');
// specialValue.forEach(value => values.push(value));
// if (!originalValue.startsWith('[') && !originalValue.endsWith(']')) {
// values = undefined;
// values = [originalValue];
// }
// this.propertiesFormGroup.get(this.field.id).get('value').patchValue(values);
// values.forEach(element => {
// this.visibilityRulesService.updateValueAndVisibility(this.field?.id, element);
// });
// }
// }
// }
// Setup autocomplete configuration if needed
if (this.field?.data?.fieldType === DescriptionTemplateFieldType.EXTERNAL_SELECT) {
@ -303,8 +304,8 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn
};
break;
case DescriptionTemplateFieldType.DATASET_IDENTIFIER:
const value = this.propertiesFormGroup.get(this.field.id).get('value').value;
const disabled = this.propertiesFormGroup.get(this.field.id).disabled;
// const value = this.propertiesFormGroup.get(this.field.id).get('value').value;
// const disabled = this.propertiesFormGroup.get(this.field.id).disabled;
//TODO: Refactor this.
// this.form.removeControl('value');
// this.form.addControl('value', new DatasetIdModel(value).buildForm());
@ -323,8 +324,8 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn
};
break;
case DescriptionTemplateFieldType.VALIDATION:
const value1 = this.propertiesFormGroup.get(this.field.id).get('value').value;
const disabled1 = this.propertiesFormGroup.get(this.field.id).disabled;
// const value1 = this.propertiesFormGroup.get(this.field.id).get('value').value;
// const disabled1 = this.propertiesFormGroup.get(this.field.id).disabled;
//TODO: Refactor this.
// this.form.removeControl('value');
// this.form.addControl('value', new DatasetIdModel(value1).buildForm());
@ -344,21 +345,23 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn
}
// this.form = this.visibilityRulesService.getFormGroup(this.field.id);
this.propertiesFormGroup.get(this.field.id).get('value').valueChanges
.pipe(
takeUntil(this._destroyed),
distinctUntilChanged()
)
.subscribe(item => {
// if (this.field?.data?.fieldType === DescriptionTemplateFieldType.ComboBox && this.form.get('data').value.type === DatasetProfileComboBoxType.Select && this.form.get('data').value.multipleSelect) {
// item.forEach(element => {
// this.visibilityRulesService.updateValueAndVisibility(this.field?.id, element);
// });
//TODO: refactor
// this.propertiesFormGroup.get(this.field.id).get('value').valueChanges
// .pipe(
// takeUntil(this._destroyed),
// distinctUntilChanged()
// )
// .subscribe(item => {
// // if (this.field?.data?.fieldType === DescriptionTemplateFieldType.ComboBox && this.form.get('data').value.type === DatasetProfileComboBoxType.Select && this.form.get('data').value.multipleSelect) {
// // item.forEach(element => {
// // this.visibilityRulesService.updateValueAndVisibility(this.field?.id, element);
// // });
// } else {
this.visibilityRulesService.updateValueAndVisibility(this.field?.id, item);
// }
});
// // } else {
// this.visibilityRulesService.updateValueAndVisibility(this.field?.id, item);
// // }
// });
}
// _optionRemove(event) {

2
dmp-frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.html
View File

@ -16,7 +16,7 @@
<div class="col-12">
<div *ngIf="!fieldSet?.multiplicity?.tableView" class="row">
<!-- <app-form-field-set class="align-self-center col" [propertiesFormGroup]="propertiesFormGroup" [fieldSet]="fieldSet" [visibilityRulesService]="visibilityRulesService" [isChild]="false" [showDelete]="(fieldsetEntry.form.get('multiplicityItems').length) > 0"></app-form-field-set> -->
<app-form-field-set class="align-self-center col" [propertiesFormGroup]="propertiesFormGroup" [fieldSet]="fieldSet" [path]="path + '.' + (i+1)" [visibilityRulesService]="visibilityRulesService" [isChild]="false"></app-form-field-set>
<app-form-field-set *ngFor="let fieldSetPropertiesControl of propertiesFormGroup.get('fieldSets')?.get(fieldSet.id)?.get('items')?.controls" class="align-self-center col" [propertiesFormGroup]="fieldSetPropertiesControl.get('fields')" [fieldSet]="fieldSet" [path]="path + '.' + (i+1)" [visibilityRulesService]="visibilityRulesService" [isChild]="false"></app-form-field-set>
</div>
<ng-container *ngIf="fieldSet?.multiplicity?.tableView">
<div class="row">

14
dmp-frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts
View File

@ -57,13 +57,13 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On
// this.changeDetector.markForCheck();
// });
// Set comment fields to properties
this.section.fieldSets.forEach(fieldSet => {
if (fieldSet.hasCommentField && !this.propertiesFormGroup.contains('commentFieldValue' + fieldSet.id)) {
const item: DescriptionFieldEditorModel = new DescriptionFieldEditorModel();
item.key = 'commentFieldValue' + fieldSet.id;
this.propertiesFormGroup.addControl('commentFieldValue' + fieldSet.id, item.buildForm());
}
});
// this.section.fieldSets.forEach(fieldSet => {
// if (fieldSet.hasCommentField && !this.propertiesFormGroup.contains('commentFieldValue' + fieldSet.id)) {
// const item: DescriptionFieldEditorModel = new DescriptionFieldEditorModel();
// item.key = 'commentFieldValue' + fieldSet.id;
// this.propertiesFormGroup.addControl('commentFieldValue' + fieldSet.id, item.buildForm());
// }
// });
//TODO uncomment
// if (this.tocentry) {//maybe not needed as well

6
dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents.component.ts
View File

@ -199,6 +199,12 @@ export class TableOfContentsComponent extends BaseComponent implements OnInit, O
this._resetObserver();
}
if (changes['descriptionTemplate'] && changes.descriptionTemplate != null) {
this.tocentries = this.getTocEntries(this.descriptionTemplate);
if (this.visibilityRulesService) {
this.hiddenEntries = this._findHiddenEntries(this.tocentries);
}
}
if ('visibilityRulesService') {
if (this._visibilityRulesSubscription) {

4
dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
View File

@ -95,9 +95,9 @@
</div>
</li>
</ol>
<ul *ngIf="section.hasTemplates" class="add-dataset-option">
<ul *ngIf="item.id && section.hasTemplates" class="add-dataset-option">
<li>
<a class="add-dataset-action" (click)="addDescription(section.id)">
<a class="add-dataset-action" [routerLink]="['/descriptions/edit/' + item.id + '/' + section.id]">
<mat-icon>add</mat-icon>{{'DMP-EDITOR.ACTIONS.ADD-DESCRIPTION-IN-SECTION' | translate}}
</a>
</li>