RED-3797 - added checkbox that allows the user to define the pages to import the redactions from

This commit is contained in:
Valentin Mihai 2022-04-14 12:10:54 +03:00
parent a9d966a4f5
commit fda08284e6
5 changed files with 60 additions and 15 deletions

View File

@ -11,7 +11,21 @@
<div class="file-area">
<mat-icon svgIcon="iqser:document"></mat-icon>
<p>{{ fileToImport.name }}</p>
<mat-icon svgIcon="iqser:trash" (click)="fileToImport = null"></mat-icon>
<mat-icon svgIcon="iqser:trash" (click)="removeFile()"></mat-icon>
</div>
<div class="only-for-pages">
<mat-checkbox
(change)="onlyForSpecificPages = !onlyForSpecificPages"
[checked]="onlyForSpecificPages"
class="filter-menu-checkbox"
color="primary"
>
{{ 'import-redactions-dialog.only-for-specific-pages' | translate }}
</mat-checkbox>
<div *ngIf="onlyForSpecificPages" class="iqser-input-group datepicker-wrapper">
<input />
</div>
</div>
</ng-container>
</div>
@ -26,11 +40,4 @@
<iqser-circle-button class="dialog-close" icon="iqser:close" (action)="close()"></iqser-circle-button>
</section>
<input
#attachFileInput
[hidden]="true"
(change)="attachFile($event.target['files'])"
class="file-upload-input"
type="file"
accept="application/pdf"
/>
<input #attachFileInput [hidden]="true" (change)="attachFile($event)" class="file-upload-input" type="file" accept="application/pdf" />

View File

@ -56,3 +56,17 @@
max-width: 490px;
}
}
.only-for-pages {
margin-top: 16px;
margin-left: 21px;
min-height: 34px;
display: flex;
flex-direction: row;
align-items: center;
mat-checkbox {
width: fit-content;
margin-right: 16px;
}
}

View File

@ -4,6 +4,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { firstValueFrom } from 'rxjs';
import { RedactionImportService } from '../../../dossier/shared/services/redaction-import.service';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { HttpStatusCode } from '@angular/common/http';
interface ImportData {
dossierId: string;
@ -18,6 +19,7 @@ export class ImportRedactionsDialogComponent extends BaseDialogComponent {
@ViewChild('attachFileInput', { static: true }) attachFileInput: ElementRef;
fileToImport: File | null;
onlyForSpecificPages = false;
constructor(
protected readonly _injector: Injector,
@ -35,19 +37,33 @@ export class ImportRedactionsDialogComponent extends BaseDialogComponent {
this.attachFileInput.nativeElement.click();
}
attachFile(files: FileList) {
attachFile(event) {
const files = event.target['files'];
this.fileToImport = files[0];
// input field needs to be set as empty in case the same file will be selected second time
event.target.value = '';
if (!this.fileToImport) {
console.error('No file to import!');
return;
}
}
removeFile() {
this.fileToImport = null;
this.onlyForSpecificPages = false;
}
async save(): Promise<void> {
this._loadingService.start();
const import$ = this._redactionImportService.importRedactions(this.data.dossierId, this.data.fileId, this.fileToImport);
await firstValueFrom(import$).catch(error => this._toaster.error(_('error.http.generic'), { params: error }));
const result: any = await firstValueFrom(import$).catch(error => this._toaster.error(_('error.http.generic'), { params: error }));
this._loadingService.stop();
if (result.status === HttpStatusCode.Ok) {
this._toaster.success(_('import-redactions-dialog.http.success'));
this.close();
}
}
}

View File

@ -1459,8 +1459,12 @@
"import": ""
},
"details": "",
"upload-area-text": "",
"title": ""
"http": {
"success": ""
},
"only-for-specific-pages": "",
"title": "",
"upload-area-text": ""
},
"initials-avatar": {
"unassigned": "Unbekannt",

View File

@ -1459,8 +1459,12 @@
"import": "Import"
},
"details": "To apply redactions from another document, you first need to upload it.",
"upload-area-text": "Click or drag & drop anywhere on this area...",
"title": "Import document with redactions"
"http": {
"success": "Redactions has been imported!"
},
"only-for-specific-pages": "Import only for page(s)",
"title": "Import document with redactions",
"upload-area-text": "Click or drag & drop anywhere on this area..."
},
"initials-avatar": {
"unassigned": "Unassigned",