RED-6801 - WIP on Effective dossier dictionary in Dossier Settings

This commit is contained in:
Valentin Mihai 2023-07-04 16:26:50 +03:00
parent 9816cc0ec2
commit a7001188ac
9 changed files with 164 additions and 57 deletions

View File

@ -1,28 +1,72 @@
<div class="header-wrapper">
<div class="header-left">
<div class="heading">
<div>{{ dossierDictionary?.label }}</div>
<div class="small-label stats-subtitle">
<div>
<mat-icon svgIcon="red:entries"></mat-icon>
{{ 'edit-dossier-dialog.dictionary.entries' | translate : { length: (dossierDictionary?.entries || []).length } }}
<div class="dictionary-content">
<div class="dictionaries">
<div
class="dictionary"
[class.active]="dictionary.id === selectedDictionary.id"
*ngFor="let dictionary of dictionaries"
(click)="selectedDictionary = dictionary"
>
<redaction-annotation-icon [color]="dictionary.hexColor" label="R" type="square"></redaction-annotation-icon>
<div class="details">
<span> {{ dictionary.label }} </span>
<div class="small-label stats-subtitle">
<div>
<mat-icon svgIcon="red:entries"></mat-icon>
{{ dictionary.entries.length }} entries
</div>
</div>
</div>
</div>
</div>
<div class="entries">
<div class="header-wrapper">
<div class="header-left">
<div class="heading">
<div class="flex-align-items-center">
{{ dossierDictionary?.label }}
<iqser-circle-button
(action)="openEditDetailsDialog()"
[icon]="canEdit ? 'iqser:edit' : 'red:info'"
[tooltip]="
canEdit
? ('edit-dossier-dialog.dictionary.edit' | translate)
: ('edit-dossier-dialog.dictionary.info' | translate)
"
></iqser-circle-button>
</div>
<div class="small-label stats-subtitle">
<div>
<mat-icon svgIcon="red:entries"></mat-icon>
{{
'edit-dossier-dialog.dictionary.entries' | translate : { length: (dossierDictionary?.entries || []).length }
}}
</div>
</div>
</div>
</div>
<div class="header-right flex">
<iqser-icon-button
[label]="'edit-dossier-dialog.dictionary.to-redact' | translate"
[active]="activeDictionaryTab === dictionaryTab.TO_REDACT"
(click)="selectDictionaryTab(dictionaryTab.TO_REDACT)"
></iqser-icon-button>
<iqser-icon-button
[label]="'edit-dossier-dialog.dictionary.false-positives' | translate"
[active]="activeDictionaryTab === dictionaryTab.FALSE_POSITIVES"
(click)="selectDictionaryTab(dictionaryTab.FALSE_POSITIVES)"
></iqser-icon-button>
<iqser-icon-button
[label]="'edit-dossier-dialog.dictionary.false-recommendations' | translate"
[active]="activeDictionaryTab === dictionaryTab.FALSE_RECOMMENDATIONS"
(click)="selectDictionaryTab(dictionaryTab.FALSE_RECOMMENDATIONS)"
></iqser-icon-button>
</div>
</div>
<div>
<iqser-circle-button
(action)="openEditDetailsDialog()"
[icon]="canEdit ? 'iqser:edit' : 'red:info'"
[tooltip]="canEdit ? ('edit-dossier-dialog.dictionary.edit' | translate) : ('edit-dossier-dialog.dictionary.info' | translate)"
class="mt-20"
></iqser-circle-button>
<redaction-dictionary-manager
[canEdit]="canEdit"
[initialEntries]="dossierDictionary?.entries || []"
[withFloatingActions]="false"
></redaction-dictionary-manager>
</div>
</div>
<redaction-dictionary-manager
[canEdit]="canEdit"
[initialEntries]="dossierDictionary?.entries || []"
[withFloatingActions]="false"
></redaction-dictionary-manager>

View File

@ -1,29 +1,68 @@
:host {
flex: 1;
:host ::ng-deep .content {
padding: 0;
}
.dictionary-content {
display: flex;
flex-direction: column;
height: 100%;
}
.header-wrapper {
display: flex;
justify-content: space-between;
.dictionaries {
border-right: 1px solid var(--iqser-separator);
width: 30%;
overflow-y: scroll;
.header-left {
display: flex;
.dictionary {
height: 40px;
padding: 15px;
border: 1px solid var(--iqser-separator);
display: flex;
gap: 10px;
cursor: pointer;
.iqser-input-group {
margin-left: 24px;
span {
font-weight: bold;
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
}
.details {
display: flex;
flex-direction: column;
gap: 5px;
}
&.active {
background: var(--iqser-grey-8);
box-shadow: 0 5px 4px -4px rgba(0, 0, 0, 0.2);
cursor: default;
}
}
}
.entries {
width: 100%;
padding: 24px 32px;
.header-wrapper {
display: flex;
justify-content: space-between;
.display-name {
display: flex;
align-items: center;
margin-bottom: 24px;
.header-left {
display: flex;
> div {
font-weight: 600;
.iqser-input-group {
margin-left: 24px;
}
}
.display-name {
display: flex;
align-items: center;
margin-bottom: 24px;
> div {
font-weight: 600;
}
}
}
}
}

View File

@ -5,8 +5,14 @@ import { PermissionsService } from '@services/permissions.service';
import { DictionaryManagerComponent } from '@shared/components/dictionary-manager/dictionary-manager.component';
import { DictionaryService } from '@services/entity-services/dictionary.service';
import { CircleButtonTypes, LoadingService } from '@iqser/common-ui';
import { firstValueFrom } from 'rxjs';
import { DossiersDialogService } from '../../../services/dossiers-dialog.service';
import { tap } from 'rxjs/operators';
enum DictionaryTab {
TO_REDACT,
FALSE_POSITIVES,
FALSE_RECOMMENDATIONS,
}
@Component({
selector: 'redaction-edit-dossier-dictionary',
@ -18,8 +24,12 @@ export class EditDossierDictionaryComponent implements EditDossierSectionInterfa
canEdit = false;
dossierDictionary: Dictionary;
dictionaries: Dictionary[];
selectedDictionary: Dictionary;
activeDictionaryTab = DictionaryTab.TO_REDACT;
readonly circleButtonTypes = CircleButtonTypes;
readonly dictionaryTab = DictionaryTab;
@ViewChild(DictionaryManagerComponent, { static: false }) private readonly _dictionaryManager: DictionaryManagerComponent;
constructor(
@ -77,8 +87,16 @@ export class EditDossierDictionaryComponent implements EditDossierSectionInterfa
});
}
selectDictionaryTab(selectedDictionaryTab: DictionaryTab) {
this.activeDictionaryTab = selectedDictionaryTab;
}
async #updateDossierDictionary() {
const { dossierId, dossierTemplateId } = this.dossier;
this.dossierDictionary = await this._dictionaryService.loadDossierDictionary(dossierTemplateId, dossierId);
this.dictionaries = this._dictionaryService.getPossibleDictionaries(dossierTemplateId, false);
this.dictionaries.forEach(d => console.log(d.hexColor));
this.selectedDictionary = this.dictionaries[0];
}
}

View File

@ -13,14 +13,16 @@
flex: 1;
.content {
padding: 24px 32px;
overflow: auto;
@include common-mixins.scroll-bar;
flex: 1;
box-sizing: border-box;
padding: 24px 32px;
margin-right: 16px;
&.no-padding {
padding: 0;
overflow: hidden;
}
&.no-actions {

View File

@ -89,7 +89,7 @@ export class EditDossierDialogComponent extends BaseDialogComponent implements A
}
get noPaddingTab(): boolean {
return ['dossierAttributes'].includes(this.activeNav);
return ['dossierAttributes', 'dossierDictionary'].includes(this.activeNav);
}
get showHeading(): boolean {

View File

@ -1132,7 +1132,10 @@
"dictionary": {
"edit": "",
"entries": "{length} {length, plural, one{entry} other{entries}}",
"info": ""
"false-positives": "",
"false-recommendations": "",
"info": "",
"to-redact": ""
},
"general-info": {
"form": {
@ -1647,8 +1650,6 @@
"license-info-screen": {
"backend-version": "Backend-Version der Anwendung",
"chart": {
"cumulative": "Seiten insgesamt",
"legend": "",
"pages-per-month": "Seiten pro Monat",
"total-pages": "Gesamtzahl der Seiten"
},

View File

@ -686,7 +686,7 @@
},
"revert-changes": "Revert",
"save-changes": "Save Changes",
"search": "Search...",
"search": "Search entries ...",
"select-dictionary": "Select a dictionary above to compare with the current one.",
"success": {
"generic": "Dictionary updated!"
@ -1131,8 +1131,11 @@
"delete-successful": "Dossier {dossierName} was deleted.",
"dictionary": {
"edit": "Edit",
"entries": "{length} {length, plural, one{entry} other{entries}}",
"info": "Info"
"entries": "{length} {length, plural, one{entry} other{entries}} to redact",
"false-positives": "False Positives",
"false-recommendations": "False Recommendations",
"info": "Info",
"to-redact": "To Redact"
},
"general-info": {
"form": {
@ -1647,8 +1650,6 @@
"license-info-screen": {
"backend-version": "Backend Application Version",
"chart": {
"cumulative": "Cumulative Pages",
"legend": "Legend",
"pages-per-month": "Pages per Month",
"total-pages": "Total Pages"
},

View File

@ -1132,7 +1132,10 @@
"dictionary": {
"edit": "",
"entries": "{length} {length, plural, one{entry} other{entries}}",
"info": ""
"false-positives": "",
"false-recommendations": "",
"info": "",
"to-redact": ""
},
"general-info": {
"form": {
@ -1647,8 +1650,6 @@
"license-info-screen": {
"backend-version": "Backend-Version der Anwendung",
"chart": {
"cumulative": "Seiten insgesamt",
"legend": "",
"pages-per-month": "Seiten pro Monat",
"total-pages": "Gesamtzahl der Seiten"
},

View File

@ -686,7 +686,7 @@
},
"revert-changes": "Revert",
"save-changes": "Save Changes",
"search": "Search...",
"search": "Search entries ...",
"select-dictionary": "Select a dictionary above to compare with the current one.",
"success": {
"generic": "Dictionary updated!"
@ -1131,8 +1131,11 @@
"delete-successful": "Dossier {dossierName} was deleted.",
"dictionary": {
"edit": "Edit",
"entries": "{length} {length, plural, one{entry} other{entries}}",
"info": "Info"
"entries": "{length} {length, plural, one{entry} other{entries}} to redact",
"false-positives": "False Positives",
"false-recommendations": "False Recommendations",
"info": "Info",
"to-redact": "To Redact"
},
"general-info": {
"form": {
@ -1647,8 +1650,6 @@
"license-info-screen": {
"backend-version": "Backend Application Version",
"chart": {
"cumulative": "Cumulative Pages",
"legend": "Legend",
"pages-per-month": "Pages per Month",
"total-pages": "Total Pages"
},