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

RED-2514, base dialog updates

Browse Source
This commit is contained in:
Adina Țeudan 2021-12-08 12:15:58 +02:00
parent e8305fd0e5
commit 271e22efc1
25 changed files with 204 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/red-ui/src/app/modules/admin/dialogs/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.html
View File

@ -3,7 +3,7 @@
{{ dialogHeader }}
</div>
<form (submit)="save()" [formGroup]="form">
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group mb-14">
<label translate="add-edit-dictionary.form.technical-name"></label>
@ -95,7 +95,7 @@
</div>
<div class="dialog-actions">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button type="submit">
<button [disabled]="!valid || !changed" color="primary" mat-flat-button>
{{ 'add-edit-dictionary.save' | translate }}
</button>
</div>

33
apps/red-ui/src/app/modules/admin/dialogs/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.ts
View File

@ -29,6 +29,7 @@ export class AddEditDictionaryDialogComponent extends BaseDialogComponent {
name: this._data.dictionary?.label,
});
readonly hasColor$: Observable<boolean>;
readonly disabled = false;
private readonly _dossierTemplateId = this._data.dossierTemplateId;
constructor(
@ -47,20 +48,8 @@ export class AddEditDictionaryDialogComponent extends BaseDialogComponent {
this.technicalName$ = this.form.get('label').valueChanges.pipe(map(value => this._toTechnicalName(value)));
}
private _getForm(dictionary: Dictionary): FormGroup {
return this._formBuilder.group({
label: [dictionary?.label, [Validators.required, Validators.minLength(3)]],
description: [dictionary?.description],
rank: [dictionary?.rank, Validators.required],
hexColor: [dictionary?.hexColor, [Validators.required, Validators.minLength(7)]],
hint: [!!dictionary?.hint],
addToDictionaryAction: [!!dictionary?.addToDictionaryAction],
caseSensitive: [this.getDictCaseSensitive(dictionary)],
});
}
getDictCaseSensitive(dictionary: Dictionary): boolean {
return dictionary ? !dictionary.caseInsensitive : false;
get valid(): boolean {
return this.form.valid;
}
get changed(): boolean {
@ -92,6 +81,10 @@ export class AddEditDictionaryDialogComponent extends BaseDialogComponent {
return this.form.get('hexColor').valueChanges.pipe(map((value: string) => !value || value?.length === 0));
}
getDictCaseSensitive(dictionary: Dictionary): boolean {
return dictionary ? !dictionary.caseInsensitive : false;
}
async save(): Promise<void> {
const dictionary = this._formToObject();
let observable: Observable<unknown>;
@ -119,6 +112,18 @@ export class AddEditDictionaryDialogComponent extends BaseDialogComponent {
});
}
private _getForm(dictionary: Dictionary): FormGroup {
return this._formBuilder.group({
label: [dictionary?.label, [Validators.required, Validators.minLength(3)]],
description: [dictionary?.description],
rank: [dictionary?.rank, Validators.required],
hexColor: [dictionary?.hexColor, [Validators.required, Validators.minLength(7)]],
hint: [!!dictionary?.hint],
addToDictionaryAction: [!!dictionary?.addToDictionaryAction],
caseSensitive: [this.getDictCaseSensitive(dictionary)],
});
}
private _toTechnicalName(value: string) {
const existingTechnicalNames = Object.keys(this._appStateService.dictionaryData[this._dossierTemplateId]);
const baseTechnicalName = toKebabCase(value.trim());

4
apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-attribute-dialog/add-edit-dossier-attribute-dialog.component.html
View File

@ -8,7 +8,7 @@
class="dialog-header heading-l"
></div>
<form (submit)="saveDossierAttribute()" [formGroup]="form">
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group required w-300">
<label translate="add-edit-dossier-attribute.form.label"></label>
@ -35,7 +35,7 @@
</div>
</div>
<div class="dialog-actions">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button type="submit">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button>
{{ 'add-edit-dossier-attribute.save' | translate }}
</button>
</div>

4
apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-dossier-template-dialog.component.html
View File

@ -8,7 +8,7 @@
class="dialog-header heading-l"
></div>
<form (submit)="save()" [formGroup]="form">
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group required w-300">
<label translate="add-edit-dossier-template.form.name"></label>
@ -87,7 +87,7 @@
</div>
<div class="dialog-actions">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button type="submit">
<button [disabled]="!valid || !changed" color="primary" mat-flat-button>
{{ 'add-edit-dossier-template.save' | translate }}
</button>
</div>

34
apps/red-ui/src/app/modules/admin/dialogs/add-edit-dossier-template-dialog/add-edit-dossier-template-dialog.component.ts
View File

@ -25,7 +25,7 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
key: type,
label: downloadTypesTranslations[type],
}));
readonly disabled = false;
private _previousValidFrom: Moment;
private _previousValidTo: Moment;
@ -49,20 +49,8 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
});
}
private _getForm(): FormGroup {
return this._formBuilder.group({
name: [this.dossierTemplate?.name, Validators.required],
description: [this.dossierTemplate?.description],
validFrom: [
this.dossierTemplate?.validFrom ? moment(this.dossierTemplate?.validFrom) : null,
this._requiredIfValidator(() => this.hasValidFrom),
],
validTo: [
this.dossierTemplate?.validTo ? moment(this.dossierTemplate?.validTo) : null,
this._requiredIfValidator(() => this.hasValidTo),
],
downloadFileTypes: [this.dossierTemplate?.downloadFileTypes || ['PREVIEW', 'REDACTED']],
});
get valid(): boolean {
return this.form.valid;
}
get changed(): boolean {
@ -119,6 +107,22 @@ export class AddEditDossierTemplateDialogComponent extends BaseDialogComponent {
}
}
private _getForm(): FormGroup {
return this._formBuilder.group({
name: [this.dossierTemplate?.name, Validators.required],
description: [this.dossierTemplate?.description],
validFrom: [
this.dossierTemplate?.validFrom ? moment(this.dossierTemplate?.validFrom) : null,
this._requiredIfValidator(() => this.hasValidFrom),
],
validTo: [
this.dossierTemplate?.validTo ? moment(this.dossierTemplate?.validTo) : null,
this._requiredIfValidator(() => this.hasValidTo),
],
downloadFileTypes: [this.dossierTemplate?.downloadFileTypes || ['PREVIEW', 'REDACTED']],
});
}
private _applyValidityIntervalConstraints(value): boolean {
if (applyIntervalConstraints(value, this._previousValidFrom, this._previousValidTo, this.form, 'validFrom', 'validTo')) {
return true;

26
apps/red-ui/src/app/modules/admin/dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component.html
View File

@ -8,7 +8,7 @@
class="dialog-header heading-l"
></div>
<form (submit)="save()" [formGroup]="form">
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group required w-300">
<label translate="add-edit-file-attribute.form.name"></label>
@ -53,20 +53,38 @@
</div>
<div class="red-input-group mt-0">
<mat-checkbox color="primary" formControlName="filterable" name="filterable">
<mat-checkbox
[matTooltipDisabled]="canSetFilterable"
[matTooltip]="
'add-edit-file-attribute.form.filterable-disabled' | translate: { maxNumber: DISPLAYED_FILTERABLE_LIMIT }
"
color="primary"
formControlName="filterable"
matTooltipPosition="above"
name="filterable"
>
{{ 'add-edit-file-attribute.form.filterable' | translate }}
</mat-checkbox>
</div>
<div class="red-input-group mt-0">
<mat-checkbox color="primary" formControlName="displayedInFileList" name="displayedInFileList">
<mat-checkbox
[matTooltipDisabled]="canSetDisplayed"
[matTooltip]="
'add-edit-file-attribute.form.displayed-disabled' | translate: { maxNumber: DISPLAYED_FILTERABLE_LIMIT }
"
color="primary"
formControlName="displayedInFileList"
matTooltipPosition="above"
name="displayedInFileList"
>
{{ 'add-edit-file-attribute.form.displayedInFileList' | translate }}
</mat-checkbox>
</div>
</div>
</div>
<div class="dialog-actions">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button type="submit">
<button [disabled]="!valid || !changed" color="primary" mat-flat-button>
{{ 'add-edit-file-attribute.save' | translate }}
</button>
</div>

31
apps/red-ui/src/app/modules/admin/dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component.ts
View File

@ -1,29 +1,48 @@
import { Component, Inject } from '@angular/core';
import { ChangeDetectionStrategy, Component, Inject } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { FileAttributeConfigTypes, IFileAttributeConfig } from '@red/domain';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { fileAttributeTypesTranslations } from '../../translations/file-attribute-types-translations';
import { FileAttributesService } from '@services/entity-services/file-attributes.service';
import { BaseDialogComponent } from '@iqser/common-ui';
@Component({
selector: 'redaction-add-edit-file-attribute-dialog',
templateUrl: './add-edit-file-attribute-dialog.component.html',
styleUrls: ['./add-edit-file-attribute-dialog.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AddEditFileAttributeDialogComponent extends BaseDialogComponent {
readonly disabled = false;
DISPLAYED_FILTERABLE_LIMIT = 3;
translations = fileAttributeTypesTranslations;
fileAttribute: IFileAttributeConfig = this.data.fileAttribute;
dossierTemplateId: string = this.data.dossierTemplateId;
readonly form: FormGroup = this._getForm(this.fileAttribute);
readonly form!: FormGroup;
readonly typeOptions = Object.keys(FileAttributeConfigTypes);
translations = fileAttributeTypesTranslations;
readonly canSetDisplayed!: boolean;
readonly canSetFilterable!: boolean;
constructor(
private readonly _formBuilder: FormBuilder,
private readonly _fileAttributesService: FileAttributesService,
public dialogRef: MatDialogRef<AddEditFileAttributeDialogComponent>,
@Inject(MAT_DIALOG_DATA)
public data: { fileAttribute: IFileAttributeConfig; dossierTemplateId: string },
public data: {
fileAttribute: IFileAttributeConfig;
dossierTemplateId: string;
numberOfDisplayedAttrs: number;
numberOfFilterableAttrs: number;
},
) {
super();
this.canSetDisplayed = data.numberOfDisplayedAttrs < this.DISPLAYED_FILTERABLE_LIMIT || data.fileAttribute?.displayedInFileList;
this.canSetFilterable = data.numberOfFilterableAttrs < this.DISPLAYED_FILTERABLE_LIMIT || data.fileAttribute?.filterable;
this.form = this._getForm(this.fileAttribute);
}
get valid(): boolean {
return this.form.valid;
}
get changed(): boolean {
@ -60,8 +79,8 @@ export class AddEditFileAttributeDialogComponent extends BaseDialogComponent {
type: [fileAttribute?.type || FileAttributeConfigTypes.TEXT, Validators.required],
readonly: [fileAttribute ? !fileAttribute.editable : false],
primaryAttribute: [fileAttribute?.primaryAttribute],
filterable: [fileAttribute?.filterable],
displayedInFileList: [fileAttribute?.displayedInFileList],
filterable: { value: fileAttribute?.filterable, disabled: !this.canSetFilterable },
displayedInFileList: { value: fileAttribute?.displayedInFileList, disabled: !this.canSetDisplayed },
});
}
}

4
apps/red-ui/src/app/modules/admin/dialogs/edit-color-dialog/edit-color-dialog.component.html
View File

@ -1,7 +1,7 @@
<section class="dialog">
<div [translate]="translations[data.colorKey]" class="dialog-header heading-l"></div>
<form (submit)="save()" [formGroup]="form">
<form [formGroup]="form">
<div class="dialog-content">
<div class="iqser-input-group required">
<label translate="edit-color-dialog.form.color"></label>
@ -28,7 +28,7 @@
</div>
<div class="dialog-actions">
<button [disabled]="form.invalid || !changed" color="primary" mat-flat-button type="submit">
<button [disabled]="!valid || !changed" color="primary" mat-flat-button>
{{ 'edit-color-dialog.save' | translate }}
</button>
</div>

13
apps/red-ui/src/app/modules/admin/dialogs/edit-color-dialog/edit-color-dialog.component.ts
View File

@ -21,6 +21,7 @@ interface IEditColorData {
export class EditColorDialogComponent extends BaseDialogComponent {
readonly form: FormGroup;
translations = defaultColorsTranslations;
readonly disabled = false;
private readonly _initialColor: string;
private readonly _dossierTemplateId: string;
@ -44,10 +45,8 @@ export class EditColorDialogComponent extends BaseDialogComponent {
return this.form.get('color').value !== this._initialColor;
}
private _getForm(): FormGroup {
return this._formBuilder.group({
color: [this.data.colors[this.data.colorKey], [Validators.required, Validators.minLength(7)]],
});
get valid(): boolean {
return this.form.valid;
}
async save() {
@ -65,4 +64,10 @@ export class EditColorDialogComponent extends BaseDialogComponent {
this._toaster.error(_('edit-color-dialog.error'));
}
}
private _getForm(): FormGroup {
return this._formBuilder.group({
color: [this.data.colors[this.data.colorKey], [Validators.required, Validators.minLength(7)]],
});
}
}

25
apps/red-ui/src/app/modules/admin/screens/file-attributes-listing/file-attributes-listing-screen.component.ts
View File

@ -63,19 +63,28 @@ export class FileAttributesListingScreenComponent extends ListingComponent<FileA
super(_injector);
}
private get _numberOfDisplayedAttrs(): number {
return this.entitiesService.all.filter(attr => attr.displayedInFileList).length;
}
private get _numberOfFilterableAttrs(): number {
return this.entitiesService.all.filter(attr => attr.filterable).length;
}
async ngOnInit() {
await this._loadData();
}
openAddEditAttributeDialog($event: MouseEvent, fileAttribute?: IFileAttributeConfig) {
this._dialogService.openDialog(
'addEditFileAttribute',
$event,
{ fileAttribute, dossierTemplateId: this._dossierTemplatesService.activeDossierTemplateId },
(newValue: IFileAttributeConfig) => {
this._loadingService.loadWhile(this._createNewFileAttributeAndRefreshView(newValue));
},
);
const data = {
fileAttribute,
dossierTemplateId: this._dossierTemplatesService.activeDossierTemplateId,
numberOfDisplayedAttrs: this._numberOfDisplayedAttrs,
numberOfFilterableAttrs: this._numberOfFilterableAttrs,
};
this._dialogService.openDialog('addEditFileAttribute', $event, data, (newValue: IFileAttributeConfig) => {
this._loadingService.loadWhile(this._createNewFileAttributeAndRefreshView(newValue));
});
}
openConfirmDeleteAttributeDialog($event: MouseEvent, fileAttribute?: IFileAttributeConfig) {

24
apps/red-ui/src/app/modules/admin/screens/justifications/add-edit-justification-dialog/add-edit-justification-dialog.component.ts
View File

@ -4,7 +4,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { Justification } from '@red/domain';
import { JustificationsService } from '@services/entity-services/justifications.service';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { BaseDialogComponent, LoadingService } from '@iqser/common-ui';
import { LoadingService } from '@iqser/common-ui';
@Component({
selector: 'redaction-add-edit-justification-dialog',
@ -12,7 +12,7 @@ import { BaseDialogComponent, LoadingService } from '@iqser/common-ui';
styleUrls: ['./add-edit-justification-dialog.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AddEditJustificationDialogComponent extends BaseDialogComponent {
export class AddEditJustificationDialogComponent {
readonly form: FormGroup = this._getForm();
constructor(
@ -22,17 +22,7 @@ export class AddEditJustificationDialogComponent extends BaseDialogComponent {
private readonly _loadingService: LoadingService,
public dialogRef: MatDialogRef<AddEditJustificationDialogComponent>,
@Inject(MAT_DIALOG_DATA) public justification: Justification,
) {
super();
}
private _getForm(): FormGroup {
return this._formBuilder.group({
name: [{ value: this.justification?.name, disabled: !!this.justification }, Validators.required],
reason: [this.justification?.reason, Validators.required],
description: [this.justification?.description, Validators.required],
});
}
) {}
get changed(): boolean {
return (
@ -50,4 +40,12 @@ export class AddEditJustificationDialogComponent extends BaseDialogComponent {
this._loadingService.stop();
this.dialogRef.close(true);
}
private _getForm(): FormGroup {
return this._formBuilder.group({
name: [{ value: this.justification?.name, disabled: !!this.justification }, Validators.required],
reason: [this.justification?.reason, Validators.required],
description: [this.justification?.description, Validators.required],
});
}
}

6
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/attributes/edit-dossier-attributes.component.html
View File

@ -1,4 +1,4 @@
<form (submit)="save()" *ngIf="form" [formGroup]="form">
<form *ngIf="form" [formGroup]="form">
<div>
<div *ngIf="customAttributes.length" class="heading">
{{ 'edit-dossier-dialog.attributes.custom-attributes' | translate }}
@ -57,7 +57,7 @@
<iqser-icon-button
(action)="fileInputClick(attr)"
*ngIf="!currentAttrValue(attr)"
[disabled]="!canEdit"
[disabled]="disabled"
[label]="'edit-dossier-dialog.attributes.upload-image' | translate"
[type]="iconButtonTypes.dark"
class="upload-button"
@ -75,7 +75,7 @@
type="file"
/>
</div>
<div *ngIf="currentAttrValue(attr) && canEdit">
<div *ngIf="currentAttrValue(attr) && !disabled">
<iqser-circle-button
(action)="deleteAttr(attr)"
[tooltip]="'edit-dossier-dialog.attributes.delete-image' | translate"

8
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/attributes/edit-dossier-attributes.component.ts
View File

@ -48,12 +48,12 @@ export class EditDossierAttributesComponent implements EditDossierSectionInterfa
return false;
}
get disabled() {
get disabled(): boolean {
return !this._permissionsService.isOwner(this.dossier);
}
get canEdit(): boolean {
return this._permissionsService.isOwner(this.dossier);
get valid(): boolean {
return this.form.valid;
}
async ngOnInit() {
@ -134,7 +134,7 @@ export class EditDossierAttributesComponent implements EditDossierSectionInterfa
private _getForm(): FormGroup {
const controlsConfig = {};
for (const attribute of this.attributes) {
controlsConfig[attribute.id] = [{ value: attribute.value, disabled: !this.canEdit }];
controlsConfig[attribute.id] = [{ value: attribute.value, disabled: this.disabled }];
}
return this._formBuilder.group(controlsConfig);
}

1
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/deleted-documents/edit-dossier-deleted-documents.component.ts
View File

@ -39,6 +39,7 @@ interface FileListItem extends IFile, IListable {
export class EditDossierDeletedDocumentsComponent extends ListingComponent<FileListItem> implements EditDossierSectionInterface, OnInit {
@Input() dossier: Dossier;
readonly changed = false;
readonly valid = false;
readonly canRestoreSelected$ = this._canRestoreSelected$;
disabled: boolean;
readonly tableColumnConfigs: TableColumnConfig<FileListItem>[] = [

8
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/dictionary/edit-dossier-dictionary.component.ts
View File

@ -29,14 +29,18 @@ export class EditDossierDictionaryComponent implements EditDossierSectionInterfa
private readonly _toaster: Toaster,
) {}
get changed() {
get changed(): boolean {
return this._dictionaryManager.editor.hasChanges;
}
get disabled() {
get disabled(): boolean {
return !this.canEdit;
}
get valid(): boolean {
return this._dictionaryManager.editor.hasChanges;
}
async ngOnInit() {
this._loadingService.start();
this.canEdit = this._permissionsService.isDossierMember(this.dossier);

4
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.html
View File

@ -1,9 +1,9 @@
<form [formGroup]="dossierForm" *ngIf="dossierForm">
<form *ngIf="form" [formGroup]="form">
<redaction-select
[label]="'report-type.label' | translate: { length: reportTypesLength }"
[optionTemplate]="reportTemplateOptionTemplate"
[options]="availableReportTypes"
[valueMapper]="reportTemplateValueMapper"
[optionTemplate]="reportTemplateOptionTemplate"
class="mr-16"
formControlName="reportTemplateIds"
></redaction-select>

28
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/download-package/edit-dossier-download-package.component.ts
View File

@ -12,7 +12,7 @@ import { ReportTemplateService } from '@services/report-template.service';
styleUrls: ['./edit-dossier-download-package.component.scss'],
})
export class EditDossierDownloadPackageComponent implements OnInit, EditDossierSectionInterface {
dossierForm: FormGroup;
form: FormGroup;
downloadTypes: { key: DownloadFileType; label: string }[] = ['ORIGINAL', 'PREVIEW', 'REDACTED'].map((type: DownloadFileType) => ({
key: type,
label: downloadTypesTranslations[type],
@ -28,22 +28,22 @@ export class EditDossierDownloadPackageComponent implements OnInit, EditDossierS
) {}
get reportTypesLength() {
return this.dossierForm.controls['reportTemplateIds']?.value?.length || 0;
return this.form.controls['reportTemplateIds']?.value?.length || 0;
}
get downloadFileTypesLength() {
return this.dossierForm.controls['downloadFileTypes']?.value?.length || 0;
return this.form.controls['downloadFileTypes']?.value?.length || 0;
}
get changed() {
if (this.dossierForm) {
for (const key of Object.keys(this.dossierForm.getRawValue())) {
if (this.dossier[key].length !== this.dossierForm.get(key).value.length) {
if (this.form) {
for (const key of Object.keys(this.form.getRawValue())) {
if (this.dossier[key].length !== this.form.get(key).value.length) {
return true;
}
const originalItems = [...this.dossier[key]].sort();
const newItems = [...this.dossierForm.get(key).value].sort();
const newItems = [...this.form.get(key).value].sort();
for (let idx = 0; idx < originalItems.length; ++idx) {
if (originalItems[idx] !== newItems[idx]) {
@ -57,7 +57,11 @@ export class EditDossierDownloadPackageComponent implements OnInit, EditDossierS
}
get disabled() {
return this.dossierForm?.invalid || !this.dossierForm?.value?.downloadFileTypes?.length;
return !this.form?.value?.downloadFileTypes?.length;
}
get valid(): boolean {
return this.form.valid;
}
reportTemplateValueMapper = (reportTemplate: IReportTemplate) => reportTemplate.templateId;
@ -66,14 +70,14 @@ export class EditDossierDownloadPackageComponent implements OnInit, EditDossierS
this.availableReportTypes =
(await this._reportTemplateController.getAvailableReportTemplates(this.dossier.dossierTemplateId).toPromise()) || [];
this.dossierForm = this._getForm();
this.form = this._getForm();
}
async save(): EditDossierSaveResult {
const dossier = {
...this.dossier,
downloadFileTypes: this.dossierForm.get('downloadFileTypes').value,
reportTemplateIds: this.dossierForm.get('reportTemplateIds').value,
downloadFileTypes: this.form.get('downloadFileTypes').value,
reportTemplateIds: this.form.get('reportTemplateIds').value,
};
try {
await this._dossiersService.createOrUpdate(dossier).toPromise();
@ -84,7 +88,7 @@ export class EditDossierDownloadPackageComponent implements OnInit, EditDossierS
}
revert() {
this.dossierForm.reset({
this.form.reset({
downloadFileTypes: this.dossier.downloadFileTypes,
reportTemplateIds: this.dossier.reportTemplateIds,
});

9
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/edit-dossier-dialog.component.html
View File

@ -49,17 +49,12 @@
</div>
<div *ngIf="showActionButtons" class="dialog-actions">
<button
(click)="save()"
[disabled]="activeComponent?.disabled || !activeComponent?.changed"
color="primary"
mat-flat-button
>
<button (click)="save()" [disabled]="disabled || !valid || !changed" color="primary" mat-flat-button>
{{ 'edit-dossier-dialog.actions.save' | translate }}
</button>
<iqser-icon-button
(action)="save(true)"
[disabled]="activeComponent?.disabled || !activeComponent?.changed"
[disabled]="disabled || !valid || !changed"
[label]="'edit-dossier-dialog.actions.save-and-close' | translate"
[type]="iconButtonTypes.dark"
>

19
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/edit-dossier-dialog.component.ts
View File

@ -4,7 +4,7 @@ import { Dossier } from '@red/domain';
import { EditDossierGeneralInfoComponent } from './general-info/edit-dossier-general-info.component';
import { EditDossierDownloadPackageComponent } from './download-package/edit-dossier-download-package.component';
import { EditDossierSectionInterface } from './edit-dossier-section.interface';
import { IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
import { BaseDialogComponent, IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui';
import { EditDossierDictionaryComponent } from './dictionary/edit-dossier-dictionary.component';
import { EditDossierAttributesComponent } from './attributes/edit-dossier-attributes.component';
@ -21,7 +21,7 @@ type Section = 'dossierInfo' | 'downloadPackage' | 'dossierDictionary' | 'member
templateUrl: './edit-dossier-dialog.component.html',
styleUrls: ['./edit-dossier-dialog.component.scss'],
})
export class EditDossierDialogComponent {
export class EditDossierDialogComponent extends BaseDialogComponent {
readonly navItems: { key: Section; title?: string; sideNavTitle?: string }[];
readonly iconButtonTypes = IconButtonTypes;
activeNav: Section;
@ -47,6 +47,7 @@ export class EditDossierDialogComponent {
section?: Section;
},
) {
super();
this.navItems = [
{
key: 'dossierInfo',
@ -111,6 +112,18 @@ export class EditDossierDialogComponent {
return !['deletedDocuments'].includes(this.activeNav);
}
get changed(): boolean {
return this.activeComponent?.changed;
}
get valid(): boolean {
return this.activeComponent?.valid;
}
get disabled(): boolean {
return this.activeComponent?.disabled;
}
afterSave() {
this._toaster.success(_('edit-dossier-dialog.change-successful'), { params: { dossierName: this._dossierName } });
}
@ -134,7 +147,7 @@ export class EditDossierDialogComponent {
}
changeTab(key: Section) {
if (this.activeComponent.changed) {
if (this.changed) {
this._toaster.error(_('edit-dossier-dialog.unsaved-changes'));
return;
}

1
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/edit-dossier-section.interface.ts
View File

@ -2,6 +2,7 @@ export type EditDossierSaveResult = Promise<{ success: boolean }>;
export interface EditDossierSectionInterface {
changed: boolean;
valid: boolean;
disabled: boolean;
save: (...args: any) => EditDossierSaveResult;
revert: Function;

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

@ -1,4 +1,4 @@
<form (submit)="save()" [formGroup]="form">
<form [formGroup]="form">
<div class="iqser-input-group w-300">
<mat-form-field floatLabel="always">
<mat-label>{{ 'assign-dossier-owner.dialog.single-user' | translate }}</mat-label>

2
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.html
View File

@ -1,4 +1,4 @@
<form (submit)="save()" [formGroup]="dossierForm">
<form [formGroup]="form">
<div class="iqser-input-group required w-300">
<label translate="edit-dossier-dialog.general-info.form.name.label"></label>
<input

36
apps/red-ui/src/app/modules/dossier/dialogs/edit-dossier-dialog/general-info/edit-dossier-general-info.component.ts
View File

@ -24,7 +24,7 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
@Input() dossier: Dossier;
dossierForm: FormGroup;
form: FormGroup;
hasDueDate: boolean;
dossierTemplates: IDossierTemplate[];
@ -40,16 +40,16 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
private readonly _toaster: Toaster,
) {}
get changed() {
for (const key of Object.keys(this.dossierForm.getRawValue())) {
get changed(): boolean {
for (const key of Object.keys(this.form.getRawValue())) {
if (key === 'dueDate') {
if (this.hasDueDate !== !!this.dossier.dueDate) {
return true;
}
if (this.hasDueDate && !moment(this.dossier.dueDate).isSame(moment(this.dossierForm.get(key).value))) {
if (this.hasDueDate && !moment(this.dossier.dueDate).isSame(moment(this.form.get(key).value))) {
return true;
}
} else if (this.dossier[key] !== this.dossierForm.get(key).value) {
} else if (this.dossier[key] !== this.form.get(key).value) {
return true;
}
}
@ -57,22 +57,22 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
return false;
}
get disabled() {
if (this.hasDueDate && this.dossierForm.get('dueDate').value === null) {
return true;
}
get valid(): boolean {
return this.form.valid;
}
return this.dossierForm.invalid;
get disabled(): boolean {
return this.hasDueDate && this.form.get('dueDate').value === null;
}
ngOnInit() {
this._filterInvalidDossierTemplates();
this.dossierForm = this._getForm();
this.form = this._getForm();
this.hasDueDate = !!this.dossier.dueDate;
}
revert() {
this.dossierForm.reset({
this.form.reset({
dossierName: this.dossier.dossierName,
dossierTemplateId: this.dossier.dossierTemplateId,
description: this.dossier.description,
@ -85,12 +85,12 @@ export class EditDossierGeneralInfoComponent implements OnInit, EditDossierSecti
async save(): EditDossierSaveResult {
const dossier = {
...this.dossier,
dossierName: this.dossierForm.get('dossierName').value,
description: this.dossierForm.get('description').value,
watermarkEnabled: this.dossierForm.get('watermarkEnabled').value,
watermarkPreviewEnabled: this.dossierForm.get('watermarkPreviewEnabled').value,
dueDate: this.hasDueDate ? this.dossierForm.get('dueDate').value : undefined,
dossierTemplateId: this.dossierForm.get('dossierTemplateId').value,
dossierName: this.form.get('dossierName').value,
description: this.form.get('description').value,
watermarkEnabled: this.form.get('watermarkEnabled').value,
watermarkPreviewEnabled: this.form.get('watermarkPreviewEnabled').value,
dueDate: this.hasDueDate ? this.form.get('dueDate').value : undefined,
dossierTemplateId: this.form.get('dossierTemplateId').value,
} as IDossierRequest;
try {
await this._dossiersService.createOrUpdate(dossier).toPromise();

2
apps/red-ui/src/assets/i18n/en.json
View File

@ -88,8 +88,10 @@
"form": {
"column-header": "CSV Column Header",
"column-header-placeholder": "Enter CSV Column Header",
"displayed-disabled": "The maximum number of displayed attributes ({maxNumber}) has been reached.",
"displayedInFileList": "Displayed In File List",
"filterable": "Filterable",
"filterable-disabled": "The maximum number of filterable attributes ({maxNumber}) has been reached.",
"name": "Attribute Name",
"name-placeholder": "Enter Name",
"primary": "Set as Primary",

2
libs/common-ui

@ -1 +1 @@
Subproject commit 1f5df2f7308d757d39df78b5b06a63c69e1865f4
Subproject commit af9adfd5799e20d8f674a5523ebfeda87897ef97