no message

dmp-frontend/.angular-cli.json

@@ -19,12 +19,13 @@
       "testTsconfig": "tsconfig.spec.json",
       "prefix": "app",
       "styles": [
+        "./../node_modules/bootstrap/dist/css/bootstrap.min.css",
         "styles.scss"
       ],
       "scripts": [
-		"./../node_modules/bootstrap/dist/js/bootstrap.min.js",
+        "./../node_modules/bootstrap/dist/js/bootstrap.min.js",
-    "./assets/xml2json.min.js"
+        "./assets/xml2json.min.js"
-	  ],
+      ],
       "environmentSource": "environments/environment.ts",
       "environments": {
         "dev": "environments/environment.ts",

dmp-frontend/src/app/datasets_new/dataset-listing.component.ts

@@ -97,7 +97,7 @@ export class DatasetDataSource extends DataSource<DatasetListingModel> {
         });
         const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
         const request = new DataTableRequest(startIndex, this._paginator.pageSize);
-        request.projectCriteria = this._criteria.getFormData();
+        request.criteria = this._criteria.getFormData();
         return this._service.getPaged(request);
       })
       .catch((error: any) => {

dmp-frontend/src/app/dmps/editor/dmp-editor.component.html

@@ -1,26 +1,25 @@
 <div class="project-editor">
     <form *ngIf="formGroup" (ngSubmit)="formSubmit()" [formGroup]="formGroup">
         <mat-card>
-            <mat-card-title *ngIf="isNew">{{'PROJECT-EDITOR.TITLE.NEW' | translate}}</mat-card-title>
+            <mat-card-title *ngIf="isNew">{{'DMP-EDITOR.TITLE.NEW' | translate}}</mat-card-title>
-            <mat-card-title *ngIf="!isNew">{{'PROJECT-EDITOR.TITLE.EDIT' | translate}} {{project.label}}</mat-card-title>
+            <mat-card-title *ngIf="!isNew">{{'DMP-EDITOR.TITLE.EDIT' | translate}} {{project.label}}</mat-card-title>
             <mat-card-content>
 
                 <mat-form-field>
-                    <input matInput placeholder="{{'PROJECT-EDITOR.FIELDS.NAME' | translate}}" type="text" name="label" formControlName="label"
+                    <input matInput placeholder="{{'DMP-EDITOR.FIELDS.NAME' | translate}}" type="text" name="label" formControlName="label" required>
-                        required>
                     <mat-error *ngIf="formGroup.get('label').errors?.backendError">{{baseErrorModel.label}}</mat-error>
                     <mat-error *ngIf="formGroup.get('label').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
                 </mat-form-field>
 
                 <!-- <mat-form-field>
-                    <input matInput placeholder="{{'PROJECT-EDITOR.FIELDS.ABBREVIATION' | translate}}" type="text" name="abbreviation" formControlName="abbreviation"
+                    <input matInput placeholder="{{'DMP-EDITOR.FIELDS.ABBREVIATION' | translate}}" type="text" name="abbreviation" formControlName="abbreviation"
                         required>
                     <mat-error *ngIf="formGroup.get('abbreviation').errors?.backendError">{{baseErrorModel.abbreviation}}</mat-error>
                     <mat-error *ngIf="formGroup.get('abbreviation').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
                 </mat-form-field>
 
                 <mat-form-field>
-                    <input matInput placeholder="{{'PROJECT-EDITOR.FIELDS.URI' | translate}}" type="text" name="uri" formControlName="uri" required>
+                    <input matInput placeholder="{{'DMP-EDITOR.FIELDS.URI' | translate}}" type="text" name="uri" formControlName="uri" required>
                     <mat-error *ngIf="formGroup.get('uri').errors?.backendError">{{baseErrorModel.uri}}</mat-error>
                     <mat-error *ngIf="formGroup.get('uri').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
                 </mat-form-field> -->
@@ -29,7 +28,7 @@
                     <tr>
                         <td>
                             <mat-form-field>
-                                <input matInput (focus)="startDate.open()" (click)="startDate.open()" placeholder="{{'PROJECT-EDITOR.FIELDS.START' | translate}}"
+                                <input matInput (focus)="startDate.open()" (click)="startDate.open()" placeholder="{{'DMP-EDITOR.FIELDS.START' | translate}}"
                                     class="table-input" [matDatepicker]="startDate" formControlName="startDate" required>
                                 <mat-datepicker-toggle matSuffix [for]="startDate"></mat-datepicker-toggle>
                                 <mat-datepicker #startDate></mat-datepicker>
@@ -39,7 +38,7 @@
                         </td>
                         <td>
                             <mat-form-field>
-                                <input matInput (focus)="endDate.open()" (click)="endDate.open()" placeholder="{{'PROJECT-EDITOR.FIELDS.END' | translate}}"
+                                <input matInput (focus)="endDate.open()" (click)="endDate.open()" placeholder="{{'DMP-EDITOR.FIELDS.END' | translate}}"
                                     class="table-input" [matDatepicker]="endDate" formControlName="endDate" required>
                                 <mat-datepicker-toggle matSuffix [for]="endDate"></mat-datepicker-toggle>
                                 <mat-datepicker #endDate></mat-datepicker>
@@ -51,33 +50,48 @@
                 </table> -->
 
                 <mat-form-field class="full-width">
-                    <textarea matInput class="description-area" placeholder="{{'PROJECT-EDITOR.FIELDS.DESCRIPTION' | translate}}" formControlName="description"
+                    <textarea matInput class="description-area" placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}}" formControlName="description"
                         required></textarea>
                     <mat-error *ngIf="formGroup.get('description').errors?.backendError">{{errorModel.description}}</mat-error>
                     <mat-error *ngIf="formGroup.get('description').errors?.required">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
                 </mat-form-field>
 
-                <td-chips [items]="filteredOrganisations" [debounce]="500" placeholder="Enter autocomplete strings" (inputChange)="filterOrganisations($event)"
+                <td-chips color="accent" [items]="filteredOrganisations" formControlName="organisations" placeholder="{{'DMP-EDITOR.FIELDS.ORGANISATIONS' | translate}}"
-                    requireMatch>
+                    (inputChange)="filterOrganisations($event)" requireMatch>
                     <ng-template td-chip let-chip="chip">
-                        <!-- <div class="tc-grey-100 bgc-teal-700" td-chip-avatar>{{chip.substring(0, 1).toUpperCase()}}</div>  -->
+                        <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}}
+                            {{option.name}}
                         </div>
-                      </ng-template>
+                    </ng-template>
                     <mat-progress-bar [style.height.px]="2" *ngIf="filteringOrganisationsAsync" mode="indeterminate"></mat-progress-bar>
                 </td-chips>
 
+                <td-chips 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" class="full-width text-right" align="end">
-                    <button mat-raised-button color="primary" (click)="cancel()" type="button">{{'PROJECT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
+                    <button mat-raised-button color="primary" (click)="cancel()" type="button">{{'DMP-EDITOR.ACTIONS.CANCEL' | translate}}</button>
-                    <button mat-raised-button color="primary" type="submit">{{'PROJECT-EDITOR.ACTIONS.SAVE' | translate}}</button>
+                    <button mat-raised-button color="primary" type="submit">{{'DMP-EDITOR.ACTIONS.SAVE' | translate}}</button>
-                    <button *ngIf="!isNew" mat-raised-button color="primary" type="submit" (click)="delete()">{{'PROJECT-EDITOR.ACTIONS.DELETE' | translate}}</button>
+                    <button *ngIf="!isNew" mat-raised-button color="primary" type="submit" (click)="delete()">{{'DMP-EDITOR.ACTIONS.DELETE' | translate}}</button>
                 </div>
 
             </mat-card-content>
         </mat-card>
     </form>
+    <div *ngIf="formGroup"> {{ formGroup.value | json }}</div>
 </div>

dmp-frontend/src/app/dmps/editor/dmp-editor.component.ts

@@ -12,6 +12,7 @@ import { DataManagementPlanService } from "../../services/data-management-plan/d
 import { DataManagementPlanModel } from "../../models/data-managemnt-plans/DataManagementPlanModel";
 import { ServerService } from "../../services/server.service";
 import { ExternalSourcesService } from "../../services/external-sources/external-sources.service";
+import { ExternalSourcesItemModel } from "../../models/external-sources/ExternalSourcesItemModel";
 
 
 
@@ -30,20 +31,8 @@ export class DataManagementPlanEditorComponent implements AfterViewInit {
 
   filteringOrganisationsAsync: boolean = false;
   filteringResearchersAsync: boolean = false;
-  filteredOrganisations: string[];
+  filteredOrganisations: ExternalSourcesItemModel[];
-  filteredResearchers: string[];
+  filteredResearchers: ExternalSourcesItemModel[];
-
-  filterOrganisations(value: string): void {
-    this.filteredOrganisations = undefined;
-    if (value) {
-      this.filteringOrganisationsAsync = true;
-      
-      this.externalSourcesService.searchDMPOrganizations(value).subscribe(organizations => {
-        this.filteredOrganisations = organizations;
-        this.filteringOrganisationsAsync = false;
-      });
-    }
-  }
 
   constructor(
     private dataManagementPlanService: DataManagementPlanService,
@@ -116,4 +105,40 @@ export class DataManagementPlanEditorComponent implements AfterViewInit {
   public cancel(): void {
     this.router.navigate(['/dataManagementPlans']);
   }
+
+  filterOrganisations(value: string): void {
+    
+    this.filteredOrganisations = undefined;
+    if (value) {
+      this.filteringOrganisationsAsync = true;
+      
+      this.externalSourcesService.searchDMPOrganizations(value).subscribe(items => {
+        this.filteredOrganisations = items;
+        this.filteringOrganisationsAsync = false;
+
+        // this.filteredOrganisations = items.filter((filteredObj: any) => {
+        //   return this.objectsModel ? this.objectsModel.indexOf(filteredObj) < 0 : true;
+        // });
+
+      });
+    }
+  }
+
+  filterResearchers(value: string): void {
+    
+    this.filteredResearchers = undefined;
+    if (value) {
+      this.filteringResearchersAsync = true;
+      
+      this.externalSourcesService.searchDMPResearchers(value).subscribe(items => {
+        this.filteredResearchers = items;
+        this.filteringResearchersAsync = false;
+
+        // this.filteredOrganisations = items.filter((filteredObj: any) => {
+        //   return this.objectsModel ? this.objectsModel.indexOf(filteredObj) < 0 : true;
+        // });
+
+      });
+    }
+  }
 }

dmp-frontend/src/app/models/data-managemnt-plans/DataManagementPlanModel.ts

@@ -4,6 +4,7 @@ import { FormGroup, FormBuilder, FormControl, Validators } from "@angular/forms"
 import { BackendErrorValidator } from "../../utilities/validators/BackendErrorValidator";
 import { BaseErrorModel } from "../error/BaseErrorModel";
 import { AutoCompleteItem } from "../../shared/components/autocomplete/AutoCompleteItem";
+import { ExternalSourcesItemModel } from "../external-sources/ExternalSourcesItemModel";
 
 export class DataManagementPlanModel implements Serializable<DataManagementPlanModel> {
 	public id: String;
@@ -13,9 +14,8 @@ export class DataManagementPlanModel implements Serializable<DataManagementPlanM
 	public status: String;
 	public description: String;
 	public selectedProject: AutoCompleteItem;
-	// public selectedProjectReference: AutoCompleteItem;
+	public organisations: ExternalSourcesItemModel[] = [];
-	// public selectedProjectReference: AutoCompleteItem;
+	public researchers: ExternalSourcesItemModel[] = [];
-	
 
 	public errorModel: BaseErrorModel = new BaseErrorModel();
 
@@ -39,6 +39,8 @@ export class DataManagementPlanModel implements Serializable<DataManagementPlanM
 			version: [{ value: this.version, disabled: disabled }, context.getValidation('version').validators],
 			status: [{ value: this.status, disabled: disabled }, context.getValidation('status').validators],
 			description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators],
+			organisations: [{ value: this.organisations, disabled: disabled }, context.getValidation('description').validators],
+			researchers: [{ value: this.researchers, disabled: disabled }, context.getValidation('researchers').validators],
 		});
 
 		return formGroup;
@@ -51,6 +53,8 @@ export class DataManagementPlanModel implements Serializable<DataManagementPlanM
 		baseContext.validation.push({ key: 'version', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'version')] });
 		baseContext.validation.push({ key: 'status', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'status')] });
 		baseContext.validation.push({ key: 'description', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'description')] });
+		baseContext.validation.push({ key: 'organisations', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'organisations')] });
+		baseContext.validation.push({ key: 'researchers', validators: [Validators.required, BackendErrorValidator(this.errorModel, 'researchers')] });
 
 		return baseContext;
 	}

dmp-frontend/src/app/models/external-sources/ExternalSourcesItemModel.ts

@@ -0,0 +1,5 @@
+export interface ExternalSourcesItemModel {
+	id: String;
+	name: String;
+	description: String;
+}

dmp-frontend/src/app/services/external-sources/external-sources.service.ts

@@ -4,6 +4,7 @@ import { Injectable } from '@angular/core';
 import { HostConfiguration } from './../../app.constants';
 import { BaseHttpService } from '../../utilities/cite-http-service-module/base-http.service';
 import { Observable } from 'rxjs/Observable';
+import { ExternalSourcesItemModel } from '../../models/external-sources/ExternalSourcesItemModel';
 
 
 @Injectable()
@@ -21,23 +22,23 @@ export class ExternalSourcesService {
         this.headers = this.headers.set('Accept', 'application/json');
     }
 
-    public searchDatasetRegistry(like: string) {
+    public searchDatasetRegistry(like: string): Observable<ExternalSourcesItemModel[]> {
-        return this.http.get("registries" + "?query=" + like);
+        return this.http.get<ExternalSourcesItemModel[]>(this.actionUrl + "registries" + "?query=" + like, { headers: this.headers });
     }
 
-    public searchDatasetRepository(like: string) {
+    public searchDatasetRepository(like: string): Observable<ExternalSourcesItemModel[]> {
-        return this.http.get("datarepos" + "?query=" + like);
+        return this.http.get<ExternalSourcesItemModel[]>(this.actionUrl + "datarepos" + "?query=" + like, { headers: this.headers });
     }
 
-    public searchDatasetService(like: string) {
+    public searchDatasetService(like: string): Observable<ExternalSourcesItemModel[]> {
-        return this.http.get("services" + "?query=" + like);
+        return this.http.get<ExternalSourcesItemModel[]>(this.actionUrl + "services" + "?query=" + like, { headers: this.headers });
     }
 
-    public searchDMPResearchers(like: string) {
+    public searchDMPResearchers(like: string): Observable<ExternalSourcesItemModel[]> {
-        return this.http.get("researchers" + "?query=" + like);
+        return this.http.get<ExternalSourcesItemModel[]>(this.actionUrl + "researchers" + "?query=" + like, { headers: this.headers });
     }
 
-    public searchDMPOrganizations(like: string): Observable<any>  {
+    public searchDMPOrganizations(like: string): Observable<ExternalSourcesItemModel[]> {
-        return this.http.get<any>(this.actionUrl + "organisations" + "?query=" + like, { headers: this.headers });
+        return this.http.get<ExternalSourcesItemModel[]>(this.actionUrl + "organisations" + "?query=" + like, { headers: this.headers });
     }
 }

dmp-frontend/src/assets/lang/en.json

@@ -43,7 +43,7 @@
             "EDIT": "Edit"
         },
         "FIELDS": {
-            "NAME": "New Project",
+            "NAME": "Name",
             "ABBREVIATION": "Abbreviation",
             "URI": "URI",
             "START": "Start",
@@ -56,6 +56,23 @@
             "DELETE": "Delete"
         }
     },
+    "DMP-EDITOR": {
+        "TITLE": {
+            "NEW": "New Data Management Plan",
+            "EDIT": "Edit"
+        },
+        "FIELDS": {
+            "NAME": "Name",
+            "DESCRIPTION": "Description",
+            "ORGANISATIONS": "Organisations",
+            "RESEARCHERS": "Researchers"
+        },
+        "ACTIONS": {
+            "SAVE": "Save",
+            "CANCEL": "Cancel",
+            "DELETE": "Delete"
+        }
+    },
     "CRITERIA": {
         "FORMS": {
             "PERIOD-FROM": "Start",

dmp-frontend/src/styles.scss

@@ -1,3 +1,48 @@
-@import "~@angular/material/prebuilt-themes/indigo-pink.css";
+/* @import "~@angular/material/prebuilt-themes/indigo-pink.css"; */
 @import '~@angular/material/theming';
 @import '~@covalent/core/theming/all-theme';
+
+@include mat-core();
+
+// Define a theme.
+$primary: mat-palette($mat-indigo);
+$accent:  mat-palette($mat-pink, A200, A100, A400);
+
+$theme: mat-light-theme($primary, $accent);
+
+// Include all theme styles for the components.
+@include angular-material-theme($theme);
+@include covalent-theme($theme);
+
+
+
+  
+  /* dashboard */
+
+  .card{
+    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
+    border-radius: 6px;
+    color: rgba(0,0,0, 0.87);
+    background: #fff;
+  }
+  
+  .card-raised{
+    box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.42), 0 4px 25px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
+  }
+
+  @media screen and (max-width: 990px){
+    #sidebar, #nav-right, #nav-left-button{
+      display: none;
+    }
+    #menu{
+      display: inline;
+    }
+    #main-panel{
+      padding-left: 0;
+      -webkit-transition: all 400ms;
+      -moz-transition: all 400ms;
+      -ms-transition: all 400ms;
+      -o-transition: all 400ms;
+      transition: all 400ms;
+    }
+  }