RED-4084 - Finish the clone dossier template UI

This commit is contained in:
Valentin Mihai 2022-05-31 21:36:47 +03:00
parent 4a6acc130d
commit 25c3c97447
14 changed files with 106 additions and 165 deletions

View File

@ -11,7 +11,7 @@ import { UserListingScreenComponent } from './screens/user-listing/user-listing-
import { DossierTemplateBreadcrumbsComponent } from './components/dossier-template-breadcrumbs/dossier-template-breadcrumbs.component';
import { ColorPickerModule } from 'ngx-color-picker';
import { AddEditFileAttributeDialogComponent } from './dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { AddEditDossierTemplateDialogComponent } from './dialogs/add-edit-dossier-template-dialog/add-edit-dossier-template-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';
import { AdminDialogService } from './services/admin-dialog.service';
@ -41,15 +41,13 @@ import { AddEditDossierStateDialogComponent } from './dialogs/add-edit-dossier-s
import { A11yModule } from '@angular/cdk/a11y';
import { ConfirmDeleteDossierStateDialogComponent } from './dialogs/confirm-delete-dossier-state-dialog/confirm-delete-dossier-state-dialog.component';
import { BaseEntityScreenComponent } from './base-entity-screen/base-entity-screen.component';
import { CloneDossierTemplateDialogComponent } from './dialogs/clone-dossier-template-dialog/clone-dossier-template-dialog.component';
import { AdminSideNavComponent } from './admin-side-nav/admin-side-nav.component';
import { SystemPreferencesFormComponent } from './screens/general-config/system-preferences-form/system-preferences-form.component';
const dialogs = [
AddEditDossierTemplateDialogComponent,
AddEditCloneDossierTemplateDialogComponent,
AddEntityDialogComponent,
AddEditFileAttributeDialogComponent,
CloneDossierTemplateDialogComponent,
EditColorDialogComponent,
SmtpAuthDialogComponent,
AddEditUserDialogComponent,

View File

@ -1,19 +1,19 @@
<section class="dialog">
<div
[translateParams]="{
type: dossierTemplate ? 'edit' : 'create',
type: dossierTemplate ? (data.clone ? 'clone' : 'edit') : 'create',
name: dossierTemplate?.name
}"
[translate]="'add-edit-dossier-template.title'"
[translate]="'add-edit-clone-dossier-template.title'"
class="dialog-header heading-l"
></div>
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group required w-300">
<label translate="add-edit-dossier-template.form.name"></label>
<label translate="add-edit-clone-dossier-template.form.name"></label>
<input
[placeholder]="'add-edit-dossier-template.form.name-placeholder' | translate"
[placeholder]="'add-edit-clone-dossier-template.form.name-placeholder' | translate"
formControlName="name"
name="name"
type="text"
@ -21,9 +21,9 @@
</div>
<div class="iqser-input-group w-400">
<label translate="add-edit-dossier-template.form.description"></label>
<label translate="add-edit-clone-dossier-template.form.description"></label>
<textarea
[placeholder]="'add-edit-dossier-template.form.description-placeholder' | translate"
[placeholder]="'add-edit-clone-dossier-template.form.description-placeholder' | translate"
formControlName="description"
name="description"
rows="4"
@ -34,11 +34,11 @@
<div class="validity">
<div>
<mat-checkbox (change)="toggleHasValid('from')" [checked]="hasValidFrom" class="filter-menu-checkbox" color="primary">
{{ 'add-edit-dossier-template.form.valid-from' | translate }}
{{ 'add-edit-clone-dossier-template.form.valid-from' | translate }}
</mat-checkbox>
<mat-checkbox (change)="toggleHasValid('to')" [checked]="hasValidTo" class="filter-menu-checkbox" color="primary">
{{ 'add-edit-dossier-template.form.valid-to' | translate }}
{{ 'add-edit-clone-dossier-template.form.valid-to' | translate }}
</mat-checkbox>
</div>
@ -83,7 +83,7 @@
<div class="dialog-actions">
<button (click)="save()" [disabled]="disabled" color="primary" mat-flat-button type="button">
{{ 'add-edit-dossier-template.save' | translate }}
{{ 'add-edit-clone-dossier-template.save' | translate }}
</button>
</div>
</form>

View File

@ -12,11 +12,16 @@ import { DictionaryService } from '@services/entity-services/dictionary.service'
import { firstValueFrom } from 'rxjs';
import dayjs, { Dayjs } from 'dayjs';
interface EditCloneTemplateData {
dossierTemplateId: string;
clone?: boolean;
}
@Component({
templateUrl: './add-edit-dossier-template-dialog.component.html',
styleUrls: ['./add-edit-dossier-template-dialog.component.scss'],
templateUrl: './add-edit-clone-dossier-template-dialog.component.html',
styleUrls: ['./add-edit-clone-dossier-template-dialog.component.scss'],
})
export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
export class AddEditCloneDossierTemplateDialogComponent extends BaseDialogComponent {
hasValidFrom: boolean;
hasValidTo: boolean;
downloadTypesEnum: DownloadFileType[] = ['ORIGINAL', 'PREVIEW', 'DELTA_PREVIEW', 'REDACTED'];
@ -36,12 +41,12 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
private readonly _dictionaryService: DictionaryService,
private readonly _formBuilder: FormBuilder,
protected readonly _injector: Injector,
protected readonly _dialogRef: MatDialogRef<AddEditDossierTemplateDialogComponent>,
protected readonly _dialogRef: MatDialogRef<AddEditCloneDossierTemplateDialogComponent>,
private readonly _loadingService: LoadingService,
@Inject(MAT_DIALOG_DATA) readonly dossierTemplateId: string,
@Inject(MAT_DIALOG_DATA) readonly data: EditCloneTemplateData,
) {
super(_injector, _dialogRef, !!dossierTemplateId);
this.dossierTemplate = this._dossierTemplatesService.find(dossierTemplateId);
super(_injector, _dialogRef, !!data && !data.clone);
this.dossierTemplate = this._dossierTemplatesService.find(this.data?.dossierTemplateId);
this.form = this._getForm();
this.initialFormValue = this.form.getRawValue();
this.hasValidFrom = !!this.dossierTemplate?.validFrom;
@ -81,13 +86,17 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
validFrom: this.hasValidFrom ? this.form.get('validFrom').value : null,
validTo: this.hasValidTo ? this.form.get('validTo').value : null,
} as IDossierTemplate;
await firstValueFrom(this._dossierTemplatesService.createOrUpdate(dossierTemplate));
if (this.data?.clone) {
await firstValueFrom(this._dossierTemplatesService.clone(this.dossierTemplate.id, dossierTemplate));
} else {
await firstValueFrom(this._dossierTemplatesService.createOrUpdate(dossierTemplate));
}
this._dialogRef.close(true);
} catch (error: any) {
const message =
error.status === HttpStatusCode.Conflict
? _('add-edit-dossier-template.error.conflict')
: _('add-edit-dossier-template.error.generic');
? _('add-edit-clone-dossier-template.error.conflict')
: _('add-edit-clone-dossier-template.error.generic');
this._toaster.error(message, { error });
}
this._loadingService.stop();
@ -95,7 +104,7 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
private _getForm(): FormGroup {
return this._formBuilder.group({
name: [this.dossierTemplate?.name, Validators.required],
name: [this._getCloneName(), Validators.required],
description: [this.dossierTemplate?.description],
validFrom: [
this.dossierTemplate?.validFrom ? dayjs(this.dossierTemplate?.validFrom) : null,
@ -109,6 +118,32 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
});
}
private _getCloneName(): string {
if (this.data?.clone) {
const templateName = this.dossierTemplate.name.trim();
let nameOfClonedTemplate: string = templateName.split('Copy of ').filter(n => n)[0];
nameOfClonedTemplate = nameOfClonedTemplate.split(/\(\s*\d+\s*\)$/)[0].trim();
const allTemplatesNames = this._dossierTemplatesService.all.map(t => t.name);
let clonesCount = 0;
for (const name of allTemplatesNames) {
const splitName = name.split(nameOfClonedTemplate);
const suffixRegExp = new RegExp(/^\(\s*\d+\s*\)$/);
if (splitName[0] === 'Copy of ' && (splitName[1].trim().match(suffixRegExp) || splitName[1] === '')) {
clonesCount++;
}
}
if (clonesCount >= 1) {
return `Copy of ${nameOfClonedTemplate} ${clonesCount === 1 ? '(1)' : `(${clonesCount})`}`;
}
return `Copy of ${nameOfClonedTemplate}`;
}
return this.dossierTemplate?.name;
}
private _applyValidityIntervalConstraints(value): boolean {
if (applyIntervalConstraints(value, this._previousValidFrom, this._previousValidTo, this.form, 'validFrom', 'validTo')) {
return true;
@ -130,4 +165,11 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
return null;
};
}
get disabled(): boolean {
if (!this.data?.clone) {
return super.disabled;
}
return !this.valid;
}
}

View File

@ -1,23 +0,0 @@
<section class="dialog">
<div translate="clone-dossier-template.title" class="dialog-header heading-l"></div>
<div class="dialog-content">
<div class="iqser-input-group required w-full">
<label translate="clone-dossier-template.content.name"></label>
<input
[placeholder]="'clone-dossier-template.content.name-placeholder' | translate"
[(ngModel)]="nameOfClonedDossierTemplate"
name="name"
type="text"
/>
</div>
</div>
<div class="dialog-actions">
<button color="primary" mat-flat-button type="submit" (click)="save()" [disabled]="!nameOfClonedDossierTemplate">
{{ 'clone-dossier-template.actions.save' | translate }}
</button>
</div>
<iqser-circle-button class="dialog-close" icon="iqser:close" mat-dialog-close></iqser-circle-button>
</section>

View File

@ -1,66 +0,0 @@
import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { DossierTemplatesService } from '@services/dossier-templates/dossier-templates.service';
import { DossierTemplate } from '@red/domain';
import { LoadingService, Toaster } from '@iqser/common-ui';
import { firstValueFrom } from 'rxjs';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
@Component({
templateUrl: './clone-dossier-template-dialog.component.html',
styleUrls: ['./clone-dossier-template-dialog.component.scss'],
})
export class CloneDossierTemplateDialogComponent {
nameOfClonedDossierTemplate: string;
private readonly _dossierTemplate: DossierTemplate;
constructor(
private readonly _toaster: Toaster,
private readonly _loadingService: LoadingService,
private readonly _dossierTemplatesService: DossierTemplatesService,
protected readonly _dialogRef: MatDialogRef<CloneDossierTemplateDialogComponent>,
@Inject(MAT_DIALOG_DATA) readonly dossierTemplateId: string,
) {
this._dossierTemplate = this._dossierTemplatesService.find(dossierTemplateId);
this.nameOfClonedDossierTemplate = this._getCloneName();
}
async save() {
this._loadingService.start();
try {
await firstValueFrom(
this._dossierTemplatesService.clone(this.dossierTemplateId, {
...this._dossierTemplate,
name: this.nameOfClonedDossierTemplate,
}),
);
this._dialogRef.close(true);
} catch (error: any) {
this._toaster.error(_('clone-dossier-template.error.generic'), { params: error });
}
this._loadingService.stop();
}
private _getCloneName(): string | null {
const templateName = this._dossierTemplate.name.trim();
let nameOfClonedTemplate: string = templateName.split('Clone of ').filter(n => n)[0];
nameOfClonedTemplate = nameOfClonedTemplate.split(/\(\s*\d+\s*\)$/)[0].trim();
const allTemplatesNames = this._dossierTemplatesService.all.map(t => t.name);
let clonesCount = 0;
for (const name of allTemplatesNames) {
const splitName = name.split(nameOfClonedTemplate);
const suffixRegExp = new RegExp(/^\(\s*\d+\s*\)$/);
if (splitName[0] === 'Clone of ' && (splitName[1].trim().match(suffixRegExp) || splitName[1] === '')) {
clonesCount++;
}
}
if (clonesCount >= 1) {
return `Clone of ${nameOfClonedTemplate} ${clonesCount === 1 ? '(1)' : `(${clonesCount})`}`;
}
return `Clone of ${nameOfClonedTemplate}`;
}
}

View File

@ -61,7 +61,7 @@ export class DossierTemplatesListingScreenComponent extends ListingComponent<Dos
}
openAddDossierTemplateDialog() {
this._dialogService.openDialog('addEditDossierTemplate', null, null);
this._dialogService.openDialog('addEditCloneDossierTemplate', null, null);
}
private async _deleteTemplates(templateIds = this.listingService.selected.map(d => d.dossierTemplateId)) {

View File

@ -31,6 +31,6 @@ export class DossierTemplateInfoScreenComponent {
}
openEditDossierTemplateDialog($event: MouseEvent, dossierTemplate: DossierTemplate) {
this._dialogService.openDialog('addEditDossierTemplate', $event, { dossierTemplateId: dossierTemplate.id });
this._dialogService.openDialog('addEditCloneDossierTemplate', $event, { dossierTemplateId: dossierTemplate.id });
}
}

View File

@ -2,7 +2,7 @@ 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 { AddEditDossierTemplateDialogComponent } from '../dialogs/add-edit-dossier-template-dialog/add-edit-dossier-template-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';
@ -28,7 +28,6 @@ import { ActiveDossiersService } from '@services/dossiers/active-dossiers.servic
import { UserService } from '@services/user.service';
import { IDossierAttributeConfig, IFileAttributeConfig, IReportTemplate } from '@red/domain';
import { ReportTemplateService } from '@services/report-template.service';
import { CloneDossierTemplateDialogComponent } from '../dialogs/clone-dossier-template-dialog/clone-dossier-template-dialog.component';
type DialogType =
| 'confirm'
@ -39,8 +38,7 @@ type DialogType =
| 'fileAttributesConfigurations'
| 'addEditUser'
| 'smtpAuthConfig'
| 'addEditDossierTemplate'
| 'cloneDossierTemplate'
| 'addEditCloneDossierTemplate'
| 'addEditDossierAttribute'
| 'uploadDictionary'
| 'addEditDossierState'
@ -80,14 +78,10 @@ export class AdminDialogService extends DialogService<DialogType> {
component: SmtpAuthDialogComponent,
dialogConfig: { autoFocus: true },
},
addEditDossierTemplate: {
component: AddEditDossierTemplateDialogComponent,
addEditCloneDossierTemplate: {
component: AddEditCloneDossierTemplateDialogComponent,
dialogConfig: { width: '900px', autoFocus: true },
},
cloneDossierTemplate: {
component: CloneDossierTemplateDialogComponent,
dialogConfig: { disableClose: false },
},
addEditDossierAttribute: {
component: AddEditDossierAttributeDialogComponent,
dialogConfig: { autoFocus: true },

View File

@ -7,14 +7,14 @@
></iqser-circle-button>
<iqser-circle-button
(action)="openCloneDossierTemplateDialog($event)"
(action)="openEditCloneDossierTemplateDialog($event, true)"
[tooltip]="'dossier-templates-listing.action.clone' | translate"
icon="iqser:copy"
[type]="circleButtonTypes.dark"
></iqser-circle-button>
<iqser-circle-button
(action)="openEditDossierTemplateDialog($event)"
(action)="openEditCloneDossierTemplateDialog($event)"
[tooltip]="'dossier-templates-listing.action.edit' | translate"
icon="iqser:edit"
[type]="circleButtonTypes.dark"

View File

@ -31,12 +31,8 @@ export class DossierTemplateActionsComponent implements OnInit {
this.dossierTemplateId ??= this._route.snapshot.paramMap.get(DOSSIER_TEMPLATE_ID);
}
openEditDossierTemplateDialog($event: MouseEvent) {
this._dialogService.openDialog('addEditDossierTemplate', $event, this.dossierTemplateId);
}
openCloneDossierTemplateDialog($event: MouseEvent) {
this._dialogService.openDialog('cloneDossierTemplate', $event, this.dossierTemplateId);
openEditCloneDossierTemplateDialog($event: MouseEvent, clone: boolean = false) {
this._dialogService.openDialog('addEditCloneDossierTemplate', $event, { dossierTemplateId: this.dossierTemplateId, clone });
}
openDeleteDossierTemplateDialog($event?: MouseEvent) {

View File

@ -36,6 +36,22 @@
},
"header-new": "Dossier erstellen"
},
"add-edit-clone-dossier-template": {
"error": {
"conflict": "Dossiervorlage konnte nicht erstellt werden: Es existiert bereits eine Dossiervorlage mit demselben Namen.",
"generic": "Fehler beim Erstellen der Dossiervorlage."
},
"form": {
"description": "Beschreibung",
"description-placeholder": "Beschreibung eingeben",
"name": "Name der Dossier-Vorlage",
"name-placeholder": "Namen eingeben",
"valid-from": "Gültig ab",
"valid-to": "Gültig bis"
},
"save": "Dossier-Vorlage speichern",
"title": "{type, select, edit{Dossier-Vorlage {name} bearbeiten} create{Dossier-Vorlage erstellen} clone{} other{}}"
},
"add-edit-dossier-attribute": {
"error": {
"generic": "Attribut konnte nicht gespeichert werden!"
@ -61,22 +77,6 @@
"success": "",
"title": ""
},
"add-edit-dossier-template": {
"error": {
"conflict": "Dossiervorlage konnte nicht erstellt werden: Es existiert bereits eine Dossiervorlage mit demselben Namen.",
"generic": "Fehler beim Erstellen der Dossiervorlage."
},
"form": {
"description": "Beschreibung",
"description-placeholder": "Beschreibung eingeben",
"name": "Name der Dossier-Vorlage",
"name-placeholder": "Namen eingeben",
"valid-from": "Gültig ab",
"valid-to": "Gültig bis"
},
"save": "Dossier-Vorlage speichern",
"title": "{type, select, edit{Dossier-Vorlage {name} bearbeiten} create{Dossier-Vorlage erstellen} other{}}"
},
"add-edit-entity": {
"error": {
"entity-already-exists": "",

View File

@ -36,6 +36,22 @@
},
"header-new": "Create Dossier"
},
"add-edit-clone-dossier-template": {
"error": {
"conflict": "Failed to create dossier template: a dossier template with the same name already exists.",
"generic": "Failed to create dossier template."
},
"form": {
"description": "Description",
"description-placeholder": "Enter Description",
"name": "Dossier Template Name",
"name-placeholder": "Enter Name",
"valid-from": "Valid from",
"valid-to": "Valid to"
},
"save": "Save Dossier Template",
"title": "{type, select, edit{Edit {name}} create{Create} clone{Clone} other{}} Dossier Template"
},
"add-edit-dossier-attribute": {
"error": {
"generic": "Failed to save attribute!"
@ -61,22 +77,6 @@
"success": "Successfully {type, select, edit{updated} create{created} other{}} the dossier state!",
"title": "{type, select, edit{Edit {name}} create{Create} other{}} Dossier State"
},
"add-edit-dossier-template": {
"error": {
"conflict": "Failed to create dossier template: a dossier template with the same name already exists.",
"generic": "Failed to create dossier template."
},
"form": {
"description": "Description",
"description-placeholder": "Enter Description",
"name": "Dossier Template Name",
"name-placeholder": "Enter Name",
"valid-from": "Valid from",
"valid-to": "Valid to"
},
"save": "Save Dossier Template",
"title": "{type, select, edit{Edit {name}} create{Create} other{}} Dossier Template"
},
"add-edit-entity": {
"error": {
"entity-already-exists": "Entity with this name already exists!",