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

Merge branch 'VM/RED-7761' into 'master'

Browse Source 
RED-7761 - Missing fields in Edit Dialog for Signature (redacted images)

Closes RED-7761

See merge request redactmanager/red-ui!216
This commit is contained in:
Dan Percic 2023-12-06 10:02:49 +01:00
commit d363da17fc
3 changed files with 44 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -6,7 +6,7 @@
class="dialog-header heading-l"
></div>
<div class="dialog-content redaction">
<div class="dialog-content redaction" [class.fixed-height]="isRedacted && isImage">
<div *ngIf="!isImage && redactedTexts" class="iqser-input-group">
<label [translate]="'edit-redaction.dialog.content.redacted-text'" class="selected-text"></label>
<cdk-virtual-scroll-viewport
@ -39,35 +39,37 @@
</div>
<ng-container *ngIf="showExtras">
<div [class.required]="!someSkipped" class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.reason'"></label>
<mat-form-field>
<mat-select
[placeholder]="!hidePlaceholder ? ('edit-redaction.dialog.content.unchanged' | translate) : ''"
class="full-width"
formControlName="reason"
>
<mat-option
*ngFor="let option of legalOptions"
[matTooltip]="option.description"
[value]="option"
matTooltipPosition="after"
<ng-container *ngIf="!hiddenReason">
<div [class.required]="!someSkipped" class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.reason'"></label>
<mat-form-field>
<mat-select
[placeholder]="!hidePlaceholder ? ('edit-redaction.dialog.content.unchanged' | translate) : ''"
class="full-width"
formControlName="reason"
>
{{ option.label }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<mat-option
*ngFor="let option of legalOptions"
[matTooltip]="option.description"
[value]="option"
matTooltipPosition="after"
>
{{ option.label }}
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.legal-basis'"></label>
<input
[placeholder]="!hidePlaceholder ? ('edit-redaction.dialog.content.unchanged' | translate) : ''"
[value]="form.controls.reason.value?.legalBasis"
disabled
type="text"
/>
</div>
<div class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.legal-basis'"></label>
<input
[placeholder]="!hidePlaceholder ? ('edit-redaction.dialog.content.unchanged' | translate) : ''"
[value]="form.controls.reason.value?.legalBasis"
disabled
type="text"
/>
</div>
</ng-container>
<div class="iqser-input-group w-450">
<label [translate]="'edit-redaction.dialog.content.section'"></label>

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

@ -1,5 +1,12 @@
@use 'common-mixins';
.dialog-content {
&.fixed-height {
height: 386px;
overflow-y: auto;
}
}
cdk-virtual-scroll-viewport {
margin-top: 8px;
@include common-mixins.scroll-bar;

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

@ -10,8 +10,6 @@ import { getEditRedactionOptions, RedactOrHintOption } from '../../utils/dialog-
import { EditRedactionData, EditRedactResult } from '../../utils/dialog-types';
import { LegalBasisOption } from '../manual-redaction-dialog/manual-annotation-dialog.component';
const SIGNATURE = 'signature';
@Component({
templateUrl: './edit-redaction-dialog.component.html',
styleUrls: ['./edit-redaction-dialog.component.scss'],
@ -59,15 +57,13 @@ export class EditRedactionDialogComponent
}
get showExtras() {
const type = this.form.get('type').value;
const isSignature = type === SIGNATURE;
return (isSignature && this.isRedacted) || !(this.isImage || this.isHint);
return (this.isImage && this.isRedacted) || !(this.isImage || this.isHint);
}
get disabled() {
return (
this.form.invalid ||
(this.showExtras && (!this.allSkipped || this.isRedactBasedType) ? !this.form.controls.reason.value : false)
(!this.isImage && this.showExtras && (!this.allSkipped || this.isRedactBasedType) ? !this.form.controls.reason.value : false)
);
}
@ -114,13 +110,9 @@ export class EditRedactionDialogComponent
typeChanged() {
const selectedDictionaryType = this.form.controls.type.value;
const isSignature = selectedDictionaryType === SIGNATURE;
this.#setOptions(selectedDictionaryType);
if (this.redactBasedTypes.includes(selectedDictionaryType) || (isSignature && !this.allSkipped)) {
if (isSignature) {
this.form.patchValue({ reason: this.initialFormValue.reason, option: this.initialFormValue.option });
}
if (this.redactBasedTypes.includes(selectedDictionaryType)) {
this.form.controls.reason.enable();
this.hasTypeChanged = true;
} else {
@ -177,4 +169,8 @@ export class EditRedactionDialogComponent
value: new FormControl<string>(this.allRectangles ? this.data.annotations[0].value : null),
});
}
get hiddenReason() {
return this.isImage && this.form.controls.reason.disabled;
}
}