From 29ef80f7cd143d8ef5a8a6d0a84e839c1ea29a77 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Mon, 17 May 2021 18:24:58 +0300 Subject: [PATCH] Edit project dictionary --- .../dictionary-overview-screen.component.scss | 4 ++ .../dossier-dictionary-dialog.component.scss | 3 +- .../edit-project-dictionary.component.html | 1 + .../edit-project-dictionary.component.scss | 0 .../edit-project-dictionary.component.ts | 53 +++++++++++++++++++ .../edit-project-dialog.component.html | 9 +++- .../edit-project-dialog.component.scss | 8 ++- .../edit-project-dialog.component.ts | 20 ++++--- .../app/modules/projects/projects.module.ts | 2 + .../dictionary-manager.component.html | 2 +- .../dictionary-manager.component.scss | 10 ++-- .../services/dictionary-save.service.ts | 16 +++--- apps/red-ui/src/assets/i18n/en.json | 7 +-- .../src/assets/styles/red-tooltips.scss | 8 +-- 14 files changed, 113 insertions(+), 30 deletions(-) create mode 100644 apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.html create mode 100644 apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.scss create mode 100644 apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.ts diff --git a/apps/red-ui/src/app/modules/admin/screens/dictionary-overview/dictionary-overview-screen.component.scss b/apps/red-ui/src/app/modules/admin/screens/dictionary-overview/dictionary-overview-screen.component.scss index 4d87564aa..70de05190 100644 --- a/apps/red-ui/src/app/modules/admin/screens/dictionary-overview/dictionary-overview-screen.component.scss +++ b/apps/red-ui/src/app/modules/admin/screens/dictionary-overview/dictionary-overview-screen.component.scss @@ -28,3 +28,7 @@ margin-right: 8px; } } + +redaction-dictionary-manager { + padding: 15px; +} diff --git a/apps/red-ui/src/app/modules/projects/dialogs/dossier-dictionary-dialog/dossier-dictionary-dialog.component.scss b/apps/red-ui/src/app/modules/projects/dialogs/dossier-dictionary-dialog/dossier-dictionary-dialog.component.scss index b02797090..0434c4524 100644 --- a/apps/red-ui/src/app/modules/projects/dialogs/dossier-dictionary-dialog/dossier-dictionary-dialog.component.scss +++ b/apps/red-ui/src/app/modules/projects/dialogs/dossier-dictionary-dialog/dossier-dictionary-dialog.component.scss @@ -1,4 +1,5 @@ .dialog-content { height: calc(90vh - 160px); - padding: 12px 12px 0; + box-sizing: border-box; + padding-bottom: 24px; } diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.html b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.html new file mode 100644 index 000000000..0eed98467 --- /dev/null +++ b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.html @@ -0,0 +1 @@ + diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.scss b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.ts b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.ts new file mode 100644 index 000000000..9743f7888 --- /dev/null +++ b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component.ts @@ -0,0 +1,53 @@ +import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core'; +import { AppStateService } from '../../../../../state/app-state.service'; +import { ProjectWrapper } from '../../../../../state/model/project.wrapper'; +import { EditProjectSectionInterface } from '../edit-project-section.interface'; +import { DictionarySaveService } from '../../../../shared/services/dictionary-save.service'; +import { DictionaryManagerComponent } from '../../../../shared/components/dictionary-manager/dictionary-manager.component'; +import { PermissionsService } from '../../../../../services/permissions.service'; + +@Component({ + selector: 'redaction-edit-project-dictionary', + templateUrl: './edit-project-dictionary.component.html', + styleUrls: ['./edit-project-dictionary.component.scss'] +}) +export class EditProjectDictionaryComponent implements EditProjectSectionInterface { + @Input() projectWrapper: ProjectWrapper; + @Output() updateProject = new EventEmitter(); + @ViewChild(DictionaryManagerComponent, { static: false }) private _dictionaryManager: DictionaryManagerComponent; + + constructor( + private readonly _appStateService: AppStateService, + private readonly _dictionarySaveService: DictionarySaveService, + private readonly _permissionsService: PermissionsService + ) {} + + get changed() { + return this._dictionaryManager.hasChanges; + } + + get disabled() { + return !this._permissionsService.isAdmin(); + } + + save() { + this._dictionarySaveService + .saveEntries( + this._dictionaryManager.currentDictionaryEntries, + this._dictionaryManager.initialDictionaryEntries, + this.projectWrapper.ruleSetId, + 'dossier_redaction', + this.projectWrapper.projectId, + false + ) + .subscribe(async () => { + await this._appStateService.updateProjectDictionaryVersion(this.projectWrapper); + this._appStateService.updateProjectDictionary(this.projectWrapper.ruleSetId, this.projectWrapper.projectId); + this.updateProject.emit(); + }); + } + + revert() { + this._dictionaryManager.revert(); + } +} diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.html b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.html index e788564a3..dd6defdf3 100644 --- a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.html +++ b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.html @@ -17,7 +17,7 @@ @@ -26,6 +26,13 @@ *ngIf="activeNav === 'download-package'" [projectWrapper]="projectWrapper" > + + +
diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.scss b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.scss index 3e2b674e2..e7d761ec5 100644 --- a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.scss +++ b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.scss @@ -15,7 +15,8 @@ padding: 24px 32px; overflow: auto; @include scroll-bar; - height: calc(100% - 129px); + height: calc(100% - 81px); + box-sizing: border-box; .heading { margin-bottom: 24px; @@ -23,3 +24,8 @@ } } } + +redaction-edit-project-dictionary { + display: block; + height: calc(100% - 44px); +} diff --git a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.ts b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.ts index dd9f30e44..09396132d 100644 --- a/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.ts +++ b/apps/red-ui/src/app/modules/projects/dialogs/edit-project-dialog/edit-project-dialog.component.ts @@ -8,6 +8,7 @@ import { EditProjectDownloadPackageComponent } from './download-package/edit-pro import { EditProjectSectionInterface } from './edit-project-section.interface'; import { NotificationService, NotificationType } from '../../../../services/notification.service'; import { TranslateService } from '@ngx-translate/core'; +import { EditProjectDictionaryComponent } from './dictionary/edit-project-dictionary.component'; @Component({ selector: 'redaction-edit-project-dialog', @@ -16,18 +17,20 @@ import { TranslateService } from '@ngx-translate/core'; }) export class EditProjectDialogComponent { navItems: { key: string; title?: string }[] = [ - { key: 'project-info', title: 'general-info' }, - { key: 'download-package', title: 'choose-download' } - // { key: 'project-dictionary' } + { key: 'dossier-info', title: 'general-info' }, + { key: 'download-package', title: 'choose-download' }, + { key: 'dossier-dictionary', title: 'dossier-dictionary' } // TODO: + // { key: 'members' }, // { key: 'project-attributes' }, // { key: 'report-attributes' } ]; - activeNav = 'project-info'; + activeNav = 'dossier-info'; projectWrapper: ProjectWrapper; @ViewChild(EditProjectGeneralInfoComponent) generalInfoComponent: EditProjectGeneralInfoComponent; @ViewChild(EditProjectDownloadPackageComponent) downloadPackageComponent: EditProjectDownloadPackageComponent; + @ViewChild(EditProjectDictionaryComponent) dictionaryComponent: EditProjectDictionaryComponent; constructor( private readonly _appStateService: AppStateService, @@ -47,8 +50,9 @@ export class EditProjectDialogComponent { get activeComponent(): EditProjectSectionInterface { return { - 'project-info': this.generalInfoComponent, - 'download-package': this.downloadPackageComponent + 'dossier-info': this.generalInfoComponent, + 'download-package': this.downloadPackageComponent, + 'dossier-dictionary': this.dictionaryComponent }[this.activeNav]; } @@ -58,7 +62,9 @@ export class EditProjectDialogComponent { null, NotificationType.SUCCESS ); - this.projectWrapper = updatedProject; + if (updatedProject) { + this.projectWrapper = updatedProject; + } this._changeRef.detectChanges(); if (this.data.afterSave) { this.data.afterSave(); diff --git a/apps/red-ui/src/app/modules/projects/projects.module.ts b/apps/red-ui/src/app/modules/projects/projects.module.ts index 53722ebab..e7d552b34 100644 --- a/apps/red-ui/src/app/modules/projects/projects.module.ts +++ b/apps/red-ui/src/app/modules/projects/projects.module.ts @@ -41,6 +41,7 @@ import { EditProjectDialogComponent } from './dialogs/edit-project-dialog/edit-p import { EditProjectGeneralInfoComponent } from './dialogs/edit-project-dialog/general-info/edit-project-general-info.component'; import { EditProjectDownloadPackageComponent } from './dialogs/edit-project-dialog/download-package/edit-project-download-package.component'; import { UserPreferenceControllerService } from '@redaction/red-ui-http'; +import { EditProjectDictionaryComponent } from './dialogs/edit-project-dialog/dictionary/edit-project-dictionary.component'; const screens = [ProjectListingScreenComponent, ProjectOverviewScreenComponent, FilePreviewScreenComponent]; @@ -74,6 +75,7 @@ const components = [ AnnotationRemoveActionsComponent, EditProjectGeneralInfoComponent, EditProjectDownloadPackageComponent, + EditProjectDictionaryComponent, ...screens, ...dialogs diff --git a/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.html b/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.html index 8c67ecbf3..0de558717 100644 --- a/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.html +++ b/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.html @@ -24,7 +24,7 @@
-
+
{{ 'dictionary-overview.compare.compare' | translate }}
diff --git a/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.scss b/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.scss index 27a3dc850..e887d39d4 100644 --- a/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.scss +++ b/apps/red-ui/src/app/modules/shared/components/dictionary-manager/dictionary-manager.component.scss @@ -4,13 +4,15 @@ :host { width: 100%; height: 100%; + box-sizing: border-box; } -.compare-form { +form { display: flex; flex: 1; justify-content: flex-end; align-items: center; + height: 100%; .red-input-group { margin-top: 0; @@ -18,7 +20,7 @@ } .editor-container { - height: calc(100% - 50px); + height: calc(100% - 53px); display: flex; > *:not(:first-child:last-child) { @@ -36,9 +38,7 @@ } .content-container { - padding: 15px; - height: calc(100% - 30px); - width: calc(100% - 30px); + height: 100%; .actions-bar { display: flex; diff --git a/apps/red-ui/src/app/modules/shared/services/dictionary-save.service.ts b/apps/red-ui/src/app/modules/shared/services/dictionary-save.service.ts index dc72fa7f0..cda79686d 100644 --- a/apps/red-ui/src/app/modules/shared/services/dictionary-save.service.ts +++ b/apps/red-ui/src/app/modules/shared/services/dictionary-save.service.ts @@ -17,7 +17,7 @@ export class DictionarySaveService { private readonly _dictionaryControllerService: DictionaryControllerService ) {} - saveEntries(entries: string[], initialEntries: string[], ruleSetId: string, type: string, dossierId: string): Observable { + saveEntries(entries: string[], initialEntries: string[], ruleSetId: string, type: string, dossierId: string, showToast = true): Observable { let entriesToAdd = []; entries.forEach((currentEntry) => { entriesToAdd.push(currentEntry); @@ -37,11 +37,13 @@ export class DictionarySaveService { return obs.pipe( tap( () => { - this._notificationService.showToastNotification( - this._translateService.instant('dictionary-overview.success.generic'), - null, - NotificationType.SUCCESS - ); + if (showToast) { + this._notificationService.showToastNotification( + this._translateService.instant('dictionary-overview.success.generic'), + null, + NotificationType.SUCCESS + ); + } }, () => { this._notificationService.showToastNotification( @@ -59,7 +61,7 @@ export class DictionarySaveService { NotificationType.ERROR ); - return throwError('Entries to short'); + return throwError('Entries too short'); } } } diff --git a/apps/red-ui/src/assets/i18n/en.json b/apps/red-ui/src/assets/i18n/en.json index 65064d0dd..2bab942f7 100644 --- a/apps/red-ui/src/assets/i18n/en.json +++ b/apps/red-ui/src/assets/i18n/en.json @@ -169,12 +169,13 @@ "edit-project-dialog": { "header": "Edit {{projectName}}", "nav-items": { - "project-info": "Project Info", + "dossier-info": "Dossier Info", "general-info": "General Information", "download-package": "Download Package", "choose-download": "Choose what is included at download:", - "project-dictionary": "Project Dictionary", - "project-attributes": "Project Attributes", + "dictionary": "Dictionary", + "dossier-dictionary": "Dossier Dictionary", + "project-attributes": "Dossier Attributes", "report-attributes": "Report Attributes" }, "actions": { diff --git a/apps/red-ui/src/assets/styles/red-tooltips.scss b/apps/red-ui/src/assets/styles/red-tooltips.scss index 81eaa42ef..b7d8e6f77 100644 --- a/apps/red-ui/src/assets/styles/red-tooltips.scss +++ b/apps/red-ui/src/assets/styles/red-tooltips.scss @@ -31,11 +31,11 @@ &.warn { background-color: $yellow-2; - color: $accent; + color: $accent !important; - &:after { - border-top: solid 6px $yellow-2; - } + //&:after { + // border-top: solid 6px $yellow-2; + //} } }