1. Community API added in env properties.

2. 'columnNames' variable added in search table pages (e.g. OpenAIRE Journals Table) to describe column names of the datatable.
3. Input 'columnNames' variable added in 'searchPageTableView' compontent, its value comes from search table pages (e.g. OpenAIRE Journals Table).
4. 'searchPageTableView' component updated and parametrized, to have datatable's columns either for content providers gotten by search API, or for projects gotten by community API.


git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@50991 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2018-03-01 12:03:40 +00:00
parent d2db165ec1
commit 1e4eab0ca6
6 changed files with 86 additions and 42 deletions

View File

@ -17,6 +17,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
<search-page-table pageTitle="OpenAIRE Content Providers Table" <search-page-table pageTitle="OpenAIRE Content Providers Table"
type="content providers" entityType="dataprovider" [(filters)] = "filters" type="content providers" entityType="dataprovider" [(filters)] = "filters"
[(results)] = "results" [(searchUtils)] = "searchUtils" [(results)] = "results" [(searchUtils)] = "searchUtils"
[columnNames]="columnNames"
[showResultCount]=false [showResultCount]=false
[disableForms]="disableForms" [disableForms]="disableForms"
[searchViewLink]="'/search/content-providers'" [searchViewLink]="'/search/content-providers'"
@ -31,6 +32,7 @@ export class SearchCompatibleDataprovidersTableComponent {
public results =[]; public results =[];
public filters =[]; public filters =[];
public columnNames = ["Name", "Type", "Country", "Institution", "Compatibility"];
public baseUrl:string; public baseUrl:string;
public searchUtils:SearchUtilsClass = new SearchUtilsClass(); public searchUtils:SearchUtilsClass = new SearchUtilsClass();
public sub: any; public subResults: any; public sub: any; public subResults: any;

View File

@ -16,6 +16,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
<search-page-table pageTitle="Registries/ Databases" <search-page-table pageTitle="Registries/ Databases"
type="content providers" entityType="dataprovider" [(filters)] = "filters" type="content providers" entityType="dataprovider" [(filters)] = "filters"
[(results)] = "results" [(searchUtils)] = "searchUtils" [(results)] = "results" [(searchUtils)] = "searchUtils"
[columnNames]="columnNames"
[showResultCount]=false [showResultCount]=false
[disableForms]="disableForms" [disableForms]="disableForms"
[searchViewLink]="'/search/entity-registries'" [searchViewLink]="'/search/entity-registries'"
@ -31,6 +32,7 @@ export class SearchEntityRegistriesTableComponent {
public results =[]; public results =[];
public filters =[]; public filters =[];
public columnNames = ["Name", "Type", "Country", "Institution", "Compatibility"];
public baseUrl:string; public baseUrl:string;
public searchUtils:SearchUtilsClass = new SearchUtilsClass(); public searchUtils:SearchUtilsClass = new SearchUtilsClass();
public sub: any; public subResults: any; public sub: any; public subResults: any;

View File

@ -18,6 +18,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
<search-page-table pageTitle="OpenAIRE Journals Table" <search-page-table pageTitle="OpenAIRE Journals Table"
type="content providers" entityType="dataprovider" [(filters)] = "filters" type="content providers" entityType="dataprovider" [(filters)] = "filters"
[(results)] = "results" [(searchUtils)] = "searchUtils" [(results)] = "results" [(searchUtils)] = "searchUtils"
[columnNames]="columnNames"
[showResultCount]=false [showResultCount]=false
[disableForms]="disableForms" [disableForms]="disableForms"
[searchViewLink]="'/search/journals'" [searchViewLink]="'/search/journals'"
@ -32,6 +33,7 @@ export class SearchJournalsTableComponent {
public results =[]; public results =[];
public filters =[]; public filters =[];
public columnNames = ["Name", "Type", "Country", "Institution", "Compatibility"];
public baseUrl:string; public baseUrl:string;
public searchUtils:SearchUtilsClass = new SearchUtilsClass(); public searchUtils:SearchUtilsClass = new SearchUtilsClass();
public sub: any; public subResults: any; public sub: any; public subResults: any;

View File

@ -57,7 +57,7 @@
<div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom"> <div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
<div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom"> <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
<span class="uk-h6 uk-width-1-1@s uk-width-1-2@m"> <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
{{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}} {{searchUtils.totalResults}} {{type}}, page {{searchUtils.page}} of {{(totalPages())}}
</span> </span>
<span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m"> <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
<paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load> <paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
@ -88,55 +88,62 @@
<thead > <thead >
<tr> <tr>
<!-- Name Type Country Institution Compatibility --> <!-- <th class="uk-text-left">Name</th>
<th class="uk-text-left">Name <th class="uk-text-center"> Type</th>
<!--svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"> <th class="uk-text-center"> Country</th>
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon> <th class="uk-text-center"> Institution</th> -->
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon> <!-- <th class="uk-text-center"> Compatibility</th> -->
</svg--> <th *ngFor="let column of columnNames" class="uk-text-center">{{column}}</th>
</th>
<th class="uk-text-center"> Type
</th>
<th class="uk-text-center"> Country
</th>
<th class="uk-text-center"> Institution
</th>
<th class="uk-text-center"> Compatibility
</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr class="uk-table-middle" *ngFor="let dataprovider of results"> <tr class="uk-width-1-5 uk-table-middle" *ngFor="let result of results">
<td class="uk-width-1-5 uk-text-left"> <td *ngIf="result.hasOwnProperty('title')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<a [queryParams]="{datasourceId: dataprovider.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider"> <a [queryParams]="{datasourceId: result.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
<span *ngIf="dataprovider.title.name" <span *ngIf="result.title.name"
[innerHTML]="dataprovider.title.name"> [innerHTML]="result.title.name">
</span> </span>
<span *ngIf="!dataprovider.title.name"> <span *ngIf="!result.title.name">
[no title available] [no title available]
</span> </span>
</a> </a>
</td> </td>
<td class="uk-width-1-5 uk-text-center"> <td *ngIf="result.hasOwnProperty('type')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="dataprovider.type">{{dataprovider.type}}</span> <span *ngIf="result.type">{{result.type}}</span>
<span *ngIf="!dataprovider.type">-</span> <span *ngIf="!result.type">-</span>
</td> </td>
<td class="uk-width-1-5 uk-text-center"> <td *ngIf="result.hasOwnProperty('countries')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngFor="let country of dataprovider['countries'].slice(0,5) let i = index">{{country}}{{(i < ( dataprovider['countries'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['countries'].slice(0,5).length-1 && dataprovider['countries'].length > 5)?"...":""}}</span> <span *ngFor="let country of result['countries'].slice(0,5) let i = index">{{country}}{{(i < ( result['countries'].slice(0,5).length-1))?", ":""}}{{(i == result['countries'].slice(0,5).length-1 && result['countries'].length > 5)?"...":""}}</span>
<span *ngIf="dataprovider.countries.length == 0">-</span> <span *ngIf="result.countries.length == 0">-</span>
</td> </td>
<td class="uk-width-1-5 uk-text-center"> <td *ngIf="result.hasOwnProperty('organizations')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngFor="let org of dataprovider['organizations'].slice(0,5) let i = index"> <span *ngFor="let org of result['organizations'].slice(0,5) let i = index">
<a *ngIf="org.id" [queryParams]="{organizationId: org.id}" routerLinkActive="router-link-active" routerLink="/search/organization">{{org.name}}</a><span *ngIf="!org.id">{{org.name}}</span>{{(i < ( dataprovider['organizations'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['organizations'].slice(0,5).length-1 && dataprovider['organizations'].length > 5)?"...":""}} <a *ngIf="org.id" [queryParams]="{organizationId: org.id}" routerLinkActive="router-link-active" routerLink="/search/organization">{{org.name}}</a><span *ngIf="!org.id">{{org.name}}</span>{{(i < ( result['organizations'].slice(0,5).length-1))?", ":""}}{{(i == result['organizations'].slice(0,5).length-1 && result['organizations'].length > 5)?"...":""}}
</span> </span>
<span *ngIf="dataprovider.organizations.length == 0">-</span> <span *ngIf="result.organizations.length == 0">-</span>
</td> </td>
<td class="uk-width-1-5 uk-text-center"> <td *ngIf="result.hasOwnProperty('compatibility')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="dataprovider.compatibility">{{dataprovider.compatibility}}</span> <span *ngIf="dataprovider.compatibility">{{dataprovider.compatibility}}</span>
<span *ngIf="!dataprovider.compatibility">-</span> <span *ngIf="!dataprovider.compatibility">-</span>
</td> </td>
<!--Community Projects-->
<td *ngIf="result.hasOwnProperty('acronym')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="result.acronym">{{result.acronym}}</span>
<span *ngIf="!result.acronym">-</span>
</td>
<td *ngIf="result.hasOwnProperty('name')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="result.name">{{result.name}}</span>
<span *ngIf="!result.name">-</span>
</td>
<td *ngIf="result.hasOwnProperty('grantId')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="result.grantId">{{result.grantId}}</span>
<span *ngIf="!result.grantId">-</span>
</td>
<td *ngIf="result.hasOwnProperty('funder')" [class]="'uk-text-center uk-width-1-'+columnNames.length">
<span *ngIf="result.funder">{{result.funder}}</span>
<span *ngIf="!result.funder">-</span>
</td>
</tr> </tr>
</tbody> </tbody>
<!-- <thead *ngIf="searchUtils.totalResults > 0"> <!-- <thead *ngIf="searchUtils.totalResults > 0">
@ -153,7 +160,7 @@
<div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom"> <div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
<div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom"> <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
<span class="uk-h6 uk-width-1-1@s uk-width-1-2@m"> <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
{{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}} {{searchUtils.totalResults}} {{type}}, page {{searchUtils.page}} of {{(totalPages())}}
</span> </span>
<span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m"> <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
<paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load> <paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>

View File

@ -16,7 +16,7 @@ import {SearchFilterModalComponent} from './searchFilterModal.component';
import { ErrorCodes} from '../../utils/properties/errorCodes'; import { ErrorCodes} from '../../utils/properties/errorCodes';
import {PiwikService} from '../../utils/piwik/piwik.service'; import {PiwikService} from '../../utils/piwik/piwik.service';
import { DataTableDirective } from 'angular-datatables'; import { DataTableDirective } from 'angular-datatables';
import {SearchDataprovidersService} from '../../services/searchDataproviders.service'; //import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
import {EnvProperties} from '../../utils/properties/env-properties'; import {EnvProperties} from '../../utils/properties/env-properties';
@Component({ @Component({
@ -35,6 +35,7 @@ export class SearchPageTableViewComponent implements OnInit, AfterViewInit {
@Input() pageTitle = ""; @Input() pageTitle = "";
@Input() results; @Input() results;
@Input() filters = []; @Input() filters = [];
@Input() columnNames = [];
@Input() type:string = ""; @Input() type:string = "";
@Input() entityType: string = ""; @Input() entityType: string = "";
@Input() searchUtils:SearchUtilsClass;// = new SearchUtilsClass(); @Input() searchUtils:SearchUtilsClass;// = new SearchUtilsClass();
@ -67,7 +68,7 @@ export class SearchPageTableViewComponent implements OnInit, AfterViewInit {
showTable = false; filteringAdded = false; showTable = false; filteringAdded = false;
@ViewChild(DataTableDirective) datatableElement: DataTableDirective; @ViewChild(DataTableDirective) datatableElement: DataTableDirective;
dtTrigger: Subject<any> = new Subject(); //necessary dtTrigger: Subject<any> = new Subject(); //necessary
constructor (private route: ActivatedRoute,private location: Location , private _meta: Meta, private _piwikService:PiwikService, private _searchDataprovidersService: SearchDataprovidersService ) { } constructor (private route: ActivatedRoute,private location: Location , private _meta: Meta, private _piwikService:PiwikService) { }
ngOnInit() { ngOnInit() {
this.route.data this.route.data
@ -140,6 +141,7 @@ export class SearchPageTableViewComponent implements OnInit, AfterViewInit {
} }
public getParametersFromUrl(params) { public getParametersFromUrl(params) {
console.info(this.refineFields);
for(var i=0; i< this.refineFields.length ; i++) { for(var i=0; i< this.refineFields.length ; i++) {
var filterId = this.refineFields[i]; var filterId = this.refineFields[i];
if(params[filterId] != undefined) { if(params[filterId] != undefined) {
@ -149,6 +151,7 @@ public getParametersFromUrl(params) {
this.queryParameters[filterId]=decodeURIComponent(params[filterId]); this.queryParameters[filterId]=decodeURIComponent(params[filterId]);
} }
} }
console.info(this.queryParameters);
} }
/* /*
* Mark as check the new filters that are selected, when you get them from search * Mark as check the new filters that are selected, when you get them from search
@ -184,6 +187,7 @@ public getParametersFromUrl(params) {
* *
*/ */
private createUrlParameters(filters:Filter[], includePage:boolean){ private createUrlParameters(filters:Filter[], includePage:boolean){
console.info("====CREATE URL PARAMS====");
var allLimits="";//location.search.slice(1); var allLimits="";//location.search.slice(1);
this.parameterNames.splice(0,this.parameterNames.length); this.parameterNames.splice(0,this.parameterNames.length);
this.parameterValues.splice(0,this.parameterValues.length); this.parameterValues.splice(0,this.parameterValues.length);
@ -210,7 +214,7 @@ public getParametersFromUrl(params) {
this.parameterValues.push(this.searchUtils.keyword); this.parameterValues.push(this.searchUtils.keyword);
} }
console.info(allLimits);
return allLimits; return allLimits;
} }
@ -256,7 +260,12 @@ public getParametersFromUrl(params) {
this.searchUtils.page=page; this.searchUtils.page=page;
var table = $('#dpTable').DataTable(); var table = $('#dpTable').DataTable();
console.info(table);
console.info(table.page(page-1));
table.page( page - 1 ).draw( false ); table.page( page - 1 ).draw( false );
console.info("4");
// Object { page: 0, pages: 3, start: 0, end: 10, length: 10, recordsTotal: 28, recordsDisplay: 21, serverSide: false } // Object { page: 0, pages: 3, start: 0, end: 10, length: 10, recordsTotal: 28, recordsDisplay: 21, serverSide: false }
var info = table.page.info(); var info = table.page.info();
this.searchUtils.totalResults = info.recordsDisplay; this.searchUtils.totalResults = info.recordsDisplay;
@ -342,11 +351,11 @@ Transform initial - not filtered results to get the filtered number
let returnValue: boolean = false; let returnValue: boolean = false;
if(query) { if(query) {
if(row.title.name.toLowerCase().indexOf(query) > -1) { if(row.title && row.title.name.toLowerCase().indexOf(query) > -1) {
returnValue = true; returnValue = true;
} }
if(row.type.toLowerCase().indexOf(query) > -1) { if(row.type && row.type.toLowerCase().indexOf(query) > -1) {
returnValue = true; returnValue = true;
} }
@ -372,6 +381,22 @@ Transform initial - not filtered results to get the filtered number
} }
} }
if(row.name && row.name.toLowerCase().indexOf(query) > -1) {
returnValue = true;
}
if(row.acronym && row.acronym.toLowerCase().indexOf(query) > -1) {
returnValue = true;
}
if(row.grantId && row.grantId.toLowerCase().indexOf(query) > -1) {
returnValue = true;
}
if(row.funder && row.funder.toLowerCase().indexOf(query) > -1) {
returnValue = true;
}
if(!returnValue) { if(!returnValue) {
return false; return false;
} }
@ -388,6 +413,8 @@ Transform initial - not filtered results to get the filtered number
field = "type"; field = "type";
} else if(filter.title == "Compatibility Level") { } else if(filter.title == "Compatibility Level") {
field = "compatibility"; field = "compatibility";
} else if(filter.title == "Funder") {
field = "funder";
} }
if(row[field] == value.name) { if(row[field] == value.name) {
@ -424,7 +451,7 @@ Transform initial - not filtered results to get the filtered number
let returnValue: boolean = false; let returnValue: boolean = false;
if(query) { if(query) {
for(var i=0; i <5; i++){ for(var i=0; i <this.columnNames.length; i++){
var r= this.filterQuery(row[i], query); var r= this.filterQuery(row[i], query);
// console.log(query+" "+ row+" "+r); // console.log(query+" "+ row+" "+r);
if(r) { if(r) {
@ -447,6 +474,8 @@ Transform initial - not filtered results to get the filtered number
field = 1; field = 1;
} else if(filter.title == "Compatibility Level") { } else if(filter.title == "Compatibility Level") {
field = 4; field = 4;
} else if(filter.title == "Funder") {
field = 3
} }
r= this.filterQuery(row[field], value.name); r= this.filterQuery(row[field], value.name);
if(r) { if(r) {

View File

@ -80,6 +80,8 @@ export class EnvProperties {
adminToolsCommunity; adminToolsCommunity;
communityAPI;
csvLimit: number; csvLimit: number;
pagingLimit: number; pagingLimit: number;