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

Reports module

Browse Source
This commit is contained in:
Adina Țeudan 2022-02-07 15:02:55 +02:00
parent 7d818cb996
commit d3bd8484b2
18 changed files with 118 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/red-ui/src/app/modules/account/base-account-screen/base-account-screen-component.scss
View File

@ -1,5 +1,5 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'variables';
@use 'common-mixins';
.content-container {
background-color: variables.$grey-2;

2
apps/red-ui/src/app/modules/account/screens/notifications/notifications-screen/notifications-screen.component.scss
View File

@ -1,5 +1,5 @@
@use 'variables';
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'common-mixins';
.dialog-content {
flex-direction: column;

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

@ -13,7 +13,6 @@ import { LicenseInformationScreenComponent } from './screens/license-information
import { DigitalSignatureScreenComponent } from './screens/digital-signature/digital-signature-screen.component';
import { AuditScreenComponent } from './screens/audit/audit-screen.component';
import { RouterModule, Routes } from '@angular/router';
import { ReportsScreenComponent } from './screens/reports/reports-screen.component';
import { DossierAttributesListingScreenComponent } from './screens/dossier-attributes-listing/dossier-attributes-listing-screen.component';
import { TrashScreenComponent } from './screens/trash/trash-screen.component';
import { GeneralConfigScreenComponent } from './screens/general-config/general-config-screen.component';
@ -97,11 +96,12 @@ const routes: Routes = [
},
{
path: 'reports',
component: ReportsScreenComponent,
component: BaseDossierTemplateScreenComponent,
canActivate: [CompositeRouteGuard],
data: {
routeGuards: [AuthGuard, RedRoleGuard, AppStateGuard],
},
loadChildren: () => import('./screens/reports/reports.module').then(m => m.ReportsModule),
},
{
path: 'dossier-attributes',

2
apps/red-ui/src/app/modules/admin/admin.module.ts
View File

@ -29,7 +29,6 @@ import { FileAttributesCsvImportDialogComponent } from './dialogs/file-attribute
import { ActiveFieldsListingComponent } from './dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.component';
import { AdminSideNavComponent } from './admin-side-nav/admin-side-nav.component';
import { MonacoEditorModule } from '@materia-ui/ngx-monaco-editor';
import { ReportsScreenComponent } from './screens/reports/reports-screen.component';
import { ResetPasswordComponent } from './dialogs/add-edit-user-dialog/reset-password/reset-password.component';
import { UserDetailsComponent } from './dialogs/add-edit-user-dialog/user-details/user-details.component';
import { AddEditDossierAttributeDialogComponent } from './dialogs/add-edit-dossier-attribute-dialog/add-edit-dossier-attribute-dialog.component';
@ -73,7 +72,6 @@ const screens = [
LicenseInformationScreenComponent,
UserListingScreenComponent,
GeneralConfigScreenComponent,
ReportsScreenComponent,
DossierAttributesListingScreenComponent,
TrashScreenComponent,
];

88
apps/red-ui/src/app/modules/admin/screens/reports/reports-screen.component.html
View File

@ -1,88 +0,0 @@
<section>
<div class="page-header">
<redaction-dossier-template-breadcrumbs class="flex-1"></redaction-dossier-template-breadcrumbs>
<div class="actions flex-1">
<redaction-dossier-template-actions></redaction-dossier-template-actions>
<iqser-circle-button
[routerLink]="['../..']"
[tooltip]="'common.close' | translate"
icon="iqser:close"
tooltipPosition="below"
></iqser-circle-button>
</div>
</div>
<div class="content-inner">
<div class="overlay-shadow"></div>
<redaction-admin-side-nav type="dossierTemplates"></redaction-admin-side-nav>
<div class="content-container" iqserHasScrollbar>
<div class="heading-xl" translate="reports-screen.title"></div>
<div class="description" translate="reports-screen.description"></div>
<div class="document-setup">
<div class="all-caps-label" translate="reports-screen.document-setup-heading"></div>
<div translate="reports-screen.document-setup-description"></div>
</div>
<div class="placeholders">
<div class="all-caps-label" translate="reports-screen.table-header.placeholders"></div>
<div class="all-caps-label" translate="reports-screen.table-header.description"></div>
<ng-container *ngFor="let placeholder of placeholders">
<div class="placeholder">{{ placeholder.placeholder }}</div>
<div
[innerHTML]="placeholder.descriptionTranslation | translate: { attribute: placeholder.attributeName }"
class="description"
></div>
</ng-container>
</div>
</div>
<div class="right-container" iqserHasScrollbar>
<div class="header">
<div class="heading" translate="reports-screen.report-documents"></div>
<iqser-circle-button
(action)="fileInput.click()"
*ngIf="permissionsService.isAdmin()"
[tooltip]="'reports-screen.upload-document' | translate"
icon="iqser:upload"
></iqser-circle-button>
</div>
<div
(click)="fileInput.click()"
*ngIf="permissionsService.isAdmin() && !availableTemplates?.length"
class="template upload-button"
translate="reports-screen.upload-document"
></div>
<div *ngFor="let template of availableTemplates" class="template">
<div class="name">
{{ template.fileName }} {{ template.multiFileReport ? ('reports-screen.multi-file-report' | translate) : '' }}
</div>
<div class="actions">
<iqser-circle-button
(action)="download(template)"
[iconSize]="12"
[size]="18"
icon="iqser:download"
></iqser-circle-button>
<iqser-circle-button
(action)="deleteTemplate(template)"
*ngIf="permissionsService.isAdmin()"
[iconSize]="12"
[size]="18"
icon="iqser:trash"
></iqser-circle-button>
</div>
</div>
</div>
</div>
</section>
<input #fileInput (change)="uploadTemplate($event)" hidden type="file" />

60
apps/red-ui/src/app/modules/admin/screens/reports/reports-screen/reports-screen.component.html Normal file
View File

@ -0,0 +1,60 @@
<div class="content-container" iqserHasScrollbar>
<div class="heading-xl" translate="reports-screen.title"></div>
<div class="description" translate="reports-screen.description"></div>
<div class="document-setup">
<div class="all-caps-label" translate="reports-screen.document-setup-heading"></div>
<div translate="reports-screen.document-setup-description"></div>
</div>
<div *ngIf="placeholders$ | async as placeholders" class="placeholders">
<div class="all-caps-label" translate="reports-screen.table-header.placeholders"></div>
<div class="all-caps-label" translate="reports-screen.table-header.description"></div>
<ng-container *ngFor="let placeholder of placeholders">
<div class="placeholder">{{ placeholder.placeholder }}</div>
<div
[innerHTML]="placeholder.descriptionTranslation | translate: { attribute: placeholder.attributeName }"
class="description"
></div>
</ng-container>
</div>
</div>
<div *ngIf="availableTemplates$ | async as availableTemplates" class="right-container" iqserHasScrollbar>
<div class="header">
<div class="heading" translate="reports-screen.report-documents"></div>
<iqser-circle-button
(action)="fileInput.click()"
*ngIf="permissionsService.isAdmin()"
[tooltip]="'reports-screen.upload-document' | translate"
icon="iqser:upload"
></iqser-circle-button>
</div>
<div
(click)="fileInput.click()"
*ngIf="permissionsService.isAdmin() && !availableTemplates?.length"
class="template upload-button"
translate="reports-screen.upload-document"
></div>
<div *ngFor="let template of availableTemplates" class="template">
<div class="name">
{{ template.fileName }} {{ template.multiFileReport ? ('reports-screen.multi-file-report' | translate) : '' }}
</div>
<div class="actions">
<iqser-circle-button (action)="download(template)" [iconSize]="12" [size]="18" icon="iqser:download"></iqser-circle-button>
<iqser-circle-button
(action)="deleteTemplate(template)"
*ngIf="permissionsService.isAdmin()"
[iconSize]="12"
[size]="18"
icon="iqser:trash"
></iqser-circle-button>
</div>
</div>
</div>
<input #fileInput (change)="uploadTemplate($event)" hidden type="file" />

6
apps/red-ui/src/app/modules/admin/screens/reports/reports-screen.component.scss → apps/red-ui/src/app/modules/admin/screens/reports/reports-screen/reports-screen.component.scss
View File

@ -1,6 +1,12 @@
@use 'variables';
@use 'common-mixins';
:host {
flex-grow: 1;
overflow: hidden;
display: flex;
}
.content-container,
.right-container {
flex: 1;

37
apps/red-ui/src/app/modules/admin/screens/reports/reports-screen.component.ts → apps/red-ui/src/app/modules/admin/screens/reports/reports-screen/reports-screen.component.ts
View File

@ -1,4 +1,4 @@
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { ChangeDetectionStrategy, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { IPlaceholdersResponse, IReportTemplate } from '@red/domain';
import { download } from '@utils/file-download-utils';
import { ConfirmationDialogInput, LoadingService, Toaster } from '@iqser/common-ui';
@ -6,13 +6,13 @@ import { PermissionsService } from '@services/permissions.service';
import {
generalPlaceholdersDescriptionsTranslations,
placeholdersDescriptionsTranslations,
} from '../../translations/placeholders-descriptions-translations';
} from '../../../translations/placeholders-descriptions-translations';
import { removeBraces } from '@utils/functions';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { AdminDialogService } from '../../services/admin-dialog.service';
import { AdminDialogService } from '../../../services/admin-dialog.service';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { ReportTemplateService } from '@services/report-template.service';
import { firstValueFrom } from 'rxjs';
import { BehaviorSubject, firstValueFrom } from 'rxjs';
interface Placeholder {
placeholder: string;
@ -27,10 +27,11 @@ const placeholderTypes: PlaceholderType[] = ['generalPlaceholders', 'fileAttribu
selector: 'redaction-reports-screen',
templateUrl: './reports-screen.component.html',
styleUrls: ['./reports-screen.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ReportsScreenComponent implements OnInit {
placeholders: Placeholder[];
availableTemplates: IReportTemplate[];
placeholders$ = new BehaviorSubject<Placeholder[]>([]);
availableTemplates$ = new BehaviorSubject<IReportTemplate[]>([]);
@ViewChild('fileInput') private _fileInput: ElementRef;
@ -85,7 +86,7 @@ export class ReportsScreenComponent implements OnInit {
}
private async _uploadTemplate($event) {
const file = $event.target.files[0];
const file: File = $event.target.files[0];
if (!this._isValidFile(file)) {
this._toaster.error(_('reports-screen.invalid-upload'));
@ -94,7 +95,7 @@ export class ReportsScreenComponent implements OnInit {
const dossierTemplateId = this._dossierTemplatesService.activeDossierTemplateId;
if (this.availableTemplates.some(template => template.fileName === file.name)) {
if (this.availableTemplates$.value.some(template => template.fileName === file.name)) {
const data = new ConfirmationDialogInput({
title: _('confirmation-dialog.report-template-same-name.title'),
question: _('confirmation-dialog.report-template-same-name.question'),
@ -147,8 +148,10 @@ export class ReportsScreenComponent implements OnInit {
}
private async _loadReportTemplates() {
this.availableTemplates = await firstValueFrom(
this._reportTemplateService.getAvailableReportTemplates(this._dossierTemplatesService.activeDossierTemplateId),
this.availableTemplates$.next(
await firstValueFrom(
this._reportTemplateService.getAvailableReportTemplates(this._dossierTemplatesService.activeDossierTemplateId),
),
);
}
@ -156,12 +159,14 @@ export class ReportsScreenComponent implements OnInit {
const placeholdersResponse: IPlaceholdersResponse = await firstValueFrom(
this._reportTemplateService.getAvailablePlaceholders(this._dossierTemplatesService.activeDossierTemplateId),
);
this.placeholders = placeholderTypes.flatMap(type =>
placeholdersResponse[type].map(placeholder => ({
placeholder,
descriptionTranslation: this._getPlaceholderDescriptionTranslation(type, placeholder),
attributeName: this._getAttributeName(placeholder),
})),
this.placeholders$.next(
placeholderTypes.flatMap(type =>
placeholdersResponse[type].map(placeholder => ({
placeholder,
descriptionTranslation: this._getPlaceholderDescriptionTranslation(type, placeholder),
attributeName: this._getAttributeName(placeholder),
})),
),
);
}

13
apps/red-ui/src/app/modules/admin/screens/reports/reports.module.ts Normal file
View File

@ -0,0 +1,13 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { SharedModule } from '../../../shared/shared.module';
import { ReportsScreenComponent } from './reports-screen/reports-screen.component';
const routes = [{ path: '', component: ReportsScreenComponent }];
@NgModule({
declarations: [ReportsScreenComponent],
imports: [RouterModule.forChild(routes), CommonModule, SharedModule],
})
export class ReportsModule {}

2
apps/red-ui/src/app/modules/admin/screens/watermark/watermark-screen/watermark-screen.component.scss
View File

@ -1,4 +1,4 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'variables';
:host {
display: flex;

4
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/edit-dossier-team/edit-dossier-team.component.scss
View File

@ -1,5 +1,5 @@
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'apps/red-ui/src/assets/styles/variables';
@use 'common-mixins';
@use 'variables';
.search-container {
margin-top: 16px;

2
apps/red-ui/src/app/modules/dossier/screens/dossier-overview/components/view-mode-selection/view-mode-selection.component.scss
View File

@ -1,4 +1,4 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'variables';
.view-mode-selection {
border-right: 1px solid variables.$separator;

2
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/annotation-actions/annotation-actions.component.scss
View File

@ -1,4 +1,4 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'variables';
.annotation-actions {
display: none;

4
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/document-info/document-info.component.scss
View File

@ -1,5 +1,5 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'variables';
@use 'common-mixins';
:host {
display: block;

4
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/file-workload/file-workload.component.scss
View File

@ -1,5 +1,5 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'variables';
@use 'common-mixins';
.read-only {
padding: 13px 16px;

4
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-exclusion/page-exclusion.component.scss
View File

@ -1,5 +1,5 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'libs/common-ui/src/assets/styles/common-mixins';
@use 'variables';
@use 'common-mixins';
:host {
height: 100%;

2
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/page-indicator/page-indicator.component.scss
View File

@ -1,4 +1,4 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'variables';
.page-wrapper {
color: variables.$accent;

2
apps/red-ui/src/app/modules/dossier/screens/file-preview-screen/components/pdf-viewer/pdf-viewer.component.scss
View File

@ -1,4 +1,4 @@
@use 'apps/red-ui/src/assets/styles/variables';
@use 'variables';
.page {
display: flex;