Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

RED-7550: Bulk edit dialog.

Browse Source
This commit is contained in:
Nicoleta Panaghiu 2023-09-18 17:37:02 +03:00
parent 5d90277680
commit ddaa4cf7f3
8 changed files with 100 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
apps/red-ui/src/app/models/file/annotation.permissions.ts
View File

@ -62,17 +62,6 @@ export class AnnotationPermissions {
permissions.canRecategorizeAnnotation = canRecategorizeAnnotation(annotation, canAddRedaction);
permissions.canResizeAnnotation = canResizeAnnotation(annotation, canAddRedaction);
// if (isDocumine) {
// annotation.isSkipped || annotation.isRedacted;
// } else {
// annotation.isImage || annotation.isOCR;
// annotation.isSkipped || annotation.isRedacted;
// annotation.isIgnoredHint || annotation.isDictBasedHint || annotation.isHint || annotation.isSuggestionForceHint;
// }
// const skippedRedacted = annotation.isSkipped || annotation.isRedacted;
// const ignoredHints = annotation.isIgnoredHint || annotation.isDictBasedHint || annotation.isHint || annotation.isSuggestionForceHint;
// const image = annotation
permissions.canEditAnnotations = (annotation.isSkipped || annotation.isRedacted) && !annotation.isImage;
permissions.canEditHints =
annotation.isIgnoredHint || annotation.isDictBasedHint || annotation.isHint || annotation.isSuggestionForceHint;

46
apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts
View File

@ -39,24 +39,35 @@ export class AnnotationActionsComponent implements OnChanges {
});
readonly #isDocumine = getConfig().IS_DOCUMINE;
constructor(
readonly viewModeService: ViewModeService,
readonly helpModeService: HelpModeService,
readonly multiSelectService: MultiSelectService,
private readonly _state: FilePreviewStateService,
private readonly _permissionsService: PermissionsService,
private readonly _iqserPermissionsService: IqserPermissionsService,
private readonly _annotationManager: REDAnnotationManager,
readonly annotationActionsService: AnnotationActionsService,
readonly annotationReferencesService: AnnotationReferencesService,
) {}
get annotations(): AnnotationWrapper[] {
return this.#annotations;
}
@Input()
set annotations(annotations: AnnotationWrapper[]) {
this.#annotations = annotations.filter(a => a !== undefined);
this.isImage = this.#annotations?.reduce((accumulator, annotation) => annotation.isImage && accumulator, true);
this._annotationId = this.#annotations[0]?.id;
}
get canEdit(): boolean {
const documineCanEditRedactions =
const canEditRedactions =
this.annotationPermissions.canChangeLegalBasis ||
this.annotationPermissions.canRecategorizeAnnotation ||
this.annotationPermissions.canForceHint ||
this.annotationPermissions.canForceRedaction;
return this.#isDocumine && this.annotations.length > 1 ? this.annotationPermissions.canEditAnnotations : documineCanEditRedactions;
return this.annotations.length > 1
? this.#isDocumine
? this.annotationPermissions.canEditAnnotations
: this.annotationPermissions.canEditHints ||
this.annotationPermissions.canEditImages ||
this.annotationPermissions.canEditAnnotations
: canEditRedactions;
}
get canRemoveRedaction(): boolean {
@ -76,17 +87,12 @@ export class AnnotationActionsComponent implements OnChanges {
return this.annotations.every(a => a.superType === type);
}
constructor(
readonly viewModeService: ViewModeService,
readonly helpModeService: HelpModeService,
readonly multiSelectService: MultiSelectService,
private readonly _state: FilePreviewStateService,
private readonly _permissionsService: PermissionsService,
private readonly _iqserPermissionsService: IqserPermissionsService,
private readonly _annotationManager: REDAnnotationManager,
readonly annotationActionsService: AnnotationActionsService,
readonly annotationReferencesService: AnnotationReferencesService,
) {}
@Input()
set annotations(annotations: AnnotationWrapper[]) {
this.#annotations = annotations.filter(a => a !== undefined);
this.isImage = this.#annotations?.reduce((accumulator, annotation) => annotation.isImage && accumulator, true);
this._annotationId = this.#annotations[0]?.id;
}
ngOnChanges(): void {
this.#setPermissions();

50
apps/red-ui/src/app/modules/file-preview/dialogs/edit-redaction-dialog/edit-redaction-dialog.component.html
View File

@ -7,27 +7,27 @@
></div>
<div class="dialog-content redaction">
<!-- <div *ngIf="!allRectangles && redactedText" class="iqser-input-group w-450">-->
<!-- <label-->
<!-- [translateParams]="{ type: isImage ? 'image' : isHint ? 'hint' : 'redaction' }"-->
<!-- [translate]="'edit-redaction.dialog.content.redacted-text'"-->
<!-- class="selected-text"-->
<!-- ></label>-->
<!-- {{ redactedText }}-->
<div *ngIf="!allRectangles && redactedTexts" class="iqser-input-group w-450">
<div *ngIf="!isImage && redactedTexts" class="iqser-input-group">
<label
[translateParams]="{ type: isImage ? 'image' : isHint ? 'hint' : 'redaction', length: redactedTexts.length }"
[translate]="'edit-redaction.dialog.content.redacted-text'"
[translateParams]="{ length: redactedTexts.length }"
class="selected-text"
></label>
{{ redactedTexts }}
<cdk-virtual-scroll-viewport
[itemSize]="16"
[ngStyle]="{ height: redactedTexts.length <= 5 ? 16 * redactedTexts.length + 'px' : 80 + 'px' }"
>
<ul *cdkVirtualFor="let text of redactedTexts">
<li>{{ text }}</li>
</ul>
</cdk-virtual-scroll-viewport>
</div>
<div *ngIf="!isManualRedaction" class="iqser-input-group required w-450">
<label [translate]="'edit-redaction.dialog.content.type'"></label>
<mat-form-field>
<mat-select formControlName="type">
<mat-select formControlName="type" [placeholder]="'edit-redaction.dialog.content.unchanged' | translate">
<mat-select-trigger>{{ displayedDictionaryLabel }}</mat-select-trigger>
<mat-option
(click)="typeChanged()"
@ -46,7 +46,11 @@
<div class="iqser-input-group required w-450">
<label [translate]="'edit-redaction.dialog.content.reason'"></label>
<mat-form-field>
<mat-select class="full-width" formControlName="reason">
<mat-select
class="full-width"
formControlName="reason"
[placeholder]="'edit-redaction.dialog.content.unchanged' | translate"
>
<mat-option
*ngFor="let option of legalOptions"
[matTooltip]="option.description"
@ -66,19 +70,33 @@
<div class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.section'"></label>
<input formControlName="section" name="section" type="text" />
<input
formControlName="section"
name="section"
type="text"
[placeholder]="'edit-redaction.dialog.content.unchanged' | translate"
/>
</div>
</ng-container>
<div *ngIf="allRectangles" class="iqser-input-group w-400">
<label [translate]="'change-legal-basis-dialog.content.classification'"></label>
<input formControlName="value" name="classification" type="text" />
<input
formControlName="value"
name="classification"
type="text"
[placeholder]="'edit-redaction.dialog.content.unchanged' | translate"
/>
</div>
<div class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.comment'"></label>
<textarea
[placeholder]="'edit-redaction.dialog.content.comment-placeholder' | translate"
[placeholder]="
!isImage && redactedTexts.length === 1
? ('edit-redaction.dialog.content.comment-placeholder' | translate)
: ('edit-redaction.dialog.content.unchanged' | translate)
"
formControlName="comment"
iqserHasScrollbar
name="comment"
@ -90,7 +108,7 @@
<div class="dialog-actions">
<iqser-icon-button
[disabled]="showLegalReason && disabled"
[disabled]="disabled || !changed"
[label]="'edit-redaction.dialog.actions.save' | translate"
[submit]="true"
[type]="iconButtonTypes.primary"

22
apps/red-ui/src/app/modules/file-preview/dialogs/edit-redaction-dialog/edit-redaction-dialog.component.scss Normal file
View File

@ -0,0 +1,22 @@
@use 'common-mixins';
cdk-virtual-scroll-viewport {
margin-top: 8px;
@include common-mixins.scroll-bar;
}
:host ::ng-deep .cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper {
max-width: 100% !important;
}
ul {
padding-left: 16px;
}
li {
white-space: nowrap;
text-overflow: ellipsis;
list-style-position: inside;
overflow: hidden;
padding-right: 10px;
}

21
apps/red-ui/src/app/modules/file-preview/dialogs/edit-redaction-dialog/edit-redaction-dialog.component.ts
View File

@ -13,6 +13,7 @@ import { LegalBasisOption } from '../manual-redaction-dialog/manual-annotation-d
@Component({
templateUrl: './edit-redaction-dialog.component.html',
styleUrls: ['./edit-redaction-dialog.component.scss'],
})
export class EditRedactionDialogComponent
extends IqserDialogComponent<EditRedactionDialogComponent, EditRedactionData, EditRedactResult>
@ -25,7 +26,6 @@ export class EditRedactionDialogComponent
readonly isModifyDictionary: boolean;
readonly isImage: boolean;
readonly isManualRedaction: boolean;
readonly showLegalReason: boolean;
readonly isHint: boolean;
readonly allRectangles = this.data.annotations.reduce((acc, a) => acc && a.rectangle, true);
readonly showExtras: boolean;
@ -41,11 +41,8 @@ export class EditRedactionDialogComponent
) {
super();
const annotations = this.data.annotations;
const firstEntry = annotations[0];
this.isImage = [...IMAGE_CATEGORIES, 'ocr'].includes(firstEntry.type);
const testImage = annotations.reduce((acc, next) => acc && [...IMAGE_CATEGORIES, 'ocr'].includes(next.type), true);
console.log(testImage);
this.redactedTexts = !testImage ? annotations.map(annotation => annotation.value) : null;
this.isImage = annotations.reduce((acc, next) => acc && [...IMAGE_CATEGORIES, 'ocr'].includes(next.type), true);
this.redactedTexts = !this.isImage ? annotations.map(annotation => annotation.value) : null;
this.isModifyDictionary = annotations.every(annotation => annotation.isModifyDictionary);
this.isManualRedaction = annotations.every(annotation => annotation.type === SuperTypes.ManualRedaction);
this.isHint = annotations.every(annotation => annotation.isHint);
@ -61,7 +58,7 @@ export class EditRedactionDialogComponent
}
get disabled() {
return !this.form.controls.reason.value;
return this.showExtras ? !this.form.controls.reason.value : false;
}
async ngOnInit() {
@ -74,11 +71,13 @@ export class EditRedactionDialogComponent
}));
const reason = this.legalOptions.find(o => o.legalBasis === this.data.annotations[0].legalBasis);
const sameLegalBasis = this.data.annotations.every(annotation => annotation.legalBasis === reason?.legalBasis);
this.form.patchValue({
reason: reason,
reason: sameLegalBasis ? reason : null,
});
this.legalOptions.sort((a, b) => a.label.localeCompare(b.label));
this.initialFormValue = this.form.getRawValue();
}
typeChanged() {
@ -102,7 +101,7 @@ export class EditRedactionDialogComponent
this.#dossier.dossierTemplateId,
this.isImage,
this.isHint,
this.data.annotations[0].isOCR,
this.data.annotations.every(annotation => annotation.isOCR),
);
}
@ -123,8 +122,8 @@ export class EditRedactionDialogComponent
}
#getForm() {
const sameType = new Set(this.data.annotations.map(annotation => annotation.type)).size === 1;
const sameSection = new Set(this.data.annotations.map(annotation => annotation.section)).size === 1;
const sameType = this.data.annotations.every(annotation => annotation.type === this.data.annotations[0].type);
const sameSection = this.data.annotations.every(annotation => annotation.section === this.data.annotations[0].section);
return this._formBuilder.group({
reason: new FormControl<LegalBasisOption>(null),
comment: new FormControl<string>(null),

10
apps/red-ui/src/app/modules/file-preview/services/annotation-actions.service.ts
View File

@ -104,12 +104,16 @@ export class AnnotationActionsService {
return;
}
if (!this.#isDocumine && (result.legalBasis !== annotations[0].legalBasis || result.section !== annotations[0].section)) {
if (
!this.#isDocumine &&
(!annotations.every(annotation => annotation.legalBasis === result.legalBasis) ||
!annotations.every(annotation => annotation.section === result.section))
) {
const changeLegalBasisBody = annotations.map(annotation => ({
annotationId: annotation.id,
legalBasis: result.legalBasis,
section: result.section,
value: result.value,
section: result.section ?? annotation.section,
value: result.value ?? annotation.value,
}));
requests.push(this._manualRedactionService.changeLegalBasis(changeLegalBasisBody, dossierId, fileId));
}

7
apps/red-ui/src/app/modules/file-preview/services/pdf-annotation-actions.service.ts
View File

@ -50,13 +50,6 @@ export class PdfAnnotationActionsService {
availableActions.push(resizeButton);
}
/*
*/
console.log(annotations);
console.log(annotations.map(annotation => annotation.type));
console.log(permissions);
const canEditRedactions =
permissions.canChangeLegalBasis ||
permissions.canRecategorizeAnnotation ||

2
apps/red-ui/src/assets/i18n/redact/en.json
View File

@ -1249,7 +1249,7 @@
}
},
"reason": "Reason",
"redacted-text": "{type, select, hint{Hint} other{Redacted}} text",
"redacted-text": "{type, select, hint{Hint} other{Redacted}} {length, plural, one{text} other {texts}}",
"section": "Paragraph / Location",
"type": "Type",
"unchanged": "Unchanged"