new inputs for search page and other overall tweaks

This commit is contained in:
Alex Martzios 2022-04-05 15:26:26 +03:00
parent 2b8d344bc9
commit dfd5876217
12 changed files with 134 additions and 190 deletions

View File

@ -30,14 +30,14 @@
class="uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid"
uk-grid>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
placeholder="Search page"
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
[bordered]="true" colorClass="uk-text-secondary"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
placeholder="Search page"
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
[bordered]="true" colorClass="uk-text-secondary"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div *ngIf="isPortalAdministrator">
<a (click)="newPage()"
class="uk-flex uk-flex-middle uk-text-uppercase">
class="uk-flex uk-flex-middle uk-text-uppercase">
<button class="large uk-icon-button uk-button-secondary">
<icon name="add"></icon>
</button>
@ -49,10 +49,10 @@
</div>
<div *ngIf="!showLoading && checkboxes.length > 0" class="uk-padding uk-padding-remove-top">
<div
class="uk-display-inline"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : null"
title="Select at least one page"><input id="checkAll" type="checkbox" (click)="selectAll()"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>
class="uk-display-inline"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : null"
title="Select at least one page"><input id="checkAll" type="checkbox" (click)="selectAll()"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>
<span *ngIf="getSelectedPages().length > 0" class="uk-margin-left uk-text-muted">
{{getSelectedPages().length}} pages selected </span>
<a class="uk-margin-left">Actions</a>
@ -68,7 +68,7 @@
</a>
</li>
<li *ngIf="isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
(click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
</ul>
</div>
</div>
@ -79,7 +79,7 @@
<div class="uk-grid uk-grid-divider uk-padding" uk-grid>
<div class="uk-grid uk-width-expand" uk-grid>
<div class=""><input id="{{check.page._id}}" class="checkBox" type="checkbox"
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
</div>
<div class="uk-width-expand">
<div class="title uk-margin-medium-bottom">Name</div>
@ -102,17 +102,17 @@
<div class="title uk-margin-medium-bottom">Help texts</div>
<div class=" uk-margin-small-bottom">
<a *ngIf="check.page.top || check.page.bottom || check.page.left || check.page.right"
class="helpContents"
[queryParams]="{pageId: check.page._id}"
routerLink="../helptexts">
class="helpContents"
[queryParams]="{pageId: check.page._id}"
routerLink="../helptexts">
Manage page help texts
<span *ngIf="pageHelpContentsCount[check.page._id]">({{pageHelpContentsCount[check.page._id]}})</span>
</a>
</div>
<div>
<a *ngIf="pageWithDivIds.includes(check.page._id)"
[queryParams]="{ pageId: check.page._id}"
routerLink="../classContents">Manage class help texts
[queryParams]="{ pageId: check.page._id}"
routerLink="../classContents">Manage class help texts
<span *ngIf="pageClassContentsCount[check.page._id]">({{pageClassContentsCount[check.page._id]}})</span>
</a>
</div>
@ -147,51 +147,42 @@
</ul>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
<div>No pages found</div>
</div>
</div>
</div>
</div>
<modal-alert #editModal (alertOutput)="pageSaveConfirmed($event)"
[okDisabled]="pageForm && (pageForm.invalid || !pageForm.dirty)">
[okDisabled]="pageForm && (pageForm.invalid || !pageForm.dirty)">
<form *ngIf="pageForm" [formGroup]="pageForm" class="uk-grid uk-child-width-1-1" uk-grid>
<div dashboard-input [formInput]="pageForm.get('route')"
type="text" label="Page route" placeholder="Write a route">
</div>
<div dashboard-input [formInput]="pageForm.get('name')"
type="text" placeholder="Write a name"
label="Page Name">
</div>
<div input placeholder="Route" [formInput]="pageForm.get('route')"></div>
<div input placeholder="Name" [formInput]="pageForm.get('name')"></div>
<ng-container *ngIf="isPortalAdministrator">
<div dashboard-input [formInput]="pageForm.get('type')"
type="select" placeholder="Choose a page Type"
label="Type" [options]="typeOptions">
</div>
<div dashboard-input [formInput]="pageForm.get('entities')" placeholder="Add an entity"
type="chips" [options]="allEntities" label="Entities">
</div>
<div dashboard-input type="select" label="Portal Type" placeholder="Choose a type"
[formInput]="pageForm.get('portalType')" [options]="portalUtils.portalTypes">
</div>
<div input placeholder="Type" [formInput]="pageForm.get('type')"
type="select" [options]="typeOptions"></div>
<div input placeholder="Add an entity" [formInput]="pageForm.get('entities')"
type="chips" [options]="allEntities"></div>
<div input placeholder="Choose a type" [formInput]="pageForm.get('portalType')"
type="select" [options]="portalUtils.portalTypes"></div>
<div class="form-group">
<div class="uk-form-label uk-text-bold uk-margin-small-bottom"> Select if this page have helptext at:</div>
<div class="uk-grid uk-grid-small uk-child-width-1-4" uk-grid>
<div dashboard-input [formInput]="pageForm.get('top')"
type="checkbox"
label="Top">
<div>
<label class="uk-margin-small-right">Top</label>
<input type="checkbox" class="uk-checkbox" formControlName="top">
</div>
<div dashboard-input [formInput]="pageForm.get('right')"
type="checkbox"
label="Right">
<div>
<label class="uk-margin-small-right">Right</label>
<input type="checkbox" class="uk-checkbox" formControlName="right">
</div>
<div dashboard-input [formInput]="pageForm.get('bottom')"
type="checkbox"
label="Bottom">
<div>
<label class="uk-margin-small-right">Bottom</label>
<input type="checkbox" class="uk-checkbox" formControlName="bottom">
</div>
<div dashboard-input [formInput]="pageForm.get('left')"
type="checkbox"
label="Left">
<div>
<label class="uk-margin-small-right">Left</label>
<input type="checkbox" class="uk-checkbox" formControlName="left">
</div>
</div>
<label class="uk-text-danger">

View File

@ -81,9 +81,9 @@
<div *ngIf="message" class="uk-margin-medium-bottom uk-text-small">
<div [innerHTML]="message | safeHtml"></div>
</div>
<div *ngIf="invited" class="uk-text-center">
<div dashboard-input [formInput]="invited"
placeholder="Write an email..."></div>
<div *ngIf="invited">
<div input [formInput]="invited"
placeholder="Email"></div>
</div>
</div>
</modal-alert>
@ -100,13 +100,10 @@
<modal-alert #createRoleModal (alertOutput)="createGroup()" [okDisabled]="roleFb && roleFb.invalid">
<div *ngIf="roleFb" class="uk-padding uk-padding-remove-horizontal">
<div class="uk-grid" uk-grid [formGroup]="roleFb">
<div dashboard-input [formInput]="roleFb.get('name')"
label="Name"
placeholder="Write a name..." class="uk-width-1-1"></div>
<div dashboard-input [formInput]="roleFb.get('description')"
label="Description"
type="textarea"
placeholder="Write a description..." class="uk-width-1-1"></div>
<div input [formInput]="roleFb.get('name')"
placeholder="Name" class="uk-width-1-1"></div>
<div input [formInput]="roleFb.get('description')" type="textarea"
placeholder="Description" class="uk-width-1-1"></div>
</div>
</div>
</modal-alert>

View File

@ -14,7 +14,7 @@
<ng-container *ngIf="type.selected">
<span class="uk-width-auto">
<a [attr.uk-tooltip]="'Remove ' + type.name" (click)="removeResultType(type.id)"
[class.uk-disabled]="disabled">
[class.uk-disabled]="disabled">
<span class="uk-label uk-flex uk-flex-middle">
<span class="uk-margin-small-right uk-width-expand">{{type.name}}</span>
<icon class="uk-text-muted" name="close" flex="true" ratio="0.7"></icon>
@ -29,7 +29,7 @@
<ng-container *ngIf="filter.selectedFromAndToValues">
<span class="uk-width-auto">
<a [attr.uk-tooltip]="'Remove ' + filter.selectedFromAndToValues" (click)="removeRangeFilter(filter)"
[class.uk-disabled]="disabled">
[class.uk-disabled]="disabled">
<span class="uk-label uk-flex uk-flex-middle">
<span class="uk-margin-small-right uk-width-expand">{{filter.selectedFromAndToValues}}</span>
<icon class="uk-text-muted" name="close" flex="true" ratio="0.7"></icon>
@ -45,7 +45,7 @@
<span *ngIf="!customFilter || (customFilter.isHiddenFilter && customFilter.valueId != value.id)"
class="uk-width-auto">
<a [attr.uk-tooltip]="'Remove ' + value.name" (click)="removeFilter(value, filter)"
[class.uk-disabled]="disabled">
[class.uk-disabled]="disabled">
<span class="uk-label uk-flex uk-flex-middle">
<span class="uk-margin-small-right uk-width-expand">{{value.name}}</span>
<icon class="uk-text-muted" name="close" flex="true" ratio="0.7"></icon>
@ -62,13 +62,13 @@
<div class="uk-flex uk-flex-middle">
<h4 class="uk-margin-right uk-margin-remove-bottom">Filters</h4>
<a *ngIf="(selectedRangeFilters + selectedFilters + selectedTypesNum)>0"
(click)="clearFilters()" class="uk-text-small"
[class.uk-disabled]="disabled" [class.uk-link-muted]="disabled">
(click)="clearFilters()" class="uk-text-small"
[class.uk-disabled]="disabled" [class.uk-link-muted]="disabled">
Clear All
</a>
</div>
<div *ngIf="searchUtils.refineStatus == errorCodes.LOADING && existingFiltersWithValues === 0"
class="uk-margin-top" role="alert">
class="uk-margin-top" role="alert">
<loading></loading>
</div>
<div
@ -80,10 +80,10 @@
<ul *ngIf="!showUnknownFilters" class="uk-list uk-list-xlarge">
<li *ngIf="filters.length > 0 && filters[0].values.length >0 && filters[0].filterId == 'resultbestaccessright'">
<search-filter [filterValuesNum]="filterValuesNum" [showMoreInline]="showMoreFilterValuesInline"
[isDisabled]="disabled"
[filter]="filters[0]" [showResultCount]=showResultCount
(onFilterChange)="filterChanged($event)" [quickFilter]="quickFilter"
[actionRoute]="true"></search-filter>
[isDisabled]="disabled"
[filter]="filters[0]" [showResultCount]=showResultCount
(onFilterChange)="filterChanged($event)" [quickFilter]="quickFilter"
[actionRoute]="true"></search-filter>
</li>
<li *ngIf="resultTypes && (filters.length > 0)">
<quick-selections [resultTypes]="resultTypes" (typeChange)="queryChanged($event)"
@ -98,9 +98,9 @@
<ng-container *ngFor="let filter of filters ">
<li *ngIf="filter.values && filter.values.length > 0 && filter.filterId != 'resultbestaccessright'">
<search-filter [filterValuesNum]="filterValuesNum" [showMoreInline]="showMoreFilterValuesInline"
[isDisabled]="disabled"
[filter]="filter" [showResultCount]=showResultCount
(onFilterChange)="filterChanged($event)" [actionRoute]="true"></search-filter>
[isDisabled]="disabled"
[filter]="filter" [showResultCount]=showResultCount
(onFilterChange)="filterChanged($event)" [actionRoute]="true"></search-filter>
</li>
</ng-container>
</ul>
@ -108,11 +108,11 @@
</ng-template>
<!-- TODO - Kostis Clean up -->
<div *ngIf="!includeOnlyResultsAndFilter" [class]="usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
(stickyForm?'':' ') :
(stickyForm?'':' ') :
(+ (stickyForm?'':' uk-section') +' uk-padding-remove-bottom uk-padding-remove-top ' +
((usedBy == 'deposit' || usedBy == 'orcid') ? ' uk-padding-remove-top ' : ' '))"
[attr.uk-sticky]="(stickyForm?'{animation:false;offset:100;top:90;cls-active:uk-active uk-sticky-below;cls-inactive:uk-sticky '+
(usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
[attr.uk-sticky]="(stickyForm?'{animation:false;offset:100;top:90;cls-active:uk-active uk-sticky-below;cls-inactive:uk-sticky '+
(usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
' uk-position-relative ' :(' uk-section ' ))+'}':null)">
<div [class]="' uk-background-norepeat uk-background-bottom-center uk-padding-remove-bottom uk-flex uk-flex-middle uk-background-fixed '+searchFormClass
+ (usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId')?
@ -151,7 +151,7 @@
</div>
</div>
<schema2jsonld *ngIf="url" [URL]="url" type="search" [name]=pageTitleWithFilters
[searchAction]=false [description]="metaDescription"></schema2jsonld>
[searchAction]=false [description]="metaDescription"></schema2jsonld>
<div id="tm-main" class="uk-margin-medium-top" [class.uk-margin-top]="stickyForm">
<ng-template #loading>
<loading></loading>
@ -168,7 +168,7 @@
<a href="#mobile-filters" uk-toggle>
<span class="uk-icon uk-margin-small-right uk-margin-small-left">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
data-svg="settings">
data-svg="settings">
<ellipse fill="none" stroke="#000" cx="6.11" cy="3.55" rx="2.11" ry="2.15"></ellipse>
<ellipse fill="none" stroke="#000" cx="6.11" cy="15.55" rx="2.11" ry="2.15"></ellipse>
<circle fill="none" stroke="#000" cx="13.15" cy="9.55" r="2.15"></circle>
@ -198,11 +198,11 @@
</div>
</div>
<div *ngIf="includeOnlyResultsAndFilter"
class="uk-margin-medium-top uk-margin-medium-bottom">
class="uk-margin-medium-top uk-margin-medium-bottom">
<a *ngIf="showSwitchSearchLink && advancedSearchLink" routerLinkActive="router-link-active"
[routerLink]="advancedSearchLink" style="z-index:1;"
[queryParams]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)"
[class]="((disabled)?' uk-disabled uk-link-muted ':'') +' portal-link uk-float-right '">Advanced
[routerLink]="advancedSearchLink" style="z-index:1;"
[queryParams]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)"
[class]="((disabled)?' uk-disabled uk-link-muted ':'') +' portal-link uk-float-right '">Advanced
search
</a>
</div>
@ -213,20 +213,20 @@
(existingFiltersWithValues > 0 || (selectedRangeFilters + selectedFilters + selectedTypesNum) > 0)
)
)"
class="uk-width-1-4@m search-filters uk-visible@m">
class="uk-width-1-4@m search-filters uk-visible@m">
<ng-container *ngTemplateOutlet="filters_column; context: {}"></ng-container>
</div>
<div class="uk-width-expand@m uk-with-1-1@s">
<!-- Results only for Custom Filter? -->
<div *ngIf="customFilter && !customFilter.isHiddenFilter &&
customFilter.selected == false && customFilter.promptToAddFilter"
class="uk-alert uk-animation-slide-top-small">
class="uk-alert uk-animation-slide-top-small">
Do you want to see results only for {{customFilter.valueName}}? <a
(click)="addCustomFilter();">Click here</a>.
</div>
<!-- Related results for Custom Filter Alert -->
<div *ngIf="openaireLink && (searchUtils.totalResults > 0 || !loadPaging )"
class="uk-alert uk-text-center uk-margin-small-top ">
class="uk-alert uk-text-center uk-margin-small-top ">
<span *ngIf="customFilter">The following results are related to <span class="portal-color"
>{{customFilter.valueName}}</span>.</span>
Are you interested to view more results? Visit
@ -270,12 +270,14 @@
<div
*ngIf="(results && searchUtils.totalResults > 0) || (!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING)">
<div class="uk-flex uk-flex-middle">
<search-results-per-page class="uk-margin-right" *ngIf="searchUtils.totalResults >= 50"
[size]="searchUtils.size"
(sizeChange)="sizeChanged($event)"
[isDisabled]="disabled">
</search-results-per-page>
<search-sorting *ngIf="sort"
<!-- TODO: Disabled functionality -->
<!-- [isDisabled]="disabled" -->
<div class="uk-width-1-2 uk-margin-right" *ngIf="searchUtils.totalResults >= 50">
<div input type="select" placeholder="Results per page:"
[options]="['5','10','20','50']" [(value)]="searchUtils.size"
(valueChange)="sizeChanged($event)"></div>
</div>
<search-sorting *ngIf="sort" class="uk-width-1-2"
[entityType]="entityType" [sortBy]="searchUtils.sortBy"
(sortByChange)="sortByChanged($event)"
[isDisabled]="disabled">
@ -283,21 +285,21 @@
</div>
</div>
<search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults"
[searchUtils]="searchUtils" [results]="results" [baseUrl]="searchUtils.baseUrl"
[parameterNames]="parameterNames" [parameterValues]="parameterValues"
[isDisabled]="disabled">
[searchUtils]="searchUtils" [results]="results" [baseUrl]="searchUtils.baseUrl"
[parameterNames]="parameterNames" [parameterValues]="parameterValues"
[isDisabled]="disabled">
</search-paging>
</div>
<div
*ngIf="(searchUtils.page <= pagingLimit) || (searchUtils.totalResults <= searchUtils.size*pagingLimit)"
class="uk-margin">
<search-result *ngIf="( entityType !='community' && entityType != 'stakeholder') && usedBy == 'search'"
[results]="results"
[status]=searchUtils.status
[type]="entityType"
[showLoading]="true" [properties]=properties [showImpactFactors]="(customFilter &&
customFilter.queryFieldName == 'communityId' && (customFilter.valueId ==
'elixir-gr' || customFilter.valueId == 'inspired-ris'))">
[results]="results"
[status]=searchUtils.status
[type]="entityType"
[showLoading]="true" [properties]=properties [showImpactFactors]="(customFilter &&
customFilter.queryFieldName == 'communityId' && (customFilter.valueId ==
'elixir-gr' || customFilter.valueId == 'inspired-ris'))">
</search-result>
<deposit-result *ngIf="usedBy == 'deposit'"
[results]="results"
@ -327,13 +329,13 @@
</div>
<div class="uk-margin-medium-top">
<search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults"
[searchUtils]="searchUtils" [results]="results" [baseUrl]="searchUtils.baseUrl"
[parameterNames]="parameterNames" [parameterValues]="parameterValues"
[isDisabled]="disabled">
[searchUtils]="searchUtils" [results]="results" [baseUrl]="searchUtils.baseUrl"
[parameterNames]="parameterNames" [parameterValues]="parameterValues"
[isDisabled]="disabled">
</search-paging>
</div>
<div *ngIf="showIndexInfo && searchUtils.status !== errorCodes.LOADING"
class="uk-margin-small-top uk-grid uk-child-width-1-2">
class="uk-margin-small-top uk-grid uk-child-width-1-2">
<!-- Last Index Info-->
<div class="">
<img src="assets/common-assets/graph.svg" style="opacity: 0.4; width:20px; height:22px" loading="lazy"

View File

@ -24,6 +24,7 @@ import {properties} from "../../../../environments/environment";
import {AlertModal} from "../../utils/modal/alert";
import {Subscriber} from "rxjs";
import {IndexInfoService} from "../../utils/indexInfo.service";
import { Option } from '../../sharedComponents/input/input.component';
declare var UIkit: any;
@ -128,6 +129,14 @@ export class NewSearchPageComponent {
currentValueToRemove;
currentFilterToRemove;
public indexUpdateDate: Date;
// public resultsPerPageOptions = [
// {label: '5', value: '5'},
// {label: '10', value: '10'},
// {label: '20', value: '20'},
// {label: '50', value: '50'},
// ];
constructor(private route: ActivatedRoute,
private location: Location,

View File

@ -10,7 +10,6 @@ import {RangeFilterModule} from "../../utils/rangeFilter/rangeFilter.module";
import {LoadingModalModule} from '../../utils/modal/loadingModal.module';
import {ReportsServiceModule} from '../../services/reportsService.module';
import {SearchPagingModule} from './searchPaging.module';
import {SearchResultsPerPageModule} from './searchResultsPerPage.module';
import {SearchSortingModule} from './searchSorting.module';
import {SearchDownloadModule} from './searchDownload.module';
import {ModalModule} from '../../utils/modal/modal.module';
@ -30,16 +29,18 @@ import {ClickModule} from "../../utils/click/click.module";
import {SearchResultsForOrcidModule} from "../../orcid/recommend-orcid-links/searchResultsForOrcid.module";
import {IconsModule} from "../../utils/icons/icons.module";
import {LoadingModule} from "../../utils/loading/loading.module";
import {InputModule} from '../../sharedComponents/input/input.module';
@NgModule({
imports: [
CommonModule, FormsModule, RouterModule, SearchFormModule, PortalSearchResultModule,
LoadingModalModule, ReportsServiceModule,
SearchPagingModule, SearchResultsPerPageModule, SearchSortingModule, SearchDownloadModule, ModalModule,
SearchPagingModule, SearchSortingModule, SearchDownloadModule, ModalModule,
SearchFilterModule, RangeFilterModule,
PiwikServiceModule, HelperModule, Schema2jsonldModule, SEOServiceModule, SearchResultsModule,
SearchResultsInDepositModule, SearchResultsForOrcidModule,
AdvancedSearchFormModule, QuickSelectionsModule, BreadcrumbsModule, AlertModalModule, ClickModule, IconsModule, LoadingModule
AdvancedSearchFormModule, QuickSelectionsModule, BreadcrumbsModule, AlertModalModule, ClickModule, IconsModule, LoadingModule,
InputModule
],
declarations: [
NewSearchPageComponent

View File

@ -24,9 +24,11 @@
<span class="uk-text-meta uk-margin-small-left">Top 100 values are
shown in the filters</span>
<div class="uk-grid uk-margin-small-left uk-flex uk-flex-bottom">
<input class="uk-input uk-margin-small-top uk-form-small uk-width-2-3@m uk-width-3-5@s text-input-box "
<!-- <input class="uk-input uk-margin-small-top uk-form-small uk-width-2-3@m uk-width-3-5@s text-input-box "
name="filter-keyword"
placeholder="Search..." type="text" [(ngModel)]="keyword">
placeholder="Search..." type="text" [(ngModel)]="keyword"> -->
<div input class="uk-width-2-3@m uk-width-3-5@s" placeholder="Search"
inputClass="inner x-small" [(value)]="keyword"></div>
<span *ngIf="showResultCount === true"
class="uk-width-1-3@m uk-width-2-5@s uk-padding-small uk-padding-remove-vertical uk-padding-remove-right">

View File

@ -7,10 +7,12 @@ import{SearchFilterModalComponent} from './searchFilterModal.component';
import {ModalModule} from '../../utils/modal/modal.module';
import { MatSelectModule } from "@angular/material/select";
import {RouterModule} from "@angular/router";
import {InputModule} from '../../sharedComponents/input/input.module';
@NgModule({
imports: [
CommonModule, FormsModule, ModalModule, MatSelectModule, RouterModule
CommonModule, FormsModule, ModalModule, MatSelectModule, RouterModule,
InputModule
],
declarations: [
SearchFilterComponent, SearchFilterModalComponent

View File

@ -1,35 +0,0 @@
import {Component, Input, Output, EventEmitter} from '@angular/core';
@Component({
selector: 'search-results-per-page',
template: `
<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" [disabled]="isDisabled"> 5</mat-option>
<mat-option [value]="10" [disabled]="isDisabled">10</mat-option>
<mat-option [value]="20" [disabled]="isDisabled">20</mat-option>
<mat-option [value]="50" [disabled]="isDisabled">50</mat-option>
</mat-select>
</mat-form-field>
</div>
`
})
export class SearchResultsPerPageComponent {
@Input() isDisabled: boolean = false;
@Input() size: number;
@Output() sizeChange = new EventEmitter();
constructor () {}
ngOnInit() {}
sizeChanged() {
this.sizeChange.emit(this.size);
}
}

View File

@ -1,24 +0,0 @@
import { NgModule} from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import {SearchResultsPerPageComponent} from './searchResultsPerPage.component';
import { MatSelectModule } from "@angular/material/select";
@NgModule({
imports: [
CommonModule, FormsModule, RouterModule, MatSelectModule
],
declarations: [
SearchResultsPerPageComponent
],
providers:[
],
exports: [
SearchResultsPerPageComponent
]
})
export class SearchResultsPerPageModule { }

View File

@ -4,29 +4,16 @@ import {Component, Input, Output, EventEmitter} from '@angular/core';
selector: 'search-sorting',
template: `
<div>
<mat-form-field class="matSelectionFormField">
<mat-label>Sort by:</mat-label>
<mat-select *ngIf="(entityType != 'community' && entityType != 'stakeholder' )"
[(ngModel)]="sortBy" (ngModelChange)="sortByChanged()"
[disableOptionCentering]="true"
panelClass="matSelectionPanel"
class="uk-text-bold matSelection">
<mat-option value="" [disabled]="isDisabled">Relevance</mat-option>
<mat-option value="resultdateofacceptance,descending" [disabled]="isDisabled">Date (most recent)</mat-option>
<mat-option value="resultdateofacceptance,ascending" [disabled]="isDisabled">Date (least recent)</mat-option>
</mat-select>
<!-- TODO: Disabled functionality -->
<div input *ngIf="(entityType != 'community' && entityType != 'stakeholder' )"
type="select" placeholder="Sort by:"
[options]="optionsA" [(value)]="sortBy"
(valueChange)="sortByChanged()"></div>
<mat-select *ngIf="(entityType == 'community' || entityType == 'stakeholder')"
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="" [disabled]="isDisabled">Title</mat-option>
<mat-option value="creationdate,descending" [disabled]="isDisabled">Creation Date (most recent)</mat-option>
<mat-option value="creationdate,ascending" [disabled]="isDisabled">Creation Date (least recent)</mat-option>
</mat-select>
</mat-form-field>
<div input *ngIf="(entityType == 'community' || entityType == 'stakeholder')"
type="select" placeholder="Sort by:"
[options]="optionsB" [(value)]="sortBy"
(valueChange)="sortByChanged()"></div>
</div>
`
})
@ -36,6 +23,16 @@ export class SearchSortingComponent {
@Input() sortBy: string = '';
@Input() entityType: string = '';
@Output() sortByChange = new EventEmitter();
public optionsA = [
{value: '', label: 'Relevance'},
{value: 'resultdateofacceptance,descending', label: 'Date (most recent)'},
{value: 'resultdateofacceptance,ascending', label: 'Date (least recent)'},
];
public optionsB = [
{value: '', label: 'Title'},
{value: 'creationdate,descending', label: 'Creation Date (most recent)'},
{value: 'creationdate,ascending', label: 'Creation Date (least recent)'},
];
constructor () {}

View File

@ -5,10 +5,12 @@ import { RouterModule } from '@angular/router';
import{SearchSortingComponent} from './searchSorting.component';
import { MatSelectModule } from "@angular/material/select";
import {InputModule} from '../../sharedComponents/input/input.module';
@NgModule({
imports: [
CommonModule, FormsModule, RouterModule, MatSelectModule
CommonModule, FormsModule, RouterModule, MatSelectModule,
InputModule
],
declarations: [
SearchSortingComponent

View File

@ -36,7 +36,7 @@
</div>
<!-- Title -->
<div class="uk-margin-small-bottom">
<h6 class="uk-margin-remove uk-text-break">
<h6 class="uk-margin-remove uk-text-break uk-inline-block">
<a *ngIf="!externalUrl && result.id && !(result.resultType == 'dataprovider' && result.compatibilityUNKNOWN) "
(click)="onClick()" [queryParams]="createParam()"
[routerLink]="url" class="uk-link uk-width-expand">