openaire-library/claims/claimsByToken/claimsByToken.component.ts

536 lines
16 KiB
TypeScript

import {Component, ViewChild, ViewChildren, QueryList, Input, ViewEncapsulation} from '@angular/core';
import {Location} from '@angular/common';
import {ActivatedRoute, Params} from '@angular/router';
import {Title, Meta} from '@angular/platform-browser';
import {DataTableDirective} from 'angular-datatables';
import {Observable} from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';
import{EnvProperties} from '../../utils/properties/env-properties';
import {ErrorCodes} from '../../utils/properties/errorCodes';
import {ClaimsDatatablePipe} from '../../utils/pipes/claimsDatatable.pipe';
import {Session} from '../../login/utils/helper.class';
import {RouterHelper} from '../../utils/routerHelper.class';
import {ModalSelect} from '../../utils/modal/selectModal.component';
import {ModalLoading} from '../../utils/modal/loading.component';
import {ClaimsByTokenService} from './claimsByToken.service';
@Component({
selector: 'claims-project-manager',
templateUrl: 'claimsByToken.component.html',
styles: [`
#table1_info, #table1_paginate, #table1_length, #table1_filter,
#table2_info, #table2_paginate, #table2_length, #table2_filter{
display: none;
}
`],
encapsulation: ViewEncapsulation.None // this used in order styles to work
})
export class ClaimsByTokenComponent {
public openaireId: string = "";
public sub: any;
public project: any;
private claims:any = [];
public pending_claims: any = [];
public curated_claims: any = [];
public selectedRight_PendingMode: Set<string>;
public selectedWrong_PendingMode: Set<string>;
public selectedRight_CuratedMode: Set<string>;
public selectedWrong_CuratedMode: Set<string>;
public editable: Set<number>;
public contact_person: string[] = ["Konstantina", "Argiro", "Katerina"];
private errorCodes: ErrorCodes;
public pending_status: number;
public curated_status: number;
// when 'valid' show proper claims, when 'invalid' show no matched entry-wanna retry
public accessStatus: string;// = "empty";
public mode: string = "pending";
public showTables: boolean = true;
public rowsOnPage = 5;
public sortOrder = "asc";
public keyword1:string = "";
public keyword2:string = "";
public activePendingPage:any = {page: 1};
public totalPendingResults:any = {count: 0};
public activeCuratedPage:any = {page: 1};
public totalCuratedResults:any = {count: 0};
dtTrigger: Subject<any>[] = [];
private triggered: boolean = false;
dtOptions: DataTables.Settings[] = [];
@ViewChildren(DataTableDirective)
dtElements: QueryList<any>;
//@ViewChild("table1") table1: DataTableDirective;
//@ViewChild("table2") table2: DataTableDirective;
@ViewChild (ModalSelect) selectModal : ModalSelect;
@ViewChild (ModalLoading) loading : ModalLoading ;
properties:EnvProperties;
public routerHelper:RouterHelper = new RouterHelper();
constructor (private route: ActivatedRoute,
private claimsByTokenService: ClaimsByTokenService,
private _meta: Meta, private _title: Title) {
this.errorCodes = new ErrorCodes();
this.pending_status = this.errorCodes.LOADING;
this.curated_status = this.errorCodes.LOADING;
}
ngOnInit() {
this.route.data
.subscribe((data: { envSpecific: EnvProperties }) => {
this.properties = data.envSpecific;
});
this.sub = this.route.queryParams.subscribe(params => {
this.mode = "pending";
this.openaireId = params['openaireId'];
this.selectedRight_PendingMode = new Set<string>();
this.selectedWrong_PendingMode = new Set<string>();
this.selectedRight_CuratedMode = new Set<string>();
this.selectedWrong_CuratedMode = new Set<string>();
this.editable = new Set<number>();
this.validateJWTandToken();
this.updateTitle("Claims For Project Managers");
}
);
this.dtOptions[0] = {
//"paging": false,
//"searching": false,
//"lengthChange": false,
"pageLength": this.rowsOnPage,
"columnDefs": [ {
"type": "date",
"targets": 2
} ],
"order": [[ 2, 'desc' ]]
//"pagingType": 'full_numbers',
/*"language": {
"search": "",
"searchPlaceholder": "Search projects..."
}*/
};
console.info("configure dtOptions1: ",this.dtOptions[0]);
this.dtOptions[1] = {
"pageLength": this.rowsOnPage,
"columnDefs": [ {
"type": "date",
"targets": [2,4]
} ],
"order": [[ 4, 'desc' ]]
};
console.info("configure dtOptions2: ",this.dtOptions[1]);
this.dtTrigger[0] = new Subject<any>();
this.dtTrigger[1] = new Subject<any>();
}
ngAfterViewInit(): void {
$.fn['dataTable'].ext.search.push((settings, data, dataIndex) => {
if(settings.sTableId == 'table1') {
if (this.filterData(data, this.keyword1)) {
return true;
}
return false;
} else if(settings.sTableId == 'table2') {
if (this.filterData(data, this.keyword2)) {
return true;
}
return false;
}
});
}
ngOnDestroy(): void {
$.fn['dataTable'].ext.search.pop();
// Do not forget to unsubscribe the event
this.dtTrigger[0].unsubscribe();
this.dtTrigger[1].unsubscribe();
}
/*
Trigger a table draw in order to get the initial filtering
*/
triggerInitialLoad(){
this.triggered = true;
console.info("triggerInitialLoad");
setTimeout(function(){
/*var table1 = <any>$('#table1').DataTable();
table1.page( 0 ).draw( false );
var table2 = <any>$('#table2').DataTable();
table2.page( 0 ).draw( false );*/
}, 500);
setTimeout(() => {
this.dtTrigger[0].next();
this.dtTrigger[1].next();
});
}
rerender(): void {
console.info("RERENDER");
this.dtElements.forEach((dtElement: DataTableDirective, index: number) => {
dtElement.dtInstance.then((dtInstance: any) => {
// Destroy the table first
dtInstance.destroy();
// Call the dtTrigger to rerender again
this.dtTrigger[index].next();
});
});
}
filterData(row: any, query: string) {
let returnValue: boolean = false;
if(query) {
for(var i=0; i <3; i++){
var r= this.filterQuery(row[i], query);
if(r) {
returnValue = true;
break;
}
}
if(!returnValue) {
return false;
}
}
return true;
}
filterQuery(data, query){
if(data.toLowerCase().indexOf(query.toLowerCase()) > -1){
return true;
}else{
return false;
}
}
refreshTable(page:number, whichTable: string) {
if(whichTable == "pending") {
var table = $('#table1').DataTable();
table.page( page - 1 ).draw( false );
var info = table.page.info();
console.info("records: "+info.recordsDisplay);
this.activePendingPage.page = page;//$event.value;
this.totalPendingResults.count = info.recordsDisplay;
} else if(whichTable == 'curated') {
var table = $('#table2').DataTable();
table.page( page - 1 ).draw( false );
var info = table.page.info();
console.info("records: "+info.recordsDisplay);
this.activeCuratedPage.page = page;//$event.value;
this.totalCuratedResults.count = info.recordsDisplay;
}
//table.mfActivePage=$event.value;
//table.setPage(table.mfActivePage, this.rowsOnPage);
}
validateJWTandToken() {
if(this.openaireId) {
this.pending_status = this.errorCodes.LOADING;
this.curated_status = this.errorCodes.LOADING;
this.showTables = false;
this.pending_claims = [];
this.curated_claims = [];
this.activePendingPage.page = 1;
this.totalPendingResults.count = 0;
this.activeCuratedPage.page = 1;
this.totalCuratedResults.count = 0;
this.claimsByTokenService.getClaims(this.openaireId, this.properties.claimsAPIURL).subscribe(
data => {
//this.closeLoading();
this.accessStatus = "valid";
//console.info(data);
this.claims = data.data;
for(let claim of this.claims) {
if(claim.targetType == "project") {
this.project = claim.target;
} else {
this.project = claim.source;
}
if(claim.curatedBy) {
this.curated_claims.push(claim);
} else {
this.pending_claims.push(claim);
}
}
this.totalPendingResults.count = this.pending_claims.length;
this.totalCuratedResults.count = this.curated_claims.length;
if(this.project) {
this.updateTitle("Claims For Project Managers - "+this.project.name);
}
this.showTables = true;
if(!this.triggered) {
console.info("initial load");
this.triggerInitialLoad();
} else {
console.info("rerender");
var table1 = $('#table1').DataTable();
table1.clear();
var table2 = $('#table2').DataTable();
table2.clear();
this.rerender();
}
this.pending_status = this.errorCodes.DONE;
this.curated_status = this.errorCodes.DONE;
},
err => {
if(err.status == '404') {
this.pending_status = this.errorCodes.NOT_FOUND;
this.curated_status = this.errorCodes.NOT_FOUND;
} else if(err.status == '500') {
this.pending_status = this.errorCodes.ERROR;
this.curated_status = this.errorCodes.ERROR;
} else {
this.pending_status = this.errorCodes.NOT_AVAILABLE;
this.curated_status = this.errorCodes.NOT_AVAILABLE;
}
this.showTables = true;
if(!this.triggered) {
this.triggerInitialLoad();
} else {
var table1 = $('#table1').DataTable();
table1.clear();
var table2 = $('#table2').DataTable();
table2.clear();
this.rerender();
}
this.accessStatus = "invalid";
console.log(err);
}
);
} else {
this.accessStatus = "invalid";
}
}
selectApprove(id:string, event, mode: string) {
var value = event.currentTarget.checked;
if(value){
if(mode == "pending") {
this.selectedRight_PendingMode.add(id);
this.selectedWrong_PendingMode.delete(id);
} else {
this.selectedRight_CuratedMode.add(id);
this.selectedWrong_CuratedMode.delete(id);
}
}else{
if(mode == "pending") {
this.selectedRight_PendingMode.delete(id);
}
// } else {
// this.selectedRight_CuratedMode.delete(id);
// this.selectedWrong_CuratedMode.add(id);
// }
}
}
selectDisapprove(id:string, event, mode: string) {
var value = event.currentTarget.checked;
if(value){
if(mode == "pending") {
this.selectedWrong_PendingMode.add(id);
this.selectedRight_PendingMode.delete(id);
} else {
this.selectedWrong_CuratedMode.add(id);
this.selectedRight_CuratedMode.delete(id);
}
}else{
if(mode == "pending") {
this.selectedWrong_PendingMode.delete(id);
}
// } else {
// this.selectedWrong_CuratedMode.delete(id);
// this.selectedRight_CuratedMode.add(id);
// }
}
}
isSelected(id:string, set:Set<string>) {
return set.has(id);
}
/*
isSelectedWrong(id:string) {
return this.selectedWrong.has(id);
}
*/
isRight_CuratedMode(claim: any) {
if(this.isSelected(claim.id, this.selectedRight_CuratedMode)) {
return true;
} else if(claim.approved == true && !this.isSelected(claim.id, this.selectedWrong_CuratedMode)) {
return true;
}
return false;
}
isWrong_CuratedMode(claim: any) {
if(this.isSelected(claim.id, this.selectedWrong_CuratedMode)) {
return true;
} else if(claim.approved == false && !this.isSelected(claim.id, this.selectedRight_CuratedMode)) {
return true;
}
return false;
}
cancelEditOfCuration(claim: any) {
console.info("cancelEditOfCuration - approved:"+claim.approved);
if(claim.approved) {
//this.selectedRight_CuratedMode.add(claim.id);
this.selectedWrong_CuratedMode.delete(claim.id);
} else {
this.selectedRight_CuratedMode.delete(claim.id);
//this.selectedWrong_CuratedMode.add(claim.id);
}
}
saveEdited(claim: any, editable_index: number) {
this.curated_status = this.errorCodes.LOADING;
let approved: boolean = this.isRight_CuratedMode(claim);
if(approved == claim.approved) {
this.selectedRight_CuratedMode.delete(claim.id);
this.selectedWrong_CuratedMode.delete(claim.id);
this.editable.delete(editable_index);
this.curated_status = this.errorCodes.DONE;
} else {
let claimCurationInfo: {"id": string, "approved": boolean} = {"id": claim.id, "approved": approved};
this.claimsByTokenService.updateClaimCuration(claimCurationInfo, this.properties.claimsAPIURL).subscribe(
data => {
console.info(data);
this.selectedRight_CuratedMode.delete(claim.id);
this.selectedWrong_CuratedMode.delete(claim.id);
this.editable.delete(editable_index);
this.validateJWTandToken();
},
err => {
console.log(err);
this.curated_status = this.errorCodes.NOT_SAVED;
}
);
}
}
saveChanges() {
this.pending_status = this.errorCodes.LOADING;
//this.openLoading();
console.info("Changes Saved!, right-wrong", this.selectedRight_PendingMode, this.selectedWrong_PendingMode);
this.claimsByTokenService.updateClaimsCuration(this.selectedRight_PendingMode, this.selectedWrong_PendingMode, this.properties.claimsAPIURL).subscribe(
data => {
//this.closeLoading();
console.info(data);
this.mode = "curated";
this.clearCheckboxes();
this.validateJWTandToken();
},
err => {
//this.closeLoading();
console.log(err);
this.pending_status = this.errorCodes.NOT_SAVED;
}
);
}
clearCheckboxes() {
this.pending_status = this.errorCodes.LOADING;
this.selectedRight_PendingMode.clear();
this.selectedWrong_PendingMode.clear();
this.pending_status = this.errorCodes.DONE;
}
public openLoading(){
if(this.loading){
this.loading.open();
}
}
public closeLoading(){
if(this.loading){
this.loading.close();
}
}
curatorSelected(selected: string) {
console.info("selected curator: "+selected);
}
public openSelect(){
if(this.selectModal){
this.selectModal.open();
}
}
public setMessageSelect(message: string){
if(this.selectModal){
this.selectModal.message = message;
}
}
public setOptionsSelect(options: string[]){
if(this.selectModal){
this.selectModal.options = options;
}
}
totalPages(totalResults: number): number {
let totalPages:any = totalResults/(this.rowsOnPage);
if(!(Number.isInteger(totalPages))) {
totalPages = (parseInt(totalPages, 10) + 1);
}
return totalPages;
}
updateTitle(title:string){
var _prefix ="OpenAIRE | ";
var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
this._meta.updateTag({content:_title},"property='og:title'");
this._title.setTitle(_title);
}
}