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

Funder - Grant Selection in DMP at quick-wizard. (Issue #182)

This commit is contained in:
apapachristou 2019-10-04 19:11:52 +03:00
parent b08ac084c9
commit 77d2aa317e
10 changed files with 68 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
dmp-frontend/src/app/library/auto-complete/single/single-auto-complete.component.ts
View File

@ -24,6 +24,8 @@ export class SingleAutoCompleteComponent implements OnInit, MatFormFieldControl<
@Input() configuration: SingleAutoCompleteConfiguration;
// Selected Option Event
@Output() optionSelected: EventEmitter<any> = new EventEmitter();
// Removed Option Event
@Output() optionRemoved: EventEmitter<any> = new EventEmitter();
id = `single-autocomplete-${SingleAutoCompleteComponent.nextId++}`;
stateChanges = new Subject<void>();
@ -231,6 +233,7 @@ export class SingleAutoCompleteComponent implements OnInit, MatFormFieldControl<
chipRemove(): void {
this._setValue(null);
this.optionRemoved.emit();
}
autoCompleteDisplayFn() {

2
dmp-frontend/src/app/ui/dmp/editor/grant-tab/funder-form-model.ts
View File

@ -36,7 +36,7 @@ export class FunderFormModel {
baseContext.validation.push({ key: 'id', validators: [] });
baseContext.validation.push({ key: 'label', validators: [Validators.required, BackendErrorValidator(this.validationErrorModel, 'label')] });
baseContext.validation.push({ key: 'status', validators: [] });
baseContext.validation.push({ key: 'existFunder', validators: [BackendErrorValidator(this.validationErrorModel, 'existFunder')] });
baseContext.validation.push({ key: 'existFunder', validators: [Validators.required, BackendErrorValidator(this.validationErrorModel, 'existFunder')] });
return baseContext;
}

13
dmp-frontend/src/app/ui/quick-wizard/funder-editor/funder-editor-wizard.component.html
View File

@ -1,23 +1,24 @@
<div class="funder-editor">
<form *ngIf="formGroup" [formGroup]="formGroup">
<form *ngIf="funderFormGroup" [formGroup]="funderFormGroup">
<mat-card>
<mat-card-header></mat-card-header>
<mat-card-content>
<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 [formControl]="formGroup.get('existFunder')" 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')" (optionSelected)="onFunderSelected($event)" (optionRemoved)="onFunderRemoved($event)" 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-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" [formControl]="formGroup.get('label')" required>
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">
{{formGroup.get('label').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('label').hasError('required')">
<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>
</mat-form-field>
</div>

49
dmp-frontend/src/app/ui/quick-wizard/funder-editor/funder-editor-wizard.component.ts
View File

@ -5,6 +5,7 @@ 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 { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-quick-wizard-funder-editor-component',
@ -15,11 +16,13 @@ export class FunderEditorWizardComponent implements OnInit {
isNew = false;
funder: FunderFormModel;
@Input() formGroup: FormGroup;
@Input() funderFormGroup: FormGroup;
@Input() grantformGroup: FormGroup;
funderAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
constructor(
private funderService: FunderService
private funderService: FunderService,
private language: TranslateService
) { }
ngOnInit() {
@ -28,16 +31,17 @@ export class FunderEditorWizardComponent implements OnInit {
filterFn: this.searchFunder.bind(this),
initialItems: (extraData) => this.searchFunder(''),
displayFn: (item) => item['label'],
titleFn: (item) => item['label']
titleFn: (item) => item['label'],
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.formGroup) {
if (!this.funderFormGroup) {
this.funder = new FunderFormModel();
this.formGroup = this.funder.buildForm();
this.funderFormGroup = this.funder.buildForm();
}
this.formGroup.get('existFunder').enable();
this.formGroup.get('label').disable();
this.funderFormGroup.get('existFunder').enable();
this.funderFormGroup.get('label').disable();
}
searchFunder(query: string) {
@ -50,13 +54,32 @@ export class FunderEditorWizardComponent implements OnInit {
create() {
this.isNew = !this.isNew;
if (this.isNew) {
this.formGroup.get('existFunder').disable();
this.formGroup.get('existFunder').reset();
this.formGroup.get('label').enable();
this.funderFormGroup.get('existFunder').disable();
this.funderFormGroup.get('existFunder').reset();
this.funderFormGroup.get('label').enable();
} else {
this.formGroup.get('existFunder').enable();
this.formGroup.get('label').disable();
this.formGroup.get('label').reset();
this.funderFormGroup.get('existFunder').enable();
this.funderFormGroup.get('label').disable();
this.funderFormGroup.get('label').reset();
}
}
onFunderSelected(event: any) {
this.grantformGroup.get('existGrant').enable();
}
onFunderRemoved(event: any) {
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('existGrant').reset();
}
controlModified(event: any) {
if (event) {
this.grantformGroup.get('existGrant').enable();
}
else {
this.grantformGroup.get('existGrant').disable();
this.grantformGroup.get('existGrant').reset();
}
}

3
dmp-frontend/src/app/ui/quick-wizard/grant-editor/grant-editor-wizard.component.html
View File

@ -12,6 +12,7 @@
<mat-form-field class="col-md-12 mt-2">
<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')">
{{grantformGroup.get('grant').getError('backendError').message}}</mat-error>
<mat-error *ngIf="grantformGroup.hasError('required')">
@ -53,7 +54,7 @@
<div class="row">
<div class="col"></div>
<button mat-raised-button class="col-auto" color="primary" type="button" *ngIf="!isNew" (click)="create()">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.CREATE-NEW-GRANT' | translate}}</button>
<button mat-raised-button class="col-auto" color="primary" type="button" *ngIf="!isNew" [disabled]="isFunderFormInvalid()" (click)="create()">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.CREATE-NEW-GRANT' | translate}}</button>
<button mat-raised-button class="col-auto" color="primary" type="button" *ngIf="isNew" (click)="create()">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.EXIST-GRANT' | translate}}</button>
<div class="col"></div>

12
dmp-frontend/src/app/ui/quick-wizard/grant-editor/grant-editor-wizard.component.ts
View File

@ -57,7 +57,7 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
initialItems: (extraData) => this.searchGrant(''),
displayFn: (item) => item['label'],
titleFn: (item) => item['label'],
subtitleFn: (item) => item ? item['source'] : null
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) {
@ -65,7 +65,11 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
this.grantformGroup = this.grant.buildForm();
}
this.grantformGroup.get('existGrant').enable();
if (this.funderFormGroup && this.funderFormGroup.get('funder')) {
this.grantformGroup.get('existGrant').enable();
} else {
this.grantformGroup.get('existGrant').disable();
}
this.grantformGroup.get('label').disable();
this.grantformGroup.get('description').disable();
@ -101,6 +105,10 @@ export class GrantEditorWizardComponent extends BaseComponent implements OnInit,
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();

1
dmp-frontend/src/app/ui/quick-wizard/project-editor/project-editor-wizard.component.html
View File

@ -9,6 +9,7 @@
<mat-form-field class="col-md-12 mt-2">
<app-single-auto-complete [formControl]="formGroup.get('existProject')" placeholder="{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.FIELDS.SELECT-PROJECT' | translate}}" [configuration]="projectAutoCompleteConfiguration">
</app-single-auto-complete>
<mat-hint>{{'DMP-EDITOR.FIELDS.EXTERNAL-SOURCE-HINT' | translate}}</mat-hint>
</mat-form-field>
</div>

7
dmp-frontend/src/app/ui/quick-wizard/project-editor/project-editor-wizard.component.ts
View File

@ -5,6 +5,7 @@ import { ProjectService } from '../../../core/services/project/project.service';
import { RequestItem } from '../../../core/query/request-item';
import { ProjectCriteria } from '../../../core/query/project/project-criteria';
import { ProjectFormModel } from '../../dmp/editor/grant-tab/project-form-model';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-quick-wizard-project-editor-component',
@ -19,7 +20,8 @@ export class ProjectEditorWizardComponent implements OnInit {
projectAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
constructor(
private projectService: ProjectService
private projectService: ProjectService,
private language: TranslateService
) { }
ngOnInit() {
@ -27,7 +29,8 @@ export class ProjectEditorWizardComponent implements OnInit {
filterFn: this.searchProject.bind(this),
initialItems: (extraData) => this.searchProject(''),
displayFn: (item) => item['label'],
titleFn: (item) => item['label']
titleFn: (item) => item['label'],
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.formGroup) {

4
dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.component.html
View File

@ -11,14 +11,14 @@
{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.TITLE' | translate}}
</ng-template>
<div *ngIf="formGroup.get('funder')">
<app-quick-wizard-funder-editor-component class="col-12" [formGroup]="formGroup.get('funder')"></app-quick-wizard-funder-editor-component>
<app-quick-wizard-funder-editor-component class="col-12" [funderFormGroup]="formGroup.get('funder')" [grantformGroup]="formGroup.get('grant')"></app-quick-wizard-funder-editor-component>
</div>
<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>
</div>
<div class="navigation-buttons-container">
<button class="float-right" [disabled]="formGroup.get('grant').invalid" matStepperNext mat-raised-button color="primary">{{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.ACTIONS.NEXT' | translate}}</button>
<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')">

2
dmp-frontend/src/app/ui/quick-wizard/quick-wizard-editor/quick-wizard-editor.component.ts
View File

@ -133,7 +133,7 @@ export class QuickWizardEditorComponent extends CheckDeactivateBaseComponent imp
}
public isFormValid() {
return this.formGroup.get('grant').valid;
return this.formGroup.get('grant').valid && this.formGroup.get('funder').valid;
}
public touchAllFormFields(formControl: AbstractControl) {