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

File preview close tabs

Browse Source
This commit is contained in:
Adina Țeudan 2020-10-14 18:51:12 +03:00
parent 8fc2d54540
commit 8a0281aac3
3 changed files with 39 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
View File

@ -82,6 +82,7 @@
#annotationsContainer>
<div class="tab-title" [ngClass]="annotationsTab ? 'heading' : 'subheading'"
translate="file-preview.tabs.annotations.label">
<mat-icon *ngIf="annotationsTab" (click)="selectTab('NAVIGATION', $event)" svgIcon="red:close"></mat-icon>
</div>
<div class="tab-content" [class.not-visible]="!annotationsTab">
@ -108,6 +109,7 @@
<div class="vertical" (click)="selectTab('INFO')" [ngClass]="{ active: infoTab}">
<div class="tab-title" [ngClass]="infoTab ? 'heading' : 'subheading'"
translate="file-preview.tabs.info.label">
<mat-icon *ngIf="infoTab" (click)="selectTab('NAVIGATION', $event)" svgIcon="red:close"></mat-icon>
</div>
<div *ngIf="infoTab" class="tab-content info-container">

7
apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.scss
View File

@ -29,7 +29,14 @@ redaction-pdf-viewer {
display: flex;
border-bottom: 1px solid $separator;
align-items: center;
justify-content: space-between;
padding: 0 25px;
mat-icon {
height: 14px;
width: 14px;
cursor: pointer;
}
}
.tab-content {

57
apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
View File

@ -1,5 +1,5 @@
import {ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import { ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import {
FileUploadControllerService,
ManualRedactionControllerService,
@ -7,20 +7,20 @@ import {
ProjectControllerService,
StatusControllerService
} from '@redaction/red-ui-http';
import {TranslateService} from '@ngx-translate/core';
import {NotificationService, NotificationType} from '../../../notification/notification.service';
import {MatDialog} from '@angular/material/dialog';
import {AppStateService} from '../../../state/app-state.service';
import {FileDetailsDialogComponent} from './file-details-dialog/file-details-dialog.component';
import {ViewerSyncService} from '../service/viewer-sync.service';
import {Annotations} from '@pdftron/webviewer';
import {PdfViewerComponent} from '../pdf-viewer/pdf-viewer.component';
import {AnnotationUtils} from '../../../utils/annotation-utils';
import {ManualRedactionDialogComponent} from "../manual-redaction-dialog/manual-redaction-dialog.component";
import {UserService} from "../../../user/user.service";
import {debounce} from "../../../utils/debounce";
import scrollIntoView from 'scroll-into-view-if-needed'
import {ConfirmationDialogComponent} from "../../../common/confirmation-dialog/confirmation-dialog.component";
import { TranslateService } from '@ngx-translate/core';
import { NotificationService, NotificationType } from '../../../notification/notification.service';
import { MatDialog } from '@angular/material/dialog';
import { AppStateService } from '../../../state/app-state.service';
import { FileDetailsDialogComponent } from './file-details-dialog/file-details-dialog.component';
import { ViewerSyncService } from '../service/viewer-sync.service';
import { Annotations } from '@pdftron/webviewer';
import { PdfViewerComponent } from '../pdf-viewer/pdf-viewer.component';
import { AnnotationUtils } from '../../../utils/annotation-utils';
import { ManualRedactionDialogComponent } from '../manual-redaction-dialog/manual-redaction-dialog.component';
import { UserService } from '../../../user/user.service';
import { debounce } from '../../../utils/debounce';
import scrollIntoView from 'scroll-into-view-if-needed';
import { ConfirmationDialogComponent } from '../../../common/confirmation-dialog/confirmation-dialog.component';
@Component({
selector: 'redaction-file-preview-screen',
@ -68,7 +68,7 @@ export class FilePreviewScreenComponent implements OnInit {
this._activatedRoute.params.subscribe(params => {
this.projectId = params.projectId;
this.fileId = params.fileId;
this.appStateService.activateFile(this.projectId, this.fileId)
this.appStateService.activateFile(this.projectId, this.fileId);
});
}
@ -117,7 +117,10 @@ export class FilePreviewScreenComponent implements OnInit {
this._viewerSyncService.activateViewer(value);
}
public selectTab(value: 'ANNOTATIONS' | 'INFO' | 'NAVIGATION') {
public selectTab(value: 'ANNOTATIONS' | 'INFO' | 'NAVIGATION', $event?: MouseEvent) {
if ($event) {
$event.stopPropagation();
}
if (value !== this._selectedTab) {
this._selectedTab = value;
setTimeout(() => {
@ -134,7 +137,7 @@ export class FilePreviewScreenComponent implements OnInit {
const pageNumber = annotation.getPageNumber();
let el = this.quickNavigation.find((page) => page.pageNumber === pageNumber);
if (!el) {
el = {pageNumber, redactions: 0, hints: 0, ignore: 0}
el = { pageNumber, redactions: 0, hints: 0, ignore: 0 };
this.quickNavigation.push(el);
}
if (annotation.Id.startsWith('hint:')) {
@ -201,7 +204,7 @@ export class FilePreviewScreenComponent implements OnInit {
ref.afterClosed().subscribe(() => {
this._manualRedactionEntry = null;
})
});
}
viewerPageChanged(pageNumber: number) {
@ -238,8 +241,8 @@ export class FilePreviewScreenComponent implements OnInit {
behavior: 'smooth',
scrollMode: 'if-needed',
block: 'center',
inline: 'center',
})
inline: 'center'
});
}
}
@ -288,11 +291,11 @@ export class FilePreviewScreenComponent implements OnInit {
id: annotation.Id,
removeFromDictionary: false
}]
}, this.appStateService.activeProjectId, this.appStateService.activeFile.fileId).subscribe(ok=>{
this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS);
},(err)=>{
this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label',err), null, NotificationType.ERROR);
});
}, this.appStateService.activeProjectId, this.appStateService.activeFile.fileId).subscribe(ok => {
this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.success.label'), null, NotificationType.SUCCESS);
}, (err) => {
this._notificationService.showToastNotification(this._translateService.instant('manual-redaction.remove-annotation.failed.label', err), null, NotificationType.ERROR);
});
}
});
}