fixed validation issues on dmp wizard

This commit is contained in:
Diamantis Tziotzios 2019-12-13 11:53:43 +02:00
parent a80a935ff3
commit d4db0e204e
12 changed files with 91 additions and 319 deletions

View File

@ -1,6 +1,6 @@
import { AfterViewInit, Component } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { FormArray, FormGroup } from '@angular/forms';
import { ActivatedRoute, Params, Router } from '@angular/router';
import { DmpProfileFieldDataType } from '@app/core/common/enum/dmp-profile-field-type';
import { DmpProfileStatus } from '@app/core/common/enum/dmp-profile-status';
@ -13,6 +13,7 @@ import { DmpProfileEditorModel, DmpProfileFieldEditorModel } from '@app/ui/admin
import { DmpProfileExternalAutoCompleteFieldDataEditorModel } from '@app/ui/admin/dmp-profile/editor/external-autocomplete/dmp-profile-external-autocomplete-field-editor.model';
import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { TranslateService } from '@ngx-translate/core';
import { environment } from 'environments/environment';
@ -42,7 +43,8 @@ export class DmpProfileEditorComponent extends BaseComponent implements AfterVie
private router: Router,
private language: TranslateService,
private enumUtils: EnumUtils,
private uiNotificationService: UiNotificationService
private uiNotificationService: UiNotificationService,
private formService: FormService
) {
super();
}
@ -86,7 +88,7 @@ export class DmpProfileEditorComponent extends BaseComponent implements AfterVie
}
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
this.formService.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) { return; }
this.onSubmit();
}
@ -111,7 +113,7 @@ export class DmpProfileEditorComponent extends BaseComponent implements AfterVie
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
@ -124,37 +126,6 @@ export class DmpProfileEditorComponent extends BaseComponent implements AfterVie
this.router.navigate(['/dmp-profiles']);
}
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);
});
}
}
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);
});
}
}
addField() {
(<FormArray>this.formGroup.get('definition').get('fields')).push(new DmpProfileFieldEditorModel().buildForm());
}

View File

@ -8,6 +8,7 @@ import { BaseComponent } from '@common/base/base.component';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { TranslateService } from '@ngx-translate/core';
import { takeUntil } from 'rxjs/operators';
import { FormService } from '@common/forms/form-service';
@Component({
selector: 'app-contact-content',
@ -26,6 +27,7 @@ export class ContactContentComponent extends BaseComponent implements OnInit {
private _location: Location,
private uiNotificationService: UiNotificationService,
private language: TranslateService,
private formService: FormService
) {
super();
}
@ -59,7 +61,7 @@ export class ContactContentComponent extends BaseComponent implements OnInit {
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-EMAIL-SEND'), SnackBarNotificationLevel.Error);
}
@ -68,20 +70,4 @@ export class ContactContentComponent extends BaseComponent implements OnInit {
(<any>this.contactEmailFormModel.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);
});
}
}
}

View File

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Params, Router } from '@angular/router';
@ -9,12 +9,13 @@ import { GrantListingModel } from '@app/core/model/grant/grant-listing';
import { GrantFileUploadService } from '@app/core/services/grant/grant-file-upload.service';
import { GrantService } from '@app/core/services/grant/grant.service';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { GrantEditorModel } from '@app/ui/grant/editor/grant-editor.model';
import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { TranslateService } from '@ngx-translate/core';
import { environment } from 'environments/environment';
import { Observable, of as observableOf } from 'rxjs';
@ -44,7 +45,8 @@ export class GrantEditorComponent extends BaseComponent implements OnInit, IBrea
public language: TranslateService,
private dialog: MatDialog,
private grantFileUploadService: GrantFileUploadService,
private uiNotificationService: UiNotificationService
private uiNotificationService: UiNotificationService,
private formService: FormService
) {
super();
}
@ -100,7 +102,7 @@ export class GrantEditorComponent extends BaseComponent implements OnInit, IBrea
}
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
this.formService.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) { return; }
this.onSubmit();
}
@ -125,7 +127,7 @@ export class GrantEditorComponent extends BaseComponent implements OnInit, IBrea
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error.payload);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
@ -161,36 +163,6 @@ export class GrantEditorComponent extends BaseComponent implements OnInit, IBrea
});
}
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);
});
}
}
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);
});
}
}
public enableForm() {
if (!this.isExternalGrant()) {
this.editMode = true;

View File

@ -1,6 +1,6 @@
import { Component, Input, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { FormArray, FormGroup } from '@angular/forms';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Router } from '@angular/router';
import { DatasetProfileModel } from '@app/core/model/dataset/dataset-profile';
@ -12,6 +12,7 @@ import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/sing
import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { TranslateService } from '@ngx-translate/core';
import { Observable, of as observableOf } from 'rxjs';
@ -44,7 +45,8 @@ export class DmpEditorWizardComponent extends BaseComponent implements OnInit, I
public router: Router,
private route: ActivatedRoute,
private _service: DmpService,
public language: TranslateService
public language: TranslateService,
private formService: FormService
) {
super();
}
@ -74,7 +76,7 @@ export class DmpEditorWizardComponent extends BaseComponent implements OnInit, I
}
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
this.formService.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) { return; }
this.onSubmit();
}
@ -83,21 +85,6 @@ export class DmpEditorWizardComponent extends BaseComponent implements OnInit, I
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);
});
}
}
onSubmit(): void {
// this.grantService.createGrant(this.formGroup.value)
// .pipe(takeUntil(this._destroyed))
@ -115,7 +102,7 @@ export class DmpEditorWizardComponent extends BaseComponent implements OnInit, I
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error.payload);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
@ -124,21 +111,6 @@ export class DmpEditorWizardComponent extends BaseComponent implements OnInit, I
});
}
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);
});
}
}
filterProfiles(value: string): Observable<DatasetProfileModel[]> {
this.filteredProfiles = undefined;

View File

@ -6,20 +6,19 @@
<div class="row" *ngIf="!isNew">
<p class="col-md-12"><b>{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.ABOUT-FUNDER' | translate}}</b></p>
<mat-form-field class="col-md-12 mt-2">
<app-single-auto-complete [required]='true' [formControl]="funderFormGroup.get('existFunder')" (optionSelected)="onFunderSelected()" (optionRemoved)="onFunderRemoved()" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.SELECT-FUNDER' | translate}}" [configuration]="funderAutoCompleteConfiguration">
<app-single-auto-complete [required]='true' [formControl]="funderFormGroup.get('existFunder')" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.SELECT-FUNDER' | translate}}" [configuration]="funderAutoCompleteConfiguration">
</app-single-auto-complete>
<mat-hint>{{'DMP-EDITOR.FIELDS.EXTERNAL-SOURCE-HINT' | translate}}</mat-hint>
<mat-error *ngIf="funderFormGroup.get('existFunder').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="row" *ngIf="isNew">
<p class="col-md-12"><b>{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.ABOUT-NEW-FUNDER' | translate}}</b></p>
<mat-form-field class="col-md-12">
<input matInput placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.FUNDER-LABEL' | translate}}" type="text" name="label" (ngModelChange)="controlModified($event)" [formControl]="funderFormGroup.get('label')" required>
<mat-error *ngIf="funderFormGroup.get('label').hasError('backendError')">
{{funderFormGroup.get('label').getError('backendError').message}}</mat-error>
<mat-error *ngIf="funderFormGroup.get('label').hasError('required')">
{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<input matInput placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.FUNDER-LABEL' | translate}}" type="text" name="label" [formControl]="funderFormGroup.get('label')" required>
<mat-error *ngIf="funderFormGroup.get('label').hasError('backendError')">{{funderFormGroup.get('label').getError('backendError').message}}</mat-error>
<mat-error *ngIf="funderFormGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>

View File

@ -1,11 +1,12 @@
import { Component, OnInit, Input } from '@angular/core';
import { Component, Input, OnInit } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { SingleAutoCompleteConfiguration } from '../../../library/auto-complete/single/single-auto-complete-configuration';
import { FunderService } from '../../../core/services/funder/funder.service';
import { RequestItem } from '../../../core/query/request-item';
import { FunderCriteria } from '../../../core/query/funder/funder-criteria';
import { FunderFormModel } from '../../dmp/editor/grant-tab/funder-form-model';
import { FunderModel } from '@app/core/model/funder/funder';
import { TranslateService } from '@ngx-translate/core';
import { FunderCriteria } from '../../../core/query/funder/funder-criteria';
import { RequestItem } from '../../../core/query/request-item';
import { FunderService } from '../../../core/services/funder/funder.service';
import { SingleAutoCompleteConfiguration } from '../../../library/auto-complete/single/single-auto-complete-configuration';
import { FunderFormModel } from '../../dmp/editor/grant-tab/funder-form-model';
@Component({
selector: 'app-quick-wizard-funder-editor-component',
@ -18,7 +19,6 @@ export class FunderEditorWizardComponent implements OnInit {
funder: FunderFormModel;
funderLabelCleared = true;
@Input() funderFormGroup: FormGroup;
@Input() grantformGroup: FormGroup;
funderAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
constructor(
@ -55,51 +55,13 @@ export class FunderEditorWizardComponent implements OnInit {
create() {
this.isNew = !this.isNew;
if (this.isNew) {
this.funderFormGroup.get('existFunder').disable();
this.funderFormGroup.get('existFunder').reset();
this.funderFormGroup.get('existFunder').disable();
this.funderFormGroup.get('label').enable();
} else {
this.funderFormGroup.get('existFunder').enable();
this.funderFormGroup.get('label').disable();
this.funderFormGroup.get('label').reset();
this.funderFormGroup.get('label').disable();
this.funderFormGroup.get('existFunder').enable();
}
}
onFunderSelected() {
if (this.grantformGroup.get('existGrant').disabled) {
this.grantformGroup.get('existGrant').enable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
} else {
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('label').enable();
this.grantformGroup.get('description').enable();
}
}
onFunderRemoved() {
if (this.grantformGroup.get('existGrant').enabled) {
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('existGrant').reset();
this.grantformGroup.get('label').enable();
this.grantformGroup.get('description').enable();
} else {
this.grantformGroup.get('existGrant').enable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('label').reset();
this.grantformGroup.get('description').disable();
this.grantformGroup.get('description').reset();
}
}
controlModified(event: any) {
if (event && this.funderLabelCleared) {
this.funderLabelCleared = false;
this.onFunderSelected();
} else if (!event) {
this.funderLabelCleared = true;
this.onFunderRemoved();
}
}
}

View File

@ -10,7 +10,7 @@
<div class="row" *ngIf="!isNew">
<p class="col-md-12"><b>{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.ABOUT-GRANT' | translate}}</b></p>
<mat-form-field class="col-md-12 mt-2">
<app-single-auto-complete [required]='true' [formControl]="grantformGroup.get('existGrant')" (optionSelected)="onGrantSelected()" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.SELECT-GRANT' | translate}}" [configuration]="grantAutoCompleteConfiguration">
<app-single-auto-complete [required]='true' [formControl]="grantformGroup.get('existGrant')" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.SELECT-GRANT' | translate}}" [configuration]="grantAutoCompleteConfiguration">
</app-single-auto-complete>
<mat-hint>{{'DMP-EDITOR.FIELDS.EXTERNAL-SOURCE-HINT' | translate}}</mat-hint>
<mat-error *ngIf="grantformGroup.hasError('backendError')">

View File

@ -12,9 +12,11 @@ import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-it
import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent';
import { GrantEditorWizardModel } from '@app/ui/quick-wizard/grant-editor/grant-editor-wizard-model';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { TranslateService } from '@ngx-translate/core';
import { Observable, of as observableOf } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@Component({
selector: 'app-quick-wizard-grant-editor-component',
@ -36,7 +38,8 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
public snackBar: MatSnackBar,
public router: Router,
public language: TranslateService,
private grantService: GrantService
private grantService: GrantService,
private formService: FormService
) {
super();
}
@ -59,12 +62,7 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
subtitleFn: (item) => item['source'] ? this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.SOURCE:') + item['source'] : this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.NO-SOURCE')
};
if (!this.grantformGroup) {
this.grant = new GrantEditorWizardModel();
this.grantformGroup = this.grant.buildForm();
}
if (this.funderFormGroup && this.funderFormGroup.get('funder')) {
if (this.funderFormGroup && this.funderFormGroup.valid) {
this.grantformGroup.get('existGrant').enable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
@ -72,55 +70,29 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
this.grantformGroup.get('existGrant').disable();
}
// this.route.params
// .pipe(takeUntil(this._destroyed))
// .subscribe((params: Params) => {
// const itemId = params['id'];
this.funderFormGroup.statusChanges.pipe(takeUntil(this._destroyed)).subscribe(x => {
if (x == 'INVALID') {
this.grantformGroup.get('existGrant').reset();
this.grantformGroup.get('label').reset();
this.grantformGroup.get('description').reset();
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
} else if (x == 'VALID') {
if (!this.isNew) {
this.grantformGroup.get('label').reset();
this.grantformGroup.get('description').reset();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
this.grantformGroup.get('existGrant').enable();
// if (itemId != null) {
// this.isNew = false;
// this.grantService.getSingle(itemId).map(data => data as GrantListingModel)
// .pipe(takeUntil(this._destroyed))
// .subscribe(data => {
// this.grant = new GrantEditorModel().fromModel(data);
// this.formGroup = this.grant.buildForm(null, this.grant.type === GrantType.External || !this.editMode);
// this.breadCrumbs = Observable.of([
// { parentComponentName: 'GrantListingComponent', label: 'Grants', url: '/grants' },
// ]);
// });
// } else {
// this.breadCrumbs = Observable.of([
// { parentComponentName: 'QuickWizardComponent', label: 'Grants', url: '/grants' },
// ]);
// this.grant = new GrantEditorWizardModel();
// setTimeout(() => {
// this.formGroup = this.grant.buildForm();
// });
// }
// });
}
public isFormValid() {
return this.grantformGroup.valid;
}
}
})
}
isFunderFormInvalid() {
return !this.funderFormGroup.get('existFunder').value && !this.funderFormGroup.get('label').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);
});
}
return !this.funderFormGroup.valid;
}
onCallbackSuccess(): void {
@ -130,7 +102,7 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error.payload);
this.validateAllFormFields(this.grantformGroup);
this.formService.validateAllFormFields(this.grantformGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
@ -139,21 +111,6 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
});
}
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);
});
}
}
searchGrant(query: string) {
const grantRequestItem: RequestItem<GrantCriteria> = new RequestItem();
grantRequestItem.criteria = new GrantCriteria();
@ -167,21 +124,16 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
create() {
this.isNew = !this.isNew;
if (this.isNew) {
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('existGrant').reset();
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('label').enable();
this.grantformGroup.get('description').enable();
} else {
this.grantformGroup.get('existGrant').enable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('label').reset();
this.grantformGroup.get('description').disable();
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').reset();
this.grantformGroup.get('description').disable();
this.grantformGroup.get('existGrant').enable();
}
}
onGrantSelected() {
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
}
}

View File

@ -6,11 +6,11 @@
<p *ngIf="isNew">{{ 'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.POST-SELECTION-INFO' | translate }}</p>
<div class="row">
<mat-horizontal-stepper linear class="col-12" #stepper>
<mat-step [stepControl]="formGroup.get('grant')">
<mat-step [stepControl]="formGroup.get('grant')" *ngIf="formGroup">
<ng-template matStepLabel>
{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.TITLE' | translate}}
</ng-template>
<app-quick-wizard-funder-editor-component class="col-12" [funderFormGroup]="formGroup.get('funder')" [grantformGroup]="formGroup.get('grant')"></app-quick-wizard-funder-editor-component>
<app-quick-wizard-funder-editor-component class="col-12" [funderFormGroup]="formGroup.get('funder')"></app-quick-wizard-funder-editor-component>
<app-quick-wizard-grant-editor-component class="col-12" [grantformGroup]="formGroup.get('grant')" [funderFormGroup]="formGroup.get('funder')"></app-quick-wizard-grant-editor-component>
<div *ngIf="formGroup.get('project')">
<app-quick-wizard-project-editor-component class="col-12" [formGroup]="formGroup.get('project')"></app-quick-wizard-project-editor-component>
@ -19,7 +19,7 @@
<button class="float-right" [disabled]="!isFormValid()" matStepperNext mat-raised-button color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.NEXT' | translate}}</button>
</div>
</mat-step>
<mat-step [stepControl]="formGroup.get('dmp')">
<mat-step [stepControl]="formGroup.get('dmp')" *ngIf="formGroup">
<ng-template matStepLabel>
{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.TITLE' | translate}}
</ng-template>
@ -36,7 +36,7 @@
</div>
</ng-container>
</mat-step>
<mat-step [stepControl]="formGroup.get('datasets')">
<mat-step [stepControl]="formGroup.get('datasets')" *ngIf="formGroup">
<ng-template matStepLabel>
{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.THIRD-STEP.TITLE' | translate}}
</ng-template>

View File

@ -10,7 +10,6 @@ import { DmpStatus } from '@app/core/common/enum/dmp-status';
import { DatasetService } from '@app/core/services/dataset/dataset.service';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { QuickWizardService } from '@app/core/services/quick-wizard/quick-wizard.service';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { CheckDeactivateBaseComponent } from '@app/library/deactivate/deactivate.component';
import { DmpFinalizeDialogComponent, DmpFinalizeDialogDataset, DmpFinalizeDialogInput } from '@app/ui/dmp/editor/dmp-finalize-dialog/dmp-finalize-dialog.component';
import { FunderFormModel } from '@app/ui/dmp/editor/grant-tab/funder-form-model';
@ -20,7 +19,9 @@ import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadC
import { DatasetEditorWizardComponent } from '@app/ui/quick-wizard/dataset-editor/dataset-editor-wizard.component';
import { GrantEditorWizardModel } from '@app/ui/quick-wizard/grant-editor/grant-editor-wizard-model';
import { QuickWizardEditorWizardModel } from '@app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.model';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { TranslateService } from '@ngx-translate/core';
import { Observable, of as observableOf } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -48,7 +49,8 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
public datasetService: DatasetService,
public quickWizardService: QuickWizardService,
private uiNotificationService: UiNotificationService,
private dialog: MatDialog
private dialog: MatDialog,
private formService: FormService
) {
super();
}
@ -82,7 +84,7 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
}
formSubmit(): void {
this.touchAllFormFields(this.formGroup);
this.formService.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(DatasetStatus.Draft);
@ -137,21 +139,6 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
return this.formGroup.get('grant').valid && this.formGroup.get('funder').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);
});
}
}
onSubmitSaveAndFinalize() {
this.quickWizardService.createQuickWizard(this.formGroup.getRawValue())
.pipe(takeUntil(this._destroyed))
@ -192,7 +179,7 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error.payload);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
}
public setErrorModel(validationErrorModel: ValidationErrorModel) {
@ -201,21 +188,6 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
});
}
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);
});
}
}
getGrantLabel(): string {
if (this.formGroup.get('grant').get('existGrant').value) {
return this.formGroup.get('grant').get('existGrant').value['label'];

View File

@ -8,32 +8,32 @@
<a class="option" href="#"><i class="fa fa-life-ring style-icon"></i>Help</a>
</div> -->
<div class="row d-flex flex-reverse">
<div class="col-auto text-center">
<div class="col-6 text-center">
<p class="option" (click)="openGlossaryDialog()" [ngClass]="{'option-active': this.router.url === '/glossary'}">
<!-- <i class="fa fa-book pr-2 pt-1"></i> -->
{{'FOOTER.GLOSSARY' | translate}}</p>
</div>
<div class="col-auto text-center">
<div class="col-6 text-center">
<p class="option" (click)="openFaqDialog()" [ngClass]="{'option-active': this.router.url === '/faq'}">
<!-- <i class="fa fa-question-circle pr-2 pt-1"></i> -->
{{'FOOTER.FAQ' | translate}}</p>
</div>
<div class="col-auto text-center">
</div>
<div class="row d-flex flex-reverse">
<div class="col-6 text-center">
<p class="option" (click)="openContactDialog()" [ngClass]="{'option-active': this.router.url === '/contact-support'}">
<!-- <i class="fa fa-envelope-open pr-2 pt-1"></i> -->
{{'FOOTER.CONTACT-SUPPORT' | translate}}</p>
</div>
</div>
<div class="row d-flex flex-reverse">
<div class="col-auto text-center">
<div class="col-6 text-center">
<a class="option" [routerLink]="['/terms-of-service']" [routerLinkActive]="['option-active']">
<!-- <i class="fa fa-balance-scale pr-2 pt-1"></i> -->
{{'FOOTER.TERMS-OF-SERVICE' | translate}}</a>
</div>
<div class="col-auto text-center">
<!-- <div class="col-auto text-center">
<a class="option" [routerLink]="['/privacy-policy']" [routerLinkActive]="['option-active']">
<!-- <i class="fa fa-user-secret pr-2 pt-1"></i> -->
<i class="fa fa-user-secret pr-2 pt-1"></i>
{{'FOOTER.PRIVACY-POLICY' | translate}}</a>
</div>
</div> -->
</div>
</div>

View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';
import { ContactEmailFormModel } from '@app/core/model/contact/contact-email-form-model';
@ -9,6 +9,7 @@ import { ContactDialogComponent } from '@app/ui/contact/contact-dialog/contact-d
import { FaqDialogComponent } from '@app/ui/faq/dialog/faq-dialog.component';
import { GlossaryDialogComponent } from '@app/ui/glossary/dialog/glossary-dialog.component';
import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { TranslateService } from '@ngx-translate/core';
import { takeUntil } from 'rxjs/operators';
@ -28,7 +29,8 @@ export class SidebarFooterComponent extends BaseComponent implements OnInit {
private language: TranslateService,
public router: Router,
private contactSupportService: ContactSupportService,
private uiNotificationService: UiNotificationService
private uiNotificationService: UiNotificationService,
private formService: FormService
) {
super();
}
@ -99,7 +101,7 @@ export class SidebarFooterComponent extends BaseComponent implements OnInit {
onCallbackError(errorResponse: any) {
this.setErrorModel(errorResponse.error);
this.validateAllFormFields(this.formGroup);
this.formService.validateAllFormFields(this.formGroup);
this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-EMAIL-SEND'), SnackBarNotificationLevel.Error);
}
@ -108,20 +110,4 @@ export class SidebarFooterComponent extends BaseComponent implements OnInit {
(<any>this.contactEmailFormModel.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);
});
}
}
}