MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[Trunk | Library]: searchFilter.component.html & searchResultsPerPage.component.ts & searchSorting.component.ts & citeThis.component.ts: [Bug fix] Fix <mat-select> elements. 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@58258 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2020-03-13 16:11:36 +00:00
parent cea0278008
commit aec9795ebd
4 changed files with 93 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
landingPages/landing-utils/citeThis/citeThis.component.ts
View File

@ -13,7 +13,7 @@ declare var Sys:any;
<dl class="uk-description-list-line"> <dl class="uk-description-list-line">
<!--dt class="title">Cite this {{type}}</dt--> <!--dt class="title">Cite this {{type}}</dt-->
<dd class="line" > <dd class="line" >
<mat-select class="select matSelection" id="citations" name="citeselect" [(ngModel)]="selectedStyle" (ngModelChange)="styleChanged()" <mat-select class="matSelection" id="citations" name="citeselect" [(ngModel)]="selectedStyle" (ngModelChange)="styleChanged()"
[disableOptionCentering]="true" [disableOptionCentering]="true"
panelClass="matSelectionPanel"> panelClass="matSelectionPanel">
<mat-option value="0">select a citation style</mat-option> <mat-option value="0">select a citation style</mat-option>

14
searchPages/searchUtils/searchFilter.component.html
View File

@ -65,12 +65,18 @@
<span *ngIf="filter.values.length >= 99">* only the Top 100 values are shown</span> <span *ngIf="filter.values.length >= 99">* only the Top 100 values are shown</span>
<input class="uk-input uk-margin-small-bottom uk-width-1-1 " name="filter-keyword" placeholder="Search for {{filter.title}}" type="text" [(ngModel)]="keyword"> <input class="uk-input uk-margin-small-bottom uk-width-1-1 " name="filter-keyword" placeholder="Search for {{filter.title}}" type="text" [(ngModel)]="keyword">
<span *ngIf = "showResultCount === true" class="uk-width-5-6@m uk-width-1-1@s uk-align-right uk-margin-small-bottom"> <span *ngIf = "showResultCount === true" class="uk-flex-inline uk-flex-middle uk-width-5-6@m uk-width-1-1@s uk-align-right uk-margin-small-bottom">
<span class="uk-width-1-4 uk-text-muted"> Sort by:</span> <span class="uk-width-1-4 uk-text-muted"> Sort by:</span>
<select [(ngModel)]="sortBy"
class="uk-width-3-4@m uk-width-auto uk-select uk-hidden@m"
id="form-horizontal-select" name="select_order">
<option value="num">Results number</option>
<option value="name">Name</option>
</select>
<mat-select [(ngModel)]="sortBy" <mat-select [(ngModel)]="sortBy"
class="uk-select uk-width-3-4@m uk-width-auto matSelection" class="uk-width-3-4@m uk-width-auto matSelection uk-visible@m"
id="form-horizontal-select" name="select_order" id="form-horizontal-select1" name="select_order"
[disableOptionCentering]="true" panelClass="matSelectionPanel"> [disableOptionCentering]="true" panelClass="matSelectionPanel">
<mat-option value="num">Results number</mat-option> <mat-option value="num">Results number</mat-option>
<mat-option value="name">Name</mat-option> <mat-option value="name">Name</mat-option>
</mat-select> </mat-select>

39
searchPages/searchUtils/searchResultsPerPage.component.ts
View File

@ -3,16 +3,35 @@ import {Component, Input, Output, EventEmitter} from '@angular/core';
@Component({ @Component({
selector: 'search-results-per-page', selector: 'search-results-per-page',
template: ` template: `
<span> Results per page:</span> <!-- <span class="uk-grid">-->
<mat-select class="uk-select uk-width-auto uk-text-bold matSelection" id="form-horizontal-select" name="select_results_per_page" <!-- <div> Results per page:</div>-->
[(ngModel)]="size" (ngModelChange)="sizeChanged()" <!-- <div class="uk-width-small">-->
[disableOptionCentering]="true" <!-- <mat-select class="uk-width-auto uk-text-bold matSelection" id="form-horizontal-select" name="select_results_per_page"-->
panelClass="matSelectionPanel"> <!-- [(ngModel)]="size" (ngModelChange)="sizeChanged()"-->
<mat-option [value]="5" > 5</mat-option> <!-- [disableOptionCentering]="true"-->
<mat-option [value]="10">10</mat-option> <!-- panelClass="matSelectionPanel">-->
<mat-option [value]="20">20</mat-option> <!-- <mat-option [value]="5" > 5</mat-option>-->
<mat-option [value]="50">50</mat-option> <!-- <mat-option [value]="10">10</mat-option>-->
</mat-select> <!-- <mat-option [value]="20">20</mat-option>-->
<!-- <mat-option [value]="50">50</mat-option>-->
<!-- </mat-select>-->
<!-- </div>-->
<!-- </span>-->
<div>
<mat-form-field class="matSelectionFormField">
<mat-label>Results per page:</mat-label>
<mat-select [(ngModel)]="size" (ngModelChange)="sizeChanged()"
[disableOptionCentering]="true"
panelClass="matSelectionPanel"
class="uk-text-bold matSelection">
<mat-option [value]="5" > 5</mat-option>
<mat-option [value]="10">10</mat-option>
<mat-option [value]="20">20</mat-option>
<mat-option [value]="50">50</mat-option>
</mat-select>
</mat-form-field>
</div>
` `
}) })

72
searchPages/searchUtils/searchSorting.component.ts
View File

@ -3,27 +3,57 @@ import {Component, Input, Output, EventEmitter} from '@angular/core';
@Component({ @Component({
selector: 'search-sorting', selector: 'search-sorting',
template: ` template: `
<span class="uk-width-1-4"> Sort by:</span> <!-- <span class="uk-grid">-->
<mat-select *ngIf="(entityType != 'community' && entityType != 'funder' )" <!-- <div class=""> Sort by:</div>-->
class="uk-select uk-width-auto uk-text-bold matSelection" <!-- <div class="uk-width-small">-->
id="form-horizontal-select" name="select_results_per_page" <!-- <mat-select *ngIf="(entityType != 'community' && entityType != 'funder' )" -->
[disableOptionCentering]="true" <!-- class="uk-width-auto uk-text-bold matSelection" -->
panelClass="matSelectionPanel" <!-- id="form-horizontal-select" name="select_results_per_page"-->
[(ngModel)]="sortBy" (ngModelChange)="sortByChanged()"> <!-- [disableOptionCentering]="true"-->
<mat-option value="">Relevance</mat-option> <!-- panelClass="matSelectionPanel"-->
<mat-option value="resultdateofacceptance,descending">Date (most recent)</mat-option> <!-- [(ngModel)]="sortBy" (ngModelChange)="sortByChanged()">-->
<mat-option value="resultdateofacceptance,ascending">Date (least recent)</mat-option> <!-- <mat-option value="">Relevance</mat-option>-->
</mat-select> <!-- <mat-option value="resultdateofacceptance,descending">Date (most recent)</mat-option>-->
<mat-select *ngIf="(entityType == 'community' || entityType == 'funder')" <!-- <mat-option value="resultdateofacceptance,ascending">Date (least recent)</mat-option>-->
class="uk-select uk-width-auto uk-text-bold matSelection" <!-- </mat-select>-->
id="form-horizontal-select" name="select_results_per_page" <!-- <mat-select *ngIf="(entityType == 'community' || entityType == 'funder')" -->
[(ngModel)]="sortBy" (ngModelChange)="sortByChanged()" <!-- class="uk-width-small uk-text-bold matSelection" -->
[disableOptionCentering]="true" <!-- id="form-horizontal-select" name="select_results_per_page"-->
panelClass="matSelectionPanel"> <!-- [(ngModel)]="sortBy" (ngModelChange)="sortByChanged()"-->
<mat-option value="">Title</mat-option> <!-- [disableOptionCentering]="true"-->
<mat-option value="creationdate,descending">Creation Date (most recent)</mat-option> <!-- panelClass="matSelectionPanel">-->
<mat-option value="creationdate,ascending">Creation Date (least recent)</mat-option> <!-- <mat-option value="">Title</mat-option>-->
</mat-select> <!-- <mat-option value="creationdate,descending">Creation Date (most recent)</mat-option>-->
<!-- <mat-option value="creationdate,ascending">Creation Date (least recent)</mat-option>-->
<!-- </mat-select>-->
<!-- </div>-->
<!-- </span>-->
<div>
<mat-form-field class="matSelectionFormField">
<mat-label>Sort by:</mat-label>
<mat-select *ngIf="(entityType != 'community' && entityType != 'funder' )"
[(ngModel)]="sortBy" (ngModelChange)="sortByChanged()"
[disableOptionCentering]="true"
panelClass="matSelectionPanel"
class="uk-text-bold matSelection">
<mat-option value="">Relevance</mat-option>
<mat-option value="resultdateofacceptance,descending">Date (most recent)</mat-option>
<mat-option value="resultdateofacceptance,ascending">Date (least recent)</mat-option>
</mat-select>
<mat-select *ngIf="(entityType == 'community' || entityType == 'funder')">
class="uk-text-bold matSelection"
id="form-horizontal-select" name="select_results_per_page"
[(ngModel)]="sortBy" (ngModelChange)="sortByChanged()"
[disableOptionCentering]="true"
panelClass="matSelectionPanel">
<mat-option value="">Title</mat-option>
<mat-option value="creationdate,descending">Creation Date (most recent)</mat-option>
<mat-option value="creationdate,ascending">Creation Date (least recent)</mat-option>
</mat-select>
</mat-form-field>
</div>
` `
}) })