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

Fix visibility dependencies for table view. Add missing question titles if a field is table.

This commit is contained in:
Konstantinos Triantafyllou 2023-01-10 13:08:56 +02:00
parent 2f5f34948e
commit 3e5dc85e04
12 changed files with 85 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dmp-frontend/src/app/core/pipes/field-value.pipe.ts
View File

@ -14,8 +14,6 @@ export class FieldValuePipe implements PipeTransform {
let value = controlValue.value; let value = controlValue.value;
let renderStyle = controlValue.viewStyle?.renderStyle; let renderStyle = controlValue.viewStyle?.renderStyle;
if (renderStyle && value) { if (renderStyle && value) {
console.log(renderStyle);
console.log(value);
switch (renderStyle) { switch (renderStyle) {
case DatasetProfileFieldViewStyle.Currency: case DatasetProfileFieldViewStyle.Currency:
if (value) { if (value) {

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

@ -204,7 +204,7 @@
</div> </div>
<div [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;" > <div [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;" >
<div *ngIf="previewForm && showPreview && firstField?.get('viewStyle').get('renderStyle').value" [@fade-in-fast]> <div *ngIf="previewForm && showPreview && firstField?.get('viewStyle').get('renderStyle').value" [@fade-in-fast]>
<app-form-section-inner [form]="previewForm" [tableView]="form.value.multiplicity.tableView"> <app-form-section-inner [form]="previewForm" [tableView]="form.getRawValue().multiplicity?.tableView">
</app-form-section-inner> </app-form-section-inner>
</div> </div>
</div> </div>

1
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts
View File

@ -532,7 +532,6 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme
if (profiledId && profiledId.length > 0) { if (profiledId && profiledId.length > 0) {
this.formGroup.removeControl('datasetProfileDefinition'); this.formGroup.removeControl('datasetProfileDefinition');
this.getDefinition(profiledId); this.getDefinition(profiledId);
console.log(this.table0fContents.tocentries.length + 1);
} }
} }

2
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-field-dialog/form-composite-field-dialog.component.html
View File

@ -5,7 +5,7 @@
</div> </div>
</div> </div>
<div *ngIf="data.formGroup" mat-dialog-content class="row"> <div *ngIf="data.formGroup" mat-dialog-content class="row">
<app-form-composite-field class="align-self-center col" [form]="data.formGroup" [datasetProfileId]="data.datasetProfileId" <app-form-composite-field class="align-self-center col" [form]="data.formGroup" [datasetProfileId]="data.datasetProfileId" [altVisibilityRulesService]="visibilityRulesService"
[isChild]="false" [showDelete]="false" [showTitle]="false" [placeholderTitle]="true"></app-form-composite-field> [isChild]="false" [showDelete]="false" [showTitle]="false" [placeholderTitle]="true"></app-form-composite-field>
</div> </div>
<div mat-dialog-actions class="row"> <div mat-dialog-actions class="row">

5
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-field-dialog/form-composite-field-dialog.component.ts
View File

@ -8,12 +8,13 @@ import {VisibilityRulesService} from "@app/ui/misc/dataset-description-form/visi
}) })
export class FormCompositeFieldDialogComponent { export class FormCompositeFieldDialogComponent {
public visibilityRulesService: VisibilityRulesService;
constructor( constructor(
private visibilityRulesService: VisibilityRulesService,
private dialogRef: MatDialogRef<FormCompositeFieldDialogComponent>, private dialogRef: MatDialogRef<FormCompositeFieldDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any @Inject(MAT_DIALOG_DATA) public data: any
) { ) {
this.visibilityRulesService.buildVisibilityRules([], this.data.formGroup); this.visibilityRulesService = data.visibilityRulesService;
} }
cancel() { cancel() {

6
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-field/form-composite-field.component.html
View File

@ -37,7 +37,7 @@
</a> </a>
</div> --> </div> -->
<div class="row"> <div class="row">
<h5 *ngIf="placeholderTitle" class="col-auto font-weight-bold">{{this.fieldFormGroup.get('data').value.label}}</h5> <h5 *ngIf="placeholderTitle && this.visibilityRulesService.checkElementVisibility(this.fieldFormGroup.get('id').value)" class="col-auto font-weight-bold">{{this.fieldFormGroup.get('data').value.label}}</h5>
</div> </div>
<app-form-field *ngIf="this.visibilityRulesService.checkElementVisibility(this.fieldFormGroup.get('id').value)" [form]="fieldFormGroup" class="col-12 compositeField" [datasetProfileId]="datasetProfileId" [isChild]="true"></app-form-field> <app-form-field *ngIf="this.visibilityRulesService.checkElementVisibility(this.fieldFormGroup.get('id').value)" [form]="fieldFormGroup" class="col-12 compositeField" [datasetProfileId]="datasetProfileId" [isChild]="true"></app-form-field>
<!-- <div *ngIf="fieldFormGroup" class="col-12"> <!-- <div *ngIf="fieldFormGroup" class="col-12">
@ -60,7 +60,9 @@
</div> </div>
</div> </div>
<ng-container *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value) && tableRow"> <ng-container *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value) && tableRow">
<td *ngFor="let fieldFormGroup of form.get('fields')['controls'];" class="text-wrap">{{fieldFormGroup.getRawValue() | fieldValue | translate}}</td> <ng-container *ngFor="let fieldFormGroup of form.get('fields')['controls'];">
<td *ngIf="this.visibilityRulesService.checkElementVisibility(this.fieldFormGroup.get('id').value)" class="text-wrap">{{fieldFormGroup.getRawValue() | fieldValue | translate}}</td>
</ng-container>
<td class="actions"> <td class="actions">
<button mat-icon-button type="button" class="deleteBtn btn-sm" (click)="editCompositeFieldInDialog()"> <button mat-icon-button type="button" class="deleteBtn btn-sm" (click)="editCompositeFieldInDialog()">
<mat-icon>edit</mat-icon> <mat-icon>edit</mat-icon>

15
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-field/form-composite-field.component.ts
View File

@ -26,21 +26,23 @@ export class FormCompositeFieldComponent extends BaseComponent {
@Input() tableRow: boolean = false; @Input() tableRow: boolean = false;
@Input() showTitle: boolean = true; @Input() showTitle: boolean = true;
@Input() placeholderTitle: boolean = false; @Input() placeholderTitle: boolean = false;
@Input() altVisibilityRulesService: VisibilityRulesService;
constructor( constructor(
private dialog: MatDialog, private dialog: MatDialog,
public visibilityRulesService: VisibilityRulesService, public visibilityRulesService: VisibilityRulesService,
private changeDetector: ChangeDetectorRef private changeDetector: ChangeDetectorRef
//private markForConsiderationService: MarkForConsiderationService,
) { ) {
super(); super();
this.visibilityRulesService.getElementVisibilityMapObservable().pipe(takeUntil(this._destroyed)).subscribe(x => {
this.changeDetector.markForCheck();
});
} }
ngOnInit() { ngOnInit() {
if(this.altVisibilityRulesService) {
this.visibilityRulesService = this.altVisibilityRulesService;
}
this.visibilityRulesService.getElementVisibilityMapObservable().pipe(takeUntil(this._destroyed)).subscribe(x => {
this.changeDetector.markForCheck();
});
if (this.tocentry) { if (this.tocentry) {
this.form = this.tocentry.form as FormGroup; this.form = this.tocentry.form as FormGroup;
} }
@ -62,7 +64,8 @@ export class FormCompositeFieldComponent extends BaseComponent {
disableClose: true, disableClose: true,
data: { data: {
formGroup: cloneAbstractControl(this.form), formGroup: cloneAbstractControl(this.form),
datasetProfileId: this.datasetProfileId datasetProfileId: this.datasetProfileId,
visibilityRulesService: this.visibilityRulesService
} }
}); });
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(data => { dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(data => {

44
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.html
View File

@ -8,21 +8,28 @@
<app-form-composite-field class="align-self-center col" [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId" <app-form-composite-field class="align-self-center col" [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId"
[isChild]="false" [showDelete]="(compositeFieldFormGroup.get('multiplicityItems').length) > 0"></app-form-composite-field> [isChild]="false" [showDelete]="(compositeFieldFormGroup.get('multiplicityItems').length) > 0"></app-form-composite-field>
</div> </div>
<table *ngIf="tableView" class="table table-bordered" style="table-layout: fixed"> <ng-container *ngIf="tableView">
<tr> <div class="row">
<th *ngFor="let fieldFormGroup of compositeFieldFormGroup.get('fields')['controls']; let i = index;" <div class="col-12">
class="text-truncate" [matTooltip]="fieldFormGroup.get('data').value.label" >{{fieldFormGroup.get('data').value.label}}</th> <app-form-composite-title class="row" [form]="compositeFieldFormGroup"></app-form-composite-title>
<th class="actions"></th> </div>
</tr> </div>
<tr app-form-composite-field [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId" <table class="table table-bordered" style="table-layout: fixed">
[isChild]="false" [showDelete]="(compositeFieldFormGroup.get('multiplicityItems').length) > 0" [tableRow]="true"></tr> <tr>
<ng-container *ngIf="compositeFieldFormGroup && tableView"> <ng-container *ngFor="let fieldFormGroup of compositeFieldFormGroup.get('fields')['controls']; let i = index;">
<tr app-form-composite-field *ngFor="let multipleCompositeFieldFormGroup of compositeFieldFormGroup.get('multiplicityItems')['controls']; let j = index" <th *ngIf="this.visibilityRulesService.checkElementVisibility(fieldFormGroup.get('id').value)" class="text-truncate" [matTooltip]="fieldFormGroup.get('data').value.label" >{{fieldFormGroup.get('data').value.label}}</th>
[form]="multipleCompositeFieldFormGroup" [datasetProfileId]="datasetProfileId" </ng-container>
[isChild]="true" [showDelete]="true" [tableRow]="true"></tr> <th class="actions"></th>
</ng-container> </tr>
<tr *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)"> <tr app-form-composite-field [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId"
<td [colSpan]="compositeFieldFormGroup.get('fields')['controls'].length + 1" class="text-center"> [isChild]="false" [showDelete]="(compositeFieldFormGroup.get('multiplicityItems').length) > 0" [tableRow]="true"></tr>
<ng-container *ngIf="compositeFieldFormGroup && tableView">
<tr app-form-composite-field *ngFor="let multipleCompositeFieldFormGroup of compositeFieldFormGroup.get('multiplicityItems')['controls']; let j = index"
[form]="multipleCompositeFieldFormGroup" [datasetProfileId]="datasetProfileId"
[isChild]="true" [showDelete]="true" [tableRow]="true"></tr>
</ng-container>
<tr *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)">
<td [colSpan]="visibleControls(compositeFieldFormGroup.get('fields')['controls']).length + 1" class="text-center">
<span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)" > <span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)" >
<button mat-icon-button color="primary" [disabled]="compositeFieldFormGroup.disabled"> <button mat-icon-button color="primary" [disabled]="compositeFieldFormGroup.disabled">
<mat-icon>add_circle</mat-icon> <mat-icon>add_circle</mat-icon>
@ -30,9 +37,10 @@
<span class="mt-1" *ngIf="compositeFieldFormGroup.get('multiplicity').value.placeholder">{{compositeFieldFormGroup.get('multiplicity').value.placeholder}}</span> <span class="mt-1" *ngIf="compositeFieldFormGroup.get('multiplicity').value.placeholder">{{compositeFieldFormGroup.get('multiplicity').value.placeholder}}</span>
<span class="mt-1" *ngIf="!compositeFieldFormGroup.get('multiplicity').value.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (compositeFieldFormGroup.get('multiplicity').value.tableView?'-TABLEVIEW':'')) | translate}}</span> <span class="mt-1" *ngIf="!compositeFieldFormGroup.get('multiplicity').value.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (compositeFieldFormGroup.get('multiplicity').value.tableView?'-TABLEVIEW':'')) | translate}}</span>
</span> </span>
</td> </td>
</tr> </tr>
</table> </table>
</ng-container>
</div> </div>
<div *ngIf="compositeFieldFormGroup && !tableView" class="col-12"> <div *ngIf="compositeFieldFormGroup && !tableView" class="col-12">

3
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.ts
View File

@ -100,4 +100,7 @@ export class FormSectionInnerComponent extends BaseComponent implements OnInit,
// next(compositeField: CompositeField) { // next(compositeField: CompositeField) {
// this.formFocusService.focusNext(compositeField); // this.formFocusService.focusNext(compositeField);
// } // }
visibleControls(controls: any[]) {
return controls.filter(control => this.visibilityRulesService.checkElementVisibility(control.get('id').value));
}
} }

59
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html
View File

@ -93,31 +93,40 @@
<app-form-composite-field [tocentry]="fieldsetEntry" class="align-self-center col" [form]="fieldsetEntry.form" [datasetProfileId]="datasetProfileId" <app-form-composite-field [tocentry]="fieldsetEntry" class="align-self-center col" [form]="fieldsetEntry.form" [datasetProfileId]="datasetProfileId"
[isChild]="false" [showDelete]="(fieldsetEntry.form.get('multiplicityItems').length) > 0"></app-form-composite-field> [isChild]="false" [showDelete]="(fieldsetEntry.form.get('multiplicityItems').length) > 0"></app-form-composite-field>
</div> </div>
<table *ngIf="fieldsetEntry.form.get('multiplicity').value.tableView" class="table table-bordered" style="table-layout: fixed"> <ng-container *ngIf="fieldsetEntry.form.get('multiplicity').value.tableView">
<tr> <div class="row">
<th *ngFor="let fieldFormGroup of fieldsetEntry.form.get('fields')['controls']; let i = index;" <div class="col-12">
class="text-wrap">{{fieldFormGroup.get('data').value.label}}</th> <app-form-composite-title [tocentry]="fieldsetEntry" class="row" [form]="form"></app-form-composite-title>
<th class="actions"></th> </div>
</tr> </div>
<tr app-form-composite-field [form]="fieldsetEntry.form" [datasetProfileId]="datasetProfileId" <table class="table table-bordered" style="table-layout: fixed">
[isChild]="false" [showDelete]="(fieldsetEntry.form.get('multiplicityItems').length) > 0" [tableRow]="true"></tr> <tr>
<ng-container *ngIf="fieldsetEntry.form && fieldsetEntry.form.get('multiplicity').value.tableView"> <ng-container *ngFor="let fieldFormGroup of fieldsetEntry.form.get('fields')['controls']; let i = index;">
<tr app-form-composite-field *ngFor="let multipleCompositeFieldFormGroup of fieldsetEntry.form.get('multiplicityItems')['controls']; let j = index" <th *ngIf="this.visibilityRulesService.checkElementVisibility(fieldFormGroup.get('id').value)"
[form]="multipleCompositeFieldFormGroup" [datasetProfileId]="datasetProfileId" class="text-wrap">{{fieldFormGroup.get('data').value.label}}</th>
[isChild]="true" [showDelete]="true" [tableRow]="true"></tr> </ng-container>
</ng-container> <th class="actions"></th>
<tr *ngIf="(fieldsetEntry.form.get('multiplicity').value.max - 1) > (fieldsetEntry.form.get('multiplicityItems').length)"> </tr>
<td [colSpan]="fieldsetEntry.form.get('fields')['controls'].length + 1" class="text-center"> <tr app-form-composite-field [form]="fieldsetEntry.form" [datasetProfileId]="datasetProfileId"
<span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)" > [isChild]="false" [showDelete]="(fieldsetEntry.form.get('multiplicityItems').length) > 0" [tableRow]="true"></tr>
<button mat-icon-button color="primary" [disabled]="fieldsetEntry.form.disabled"> <ng-container *ngIf="fieldsetEntry.form && fieldsetEntry.form.get('multiplicity').value.tableView">
<mat-icon>add_circle</mat-icon> <tr app-form-composite-field *ngFor="let multipleCompositeFieldFormGroup of fieldsetEntry.form.get('multiplicityItems')['controls']; let j = index"
</button> [form]="multipleCompositeFieldFormGroup" [datasetProfileId]="datasetProfileId"
<span class="mt-1" *ngIf="fieldsetEntry.form.get('multiplicity').value.placeholder">{{fieldsetEntry.form.get('multiplicity').value.placeholder}}</span> [isChild]="true" [showDelete]="true" [tableRow]="true"></tr>
<span class="mt-1" *ngIf="!fieldsetEntry.form.get('multiplicity').value.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldsetEntry.form.get('multiplicity').value.tableView?'-TABLEVIEW':'')) | translate}}</span> </ng-container>
</span> <tr *ngIf="(fieldsetEntry.form.get('multiplicity').value.max - 1) > (fieldsetEntry.form.get('multiplicityItems').length)">
</td> <td [colSpan]="visibleControls(fieldsetEntry.form.get('fields')['controls']).length + 1" class="text-center">
</tr> <span class="pointer d-inline-flex align-items-center" (click)="addMultipleField(i)">
</table> <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>
<span class="mt-1" *ngIf="!fieldsetEntry.form.get('multiplicity').value.placeholder">{{('DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' + (fieldsetEntry.form.get('multiplicity').value.tableView?'-TABLEVIEW':'')) | translate}}</span>
</span>
</td>
</tr>
</table>
</ng-container>
</div> </div>
<div *ngIf="fieldsetEntry.form && !fieldsetEntry.form.get('multiplicity').value.tableView" class="col-12"> <div *ngIf="fieldsetEntry.form && !fieldsetEntry.form.get('multiplicity').value.tableView" class="col-12">

4
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.ts
View File

@ -269,4 +269,8 @@ export class FormSectionComponent extends BaseComponent implements OnInit, OnCha
this.panelExpanded = true; this.panelExpanded = true;
this.askedToScroll.emit(id); this.askedToScroll.emit(id);
} }
visibleControls(controls: any[]) {
return controls.filter(control => this.visibilityRulesService.checkElementVisibility(control.get('id').value));
}
} }

1
dmp-frontend/src/app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service.ts
View File

@ -346,7 +346,6 @@ export class VisibilityRulesService {
public addNewRule(rule: Rule, currentVisibility = this.DEFAULTVISIBILITY): void { public addNewRule(rule: Rule, currentVisibility = this.DEFAULTVISIBILITY): void {
const targetId = rule.targetField; const targetId = rule.targetField;
const sourceId = rule.sourceField; const sourceId = rule.sourceField;
console.log(rule);
this.visibilityRuleContext.addToVisibilityRulesContext(rule); this.visibilityRuleContext.addToVisibilityRulesContext(rule);