MInor changes

This commit is contained in:
Nikolaos Laskaris 2017-10-17 13:33:52 +03:00
parent f9b995a7bc
commit f2869169c2
14 changed files with 420 additions and 84 deletions

View File

@ -19,6 +19,7 @@ import { DatasetProfileService } from './services/dataset-profile.service';
import { DmpsServiceService } from './services/dmps-service.service';
import { ProjectService } from './services/project-service';
import { ServiceService } from './services/service-service';
import { ResearcherService } from './services/researcher-service';
import { OrganisationService } from './services/organisation-service';
import { DmpProfileService } from './services/dmpprofile-service';
import { RegistryService } from './services/registry-service';
@ -31,6 +32,8 @@ import { DmpProfileTableFilterPipe } from './pipes/dmp-profile-table-filter.pipe
import { ProjectTableFilterPipe } from './pipes/project-table-filter.pipe';
import { RegistryTableFilterPipe } from './pipes/registry-table-filter.pipe';
import { OrganisationTableFilterPipe } from './pipes/organisation-table-filter.pipe';
import { ResearcherTableFilterPipe } from './pipes/researcher-table-filter.pipe';
import { GooggleSignInComponent } from './login/googgle-sign-in/googgle-sign-in.component';
import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component';
@ -49,6 +52,7 @@ import { DmpProfileEditorComponent } from './managers/dmp-profile-editor/dmp-pro
import { OrganisationEditorComponent } from './managers/organisation-editor/organisation-editor.component';
import { RegistryEditorComponent } from './managers/registry-editor/registry-editor.component';
import { ServiceEditorComponent } from './managers/service-editor/service-editor.component';
import { ResearcherEditorComponent } from './managers/researcher-editor/researcher-editor.component';
@ -61,6 +65,7 @@ import { ServiceEditorComponent } from './managers/service-editor/service-editor
OrganisationTableFilterPipe,
RegistryTableFilterPipe,
ServiceTableFilterPipe,
ResearcherTableFilterPipe,
AppComponent,
GooggleSignInComponent,
@ -76,7 +81,8 @@ import { ServiceEditorComponent } from './managers/service-editor/service-editor
OrganisationEditorComponent,
RegistryEditorComponent,
ServiceEditorComponent,
MainSignInComponent
MainSignInComponent,
ResearcherEditorComponent
],
imports: [
BrowserModule,
@ -90,7 +96,7 @@ import { ServiceEditorComponent } from './managers/service-editor/service-editor
NgbModule.forRoot(),
AppRouting
],
providers: [ DatasetsServiceService, TokenService, DmpsServiceService,
providers: [ DatasetsServiceService, TokenService, DmpsServiceService, ResearcherService,
DialogService, DatasetProfileService, ProjectService, OrganisationService,
DmpProfileService, RegistryService, ServiceService, NativeLoginService, HttpModule, Toolbox, HttpClient, RestBase],
bootstrap: [AppComponent]

View File

@ -59,6 +59,13 @@
<li [ngClass]="{true:'active'}[currentlySelected=='services']" (click)="setActive('services')" [routerLink]="['/services']">All services</li>
</ul>
<li data-toggle="collapse" data-target="#manage-researchers" class="collapsed">
<a style="cursor:pointer"><i class="fa fa-newspaper-o"></i>Manage Researchers <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="manage-researchers">
<li [ngClass]="{true:'active'}[currentlySelected=='researchers']" (click)="setActive('researchers')" [routerLink]="['/researchers']">All researchers</li>
</ul>
<li data-toggle="collapse" data-target="#manage-users" class="collapsed">
<a style="cursor:pointer"><i class="fa fa-newspaper-o"></i> Users <span class="arrow"></span></a>
</li>
@ -76,78 +83,3 @@
</div>
<!--
<div class="nav-side-menu">
<div class="brand">Quick Navigation</div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li data-toggle="collapse" data-target="#products" class="collapsed active">
<a style="cursor:pointer"><i class="fa fa-gift fa-lg"></i> Manage Datasets <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="products">
<li class="active"><a style="cursor:pointer">Datasets</a></li>
<li><a style="cursor:pointer">Dataset Profiles</a></li>
<li><a style="cursor:pointer">Buttons</a></li>
<li><a style="cursor:pointer">Tabs & Accordions</a></li>
<li><a style="cursor:pointer">Typography</a></li>
<li><a style="cursor:pointer">FontAwesome</a></li>
<li><a style="cursor:pointer">Slider</a></li>
<li><a style="cursor:pointer">Panels</a></li>
<li><a style="cursor:pointer">Widgets</a></li>
<li><a style="cursor:pointer">Bootstrap Model</a></li>
</ul>
<li data-toggle="collapse" data-target="#service" class="collapsed">
<a style="cursor:pointer"><i class="fa fa-globe fa-lg"></i> Services <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="service">
<li>New Service 1</li>
<li>New Service 2</li>
<li>New Service 3</li>
</ul>
<li data-toggle="collapse" data-target="#new" class="collapsed">
<a style="cursor:pointer"><i class="fa fa-car fa-lg"></i> New <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="new">
<li>New New 1</li>
<li>New New 2</li>
<li>New New 3</li>
</ul>
<li>
<a style="cursor:pointer">
<i class="fa fa-user fa-lg"></i> Profile
</a>
</li>
<li>
<a style="cursor:pointer">
<i class="fa fa-users fa-lg"></i> Users
</a>
</li>
</ul>
</div>
</div>
-->

View File

@ -137,10 +137,11 @@ export class DmpEditorComponent implements OnInit {
this.dmpsServiceService.delete(dmp).subscribe(
(response) => {
simple_notifier("success",null,"Deleted dataset");
console.log(response);
this.getAllDmps(false);
this.switchToTable();
},
(err) => {
simple_notifier("danger",null,"Could not delete dmp");
}
)
}

View File

@ -111,9 +111,11 @@ export class DmpProfileEditorComponent implements OnInit {
this.dmpProfileService.delete(dmpProfile).subscribe(
(response) => {
simple_notifier("success",null,"Deleted DMP Profile");
this.getAllDmpProfiles(false);
this.switchToTable();
},
(err) => {
simple_notifier("danger",null,"Could not delete DMP Profile");
}
)
}

View File

@ -111,10 +111,11 @@ export class OrganisationEditorComponent implements OnInit {
this.organisationService.delete(organisation).subscribe(
(response) => {
simple_notifier("success",null,"Deleted organisation");
this.refreshTable(false);
this.switchToTable();
},
(err) => {
simple_notifier("danger",null,"Could not delete organisation");
console.log(err);
}
)
}

View File

@ -116,11 +116,11 @@ export class ProjectEditorComponent implements OnInit {
this.projectService.delete(project).subscribe(
(response) => {
simple_notifier("success",null,"Deleted project");
console.log(response);
this.getAllProjects(false);
this.switchToTable();
},
(err) => {
simple_notifier("danger",null,"Could not delete project");
console.log(err);
}
)
}

View File

@ -113,9 +113,11 @@ export class RegistryEditorComponent implements OnInit {
this.registryService.delete(registry).subscribe(
(response) => {
simple_notifier("success",null,"Deleted registry");
this.switchToTable();
this.refreshTable(false);
},
(err) => {
simple_notifier("danger",null,"Could not delete registry");
}
)
}

View File

@ -0,0 +1,33 @@
.invisible {
display:none;
}
.visible {
display:block;
}
tr.hover:hover > * {
background-color: #eeeeee;
}
.editor-container{
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
.button-150px {
max-width: 150px;
}
.ng-template{
text-align: right;
}
.grayout-empty-table {
opacity: 0.6; /* Real browsers */
filter: alpha(opacity = 60); /* MSIE */
text-align: center;
vertical-align: middle;
}

View File

@ -0,0 +1,120 @@
<div class="editor-container container">
<div [ngClass]="{true:'visible', false:'invisible'}[tableVisible]">
<table class="table table-striped" [mfData]="tableData | researcherTableFilter : filterQuery" #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
<thead>
<tr>
<th colspan="1">
<input class="form-control" [(ngModel)]="filterQuery" placeholder='Filter'/>
</th>
<th>
<button class="btn btn-default" (click)="refreshTable($event)">
<span class="glyphicon glyphicon-refresh"></span>
</button>
</th>
</tr>
<tr>
<th [ngClass]="{true:'visible', false:'invisible'}[showIDs]"><mfDefaultSorter by="id">ID</mfDefaultSorter></th>
<th><mfDefaultSorter by="label">Label</mfDefaultSorter></th>
<th><mfDefaultSorter by="uri">Uri</mfDefaultSorter></th>
<th><mfDefaultSorter by="primaryEmail">PrimaryEmail</mfDefaultSorter></th>
<th><mfDefaultSorter by="definition">Definition</mfDefaultSorter></th>
<th><mfDefaultSorter by="reference">Reference</mfDefaultSorter></th>
</tr>
</thead>
<tbody>
<tr class="grayout-empty-table" *ngIf="!mf.data[0]" [contextMenu]="basicMenu" [contextMenuSubject]="researcher"> <td colspan="5">No elements</td></tr>
<tr *ngFor="let researcher of mf.data" class="hover" [contextMenu]="basicMenu" [contextMenuSubject]="researcher">
<td [ngClass]="{true:'visible', false:'invisible'}[showIDs]">{{researcher.id}}</td>
<td>{{researcher?.label}}</td>
<td>{{researcher?.uri}}</td>
<td>{{researcher?.primaryEmail}}</td>
<td>{{researcher?.definition}}</td>
<td>{{researcher?.reference}}</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="5">
<mfBootstrapPaginator [rowsOnPageSet]="[10,20,40]"></mfBootstrapPaginator>
</td>
</tr>
</tfoot>
</table>
</div>
<!-- this is the dmp editor -->
<div [ngClass]="{true:'visible', false:'invisible'}[editorVisible]">
<div> <!-- form container -->
<div style="display:block;">
<button (click)="switchToTable()" class="btn btn-lg btn-success pull-right" style="max-width:120px;">
<span class="glyphicon glyphicon-arrow-left"></span> Go back
</button>
</div>
<form [formGroup]="researcherEditorForm" novalidate style="display:block;">
<div class="form-group" [ngClass]="{null:'invisible'}[editingResearcher?.id]">
<label class="center-block">ID: {{editingResearcher?.id}}
<input class="form-control invisible" formControlName="id" [ngModel]="editingResearcher?.id">
</label>
</div>
<div class="form-group">
<label class="center-block">Label:
<input class="form-control" formControlName="label" [ngModel]="editingResearcher?.label" (ngModelChange)="editingResearcher.label=$event">
</label>
</div>
<div class="form-group">
<label class="center-block">Uri:
<input class="form-control" formControlName="uri" [ngModel]="editingResearcher?.uri" (ngModelChange)="editingResearcher.uri$event">
</label>
</div>
<div class="form-group">
<label class="center-block">Primary Email:
<input class="form-control" formControlName="primaryEmail" [ngModel]="editingResearcher?.primaryEmail" (ngModelChange)="editingResearcher.primaryEmail=$event">
</label>
</div>
<div class="form-group">
<label class="center-block">Definition:
<input class="form-control" formControlName="definition" [ngModel]="editingResearcher?.definition" (ngModelChange)="editingResearcher.definition$event">
</label>
</div>
<div class="form-group">
<label class="center-block">Reference:
<input class="form-control" formControlName="reference" [ngModel]="editingResearcher?.reference" (ngModelChange)="editingResearcher.reference$event">
</label>
</div>
<div class="form-group" style="width:540px;">
<button style="float:right;" type="submit" (click)="save($event, $data, $form)"class="btn btn-success">Save</button>
</div>
</form>
<p>Form value: {{ researcherEditorForm.value | json }}</p>
</div>
</div>
</div>
<context-menu>
<ng-template contextMenuItem [subMenu]="manage">
<span></span>Manage researchers
</ng-template>
<context-menu #manage>
<ng-template contextMenuItem (execute)="newResearcher($event?.item)">
<span class="glyphicon glyphicon-plus"></span>Create researcher
</ng-template>
<ng-template contextMenuItem (execute)="editResearcher($event?.item?.id)">
<span class="glyphicon glyphicon-pencil"></span>Edit this researcher
</ng-template>
<ng-template contextMenuItem (execute)="delete($event?.item?.id)">
<span class="glyphicon glyphicon-trash red"></span> Delete this
</ng-template>
</context-menu>
<ng-template contextMenuItem>
<span></span>Show full tree connections
</ng-template>
</context-menu>

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ResearcherEditorComponent } from './researcher-editor.component';
describe('ResearcherEditorComponent', () => {
let component: ResearcherEditorComponent;
let fixture: ComponentFixture<ResearcherEditorComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ResearcherEditorComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ResearcherEditorComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should be created', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,134 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { ResearcherService } from '../../services/researcher-service';
import { ContextMenuComponent } from 'ngx-contextmenu';
import { ReactiveFormsModule } from '@angular/forms';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import '../../../assets/custom.js';
declare function simple_notifier(type: string, title: string, message:string): any;
@Component({
selector: 'app-researcher-editor',
templateUrl: './researcher-editor.component.html',
styleUrls: ['./researcher-editor.component.css']
})
export class ResearcherEditorComponent implements OnInit {
constructor(private researcherService : ResearcherService, private fb: FormBuilder) {
}
//whole dmp data model
tableData : any[] = new Array();
//researcher editor data model
editingResearcher: any = {};
researcherEditorForm : any;
//required by the table
public filterQuery = "";
public rowsOnPage = 10;
//public sortBy = "email";
public sortOrder = "asc";
//visibility rules for containers
tableVisible: boolean = true;
editorVisible: boolean = false;
// for tableIds
showIDs : boolean = false;
ngOnInit() {
this.getAllResearchers(false);
this.createResearcherEditorForm();
}
createResearcherEditorForm(){
this.researcherEditorForm = this.fb.group({
id: null,
label: ['', Validators.required ],
uri: '',
primaryEmail: '',
definition: '',
reference: ''
});
}
switchToTable(){
this.tableVisible = true;
this.editorVisible = false;
}
switchToEditor(researcherID){
this.tableVisible = false;
this.editorVisible = true;
if(researcherID == null){
this.editingResearcher = {id: null, label: "", uri: "", primaryEmail: "", definition: "", reference: "" };
}
else{
this.editingResearcher = this.tableData.filter((researcher) => researcher.id === researcherID)[0];
}
}
getAllResearchers(showNotification : boolean){
this.researcherService.getAllResearchers().subscribe( (data) => {
this.tableData = data;
if(showNotification)
simple_notifier("info",null,"Refreshed the table");
});
}
editResearcher(researcher){
this.switchToEditor(researcher);
}
newResearcher(){
this.switchToEditor(null);
}
save(mouseEvent){
this.researcherService.create(this.researcherEditorForm.value).subscribe(
response => {
simple_notifier("success",null,"Saved resercher");
this.getAllResearchers(false);
},
err => {
simple_notifier("danger",null,"Could not save researcher");
}
);
}
delete(resercher){
this.researcherService.delete(resercher).subscribe(
(response) => {
simple_notifier("success",null,"Deleted researcher");
this.getAllResearchers(false);
this.switchToTable();
},
(err) => {
simple_notifier("danger",null,"Could not delete researcher");
}
)
}
refreshTable($event){
this.getAllResearchers(true);
}
@ViewChild(ContextMenuComponent) public basicMenu: ContextMenuComponent;
}

View File

@ -0,0 +1,29 @@
import * as _ from "lodash";
import {Pipe, PipeTransform} from "@angular/core";
@Pipe({
name: "researcherTableFilter"
})
export class ResearcherTableFilterPipe implements PipeTransform {
transform(array: any[], query: string): any {
if (query) {
return _.filter(array, row => {
if (row.uri == null) row.uri = "";
if (row.label == null) row.label = "";
if (row.id == null) row.id = "";
return (
row.label.indexOf(query) > -1 ||
//row.version == query ||
row.id.indexOf(query) > -1
)
});
}
return array;
}
}

View File

@ -10,6 +10,7 @@ import { ProjectEditorComponent } from './managers/project-editor/project-editor
import { ServiceEditorComponent } from './managers/service-editor/service-editor.component';
import { RegistryEditorComponent } from './managers/registry-editor/registry-editor.component';
import { OrganisationEditorComponent } from './managers/organisation-editor/organisation-editor.component';
import { ResearcherEditorComponent } from './managers/researcher-editor/researcher-editor.component';
import { MainWindowComponent } from './main-window/main-window.component';
@ -57,6 +58,10 @@ export const routes: Routes = [
path: 'registries',
component: RegistryEditorComponent
},
{
path: 'researchers',
component: ResearcherEditorComponent
},
{
path: 'main',
component: MainWindowComponent

View File

@ -0,0 +1,46 @@
import { Component, Input, OnInit, AfterViewChecked, ViewChild } from '@angular/core';
import { HttpClient , HttpHeaders, HttpParams} from '@angular/common/http';
import { TokenService, TokenProvider } from './login/token.service'
import { Injectable } from '@angular/core';
import { Toolbox } from '../services/toolbox';
import {RestBase} from './rest-base';
import 'rxjs/Rx';
@Injectable()
export class ResearcherService implements OnInit {
constructor(public restBase: RestBase) {
}
ngOnInit(){
}
getResearcherIdsLabels() {
return this.restBase.get("researcher/listAllLabelIDs");
}
getResearcherIds(){
return this.restBase.get("researchers");
}
getAllResearchers(){
return this.restBase.get("researcher/getAll");
}
create(researcher){
return this.restBase.post("researcher/create", researcher);
}
delete(researcherID){
var researcher = {"id": researcherID};
return this.restBase.post("researcher/delete", researcher);
}
}