From f2312dabcd5879cc8e7e8224fe89b8644dede6db Mon Sep 17 00:00:00 2001 From: "CITE\\dtziotzios" Date: Tue, 6 Aug 2024 13:47:39 +0300 Subject: [PATCH] ui fix for description editor change ref --- frontend/.vscode/settings.json | 3 +++ .../components/form-field/form-field.component.ts | 15 ++++++--------- .../form-section/form-section.component.ts | 10 +++++++--- .../description-form.component.ts | 8 ++++---- 4 files changed, 20 insertions(+), 16 deletions(-) create mode 100644 frontend/.vscode/settings.json diff --git a/frontend/.vscode/settings.json b/frontend/.vscode/settings.json new file mode 100644 index 000000000..997638366 --- /dev/null +++ b/frontend/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "html.format.wrapLineLength": 0 +} \ No newline at end of file diff --git a/frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.ts b/frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.ts index bee984270..0b0c01d27 100644 --- a/frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.ts +++ b/frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.ts @@ -8,9 +8,8 @@ import { DescriptionTemplateFieldValidationType } from '@app/core/common/enum/de import { DescriptionTemplateField, DescriptionTemplateFieldSet, DescriptionTemplateLabelAndMultiplicityData, DescriptionTemplateUploadData } from '@app/core/model/description-template/description-template'; import { StorageFile } from '@app/core/model/storage-file/storage-file'; import { DescriptionService } from '@app/core/services/description/description.service'; -import { PlanService } from '@app/core/services/plan/plan.service'; import { SnackBarNotificationLevel, UiNotificationService } from "@app/core/services/notification/ui-notification-service"; -import { ReferenceService } from '@app/core/services/reference/reference.service'; +import { PlanService } from '@app/core/services/plan/plan.service'; import { StorageFileService } from '@app/core/services/storage-file/storage-file.service'; import { TagService } from '@app/core/services/tag/tag.service'; import { FileUtils } from '@app/core/services/utilities/file-utils.service'; @@ -83,13 +82,11 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn public planService: PlanService, public descriptionService: DescriptionService, public tagService: TagService, - private cdr: ChangeDetectorRef, + private changeDetectorRef: ChangeDetectorRef, private uiNotificationService: UiNotificationService, public dialog: MatDialog, private fileUtils: FileUtils, - private referenceService: ReferenceService, private storageFileService: StorageFileService, - private changeDetectorRef: ChangeDetectorRef, private httpErrorHandlingService: HttpErrorHandlingService, private descriptionFormService: DescriptionFormService, ) { @@ -119,7 +116,7 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn this.applyFieldType(); } - this.descriptionFormService.getDetectChangesObservable().pipe(takeUntil(this._destroyed)).subscribe( x => this.changeDetectorRef.markForCheck()); + this.descriptionFormService.getDetectChangesObservable().pipe(takeUntil(this._destroyed)).subscribe(x => this.changeDetectorRef.markForCheck()); } private applyFieldType() { @@ -132,6 +129,7 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn ) .subscribe(item => { this.visibilityRulesService.updateVisibilityForSource(this.field?.id); + this.descriptionFormService.detectChanges(true); }); } @@ -210,7 +208,7 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn .pipe(takeUntil(this._destroyed)).subscribe((response) => { this.propertiesFormGroup?.get(this.field.id).get('textValue').patchValue(response[0].id.toString()); this.createFileNameDisplay(response[0].name, response[0].extension); - this.cdr.detectChanges(); + this.changeDetectorRef.detectChanges(); }, error => { this.onCallbackUploadFail(error.error); }) @@ -270,8 +268,7 @@ export class DescriptionFormFieldComponent extends BaseComponent implements OnIn onRemove(makeFilesNull: boolean = true) { this.makeFilesNull() - this.cdr.detectChanges(); - + this.changeDetectorRef.detectChanges(); } makeFilesNull() { diff --git a/frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts b/frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts index 6a27100a9..7811af77e 100644 --- a/frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts +++ b/frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts @@ -1,14 +1,16 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core'; import { UntypedFormGroup } from '@angular/forms'; import { DescriptionTemplateSection } from '@app/core/model/description-template/description-template'; +import { PlanUser } from '@app/core/model/plan/plan'; import { BaseComponent } from '@common/base/base.component'; import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model'; +import { Guid } from '@common/types/guid'; import { ToCEntry } from '../../../table-of-contents/models/toc-entry'; import { ToCEntryType } from '../../../table-of-contents/models/toc-entry-type.enum'; import { LinkToScroll } from '../../../table-of-contents/table-of-contents.component'; import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service'; -import { Guid } from '@common/types/guid'; -import { PlanUser } from '@app/core/model/plan/plan'; +import { DescriptionFormService } from '../services/description-form.service'; +import { takeUntil } from 'rxjs'; @Component({ @@ -38,6 +40,7 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On @Input() validationErrorModel: ValidationErrorModel; constructor( + private descriptionFormService: DescriptionFormService, private changeDetector: ChangeDetectorRef ) { super(); @@ -45,6 +48,7 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On } ngOnInit() { + this.descriptionFormService.getDetectChangesObservable().pipe(takeUntil(this._destroyed)).subscribe( _ => this.changeDetector.markForCheck() ); } ngOnChanges(changes: SimpleChanges) { @@ -62,7 +66,7 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On } } - onAskedToScroll(event:MouseEvent, id: string) { + onAskedToScroll(event: MouseEvent, id: string) { event?.stopPropagation(); this.panelExpanded = true; this.askedToScroll.emit(id); diff --git a/frontend/src/app/ui/description/editor/description-form/description-form.component.ts b/frontend/src/app/ui/description/editor/description-form/description-form.component.ts index 7f6ec9896..31ab5dcf0 100644 --- a/frontend/src/app/ui/description/editor/description-form/description-form.component.ts +++ b/frontend/src/app/ui/description/editor/description-form/description-form.component.ts @@ -1,15 +1,15 @@ -import { AfterViewInit, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core'; +import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core'; import { UntypedFormGroup } from '@angular/forms'; import { MatExpansionPanel } from '@angular/material/expansion'; +import { AnnotationEntityType } from '@app/core/common/enum/annotation-entity-type'; import { DescriptionTemplate } from '@app/core/model/description-template/description-template'; +import { PlanUser } from '@app/core/model/plan/plan'; import { BaseComponent } from '@common/base/base.component'; import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model'; import { Guid } from '@common/types/guid'; -import { LinkToScroll } from '../table-of-contents/table-of-contents.component'; import { FormAnnotationService } from '../../../annotations/annotation-dialog-component/form-annotation.service'; +import { LinkToScroll } from '../table-of-contents/table-of-contents.component'; import { VisibilityRulesService } from './visibility-rules/visibility-rules.service'; -import { PlanUser } from '@app/core/model/plan/plan'; -import { AnnotationEntityType } from '@app/core/common/enum/annotation-entity-type'; @Component({ selector: 'app-description-form',