85 lines
3.7 KiB
TypeScript
85 lines
3.7 KiB
TypeScript
import {Component, Input, Output, EventEmitter} from '@angular/core';
|
|
import { ActivatedRoute } from '@angular/router';
|
|
|
|
import {ClaimResult} from '../claim-utils/claimEntities.class';
|
|
|
|
declare var UIkit:any;
|
|
|
|
@Component({
|
|
selector: 'claim-results',
|
|
template:`
|
|
|
|
<ul *ngIf="results.length > 0 " class="uk-list uk-list-divider">
|
|
<li *ngFor=" let result of results " [class]="(isSelected(result.id))?'uk-block-muted':''">
|
|
<div >
|
|
<a *ngIf="result.url" target="_blank" [href]="result.url" >{{result.title?result.title:'[No title available]'}}</a>
|
|
<span *ngIf="!result.url" >{{result.title?result.title:'[No title available]'}}</span>
|
|
<a class="uk-button-default uk-align-right" *ngIf="!isSelected(result.id)"
|
|
(click)="add(result)" class="uk-icon-button icon-button-small">
|
|
<span class="uk-icon">
|
|
<svg width="16" height="16" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="0.8"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg>
|
|
</span>
|
|
|
|
</a>
|
|
<span *ngIf="isSelected(result.id)" class="uk-label uk-label-success">Added</span>
|
|
</div>
|
|
<span *ngIf="result.publisher!=null" class="uk-article-meta">Publisher: {{result.publisher}}</span>
|
|
<span *ngIf="result.journal!=null" class="uk-article-meta">Journal: {{result.journal}}</span><span *ngIf="(result.date)" class="uk-article-meta"> ({{result.date}})</span>
|
|
<div *ngIf="result.authors && result.authors.length >0 " class="uk-article-meta">Authors: <span *ngFor="let author of result.authors.slice(0,10) let i = index">{{author}}{{(i < (result.authors.slice(0,10).length-1))?"; ":""}}{{(i == result.authors.slice(0,10).length-1 && result.authors.length > 10)?"...":""}}</span></div>
|
|
<div *ngIf="result.editors && result.editors.length > 0" class="uk-article-meta">Editors: <span *ngFor="let author of result.editors.slice(0,10) let i = index">{{author}}{{(i < (result.authors.slice(0,10).length-1))?"; ":""}}{{(i == result.authors.slice(0,10).length-1 && result.authors.length > 10)?"...":""}}</span></div>
|
|
</li>
|
|
</ul>`,
|
|
|
|
})
|
|
export class ClaimResultsComponent {
|
|
@Input() results;
|
|
@Input() selectedResults;
|
|
@Input() localStoragePrefix:string = "";
|
|
private isSelected(id:string){
|
|
|
|
var found:boolean = false;
|
|
for (var _i = 0; _i < this.selectedResults.length; _i++) {
|
|
let item = this.selectedResults[_i];
|
|
if(item.id == id){
|
|
found=true;
|
|
}
|
|
}
|
|
return found;
|
|
|
|
|
|
}
|
|
add(item){
|
|
if(this.selectedResults.length > 150){
|
|
UIkit.notification({
|
|
message : 'Your basket exceeds the number of allowed results (150)',
|
|
status : 'warning',
|
|
timeout : 1500,
|
|
pos : 'top-center'
|
|
});
|
|
return;
|
|
}
|
|
var found:boolean = this.isSelected( item.id);
|
|
if (!found) {
|
|
this.selectedResults.push(item);
|
|
|
|
UIkit.notification({
|
|
message : 'A new research result added in your basket.',
|
|
status : 'primary',
|
|
timeout : 1500,
|
|
pos : 'top-center'
|
|
});
|
|
if(this.results != null){
|
|
localStorage.setItem(this.localStoragePrefix + "results", JSON.stringify(this.selectedResults));
|
|
}
|
|
}else{
|
|
UIkit.notification({
|
|
message : 'The research result is already in your basket.',
|
|
status : 'warning',
|
|
timeout : 1500,
|
|
pos : 'top-center'
|
|
});
|
|
}
|
|
|
|
}
|
|
}
|