argos/dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.compone...

188 lines
6.6 KiB
TypeScript
Raw Normal View History

import { Component, OnInit, ViewChild } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { MatSnackBar, MatStepper, MatDialog } from '@angular/material';
import { ActivatedRoute, Router } from '@angular/router';
import { TranslateService } from '@ngx-translate/core';
import { Observable } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ValidationErrorModel } from '../../../common/forms/validation/error-model/validation-error-model';
import { BaseComponent } from "../../../core/common/base/base.component";
import { SnackBarNotificationLevel, UiNotificationService } from '../../../core/services/notification/ui-notification-service';
import { QuickWizardService } from '../../../core/services/quick-wizard/quick-wizard.service';
import { BreadcrumbItem } from '../../misc/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '../../misc/breadcrumb/definition/IBreadCrumbComponent';
import { ProjectEditorWizardModel } from '../project-editor/project-editor-wizard-model';
import { QuickWizardEditorWizardModel } from './quick-wizard-editor.model';
import { DatasetEditorWizardComponent } from '../dataset-editor/dataset-editor-wizard.component';
import { ConfirmationDialogComponent } from '../../../library/confirmation-dialog/confirmation-dialog.component';
@Component({
selector: 'app-quick-wizard-editor-component',
templateUrl: 'quick-wizard-editor.component.html',
styleUrls: ['./quick-wizard-editor.component.scss']
})
export class QuickWizardEditorComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
breadCrumbs: Observable<BreadcrumbItem[]> = Observable.of([]);
@ViewChild('stepper') stepper: MatStepper;
@ViewChild(DatasetEditorWizardComponent) datasetEditorWizardComponent: DatasetEditorWizardComponent;
isNew = true;
quickWizard: QuickWizardEditorWizardModel
formGroup: FormGroup = null;
constructor(
public snackBar: MatSnackBar,
private route: ActivatedRoute,
public router: Router,
public language: TranslateService,
public quickWizardService: QuickWizardService,
private uiNotificationService: UiNotificationService,
private dialog: MatDialog
) {
super();
}
ngOnInit(): void {
this.quickWizard = new QuickWizardEditorWizardModel();
this.quickWizard.project = new ProjectEditorWizardModel();
this.formGroup = this.quickWizard.buildForm();
2019-05-23 11:40:24 +02:00
this.breadCrumbs = Observable.of([{
parentComponentName: 'Dashboard',
label: this.language.instant('NAV-BAR.DMP-WIZARD'),
url: '/quick-wizard'
}]);
}
isActive(step: string): boolean {
switch (step) {
case 'step1':
return this.stepper.selectedIndex == 0;
case 'step2':
return this.stepper.selectedIndex == 1;
case 'step3':
return this.stepper.selectedIndex == 2;
}
}
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
if (this.formGroup.get('datasets') && this.formGroup.get('datasets').get('datasetsList') && (this.formGroup.get('datasets').get('datasetsList') as FormArray).length > 0) {
for (let control of (this.formGroup.get('datasets').get('datasetsList') as FormArray).controls) {
control.get('status').setValue('0');
}
this.onSubmitSave();
} else {
return;
}
}
saveFinalize() {
if (!this.isFormValid()) { return; }
if (this.formGroup.get('datasets') && this.formGroup.get('datasets').get('datasetsList') && (this.formGroup.get('datasets').get('datasetsList') as FormArray).length > 0) {
for (let control of (this.formGroup.get('datasets').get('datasetsList') as FormArray).controls) {
control.get('status').setValue('1');
}
this.onSubminSaveAndFinalize();
} else {
return;
}
}
hasDatasets() {
if ((this.formGroup.get('datasets').get('datasetsList') as FormArray).length > 0) {
return true;
} else {
return false;
}
}
public isFormValid() {
return this.formGroup.valid;
}
public touchAllFormFields(formControl: AbstractControl) {
if (formControl instanceof FormControl) {
formControl.markAsTouched();
} else if (formControl instanceof FormGroup) {
Object.keys(formControl.controls).forEach(item => {
const control = formControl.get(item);
this.touchAllFormFields(control);
});
} else if (formControl instanceof FormArray) {
formControl.controls.forEach(item => {
this.touchAllFormFields(item);
});
}
}
onSubminSaveAndFinalize() {
this.quickWizardService.createQuickWizard(this.formGroup.getRawValue())
.pipe(takeUntil(this._destroyed))
.subscribe(
complete => this.onCallbackSuccess(),
error => this.onCallbackError(error)
);
}
onSubmitSave(): void {
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
data: {
message: this.language.instant('QUICKWIZARD.SAVE-DIALOG.TITLE'),
confirmButton: this.language.instant('QUICKWIZARD.SAVE-DIALOG.ACTIONS.AFFIRMATIVE'),
cancelButton: this.language.instant('QUICKWIZARD.SAVE-DIALOG.ACTIONS.NEGATIVE')
}
});
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
if (result) {
this.datasetEditorWizardComponent.addDataset(false);
} else if (result === false) {
this.quickWizardService.createQuickWizard(this.formGroup.value)
.pipe(takeUntil(this._destroyed))
.subscribe(
complete => this.onCallbackSuccess()
)
}
});
}
onCallbackSuccess(): void {
this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
this.router.navigate(['/home']);
}
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error.payload);
this.validateAllFormFields(this.formGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
Object.keys(validationErrorModel).forEach(item => {
(<any>this.quickWizard.validationErrorModel)[item] = (<any>validationErrorModel)[item];
});
}
public validateAllFormFields(formControl: AbstractControl) {
if (formControl instanceof FormControl) {
formControl.updateValueAndValidity({ emitEvent: false });
} else if (formControl instanceof FormGroup) {
Object.keys(formControl.controls).forEach(item => {
const control = formControl.get(item);
this.validateAllFormFields(control);
});
} else if (formControl instanceof FormArray) {
formControl.controls.forEach(item => {
this.validateAllFormFields(item);
});
}
}
getProjectLabel(): string {
if (this.formGroup.get('project').get('existProject').value) {
return this.formGroup.get('project').get('existProject').value['label'];
} else {
return this.formGroup.get('project').get('label').value;
}
}
}