finish organization landing page

This commit is contained in:
Alex Martzios 2022-05-05 13:44:46 +03:00
parent 057eec2a02
commit a40dfa0165
7 changed files with 441 additions and 412 deletions

View File

@ -15,17 +15,21 @@ import {OpenaireEntities} from '../../utils/properties/searchFields';
selector: 'projectsInModal',
template: `
<div *ngIf="fetchProjects.funders.length > 1" class="uk-margin-medium-bottom">
<div class="uk-margin-small-bottom uk-text-meta">Filter by Funder:</div>
<ul class="uk-list uk-list-divider uk-margin-remove">
<li *ngFor="let filter of fetchProjects.filters ">
<label *ngFor="let value of filter.values" class="uk-animation-fade uk-margin-small-right">
<input [(ngModel)]="value.selected" type="checkbox"
(ngModelChange)="filterChange(value.selected)"
class="uk-checkbox"/>
<span class="uk-text-bold"> {{value.name}}</span>
</label>
</li>
</ul>
<ng-container *ngFor="let filter of fetchProjects.filters">
<div class="uk-inline">
<button class="uk-button uk-button-default uk-button-small uk-margin-small-bottom" type="button">
{{filter.title}} <span uk-icon="chevron-down"></span>
</button>
<div uk-dropdown="mode: click" class="uk-width-large uk-overflow-auto" style="max-width:460px !important; ">
<div class="uk-padding-small uk-overflow-auto uk-height-max-large uk-height-min-medium">
<search-filter [filter]="filter"
[showResultCount]=true filterValuesNum="0"
(onFilterChange)="filterChange($event)" [actionRoute]="false">
</search-filter>
</div>
</div>
</div>
</ng-container>
</div>
<errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="'projects'"
tab_error_class=true></errorMessages>

View File

@ -13,12 +13,14 @@ import {PagingModule} from '../../utils/paging.module';
import {ErrorMessagesModule} from '../../utils/errorMessages.module';
import {NoLoadPaging} from "../../searchPages/searchUtils/no-load-paging.module";
import {SearchResultsModule} from "../../searchPages/searchUtils/searchResults.module";
import {SearchFilterModule} from '../../searchPages/searchUtils/searchFilter.module';
@NgModule({
imports: [
RouterModule, CommonModule, FormsModule,
ProjectsServiceModule, TabResultModule,
PagingModule, ErrorMessagesModule, NoLoadPaging, SearchResultsModule
PagingModule, ErrorMessagesModule, NoLoadPaging,
SearchResultsModule, SearchFilterModule
],
declarations: [
ProjectsInModalComponent

View File

@ -23,7 +23,7 @@ import {properties} from "../../../../environments/environment";
[class.uk-margin-bottom]="modal">
<p class="uk-margin-remove">
<span #content [id]="key" [class.uk-flex]="modal">
<span class="uk-text-meta uk-text-uppercase">{{key}}: </span>
<span class="uk-text-meta uk-text-small uk-text-uppercase">{{key}}: </span>
<span [class.uk-margin-small-left]="modal">
<ng-container *ngFor="let item of identifiers.get(key) let j=index">
<a *ngIf="key == 'doi' || key == 'pmc' || key == 'pmid' || key == 'handle'"

View File

@ -25,7 +25,7 @@
<li class="uk-text-center"
[title]="'Download reports'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportsModal()">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon>
</span>
@ -273,7 +273,7 @@
<div class="subtitle uk-flex uk-flex-middle">
<span class="uk-text-nowrap">Funder report</span>
<div input type="select" placeholder="Select a funder to download report" inputClass="flat x-small" class="uk-width-1-1 uk-margin-small-left"
[options]="fetchProjects.funders" [(value)]="funder">
[options]="funderOptions" [(value)]="funder">
</div>
</div>
<div class="uk-animation-slide-top-small uk-margin-top" *ngIf="funder && funder != ''">

View File

@ -25,6 +25,7 @@ import {IndexInfoService} from "../../utils/indexInfo.service";
import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment";
import {OpenaireEntities} from '../../utils/properties/searchFields';
import {Option} from '../../sharedComponents/input/input.component';
@Component({
selector: 'organization',
@ -95,6 +96,8 @@ export class OrganizationComponent {
private funderId: string;
private funderCount: number;
public funderOptions: Option[] = [];
public offset: number;
public stickyHeader: boolean = false;
public graph_offset: number = 0;
@ -761,6 +764,16 @@ export class OrganizationComponent {
}
}
public buildFunderOptions() {
this.funderOptions = [];
if(this.fetchProjects.funders && this.fetchProjects.funders.length > 0) {
for(let funder of this.fetchProjects.funders) {
this.funderOptions.push({"label": funder.name, "value": funder});
}
this.funder = this.funderOptions[0];
}
}
public scroll() {
HelperFunctions.scroll();
}

View File

@ -76,6 +76,7 @@ export class SearchFilterComponent implements OnInit, OnChanges {
ngOnChanges(changes: SimpleChanges) {
if (changes.filter) {
console.log(this.filter);
this.filter.values = this.filter.values.filter(value => !value.name.toLowerCase().includes('unknown') && !value.name.toLowerCase().includes('not available'));
if (this.filter.filterType == "radio") {
this.filter.radioValue = "";

View File

@ -12,17 +12,18 @@
Enermaps tool
</a></p>
</div>
</div>
<div class="uk-width-expand">
<div>
<!-- deposit searchPage URL -->
<!-- 1st section (small title, mail title and deposit link) -->
<div class="section1 uk-margin-bottom">
<!-- Deposit searchPage URL -->
<span class="uk-width-expand uk-flex-right">
<a *ngIf="result.websiteURL && promoteWebsiteURL" href="{{result.websiteURL}}" target="_blank" type="submit"
class=" uk-float-right uk-button uk-button-primary uk-padding uk-padding-remove-vertical uk-margin-small-left">
<span><span>Visit repository to deposit</span><span uk-icon="arrow-right"></span></span>
</a>
</span>
<!-- Small subtitle above title -->
<div class="uk-text-small uk-margin-small-bottom">
<span *ngIf="type" class="uk-text-capitalize type">{{type}}</span>
<span *ngIf="type && beforeTitle.length > 0"> . </span>
@ -35,7 +36,7 @@
</span>
</div>
<!-- Title -->
<div class="uk-margin-small-bottom">
<div>
<h2 class="uk-margin-remove uk-text-break uk-inline-block uk-h6">
<a *ngIf="!externalUrl && result.id && !(result.resultType == 'dataprovider' && result.compatibilityUNKNOWN) "
(click)="onClick()" [queryParams]="createParam()"
@ -52,7 +53,6 @@
[no title available]
</div>
</a>
<a *ngIf="externalUrl && result.id && !(result.resultType == 'dataprovider' && result.compatibilityUNKNOWN) "
(click)="onClick()"
target="_blank" [href]="externalUrl+result.id" class="custom-external uk-link uk-link-heading uk-width-expand">
@ -83,40 +83,14 @@
[no title available]
</div>
</div>
<hr *ngIf="result.websiteURL && promoteWebsiteURL">
<hr class="uk-margin-remove-bottom" *ngIf="result.websiteURL && promoteWebsiteURL">
</h2>
</div>
<!-- Funder -->
<div *ngIf="result.funderShortname || result.code" class="uk-margin-small-bottom">
<span *ngIf="result.funderShortname">
<span class="uk-text-meta">Funder: </span>
{{result.funderShortname}}
</span>
<span *ngIf="result.code" [class.uk-margin-left]="result.funderShortname">
<span class="uk-text-meta">{{openaireEntities.PROJECT}} Code: </span>
{{result.code}}
</span>
<!-- Currently not parsed -->
<!-- <span *ngIf="result.callIdentifier" [class.uk-margin-left]="(result.funderShortname || result.code)">-->
<!-- <span class="uk-text-muted">Call for proposal: </span>-->
<!-- {{result.callIdentifier}}-->
<!-- </span>-->
</div>
<!-- Funder Budget -->
<div *ngIf="result.budget || result.contribution" class="uk-margin-small-bottom">
<span *ngIf="result.budget">
<span class="uk-text-meta">Overall Budget: </span>
{{result.budget | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
<span *ngIf="result.contribution" [class.uk-margin-left]="result.budget">
<span class="uk-text-meta">Funder Contribution: </span>
{{result.contribution | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
</div>
<!-- 2nd section (labels only) -->
<div class="section2 uk-margin-bottom">
<!-- Labels -->
<div class="uk-margin-small-bottom">
<div>
<span
*ngIf="result.accessMode && result.accessMode.toLowerCase() !== 'not available'"
class="uk-label uk-text-truncate " [ngClass]="'uk-label-' + accessClass(result.accessMode)"
@ -169,6 +143,38 @@
Not yet registered
</span>{{' '}}
</div>
</div>
<!-- 3rd section (funders, budget, authors, PIDs, publisher etc.) -->
<div class="section3 uk-text-small uk-margin-bottom">
<!-- Funder -->
<div *ngIf="result.funderShortname || result.code" class="uk-margin-small-bottom">
<span *ngIf="result.funderShortname">
<span class="uk-text-meta">Funder: </span>
{{result.funderShortname}}
</span>
<span *ngIf="result.code" [class.uk-margin-left]="result.funderShortname">
<span class="uk-text-meta">{{openaireEntities.PROJECT}} Code: </span>
{{result.code}}
</span>
<!-- Currently not parsed -->
<!-- <span *ngIf="result.callIdentifier" [class.uk-margin-left]="(result.funderShortname || result.code)">-->
<!-- <span class="uk-text-muted">Call for proposal: </span>-->
<!-- {{result.callIdentifier}}-->
<!-- </span>-->
</div>
<!-- Funder Budget -->
<div *ngIf="result.budget || result.contribution" class="uk-margin-small-bottom">
<span *ngIf="result.budget">
<span class="uk-text-meta">Overall Budget: </span>
{{result.budget | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
<span *ngIf="result.contribution" [class.uk-margin-left]="result.budget">
<span class="uk-text-meta">Funder Contribution: </span>
{{result.contribution | number}}
<span *ngIf="result.currency">{{result.currency}}</span>
</span>
</div>
<!-- Authors -->
<div *ngIf="result.authors" class="uk-flex uk-margin-small-bottom">
<span class="uk-text-meta">Authors:&nbsp;</span>
@ -247,13 +253,6 @@
<span>{{(i == result.subjects.slice(0, 10).length - 1 && result.subjects.length > 10) ? "..." : ""}}</span>
</span>
</div>
</div>
<!-- Description -->
<div *ngIf="result.description" class="uk-margin-small-bottom multi-line-ellipsis lines-3">
<p class="uk-text-meta">
{{result.description}}
</p>
</div>
<!-- Download from-->
<div *ngIf="result.hostedBy_collectedFrom && result.hostedBy_collectedFrom.length > 0"
class="uk-margin-small-bottom">
@ -285,9 +284,19 @@
</div>
</div>
</div>
<!-- 4th section (description) -->
<div class="section4 uk-text-small">
<!-- Description -->
<div *ngIf="result.description" class="multi-line-ellipsis lines-3">
<p class="uk-text-meta">
{{result.description}}
</p>
</div>
</div>
<!--&& loggedIn -->
</div>
</div>
</div>
<!--&& loggedIn (card footer)-->
<div *ngIf="(result.pop_inf && result.DOI) ||
((properties.adminToolsPortalType == 'explore' || properties.adminToolsPortalType == 'community') &&
((showOrcid && result.identifiers && result.identifiers.size > 0) || result.orcidCreationDates?.length > 0))"