215 lines
11 KiB
TypeScript
215 lines
11 KiB
TypeScript
import {Component, Input,Output, EventEmitter, ViewChild} from '@angular/core';
|
|
import {AlertModal} from '../../../utils/modal/alert';
|
|
import {ClaimResult} from '../../claim-utils/claimEntities.class';
|
|
import {IMyOptions, IMyDateModel} from '../../../utils/my-date-picker/interfaces/index';
|
|
import {Dates} from '../../../utils/string-utils.class';
|
|
|
|
@Component({
|
|
selector: 'claim-selected-results',
|
|
template: `
|
|
|
|
|
|
|
|
<div class="uk-placeholder uk-margin-top" >
|
|
<div *ngIf="results.length == 0 " class="uk-text-center">There are no selected research results</div>
|
|
<div *ngIf="results.length > 0 ">
|
|
<h5 class=" uk-margin uk-h5 uk-text-primary" > {{title}} ({{results.length}}) </h5>
|
|
<table class="uk-table uk-table-responsive">
|
|
<thead *ngIf="showAccessRights">
|
|
<tr>
|
|
<th> Research Result</th>
|
|
<th> Change type and access mode</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr *ngFor="let pub of results" >
|
|
<td >
|
|
<div>
|
|
<span *ngIf="showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
|
|
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
|
|
</span></span>
|
|
<a *ngIf="pub.url" target="_blank" href="{{pub.url}}" > <span class="custom-external"></span> {{pub.title}}</a>
|
|
<span *ngIf="!pub.url" >{{pub.title}}</span>
|
|
<span *ngIf="!showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
|
|
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
|
|
</span></span>
|
|
</div>
|
|
|
|
<span *ngIf="pub.publisher" >Publisher: {{pub.publisher}}</span>
|
|
<!--Orcid --><span *ngIf="pub.result['journal-title'] && pub.result['journal-title'].value " >Journal: {{pub.result['journal-title'].value}}</span>
|
|
<span *ngIf="pub.date" >({{pub.date.substring(0,4)}})</span>
|
|
|
|
<div *ngIf="pub.authors && pub.authors.length > 0" >Authors: <span *ngFor="let author of pub.authors.slice(0,10) let i = index">{{author}}{{(i < (pub.authors.slice(0,10).length-1))?"; ":""}}{{(i == pub.authors.slice(0,10).length-1 && pub.authors.length > 10)?"...":""}}</span></div>
|
|
|
|
<!-- Crossref -->
|
|
<!--span *ngIf="pub.result.publisher" class="uk-article-meta">Publisher: {{pub.result.publisher}}</span><span *ngIf="pub.date" class="uk-article-meta" >({{pub.date.substring(0,4)}})</span>
|
|
<div *ngIf="pub.result.author && pub.result.author.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.author.slice(0,10) let i = index">{{author.family}} {{author.given}}{{(i < (pub.result.author.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.author.slice(0,10).length-1 && pub.result.author.length > 10)?"...":""}}</span></div-->
|
|
<div *ngIf="pub.result.editor && pub.result.editor.length > 0" >Editors: <span *ngFor="let author of pub.result.editor.slice(0,10) let i = index">{{author.family}} {{author.given}}{{(i < (pub.result.editor.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.editor.slice(0,10).length-1 && pub.result.editor.length > 10)?"...":""}}</span></div>
|
|
|
|
<!-- Openaire -->
|
|
<div *ngIf="pub.result.authors && pub.result.authors.length >0 " >Authors: <span *ngFor="let author of pub.result.authors.slice(0,10) let i = index">{{author}}{{(i < (pub.result.authors.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.authors.slice(0,10).length-1 && pub.result.authors.length > 10)?"...":""}}</span></div>
|
|
|
|
<!-- Orcid -->
|
|
|
|
<!--span *ngIf="pub.result['journal-title'] && pub.result['journal-title'].value " class="uk-article-meta">Journal: {{pub.result['journal-title'].value}}</span>
|
|
<div *ngIf="pub.result.contributors && pub.result.contributors.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.contributors.slice(0,10) let i = index">{{author}}{{(i < (pub.result.contributors.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.contributors.slice(0,10).length-1 && pub.result.contributors.length > 10)?"...":""}}</span></div-->
|
|
<!-- Datacite -->
|
|
<!--span *ngIf="pub.result.attributes['container-title']" class="uk-article-meta">Publisher: {{pub.result.attributes['container-title']}}</span><span *ngIf="pub.date" class="uk-article-meta" >({{pub.date.substring(0,4)}})</span>
|
|
<div *ngIf="pub.result.attributes.author && pub.result.attributes.author.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.attributes.author.slice(0,10) let i = index">{{(author.family)?author.family+', '+author.given:author.literal}}{{(i < (pub.result.attributes.author.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.attributes.author.slice(0,10).length-1 && pub.result.attributes.author.length > 10)?"...":""}}</span></div-->
|
|
<div><span class="uk-label label-grey">{{pub.source}}</span>
|
|
<span *ngIf="pub.accessRights" [class]=" 'uk-label label-'+pub.accessRights" > {{pub.accessRights}}</span>
|
|
<span *ngIf="pub.type" [class]="'uk-label label-'+pub.type" > {{pub.type}}</span>
|
|
</div>
|
|
</td>
|
|
<td *ngIf="showAccessRights && pub.source != 'openaire' " >
|
|
|
|
<select [(ngModel)]="pub.type" name="{{'select_type_'+pub.id}}" >
|
|
<option [value]="'publication'" (click)="onTypeChanged('publication',pub)" >Publication</option>
|
|
<option [value]="'dataset'" (click)="onTypeChanged('dataset',pub)" >Research Data</option>
|
|
<option [value]="'software'" (click)="onTypeChanged('software',pub)" >Software</option>
|
|
</select>
|
|
|
|
<select [(ngModel)]="pub.accessRights" name="{{'select_rights_'+pub.id}}" >
|
|
<option *ngFor="let type of accessTypes" [value]="type" (click)="accessRightsTypeChanged(type,pub)">{{type}}</option>
|
|
</select>
|
|
<my-date-picker *ngIf="pub.accessRights== 'EMBARGO'" name="{{'date'+pub.id}}" [options]="myDatePickerOptions"
|
|
[(ngModel)]="nextDate" (dateChanged)="onDateChanged($event,pub)" ></my-date-picker>
|
|
|
|
</td>
|
|
|
|
|
|
|
|
<td *ngIf="showAccessRights && pub.source == 'openaire' " >
|
|
Currently you cannot change metadata from OpenAIRE
|
|
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
|
|
</table>
|
|
<div>
|
|
<modal-alert (alertOutput)="confirmClose($event)">
|
|
</modal-alert>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
`
|
|
|
|
})
|
|
export class ClaimSelectedResultsComponent {
|
|
ngOnInit() {
|
|
var myDate = new Date();
|
|
this.nextDate = { date: { year: myDate.getFullYear()+10, month: (myDate.getMonth()+1), day: myDate.getDate() } };
|
|
//2015-05-01
|
|
|
|
}
|
|
|
|
@Input() results: ClaimResult[];
|
|
@Input() title:string = "Research Results";
|
|
@Input() showAccessRights:boolean = false;
|
|
@Input() bulkMode:boolean = false;
|
|
// @Output()resultsChange = new EventEmitter();
|
|
@Input() showSearch:boolean = false;
|
|
nextDate = {};
|
|
@ViewChild(AlertModal) alertApplyAll;
|
|
|
|
public commonAccessRights = "OPEN"; // for access rights- changes when user apply a change to every result
|
|
public commonEmbargoEndDate; // for access rights: embargoEndDate - changes when user apply a change to every result
|
|
public commonType; // for research result type - changes when user apply a change to every result
|
|
public typeChanged:boolean = true; //
|
|
accessTypes = ["OPEN","CLOSED","EMBARGO","RESTRICTED"];
|
|
private myDatePickerOptions: IMyOptions = {
|
|
// other options...
|
|
dateFormat: 'yyyy-mm-dd',
|
|
selectionTxtFontSize: '15px',
|
|
height:'28px',
|
|
width: '100%',
|
|
editableDateField: false,
|
|
showClearDateBtn: false
|
|
};
|
|
|
|
|
|
removePublication(item:any){
|
|
var index:number =this.results.indexOf(item);
|
|
if (index > -1) {
|
|
this.results.splice(index, 1);
|
|
}
|
|
// this.resultsChange.emit({
|
|
// value: this.results
|
|
// });
|
|
}
|
|
|
|
|
|
onDateChanged (event:any, item:any) {
|
|
item.embargoEndDate = Dates.getDateFromString(event.formatted);
|
|
if(this.results.length > 1 ){
|
|
this.commonAccessRights = "EMBARGO";
|
|
this.commonEmbargoEndDate = item.embargoEndDate;
|
|
this.confirmOpen(false,"Do you wish to apply the change to every result?");
|
|
}
|
|
|
|
}
|
|
onTypeChanged (event:any, item:any) {
|
|
item.type =(event);
|
|
if(this.results.length > 1 ){
|
|
this.commonType = item.type;
|
|
this.confirmOpen(true, "Do you wish to apply the change to every result?");
|
|
}
|
|
|
|
}
|
|
// resultsChanged($event) {
|
|
// this.results=$event.value;
|
|
// this.resultsChange.emit({
|
|
// value: this.results
|
|
// });
|
|
// }
|
|
/* The following methods:
|
|
*typeChanged
|
|
*confirmOpen
|
|
*confirmClose
|
|
implement the functionality: change accessRights of a publication - apply to all if asked */
|
|
accessRightsTypeChanged (type:any, item:any) {
|
|
item.accessRights = type;
|
|
if(this.results.length > 1 ){
|
|
this.commonAccessRights = type;
|
|
if(this.commonAccessRights != "EMBARGO"){
|
|
this.commonEmbargoEndDate = item.embargoEndDate;
|
|
this.confirmOpen(false, "Do you wish to apply the change to every result?");
|
|
}
|
|
}
|
|
|
|
}
|
|
confirmOpen(type: boolean, message: string){
|
|
this.typeChanged = type;
|
|
this.alertApplyAll.cancelButton = true;
|
|
this.alertApplyAll.okButton = true;
|
|
this.alertApplyAll.alertTitle = "Change metadata";
|
|
this.alertApplyAll.message = "Do you wish to apply the change to every result?";
|
|
this.alertApplyAll.okButtonText = "Yes";
|
|
this.alertApplyAll.cancelButtonText = "No";
|
|
this.alertApplyAll.open();
|
|
}
|
|
confirmClose(data){
|
|
if(this.typeChanged){
|
|
|
|
for (var i = 0; i < this.results.length; i++) {
|
|
if(this.results[i].source != 'openaire' ){
|
|
this.results[i].type = this.commonType;
|
|
}
|
|
}
|
|
|
|
}else{
|
|
for (var i = 0; i < this.results.length; i++) {
|
|
if(this.results[i].source != 'openaire' ){
|
|
this.results[i].accessRights = this.commonAccessRights;
|
|
if(this.commonAccessRights == "EMBARGO"){
|
|
this.results[i].embargoEndDate = this.commonEmbargoEndDate;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|