RED-3800: move file attributes stuff to its own module

This commit is contained in:
Dan Percic 2023-03-20 17:59:46 +02:00
parent ba984838f8
commit 9f702ab5c7
20 changed files with 178 additions and 144 deletions

View File

@ -3,7 +3,6 @@ import { CompositeRouteGuard, IqserAuthGuard, IqserPermissionsGuard, IqserRoutes
import { RedRoleGuard } from '@users/red-role.guard';
import { EntitiesListingScreenComponent } from './screens/entities-listing/entities-listing-screen.component';
import { PendingChangesGuard } from '@guards/can-deactivate.guard';
import { FileAttributesListingScreenComponent } from './screens/file-attributes-listing/file-attributes-listing-screen.component';
import { DefaultColorsScreenComponent } from './screens/default-colors/default-colors-screen.component';
import { UserListingScreenComponent } from './screens/user-listing/user-listing-screen.component';
import { DigitalSignatureScreenComponent } from './screens/digital-signature/digital-signature-screen.component';
@ -64,7 +63,9 @@ const dossierTemplateIdRoutes: IqserRoutes = [
},
{
path: 'file-attributes',
component: FileAttributesListingScreenComponent,
component: BaseDossierTemplateScreenComponent,
loadChildren: () =>
import('./screens/file-attributes-listing/file-attributes-listing.module').then(m => m.FileAttributesListingModule),
canActivate: [CompositeRouteGuard],
data: {
routeGuards: [IqserAuthGuard, RedRoleGuard],
@ -97,6 +98,7 @@ const dossierTemplateIdRoutes: IqserRoutes = [
},
{
path: 'dossier-states',
component: BaseDossierTemplateScreenComponent,
loadChildren: () =>
import('./screens/dossier-states-listing/dossier-states-listing.module').then(m => m.DossierStatesListingModule),
canActivate: [CompositeRouteGuard],

View File

@ -6,10 +6,9 @@ import { AuditScreenComponent } from './screens/audit/audit-screen.component';
import { DefaultColorsScreenComponent } from './screens/default-colors/default-colors-screen.component';
import { EntitiesListingScreenComponent } from './screens/entities-listing/entities-listing-screen.component';
import { DigitalSignatureScreenComponent } from './screens/digital-signature/digital-signature-screen.component';
import { FileAttributesListingScreenComponent } from './screens/file-attributes-listing/file-attributes-listing-screen.component';
import { UserListingScreenComponent } from './screens/user-listing/user-listing-screen.component';
import { DossierTemplateBreadcrumbsComponent } from './shared/components/dossier-template-breadcrumbs/dossier-template-breadcrumbs.component';
import { AddEditFileAttributeDialogComponent } from './dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { AddEditFileAttributeDialogComponent } from './screens/file-attributes-listing/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { AddEditCloneDossierTemplateDialogComponent } from './dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component';
import { AddEntityDialogComponent } from './dialogs/add-entity-dialog/add-entity-dialog.component';
import { EditColorDialogComponent } from './dialogs/edit-color-dialog/edit-color-dialog.component';
@ -18,8 +17,6 @@ import { GeneralConfigScreenComponent } from './screens/general-config/general-c
import { SmtpAuthDialogComponent } from './dialogs/smtp-auth-dialog/smtp-auth-dialog.component';
import { AddEditUserDialogComponent } from './dialogs/add-edit-user-dialog/add-edit-user-dialog.component';
import { UsersStatsComponent } from './components/users-stats/users-stats.component';
import { FileAttributesCsvImportDialogComponent } from './dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component';
import { ActiveFieldsListingComponent } from './dialogs/file-attributes-csv-import-dialog/active-fields-listing/active-fields-listing.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';
@ -32,7 +29,6 @@ import { SmtpConfigService } from './services/smtp-config.service';
import { UploadDictionaryDialogComponent } from './dialogs/upload-dictionary-dialog/upload-dictionary-dialog.component';
import { GeneralConfigFormComponent } from './screens/general-config/general-config-form/general-config-form.component';
import { SmtpFormComponent } from './screens/general-config/smtp-form/smtp-form.component';
import { FileAttributesConfigurationsDialogComponent } from './dialogs/file-attributes-configurations-dialog/file-attributes-configurations-dialog.component';
import { BaseDossierTemplateScreenComponent } from './base-dossier-templates-screen/base-dossier-template-screen.component';
import { A11yModule } from '@angular/cdk/a11y';
import { BaseEntityScreenComponent } from './base-entity-screen/base-entity-screen.component';
@ -70,8 +66,6 @@ const dialogs = [
EditColorDialogComponent,
SmtpAuthDialogComponent,
AddEditUserDialogComponent,
FileAttributesConfigurationsDialogComponent,
FileAttributesCsvImportDialogComponent,
AddEditDossierAttributeDialogComponent,
UploadDictionaryDialogComponent,
ConfigureCertificateDialogComponent,
@ -83,7 +77,6 @@ const screens = [
DefaultColorsScreenComponent,
EntitiesListingScreenComponent,
DigitalSignatureScreenComponent,
FileAttributesListingScreenComponent,
UserListingScreenComponent,
GeneralConfigScreenComponent,
DossierAttributesListingScreenComponent,
@ -91,7 +84,6 @@ const screens = [
const components = [
UsersStatsComponent,
ActiveFieldsListingComponent,
ResetPasswordComponent,
UserDetailsComponent,
BaseAdminScreenComponent,

View File

@ -10,6 +10,7 @@
<iqser-circle-button
[routerLink]="['../..']"
[tooltip]="'common.close' | translate"
buttonId="close-view-btn"
icon="iqser:close"
tooltipPosition="below"
></iqser-circle-button>

View File

@ -1,48 +1,25 @@
<section>
<div class="page-header">
<redaction-dossier-template-breadcrumbs class="flex-1"></redaction-dossier-template-breadcrumbs>
<div class="content-container">
<iqser-table
[headerTemplate]="headerTemplate"
[itemSize]="80"
[noDataText]="'dossier-states-listing.no-data.title' | translate"
[noMatchText]="'dossier-states-listing.no-match.title' | translate"
[tableColumnConfigs]="tableColumnConfigs"
emptyColumnWidth="1fr"
noDataIcon="red:attribute"
></iqser-table>
</div>
<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">
<iqser-table
[headerTemplate]="headerTemplate"
[itemSize]="80"
[noDataText]="'dossier-states-listing.no-data.title' | translate"
[noMatchText]="'dossier-states-listing.no-match.title' | translate"
[tableColumnConfigs]="tableColumnConfigs"
emptyColumnWidth="1fr"
noDataIcon="red:attribute"
></iqser-table>
</div>
<div class="right-container">
<redaction-donut-chart
*ngIf="chartConfig$ | async as chartConfig"
[config]="chartConfig"
[radius]="80"
[strokeWidth]="15"
[subtitles]="['dossier-states-listing.chart.dossier-states' | translate : { count: chartConfig.length }]"
[totalType]="'simpleLabel'"
></redaction-donut-chart>
</div>
</div>
</section>
<div class="right-container">
<redaction-donut-chart
*ngIf="chartConfig$ | async as chartConfig"
[config]="chartConfig"
[radius]="80"
[strokeWidth]="15"
[subtitles]="['dossier-states-listing.chart.dossier-states' | translate : { count: chartConfig.length }]"
[totalType]="'simpleLabel'"
></redaction-donut-chart>
</div>
<ng-template #headerTemplate>
<div class="table-header-actions">

View File

@ -1,3 +1,7 @@
:host {
flex-direction: row !important;
}
.right-container {
padding: 50px 26px 0;
width: 250px;

View File

@ -30,7 +30,7 @@ export class AddEditFileAttributeDialogComponent extends BaseDialogComponent {
};
constructor(
protected readonly _dialogRef: MatDialogRef<AddEditFileAttributeDialogComponent>,
protected readonly _dialogRef: MatDialogRef<AddEditFileAttributeDialogComponent, IFileAttributeConfig>,
@Inject(MAT_DIALOG_DATA) readonly data: AddEditFileAttributeDialogData,
) {
super(_dialogRef, !!data.fileAttribute);

View File

@ -1,6 +1,6 @@
import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { UntypedFormGroup, Validators } from '@angular/forms';
import { Validators } from '@angular/forms';
import { FileAttributeEncodingTypes, IFileAttributesConfig } from '@red/domain';
import { fileAttributeEncodingTypesTranslations } from '@translations/file-attribute-encoding-types-translations';
import { BaseDialogComponent } from '@iqser/common-ui';
@ -12,12 +12,9 @@ import { BaseDialogComponent } from '@iqser/common-ui';
export class FileAttributesConfigurationsDialogComponent extends BaseDialogComponent {
readonly encodingTypeOptions = Object.keys(FileAttributeEncodingTypes);
readonly translations = fileAttributeEncodingTypesTranslations;
readonly #configuration = this._data.config;
readonly #configuration = inject<IFileAttributesConfig>(MAT_DIALOG_DATA);
constructor(
protected readonly _dialogRef: MatDialogRef<FileAttributesConfigurationsDialogComponent>,
@Inject(MAT_DIALOG_DATA) private readonly _data: { config: IFileAttributesConfig; dossierTemplateId: string },
) {
constructor(protected readonly _dialogRef: MatDialogRef<FileAttributesConfigurationsDialogComponent, IFileAttributesConfig>) {
super(_dialogRef, true);
this.form = this.#getForm();
this.initialFormValue = this.form.getRawValue();
@ -39,7 +36,7 @@ export class FileAttributesConfigurationsDialogComponent extends BaseDialogCompo
this._dialogRef.close(this.#getConfiguration());
}
#getConfiguration() {
#getConfiguration(): IFileAttributesConfig {
const supportCsvMapping = this.form.get('supportCsvMapping').value;
if (supportCsvMapping) {
return {
@ -56,7 +53,7 @@ export class FileAttributesConfigurationsDialogComponent extends BaseDialogCompo
};
}
#getForm(): UntypedFormGroup {
#getForm() {
return this._formBuilder.group({
supportCsvMapping: [!!this.#configuration.filenameMappingColumnHeaderName],
keyColumn: [this.#configuration.filenameMappingColumnHeaderName || '', [Validators.required]],

View File

@ -10,7 +10,7 @@ import { FileAttributeConfig, FileAttributeConfigTypes, FileAttributeEncodingTyp
import { FileAttributesService } from '@services/entity-services/file-attributes.service';
import { fileAttributeEncodingTypesTranslations } from '@translations/file-attribute-encoding-types-translations';
interface IFileAttributesCSVImportData {
export interface IFileAttributesCSVImportData {
readonly csv: File;
readonly dossierTemplateId: string;
readonly existingConfiguration: IFileAttributesConfig;

View File

@ -1,41 +1,18 @@
<section>
<div class="page-header">
<redaction-dossier-template-breadcrumbs class="flex-1"></redaction-dossier-template-breadcrumbs>
<div class="content-container">
<iqser-table
[bulkActions]="bulkActions"
[headerTemplate]="headerTemplate"
[itemSize]="80"
[noDataText]="'file-attributes-listing.no-data.title' | translate"
[noMatchText]="'file-attributes-listing.no-match.title' | translate"
[selectionEnabled]="permissionsService.canEditGlobalFileAttributes()"
[tableColumnConfigs]="tableColumnConfigs"
emptyColumnWidth="1fr"
noDataIcon="red:attribute"
></iqser-table>
</div>
<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">
<iqser-table
[bulkActions]="bulkActions"
[headerTemplate]="headerTemplate"
[itemSize]="80"
[noDataText]="'file-attributes-listing.no-data.title' | translate"
[noMatchText]="'file-attributes-listing.no-match.title' | translate"
[selectionEnabled]="permissionsService.canEditGlobalFileAttributes()"
[tableColumnConfigs]="tableColumnConfigs"
emptyColumnWidth="1fr"
noDataIcon="red:attribute"
></iqser-table>
</div>
<div class="right-container"></div>
</div>
</section>
<div class="right-container"></div>
<ng-template #impactedTemplates let-data="data">
<ul class="templates-container flex">

View File

@ -1,10 +1,12 @@
import { ChangeDetectionStrategy, Component, ElementRef, OnDestroy, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { Component, ElementRef, OnDestroy, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { AdminDialogService } from '../../services/admin-dialog.service';
import {
CircleButtonTypes,
defaultDialogConfig,
getCurrentUser,
getParam,
IconButtonTypes,
largeDialogConfig,
ListingComponent,
listingProvidersFactory,
LoadingService,
@ -20,11 +22,20 @@ import { firstValueFrom } from 'rxjs';
import { DossierTemplatesService } from '@services/dossier-templates/dossier-templates.service';
import { PermissionsService } from '@services/permissions.service';
import { ROLES } from '@users/roles';
import { MatDialog } from '@angular/material/dialog';
import {
AddEditFileAttributeDialogComponent,
AddEditFileAttributeDialogData,
} from './add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import {
FileAttributesCsvImportDialogComponent,
IFileAttributesCSVImportData,
} from './file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component';
import { FileAttributesConfigurationsDialogComponent } from './file-attributes-configurations-dialog/file-attributes-configurations-dialog.component';
@Component({
templateUrl: './file-attributes-listing-screen.component.html',
styleUrls: ['./file-attributes-listing-screen.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
providers: listingProvidersFactory(FileAttributesListingScreenComponent),
})
export class FileAttributesListingScreenComponent extends ListingComponent<FileAttributeConfig> implements OnInit, OnDestroy {
@ -58,6 +69,7 @@ export class FileAttributesListingScreenComponent extends ListingComponent<FileA
private readonly _toaster: Toaster,
private readonly _loadingService: LoadingService,
private readonly _dialogService: AdminDialogService,
private readonly _dialog: MatDialog,
private readonly _fileAttributesService: FileAttributesService,
private readonly _dossierTemplatesService: DossierTemplatesService,
) {
@ -76,16 +88,25 @@ export class FileAttributesListingScreenComponent extends ListingComponent<FileA
await this.#loadData();
}
openAddEditAttributeDialog(fileAttribute?: IFileAttributeConfig) {
async openAddEditAttributeDialog(fileAttribute?: IFileAttributeConfig) {
const data = {
fileAttribute,
dossierTemplateId: this.#dossierTemplateId,
numberOfDisplayedAttrs: this._numberOfDisplayedAttrs,
numberOfFilterableAttrs: this._numberOfFilterableAttrs,
};
this._dialogService.openDialog('addEditFileAttribute', data, (newValue: IFileAttributeConfig) => {
this._loadingService.loadWhile(this.#createNewFileAttributeAndRefreshView(newValue));
});
const ref = this._dialog.open<AddEditFileAttributeDialogComponent, AddEditFileAttributeDialogData, IFileAttributeConfig>(
AddEditFileAttributeDialogComponent,
{
...defaultDialogConfig,
autoFocus: true,
data,
},
);
const result = await firstValueFrom(ref.afterClosed());
this._loadingService.loadWhile(this.#createNewFileAttributeAndRefreshView(result));
}
async openConfirmDeleteAttributeDialog(attributes: FileAttributeConfig[] = this.listingService.selected): Promise<void> {
@ -98,32 +119,41 @@ export class FileAttributesListingScreenComponent extends ListingComponent<FileA
});
}
importCSV(files: FileList | File[]) {
async importCSV(files: FileList | File[]) {
const csv = files[0];
this._fileInput.nativeElement.value = null;
this._dialogService.openDialog(
'importFileAttributes',
const ref = this._dialog.open<FileAttributesCsvImportDialogComponent, IFileAttributesCSVImportData>(
FileAttributesCsvImportDialogComponent,
{
csv,
dossierTemplateId: this.#dossierTemplateId,
existingConfiguration: this.#existingConfiguration,
...largeDialogConfig,
disableClose: false,
data: {
csv,
dossierTemplateId: this.#dossierTemplateId,
existingConfiguration: this.#existingConfiguration,
},
},
async () => this.#loadData(),
);
await firstValueFrom(ref.afterClosed());
await this.#loadData();
}
openConfigurationsDialog() {
const ref = this._dialogService.openDialog('fileAttributesConfigurations', {
config: this.#existingConfiguration,
dossierTemplateId: this.#dossierTemplateId,
});
async openConfigurationsDialog() {
const ref = this._dialog.open<FileAttributesConfigurationsDialogComponent, IFileAttributesConfig, IFileAttributesConfig>(
FileAttributesConfigurationsDialogComponent,
{
...defaultDialogConfig,
data: this.#existingConfiguration,
},
);
ref.afterClosed().subscribe(async (configuration: IFileAttributesConfig) => {
if (configuration) {
await this.#setConfigAndLoadData(configuration);
}
});
const configuration = await firstValueFrom(ref.afterClosed());
if (configuration) {
await this.#setConfigAndLoadData(configuration);
}
}
async #setConfigAndLoadData(configuration: IFileAttributesConfig) {

View File

@ -0,0 +1,72 @@
import { NgModule } from '@angular/core';
import { FileAttributesListingScreenComponent } from './file-attributes-listing-screen.component';
import { RouterModule } from '@angular/router';
import {
ChevronButtonComponent,
CircleButtonComponent,
EditableInputComponent,
IconButtonComponent,
InputWithActionComponent,
IqserAllowDirective,
IqserHelpModeModule,
IqserListingModule,
IqserRoutes,
RoundCheckboxComponent,
} from '@iqser/common-ui';
import { TranslateModule } from '@ngx-translate/core';
import { CommonModule } from '@angular/common';
import { MatIconModule } from '@angular/material/icon';
import { MatTooltipModule } from '@angular/material/tooltip';
import { ActiveFieldsListingComponent } from './active-fields-listing/active-fields-listing.component';
import { FileAttributesCsvImportDialogComponent } from './file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { MatDialogModule } from '@angular/material/dialog';
import { MatMenuModule } from '@angular/material/menu';
import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
import { FileAttributesConfigurationsDialogComponent } from './file-attributes-configurations-dialog/file-attributes-configurations-dialog.component';
const routes: IqserRoutes = [
{
path: '',
component: FileAttributesListingScreenComponent,
},
];
@NgModule({
declarations: [
FileAttributesListingScreenComponent,
ActiveFieldsListingComponent,
FileAttributesCsvImportDialogComponent,
FileAttributesConfigurationsDialogComponent,
],
imports: [
CommonModule,
RouterModule.forChild(routes),
IqserListingModule,
TranslateModule,
CircleButtonComponent,
InputWithActionComponent,
IqserHelpModeModule,
IqserAllowDirective,
IconButtonComponent,
MatIconModule,
MatTooltipModule,
RoundCheckboxComponent,
MatFormFieldModule,
MatAutocompleteModule,
ReactiveFormsModule,
MatInputModule,
MatSelectModule,
MatDialogModule,
MatMenuModule,
ChevronButtonComponent,
EditableInputComponent,
FormsModule,
MatSlideToggleModule,
],
})
export class FileAttributesListingModule {}

View File

@ -1,12 +1,10 @@
import { Injectable, TemplateRef } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { AddEditFileAttributeDialogComponent } from '../dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { AddEntityDialogComponent } from '../dialogs/add-entity-dialog/add-entity-dialog.component';
import { AddEditCloneDossierTemplateDialogComponent } from '../dialogs/add-edit-dossier-template-dialog/add-edit-clone-dossier-template-dialog.component';
import { EditColorDialogComponent } from '../dialogs/edit-color-dialog/edit-color-dialog.component';
import { SmtpAuthDialogComponent } from '../dialogs/smtp-auth-dialog/smtp-auth-dialog.component';
import { AddEditUserDialogComponent } from '../dialogs/add-edit-user-dialog/add-edit-user-dialog.component';
import { FileAttributesCsvImportDialogComponent } from '../dialogs/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component';
import { AddEditDossierAttributeDialogComponent } from '../dialogs/add-edit-dossier-attribute-dialog/add-edit-dossier-attribute-dialog.component';
import {
ConfirmationDialogComponent,
@ -14,12 +12,10 @@ import {
DialogConfig,
DialogService,
IConfirmationDialogData,
largeDialogConfig,
LoadingService,
TitleColors,
} from '@iqser/common-ui';
import { UploadDictionaryDialogComponent } from '../dialogs/upload-dictionary-dialog/upload-dictionary-dialog.component';
import { FileAttributesConfigurationsDialogComponent } from '../dialogs/file-attributes-configurations-dialog/file-attributes-configurations-dialog.component';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { firstValueFrom, forkJoin } from 'rxjs';
import { ActiveDossiersService } from '@services/dossiers/active-dossiers.service';
@ -33,9 +29,6 @@ type DialogType =
| 'confirm'
| 'addEntity'
| 'editColor'
| 'addEditFileAttribute'
| 'importFileAttributes'
| 'fileAttributesConfigurations'
| 'addEditUser'
| 'smtpAuthConfig'
| 'addEditCloneDossierTemplate'
@ -59,17 +52,6 @@ export class AdminDialogService extends DialogService<DialogType> {
component: EditColorDialogComponent,
dialogConfig: { autoFocus: true },
},
addEditFileAttribute: {
component: AddEditFileAttributeDialogComponent,
dialogConfig: { autoFocus: true },
},
fileAttributesConfigurations: {
component: FileAttributesConfigurationsDialogComponent,
},
importFileAttributes: {
component: FileAttributesCsvImportDialogComponent,
dialogConfig: { ...largeDialogConfig, ...{ disableClose: false } },
},
addEditUser: {
component: AddEditUserDialogComponent,
dialogConfig: { autoFocus: true },