Backend: Fix a bug with compareTo of a field throwing an error because ordinal is not exists. FrontEnd: Initialize visibility rules for multiple fields coming from service according to their parents.

This commit is contained in:
Konstantinos Triantafyllou 2022-06-23 15:38:48 +03:00
parent 18e98938d5
commit 304a6cfdb3
5 changed files with 167 additions and 161 deletions

View File

@ -238,7 +238,14 @@ public class Field implements Comparable, PropertiesModelBuilder, ViewStyleDefin
@Override
public int compareTo(Object o) {
return this.ordinal.compareTo(((Field) o).getOrdinal());
Field comparedField = (Field) o;
if(this.ordinal != null) {
return this.ordinal.compareTo(comparedField.getOrdinal());
} else if (comparedField.getOrdinal() != null) {
return comparedField.getOrdinal().compareTo(this.ordinal);
} else {
return 0;
}
}
@Override

View File

@ -20,8 +20,8 @@
</div>
<div *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)"
class="col-12 mt-1 ml-0 mr-0 addOneFieldButton">
<span class="pointer d-inline-flex align-items-center">
<button mat-icon-button color="primary" (click)="addMultipleField(i)" [disabled]="compositeFieldFormGroup.disabled">
<span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)" >
<button mat-icon-button color="primary" [disabled]="compositeFieldFormGroup.disabled">
<mat-icon>add_circle</mat-icon>
</button>
<span class="mt-1" *ngIf="compositeFieldFormGroup.get('multiplicity').value.placeholder">{{compositeFieldFormGroup.get('multiplicity').value.placeholder}}</span>

View File

@ -32,8 +32,8 @@
</div>
<div *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)"
class="col-12 mt-1 ml-0 mr-0 addOneFieldButton">
<span class="pointer d-inline-flex align-items-center">
<button mat-icon-button color="primary" (click)="addMultipleField(i)" [disabled]="compositeFieldFormGroup.disabled">
<span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)">
<button mat-icon-button color="primary" [disabled]="compositeFieldFormGroup.disabled">
<mat-icon>add_circle</mat-icon>
</button>
<span class="mt-1" *ngIf="compositeFieldFormGroup.get('multiplicity').value.placeholder">{{compositeFieldFormGroup.get('multiplicity').value.placeholder}}</span>
@ -105,8 +105,8 @@
</div>
<div *ngIf="(fieldsetEntry.form.get('multiplicity').value.max - 1) > (fieldsetEntry.form.get('multiplicityItems').length)"
class="col-12 mt-1 ml-0 mr-0 addOneFieldButton">
<span class="pointer d-inline-flex align-items-center">
<button mat-icon-button color="primary" (click)="addMultipleField(i)" [disabled]="fieldsetEntry.form.disabled">
<span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)">
<button mat-icon-button color="primary" [disabled]="fieldsetEntry.form.disabled">
<mat-icon>add_circle</mat-icon>
</button>
<span class="mt-1" *ngIf="fieldsetEntry.form.get('multiplicity').value.placeholder">{{fieldsetEntry.form.get('multiplicity').value.placeholder}}</span>

View File

@ -1,14 +1,24 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
import { FormArray, FormGroup } from '@angular/forms';
import { Rule } from '@app/core/model/dataset-profile-definition/rule';
import { BaseComponent } from '@common/base/base.component';
import { takeUntil } from 'rxjs/operators';
import { DatasetDescriptionCompositeFieldEditorModel } from '../../dataset-description-form.model';
import { ToCEntry, ToCEntryType } from '../../dataset-description.component';
import { FormFocusService } from '../../form-focus/form-focus.service';
import { LinkToScroll } from '../../tableOfContentsMaterial/table-of-contents';
import { VisibilityRuleSource } from '../../visibility-rules/models/visibility-rule-source';
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
EventEmitter,
Input,
OnChanges,
OnInit,
Output,
SimpleChanges
} from '@angular/core';
import {FormArray, FormGroup} from '@angular/forms';
import {Rule} from '@app/core/model/dataset-profile-definition/rule';
import {BaseComponent} from '@common/base/base.component';
import {takeUntil} from 'rxjs/operators';
import {DatasetDescriptionCompositeFieldEditorModel} from '../../dataset-description-form.model';
import {ToCEntry, ToCEntryType} from '../../dataset-description.component';
import {FormFocusService} from '../../form-focus/form-focus.service';
import {LinkToScroll} from '../../tableOfContentsMaterial/table-of-contents';
import {VisibilityRuleSource} from '../../visibility-rules/models/visibility-rule-source';
import {VisibilityRulesService} from '../../visibility-rules/visibility-rules.service';
@Component({
@ -57,6 +67,7 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
if (this.tocentry) {//maybe not needed as well
this.form = this.tocentry.form as FormGroup;
}
this.initMultipleFieldsVisibility();
}
ngOnChanges(changes: SimpleChanges) {
@ -78,26 +89,9 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
// this.visibilityRulesService.triggerVisibilityEvaluation();
// }
addMultipleField(fieldsetIndex: number) {
const compositeFieldToBeCloned = (this.form.get('compositeFields').get('' + fieldsetIndex) as FormGroup).getRawValue();
const multiplicityItemsArray = (<FormArray>(this.form.get('compositeFields').get('' + fieldsetIndex).get('multiplicityItems')));
const ordinal = multiplicityItemsArray.length ? multiplicityItemsArray.controls.reduce((ordinal, currentControl) => {
const currentOrdinal = currentControl.get('ordinal').value as number;
if (currentOrdinal >= ordinal) {
return currentOrdinal + 1;
}
return ordinal as number;
}, 0) : 0;
const idMappings = [] as { old: string, new: string }[];
const compositeField: DatasetDescriptionCompositeFieldEditorModel = new DatasetDescriptionCompositeFieldEditorModel().cloneForMultiplicity(compositeFieldToBeCloned, ordinal, idMappings);
setMultipleFieldVisibility(parentCompositeField, compositeField: DatasetDescriptionCompositeFieldEditorModel, idMappings: { old: string, new: string }[]) {
// ** COMPOSITE FIELD IS SHOWN OR HIDDEN FROM ANOTHER ELEMENT
const compositeFieldVisibilityDependencies = this.visibilityRulesService.getVisibilityDependency(compositeFieldToBeCloned);
const compositeFieldVisibilityDependencies = this.visibilityRulesService.getVisibilityDependency(parentCompositeField);
if (compositeFieldVisibilityDependencies && compositeFieldVisibilityDependencies.length) {
compositeFieldVisibilityDependencies.forEach(x => {
@ -112,30 +106,21 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
}
// console.log('idMappings ', idMappings);
compositeFieldToBeCloned.fields.forEach(element => {
parentCompositeField.fields.forEach(element => {
// console.log(this.visibilityRulesService.getVisibilityDependency(element.id));
const dependency = this.visibilityRulesService.getVisibilityDependency(element.id);
try {
if (dependency && dependency.length) {
// * INNER VISIBILITY DEPENDENCIES
// * IF INNER INPUT HIDES ANOTHER INNER INPUT
const innerDependency = compositeFieldToBeCloned.fields.reduce((innerD, currentElement) => {
const innerDependency = parentCompositeField.fields.reduce((innerD, currentElement) => {
const innerDependecies = dependency.filter(d => d.sourceControlId === currentElement.id);
return [...innerD, ...innerDependecies];
}, []) as VisibilityRuleSource[];
if (innerDependency.length) {
//Build visibility source
const updatedRules = innerDependency.map(x => {
const newId = idMappings.find(y => y.old === x.sourceControlId);
return { ...x, sourceControlId: newId.new };
return {...x, sourceControlId: newId.new};
});
// const visRule: VisibilityRule = {
// targetControlId: idMappings.find(x => x.old === element.id).new,
@ -173,7 +158,8 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
const outerRules = (this.visibilityRulesService.getVisibilityDependency(target) as VisibilityRuleSource[]).filter(x => x.sourceControlId === element.id);
const updatedRules = outerRules.map(x => {
return { ...x, sourceControlId: idMappings.find(y => y.old === element.id).new };
console.log(idMappings, element);
return {...x, sourceControlId: idMappings.find(y => y.old === element.id).new};
});
// const visRule: VisibilityRule = {
@ -190,24 +176,14 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
type: ''
} as Rule;
})
rules.forEach(rule => {
this.visibilityRulesService.addNewRule(rule);
})
// this.visibilityRulesService.appendVisibilityRule(visRule);
});
// * IF INNER INPUT IS HIDDEN BY OUTER INPUT
if (dependency && dependency.length) {
const fieldsThatHideInnerElement = dependency.filter(x => !innerIds.includes(x.sourceControlId));
if (fieldsThatHideInnerElement.length) {
fieldsThatHideInnerElement.forEach(x => {
const visRule: Rule = {
@ -221,16 +197,41 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
});
}
}
// console.log(`for ${element.id} targets are`, outerTargets);
} catch {
console.log('error');
});
}
initMultipleFieldsVisibility() {
(this.form.get('compositeFields') as FormArray).controls.forEach(control => {
let parentCompositeField = (control as FormGroup).getRawValue();
if (parentCompositeField.multiplicityItems && parentCompositeField.multiplicityItems.length > 0) {
parentCompositeField.multiplicityItems.forEach(compositeField => {
let idMappings: { old: string, new: string }[] = [{old: parentCompositeField.id, new: compositeField.id}];
parentCompositeField.fields.forEach((field, index) => {
idMappings.push({ old: field.id, new: compositeField.fields[index].id });
});
// console.log(this.visibilityRulesService);
// console.log(this.visibilityRulesService.getVisibilityDependency());
this.setMultipleFieldVisibility(parentCompositeField, compositeField, idMappings);
})
}
});
}
addMultipleField(fieldsetIndex: number) {
const compositeFieldToBeCloned = (this.form.get('compositeFields').get('' + fieldsetIndex) as FormGroup).getRawValue();
const multiplicityItemsArray = (<FormArray>(this.form.get('compositeFields').get('' + fieldsetIndex).get('multiplicityItems')));
const ordinal = multiplicityItemsArray.length ? multiplicityItemsArray.controls.reduce((ordinal, currentControl) => {
const currentOrdinal = currentControl.get('ordinal').value as number;
if (currentOrdinal >= ordinal) {
return currentOrdinal + 1;
}
return ordinal as number;
}, 0) : 0;
const idMappings = [] as { old: string, new: string }[];
const compositeField: DatasetDescriptionCompositeFieldEditorModel = new DatasetDescriptionCompositeFieldEditorModel().cloneForMultiplicity(compositeFieldToBeCloned, ordinal, idMappings);
this.setMultipleFieldVisibility(compositeFieldToBeCloned, compositeField, idMappings);
multiplicityItemsArray.push(compositeField.buildForm());
}
@ -264,7 +265,6 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
// }
onAskedToScroll(id: string) {
this.panelExpanded = true;
this.askedToScroll.emit(id);

View File

@ -46,7 +46,6 @@ export class VisibilityRulesService {
}
public updateValueAndVisibility(id: string, value: any) {
console.log('updateValueAndVisibility');
const visibilityRules = this.visibilityRuleContext.rules.filter(item => item.sourceVisibilityRules.filter(source => source.sourceControlId === id).length > 0);
if (visibilityRules.length > 0) {
visibilityRules.forEach(item => this.evaluateVisibility(item, value, id));
@ -347,7 +346,7 @@ export class VisibilityRulesService {
public addNewRule(rule: Rule, currentVisibility = this.DEFAULTVISIBILITY): void {
const targetId = rule.targetField;
const sourceId = rule.sourceField;
console.log(rule);
this.visibilityRuleContext.addToVisibilityRulesContext(rule);