From 810387ccf578a0d7e28b7a322d6a6ae051d7fbd2 Mon Sep 17 00:00:00 2001 From: Alex Martzios Date: Thu, 2 Nov 2023 11:40:40 +0200 Subject: [PATCH] [WIP] progress on browse RFOs & RPOs - still needs styling changes and OA % field --- src/app/openaireLibrary | 2 +- .../browse-stakeholder.component.html | 133 ++++++++++++++++++ .../browse-stakeholder.component.ts | 90 +++++++++++- .../browse-stakeholder.module.ts | 11 +- src/assets/common-assets | 2 +- src/environments/environment.ts | 2 +- 6 files changed, 229 insertions(+), 11 deletions(-) create mode 100644 src/app/shared/browse-stakeholders/browse-stakeholder.component.html diff --git a/src/app/openaireLibrary b/src/app/openaireLibrary index 9213755..6492211 160000 --- a/src/app/openaireLibrary +++ b/src/app/openaireLibrary @@ -1 +1 @@ -Subproject commit 92137556626a25dec819f258a6cf49e5e7562443 +Subproject commit 6492211dc364a215f1e422d1ab07d356644c3019 diff --git a/src/app/shared/browse-stakeholders/browse-stakeholder.component.html b/src/app/shared/browse-stakeholders/browse-stakeholder.component.html new file mode 100644 index 0000000..5b00202 --- /dev/null +++ b/src/app/shared/browse-stakeholders/browse-stakeholder.component.html @@ -0,0 +1,133 @@ + +
+ +
+ + +
+
+
+
+ Grid + List +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+ No {{entities.STAKEHOLDERS}} available +
+ + + +
+ +
+ + + +
+ + + + + + + + + + + + + + + + + +
LogoNameTypeOpen Access %
+ +
+ + + OpenAIRE placeholder logo + +
+ 		+
+ {{item.name}} +
+ 		+
+ {{item.type}} +
+ 		+
+ % +
+
+
+ +
+ \ No newline at end of file diff --git a/src/app/shared/browse-stakeholders/browse-stakeholder.component.ts b/src/app/shared/browse-stakeholders/browse-stakeholder.component.ts index c3446e7..1c139e5 100644 --- a/src/app/shared/browse-stakeholders/browse-stakeholder.component.ts +++ b/src/app/shared/browse-stakeholders/browse-stakeholder.component.ts @@ -1,33 +1,111 @@ -import {Component, OnInit} from "@angular/core"; +import {ChangeDetectorRef, Component, OnInit} from "@angular/core"; import {ActivatedRoute, Router} from "@angular/router"; -import {StakeholderType} from "../../openaireLibrary/monitor/entities/stakeholder"; +import {Stakeholder, StakeholderEntities, StakeholderType} from "../../openaireLibrary/monitor/entities/stakeholder"; import {BaseComponent} from "../../openaireLibrary/sharedComponents/base/base.component"; import {StakeholderService} from "../../openaireLibrary/monitor/services/stakeholder.service"; +import {Option} from "../../openaireLibrary/sharedComponents/input/input.component"; +import {HelperFunctions} from "../../openaireLibrary/utils/HelperFunctions.class"; +import {LayoutService} from "src/app/openaireLibrary/dashboard/sharedComponents/sidebar/layout.service"; +import {FormBuilder, FormControl} from "@angular/forms"; +import {debounceTime, distinctUntilChanged} from "rxjs/operators"; +import {StakeholderUtils} from "src/app/openaireLibrary/monitor-admin/utils/indicator-utils"; @Component({ selector: 'browse-stakeholder', - template: `` + templateUrl: `browse-stakeholder.component.html` }) export class BrowseStakeholderComponent extends BaseComponent implements OnInit { + entities = StakeholderEntities; + stakeholderUtils: StakeholderUtils = new StakeholderUtils(); stakeholderType: StakeholderType; + stakeholders: Stakeholder[] = []; + filteredStakeholders: Stakeholder[] = []; + + showLoading: boolean = true; + isMobile: boolean = false; + + gridView: boolean = true; + sortOptions: Option[]; + pageOptions: number[] = [10, 20, 30, 40]; + sortBy: string = 'alphAsc'; + currentPage: number = 1; + pageSize: number = 10; + keywordControl: FormControl; constructor(private route: ActivatedRoute, private stakeholderService: StakeholderService, - protected _router: Router) { + protected _router: Router, + private layoutService: LayoutService, + private cdr: ChangeDetectorRef, + private fb: FormBuilder) { super(); } ngOnInit() { + this.subscriptions.push(this.layoutService.isMobile.subscribe(isMobile => { + this.isMobile = isMobile; + this.cdr.detectChanges(); + })); + this.sortOptions = [ + {value: 'alphAsc', label: 'Alphabetically Asc. (A-Z)'}, + {value: 'alphDsc', label: 'Alphabetically Dsc. (Z-A)'}, + {value: 'oaDsc', label: '"Open Access %" Dsc.'} + ]; this.stakeholderType = this.route.snapshot.data.type; if(!this.stakeholderType) { this.navigateToError(); } this.subscriptions.push(this.stakeholderService.getStakeholders(this.properties.monitorServiceAPIURL, this.stakeholderType).subscribe(stakeholders => { - console.log(stakeholders); - })) + this.stakeholders = stakeholders; + this.filteredStakeholders = stakeholders; + this.filteredStakeholders.sort((a, b) => a['name'].localeCompare(b['name'])); + this.showLoading = false; + })); + this.keywordControl = this.fb.control(''); + this.subscriptions.push(this.keywordControl.valueChanges.pipe(debounceTime(200), distinctUntilChanged()).subscribe(value => { + this.filtering(value); + })); } private navigateToError() { this._router.navigate([this.properties.errorLink], {queryParams: {'page': this._router.url}}); } + + private filtering(value) { + if(!value){ + this.filteredStakeholders = this.stakeholders; + } else { + this.filteredStakeholders = this.stakeholders.filter(item => (item['name'] && item['name'].toLowerCase().includes(value.toLowerCase())) || (item['alias'] && item['alias'].toLowerCase().includes(value.toLowerCase()))); + } + this.currentPage = 1; + } + + sortByChanged() { + switch(this.sortBy) { + case 'alphAsc': + this.stakeholders = this.stakeholders.sort((a, b) => a['name'].localeCompare(b['name'])); + break; + case 'alphDsc': + this.stakeholders = this.stakeholders.sort((a, b) => b['name'].localeCompare(a['name'])); + break; + case 'oaDsc': + // TODO: dont have an OA percentage yet + // this.stakeholders = this.stakeholders.sort((a, b) => b['openAccessPercentage'] - a['openAccessPercentage']); + break; + } + } + + sizeChanged($event) { + this.pageSize = $event; + this.currentPage = 1; + } + + updateCurrentPage($event) { + this.currentPage = $event.value; + HelperFunctions.scrollToId('target'); + } + + get typeAsLabel() { + return this.stakeholderUtils.types.find(type => type.value === this.stakeholderType).label; + } } diff --git a/src/app/shared/browse-stakeholders/browse-stakeholder.module.ts b/src/app/shared/browse-stakeholders/browse-stakeholder.module.ts index 614fd38..f1baee9 100644 --- a/src/app/shared/browse-stakeholders/browse-stakeholder.module.ts +++ b/src/app/shared/browse-stakeholders/browse-stakeholder.module.ts @@ -3,10 +3,17 @@ import {CommonModule} from "@angular/common"; import {BrowseStakeholderComponent} from "./browse-stakeholder.component"; import {RouterModule} from "@angular/router"; import {PreviousRouteRecorder} from "../../openaireLibrary/utils/piwik/previousRouteRecorder.guard"; +import {SearchInputModule} from "../../openaireLibrary/sharedComponents/search-input/search-input.module"; +import {LoadingModule} from "../../openaireLibrary/utils/loading/loading.module"; +import {InputModule} from "../../openaireLibrary/sharedComponents/input/input.module"; +import {PagingModule} from "../../openaireLibrary/utils/paging.module"; +import {LogoUrlPipeModule} from "../../openaireLibrary/utils/pipes/logoUrlPipe.module"; @NgModule({ - imports: [CommonModule, RouterModule.forChild([ - {path: '', component: BrowseStakeholderComponent, canDeactivate: [PreviousRouteRecorder]} + imports: [CommonModule, LoadingModule, SearchInputModule, InputModule, PagingModule, + LogoUrlPipeModule, + RouterModule.forChild([ + {path: '', component: BrowseStakeholderComponent, canDeactivate: [PreviousRouteRecorder]} ])], declarations: [BrowseStakeholderComponent], exports: [BrowseStakeholderComponent] diff --git a/src/assets/common-assets b/src/assets/common-assets index 0a58acb..d1b2d5e 160000 --- a/src/assets/common-assets +++ b/src/assets/common-assets @@ -1 +1 @@ -Subproject commit 0a58acbbd45074327642e132cd7deae31188a978 +Subproject commit d1b2d5e585722751792d12645d17f820cd6a7860 diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 21d9e36..a099edc 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -11,7 +11,7 @@ let props: EnvProperties = { environment: "development", searchAPIURLLAst: "http://beta.services.openaire.eu/search/v2/api/", searchResourcesAPIURL: "https://beta.services.openaire.eu/search/v2/api/resources", - monitorServiceAPIURL: "http://duffy.di.uoa.gr:19680/uoa-monitor-service", + monitorServiceAPIURL: "http://duffy.di.uoa.gr:19380/uoa-monitor-service", // monitorServiceAPIURL: "http://duffy.di.uoa.gr:19680/uoa-irish-monitor-service/", searchOrcidURL: "https://pub.orcid.org/v3.0/", piwikSiteId: "407",