Changes in linking layout
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-portal/trunk@42943 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
63b6131dcf
commit
e1f6f3c5c1
|
@ -11,15 +11,29 @@ import {SearchDataciteService} from '../../services/searchDatacite.service';
|
||||||
selector: 'claim-dataset',
|
selector: 'claim-dataset',
|
||||||
directives: [...ROUTER_DIRECTIVES,pagingFormatterNoLoad, PublicationTitleFormatter],
|
directives: [...ROUTER_DIRECTIVES,pagingFormatterNoLoad, PublicationTitleFormatter],
|
||||||
template: `
|
template: `
|
||||||
|
<!--
|
||||||
<h3>Selected Results:</h3>
|
<h3>Selected Results:</h3>
|
||||||
<div >
|
<div >
|
||||||
<p *ngFor=" let item of selectedDatasets "> <publication-title [title]="item.result.title" [url]="'http://dx.doi.org/'+item.result.doi" > </publication-title> {{item.result.doi}} --{{item.result.publisher}}<button type="button" class="close" (click)="remove(item)" aria-label="Close"> <span aria-hidden="true">×</span></button> </p>
|
<p *ngFor=" let item of selectedDatasets "> <publication-title [title]="item.result.title" [url]="'http://dx.doi.org/'+item.result.doi" > </publication-title> {{item.result.doi}} --{{item.result.publisher}}<button type="button" class="close" (click)="remove(item)" aria-label="Close"> <span aria-hidden="true">×</span></button> </p>
|
||||||
</div>
|
</div>
|
||||||
<p><i>Fetches from Datacite </i></p>
|
-->
|
||||||
|
<div class="panel">
|
||||||
|
<div class="">
|
||||||
<form>
|
<form>
|
||||||
<input #term [(ngModel)]="keyword"/>
|
<div class="input-group">
|
||||||
|
<span class="input-group-addon" id="basic-addon1">Dataset</span>
|
||||||
|
<input class=" form-control" #term [(ngModel)]="keyword"/>
|
||||||
|
<span class="input-group-btn">
|
||||||
<button (click)="searchDatacite(term.value,10,1)" type="submit" class="btn btn-default">Search</button>
|
<button (click)="searchDatacite(term.value,10,1)" type="submit" class="btn btn-default">Search</button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="panel ">
|
||||||
|
<div class="">
|
||||||
|
|
||||||
<ul class="nav nav-tabs">
|
<ul class="nav nav-tabs">
|
||||||
<li class="active"><a data-toggle="tab" href="#datacite">Datacite ({{resultsNum}})</a></li>
|
<li class="active"><a data-toggle="tab" href="#datacite">Datacite ({{resultsNum}})</a></li>
|
||||||
<li><a data-toggle="tab" href="#openaire">Openaire</a></li>
|
<li><a data-toggle="tab" href="#openaire">Openaire</a></li>
|
||||||
|
@ -40,8 +54,10 @@ import {SearchDataciteService} from '../../services/searchDatacite.service';
|
||||||
<h3>Menu 1</h3>
|
<h3>Menu 1</h3>
|
||||||
<p>Some content in menu 1.</p>
|
<p>Some content in menu 1.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
`,
|
`,
|
||||||
providers:[JSONP_PROVIDERS, SearchDataciteService]
|
providers:[JSONP_PROVIDERS, SearchDataciteService]
|
||||||
})
|
})
|
||||||
|
|
|
@ -8,15 +8,15 @@ import {OpenaireProjectsService} from '../../services/openaireProjects.service';
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'claim-projects',
|
selector: 'claim-projects',
|
||||||
template: `
|
template: `
|
||||||
<div class="container" >
|
<div class="panel" >
|
||||||
|
|
||||||
<h3>Select Funder:</h3>
|
|
||||||
<!-- <select [(ngModel)]="selectedFunderId" (ngModelChange)="funderChanged()" >
|
<!-- <select [(ngModel)]="selectedFunderId" (ngModelChange)="funderChanged()" >
|
||||||
<option [ngValue]="'0'">Funder:</option>
|
<option [ngValue]="'0'">Funder:</option>
|
||||||
<option *ngFor="let funder of funders" [ngValue]="funder.field.field[1]['@value_original']">{{funder.field.field[1]['@value']}}</option>
|
<option *ngFor="let funder of funders" [ngValue]="funder.field.field[1]['@value_original']">{{funder.field.field[1]['@value']}}</option>
|
||||||
</select> -->
|
</select> -->
|
||||||
<div class="dropdown">
|
<div class="input-group">
|
||||||
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
|
<div class="input-group-btn">
|
||||||
|
<button type="button" class="btn btn-default dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
|
||||||
{{selectedFunderName}}
|
{{selectedFunderName}}
|
||||||
<span class="caret"></span>
|
<span class="caret"></span>
|
||||||
</button>
|
</button>
|
||||||
|
@ -26,42 +26,25 @@ import {OpenaireProjectsService} from '../../services/openaireProjects.service';
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<h4>Select projects:</h4>
|
<input *ngIf="selectedFunderId != '0'" id="community" type="text" class="form-control" placeholder="Search for Projects" [(ngModel)]=query (keyup)=filter() >
|
||||||
<input id="community" type="text" class="validate filter-input" [(ngModel)]=query (keyup)=filter() >
|
</div>
|
||||||
<div class="suggestions" *ngIf="filteredList.length > 0">
|
<div class="suggestions" *ngIf="filteredList.length > 0">
|
||||||
<ul class="list-group" >
|
<ul class="list-group" >
|
||||||
<li *ngFor=" let item of filteredList" class="list-group-item" >
|
<li *ngFor=" let item of filteredList" class="list-group-item" >
|
||||||
<a (click)="select(item)">{{item.field[0]['@value']}} - {{item.field[1]['@value']}}- {{item.field[3]['@value']}}</a>
|
<a (click)="select(item)"> {{item.field[1]['@value']}}- {{item.field[3]['@value']}}</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="selections" *ngIf="selectedProjects.length > 0">
|
|
||||||
|
<!-- <div class="selections" *ngIf="selectedProjects.length > 0">
|
||||||
<label for="selecteditems">Selected: </label>
|
<label for="selecteditems">Selected: </label>
|
||||||
<ul id ="selecteditems" class="nav nav-pills" >
|
<ul id ="selecteditems" class="nav nav-pills" >
|
||||||
<li *ngFor="let item of selectedProjects" role="presentation" (click)="remove(item)">{{item.projectId}} - {{item.projectAcronym}} - {{item.projectName}} <span class="badge">X</span>
|
<li *ngFor="let item of selectedProjects" role="presentation" (click)="remove(item)">{{item.projectId}} - {{item.projectAcronym}} - {{item.projectName}} <span class="badge">X</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<!--<select [(ngModel)]="selectedCategory" (ngModelChange)="categoryChanged()" >
|
-->
|
||||||
<option [ngValue]="'0'">Category:</option>
|
|
||||||
<option *ngFor="let category of categories" [ngValue]="category.id">{{category.label}}</option>
|
|
||||||
</select>
|
|
||||||
<h4>Select concepts:</h4>
|
|
||||||
<input id="community" type="text" class="validate filter-input" [(ngModel)]=query (keyup)=filter() >
|
|
||||||
<div class="suggestions" *ngIf="filteredList.length > 0">
|
|
||||||
<ul class="list-group" *ngFor=" let item of filteredList" >
|
|
||||||
<li class="list-group-item" >
|
|
||||||
<a (click)="select(item)">{{item.label}}</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="selections" *ngIf="selectedProjects.length > 0">
|
|
||||||
<label for="selecteditems">Selected: </label>
|
|
||||||
<ul id ="selecteditems" class="nav nav-pills" *ngFor="let item of selectedProjects" >
|
|
||||||
<li role="presentation" (click)="remove(item)">{{item.concept.label}} <span class="badge">X</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>-->
|
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
providers:[ OpenaireProjectsService ]
|
providers:[ OpenaireProjectsService ]
|
||||||
|
|
|
@ -1,20 +1,28 @@
|
||||||
|
|
||||||
<h3>Selected Results:</h3>
|
<!--<h3>Selected Results:</h3>
|
||||||
<div >
|
<div >
|
||||||
<p *ngFor=" let item of selectedPublications "> <publication-title [title]="item.result.title" [url]="item.result.URL" > </publication-title> {{item.result.DOI}} --{{item.result.publisher}} <button (click)="remove(item)" type="button" class="btn btn-default">Remove</button></p>
|
<p *ngFor=" let item of selectedPublications "> <publication-title [title]="item.result.title" [url]="item.result.URL" > </publication-title> {{item.result.DOI}} --{{item.result.publisher}} <button (click)="remove(item)" type="button" class="btn btn-default">Remove</button></p>
|
||||||
</div>
|
</div>
|
||||||
<p><i>Fetches from crossref </i></p>
|
-->
|
||||||
<!-- (keyup)="searchCrossref(term.value)" -->
|
<!-- (keyup)="searchCrossref(term.value)" -->
|
||||||
<form>
|
<div class="panel">
|
||||||
<input #term [(ngModel)]="keyword"/>
|
<form>
|
||||||
|
<div class="input-group">
|
||||||
|
<span class="input-group-addon" id="basic-addon1">Publication</span>
|
||||||
|
<input class=" form-control" #term [(ngModel)]="keyword"/>
|
||||||
|
<span class="input-group-btn">
|
||||||
<button type="submit" (click)="search(term.value,10,1)" class="btn btn-default">Search</button>
|
<button type="submit" (click)="search(term.value,10,1)" class="btn btn-default">Search</button>
|
||||||
</form>
|
</span>
|
||||||
<ul class="nav nav-tabs">
|
</div>
|
||||||
<li class="active"><a data-toggle="tab" href="#crossref">Crossref ({{crossrefResultsNum}})</a></li>
|
</form>
|
||||||
<li><a data-toggle="tab" href="#openaire">Openaire ({{openaireResultsNum}})</a></li>
|
</div>
|
||||||
<li><a data-toggle="tab" href="#orcid">Orcid ({{orcidResultsNum}})</a></li>
|
<div class="panel">
|
||||||
</ul>
|
<ul class="nav nav-tabs">
|
||||||
<div class="tab-content">
|
<li class="active"><a data-toggle="tab" href="#crossref">Crossref ({{crossrefResultsNum}})</a></li>
|
||||||
|
<li><a data-toggle="tab" href="#openaire">Openaire ({{openaireResultsNum}})</a></li>
|
||||||
|
<li><a data-toggle="tab" href="#orcid">Orcid ({{orcidResultsNum}})</a></li>
|
||||||
|
</ul>
|
||||||
|
<div class="tab-content">
|
||||||
<div id="crossref" class="tab-pane fade in active">
|
<div id="crossref" class="tab-pane fade in active">
|
||||||
<div>
|
<div>
|
||||||
<div *ngIf="crossrefResultsNum != null && crossrefResultsNum > 0">
|
<div *ngIf="crossrefResultsNum != null && crossrefResultsNum > 0">
|
||||||
|
@ -65,4 +73,5 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -174,10 +174,11 @@ search(term: string, size : number, page : number){
|
||||||
var result ={id: item.DOI, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate:''};
|
var result ={id: item.DOI, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate:''};
|
||||||
console.info("Add result:"+result.id+" "+result.source+" "+item);
|
console.info("Add result:"+result.id+" "+result.source+" "+item);
|
||||||
this.selectedPublications.push(result);
|
this.selectedPublications.push(result);
|
||||||
var index:number =this.crossrefResults.indexOf(item);
|
//do not remove it from the list
|
||||||
if (index > -1) {
|
// var index:number =this.crossrefResults.indexOf(item);
|
||||||
this.crossrefResults.splice(index, 1);
|
// if (index > -1) {
|
||||||
}
|
// this.crossrefResults.splice(index, 1);
|
||||||
|
// }
|
||||||
this.publicationsChange.emit({
|
this.publicationsChange.emit({
|
||||||
value: this.selectedPublications
|
value: this.selectedPublications
|
||||||
});
|
});
|
||||||
|
@ -202,4 +203,13 @@ search(term: string, size : number, page : number){
|
||||||
this.orcidResultsToShow=[];
|
this.orcidResultsToShow=[];
|
||||||
this.orcidResultsToShow = this.orcidResults.slice(($event.value-1)*this.size, $event.value*this.size);
|
this.orcidResultsToShow = this.orcidResults.slice(($event.value-1)*this.size, $event.value*this.size);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
isSelected(item){
|
||||||
|
var index:number =this.selectedPublications.indexOf(item);
|
||||||
|
if (index > -1) {
|
||||||
|
return true;
|
||||||
|
}else{
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,29 +8,55 @@ import {ClaimDatasetComponent} from './claimDataset/claimDataset.component';
|
||||||
import {ClaimSelectedComponent} from './selected/selected.component';
|
import {ClaimSelectedComponent} from './selected/selected.component';
|
||||||
import {ClaimInsertComponent} from './insertClaim/insertClaim.component';
|
import {ClaimInsertComponent} from './insertClaim/insertClaim.component';
|
||||||
import {ClaimProjectsComponent} from './claimProject/claimProject.component';
|
import {ClaimProjectsComponent} from './claimProject/claimProject.component';
|
||||||
|
// import { MD_RADIO_DIRECTIVES, MdRadioDispatcher } from '@angular2-material/radio';
|
||||||
|
// import { MD_INPUT_DIRECTIVES } from '@angular2-material/input';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'linking',
|
selector: 'linking',
|
||||||
|
//providers: [MdRadioDispatcher],
|
||||||
directives: [ROUTER_DIRECTIVES, ClaimContextComponent, ClaimPublicationComponent, ClaimSelectedComponent, ClaimInsertComponent,ClaimDatasetComponent, ClaimProjectsComponent],
|
directives: [ROUTER_DIRECTIVES, ClaimContextComponent, ClaimPublicationComponent, ClaimSelectedComponent, ClaimInsertComponent,ClaimDatasetComponent, ClaimProjectsComponent],
|
||||||
template: `
|
template: `
|
||||||
<h1>Linking...</h1>
|
<h1>Linking Research Results</h1>
|
||||||
<div *ngIf=" show != 'claim'" class="row" >
|
<div *ngIf=" show != 'claim'" class="row" >
|
||||||
<div class="col-sm-6">
|
<div class="col-sm-6">
|
||||||
<div *ngIf=" show=='result' " >
|
<div *ngIf=" show=='result' " >
|
||||||
<form>
|
<form>
|
||||||
<input [(ngModel)]="keyword"/>
|
|
||||||
<button (click)="search()" type="submit" class="btn btn-default">Search</button>
|
<!--<md-input class="demo-full-width default" placeholder="Search for Research Results" [(ngModel)]="keyword"></md-input>
|
||||||
<div class="resultType">
|
|
||||||
|
<md-radio-group class="default" [(value)]="searchType">
|
||||||
|
<md-radio-button [value]="publication" [checked]="searchType === 'publication'" >Publication</md-radio-button>
|
||||||
|
<md-radio-button [value]="dataset" [checked]="searchType != 'publication'">Dataset</md-radio-button>
|
||||||
|
</md-radio-group> -->
|
||||||
|
<div class="input-group">
|
||||||
|
<div class="input-group-btn">
|
||||||
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{(searchType === 'publication')?"Publication":"Dataset"}} <span class="caret"></span></button>
|
||||||
|
<ul class="dropdown-menu">
|
||||||
|
<li (click)="typeChanged('publication')" ><a >Publication</a></li>
|
||||||
|
<li (click)="typeChanged('dataset')" ><a >Dataset</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="resultType">
|
||||||
|
<span class="input-group-addon">
|
||||||
<input #publication name="searchType" type="radio" [checked]="searchType === 'publication'" value="publication" (click)="searchType = publication.value" />Publication
|
<input #publication name="searchType" type="radio" [checked]="searchType === 'publication'" value="publication" (click)="searchType = publication.value" />Publication
|
||||||
<input #dataset name="searchType" [checked]="searchType === 'dataset'" type="radio" value="dataset" (click)="searchType = dataset.value" />Dataset
|
<input #dataset name="searchType" [checked]="searchType === 'dataset'" type="radio" value="dataset" (click)="searchType = dataset.value" />Dataset
|
||||||
</div>
|
</div>
|
||||||
|
</span>-->
|
||||||
|
<input class=" form-control" [(ngModel)]="keyword"/>
|
||||||
|
|
||||||
|
<span class="input-group-btn">
|
||||||
|
<button (click)="search()" type="submit" class="btn btn-default">Search</button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf=" show=='publication' ">
|
<div *ngIf=" show=='publication' ">
|
||||||
<claim-publication [keyword]="keyword" [selectedPublications]="publications" (publicationsCahnge)="publicationsChange($event)" > </claim-publication>
|
<claim-publication [keyword]="keyword" [selectedPublications]="publications" (publicationsChange)="publicationsChange($event)" > </claim-publication>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf=" show=='dataset' " >
|
<div *ngIf=" show=='dataset' " >
|
||||||
<claim-dataset [keyword]="keyword" [selectedDatasets]="datasets" (datasetsCahnge)="datasetsChange($event)" > </claim-dataset>
|
<claim-dataset [keyword]="keyword" [selectedDatasets]="datasets" (datasetsChange)="datasetsChange($event)" > </claim-dataset>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf=" show=='project' " >
|
<div *ngIf=" show=='project' " >
|
||||||
<claim-projects [selectedProjects]="projects" (projectsChange)="projectsChange($event)" > </claim-projects>
|
<claim-projects [selectedProjects]="projects" (projectsChange)="projectsChange($event)" > </claim-projects>
|
||||||
|
@ -129,14 +155,17 @@ export class LinkingComponent {
|
||||||
contextsChange($event) {
|
contextsChange($event) {
|
||||||
this.contexts=$event.value;
|
this.contexts=$event.value;
|
||||||
console.log($event.value);
|
console.log($event.value);
|
||||||
}
|
}
|
||||||
publicationsChange($event) {
|
publicationsChange($event) {
|
||||||
this.publications=$event.value;
|
this.publications=$event.value;
|
||||||
}
|
}
|
||||||
datasetsChange($event) {
|
datasetsChange($event) {
|
||||||
this.datasets=$event.value;
|
this.datasets=$event.value;
|
||||||
}
|
}
|
||||||
projectsChange($event) {
|
projectsChange($event) {
|
||||||
this.projects=$event.value;
|
this.projects=$event.value;
|
||||||
}
|
}
|
||||||
|
typeChanged(type:string) {
|
||||||
|
this.searchType = type;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue