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

Removes old dataset editor on click of edit dataset

This commit is contained in:
apapachristou 2020-08-04 14:35:02 +03:00
parent 9ffa1a5a54
commit de10a986db
4 changed files with 61 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.ts
View File

@ -269,7 +269,7 @@ export class DatasetOverviewComponent extends BaseComponent implements OnInit {
window.open(url.toString(), '_blank');
} else {
// let url = this.router.createUrlTree(['/datasets/edit/', dataset.id]);
let url = this.router.createUrlTree(['/dmp/edit/', dataset.id]);
let url = this.router.createUrlTree(['/plans/edit/', dataset.dmp.id], { queryParams: { dataset: dataset.id } });
window.open(url.toString(), '_blank');
}
}

16
dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.html
View File

@ -1,8 +1,8 @@
<div class="main-content">
<div *ngIf="dmp" class="container-fluid">
<div class="container-fluid">
<form *ngIf="formGroup" [formGroup]="formGroup" (ngSubmit)="formSubmit()">
<!-- DMP Header -->
<div [hidden]="this.step >= 3" class="fixed-editor-header">
<div [hidden]="this.step >= stepsBeforeDatasets" class="fixed-editor-header">
<div class="card editor-header">
<div class="col">
<div class="row">
@ -28,7 +28,7 @@
</div>
</div>
<!-- Dataset Header -->
<div *ngFor="let dataset of formGroup.get('datasets')['controls']; let i = index" [hidden]="this.step !== i + 3" class="fixed-editor-header">
<div *ngFor="let dataset of datasets.controls; let i = index" [hidden]="this.step !== i + stepsBeforeDatasets" class="fixed-editor-header">
<div class="card dataset-editor-header">
<div class="col">
<div class="row">
@ -63,17 +63,17 @@
</div>
</div>
<div class="row editor-content">
<div class="col-auto stepper">
<div class="col-auto" [ngClass]="{'dmp-stepper': this.step < stepsBeforeDatasets, 'dataset-stepper': this.step >= stepsBeforeDatasets}">
<div class="stepper-title">{{'DMP-EDITOR.STEPPER.USER-GUIDE' | translate}}</div>
<div class="stepper-options">
<ol class="stepper-list">
<li (click)="changeStep(0)" [ngClass]="{'active': this.step === 0}">{{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (4)</li>
<li (click)="changeStep(1)" [ngClass]="{'active': this.step === 1}">{{'DMP-EDITOR.STEPPER.FUNDING-INFO' | translate}} (3)</li>
<li (click)="changeStep(2)" [ngClass]="{'active': this.step === 2}">{{'DMP-EDITOR.STEPPER.DATASET-INFO' | translate}}</li>
<li *ngFor="let dataset of formGroup.get('datasets')['controls']; let i = index" (click)="changeStep(i + 3)" [ngClass]="{'active-dataset': this.step === i + 3}">
<li *ngFor="let dataset of datasets.controls; let i = index" (click)="changeStep(i + stepsBeforeDatasets, dataset)" [ngClass]="{'active-dataset': this.step === i + stepsBeforeDatasets}">
<div>{{'DMP-EDITOR.STEPPER.DATASET' | translate}}</div>
<ul class="dataset-list">
<li [ngClass]="{'active': this.step === i + 3}">{{ dataset.get('label').value }} (8)</li>
<li [ngClass]="{'active': this.step === i + stepsBeforeDatasets}">{{ dataset.get('label').value }} (8)</li>
</ul>
</li>
</ol>
@ -83,7 +83,7 @@
<span class="material-icons">chevron_left</span>
<div>{{'DMP-EDITOR.STEPPER.PREVIOUS' | translate}}</div>
</div>
<div mat-raised-button type="button" class="col-auto stepper-btn ml-auto" [ngClass]="{ 'next-disabled': this.step === this.maxStep, 'next': this.step < 3, 'dataset-next': this.step >= 3 }" (click)="nextStep()">
<div mat-raised-button type="button" class="col-auto stepper-btn ml-auto" [ngClass]="{ 'next-disabled': this.step === this.maxStep, 'next': this.step < stepsBeforeDatasets, 'dataset-next': this.step >= stepsBeforeDatasets }" (click)="nextStep()">
<span class="material-icons">chevron_right</span>
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
</div>
@ -93,7 +93,7 @@
<main-info [hidden]="this.step !== 0" [formGroup]="formGroup" [isUserOwner]="isUserOwner" (onFormChanged)="formChanged()"></main-info>
<funding-info [hidden]="this.step !== 1" [formGroup]="formGroup" [grantformGroup]="formGroup.get('grant')" [projectFormGroup]="formGroup.get('project')" [funderFormGroup]="formGroup.get('funder')" [isFinalized]="isFinalized || lockStatus" [isNew]="isNew" [isUserOwner]="isUserOwner" (onFormChanged)="formChanged()"></funding-info>
<dataset-info [hidden]="this.step !== 2" [formGroup]="formGroup" [dmp]="dmp" [isPublic]="isPublic" [isFinalized]="isFinalized || lockStatus" [isUserOwner]="isUserOwner" (onFormChanged)="formChanged()"></dataset-info>
<div *ngFor="let dataset of formGroup.get('datasets')['controls']; let i = index" [hidden]="this.step !== i + 3">
<div *ngFor="let dataset of datasets.controls; let i = index" [hidden]="this.step !== i + stepsBeforeDatasets">
<dataset-editor-details [formGroup]="dataset" [dmpId]="formGroup.get('id').value" (formChanged)="datasetFormChanged($event)"></dataset-editor-details>
</div>
</div>

11
dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.scss
View File

@ -219,7 +219,7 @@ a:hover {
color: #000000;
}
.stepper {
.dataset-stepper {
position: fixed;
// height: 100%;
display: flex;
@ -228,6 +228,15 @@ a:hover {
overflow-y: auto;
}
.dmp-stepper {
position: fixed;
// height: 100%;
display: flex;
flex-direction: column;
height: calc(100vh - 190px);
overflow-y: auto;
}
.stepper-title {
text-align: left;
font-weight: 300;

46
dmp-frontend/src/app/ui/dmp/editor/dmp-editor.component.ts
View File

@ -41,6 +41,7 @@ import { LockModel } from '@app/core/model/lock/lock.model';
import { Guid } from '@common/types/guid';
import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
import { ExtraPropertiesFormModel } from './general-tab/extra-properties-form.model';
import { DatasetWizardEditorModel } from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model';
@Component({
selector: 'app-dmp-editor-component',
@ -71,6 +72,9 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
isUserOwner: boolean = true;
lock: LockModel;
lockStatus: Boolean;
datasets: FormArray;
datasetId: string = null;
stepsBeforeDatasets: number = 3;
step: number = 0;
maxStep: number = 3;
@ -99,6 +103,8 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
const publicId = params['publicId'];
const queryParams = this.route.snapshot.queryParams;
const tabToNav = queryParams['tab'];
this.datasetId = queryParams['dataset'];
// if (queryParams['step']) { this.step = queryParams['step']; }
const grantRequestItem: RequestItem<GrantCriteria> = new RequestItem();
grantRequestItem.criteria = new GrantCriteria();
@ -111,6 +117,7 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
// displayFn: (item) => item['label'],
// titleFn: (item) => item['label']
// };
switch (tabToNav) {
case 'general':
this.selectedTab = 0;
@ -139,6 +146,11 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
this.dmp.extraProperties = new ExtraPropertiesFormModel();
this.dmp.fromModel(data);
this.formGroup = this.dmp.buildForm();
this.datasets = new FormArray([]);
// this.formGroup.get('datasets')['controls'].forEach(element => {
// this.datasets.push(element);
// });
this.datasets = this.formGroup.get('datasets') as FormArray;
this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
this.maxStep = this.formGroup.get('datasets') ? this.maxStep + this.formGroup.get('datasets').value.length - 1 : this.maxStep;
@ -148,6 +160,10 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
this.formGroup.disable();
}
if (this.datasetId) {
this.step = this.formGroup.get('datasets')['controls'].findIndex((dataset) => { return this.datasetId === dataset.get('id').value; }) + this.stepsBeforeDatasets;
}
//this.registerFormEventsForDmpProfile(this.dmp.definition);
if (!this.editMode || this.dmp.status === DmpStatus.Finalized || lockStatus) {
this.isFinalized = true;
@ -200,6 +216,11 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
this.dmp.fromModel(data);
this.formGroup = this.dmp.buildForm();
this.datasets = new FormArray([]);
this.formGroup.get('datasets')['controls'].forEach(element => {
this.datasets.push(element);
});
this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
this.maxStep = this.formGroup.get('datasets') ? this.maxStep + this.formGroup.get('datasets').value.length - 1 : this.maxStep;
@ -240,6 +261,11 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
this.dmp.extraProperties.contact = this.authService.current().id;
this.formGroup = this.dmp.buildForm();
this.datasets = new FormArray([]);
this.formGroup.get('datasets')['controls'].forEach(element => {
this.datasets.push(element);
});
this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
this.maxStep = this.formGroup.get('datasets') ? this.maxStep + this.formGroup.get('datasets').value.length - 1 : this.maxStep;
@ -374,7 +400,8 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
if (showAddDatasetDialog) {
this.addDatasetOpenDialog(complete);
}
else { this.onCallbackSuccess(complete) }
else if (this.step < this.stepsBeforeDatasets) { this.onCallbackSuccess(complete) }
else { this.onCallbackSuccess(complete, this.datasetId) }
},
error => {
this.formGroup.get('status').setValue(DmpStatus.Draft);
@ -398,9 +425,13 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
}
onCallbackSuccess(id?: String): void {
onCallbackSuccess(id?: String, datasetId?: string): void {
this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
id != null ? this.router.navigate(['/reload']).then(() => { this.router.navigate(['/plans', 'edit', id]); }) : this.router.navigate(['/reload']).then(() => { this.router.navigate(['/plans']); });
if (id != null) {
datasetId ? this.router.navigate(['/reload']).then(() => { this.router.navigate(['/plans', 'edit', id], { queryParams: { dataset: datasetId } }); }) : this.router.navigate(['/reload']).then(() => { this.router.navigate(['/plans', 'edit', id]); })
} else {
this.router.navigate(['/reload']).then(() => { this.router.navigate(['/plans']); });
}
}
onCallbackError(error: any) {
@ -629,16 +660,23 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
this.lockService.createOrUpdate(this.lock).pipe(takeUntil(this._destroyed)).subscribe(async result => this.lock.id = Guid.parse(result));
}
public changeStep(index: number) {
public changeStep(index: number, dataset?: FormControl) {
this.step = index;
if (dataset) { this.datasetId = dataset.get('id').value };
}
public nextStep() {
this.step = this.step < this.maxStep ? this.step + 1 : this.step;
if (this.step >= this.stepsBeforeDatasets) {
this.datasetId = this.datasets.at(this.step - this.stepsBeforeDatasets).get('id').value;
}
}
public previousStep() {
this.step = this.step !== 0 ? this.step - 1 : this.step;
if (this.step >= this.stepsBeforeDatasets) {
this.datasetId = this.datasets.at(this.step - this.stepsBeforeDatasets).get('id').value;
}
}
public isDirty(): boolean {