MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[Library | Trunk] 

Claims: update UI for display claims component

Dashboard - connect: update notification settings component




git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60403 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
argiro.kokogiannaki 2021-02-10 10:24:52 +00:00
parent b3e5a0a947
commit 82be5a6e52
11 changed files with 313 additions and 596 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

287
claims/claim-utils/displayClaims/displayClaims.component.html
View File

@ -3,225 +3,132 @@
</div> </div>
<div class="uk-grid helper-grid"> <div class="uk-grid helper-grid">
<!-- <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>--> <div class="uk-width-expand ">
<div class="uk-width-expand uk-margin-top uk-card uk-card-default uk-padding-small"> <div
class="uk-card-body uk-padding-remove-bottom uk-padding-remove-top " [class.portal-hr]="
!pageLoading && claims && claims.length > 0">
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0" <helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
[texts]="pageContents['top']"></helper> [texts]="pageContents['top']"></helper>
<form class=""> <form class="">
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div class=" "> <div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search links"
<span class="uk-text-muted">Filter by</span> [bordered]="true" colorClass="uk-text-secondary"></div>
</div> </div>
<div class="uk-margin-small-top "> <div class=" uk-grid uk-flex-middle">
<label class="uk-margin-small-right"> <input [(ngModel)]="projectCB" type="checkbox" <div class="">Filter by: </div>
[disabled]="pageLoading" <div class="uk-width-medium uk-padding-remove uk-margin-small-left" dashboard-input
(ngModelChange)="changeType()" name="project"/> [formInput]="filterForm.get('entities')"
placeholder="Search by entities"
Projects </label> type="chips" [options]="allOptions" chipLabel="label">
<label class="uk-margin-small-right"> <input [(ngModel)]="publicationCB" type="checkbox" </div>
[disabled]="pageLoading" <div class="">Sort by: </div>
(ngModelChange)="changeType()" name="publication"/> <div class="uk-width-medium uk-padding-remove uk-margin-small-left" dashboard-input
Publications </label> [formInput]="filterForm.get('sort')"
<label class="uk-margin-small-right"> <input [(ngModel)]="datasetCB" type="checkbox" type="select"
[disabled]="pageLoading" [options]="sortOptions">
(ngModelChange)="changeType()" name="dataset"/>
Research Data </label>
<label class="uk-margin-small-right"> <input [(ngModel)]="softwareCB" type="checkbox"
[disabled]="pageLoading"
(ngModelChange)="changeType()" name="software"/>
Software
</label>
<label class="uk-margin-small-right"> <input [(ngModel)]="otherCB" type="checkbox"
[disabled]="pageLoading"
(ngModelChange)="changeType()" name="other"/>
Other products
</label>
<label class="uk-margin-small-right"> <input [(ngModel)]="contextCB" type="checkbox"
[disabled]="pageLoading"
(ngModelChange)="changeType()" name="context"/>
Communities </label>
<div class="uk-inline">
<span class="uk-form-icon uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle
fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000"
stroke-width="1.1"
d="M14,14 L18,18 L14,14 Z"></path></svg>
</span>
<input type="text" class=" uk-input uk-width-medium form-control" placeholder="Search links"
aria-describedby="sizing-addon2"
[(ngModel)]="inputkeyword" (keyup)="changekeyword()"
name="claims-keyword">
<span *ngIf="inputkeyword.length > 0" class="uk-margin-small-right uk-icon" style="cursor: pointer;"
(click)="inputkeyword=''; changekeyword();">
<svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" data-svg="close"><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>
</div> </div>
</div> </div>
</form> </form>
<div *ngIf="resultsNum>0 && selected.length == 0" <div *ngIf="!(pageLoading || showErrorMessage || showForbiddenMessage || userValidMessage.length > 0 || (claims &&
class="searchPaging uk-panel uk-margin-top portal-hr uk-margin-small-bottom" claims.length
==0))"
class="searchPaging uk-panel uk-margin-top "
data-uk-grid-margin=""> data-uk-grid-margin="">
<!-- <div *ngIf="resultsNum>10" class="uk-width-1-2 uk-margin-top uk-margin-bottom">-->
<!-- <span> Results per page-->
<!-- <mat-select class="uk-width-1-5 matSelection" [(ngModel)]="size" name="select_size"-->
<!-- (ngModelChange)="changeSize()" [disabled]="pageLoading"-->
<!-- [disableOptionCentering]="true"-->
<!-- panelClass="matSelectionPanel">-->
<!-- <mat-option *ngFor="let size of sizes" [value]="size">{{size}}</mat-option>-->
<!-- </mat-select>-->
<!-- </span>-->
<!-- </div>-->
<div *ngIf="resultsNum>10" class="uk-margin-top uk-margin-bottom"> <div class="uk-grid uk-flex-middle">
<mat-form-field class="matSelectionFormField"> <div class="uk-width-1-2">
<mat-label>Results per page:</mat-label> <div *ngIf="enableDelete && claims && claims.length > 0">
<mat-select name="select_size" <span class="uk-margin-small-top">
[(ngModel)]="size" (ngModelChange)="changeSize()" <input id="checkAll" type="checkbox" (click)="selectAll($event)"
[disabled]="pageLoading" [ngModel]="selected.length==claims.length"/>
[disableOptionCentering]="true" </span>
panelClass="matSelectionPanel" <a [class]=" ' grey-portal-link uk-margin-medium-left '+(selected.length > 0?'':'uk-disabled')"
class="uk-text-bold matSelection"> (click)="confirmOpen()">
<mat-option *ngFor="let size of sizes" [value]="size">{{size}}</mat-option> <span class="uk-icon "><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
</mat-select> icon="trash" ratio="1"><polyline fill="none" stroke="#000"
</mat-form-field> points="6.5 3 6.5 1.5 13.5 1.5 13.5 3"></polyline><polyline
</div> fill="none" stroke="#000" points="4.5 4 4.5 18.5 15.5 18.5 15.5 4"></polyline><rect x="8" y="7"
width="1"
height="9"></rect><rect
x="11" y="7" width="1" height="9"></rect><rect x="2" y="3" width="16" height="1"></rect></svg></span>
Delete <span
*ngIf="selected.length > 0 && selected.length < resultsNum">{{selected.length | number}}</span><span
*ngIf="selected.length == resultsNum"> all </span> links
<div class="uk-grid"> </a>
<div *ngIf="resultsNum>0" class="uk-width-1-2">
</div>
</div>
<div *ngIf="resultsNum" class="uk-width-1-2 uk-grid uk-flex-right uk-flex-middle ">
<div>
<span class="portal-color">{{resultsNum|number}}</span> links, page <span <span class="portal-color">{{resultsNum|number}}</span> links, page <span
class="portal-color">{{page | number}}</span> of <span class="portal-color">{{page | number}}</span> of <span
class="portal-color">{{totalPages(resultsNum)|number}}</span> class="portal-color">{{totalPages(resultsNum)|number}}</span>
</div>
</div>
<div *ngIf="resultsNum" class="uk-width-1-2 ">
<paging-no-load [currentPage]="page" [totalResults]="resultsNum" [size]="size" <paging-no-load [currentPage]="page" [totalResults]="resultsNum" [size]="size"
[loading]="pageLoading" [loading]="pageLoading"
(pageChange)="pageChange($event)" class="uk-float-right"></paging-no-load> (pageChange)="pageChange($event)" class="uk-float-right"></paging-no-load>
</div> </div>
</div> </div>
</div>
<!-- Buttons for selecting and Delete Claims -->
<div *ngIf="enableDelete && selected.length>0 && resultsNum > 0 " </div>
class="uk-margin-top portal-hr uk-margin-small-bottom uk-grid uk-margin-small-left">
<div class=" uk-width-1-2 uk-padding-remove-left">
{{selected.length | number}} link{{(selected.length > 1) ? 's' : ''}} selected
</div>
<div class=" uk-width-1-2">
<a [class]=" 'uk-text-danger uk-float-right '+(selected.length > 0?'':'uk-disabled')" (click)="confirmOpen()">
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
icon="trash" ratio="1"><polyline fill="none" stroke="#000"
points="6.5 3 6.5 1.5 13.5 1.5 13.5 3"></polyline><polyline
fill="none" stroke="#000" points="4.5 4 4.5 18.5 15.5 18.5 15.5 4"></polyline><rect x="8" y="7"
width="1"
height="9"></rect><rect
x="11" y="7" width="1" height="9"></rect><rect x="2" y="3" width="16" height="1"></rect></svg></span>
delete links
</a>
</div>
</div> </div>
<div *ngIf="deleteMessage.length>0 " [innerHTML]="deleteMessage"> <loading *ngIf="pageLoading" class="uk-padding"></loading>
<div *ngIf="!pageLoading" >
<!--button *ngIf="claims && claims.length > 0" class=" uk-button uk-button-default" (click)="confirmOpen()"> <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="trash" ratio="1"><polyline fill="none" stroke="#000" points="6.5 3 6.5 1.5 13.5 1.5 13.5 3"></polyline><polyline fill="none" stroke="#000" points="4.5 4 4.5 18.5 15.5 18.5 15.5 4"></polyline><rect x="8" y="7" width="1" height="9"></rect><rect x="11" y="7" width="1" height="9"></rect><rect x="2" y="3" width="16" height="1"></rect></svg></span> Delete</button-->
</div>
<div *ngIf="showErrorMessage " class="uk-alert uk-alert-danger "> <div *ngIf="showErrorMessage " class="uk-alert uk-alert-danger ">
An Error occured. An Error occured.
</div> </div>
<div *ngIf="showForbiddenMessage " class="uk-alert uk-alert-danger "> <div *ngIf="showForbiddenMessage " class="uk-alert uk-alert-danger ">
You are not authorized to view the results. You are not authorized to view the results.
</div> </div>
<div *ngIf="userValidMessage.length > 0 " class="uk-alert uk-alert-danger "> <div *ngIf=" userValidMessage.length > 0 " class="uk-alert uk-alert-danger ">
User session is not valid. Please login again. User session is not valid. Please login again.
</div> </div>
<div *ngIf="claims && claims.length == 0" class="uk-margin-top"> <div *ngIf=" claims && claims.length == 0" class="uk-margin-top">
<div class="uk-alert uk-alert-primary ">No entries found.</div> <div class="uk-alert uk-alert-primary ">No entries found.</div>
</div> </div>
<div class=""> <div class="">
<table *ngIf="claims && claims.length > 0" class="uk-table uk-table-small uk-table-striped dataTable">
<thead class="uk-text-capitalize">
<tr>
<th *ngIf="enableDelete" class="uk-padding-remove-right" title="Select all">
<input id="checkAll" type="checkbox" (click)="selectAll($event)"
[ngModel]="selected.length==claims.length"/>
</th>
<th [class]="'uk-width-1-3 '+(sortby != 'target'?'sorting':(descending?'sorting_desc':'sorting_asc'))"
(click)="changeOrderby('target')"> Source
</th>
<th [class]="'uk-width-1-3 '+(sortby != 'source'?'sorting':(descending?'sorting_desc':'sorting_asc'))" <div *ngFor="let claim of claims "
(click)="changeOrderby('source')"> class="uk-card uk-card-default uk-card-body uk-margin-bottom ng-star-inserted">
Link to <div class="uk-grid">
</th> <div *ngIf="enableDelete">
<th *ngIf=" showUserEmail <input [id]="claim.id" type="checkbox" (click)="select(claim,$event)"
" [class]="sortby != 'user'?'sorting':(descending?'sorting_desc':'sorting_asc')" [ngModel]="isSelected(claim.id)"/>
(click)="changeOrderby('user')"> </div>
Claimed by <div class="uk-width-expand">
</th> <div class="uk-margin-bottom">
<th [class]="sortby != 'date'?'sorting':(descending?'sorting_desc':'sorting_asc')" <claim-entity [entity]="claim.target" [type]="claim.targetType" [properties]=properties
(click)="changeOrderby('date')"> [externalPortalUrl]=externalPortalUrl [source]="true"></claim-entity>
Claim Date </div>
</th> <div class="uk-margin-small-bottom">
<th>Status <span *ngIf="isClaimAvailable(claim) else notAvailable" class="uk-label uk-label-success">available</span>
<span class="uk-icon" <ng-template #notAvailable><span class="uk-label uk-label-danger">pending</span></ng-template>
[attr.uk-tooltip]="'title:<div class=\'uk-margin uk-padding-small\'>Status declares if the link information is available in the portal and the APIs<br> If it is pending, the information will be added in the next content provision workflow.</div>'"> </div>
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="info" ratio="1"><path
d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle <div class="uk-margin-small-bottom"><span *ngIf="showUserEmail" class="uk-margin-right"><span class="title">Claimed by:</span>
fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg> {{claim.userMail}}</span>
</span> <span
</th> class="title">Claimed date:</span> {{claim.date}}</div>
</tr> <div class="uk-margin-small-bottom uk-margin-top">
</thead> <!-- <span class="title">Link to:</span> -->
<tbody> <claim-entity [entity]="claim.source" [type]="claim.sourceType" [source]="false" [properties]=properties
<tr *ngFor="let claim of claims ">
<td *ngIf="enableDelete"><input [id]="claim.id" type="checkbox" (click)="select(claim,$event)"
[ngModel]="isSelected(claim.id)"/></td>
<!-- <td></td>-->
<td>
<claim-entity [entity]="claim.target" [type]="claim.targetType" [properties]=properties
[externalPortalUrl]=externalPortalUrl></claim-entity> [externalPortalUrl]=externalPortalUrl></claim-entity>
</td> </div>
<td> </div>
<claim-entity [entity]="claim.source" [type]="claim.sourceType" [properties]=properties </div>
[externalPortalUrl]=externalPortalUrl></claim-entity>
</td> </div>
<td *ngIf="showUserEmail">{{claim.userMail}}</td>
<td>{{claim.date}}</td>
<td>
<span *ngIf="isClaimAvailable(claim) else notAvailable" class="uk-label uk-label-success">available</span>
<ng-template #notAvailable><span class="uk-label uk-label-warning">pending</span></ng-template>
<!-- <span class="uk-icon"-->
<!-- [attr.uk-tooltip]="'title:<div class=\'uk-margin-small\'>'+isClaimAvailable(claim)+'</div>'">-->
<!-- <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="question"-->
<!-- ratio="1">-->
<!-- <circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle><circle cx="10.44"-->
<!-- cy="14.42"-->
<!-- r="1.05"></circle><path-->
<!-- fill="none" stroke="#000" stroke-width="1.2"-->
<!-- d="M8.17,7.79 C8.17,4.75 12.72,4.73 12.72,7.72 C12.72,8.67 11.81,9.15 11.23,9.75 C10.75,10.24 10.51,10.73 10.45,11.4 C10.44,11.53 10.43,11.64 10.43,11.75"></path></svg>-->
<!-- </span>-->
</td>
</tr>
</tbody>
</table>
</div> </div>
<div class="portal-hr uk-margin-top"> <div *ngIf="!( showErrorMessage || showForbiddenMessage || userValidMessage.length > 0 || (claims
&& claims.length
==0))" class="portal-hr uk-margin-top">
<div class="uk-grid "> <div class="uk-grid ">
<div *ngIf="resultsNum>0" class="uk-width-1-2"> <div *ngIf="resultsNum>0" class="uk-width-1-2">
<span class="portal-color">{{resultsNum|number}}</span> links, page <span <span class="portal-color">{{resultsNum|number}}</span> links, page <span
@ -235,25 +142,11 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
<helper *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0" <helper *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0"
[texts]="pageContents['right']" class="uk-width-1-5"></helper> [texts]="pageContents['right']" class="uk-width-1-5"></helper>
<!-- <div class="uk-width-1-5">
<div class="uk-card portal-card uk-padding" *ngIf="externalPortalUrl || claimsInfoURL">
<h6 *ngIf="!externalPortalUrl || externalPortalUrl.indexOf('http')==-1" class="uk-h6">
<a class="el-content uk-link-text" routerLink="/participate/claim">Claim more links?</a>
</h6>
<h6 *ngIf="externalPortalUrl && externalPortalUrl.indexOf('http')!=-1" class="uk-h6">
<a class="el-content uk-link-text" [href]="externalPortalUrl+'/participate/claim'"
target="_blank">Claim more links?</a>
</h6>
<h6 *ngIf="claimsInfoURL" class="uk-h6 uk-margin-small-top">
<a class="el-content uk-link-text" [href]="claimsInfoURL" target="_blank">Learn more</a>
</h6>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>-->
</div> </div>
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
[texts]="pageContents['bottom']"></helper> [texts]="pageContents['bottom']"></helper>

373
claims/claim-utils/displayClaims/displayClaims.component.ts
View File

@ -10,15 +10,17 @@ import {Session, User} from '../../../login/utils/helper.class';
import {EnvProperties} from '../../../utils/properties/env-properties'; import {EnvProperties} from '../../../utils/properties/env-properties';
import {LoginErrorCodes} from '../../../login/utils/guardHelper.class'; import {LoginErrorCodes} from '../../../login/utils/guardHelper.class';
import {SEOService} from '../../../sharedComponents/SEO/SEO.service'; import {SEOService} from '../../../sharedComponents/SEO/SEO.service';
import {IndexInfoService} from "../../../utils/indexInfo.service"; import {IndexInfoService} from '../../../utils/indexInfo.service';
import {ClaimDBRecord} from "../claimHelper.class"; import {ClaimDBRecord} from '../claimHelper.class';
import {Dates} from "../../../utils/string-utils.class"; import {Dates} from '../../../utils/string-utils.class';
import {HelperService} from "../../../utils/helper/helper.service"; import {HelperService} from '../../../utils/helper/helper.service';
import {Meta, Title} from "@angular/platform-browser"; import {Meta, Title} from '@angular/platform-browser';
import {PiwikService} from "../../../utils/piwik/piwik.service"; import {PiwikService} from '../../../utils/piwik/piwik.service';
import {properties} from "../../../../../environments/environment"; import {properties} from '../../../../../environments/environment';
import {FormArray, FormBuilder, FormGroup} from '@angular/forms';
import {Option} from '../../../sharedComponents/input/input.component';
declare var UIkit;
@Component({ @Component({
selector: 'displayClaims', selector: 'displayClaims',
templateUrl: 'displayClaims.component.html', templateUrl: 'displayClaims.component.html',
@ -37,7 +39,8 @@ export class DisplayClaimsComponent {
@Input() myClaims: boolean = false; @Input() myClaims: boolean = false;
@Input() isAdmin: boolean = false; @Input() isAdmin: boolean = false;
page: number = 1; page: number = 1;
size: number = 10; size: number = 50;
defaultSize:number = 50;
sizes = [10, 20, 30, 50]; sizes = [10, 20, 30, 50];
keyword: string; // the keyword string to give to the request as parameter keyword: string; // the keyword string to give to the request as parameter
inputkeyword: string; // the string written in the input field (keyword=inputkeyword when its length is bigger than 3 and the user stops typing) inputkeyword: string; // the string written in the input field (keyword=inputkeyword when its length is bigger than 3 and the user stops typing)
@ -53,21 +56,26 @@ export class DisplayClaimsComponent {
lastIndexDate = null; lastIndexDate = null;
@ViewChild(ModalLoading) loading: ModalLoading; @ViewChild(ModalLoading) loading: ModalLoading;
public filterForm: FormGroup;
public entitiesCtrl: FormArray;
allOptions: Option[] = [{label: "Projects", value: {id:"project", label: "Projects"}},{label: "Publications", value:{id:"publication", label: "Publications"}},{label: "Research data", value: {id:"dataset", label: "Research data"}},
{label: "Software", value: {id:"software", label: "Software"}},{label: "Other reserch products", value: {id:"other", label: "Other reserch products"}},{label: "Communities", value: {id:"community", label: "Communities"}}];
sortOptions: Option[] = [
{label:"Date (recent) ", value:{ sort: "date", descending: true }}, {label:"Date (oldest) ", value:{ sort: "date",descending:false }},
// {label:"User (desc) ", value:{ sort: "user",descending: true }}, {label:"User (asc) ", value:{ sort: "user",descending:false }},
// {label:"Title (desc) ", value:{ sort: "source",descending: true }}, {label:"Title (asc) ", value:{ sort: "source",descending:false }},
{label:"Title (desc) ", value:{ sort: "target",descending: true }}, {label:"Title (asc) ", value: { sort: "target",descending:false }},
];
//checkboxes:
publicationCB = false;
datasetCB = false;
softwareCB = false;
otherCB = false;
contextCB = false;
projectCB = false;
entityTypes: string[] = []; entityTypes: string[] = [];
descending = true; // descending = true;
sortby = "date"; // sortby = "date";
selected = []; selected = [];
deleteMessage: string = ""; // deleteMessage: string = "";
showErrorMessage: boolean = false; showErrorMessage: boolean = false;
showForbiddenMessage: boolean = false; showForbiddenMessage: boolean = false;
userValidMessage: string = ""; userValidMessage: string = "";
@ -84,65 +92,79 @@ export class DisplayClaimsComponent {
constructor(private _claimService: ClaimsService, private route: ActivatedRoute, private _router: Router, private location: Location, constructor(private _claimService: ClaimsService, private route: ActivatedRoute, private _router: Router, private location: Location,
private _meta: Meta, private _title: Title, private _piwikService: PiwikService, private _meta: Meta, private _title: Title, private _piwikService: PiwikService,
private seoService: SEOService, private indexInfoService: IndexInfoService, private helper: HelperService) { private seoService: SEOService, private indexInfoService: IndexInfoService, private helper: HelperService, private _fb: FormBuilder) {
} }
ngOnInit() { ngOnInit() {
this.entitiesCtrl = this._fb.array([]);
this.filterForm = this._fb.group({
keyword: [''],
entities: this.entitiesCtrl,
sort: this._fb.control(this.sortOptions[0].value)
});
this.properties = properties; this.properties = properties;
this.url = properties.domain + properties.baseLink + this._router.url; this.url = properties.domain + properties.baseLink + this._router.url;
if(!this.myClaims){
this.sortOptions.push({label:"User (desc) ", value:{ sort: "user",descending: true }});
this.sortOptions.push( {label:"User (asc) ", value:{ sort: "user",descending:false }})
}
var description = "Openaire, linking, claim, publication, research data, software, other research product, project, community";
this.updateTitle(this.title);
this.updateDescription(description);
this.updateUrl(this.url);
if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) {
this.subscriptions.push(this._piwikService.trackView(this.properties, this.title, this.piwikSiteId).subscribe());
}
var description = "Openaire, linking, claim, publication, research data, software, other research product, project, community"; this.subscriptions.push(this.helper.getPageHelpContents(this.properties, this.communityId, this._router.url).subscribe(contents => {
this.updateTitle(this.title); this.pageContents = contents;
this.updateDescription(description); }));
this.updateUrl(this.url); this.subscriptions.push(this.indexInfoService.getLastIndexDate(this.properties).subscribe(res => {
if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) { this.lastIndexDate = res;
this.subscriptions.push(this._piwikService.trackView(this.properties, this.title, this.piwikSiteId).subscribe()); }));
} this.subscriptions.push(this.route.queryParams.subscribe(params => {
this.seoService.createLinkForCanonicalURL(this.url, false);
this.subscriptions.push(this.helper.getPageHelpContents(this.properties, this.communityId, this._router.url).subscribe(contents => { if (this.myClaims) {
this.pageContents = contents; this.fetchBy = "User";
this.fetchId = this.user.email;
} else {
this.fetchBy = (this.fetchBy) ? this.fetchBy : params['fetchBy'];
this.fetchBy = (this.types.indexOf(this.fetchBy) != -1) ? this.fetchBy : 'All';
this.fetchId = (this.fetchId) ? this.fetchId : params['fetchId'];
this.fetchId = this.fetchId ? this.fetchId : '';
}
let page = (params['page'] === undefined) ? 1 : +params['page'];
let size = (params['size'] === undefined) ? this.defaultSize : +params['size'];
this.keyword = (params['keyword'] ? params['keyword'] : "");
this.inputkeyword = this.keyword;
this.page = (page <= 0) ? 1 : page;
this.size = (size <= 0) ? this.defaultSize : size;
this.entityTypes = [];//(params['types']?params['types']:[]);
// this.setTypes(params['types']); // check the appropriate checkboxes
this.setSortby(params['sort']);
this.getClaims();
this.subscriptions.push(this.searchTermStream
.pipe(debounceTime(300), distinctUntilChanged())
.subscribe((term: string) => {
this.keyword = term;
this.page = 1;
this.goTo();
})); }));
this.subscriptions.push(this.indexInfoService.getLastIndexDate(this.properties).subscribe(res => { this.subscriptions.push(this.filterForm.get('entities').valueChanges.subscribe(value => {
this.lastIndexDate = res; this.goTo();
})); }));
this.subscriptions.push(this.route.queryParams.subscribe(params => { this.subscriptions.push(this.filterForm.get('keyword').valueChanges.subscribe(value => {
this.seoService.createLinkForCanonicalURL(this.url, false); this.changekeyword();
}));
if (this.myClaims) { this.subscriptions.push(this.filterForm.get('sort').valueChanges.subscribe(value => {
this.fetchBy = "User"; console.log(value);
this.fetchId = this.user.email; this.goTo();
} else { }));
}));
this.fetchBy = (this.fetchBy) ? this.fetchBy : params['fetchBy'];
this.fetchBy = (this.types.indexOf(this.fetchBy) != -1) ? this.fetchBy : 'All';
this.fetchId = (this.fetchId) ? this.fetchId : params['fetchId'];
this.fetchId = this.fetchId ? this.fetchId : '';
}
let page = (params['page'] === undefined) ? 1 : +params['page'];
let size = (params['size'] === undefined) ? 10 : +params['size'];
this.keyword = (params['keyword'] ? params['keyword'] : "");
this.inputkeyword = this.keyword;
this.page = (page <= 0) ? 1 : page;
this.size = (size <= 0) ? 10 : size;
this.entityTypes = [];//(params['types']?params['types']:[]);
this.setTypes(params['types']); // check the appropriate checkboxes
this.setSortby(params['sort']);
this.getClaims();
this.subscriptions.push(this.searchTermStream
.pipe(debounceTime(300), distinctUntilChanged())
.subscribe((term: string) => {
this.keyword = term;
this.page = 1;
this.goTo();
}));
}));
} }
ngOnDestroy() { ngOnDestroy() {
@ -167,12 +189,13 @@ export class DisplayClaimsComponent {
let types = ''; let types = '';
this.showErrorMessage = false; this.showErrorMessage = false;
this.showForbiddenMessage = false; this.showForbiddenMessage = false;
for (let type of this.entityTypes) { for (let type of this.entitiesCtrl.getRawValue()) {
types += (types.length > 0 ? '&' : '') + "types=" + type; types += (this.entitiesCtrl.getRawValue().length > 0 ? '&' : '') + "types=" + type.id;
} }
console.log( this.fetchBy, this.fetchId)
this.pageLoading = true; this.pageLoading = true;
if (this.fetchBy == "Project") { if (this.fetchBy == "Project") {
this.subscriptions.push(this._claimService.getClaimsByProject(this.size, this.page, this.fetchId, this.keyword, this.sortby, this.descending, types, this.properties.claimsAPIURL).subscribe( this.subscriptions.push(this._claimService.getClaimsByProject(this.size, this.page, this.fetchId, this.keyword, this.filterForm.get("sort").value.sort, this.filterForm.get("sort").value.descending, types, this.properties.claimsAPIURL).subscribe(
data => { data => {
this.manageAPIData(data); this.manageAPIData(data);
this.pageLoading = false; this.pageLoading = false;
@ -182,7 +205,7 @@ export class DisplayClaimsComponent {
} }
)); ));
} else if (this.fetchBy == "User") { } else if (this.fetchBy == "User") {
this.subscriptions.push(this._claimService.getClaimsByUser(this.size, this.page, this.fetchId, this.keyword, this.sortby, this.descending, types, this.properties.claimsAPIURL).subscribe( this.subscriptions.push(this._claimService.getClaimsByUser(this.size, this.page, this.fetchId, this.keyword, this.filterForm.get("sort").value.sort, this.filterForm.get("sort").value.descending, types, this.properties.claimsAPIURL).subscribe(
data => { data => {
this.manageAPIData(data); this.manageAPIData(data);
this.pageLoading = false; this.pageLoading = false;
@ -193,7 +216,7 @@ export class DisplayClaimsComponent {
} }
)); ));
} else if (this.fetchBy == "Result") { } else if (this.fetchBy == "Result") {
this.subscriptions.push(this._claimService.getClaimsByResult(this.size, this.page, this.fetchId, this.keyword, this.sortby, this.descending, types, this.properties.claimsAPIURL).subscribe( this.subscriptions.push(this._claimService.getClaimsByResult(this.size, this.page, this.fetchId, this.keyword, this.filterForm.get("sort").value.sort, this.filterForm.get("sort").value.descending, types, this.properties.claimsAPIURL).subscribe(
data => { data => {
this.manageAPIData(data); this.manageAPIData(data);
this.pageLoading = false; this.pageLoading = false;
@ -204,7 +227,7 @@ export class DisplayClaimsComponent {
} }
)); ));
} else if (this.fetchBy == "Context") { } else if (this.fetchBy == "Context") {
this.subscriptions.push(this._claimService.getClaimsBycontext(this.size, this.page, this.fetchId, this.keyword, this.sortby, this.descending, types, this.properties.claimsAPIURL).subscribe( this.subscriptions.push(this._claimService.getClaimsBycontext(this.size, this.page, this.fetchId, this.keyword, this.filterForm.get("sort").value.sort, this.filterForm.get("sort").value.descending, types, this.properties.claimsAPIURL).subscribe(
data => { data => {
this.manageAPIData(data); this.manageAPIData(data);
this.pageLoading = false; this.pageLoading = false;
@ -215,7 +238,7 @@ export class DisplayClaimsComponent {
} }
)); ));
} else { } else {
this.subscriptions.push(this._claimService.getClaims(this.size, this.page, this.keyword, this.sortby, this.descending, types, this.properties.claimsAPIURL).subscribe( this.subscriptions.push(this._claimService.getClaims(this.size, this.page, this.keyword, this.filterForm.get("sort").value.sort, this.filterForm.get("sort").value.descending, types, this.properties.claimsAPIURL).subscribe(
data => { data => {
this.manageAPIData(data); this.manageAPIData(data);
this.pageLoading = false; this.pageLoading = false;
@ -230,21 +253,6 @@ export class DisplayClaimsComponent {
} }
manageAPIData(data) { manageAPIData(data) {
// let d = new Date();
// let dateTomillis = d.getTime();
// let millis24h: number = 24 * 3600000;
// if(this.showLatestClaims && this.recentClaims.length == 0){
// this.recentClaims = [];
// for(var i=0;i<data.data.length;i++){
// var claimDate = new Date(data.data[i].date);
// var claimDateToMillis = claimDate.getTime()
// // console.log("Claim Date is:"+claimDateToMillis + " "+(dateTomillis - claimDateToMillis));
// if((dateTomillis - claimDateToMillis)<millis24h){
// // console.log("Claim in:"+ " "+(dateTomillis - claimDateToMillis)+" < " +(millis24h));
// this.recentClaims.push(data.data[i]);
// }
// }
// }
this.claims = data.data; this.claims = data.data;
this.resultsNum = data.total; this.resultsNum = data.total;
@ -277,59 +285,26 @@ export class DisplayClaimsComponent {
} }
// private static handleError(message: string, error) {
// console.error("Dispaly Claims (component): " + message, error);
// }
goTo(page: number = 1) { goTo(page: number = 1) {
this.page = page; this.page = page;
this.location.go(location.pathname, this.getParametersString()); this.location.go(location.pathname, this.getParametersString());
this.getClaims(); this.getClaims();
} }
/*
getParameters() {
var params = {}
if (this.myClaims) {
params = {
page: this.page,
size: this.size,
types: this.entityTypes,
keyword: this.keyword,
sort: this.getSortby()
};
} else {
params = {
page: this.page,
size: this.size,
types: this.entityTypes,
fetchBy: this.fetchBy,
fetchId: this.fetchId,
keyword: this.keyword,
sort: this.getSortby()
};
}
return params;
}*/
getParametersString() { getParametersString() {
let params = ''; let params = '';
params += (this.page == 1 ? "" : (params.length > 0 ? '&' : '') + "page=" + this.page); params += (this.page == 1 ? "" : (params.length > 0 ? '&' : '') + "page=" + this.page);
params += (this.size == 10 ? "" : (params.length > 0 ? '&' : '') + "size=" + this.size); params += (this.size == 10 ? "" : (params.length > 0 ? '&' : '') + "size=" + this.size);
// params+=(this.validEntityTypes==''?"":(params.length>0?'&':'')+"types="+this.validEntityTypes);
let types = ""; let types = "";
for (let type of this.entityTypes) { for (let type of this.entitiesCtrl.getRawValue()) {
types += (types.length > 0 ? ',' : '') + type; types += (this.entitiesCtrl.getRawValue().length > 0 ? ',' : '') + type.id;
} }
params += (types.length > 0) ? (params.length > 0 ? '&' : '') + "types=" + types : ""; params += (this.entitiesCtrl.getRawValue().length > 0) ? (params.length > 0 ? '&' : '') + "types=" + types : "";
if (this.isAdmin) { if (this.isAdmin) {
params += (this.fetchBy == 'All' ? "" : (params.length > 0 ? '&' : '') + "fetchBy=" + this.fetchBy); params += (this.fetchBy == 'All' ? "" : (params.length > 0 ? '&' : '') + "fetchBy=" + this.fetchBy);
params += (this.fetchId == '' ? "" : (params.length > 0 ? '&' : '') + "fetchId=" + this.fetchId); params += (this.fetchId == '' ? "" : (params.length > 0 ? '&' : '') + "fetchId=" + this.fetchId);
} }
params += (this.getSortby() == 'datedesc' ? "" : (params.length > 0 ? '&' : '') + "sort=" + this.getSortby()); params += (this.filterForm.get("sort").value.sort == 'date' && this.filterForm.get("sort").value.descending ? "" : (params.length > 0 ? '&' : '') + "sort=" +this.filterForm.get("sort").value.sort + "-" + this.filterForm.get("sort").value.descending);
params += (this.keyword == '' ? "" : (params.length > 0 ? '&' : '') + "keyword=" + this.keyword); params += (this.keyword == '' ? "" : (params.length > 0 ? '&' : '') + "keyword=" + this.keyword);
if (this.communityId != null) { if (this.communityId != null) {
params += "&communityId=" + this.communityId; params += "&communityId=" + this.communityId;
@ -337,130 +312,26 @@ export class DisplayClaimsComponent {
return params; return params;
} }
changeSize() {
this.goTo();
}
changeOrderby(sortby: string) {
if (sortby == this.sortby) {
this.descending = !this.descending;
} else {
this.sortby = sortby;
this.descending = false;
}
this.goTo();
}
setSortby(sortby: string) { setSortby(sortby: string) {
if (!sortby || sortby == "datedesc") { let sort = "date";
this.descending = true; let desc = "desc";
this.sortby = "date"; if(sortby && sortby.split("-").length == 2){
} else if (sortby == "dateasc") { sort = sortby.split("-")[0];
this.descending = false; desc = sortby.split("-")[1];
this.sortby = "date";
} else if (sortby == "userasc") {
this.descending = false;
this.sortby = "user";
} else if (sortby == "userdesc") {
this.descending = true;
this.sortby = "user";
}
if (sortby == "sourceasc") {
this.descending = false;
this.sortby = "source";
} else if (sortby == "sourcedesc") {
this.descending = true;
this.sortby = "source";
} else if (sortby == "targetasc") {
this.descending = false;
this.sortby = "target";
} else if (sortby == "targetdesc") {
this.descending = true;
this.sortby = "target";
}
}
getSortby(): string {
if (this.descending) {
return this.sortby + "desc";
} else {
return this.sortby + "asc";
} }
} let option = this.sortOptions.find( option => option.value.sort == sort && ((option.value.descending && desc=="desc") || (!option.value.descending && desc=="asc")));
this.filterForm.get("sort").setValue(option?option.value:this.sortOptions[0].value);
changeType() {
this.entityTypes = [];
if (this.publicationCB) {
this.entityTypes.push('publication');
}
if (this.datasetCB) {
this.entityTypes.push('dataset');
}
if (this.softwareCB) {
this.entityTypes.push('software');
}
if (this.otherCB) {
this.entityTypes.push('other');
}
if (this.projectCB) {
this.entityTypes.push('project');
}
if (this.contextCB) {
this.entityTypes.push('context');
}
this.goTo();
}
setTypes(types: string) {
if (!types) {
return;
}
if (types.length > 0) {
this.entityTypes = [];
if (types.indexOf("publication") != -1) {
this.publicationCB = true;
this.entityTypes.push("publication");
}
if (types.indexOf("dataset") != -1) {
this.datasetCB = true;
this.entityTypes.push("dataset");
}
if (types.indexOf("software") != -1) {
this.softwareCB = true;
this.entityTypes.push("software");
}
if (types.indexOf("other") != -1) {
this.otherCB = true;
this.entityTypes.push("other");
}
if (types.indexOf("project") != -1) {
this.projectCB = true;
this.entityTypes.push("project");
}
if (types.indexOf("context") != -1) {
this.contextCB = true;
this.entityTypes.push("context");
}
}
if (this.publicationCB && this.datasetCB && this.softwareCB && this.otherCB && this.contextCB && this.projectCB) {
this.entityTypes = [];
}
} }
changekeyword() { changekeyword() {
if (this.inputkeyword.length >= 3 || this.inputkeyword.length == 0) {
this.searchTermStream.next(this.inputkeyword);
if (this.filterForm.get("keyword").value.length >= 3 || this.filterForm.get("keyword").value.length == 0) {
this.searchTermStream.next(this.filterForm.get("keyword").value);
} }
} }
select(item: any, event) { select(item: any, event) {
this.deleteMessage = "";
let value = event.currentTarget.checked; let value = event.currentTarget.checked;
if (value) { if (value) {
this.selected.push(item); this.selected.push(item);
@ -484,10 +355,8 @@ export class DisplayClaimsComponent {
let claim = this.claims[_i]; let claim = this.claims[_i];
this.selected.push(claim); this.selected.push(claim);
} }
this.deleteMessage = "";
} else { } else {
this.selected = []; this.selected = [];
this.deleteMessage = "";
} }
} }
@ -522,7 +391,6 @@ export class DisplayClaimsComponent {
} }
delete() { delete() {
this.deleteMessage = "";
this.loading.open(); this.loading.open();
this.claimsDeleted = 0; this.claimsDeleted = 0;
let ids = []; let ids = [];
@ -570,11 +438,20 @@ export class DisplayClaimsComponent {
this.resultsNum = this.resultsNum - res.deletedIds.length; this.resultsNum = this.resultsNum - res.deletedIds.length;
this.loading.close(); this.loading.close();
if (res.deletedIds.length > 0) { if (res.deletedIds.length > 0) {
this.deleteMessage = this.deleteMessage + '<div class = "uk-alert uk-alert-primary " >' + res.deletedIds.length + ' link(s) successfully deleted.</div>'; UIkit.notification('<div class = " " >' + res.deletedIds.length + ' link(s) successfully deleted.</div>', {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
} }
if (res.notFoundIds.length > 0) { if (res.notFoundIds.length > 0) {
this.deleteMessage = this.deleteMessage + '<div class = "uk-alert uk-alert-warning " >' + res.notFoundIds.length + ' link(s) couldn\'t be deleted.</div>'; UIkit.notification('<div class = " " >' + res.notFoundIds.length + ' link(s) couldn\'t be deleted.</div>', {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
} }
let goToPage = this.page; let goToPage = this.page;
if (this.totalPages(this.resultsNum) < this.page && this.page > 0) { if (this.totalPages(this.resultsNum) < this.page && this.page > 0) {
goToPage = this.page - 1; goToPage = this.page - 1;

7
claims/claim-utils/displayClaims/displayClaims.module.ts
View File

@ -2,7 +2,7 @@ import { NgModule} from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms'; import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatSelectModule } from "@angular/material"; import {MatAutocompleteModule, MatChipsModule, MatFormFieldModule, MatSelectModule, MatSlideToggleModule} from '@angular/material';
import {ClaimServiceModule} from '../service/claimsService.module'; import {ClaimServiceModule} from '../service/claimsService.module';
import {DisplayClaimsComponent} from './displayClaims.component'; import {DisplayClaimsComponent} from './displayClaims.component';
import {LoadingModalModule} from '../../../utils/modal/loadingModal.module'; import {LoadingModalModule} from '../../../utils/modal/loadingModal.module';
@ -14,12 +14,15 @@ import {Schema2jsonldModule} from '../../../sharedComponents/schema2jsonld/schem
import { SEOServiceModule } from '../../../sharedComponents/SEO/SEOService.module'; import { SEOServiceModule } from '../../../sharedComponents/SEO/SEOService.module';
import {IndexInfoServiceModule} from "../../../utils/indexInfoService.module"; import {IndexInfoServiceModule} from "../../../utils/indexInfoService.module";
import {PiwikServiceModule} from "../../../utils/piwik/piwikService.module"; import {PiwikServiceModule} from "../../../utils/piwik/piwikService.module";
import {SearchInputModule} from '../../../sharedComponents/search-input/search-input.module';
import {InputModule} from '../../../sharedComponents/input/input.module';
import {LoadingModule} from '../../../utils/loading/loading.module';
@NgModule({ @NgModule({
imports: [ imports: [
CommonModule, FormsModule, RouterModule, ClaimServiceModule, LoadingModalModule, AlertModalModule, CommonModule, FormsModule, RouterModule, ClaimServiceModule, LoadingModalModule, AlertModalModule,
ClaimEntityFormatterModule, PagingModule, HelperModule, Schema2jsonldModule, SEOServiceModule, PiwikServiceModule, ClaimEntityFormatterModule, PagingModule, HelperModule, Schema2jsonldModule, SEOServiceModule, PiwikServiceModule,
IndexInfoServiceModule, MatSelectModule IndexInfoServiceModule, MatSelectModule, SearchInputModule, MatAutocompleteModule, MatChipsModule, MatFormFieldModule, MatSlideToggleModule, InputModule, LoadingModule
], ],
declarations: [ declarations: [

78
claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts
View File

@ -8,82 +8,23 @@ import {ClaimDBContext, ClaimDBProject, ClaimDBResult} from "../claimHelper.clas
@Component({ @Component({
selector: 'claim-entity', selector: 'claim-entity',
template: ` template: `
<div *ngIf="type == 'publication'" title="Publication"> <div *ngIf="type == 'publication' || type == 'dataset' || type == 'software' || type == 'other'"
<div class="uk-text-muted">publication</div> [title]="(type == 'publication'?'Publication':(type == 'dataset'?'research data':(type == 'other'?'other research product':'software')))">
<!-- <span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" <div *ngIf="source" class="uk-text-muted title">{{type == 'publication'?'publication':(type == 'dataset'?'research data':(type == 'other'?'other':'software'))}}</div>
xmlns="http://www.w3.org/2000/svg" ratio="1"><rect fill="none"
stroke="#000" <span *ngIf="!source" class="title">Link to {{type == 'publication'?'publication':(type == 'dataset'?'research data':(type == 'other'?'other':'software'))}}: </span>
x="3.5"
y="2.5"
width="12"
height="16"></rect><polyline
fill="none" stroke="#000" points="5 0.5 17.5 0.5 17.5 17"></polyline></svg></span>-->
<publication-title [entity]="entity" param="id" <publication-title [entity]="entity" param="id"
path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title> path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title>
</div> </div>
<div *ngIf="type == 'dataset'" title="Dataset">
<div class="uk-text-muted">research data</div>
<!--<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" ratio="1"><ellipse fill="none"
stroke="#000"
cx="10"
cy="4.64"
rx="7.5"
ry="3.14"></ellipse><path
fill="none" stroke="#000" d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11"></path><path
fill="none" stroke="#000"
d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25"></path><path fill="none"
stroke="#000"
d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64"></path></svg></span>-->
<publication-title [entity]="entity" param="id"
path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title>
</div>
<div *ngIf="type == 'software'" title="Software">
<div class="uk-text-muted">software</div>
<!-- <span class="uk-margin-small-right uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <circle
fill="none" stroke="#000" cx="9.997" cy="10" r="3.31"></circle> <path fill="none" stroke="#000"
d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z"></path></svg>
</span>-->
<publication-title [entity]="entity" param="id"
path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title>
</div>
<div *ngIf="type == 'other'" title="Other reserch product">
<div class="uk-text-muted">other</div>
<!--<span class="uk-margin-small-right uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> <polygon fill="none"
stroke="#000"
points="2.5,5.7 10,1.3 17.5,5.7 17.5,14.3 10,18.7 2.5,14.3"></polygon> <circle
fill="none" stroke="#000" cx="10" cy="10" r="3.5"></circle></svg>
</span>-->
<publication-title [entity]="entity" param="id"
path="/search/result" [externalPortalUrl]=externalPortalUrl></publication-title>
</div>
<div *ngIf="type == 'project' " title="Project"> <div *ngIf="type == 'project' " title="Project">
<div class="uk-text-muted">project</div> <span class="uk-text-muted title">Link to project: </span>
<!--<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="5" y="2"
width="10"
height="1"></rect><rect
x="3" y="4" width="14" height="1"></rect><rect fill="none" stroke="#000" x="1.5" y="6.5" width="17"
height="11"></rect></svg></span>-->
<project-title [project]="entity" [searchLink]=properties.searchLinkToProject <project-title [project]="entity" [searchLink]=properties.searchLinkToProject
[externalPortalUrl]=externalPortalUrl></project-title> [externalPortalUrl]=externalPortalUrl></project-title>
</div> </div>
<div *ngIf="type == 'context' " title="Concept"> <div *ngIf="type == 'context' " title="Concept">
<div class="uk-text-muted">community</div> <span class="uk-text-muted title">Link to community: </span> <span class="uk-text-large">{{entity.title}}</span>
<!--<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none"
stroke="#000"
stroke-width="1.1"
cx="7.7"
cy="8.6"
r="3.5"></circle><path
fill="none" stroke="#000" stroke-width="1.1"
d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3"></path><path fill="none" stroke="#000"
stroke-width="1.1"
d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"></path></svg></span>-->
<span>{{entity.title}}</span>
</div> </div>
` `
}) })
@ -93,6 +34,7 @@ export class ClaimEntityFormatter {
@Input() type: string; @Input() type: string;
@Input() properties: EnvProperties; @Input() properties: EnvProperties;
@Input() externalPortalUrl: string = null; @Input() externalPortalUrl: string = null;
@Input() source: boolean = true;
constructor() { constructor() {
} }

10
claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts
View File

@ -7,19 +7,19 @@ import {properties} from "../../../../../environments/environment";
@Component({ @Component({
selector: 'project-title', selector: 'project-title',
template: ` template: `
<span *ngIf="externalPortalUrl" class="project-title"> <span *ngIf="externalPortalUrl" class="project-title uk-text-large">
<span><a <span><a
[href]="externalPortalUrl + projectUrl + '?projectId='+project['openaireId']">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}}</a></span> [href]="externalPortalUrl + projectUrl + '?projectId='+project['openaireId']">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}}</a></span>
</span> </span>
<span *ngIf="!externalPortalUrl" class="project-title"> <span *ngIf="!externalPortalUrl" class="project-title uk-text-large">
<span><a [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])" <span><a [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])"
routerLinkActive="router-link-active" routerLinkActive="router-link-active"
[routerLink]="projectUrl">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}} </a></span> [routerLink]="projectUrl">{{(project['acronym'] ? ('[' + project['acronym'] + '] ') : '')}}{{project['name']}} </a></span>
</span> </span>
<div *ngIf="project['funderName']"> <span *ngIf="project['funderName']">
<span class="uk-text-muted">Funder </span>{{project['funderName']}} <span class="uk-text-muted title"> Funder: </span>{{project['funderName']}}
</div> </span>
` `
}) })

4
claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts
View File

@ -6,14 +6,14 @@ import {RouterHelper} from '../../../utils/routerHelper.class';
@Component({ @Component({
selector: 'publication-title', selector: 'publication-title',
template: ` template: `
<span *ngIf="!externalPortalUrl" class="publication-title"> <span *ngIf="!externalPortalUrl" class="publication-title uk-text-large">
<span *ngIf="entity.openaireId"><a [queryParams]="routerHelper.createQueryParam(param,entity.openaireId)" routerLinkActive="router-link-active" <span *ngIf="entity.openaireId"><a [queryParams]="routerHelper.createQueryParam(param,entity.openaireId)" routerLinkActive="router-link-active"
[routerLink]="path"> {{entity.title?entity.title:"[No title available]"}}</a></span> [routerLink]="path"> {{entity.title?entity.title:"[No title available]"}}</a></span>
<!--span *ngIf="url" class="uk-margin-small-left" ><a target="_blank" href="{{url}}" > <!--span *ngIf="url" class="uk-margin-small-left" ><a target="_blank" href="{{url}}" >
(<span class="custom-external custom-icon" ></span>link)</a></span--> (<span class="custom-external custom-icon" ></span>link)</a></span-->
</span> </span>
<span *ngIf="externalPortalUrl" class="publication-title"> <span *ngIf="externalPortalUrl" class="publication-title uk-text-large">
<span *ngIf="entity.openaireId"><a [href]="externalPortalUrl + path+'?'+param+'='+entity.openaireId"> {{entity.title}}</a></span> <span *ngIf="entity.openaireId"><a [href]="externalPortalUrl + path+'?'+param+'='+entity.openaireId"> {{entity.title}}</a></span>
</span> </span>

21
claims/claimsAdmin/claimsAdmin.component.ts
View File

@ -12,17 +12,13 @@ import {Subscriber} from "rxjs";
template: ` template: `
<div id="tm-main" [class]="((isConnect)?'':'uk-section') +' uk-padding-remove-top tm-middle'"> <div id="tm-main" [class]="((isConnect)?'':'uk-section') +' uk-padding-remove-top tm-middle'">
<div uk-grid uk-grid> <div uk-grid>
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first "> <div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
<div class="uk-container"> <div [class.uk-container]="!isConnect">
<div class="uk-article-title custom-article-title"> <div *ngIf="!isConnect" class="uk-article-title custom-article-title">
Manage links Manage links
</div> </div>
<div> <div>
<!--div class="uk-text-right">
<a *ngIf="!fetchBy || fetchBy != 'Context'" routerLink="/participate/claim">Claim more links?</a>
<a *ngIf="isConnect && fetchBy && fetchBy == 'Context' && externalPortalUrl" [href]="externalPortalUrl+'/participate/claim'" target="_blank">Claim more links?</a>
</div-->
<displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=false <displayClaims *ngIf="user" [user]="user" [enableDelete]=true [myClaims]=false
[isAdmin]=true [fetchBy]="(fetchId=='openaire')?null:fetchBy" [isAdmin]=true [fetchBy]="(fetchId=='openaire')?null:fetchBy"
[fetchId]="(fetchId=='openaire')?null:fetchId" [fetchId]="(fetchId=='openaire')?null:fetchId"
@ -49,16 +45,7 @@ export class ClaimsAdminComponent {
sub; sub;
constructor(private _meta: Meta, private _title: Title, constructor(private _meta: Meta, private _title: Title,
private userManagementService: UserManagementService, private _router: Router) { private userManagementService: UserManagementService, private _router: Router) {
var titleConnect = "OpenAIRE Connect | Manage links "; this._title.setTitle(this.isConnect?"OpenAIRE Connect | Manage links ":"OpenAIRE | Manage links ");
var title = "OpenAIRE | Manage links ";
if (this.isConnect) {
this._title.setTitle(titleConnect);
} else {
this._title.setTitle(title);
}
} }
ngOnDestroy() { ngOnDestroy() {
if (this.sub instanceof Subscriber) { if (this.sub instanceof Subscriber) {

48
connect/community/CustomizationOptions.ts
View File

@ -1,6 +1,35 @@
export class CustomizationOptions { export class CustomizationOptions {
mainColor: string; mainColor: string;
secondaryColor: string; secondaryColor: string;
backgrounds:{
panels: {
onDarkBackground: boolean,
background: {
color: string; //background
borderStyle: string;
borderColor: string;
borderWidth: number;
}
}
homeBanner:{
onDarkBackground: boolean,
background: {
color: string; //background
borderStyle: string;
borderColor: string;
borderWidth: number;
}
}
lightPageBackground:{
background: {
color: string; //background
borderStyle: string;
borderColor: string;
borderWidth: number;
}
}
};
panel: { panel: {
onDarkBackground: boolean, onDarkBackground: boolean,
background: { background: {
@ -8,7 +37,8 @@ export class CustomizationOptions {
borderStyle: string; borderStyle: string;
borderColor: string; borderColor: string;
borderWidth: number; borderWidth: number;
}, fonts: { }
, fonts: {
color: string; color: string;
family: string; family: string;
size: number; size: number;
@ -20,20 +50,20 @@ export class CustomizationOptions {
size: number; size: number;
weight: number; weight: number;
}, },
panelElements: { /* panelElements: {
backgroundColor: string; backgroundColor: string;
borderColor: string; borderColor: string;
color: string; color: string;
} }*/
}; };
box: { /* box: {
borderColor: string; borderColor: string;
borderStyle: string; borderStyle: string;
borderWidth: number; borderWidth: number;
borderRadius: number; borderRadius: number;
} }
; ;*/
links: { links: {
darkBackground: { darkBackground: {
family: string; family: string;
@ -106,19 +136,19 @@ export class CustomizationOptions {
weight: 700 weight: 700
}, },
panelElements: { /* panelElements: {
backgroundColor: 'rgba(255, 255, 255, 0.5)', backgroundColor: 'rgba(255, 255, 255, 0.5)',
borderColor: 'rgba(255, 255, 255, 0.5)', borderColor: 'rgba(255, 255, 255, 0.5)',
color: '#ffffff' color: '#ffffff'
} }*/
}; };
this.box = { /* this.box = {
borderColor: '#4C9CD5', borderColor: '#4C9CD5',
borderStyle: 'solid', borderStyle: 'solid',
borderWidth: 2, borderWidth: 2,
borderRadius: 6, borderRadius: 6,
}; };*/
this.links = { this.links = {
darkBackground: { darkBackground: {
family: 'Open Sans', family: 'Open Sans',

59
connect/userEmailPreferences/mailPrefs.component.html
View File

@ -1,8 +1,6 @@
<!-- <div id="tm-main" class=" uk-section uk-margin-small-top tm-middle">
<div uk-grid uk-grid> <div *ngIf="!hidden" class="">
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first"> --> <div *ngIf="showSaveResetButtons" class="uk-article-title custom-article-title">
<div *ngIf="!hidden" class="uk-container uk-margin-top">
<div class="uk-article-title custom-article-title">
User Email Preferences for Claims Notifications User Email Preferences for Claims Notifications
</div> </div>
@ -14,34 +12,23 @@
</div> </div>
<errorMessages [status]="[status]" [type]="'notification preferences'"></errorMessages> <errorMessages [status]="[status]" [type]="'notification preferences'"></errorMessages>
<ul class="custom-accordion" uk-accordion>
<!-- class="uk-open" --> <div *ngFor="let notification of notifications; let i=index" >
<!-- uk-card uk-card-default uk-card-body --> <!-- <div class="uk-accordion-title">Email preferences for {{preferencesFor}}: <strong>{{notification.openaireName}}</strong></div>-->
<li *ngFor="let notification of notifications; let i=index" [class]="i==0 ? 'uk-open' : ''"> <!-- <div class="uk-accordion-content">-->
<div class="uk-accordion-title">Email preferences for {{preferencesFor}}: <strong>{{notification.openaireName}}</strong></div>
<div class="uk-accordion-content">
<form class="uk-form-horizontal"><!-- [formGroup]="myForm"--> <form class="uk-form-horizontal"><!-- [formGroup]="myForm"-->
<!--[ngClass]="{'has-error':!myForm.controls.notify.valid && myForm.controls.notify.dirty}"--> <!--[ngClass]="{'has-error':!myForm.controls.notify.valid && myForm.controls.notify.dirty}"-->
<div class="uk-margin"> <div class="uk-margin uk-grid">
<div class="uk-form-label inherit-color">Notify for claims:</div> <div class=" inherit-color uk-width-medium"
<!-- <div class="uk-form-controls uk-form-controls-text"> title="Get e-mail notification when there are new user links related your community">Notify
<label>Yes <input class="uk-radio" type="radio" name="radio2" [checked]="notification.notify" (click)="changeNotify(notification, true)"></label> for new user links:</div>
<label>No <input class="uk-radio" type="radio" name="radio2" [checked]="!notification.notify" (click)="changeNotify(notification, false)"></label>
</div> --> <mat-slide-toggle [checked]="notification.notify"
<div class="uk-form-controls uk-form-controls-text" data-uk-button-group> (change)="($event.source.checked = notification.notify);changeNotify(notification, !notification.notify, i)"></mat-slide-toggle>
<button *ngIf="notification.notify" class="uk-button uk-button-primary uk-button-small"
data-uk-button>ON</button>
<button *ngIf="!notification.notify" class="uk-button uk-button-default uk-button-small"
(click)="changeNotify(notification, true, i)" data-uk-button>ON</button>
<button *ngIf="!notification.notify" class="uk-button uk-button-danger uk-button-small"
data-uk-button>OFF</button>
<button *ngIf="notification.notify" class="uk-button uk-button-default uk-button-small"
(click)="changeNotify(notification, false, i)" data-uk-button>OFF</button>
</div>
</div> </div>
<!-- [ngClass]="{'has-error':!myForm.controls.frequency.valid && myForm.controls.frequency.dirty}" --> <div *ngIf="notification.notify" [class]="notification.notify ? 'uk-margin' :
<div [class]="notification.notify ? 'uk-margin' : 'uk-margin cursor-not-allowed'"> 'uk-margin cursor-not-allowed'">
<div class="uk-form-label inherit-color">Frequency:</div> <div class="uk-form-label inherit-color">Frequency:</div>
<div class="uk-form-controls"> <div class="uk-form-controls">
<select [class]="notification.notify ? 'uk-select' : 'uk-select uk-disabled'" id="form-horizontal-select" <select [class]="notification.notify ? 'uk-select' : 'uk-select uk-disabled'" id="form-horizontal-select"
@ -57,20 +44,12 @@
<button type="submit" class="uk-button uk-button-primary" (click)="saveNotification(i)">Save Changes</button> <button type="submit" class="uk-button uk-button-primary" (click)="saveNotification(i)">Save Changes</button>
<button type="submit" class="uk-button" (click)="restoreNotification(i)">Reset</button> <button type="submit" class="uk-button" (click)="restoreNotification(i)">Reset</button>
</div> </div>
<!-- <span class="uk-margin">
<button class="uk-width-1-1 uk-button uk-button-primary uk-button-small" type="submit" (click)="saveNotification(notifications, i)">Save</button>
<button class="uk-width-1-1 uk-button uk-button-small" (click)="restoreNotification(notifications, i)">Restore</button>
</span> -->
<!-- {{notification.notify}} -- {{notification.frequency}} -->
</form> </form>
</div> </div>
</li> <!-- </div>-->
</ul> <!-- </ul>-->
<!-- {{notifications | json}} -->
</div> </div>
<!-- </div>
</div>
</div> -->

19
connect/userEmailPreferences/mailPrefs.component.ts
View File

@ -22,7 +22,7 @@ declare var UIkit: any;
export class MailPrefsComponent { export class MailPrefsComponent {
properties:EnvProperties; properties:EnvProperties;
subscriptions = []; subscriptions = [];
public communityId: string; @Input() communityId: string;
public preferencesFor: string = "community"; public preferencesFor: string = "community";
public status: number; public status: number;
@ -48,13 +48,16 @@ export class MailPrefsComponent {
ngOnInit() { ngOnInit() {
this.properties = properties; this.properties = properties;
this.subscriptions.push(this.route.queryParams.subscribe(params => { this.subscriptions.push(this.route.params.subscribe(params => {
this.hidden = true; this.hidden = true;
console.debug(this.communityId);
this.communityId = ConnectHelper.getCommunityFromDomain(this.properties.domain); if(!this.communityId){
if(!this.communityId) { this.communityId = ConnectHelper.getCommunityFromDomain(this.properties.domain);
this.communityId = params['communityId'];
} }
if(!this.communityId) {
this.communityId = params['community'];
}
console.debug(this.communityId, params)
this.getEmailPreferences(); this.getEmailPreferences();
})); }));
@ -77,13 +80,15 @@ export class MailPrefsComponent {
data => { data => {
if(data.code == "204") { if(data.code == "204") {
this.status = this.errorCodes.NONE; this.status = this.errorCodes.NONE;
this.initialNotifications = [{notify: true, frequency:24, openaireId: this.communityId}];
} else { } else {
this.initialNotifications = data.data; this.initialNotifications = data.data;
}
this.notifications = JSON.parse(JSON.stringify( this.initialNotifications )); this.notifications = JSON.parse(JSON.stringify( this.initialNotifications ));
this.status = this.errorCodes.DONE; this.status = this.errorCodes.DONE;
this.hidden = false; this.hidden = false;
}
}, },
err => { err => {
this.hidden = false; this.hidden = false;

3
connect/userEmailPreferences/mailsPrefs.module.ts
View File

@ -6,10 +6,11 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MailPrefsComponent } from './mailPrefs.component'; import { MailPrefsComponent } from './mailPrefs.component';
import { MailPrefsService } from './mailPrefs.service'; import { MailPrefsService } from './mailPrefs.service';
import {ErrorMessagesModule} from '../../utils/errorMessages.module'; import {ErrorMessagesModule} from '../../utils/errorMessages.module';
import {MatSlideToggleModule} from '@angular/material';
@NgModule({ @NgModule({
imports: [ imports: [
CommonModule, RouterModule, FormsModule, ReactiveFormsModule, ErrorMessagesModule CommonModule, RouterModule, FormsModule, ReactiveFormsModule, ErrorMessagesModule, MatSlideToggleModule
], ],
declarations: [ declarations: [
MailPrefsComponent MailPrefsComponent