[develop | DONE | CHANGED]: newSearchPage.component.html: Restored number of results and keyword display & added uk-text-capitalize on selected filter labels.
This commit is contained in:
parent
c351349f8e
commit
dc1679c565
|
|
@ -1,11 +1,11 @@
|
|||
<ng-template #selected_filters_pills>
|
||||
<h1 class="uk-margin-remove">
|
||||
<div [class.uk-invisible]="list.children.length === 0">
|
||||
<div [class.uk-invisible]="list.children.length === 0" [class.uk-margin-top]="list.children.length > 0">
|
||||
<ul #list class="uk-grid uk-grid-small uk-flex-wrap" uk-grid>
|
||||
<ng-container *ngFor="let customFilter of customFilters">
|
||||
<ng-container *ngIf="customFilter.isHiddenFilter">
|
||||
<li class="uk-flex uk-flex-middle">
|
||||
<span class="uk-label uk-label-small uk-label-secondary uk-text-truncate target1">
|
||||
<span class="uk-text-capitalize uk-label uk-label-small uk-label-secondary uk-text-truncate target1">
|
||||
{{customFilter.valueName}}
|
||||
</span>
|
||||
</li>
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
<ng-container *ngFor="let type of resultTypes.values; let i = index;">
|
||||
<ng-container *ngIf="type.selected">
|
||||
<li class="">
|
||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target2">
|
||||
<span class="uk-text-capitalize uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target2">
|
||||
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">{{type.name}}</span>
|
||||
<button [class.uk-disabled]="disabled" (click)="removeResultType(type.id)" class="uk-close uk-icon" [disabled]="disabled">
|
||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||
|
|
@ -29,7 +29,7 @@
|
|||
<ng-container *ngFor="let filter of rangeFilters ">
|
||||
<ng-container *ngIf="filter.selectedFromAndToValues">
|
||||
<li class="">
|
||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target3">
|
||||
<span class="uk-text-capitalize uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target3">
|
||||
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">{{filter.selectedFromAndToValues}}</span>
|
||||
<button [class.uk-disabled]="disabled" (click)="removeRangeFilter(filter)" class="uk-close uk-icon" [disabled]="disabled">
|
||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
<ng-container *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; ">
|
||||
<li *ngIf="!customFilter || (customFilter.isHiddenFilter && customFilter.valueId != value.id)"
|
||||
class="">
|
||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target4">
|
||||
<span class="uk-text-capitalize uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target4">
|
||||
<span
|
||||
class="uk-margin-small-right uk-width-expand uk-text-truncate">
|
||||
<ng-container *ngIf="filter.type && (filter.type == 'boolean' || filter.type == 'triplet') else noboolean">
|
||||
|
|
@ -73,7 +73,7 @@
|
|||
<ng-container *ngIf="filter.countSelectedValues > 0">
|
||||
<ng-container *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; ">
|
||||
<li *ngIf="!customFilters || (customFilters[0].isHiddenFilter && customFilters[0].valueId != value.id)">
|
||||
<span class="uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target5">
|
||||
<span class="uk-text-capitalize uk-label uk-label-small uk-label-primary uk-flex uk-flex-middle target5">
|
||||
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">
|
||||
<ng-container *ngIf="filter.type && (filter.type == 'boolean' || filter.type == 'triplet') else noboolean">
|
||||
<span>{{filter.title}}:
|
||||
|
|
@ -310,31 +310,47 @@
|
|||
[href]="openaireLink+this.routerHelper.createQueryParamsString(this.parameterNames, this.parameterValues)"
|
||||
target="_blank"> OpenAIRE - Explore</a>.
|
||||
</div>
|
||||
<ng-container *ngIf="mobile">
|
||||
|
||||
<div class="uk-flex uk-flex-middle uk-flex-wrap uk-child-width-auto uk-flex-between">
|
||||
<!-- Total results, number of pages -->
|
||||
<div class="uk-margin-remove-bottom uk-text-truncate" [class.uk-margin-medium-right]="!mobile" [class.uk-margin-right]="mobile" [class.uk-h6]="!mobile">
|
||||
<ng-container *ngIf="results && searchUtils.totalResults > 0">
|
||||
<span>{{searchUtils.totalResults|number}}</span>
|
||||
<span class="uk-text-meta uk-text-capitalize"> {{type}}</span>
|
||||
<ng-container *ngIf="searchTerm && simpleView">
|
||||
<span class="uk-text-meta"> for </span>
|
||||
<span class="uk-text-bold">{{searchTerm}}</span>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="!simpleView && advancedSearchTerms > 0">
|
||||
<span class="uk-text-bold"> ({{advancedSearchTerms}} rule{{advancedSearchTerms == 1 ? '' : 's'}} applied)</span>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING">
|
||||
<span>{{oldTotalResults|number}}</span>
|
||||
<span class="uk-text-meta uk-text-capitalize"> {{type}}, page </span>
|
||||
<span>{{searchUtils.page | number}}</span>
|
||||
<span class="uk-text-meta"> of {{(totalPages(oldTotalResults)|number)}}</span>
|
||||
</ng-container>
|
||||
</div>
|
||||
<!-- Download results -->
|
||||
<div *ngIf="showDownload && (searchUtils.status !== errorCodes.LOADING || !loadPaging)"
|
||||
class="uk-margin-small-bottom uk-flex uk-flex-center">
|
||||
<div *ngIf="mobile && showDownload && (searchUtils.status !== errorCodes.LOADING || !loadPaging)"
|
||||
class="uk-flex uk-flex-center">
|
||||
<search-download
|
||||
*ngIf="( entityType !='community' && entityType != 'stakeholder') && usedBy == 'search'"
|
||||
[isDisabled]="disabled"
|
||||
[type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults">
|
||||
*ngIf="( entityType !='community' && entityType != 'stakeholder') && usedBy == 'search'"
|
||||
[isDisabled]="disabled"
|
||||
[type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults">
|
||||
</search-download>
|
||||
<ng-container *ngIf="properties.zenodoDumpUrl && entityType == 'result'">
|
||||
<a [href]="properties.zenodoDumpUrl" target="_blank" class=" uk-margin-left uk-button uk-button-link uk-flex uk-flex-middle">
|
||||
<img src="assets/common-assets/common/zenodoDump.png" width="20"><span class="uk-margin-xsmall-left">Data dump</span>
|
||||
<img src="assets/common-assets/common/zenodoDump.png" alt="Zenodo dump" width="20"><span class="uk-margin-xsmall-left">Data dump</span>
|
||||
</a>
|
||||
</ng-container>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div *ngIf="(searchUtils.status !== errorCodes.LOADING || !loadPaging) && !mobile" class="uk-flex uk-flex-top">
|
||||
<!-- filters pills -->
|
||||
<div class="uk-width-expand@m">
|
||||
<ng-container *ngTemplateOutlet="selected_filters_pills;"></ng-container>
|
||||
</div>
|
||||
<div class="uk-width-auto@m uk-margin-medium-left uk-flex uk-flex-middle">
|
||||
|
||||
<div *ngIf="!mobile" class="uk-margin-medium-left uk-flex uk-flex-middle">
|
||||
<div *ngIf="searchUtils.totalResults > 10 || sort || searchUtils.totalResults > searchUtils.size ||
|
||||
(!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING)"
|
||||
class="uk-grid uk-flex-middle uk-child-width-1-1 uk-child-width-1-2@m" uk-grid>
|
||||
class="uk-grid uk-flex-middle uk-child-width-1-1 uk-child-width-1-2@m" uk-grid>
|
||||
<div>
|
||||
<div class="uk-grid uk-flex-middle uk-grid-column-collapse" uk-grid>
|
||||
<search-sorting *ngIf="sort && searchUtils.totalResults > 0"
|
||||
|
|
@ -347,20 +363,27 @@
|
|||
</div>
|
||||
<!-- Download results -->
|
||||
<div *ngIf="showDownload && (searchUtils.status !== errorCodes.LOADING || !loadPaging)"
|
||||
class="uk-margin-small-left uk-flex uk-flex-middle" [class.uk-flex-center]="mobile" [class.uk-margin-medium-top]="mobile">
|
||||
class="uk-margin-small-left uk-flex uk-flex-middle" [class.uk-flex-center]="mobile" [class.uk-margin-medium-top]="mobile">
|
||||
<search-download
|
||||
*ngIf="( entityType !='community' && entityType != 'stakeholder') && usedBy == 'search'"
|
||||
[isDisabled]="disabled"
|
||||
[type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults">
|
||||
*ngIf="( entityType !='community' && entityType != 'stakeholder') && usedBy == 'search'"
|
||||
[isDisabled]="disabled"
|
||||
[type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults">
|
||||
</search-download>
|
||||
<ng-container *ngIf="properties.zenodoDumpUrl && entityType == 'result'">
|
||||
<a [href]="properties.zenodoDumpUrl" target="_blank" class=" uk-margin-left uk-button uk-button-link uk-flex uk-flex-middle">
|
||||
<img src="assets/common-assets/common/zenodoDump.png" width="20"><span class="uk-margin-xsmall-left">Data dump</span>
|
||||
<img src="assets/common-assets/common/zenodoDump.png" alt="Zenodo dump" width="20"><span class="uk-margin-xsmall-left">Data dump</span>
|
||||
</a>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="(searchUtils.status !== errorCodes.LOADING || !loadPaging) && !mobile" class="uk-flex uk-flex-top">
|
||||
<!-- filters pills -->
|
||||
<div class="uk-width-expand@m">
|
||||
<ng-container *ngTemplateOutlet="selected_filters_pills;"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
<div [class]="searchUtils.page > pagingLimit ? 'search-results' : ''"
|
||||
*ngIf="(searchUtils.page >= pagingLimit) && (searchUtils.totalResults > searchUtils.size*pagingLimit)">
|
||||
<p class="uk-alert uk-alert-warning" uk-alert>For more results please try a new, more specific query</p>
|
||||
|
|
|
|||
Loading…
Reference in New Issue