From 2253905a64a26fd34e5812f7c144ec3a2a5b3d53 Mon Sep 17 00:00:00 2001 From: Nicoleta Panaghiu Date: Wed, 12 Jul 2023 14:38:45 +0300 Subject: [PATCH] RED-6973: Disabled simultaneous in-place editing. --- apps/red-ui/src/app/app-routing.module.ts | 2 ++ apps/red-ui/src/app/guards/edit-attribute.guard.ts | 7 +++++++ .../file-attribute/file-attribute.component.ts | 13 ++++++++++++- .../dossier-overview-screen-header.component.html | 2 +- .../entity-services/file-attributes.service.ts | 5 +++-- 5 files changed, 25 insertions(+), 4 deletions(-) create mode 100644 apps/red-ui/src/app/guards/edit-attribute.guard.ts diff --git a/apps/red-ui/src/app/app-routing.module.ts b/apps/red-ui/src/app/app-routing.module.ts index ccf478b4b..1c0c63e09 100644 --- a/apps/red-ui/src/app/app-routing.module.ts +++ b/apps/red-ui/src/app/app-routing.module.ts @@ -22,6 +22,7 @@ import { CustomRouteReuseStrategy } from '@iqser/common-ui/lib/utils'; import { ifLoggedIn } from '@guards/if-logged-in.guard'; import { ifNotLoggedIn } from '@guards/if-not-logged-in.guard'; import { TenantSelectComponent } from '@iqser/common-ui/lib/tenants'; +import { editAttributeGuard } from '@guards/edit-attribute.guard'; const dossierTemplateIdRoutes: IqserRoutes = [ { @@ -37,6 +38,7 @@ const dossierTemplateIdRoutes: IqserRoutes = [ { path: `:${DOSSIER_ID}`, canActivate: [CompositeRouteGuard, IqserPermissionsGuard], + canDeactivate: [editAttributeGuard], data: { routeGuards: [DossierFilesGuard], breadcrumbs: [BreadcrumbTypes.dossierTemplate, BreadcrumbTypes.dossier], diff --git a/apps/red-ui/src/app/guards/edit-attribute.guard.ts b/apps/red-ui/src/app/guards/edit-attribute.guard.ts new file mode 100644 index 000000000..ea4027e88 --- /dev/null +++ b/apps/red-ui/src/app/guards/edit-attribute.guard.ts @@ -0,0 +1,7 @@ +import { CanDeactivateFn } from '@angular/router'; +import { inject } from '@angular/core'; +import { FileAttributesService } from '@services/entity-services/file-attributes.service'; +import { DossierOverviewScreenComponent } from '../modules/dossier-overview/screen/dossier-overview-screen.component'; + +export const editAttributeGuard: CanDeactivateFn = () => + !inject(FileAttributesService).isEditingFileAttribute(); diff --git a/apps/red-ui/src/app/modules/dossier-overview/components/file-attribute/file-attribute.component.ts b/apps/red-ui/src/app/modules/dossier-overview/components/file-attribute/file-attribute.component.ts index f9b20b80b..75d922bec 100644 --- a/apps/red-ui/src/app/modules/dossier-overview/components/file-attribute/file-attribute.component.ts +++ b/apps/red-ui/src/app/modules/dossier-overview/components/file-attribute/file-attribute.component.ts @@ -11,6 +11,7 @@ import dayjs from 'dayjs'; import { NavigationEnd, Router } from '@angular/router'; import { filter, map, tap } from 'rxjs/operators'; import { ConfigService } from '../../config.service'; +import { Debounce } from '@iqser/common-ui/lib/utils'; @Component({ selector: 'redaction-file-attribute [fileAttribute] [file] [dossier]', @@ -28,6 +29,8 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr readonly #shouldClose = computed( () => this.fileAttributesService.isEditingFileAttribute() && + !!this.file && + !!this.fileAttribute && (this.fileAttribute.id !== this.fileAttributesService.openAttributeEdit() || this.file.fileId !== this.fileAttributesService.fileEdit()), ); @@ -71,6 +74,7 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr return this.file.fileAttributes.attributeIdToValue[this.fileAttribute.id]; } + @Debounce(50) @HostListener('document:click') clickOutside() { if (this.isInEditMode && this.closedDatepicker) { @@ -85,6 +89,7 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr async editFileAttribute($event: MouseEvent): Promise { if (!this.file.isInitialProcessing && this.permissionsService.canEditFileAttributes(this.file, this.dossier)) { $event.stopPropagation(); + this.fileAttributesService.openAttributeEdits.mutate(value => value.push(this.fileAttribute.id)); this.#toggleEdit(); this.fileAttributesService.setFileEdit(this.file.fileId); this.fileAttributesService.setOpenAttributeEdit(this.fileAttribute.id); @@ -116,6 +121,13 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr if (this.isInEditMode) { this.form = this.#getForm(); this.#toggleEdit(); + this.fileAttributesService.openAttributeEdits.mutate(value => { + for (let index = 0; index < value.length; index++) { + if (value[index] === this.fileAttribute.id) { + value.splice(index, 1); + } + } + }); } } @@ -153,7 +165,6 @@ export class FileAttributeComponent extends BaseFormComponent implements OnDestr } this.isInEditMode = !this.isInEditMode; - this.fileAttributesService.isEditingFileAttribute.set(this.isInEditMode); if (this.isInEditMode) { this.#focusOnEditInput(); diff --git a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html index 8ff1d20b9..9db020284 100644 --- a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html +++ b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html @@ -47,5 +47,5 @@ - + diff --git a/apps/red-ui/src/app/services/entity-services/file-attributes.service.ts b/apps/red-ui/src/app/services/entity-services/file-attributes.service.ts index 0f74df8a5..356328cf4 100644 --- a/apps/red-ui/src/app/services/entity-services/file-attributes.service.ts +++ b/apps/red-ui/src/app/services/entity-services/file-attributes.service.ts @@ -1,5 +1,5 @@ import { EntitiesService } from '@iqser/common-ui'; -import { Injectable, signal } from '@angular/core'; +import { computed, Injectable, signal } from '@angular/core'; import { BehaviorSubject, Observable, of } from 'rxjs'; import { catchError, tap } from 'rxjs/operators'; import { FileAttributeConfig, FileAttributes, IFileAttributeConfig, IFileAttributesConfig } from '@red/domain'; @@ -12,8 +12,9 @@ export type FileAttributesConfigMap = Readonly { readonly fileAttributesConfig$ = new BehaviorSubject({}); - readonly isEditingFileAttribute = signal(false); + readonly isEditingFileAttribute = computed(() => this.openAttributeEdits().length > 0); + readonly openAttributeEdits = signal([]); readonly openAttributeEdit = signal(''); readonly fileEdit = signal('');