wip redaction sources
This commit is contained in:
Dan Percic
parent
e3aa3aef6a
commit
6ddaac654b
@ -0,0 +1,23 @@
|
||||
<ng-container *ngIf="hasSourcesToShow">
|
||||
<div cdkOverlayOrigin #trigger="cdkOverlayOrigin" class="chip" (mouseover)="isPopoverOpen = true" (mouseout)="isPopoverOpen = false">
|
||||
<ng-container *ngFor="let source of sources">
|
||||
<mat-icon *ngIf="source.show" [svgIcon]="source.icon"></mat-icon>
|
||||
</ng-container>
|
||||
</div>
|
||||
|
||||
<ng-template
|
||||
cdkConnectedOverlay
|
||||
[cdkConnectedOverlayOffsetY]="-8"
|
||||
[cdkConnectedOverlayOrigin]="trigger"
|
||||
[cdkConnectedOverlayOpen]="isPopoverOpen"
|
||||
>
|
||||
<div class="popover">
|
||||
<ng-container *ngFor="let source of sources">
|
||||
<div *ngIf="source.show" class="flex-align-items-center">
|
||||
<mat-icon [svgIcon]="source.icon"></mat-icon>
|
||||
<span>Redaction based on ceva mai lung care să vină pe 2 rânduri</span>
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ng-container>
|
||||
@ -0,0 +1,51 @@
|
||||
@use 'variables';
|
||||
|
||||
.popover {
|
||||
width: 260px;
|
||||
padding: 10px;
|
||||
border-radius: 3px;
|
||||
background-color: variables.$grey-1;
|
||||
color: variables.$white;
|
||||
|
||||
mat-icon {
|
||||
color: variables.$white;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
span {
|
||||
padding-left: 8px;
|
||||
font-size: 11px;
|
||||
line-height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.chip {
|
||||
height: 24px;
|
||||
|
||||
&:hover {
|
||||
background-color: variables.$grey-6;
|
||||
border-radius: 12px;
|
||||
|
||||
mat-icon {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
mat-icon {
|
||||
opacity: 50%;
|
||||
margin-left: 3px;
|
||||
margin-right: 3px;
|
||||
|
||||
&:first-of-type {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
mat-icon {
|
||||
width: 10px;
|
||||
}
|
||||
@ -0,0 +1,35 @@
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { AnnotationWrapper } from '@models/file/annotation.wrapper';
|
||||
|
||||
interface Source {
|
||||
readonly icon: string;
|
||||
readonly show: boolean;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-annotation-source',
|
||||
templateUrl: './annotation-source.component.html',
|
||||
styleUrls: ['./annotation-source.component.scss']
|
||||
})
|
||||
export class AnnotationSourceComponent {
|
||||
@Input() annotation: AnnotationWrapper;
|
||||
isPopoverOpen = false;
|
||||
readonly sources: readonly Source[] = [
|
||||
{
|
||||
icon: 'red:dictionary',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: 'red:ai',
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: 'red:rule',
|
||||
show: true
|
||||
}
|
||||
];
|
||||
|
||||
get hasSourcesToShow(): boolean {
|
||||
return this.sources.length && this.sources.some(source => source.show)
|
||||
}
|
||||
}
|
||||
@ -11,7 +11,7 @@
|
||||
|
||||
<div [class.removed]="annotation.isChangeLogRemoved" class="annotation">
|
||||
<div [matTooltip]="annotation.content" class="details" matTooltipPosition="above">
|
||||
<redaction-type-annotation-icon [annotation]="annotation"></redaction-type-annotation-icon>
|
||||
<redaction-type-annotation-icon [annotation]="annotation | log"></redaction-type-annotation-icon>
|
||||
|
||||
<div class="flex-1">
|
||||
<div>
|
||||
@ -57,4 +57,6 @@
|
||||
|
||||
<redaction-comments #comments [annotation]="annotation"></redaction-comments>
|
||||
</div>
|
||||
|
||||
<redaction-annotation-source [annotation]="annotation"></redaction-annotation-source>
|
||||
</div>
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
|
||||
:host {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.annotation-wrapper {
|
||||
@ -87,3 +88,9 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
redaction-annotation-source {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
@ -50,6 +50,8 @@ import { DossierDetailsStatsComponent } from './components/dossier-details-stats
|
||||
import { SearchScreenComponent } from './screens/search-screen/search-screen.component';
|
||||
import { EditDossierDeletedDocumentsComponent } from './dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component';
|
||||
import { AnnotationsListComponent } from './components/file-workload/components/annotations-list/annotations-list.component';
|
||||
import { AnnotationSourceComponent } from './components/file-workload/components/annotation-source/annotation-source.component';
|
||||
import { OverlayModule } from '@angular/cdk/overlay';
|
||||
|
||||
const screens = [DossierListingScreenComponent, DossierOverviewScreenComponent, FilePreviewScreenComponent, SearchScreenComponent];
|
||||
|
||||
@ -91,6 +93,7 @@ const components = [
|
||||
DossierDetailsStatsComponent,
|
||||
EditDossierDeletedDocumentsComponent,
|
||||
AnnotationsListComponent,
|
||||
AnnotationSourceComponent,
|
||||
|
||||
...screens,
|
||||
...dialogs
|
||||
@ -111,7 +114,6 @@ const services = [
|
||||
@NgModule({
|
||||
declarations: [...components],
|
||||
providers: [...services],
|
||||
imports: [CommonModule, SharedModule, FileUploadDownloadModule, DossiersRoutingModule]
|
||||
imports: [CommonModule, SharedModule, FileUploadDownloadModule, DossiersRoutingModule, OverlayModule]
|
||||
})
|
||||
export class DossiersModule {
|
||||
}
|
||||
export class DossiersModule {}
|
||||
|
||||
@ -12,6 +12,7 @@ export class IconsModule {
|
||||
constructor(private readonly _iconRegistry: MatIconRegistry, private readonly _sanitizer: DomSanitizer) {
|
||||
const icons = [
|
||||
'add',
|
||||
'ai',
|
||||
'analyse',
|
||||
'approved',
|
||||
'arrow-right',
|
||||
@ -62,6 +63,7 @@ export class IconsModule {
|
||||
'reason',
|
||||
'remove-from-dict',
|
||||
'report',
|
||||
'rule',
|
||||
'secret',
|
||||
'status',
|
||||
'status-collapse',
|
||||
|
||||
12
apps/red-ui/src/assets/icons/general/ai.svg
Normal file
12
apps/red-ui/src/assets/icons/general/ai.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<title>ai</title>
|
||||
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="ai_3" fill="currentColor" fill-rule="nonzero">
|
||||
<path
|
||||
d="M20.4612365,85.4425908 L20.4612365,79.2600589 L15.063788,78.3277723 L19.9214917,65.1776251 L48.5279686,65.1776251 L53.2384691,78.3277723 L47.8410206,79.2600589 L47.8410206,85.4425908 L68.3513248,85.4425908 L68.3513248,79.2600589 L63.1010795,78.5240432 L38.5672228,14 L30.2747792,14 L5.29931305,78.5240432 L1.42108547e-14,79.2600589 L1.42108547e-14,85.4425908 L20.4612365,85.4425908 Z M45.5839058,57.0814524 L22.9146222,57.0814524 L34.2001963,26.4141315 L34.4946026,26.4141315 L45.5839058,57.0814524 Z M98,85.4425908 L98,79.2600589 L90.0019627,77.8861629 L90.0019627,21.6054956 L98,20.2315996 L98,14 L72.3375859,14 L72.3375859,20.2315996 L80.3356232,21.6054956 L80.3356232,77.8861629 L72.3375859,79.2600589 L72.3375859,85.4425908 L98,85.4425908 Z"
|
||||
id="AI"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
12
apps/red-ui/src/assets/icons/general/rule.svg
Normal file
12
apps/red-ui/src/assets/icons/general/rule.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="100px" height="100px" viewBox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<title>rule</title>
|
||||
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="rule" fill="currentColor" fill-rule="nonzero">
|
||||
<path
|
||||
d="M53.07405,4 L62.93805,5.641 L46.92795,95.8114 L37.06395,94.1704 L53.07405,4 Z M72,21.9047 L100,49.9047 L72,77.9047 L65,70.9047 L86,49.9047 L65,28.9047 L72,21.9047 Z M28,21.9047 L35,28.9047 L14,49.9047 L35,70.9047 L28,77.9047 L0,49.9047 L28,21.9047 Z"
|
||||
id="Combined-Shape"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 677 B |
@ -1 +1 @@
|
||||
Subproject commit a16d1db3ab938dccc2c9d82c5e3d283bb857f46c
|
||||
Subproject commit 4f0d8022eddb1fa3306a653883ac5b0972f75d13
|
||||
Loading…
x
Reference in New Issue
Block a user