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

Pull request #140: Exclude from redaction

Browse Source 
Merge in RED/ui from exclude-from-redaction to master

* commit '962c44b055fe1b7708d16f7435298f04486755e3':
  disable toggle for non managers, update tooltip & translations & styles
  add status bar color, update permissions for excluded files
  add translations, fix colors
  exclude files from redaction
This commit is contained in:
Timo Bejan 2021-04-07 18:33:23 +02:00
commit 4787647e57
16 changed files with 172 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.editorconfig
View File

@ -7,6 +7,7 @@ indent_style = space
indent_size = 4
insert_final_newline = true
trim_trailing_whitespace = true
ij_html_quote_style = double
[*.md]
max_line_length = off

34
apps/red-ui/src/app/modules/projects/components/disabled-for-redaction/disabled-for-redaction.component.scss Normal file
View File

@ -0,0 +1,34 @@
@import '../../../../../assets/styles/red-mixins';
:host {
display: block;
position: absolute;
height: 100%;
background: white;
z-index: 1;
width: 100%;
@include inset-shadow;
}
.section {
padding: 40px;
flex-direction: column;
&:not(:last-child) {
border-bottom: 1px solid $separator;
}
}
p {
height: 48px;
width: 234px;
text-align: center;
color: #9398a0;
}
mat-icon {
width: 60px;
height: 60px;
opacity: 10%;
}

12
apps/red-ui/src/app/modules/projects/components/disabled-for-redaction/disabled-for-redaction.component.ts Normal file
View File

@ -0,0 +1,12 @@
import { Component } from '@angular/core';
@Component({
selector: 'redaction-disabled-for-redaction',
template:
"<div class='section flex-align-items-center'>\n" +
' <mat-icon [svgIcon]="\'red:needs-work\'"></mat-icon>\n' +
" <p class='heading-l'>{{'file-preview.tabs.is-excluded' | translate}}</p>\n" +
'</div>',
styleUrls: ['./disabled-for-redaction.component.scss']
})
export class DisabledForRedactionComponent {}

14
apps/red-ui/src/app/modules/projects/components/file-actions/file-actions.component.html
View File

@ -135,5 +135,19 @@
type="dark-bg"
>
</redaction-circle-button>
<!-- exclude from redaction -->
<div class="red-input-group">
<mat-slide-toggle
(click)="toggleAnalysis($event)"
[disabled]="!permissionsService.isManager()"
[checked]="!fileStatus.isExcluded"
[matTooltip]="toggleTooltip | translate"
[matTooltipPosition]="toggleTooltipPosition"
[class.mr-24]="screen === 'project-overview'"
color="primary"
>
</mat-slide-toggle>
</div>
</div>
</ng-template>

15
apps/red-ui/src/app/modules/projects/components/file-actions/file-actions.component.scss
View File

@ -20,3 +20,18 @@
redaction-status-bar {
margin-left: 2px;
}
mat-slide-toggle {
height: 34px;
width: 34px;
line-height: 33px;
}
.mr-24 {
margin-right: 24px;
}
mat-slide-toggle {
margin-left: 8px;
margin-right: 5px;
}

23
apps/red-ui/src/app/modules/projects/components/file-actions/file-actions.component.ts
View File

@ -4,6 +4,7 @@ import { FileStatusWrapper } from '../../../../models/file/file-status.wrapper';
import { AppStateService } from '../../../../state/app-state.service';
import { FileActionService } from '../../services/file-action.service';
import { ProjectsDialogService } from '../../services/projects-dialog.service';
import { TooltipPosition } from '@angular/material/tooltip';
@Component({
selector: 'redaction-file-actions',
@ -103,4 +104,26 @@ export class FileActionsComponent implements OnInit {
this.actionPerformed.emit(action);
});
}
async toggleAnalysis($event: MouseEvent) {
$event.stopPropagation();
await this._fileActionService.toggleAnalysis(this.fileStatus).toPromise();
await this.appStateService.getFiles();
}
get toggleTooltip(): string {
if (!this.permissionsService.isManager()) {
return 'file-preview.toggle-analysis.only-managers';
}
return this.fileStatus.isExcluded ? 'file-preview.toggle-analysis.enable' : 'file-preview.toggle-analysis.disable';
}
get toggleTooltipPosition(): TooltipPosition {
if (!this.permissionsService.isManager() && this.screen === 'file-preview') {
return 'left';
}
return 'above';
}
}

4
apps/red-ui/src/app/modules/projects/projects.module.ts
View File

@ -35,6 +35,7 @@ import { PdfViewerDataService } from './services/pdf-viewer-data.service';
import { ManualAnnotationService } from './services/manual-annotation.service';
import { AnnotationDrawService } from './services/annotation-draw.service';
import { AnnotationProcessingService } from './services/annotation-processing.service';
import { DisabledForRedactionComponent } from './components/disabled-for-redaction/disabled-for-redaction.component';
const screens = [ProjectListingScreenComponent, ProjectOverviewScreenComponent, FilePreviewScreenComponent];
@ -53,11 +54,9 @@ const components = [
ProjectDetailsComponent,
PageIndicatorComponent,
NeedsWorkBadgeComponent,
ProjectListingEmptyComponent,
AnnotationActionsComponent,
ProjectListingEmptyComponent,
ProjectListingDetailsComponent,
FileActionsComponent,
TypeAnnotationIconComponent,
TypeFilterComponent,
ProjectOverviewBulkActionsComponent,
@ -66,6 +65,7 @@ const components = [
ProjectListingActionsComponent,
DocumentInfoComponent,
FileWorkloadComponent,
DisabledForRedactionComponent,
...screens,
...dialogs

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

@ -30,39 +30,43 @@
</div>
<div class="page-title">
<span *ngIf="!permissionsService.canPerformAnnotationActions()" class="pill" translate="readonly-pill"></span>
<span *ngIf="!permissionsService.canPerformAnnotationActions()" class="pill"
translate="readonly-pill"></span>
</div>
<div *ngIf="viewReady" class="flex-1 actions-container">
<redaction-status-bar
[config]="[
<ng-container *ngIf="!appStateService.activeFile.isExcluded">
<redaction-status-bar
[config]="[
{
length: 1,
color: appStateService.activeFile.status
}
]"
[small]="true"
>
</redaction-status-bar>
<div class="all-caps-label mr-16 ml-8">
{{ appStateService.activeFile.status | translate }}
<span *ngIf="appStateService.activeFile.status === 'UNDER_REVIEW' || appStateService.activeFile.status === 'UNDER_APPROVAL'"
>{{ 'by' | translate }}:</span
[small]="true"
>
</div>
</redaction-status-bar>
<div class="all-caps-label mr-16 ml-8">
{{ appStateService.activeFile.status | translate }}
<span
*ngIf="appStateService.activeFile.status === 'UNDER_REVIEW' || appStateService.activeFile.status === 'UNDER_APPROVAL'"
>{{ 'by' | translate }}:</span
>
</div>
<ng-container *ngIf="!editingReviewer">
<redaction-initials-avatar
*ngIf="!editingReviewer"
[userId]="appStateService.activeFile.currentReviewer"
[withName]="!!appStateService.activeFile.currentReviewer"
></redaction-initials-avatar>
<div
(click)="editingReviewer = true"
*ngIf="!editingReviewer && !appStateService.activeFile.currentReviewer && permissionsService.canAssignReviewer(appStateService.activeFile)"
class="assign-reviewer pointer"
translate="file-preview.assign-reviewer"
></div>
<ng-container *ngIf="!editingReviewer">
<redaction-initials-avatar
*ngIf="!editingReviewer"
[userId]="appStateService.activeFile.currentReviewer"
[withName]="!!appStateService.activeFile.currentReviewer"
></redaction-initials-avatar>
<div
(click)="editingReviewer = true"
*ngIf="!editingReviewer && !appStateService.activeFile.currentReviewer && permissionsService.canAssignReviewer(appStateService.activeFile)"
class="assign-reviewer pointer"
translate="file-preview.assign-reviewer"
></div>
</ng-container>
</ng-container>
<ng-container *ngIf="editingReviewer">
@ -204,6 +208,11 @@
</div>
<div class="right-container">
<redaction-disabled-for-redaction
*ngIf="viewReady && appStateService.activeFile.isExcluded"
>
</redaction-disabled-for-redaction>
<redaction-document-info
*ngIf="viewReady && viewDocumentInfo"
[file]="fileData.fileStatus.fileStatus"

1
apps/red-ui/src/app/modules/projects/screens/project-overview-screen/project-overview-screen.component.html
View File

@ -175,6 +175,7 @@
[class.pointer]="permissionsService.canOpenFile(fileStatus)"
[routerLink]="fileLink(fileStatus)"
class="table-item"
[class.disabled]='fileStatus.isExcluded'
>
<div class="pr-0" (click)="toggleFileSelected($event, fileStatus)">
<div *ngIf="!isFileSelected(fileStatus)" class="select-oval"></div>

11
apps/red-ui/src/app/modules/projects/screens/project-overview-screen/project-overview-screen.component.scss
View File

@ -110,3 +110,14 @@ cdk-virtual-scroll-viewport {
.mr-4 {
margin-right: 4px;
}
.disabled {
> div {
background-color: $grey-2;
color: $grey-7;
}
redaction-file-actions {
color: initial;
}
}

7
apps/red-ui/src/app/modules/projects/services/file-action.service.ts
View File

@ -25,6 +25,13 @@ export class FileActionService {
return this._reanalysisControllerService.reanalyzeFile(this._appStateService.activeProject.project.projectId, fileStatusWrapper.fileId, priority);
}
public toggleAnalysis(fileStatusWrapper?: FileStatusWrapper) {
if (!fileStatusWrapper) {
fileStatusWrapper = this._appStateService.activeFile;
}
return this._reanalysisControllerService.toggleAnalysis(fileStatusWrapper.projectId, fileStatusWrapper.fileId, fileStatusWrapper.isExcluded);
}
public async assignProjectReviewerFromOverview(file?: FileStatusWrapper, callback?: Function) {
if (this._permissionsService.isManagerAndOwner()) {
this._openAssignReviewerDialog(file, callback);

1
apps/red-ui/src/app/services/permissions.service.ts
View File

@ -207,6 +207,7 @@ export class PermissionsService {
this.isProjectMember() &&
!fileStatus.isProcessing &&
!fileStatus.isError &&
!fileStatus.isExcluded &&
!fileStatus.isApprovedOrUnderApproval &&
(this.isManagerAndOwner() || !this.isFileReviewer(fileStatus))
);

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

@ -306,7 +306,13 @@
},
"annotations": {
"label": "Workload"
}
},
"is-excluded": "Redaction is disabled for this document."
},
"toggle-analysis": {
"enable": "Enable for redaction",
"disable": "Disable redaction",
"only-managers": "Enabling / disabling is permitted only for managers"
},
"reviewer": "Assigned to",
"unassigned": "Unassigned",
@ -460,6 +466,7 @@
"UNDER_REVIEW": "Under Review",
"UNDER_APPROVAL": "Under Approval",
"APPROVED": "Approved",
"EXCLUDED": "Excluded",
"by": "by",
"efsa": "EFSA Approval",
"finished": "Finished",

5
apps/red-ui/src/assets/styles/red-components.scss
View File

@ -149,6 +149,11 @@
background-color: $grey-1;
}
.EXCLUDED {
stroke: $pink-1;
background-color: $pink-1;
}
.ERROR {
stroke: lighten($red-1, 25%);
background-color: lighten($red-1, 25%);

5
apps/red-ui/src/assets/styles/red-page-layout.scss
View File

@ -190,6 +190,11 @@ body {
justify-content: center;
}
.flex-align-items-center {
display: flex;
align-items: center;
}
.flex-1 {
flex: 1;
}

1
apps/red-ui/src/assets/styles/red-variables.scss
View File

@ -21,6 +21,7 @@ $yellow-2: #fdbd00;
$green-1: #00ff00;
$green-2: #5ce594;
$orange-1: #ff801a;
$pink-1: #F125DE;
$primary: $red-1;
$accent: $grey-1;