add researcher from dmp editor

This commit is contained in:
annampak 2018-02-05 11:44:40 +02:00
parent 47629c9e2b
commit 72cad823fb
9 changed files with 163 additions and 31 deletions

View File

@ -0,0 +1,19 @@
<form *ngIf="formGroup" [formGroup]="formGroup">
<h1 mat-dialog-title>{{'ADDRESEARCHERS-EDITOR.TITLE' | translate}}</h1>
<div mat-dialog-content>
<mat-form-field class="full-width">
<input matInput formControlName="firstName" placeholder="{{'ADDRESEARCHERS-EDITOR.FIRST_NAME' | translate}}" required>
<mat-error *ngIf="formGroup.get('firstName').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="full-width">
<input matInput formControlName="lastName" placeholder="{{'ADDRESEARCHERS-EDITOR.LAST_NAME' | translate}}" required>
<mat-error *ngIf="formGroup.get('lastName').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div mat-dialog-actions>
<div layout="row" class="full-width text-right" align="end">
<button mat-raised-button color="primary" (click)="send()" type="button">Save</button>
<button mat-button mat-dialog-close mat-raised-button color="primary">Cancel</button>
</div>
</div>
</form>

View File

@ -0,0 +1,39 @@
import { JsonSerializer } from '../utilities/JsonSerializer';
import { RequestItem } from '../models/criteria/RequestItem';
import { Component, OnInit, Inject } from "@angular/core";
import { FormGroup } from '@angular/forms';
import { Params, ActivatedRoute, Router } from '@angular/router';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { ResearcherModel } from '@app/models/researcher/ResearcherModel';
import { ResearcherService } from '@app/services/researchers/researchers.service';
@Component({
selector: 'add-researchers-component',
templateUrl: 'add-researchers.component.html',
providers: [ResearcherService]
})
export class AddResearchersComponent implements OnInit {
private formGroup: FormGroup;
constructor(
private researcherService: ResearcherService,
private route: ActivatedRoute,
public router: Router,
public dialogRef: MatDialogRef<AddResearchersComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
) { }
ngOnInit(): void {
let researcher = new ResearcherModel();
this.formGroup = researcher.buildForm();
}
send(value: any) {
this.researcherService.createResearcher(this.formGroup.value).subscribe(
null, null, () => this.dialogRef.close()
);
}
}

View File

@ -25,7 +25,6 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { FigurecardComponent } from './shared/components/figurecard/figurecard.component';
import { InvitationAcceptedComponent } from './invitation-accepted/invitation-accepted.component';
import { InvitationComponent } from './invitation/invitation.component';
import { HomepageComponent } from './homepage/homepage.component';
import { PageNotFoundComponent } from './not-found.component';
import { AppComponent } from './app.component';
@ -33,7 +32,6 @@ import { NgModule } from "@angular/core";
import { DatasetProfileModule } from './dataset-profile-form/dataset-profile.module';
import { WelcomepageComponent } from '@app/welcomepage/welcomepage.component';
@NgModule({
declarations: [
AppComponent,

View File

@ -13,6 +13,8 @@ import { CommonModule } from '@angular/common';
import { SharedModule } from '../shared/shared.module'
import { NgModule } from '@angular/core';
import { AddResearchersComponent } from '@app/add-researchers/add-researchers.component';
@NgModule({
imports: [
CommonModule,
@ -35,6 +37,7 @@ import { NgModule } from '@angular/core';
DataManagementPlanEditorComponent,
InvitationComponent,
InvitationAcceptedComponent,
AddResearchersComponent
],
exports: [
@ -42,10 +45,12 @@ import { NgModule } from '@angular/core';
DataManagementPlanEditorComponent,
InvitationComponent,
InvitationAcceptedComponent,
AddResearchersComponent
],
entryComponents: [
InvitationComponent
InvitationComponent,
AddResearchersComponent
],
providers: [
BaseHttpService

View File

@ -18,15 +18,12 @@
<mat-error *ngIf="formGroup.get('description').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<auto-complete class="mat-form-field-full-width" placeholder="{{'DMP-EDITOR.FIELDS.PROJECT' | translate}}"
[configuration]="projectAutoCompleteConfiguration"
titleKey="label"
[control]="formGroup.get('project')"
[required]="true">
<auto-complete class="mat-form-field-full-width" placeholder="{{'DMP-EDITOR.FIELDS.PROJECT' | translate}}" [configuration]="projectAutoCompleteConfiguration"
titleKey="label" [control]="formGroup.get('project')" [required]="true">
</auto-complete>
<td-chips color="accent" [items]="filteredProfiles" formControlName="profiles" placeholder="{{'DMP-EDITOR.FIELDS.PROFILES' | translate}}"
(inputChange)="filterProfiles($event)" requireMatch>
(inputChange)="filterProfiles($event)" requireMatch required>
<ng-template td-chip let-chip="chip">
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.label.substring(0, 1).toUpperCase()}}</div>
{{chip.label}}
@ -37,9 +34,11 @@
</div>
</ng-template>
<mat-progress-bar [style.height.px]="2" *ngIf="filteredProfilesAsync" mode="indeterminate"></mat-progress-bar>
<mat-error style="font-size:10.5px" *ngIf="formGroup.get('profiles').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<span *ngIf="formGroup.get('profiles').touched || !formGroup.get('profiles').pristine">
<mat-error style="font-size:10.5px" *ngIf="formGroup.get('profiles').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</span>
</td-chips>
<td-chips color="accent" [items]="filteredOrganisations" formControlName="organisations" placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}"
(inputChange)="filterOrganisations($event)" requireMatch>
@ -55,28 +54,35 @@
<mat-progress-bar [style.height.px]="2" *ngIf="filteringOrganisationsAsync" mode="indeterminate"></mat-progress-bar>
</td-chips>
<td-chips style ="margin-bottom:25px;" color="accent" [items]="filteredResearchers" formControlName="researchers" placeholder="{{'DMP-EDITOR.FIELDS.RESEARCHERS' | translate}}"
(inputChange)="filterResearchers($event)" requireMatch>
<ng-template td-chip let-chip="chip">
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.name.substring(0, 1).toUpperCase()}}</div>
{{chip.name}}
</ng-template>
<ng-template td-autocomplete-option let-option="option">
<div layout="row" layout-align="start center">
{{option.name}}
</div>
</ng-template>
<mat-progress-bar [style.height.px]="2" *ngIf="filteringResearchersAsync" mode="indeterminate"></mat-progress-bar>
</td-chips>
<div layout="row" layout-align="start center">
<td-chips style="margin-bottom:25px; display:inline-block; width:90%" color="accent" [items]="filteredResearchers" formControlName="researchers" placeholder="{{'DMP-EDITOR.FIELDS.RESEARCHERS' | translate}}"
(inputChange)="filterResearchers($event)" requireMatch>
<ng-template td-chip let-chip="chip">
<div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.name.substring(0, 1).toUpperCase()}}</div>
{{chip.name}}
</ng-template>
<ng-template td-autocomplete-option let-option="option">
<div layout="row" layout-align="start center">
{{option.name}}
</div>
</ng-template>
<mat-progress-bar [style.height.px]="2" *ngIf="filteringResearchersAsync" mode="indeterminate"></mat-progress-bar>
</td-chips>
<button style="display:inline-block;" mat-icon-button (click) ="addResearcher()">
<mat-icon aria-label="Example icon-button with a heart icon">add_circle</mat-icon>
</button>
</div>
<mat-list *ngIf="associatedUsers?.length" role="list">
<h3 mat-subheader>Associated Users</h3>
<mat-list-item role="listitem" *ngFor="let user of associatedUsers">
<h3 mat-subheader>Associated Users</h3>
<mat-list-item role="listitem" *ngFor="let user of associatedUsers">
<mat-icon mat-list-icon>person</mat-icon>
<div>{{user.name}}</div>
</mat-list-item>
</mat-list>
</mat-list>
<div layout="row" class="full-width text-right" align="end">
<button mat-raised-button color="primary" (click)="cancel()" type="button">{{'DMP-EDITOR.ACTIONS.CANCEL' | translate}}</button>

View File

@ -1,5 +1,5 @@
import { Component, ViewChild, OnInit, AfterViewInit, ViewEncapsulation } from "@angular/core";
import { MatPaginator, MatSort, MatSnackBar } from "@angular/material";
import { MatPaginator, MatSort, MatSnackBar, MatDialog } from "@angular/material";
import { Router, ActivatedRoute, Params } from "@angular/router";
import { TranslateService } from "@ngx-translate/core";
import { DataSource } from "@angular/cdk/table";
@ -20,6 +20,7 @@ import { AutoCompleteConfiguration } from "../../shared/components/autocomplete/
import { ProjectCriteria } from "../../models/criteria/project/ProjectCriteria";
import { ProjectService } from "../../services/project/project.service";
import { DmpUsersModel } from "@app/models/dmpUsers/DmpUsersModel";
import { AddResearchersComponent } from "@app/add-researchers/add-researchers.component";
@ -56,7 +57,8 @@ export class DataManagementPlanEditorComponent implements AfterViewInit {
public snackBar: MatSnackBar,
public router: Router,
public language: TranslateService,
private _service: DataManagementPlanService
private _service: DataManagementPlanService,
public dialog: MatDialog
) {
}
@ -209,4 +211,15 @@ export class DataManagementPlanEditorComponent implements AfterViewInit {
}
}
addResearcher(rowId: any, rowName: any) {
let dialogRef = this.dialog.open(AddResearchersComponent, {
height: '255px',
width: '700px',
data: {
dmpId: rowId,
dmpName: rowName
}
});
}
}

View File

@ -1,8 +1,10 @@
import { Serializable } from "../Serializable";
import { FormGroup, FormBuilder } from '@angular/forms';
export class ResearcherModel implements Serializable<ResearcherModel> {
public id: String;
public name: String;
public lastName: String;
public uri: String;
public email: String;
@ -14,4 +16,14 @@ export class ResearcherModel implements Serializable<ResearcherModel> {
return this;
}
buildForm(): FormGroup {
let formGroup = new FormBuilder().group({
firstName:[this.name],
lastName:[this.lastName]
})
return formGroup;
}
}

View File

@ -0,0 +1,31 @@
import { Invitation } from '../../models/invitation/Invitation';
import { UserInvitationCriteria } from '../../models/criteria/invitation/UserInvitationCriteria';
import { User } from '../../models/invitation/User';
import { HostConfiguration } from '../../app.constants';
import { BaseHttpService } from '../../utilities/cite-http-service-module/base-http.service';
import { Injectable } from "@angular/core";
import { HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { RequestItem } from '../../models/criteria/RequestItem';
import { ResearcherModel } from '@app/models/researcher/ResearcherModel';
@Injectable()
export class ResearcherService {
private actionUrl: string;
private headers: HttpHeaders;
constructor(private http: BaseHttpService) {
this.actionUrl = HostConfiguration.Server + 'researchers/';
this.headers = new HttpHeaders();
this.headers = this.headers.set('Content-Type', 'application/json');
this.headers = this.headers.set('Accept', 'application/json');
}
public createResearcher(researcher: ResearcherModel) {
return this.http.post(this.actionUrl + "create", researcher, { headers: this.headers });
}
}

View File

@ -199,5 +199,14 @@
"USER": "User",
"MANAGER": "Manager"
}
}
},
"ADDRESEARCHERS-EDITOR": {
"TITLE": "Add a Researcher",
"FIRST_NAME": "First Name",
"LAST_NAME": "Last Name",
"ACTIONS": {
"SAVE": "Save",
"CANCEL": "Cancel"
}
}
}