From 30d552265bce10e90a568fb08bbc15248b94b0f6 Mon Sep 17 00:00:00 2001 From: Sofia Papacharalampous Date: Tue, 23 Apr 2024 14:26:13 +0300 Subject: [PATCH] description editor > table-of-content > error indication bug fix --- .../editor/description-editor.component.ts | 15 ++---- .../table-of-contents-internal.ts | 51 +++++++++++++++---- 2 files changed, 44 insertions(+), 22 deletions(-) diff --git a/dmp-frontend/src/app/ui/description/editor/description-editor.component.ts b/dmp-frontend/src/app/ui/description/editor/description-editor.component.ts index bda067f53..f1ea2cc50 100644 --- a/dmp-frontend/src/app/ui/description/editor/description-editor.component.ts +++ b/dmp-frontend/src/app/ui/description/editor/description-editor.component.ts @@ -576,6 +576,7 @@ export class DescriptionEditorComponent extends BaseEditor x === AppPermission.EditDescription); this.formGroup = this.editorModel.buildForm(null, this.isDeleted || !canedit); if (this.item.descriptionTemplate?.definition) this.visibilityRulesService.setContext(this.item.descriptionTemplate.definition, this.formGroup.get('properties')); + if (this.item.descriptionTemplate?.definition) this.pageToFieldSetMap = this.mapPageToFieldSet(this.item.descriptionTemplate);; // this.selectedSystemFields = this.selectedSystemFieldDisabled(); this.descriptionEditorService.setValidationErrorModel(this.editorModel.validationErrorModel); @@ -897,9 +898,6 @@ export class DescriptionEditorComponent extends BaseEditor x.sectionId == sectionId && x.descriptionTemplateGroupId == descriptionTemplate.groupId); this.formGroup.get('dmpDescriptionTemplateId').setValue(this.item.dmpDescriptionTemplate.id); if (descriptionTemplate.definition) this.visibilityRulesService.setContext(this.item.descriptionTemplate.definition, this.formGroup.get('properties')); - + if (descriptionTemplate.definition) this.pageToFieldSetMap = this.mapPageToFieldSet(this.item.descriptionTemplate); }); // this.formGroup.removeControl('descriptionProfileDefinition'); // this.getDefinition(profiledId); } } - - checkPagesForErrors(): void { - //this.baseInfoPage = ... - - - this.pageToFieldSetMap = this.mapPageToFieldSet(this.item.descriptionTemplate); - } - + mapPageToFieldSet(descriptionTemplate: DescriptionTemplate): Map { const pageToFieldSetMap = new Map(); diff --git a/dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.ts b/dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.ts index 1cc393d39..ecf0ca556 100644 --- a/dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.ts +++ b/dmp-frontend/src/app/ui/description/editor/table-of-contents/table-of-contents-internal/table-of-contents-internal.ts @@ -1,17 +1,18 @@ -import { Component, EventEmitter, Input, OnInit, Output, QueryList, SimpleChanges, ViewChildren } from '@angular/core'; +import { Component, EventEmitter, Input, OnDestroy, OnInit, Output, QueryList, SimpleChanges, ViewChildren } from '@angular/core'; import { UntypedFormGroup } from '@angular/forms'; import { VisibilityRulesService } from '@app/ui/description/editor/description-form/visibility-rules/visibility-rules.service'; import { Guid } from '@common/types/guid'; import { ToCEntry } from '../models/toc-entry'; import { ToCEntryType } from '../models/toc-entry-type.enum'; import { DescriptionFieldIndicator } from '../../description-editor.model'; +import { Observable, Subscription, map } from 'rxjs'; @Component({ selector: 'table-of-contents-internal', styleUrls: ['./table-of-contents-internal.scss'], templateUrl: './table-of-contents-internal.html' }) -export class TableOfContentsInternal implements OnInit { +export class TableOfContentsInternal implements OnInit, OnDestroy { @Input() tocentries: ToCEntry[] = null; @Input() selected: ToCEntry = null; @@ -30,9 +31,12 @@ export class TableOfContentsInternal implements OnInit { @Input() parentId: string; @Input() parentMap: Map = new Map(); @Input() updatedMap: Map = new Map(); + tocEntriesStateSubscriptions: Subscription[] = []; + tocEntriesStateMap: Map = new Map(); constructor() { } + ngOnInit(): void { // console.log('component created' + JSON.stringify(this.tocentries)); if (this.tocentries) { @@ -49,7 +53,7 @@ export class TableOfContentsInternal implements OnInit { } if (this.parentMap) { - this.updatedMap = this.updateMap(this.tocentries, this.parentMap); + this.refreshErrorIndicators(); } } } @@ -65,6 +69,10 @@ export class TableOfContentsInternal implements OnInit { } } } + + if (changes.parentMap && this.parentMap) { + this.refreshErrorIndicators(); + } // if (!this.isActive && this.links && this.links.length > 0) { // this.links.forEach(link => { // link.selected = false; @@ -73,6 +81,27 @@ export class TableOfContentsInternal implements OnInit { // } } + ngOnDestroy(): void { + this.tocEntriesStateSubscriptions.forEach((errorSubscription: Subscription) => { + errorSubscription.unsubscribe(); + }); + } + + refreshErrorIndicators(): void { + this.updatedMap = this.updateMap(this.tocentries, this.parentMap); + for (let entry of this.tocentries) { + this.tocEntriesStateMap.set(entry.id, false); + + this.tocEntriesStateSubscriptions.push( + this.propertiesFormGroup.statusChanges + .pipe(map(() => this.hasErrors(entry.id))) + .subscribe(next => { + this.tocEntriesStateMap.set(entry.id, next); + }) + ); + } + } + updateMap(entries: ToCEntry[], parentMap:Map): Map { if (this.parentId == null) return parentMap; @@ -92,7 +121,7 @@ export class TableOfContentsInternal implements OnInit { } hasErrors(entryId: string): boolean { - if (this.updatedMap.size == 0) return true; + if (this.updatedMap.size == 0) return false; const fields: DescriptionFieldIndicator[] = this.updatedMap.get(entryId); @@ -106,12 +135,14 @@ export class TableOfContentsInternal implements OnInit { return false; } - isFormFieldValid(formFildName: string):boolean { - if (this.propertiesFormGroup?.get(formFildName) == null) return true; + isFormFieldValid(formFieldName: string):boolean { + const formField = this.propertiesFormGroup?.get(formFieldName); + if (formField == null) return true; + + if (formField.dirty === false + && formField.touched === false) return true; - if (this.propertiesFormGroup.get(formFildName).touched === false) return true; - - return this.propertiesFormGroup.get(formFildName).valid; + return formField.valid; } toggleExpand(index) { @@ -163,7 +194,7 @@ export class TableOfContentsInternal implements OnInit { myClass['section'] = true; } - if(this.hasErrors(entry.id)) { + if(this.tocEntriesStateMap?.get(entry.id) === true) { myClass['text-danger'] = true; } return myClass;