MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Make Dataset Editor more safe when saving and make save pop messages more consistent

This commit is contained in:
George Kalampokis 2022-04-01 17:20:37 +03:00
parent 5faa44c015
commit a9199ab8f0
3 changed files with 49 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.html
View File

@ -28,27 +28,27 @@
</div>
<div class="row">
<div class="col-auto d-flex align-items-center p-0" *ngIf="!viewOnly">
<button *ngIf="isDirty()" type="button" mat-raised-button class="dataset-discard-btn" (click)="discardChanges()">
<button [disabled]="saving" *ngIf="isDirty()" type="button" mat-raised-button class="dataset-discard-btn" (click)="discardChanges()">
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
</button>
</div>
<div class="col-auto d-flex align-items-center">
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" type="button" (click)="save()">
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" type="button" (click)="save()">
{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}
<mat-icon (click)="$event.stopPropagation();" style="width: 14px;" [matMenuTriggerFor]="menu">expand_more</mat-icon>
<mat-icon [disabled]="saving" (click)="$event.stopPropagation();" style="width: 14px;" [matMenuTriggerFor]="menu">expand_more</mat-icon>
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
<button mat-menu-item (click)="save(saveAnd.addNew)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button>
<button mat-menu-item (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CONTINUE' | translate }}</button>
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.addNew)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button>
<button [disabled]="saving" mat-menu-item (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CONTINUE' | translate }}</button>
</mat-menu>
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" type="button" (click)="saveFinalize()">{{ 'DATASET-WIZARD.ACTIONS.FINALIZE' | translate }}</button>
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" type="button" (click)="saveFinalize()">{{ 'DATASET-WIZARD.ACTIONS.FINALIZE' | translate }}</button>
<!-- <button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button> -->
<button *ngIf="lockStatus" mat-raised-button disabled class="dataset-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
<button *ngIf="hasReversableStatus() && !lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="reverse()" type="button">{{ 'DATASET-WIZARD.ACTIONS.REVERSE' | translate }}</button>
<button [disabled]="saving" *ngIf="lockStatus" mat-raised-button disabled class="dataset-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
<button [disabled]="saving" *ngIf="hasReversableStatus() && !lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="reverse()" type="button">{{ 'DATASET-WIZARD.ACTIONS.REVERSE' | translate }}</button>
<!-- <button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="touchForm()" type="button">{{ 'DATASET-WIZARD.ACTIONS.VALIDATE' | translate }}</button> -->
</div>
</div>
@ -89,9 +89,9 @@
<span class="material-icons">chevron_right</span>
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
</div>
<div *ngIf="(step === maxStep) && !lockStatus && formGroup.get('profile').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-dataset-btn ml-auto">
<div (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</div>
</div>
<button [disabled]="saving" (click)="save(saveAnd.addNew)" *ngIf="(step === maxStep) && !lockStatus && formGroup.get('profile').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-dataset-btn ml-auto">
{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}
</button>
</div>
<div class="col-auto pr-0">
<app-form-progress-indication class="col-12" *ngIf="formGroup && !viewOnly" [formGroup]="formGroup" [isDatasetEditor]="true"></app-form-progress-indication>

8
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.scss
View File

@ -427,11 +427,12 @@
}
.add-dataset-btn {
color: #212121;
background: #f7dd72 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px #1e202029;
font-weight: 500;
cursor: pointer;
word-wrap: break-word;
white-space: normal;
line-height: normal;
}
.next {
@ -450,8 +451,7 @@
cursor: pointer;
}
.previous-disabled,
.add-dataset-btn-disabled {
.previous-disabled {
border: 1px solid #b5b5b5;
color: #b5b5b5 !important;
cursor: auto !important;

64
dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts
View File

@ -1,4 +1,4 @@
import {Component, OnInit, ViewChild} from '@angular/core';
import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
import {AbstractControl, FormArray, FormControl, FormGroup} from '@angular/forms';
import {MatDialog} from '@angular/material/dialog';
import {MatSnackBar} from '@angular/material/snack-bar';
@ -72,6 +72,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme
hasChanges = false;
isDiscarded = false;
formGroupRawValue: any;
saving = false;
DatasetStatus = DatasetStatus;
dmpAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
@ -759,7 +760,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme
}
save(saveType?: SaveType) {
this.saving = true;
Object.keys(this.formGroup.controls).forEach(controlName => {
if (controlName == 'datasetProfileDefinition') {
return;
@ -895,39 +896,40 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme
this.router.navigate(['/reload']).then(() => {
this.router.navigate(['/plans', 'edit', this.formGroup.get('dmp').value.id]);
});
} else {
} else if (saveType === SaveType.finalize) {
this.router.navigate(['/reload']).then(() => {
this.router.navigate(['/datasets', 'edit', data.id]);
});
} else {
this.datasetWizardModel = new DatasetWizardEditorModel().fromModel(data);
this.editMode = this.datasetWizardModel.status === DatasetStatus.Draft;
// setTimeout(() => { this.formGroup = null; });
setTimeout(() => {
this.formGroup.get('id').patchValue(data.id);
this.formGroup.get('modified').patchValue(data.modified);
this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
this.hasChanges = false;
// this.formGroup = this.datasetWizardModel.buildForm();
// if (this.formGroup.get('datasetProfileDefinition')) {
// this.formGroup.removeControl('datasetProfileDefinition');
// this.getDefinition(data.profile.id);
// this.maxStep = 1;
// } else {
// this.getDefinition(data.profile.id);
// this.maxStep = 1;
// }
});
setTimeout(() => {
document.getElementById('dataset-editor-form').scrollTop = this.scrollTop;
document.getElementById('stepper-options').scrollTop = this.tocScrollTop;
}, 500);
this.saving = false;
this.isNew = false;
// this.router.navigate(['/reload']).then(() => { this.router.navigate(['/datasets', 'edit', data.id]); });
}
// } else {
// this.datasetWizardModel = new DatasetWizardEditorModel().fromModel(data);
// this.editMode = this.datasetWizardModel.status === DatasetStatus.Draft;
// // setTimeout(() => { this.formGroup = null; });
// setTimeout(() => {
// this.formGroup.get('id').patchValue(data.id);
// this.formGroup.get('modified').patchValue(data.modified);
// this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
// this.hasChanges = false;
// // this.formGroup = this.datasetWizardModel.buildForm();
// // if (this.formGroup.get('datasetProfileDefinition')) {
// // this.formGroup.removeControl('datasetProfileDefinition');
// // this.getDefinition(data.profile.id);
// // this.maxStep = 1;
// // } else {
// // this.getDefinition(data.profile.id);
// // this.maxStep = 1;
// // }
// });
// setTimeout(() => {
// document.getElementById('dataset-editor-form').scrollTop = this.scrollTop;
// document.getElementById('stepper-options').scrollTop = this.tocScrollTop;
// }, 500);
// // this.router.navigate(['/reload']).then(() => { this.router.navigate(['/datasets', 'edit', data.id]); });
// }
} else {
this.router.navigate(['/datasets']);
}