WIP
This commit is contained in:
Adina Țeudan
Dan Percic
parent
94b3c336ac
commit
c3c4f4421d
@ -1,54 +1,58 @@
|
||||
<div class="right-title heading" translate="file-preview.tabs.document-info.label">
|
||||
<div>
|
||||
<iqser-circle-button
|
||||
(action)="edit()"
|
||||
*ngIf="permissionsService.canEditFileAttributes(dossier, file)"
|
||||
[tooltip]="'file-preview.tabs.document-info.edit' | translate"
|
||||
icon="iqser:edit"
|
||||
tooltipPosition="before"
|
||||
></iqser-circle-button>
|
||||
<ng-container *ngIf="stateService.file$ | async as file">
|
||||
<div class="right-title heading" translate="file-preview.tabs.document-info.label">
|
||||
<div>
|
||||
<iqser-circle-button
|
||||
(action)="edit()"
|
||||
*ngIf="permissionsService.canEditFileAttributes(file)"
|
||||
[tooltip]="'file-preview.tabs.document-info.edit' | translate"
|
||||
icon="iqser:edit"
|
||||
tooltipPosition="before"
|
||||
></iqser-circle-button>
|
||||
|
||||
<iqser-circle-button
|
||||
(action)="documentInfoService.hide()"
|
||||
[tooltip]="'file-preview.tabs.document-info.close' | translate"
|
||||
icon="iqser:close"
|
||||
tooltipPosition="before"
|
||||
></iqser-circle-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="right-content" iqserHasScrollbar>
|
||||
<div class="section">
|
||||
<div *ngFor="let attr of fileAttributes$ | async" class="attribute">
|
||||
<div class="small-label">{{ attr.label }}:</div>
|
||||
<div>{{ attr.value || '-' }}</div>
|
||||
<iqser-circle-button
|
||||
(action)="documentInfoService.hide()"
|
||||
[tooltip]="'file-preview.tabs.document-info.close' | translate"
|
||||
icon="iqser:close"
|
||||
tooltipPosition="before"
|
||||
></iqser-circle-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section small-label stats-subtitle">
|
||||
<div>
|
||||
<mat-icon svgIcon="red:folder"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.dossier' | translate: { dossierName: dossier.dossierName } }}</span>
|
||||
<div class="right-content" iqserHasScrollbar>
|
||||
<div class="section">
|
||||
<div *ngFor="let attr of fileAttributes$ | async" class="attribute">
|
||||
<div class="small-label">{{ attr.label }}:</div>
|
||||
<div>{{ attr.value || '-' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:document"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate: { pages: file.numberOfPages } }}</span>
|
||||
</div>
|
||||
<div class="section small-label stats-subtitle">
|
||||
<div>
|
||||
<mat-icon svgIcon="red:folder"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.dossier' | translate: { dossierName: dossier.dossierName } }}</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="red:calendar"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.created-on' | translate: { date: file.added | date: 'mediumDate' } }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="iqser:document"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.pages' | translate: { pages: file.numberOfPages } }}</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="dossier.dueDate">
|
||||
<mat-icon svgIcon="red:lightning"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.due' | translate: { date: dossier.dueDate | date: 'mediumDate' } }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<mat-icon svgIcon="red:calendar"></mat-icon>
|
||||
<span>{{
|
||||
'file-preview.tabs.document-info.details.created-on' | translate: { date: file.added | date: 'mediumDate' }
|
||||
}}</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="red:template"></mat-icon>
|
||||
{{ dossierTemplateName }}
|
||||
<div *ngIf="dossier.dueDate">
|
||||
<mat-icon svgIcon="red:lightning"></mat-icon>
|
||||
<span>{{ 'file-preview.tabs.document-info.details.due' | translate: { date: dossier.dueDate | date: 'mediumDate' } }}</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-icon svgIcon="red:template"></mat-icon>
|
||||
{{ dossierTemplateName$ }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
|
||||
@ -1,44 +1,42 @@
|
||||
import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
|
||||
import { Dossier, File } from '@red/domain';
|
||||
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
||||
import { DossiersDialogService } from '../../../../services/dossiers-dialog.service';
|
||||
import { AutoUnsubscribe } from '@iqser/common-ui';
|
||||
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
|
||||
import { DocumentInfoService } from '../../services/document-info.service';
|
||||
import { Observable } from 'rxjs';
|
||||
import { PermissionsService } from '@services/permissions.service';
|
||||
import { combineLatest, Observable, switchMap } from 'rxjs';
|
||||
import { PermissionsService } from '../../../../../../services/permissions.service';
|
||||
import { FilePreviewStateService } from '../../services/file-preview-state.service';
|
||||
import { DossiersService } from '../../../../../../services/entity-services/dossiers.service';
|
||||
import { map } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
selector: 'redaction-document-info [file] [dossier]',
|
||||
selector: 'redaction-document-info',
|
||||
templateUrl: './document-info.component.html',
|
||||
styleUrls: ['./document-info.component.scss'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
})
|
||||
export class DocumentInfoComponent extends AutoUnsubscribe implements OnInit {
|
||||
@Input() file: File;
|
||||
@Input() dossier: Dossier;
|
||||
|
||||
fileAttributes$: Observable<{ label: string; value: string }[]>;
|
||||
dossierTemplateName: string;
|
||||
export class DocumentInfoComponent {
|
||||
readonly fileAttributes$: Observable<{ label: string; value: string }[]>;
|
||||
readonly dossierTemplateName$: Observable<string>;
|
||||
|
||||
constructor(
|
||||
private readonly _dossierTemplatesService: DossierTemplatesService,
|
||||
private readonly _dialogService: DossiersDialogService,
|
||||
private readonly _dossiersService: DossiersService,
|
||||
readonly stateService: FilePreviewStateService,
|
||||
readonly permissionsService: PermissionsService,
|
||||
readonly documentInfoService: DocumentInfoService,
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.dossierTemplateName = this._dossierTemplatesService.find(this.dossier.dossierTemplateId).name;
|
||||
this.fileAttributes$ = this.documentInfoService.fileAttributes$(
|
||||
this.file.fileId,
|
||||
this.file.dossierId,
|
||||
this.dossier.dossierTemplateId,
|
||||
const _dossier$ = this.stateService.file$.pipe(switchMap(file => this._dossiersService.getEntityChanged$(file.dossierId)));
|
||||
this.fileAttributes$ = combineLatest([this.stateService.file$, _dossier$]).pipe(
|
||||
switchMap(([file, dossier]) => this.documentInfoService.fileAttributes$(file.fileId, dossier.id, dossier.dossierTemplateId)),
|
||||
);
|
||||
this.dossierTemplateName$ = _dossier$.pipe(
|
||||
switchMap(dossier => this._dossierTemplatesService.getEntityChanged$(dossier.dossierTemplateId)),
|
||||
map(dossierTemplate => dossierTemplate.name),
|
||||
);
|
||||
}
|
||||
|
||||
edit() {
|
||||
this._dialogService.openDialog('documentInfo', null, this.file);
|
||||
this._dialogService.openDialog('documentInfo', null, this.stateService.fileData.file);
|
||||
}
|
||||
}
|
||||
|
||||
@ -88,11 +88,7 @@
|
||||
icon="red:needs-work"
|
||||
></iqser-empty-state>
|
||||
|
||||
<redaction-document-info
|
||||
*ngIf="documentInfoService.shown$ | async"
|
||||
[dossier]="dossier"
|
||||
[file]="file"
|
||||
></redaction-document-info>
|
||||
<redaction-document-info *ngIf="documentInfoService.shown$ | async"></redaction-document-info>
|
||||
|
||||
<redaction-file-workload
|
||||
#fileWorkloadComponent
|
||||
|
||||
@ -18,7 +18,8 @@ export class PermissionsService {
|
||||
return this.isApprover(dossier);
|
||||
}
|
||||
|
||||
canEditFileAttributes(dossier: Dossier, file: File): boolean {
|
||||
canEditFileAttributes(file: File): boolean {
|
||||
const dossier = this._getDossier(file);
|
||||
return ((file.isUnderReview || file.isNew) && this.isDossierMember(dossier)) || (file.isUnderApproval && this.isApprover(dossier));
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user