Change search in order to apply mobile style
This commit is contained in:
parent
b256147682
commit
de42da8b6c
|
|
@ -46,8 +46,6 @@
|
|||
placeholder="Type keywords..."
|
||||
[(ngModel)]="selectedField.value" name="value[{{i}}]">
|
||||
</div>
|
||||
|
||||
|
||||
</td>
|
||||
<td *ngIf="selectedField.type == 'date'">
|
||||
<date-filter [dateValue]=selectedField.dateValue [validDateFrom]=validDateFrom class="uk-width-expand"
|
||||
|
|
@ -147,19 +145,19 @@
|
|||
</ng-container>
|
||||
<div *ngIf="simpleView" class="uk-flex uk-flex-center uk-flex-wrap">
|
||||
<div class="uk-width-xlarge@l uk-width-large">
|
||||
<div class="uk-margin-small-bottom uk-text-small uk-flex uk-flex-right" [class.uk-light]="dark" *ngIf="showSwitchSearchLink">
|
||||
<div class="uk-text-small uk-flex uk-flex-right" [class.uk-light]="dark" *ngIf="showSwitchSearchLink">
|
||||
<a *ngIf ="this.entityType !='all' && this.entityType == this.selectedEntity && advancedSearchLink"
|
||||
[routerLink]="advancedSearchLink" [queryParams]="advancedSearchLinkParameters"
|
||||
[routerLink]="advancedSearchLink" [queryParams]="advancedSearchLinkParameters" class="uk-margin-small-bottom"
|
||||
[ngClass]="(isDisabled)?'uk-disabled uk-link-muted':null">Advanced search
|
||||
</a>
|
||||
<a *ngIf =" this.entityType !='all' && this.entityType != this.selectedEntity && selectedEntityAdvancedUrl "
|
||||
[routerLink]="selectedEntityAdvancedUrl"
|
||||
[queryParams]="{q:this.selectedFields[0].value,op:'and'}"
|
||||
[queryParams]="{q:this.selectedFields[0].value,op:'and'}" class="uk-margin-small-bottom"
|
||||
[ngClass]="(isDisabled)?'uk-disabled uk-link-muted':null">Advanced search
|
||||
</a>
|
||||
<a *ngIf =" this.entityType =='all'"
|
||||
[routerLink]="properties.searchLinkToAdvancedResults"
|
||||
[queryParams]="advancedSearchLinkParameters"
|
||||
[queryParams]="advancedSearchLinkParameters" class="uk-margin-small-bottom"
|
||||
[ngClass]="(isDisabled)?'uk-disabled uk-link-muted':null">Advanced search
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -173,10 +171,18 @@
|
|||
[(value)]="selectedFields[0].value" tooltip="true"></div>
|
||||
</advanced-search-input>
|
||||
<div *ngIf="selectedFields[0] && disableSelect" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value"
|
||||
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()"></div>
|
||||
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()" [iconPosition]="isMobile?'left':'right'">
|
||||
<a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>
|
||||
<icon name="filters"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div *ngIf="selectedFields[0] && !entitiesSelection" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value"
|
||||
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()"></div>
|
||||
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()" [iconPosition]="isMobile?'left':'right'">
|
||||
<a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>
|
||||
<icon name="filters"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -41,6 +41,7 @@ export class AdvancedSearchFormComponent implements OnInit, OnDestroy, OnChanges
|
|||
@Output() queryChange = new EventEmitter();
|
||||
@Input() resultTypes;
|
||||
@Input() quickFilter: { filter: Filter, selected: boolean, filterId: string, value: string };
|
||||
@Input() isMobile: boolean = false;
|
||||
public disableSelect: boolean = false;
|
||||
validDateFrom: boolean = true;
|
||||
validDateTo: boolean = true;
|
||||
|
|
@ -60,6 +61,7 @@ export class AdvancedSearchFormComponent implements OnInit, OnDestroy, OnChanges
|
|||
selectedEntityAdvancedUrl;
|
||||
@Input() entitiesSelection: boolean;
|
||||
@Input() showSwitchSearchLink: boolean = true;
|
||||
@Output() filtersClicked: EventEmitter<boolean> = new EventEmitter<boolean>();
|
||||
sub;
|
||||
|
||||
constructor(private route: ActivatedRoute, private router: Router, private cdr: ChangeDetectorRef) {}
|
||||
|
|
|
|||
|
|
@ -10,26 +10,30 @@ import {DateFilterModule} from './dateFilter.module';
|
|||
import {SearchFormModule} from './searchForm.module';
|
||||
import {QuickSelectionsModule} from "./quick-selections.module";
|
||||
import {EntitiesSelectionModule} from "./entitiesSelection.module";
|
||||
import { MatSelectModule } from "@angular/material/select";
|
||||
import {MatSelectModule} from "@angular/material/select";
|
||||
import {IconsModule} from "../../utils/icons/icons.module";
|
||||
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
|
||||
import {AdvancedSearchInputModule} from "../../sharedComponents/advanced-search-input/advanced-search-input.module";
|
||||
import {InputModule} from "../../sharedComponents/input/input.module";
|
||||
import {IconsService} from "../../utils/icons/icons.service";
|
||||
import {filters} from "../../utils/icons/icons";
|
||||
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule, FormsModule, RouterModule, EntitiesAutocompleteModule, StaticAutocompleteModule, DateFilterModule, SearchFormModule, QuickSelectionsModule, EntitiesSelectionModule, MatSelectModule, IconsModule, SearchInputModule, AdvancedSearchInputModule, InputModule
|
||||
CommonModule, FormsModule, RouterModule, EntitiesAutocompleteModule, StaticAutocompleteModule, DateFilterModule,
|
||||
SearchFormModule, QuickSelectionsModule, EntitiesSelectionModule, MatSelectModule, IconsModule, SearchInputModule, AdvancedSearchInputModule, InputModule
|
||||
],
|
||||
declarations: [
|
||||
AdvancedSearchFormComponent,
|
||||
],
|
||||
|
||||
providers:[
|
||||
],
|
||||
exports: [
|
||||
AdvancedSearchFormComponent
|
||||
|
||||
]
|
||||
|
||||
]
|
||||
})
|
||||
export class AdvancedSearchFormModule { }
|
||||
export class AdvancedSearchFormModule {
|
||||
constructor(private iconsService: IconsService) {
|
||||
this.iconsService.registerIcons([filters]);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="uk-slider filters-slider" uk-slider="finite: true">
|
||||
<div [class.uk-invisible]="list.children.length === 0" class="uk-position-relative">
|
||||
<div class="uk-slider-container">
|
||||
<ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap">
|
||||
<ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap" style="padding-bottom: 1px">
|
||||
<ng-container *ngIf="customFilter && ((customFilterEnabled &&
|
||||
refineFields.indexOf(customFilter.queryFieldName) ==
|
||||
-1) ||customFilter.isHiddenFilter)">
|
||||
|
|
@ -113,56 +113,81 @@
|
|||
</ul>
|
||||
</div>
|
||||
</ng-template>
|
||||
<!-- TODO - Clean up -->
|
||||
<div *ngIf="!includeOnlyResultsAndFilter" [class]="usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
|
||||
<ng-template #sorting let-mobile="mobile">
|
||||
<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>
|
||||
<div>
|
||||
<div class="uk-grid uk-flex-middle uk-grid-column-collapse" uk-grid>
|
||||
<div *ngIf="searchUtils.totalResults > 10 && !mobile" class="uk-width-small uk-margin-right">
|
||||
<div input type="select" placeholder="Results per page" inputClass="flat x-small"
|
||||
[options]="pageOptions" [(value)]="searchUtils.size" [disabled]="disabled"
|
||||
(valueChange)="sizeChanged($event)"></div>
|
||||
</div>
|
||||
<search-sorting *ngIf="sort && searchUtils.totalResults > 0"
|
||||
[entityType]="entityType" [sortBy]="searchUtils.sortBy"
|
||||
(sortByChange)="sortByChanged($event)"
|
||||
[isDisabled]="disabled">
|
||||
</search-sorting>
|
||||
</div>
|
||||
</div>
|
||||
<search-paging *ngIf="!mobile" [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults"
|
||||
[searchUtils]="searchUtils" [results]="results" [baseUrl]="searchUtils.baseUrl"
|
||||
[parameterNames]="parameterNames" [parameterValues]="parameterValues"
|
||||
[isDisabled]="disabled">
|
||||
</search-paging>
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #main let-mobile="mobile">
|
||||
<!-- TODO - Clean up -->
|
||||
<div *ngIf="!includeOnlyResultsAndFilter" [class]="usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
|
||||
(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 '+
|
||||
[attr.uk-sticky]="((stickyForm || mobile)?'{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" [ngClass]="searchForm.class">
|
||||
<div class="uk-width-1-1">
|
||||
<div *ngIf="showBreadcrumb" class="uk-container uk-container-large" [class.uk-light]="searchForm.dark">
|
||||
<div class="uk-margin-top">
|
||||
<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
|
||||
<div class="uk-background-norepeat uk-background-bottom-center" [ngClass]="searchForm.class">
|
||||
<div class="uk-width-1-1">
|
||||
<div *ngIf="showBreadcrumb && !mobile" class="uk-container uk-container-large uk-section uk-section-small uk-padding-remove-bottom" [class.uk-light]="searchForm.dark">
|
||||
<div class="uk-margin-top">
|
||||
<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-container uk-section uk-section-small uk-margin-bottom" id="searchForm">
|
||||
<div class="uk-grid uk-flex uk-flex-middle uk-flex-center" uk-grid>
|
||||
<div [class]="'uk-width-1-1'+(simpleView?' uk-width-auto@m' : '')"><div id="searchImage"></div></div>
|
||||
<advanced-search-form class="uk-width-expand uk-padding-remove-vertical"
|
||||
[entityType]="entityType"
|
||||
[fieldIds]="fieldIds"
|
||||
[fieldIdsMap]="fieldIdsMap"
|
||||
[selectedFields]="selectedFields"
|
||||
(queryChange)="queryChanged($event)"
|
||||
[isDisabled]="disabled"
|
||||
[dark]="searchForm.dark"
|
||||
[simpleSearchLink]="simpleSearchLink"
|
||||
[advancedSearchLink]="advancedSearchLink"
|
||||
[advancedSearchLinkParameters]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)"
|
||||
[simpleView]="simpleView" [formPlaceholderText]="formPlaceholderText"
|
||||
[resultTypes]="resultTypes" [quickFilter]="quickFilter" [entitiesSelection]="entitiesSelection"
|
||||
[showSwitchSearchLink]="showSwitchSearchLink" [customFilter]="customFilter"
|
||||
>
|
||||
</advanced-search-form>
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-container uk-section uk-section-small uk-margin-bottom" id="searchForm">
|
||||
<div class="uk-grid uk-flex uk-flex-middle uk-flex-center" uk-grid>
|
||||
<div [class]="'uk-width-1-1'+(simpleView?' uk-width-auto@m' : '')"><div id="searchImage"></div></div>
|
||||
<advanced-search-form class="uk-width-expand uk-padding-remove-vertical"
|
||||
[entityType]="entityType"
|
||||
[fieldIds]="fieldIds"
|
||||
[fieldIdsMap]="fieldIdsMap"
|
||||
[selectedFields]="selectedFields"
|
||||
(queryChange)="queryChanged($event)"
|
||||
[isDisabled]="disabled"
|
||||
[dark]="searchForm.dark"
|
||||
[simpleSearchLink]="simpleSearchLink"
|
||||
[advancedSearchLink]="advancedSearchLink"
|
||||
[advancedSearchLinkParameters]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)"
|
||||
[simpleView]="simpleView" [formPlaceholderText]="formPlaceholderText" [isMobile]="mobile"
|
||||
[resultTypes]="resultTypes" [quickFilter]="quickFilter" [entitiesSelection]="entitiesSelection"
|
||||
[showSwitchSearchLink]="showSwitchSearchLink" [customFilter]="customFilter" (filtersClicked)="showOffCanvas = $event"
|
||||
>
|
||||
</advanced-search-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<schema2jsonld *ngIf="url" [URL]="url" type="search" [name]=pageTitleWithFilters
|
||||
[searchAction]=false [description]="metaDescription"></schema2jsonld>
|
||||
<div id="tm-main" [class.uk-margin-medium-top]="!includeOnlyResultsAndFilter && properties.adminToolsPortalType != 'eosc'"
|
||||
[class.uk-margin-top]="stickyForm">
|
||||
<ng-template #loading>
|
||||
<loading [ngClass]="'uk-height-medium uk-display-block uk-margin-xlarge-top'"></loading>
|
||||
</ng-template>
|
||||
<ng-template [ngIf]="searchUtils.refineStatus != errorCodes.LOADING || existingFiltersWithValues !== 0" [ngIfElse]="loading">
|
||||
<div class="uk-container uk-container-large search-results-container">
|
||||
<schema2jsonld *ngIf="url" [URL]="url" type="search" [name]=pageTitleWithFilters
|
||||
[searchAction]=false [description]="metaDescription"></schema2jsonld>
|
||||
<div id="tm-main" [class.uk-margin-medium-top]="!includeOnlyResultsAndFilter && properties.adminToolsPortalType != 'eosc'" [class.uk-margin-top]="stickyForm">
|
||||
<ng-template #loading>
|
||||
<loading class="uk-height-medium uk-display-block uk-margin-xlarge-top"></loading>
|
||||
</ng-template>
|
||||
<ng-template [ngIf]="searchUtils.refineStatus != errorCodes.LOADING || existingFiltersWithValues !== 0" [ngIfElse]="loading">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div [class.uk-margin-top]="properties.adminToolsPortalType == 'eosc'" >
|
||||
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
|
||||
[texts]="pageContents['top']"></helper>
|
||||
|
|
@ -172,34 +197,19 @@
|
|||
</quick-selections>
|
||||
</div>
|
||||
<div [class]="showRefine? 'uk-width-4-5@m uk-width-4-5@l uk-width-1-1@s' :'uk-width-1-1'">
|
||||
<div *ngIf="showRefine" class="uk-hidden@m uk-margin-top">
|
||||
<a href="#mobile-filters" uk-toggle (click)="showOffCanvas=true;">
|
||||
<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">
|
||||
<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>
|
||||
<rect x="1" y="3" width="3" height="1"></rect>
|
||||
<rect x="10" y="3" width="8" height="1"></rect>
|
||||
<rect x="1" y="9" width="8" height="1"></rect>
|
||||
<rect x="15" y="9" width="3" height="1"></rect>
|
||||
<rect x="1" y="15" width="3" height="1"></rect>
|
||||
<rect x="10" y="15" width="8" height="1"></rect>
|
||||
</svg>
|
||||
</span>
|
||||
<span>Filters <span
|
||||
*ngIf="(selectedRangeFilters+selectedFilters) > 0">
|
||||
({{(selectedRangeFilters + selectedFilters)}})</span>
|
||||
</span>
|
||||
</a>
|
||||
<div #mobileFilters id="mobile-filters" uk-offcanvas="overlay: true" style="z-index:10000;">
|
||||
<div class="uk-offcanvas-bar">
|
||||
<div *ngIf="showRefine && mobile">
|
||||
<div #mobileFilters id="mobile-filters" uk-offcanvas="overlay: true">
|
||||
<div class="uk-offcanvas-bar uk-padding-remove-horizontal">
|
||||
<a class="uk-offcanvas-close uk-icon uk-close" (click)="showOffCanvas=false">
|
||||
<icon name="close" ratio="1.5" visuallyHidden="close filters"></icon>
|
||||
</a>
|
||||
<div *ngIf="showOffCanvas">
|
||||
<ng-container *ngTemplateOutlet="filters_column; context: {}"></ng-container>
|
||||
<div *ngIf="showOffCanvas" class="uk-padding-small uk-padding-remove-vertical">
|
||||
<div class="uk-margin-medium-top">
|
||||
<ng-container *ngTemplateOutlet="sorting; context: {mobile: mobile}"></ng-container>
|
||||
</div>
|
||||
<div class="uk-margin-medium-top">
|
||||
<ng-container *ngTemplateOutlet="filters_column; context: {}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -207,33 +217,33 @@
|
|||
</div>
|
||||
<div *ngIf="includeOnlyResultsAndFilter && showSwitchSearchLink && advancedSearchLink" class="uk-margin-medium-top uk-margin-medium-bottom">
|
||||
<a 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 ':'') +'uk-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 ':'') +'uk-link uk-float-right '">Advanced
|
||||
search
|
||||
</a>
|
||||
</div>
|
||||
<div class="uk-grid uk-margin-medium-top uk-margin-large-bottom" uk-grid>
|
||||
<div *ngIf="showRefine && (results.length > 0
|
||||
|| (searchUtils.refineStatus == errorCodes.LOADING && searchUtils.status != errorCodes.LOADING)
|
||||
|| (!hideFilters &&
|
||||
(existingFiltersWithValues > 0 || (selectedRangeFilters + selectedFilters + selectedTypesNum) > 0)
|
||||
)
|
||||
)"
|
||||
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">
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-container" [class.uk-container-large]="!mobile" [class.uk-container-expand]="mobile" [class.uk-padding-remove-horizontal]="mobile">
|
||||
<div class="uk-grid uk-margin-large-bottom" [class.uk-margin-top]="!mobile" uk-grid>
|
||||
<div *ngIf="!mobile && showRefine && (results.length > 0 || (searchUtils.refineStatus == errorCodes.LOADING && searchUtils.status != errorCodes.LOADING) || (!hideFilters &&
|
||||
(existingFiltersWithValues > 0 || (selectedRangeFilters + selectedFilters + selectedTypesNum) > 0))) "
|
||||
class="uk-width-1-4@m search-filters">
|
||||
<ng-container *ngTemplateOutlet="filters_column; context: {}"></ng-container>
|
||||
</div>
|
||||
<div class="uk-width-expand@m uk-with-1-1@s">
|
||||
<div [class.uk-padding-small]="mobile" class="uk-padding-remove-vertical">
|
||||
<!-- 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-margin-small-top ">
|
||||
class="uk-alert uk-margin-small-top ">
|
||||
<span *ngIf="customFilter">The following results are related to <span class="uk-text-primary uk-text-bold"
|
||||
>{{customFilter.valueName}}</span>.</span>
|
||||
Are you interested to view more results? Visit
|
||||
|
|
@ -242,7 +252,7 @@
|
|||
[href]="openaireLink+this.routerHelper.createQueryParamsString(this.parameterNames, this.parameterValues)"
|
||||
target="_blank"> OpenAIRE - Explore</a>.
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-between uk-flex-middle uk-flex-wrap uk-margin-bottom">
|
||||
<div class="uk-flex uk-flex-between uk-flex-middle uk-flex-wrap">
|
||||
<!-- Total results, number of pages -->
|
||||
<h6 class="uk-margin-remove">
|
||||
<ng-container *ngIf="results && searchUtils.totalResults > 0">
|
||||
|
|
@ -268,72 +278,52 @@
|
|||
</search-download>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="(searchUtils.status !== errorCodes.LOADING || !loadPaging)">
|
||||
<div *ngIf="(searchUtils.status !== errorCodes.LOADING || !loadPaging) && !mobile" class="uk-margin-top">
|
||||
<ng-container *ngTemplateOutlet="selected_filters_pills;"></ng-container>
|
||||
</div>
|
||||
<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-margin-medium-top" uk-grid>
|
||||
<div>
|
||||
<div class="uk-flex uk-flex-middle">
|
||||
<div *ngIf="searchUtils.totalResults > 10" class="uk-width-small uk-margin-right">
|
||||
<div input type="select" placeholder="Results per page" inputClass="flat x-small"
|
||||
[options]="pageOptions" [(value)]="searchUtils.size" [disabled]="disabled"
|
||||
(valueChange)="sizeChanged($event)"></div>
|
||||
</div>
|
||||
<search-sorting *ngIf="sort && searchUtils.totalResults > 0"
|
||||
[entityType]="entityType" [sortBy]="searchUtils.sortBy"
|
||||
(sortByChange)="sortByChanged($event)"
|
||||
[isDisabled]="disabled">
|
||||
</search-sorting>
|
||||
</div>
|
||||
</div>
|
||||
<search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults"
|
||||
[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>
|
||||
</search-result>
|
||||
<deposit-result *ngIf="usedBy == 'deposit'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[zenodoInformation]="zenodoInformation"
|
||||
[properties]=properties>
|
||||
</deposit-result>
|
||||
<orcid-result *ngIf="usedBy == 'orcid'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[properties]=properties>
|
||||
</orcid-result>
|
||||
<portal-search-result
|
||||
*ngIf="(entityType == 'community' || entityType == 'stakeholder') && usedBy == 'search'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[showType]="entityType == 'stakeholder'"
|
||||
[showLoading]="true" [properties]=properties>
|
||||
</portal-search-result>
|
||||
<div *ngIf="!mobile" class="uk-margin-medium-topuk-margin-medium-top">
|
||||
<ng-container *ngTemplateOutlet="sorting; context: {mobile: mobile}"></ng-container>
|
||||
</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>
|
||||
</div>
|
||||
</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>
|
||||
</search-result>
|
||||
<deposit-result *ngIf="usedBy == 'deposit'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[zenodoInformation]="zenodoInformation"
|
||||
[properties]=properties>
|
||||
</deposit-result>
|
||||
<orcid-result *ngIf="usedBy == 'orcid'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[properties]=properties>
|
||||
</orcid-result>
|
||||
<portal-search-result
|
||||
*ngIf="(entityType == 'community' || entityType == 'stakeholder') && usedBy == 'search'"
|
||||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[showType]="entityType == 'stakeholder'" [isMobile]="mobile"
|
||||
[showLoading]="true" [properties]=properties>
|
||||
</portal-search-result>
|
||||
</div>
|
||||
<div [class.uk-padding-small]="mobile" class="uk-padding-remove-vertical">
|
||||
<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" [isMobile]="mobile">
|
||||
</search-paging>
|
||||
</div>
|
||||
<div *ngIf="showIndexInfo && searchUtils.status !== errorCodes.LOADING" class="uk-margin-large-top uk-grid uk-child-width-1-2 uk-text-small">
|
||||
|
|
@ -341,24 +331,31 @@
|
|||
<div>
|
||||
<icon name="graph" customClass="text-graph"></icon>
|
||||
<span class="uk-margin-small-left uk-text-baseline">
|
||||
<span class="uk-text-meta">Powered by </span>
|
||||
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
|
||||
</span>
|
||||
<span class="uk-text-meta">Powered by </span>
|
||||
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="uk-text-right">
|
||||
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
|
||||
<a *ngIf="properties.showLastIndexInformationLink" class="uk-link" [href]="properties.lastIndexInformationLink" target="_blank">Last update</a>
|
||||
<span *ngIf="!(properties.showLastIndexInformationLink)">Last update</span>
|
||||
of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
|
||||
</span>
|
||||
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
|
||||
<a *ngIf="properties.showLastIndexInformationLink" class="uk-link" [href]="properties.lastIndexInformationLink" target="_blank">Last update</a>
|
||||
<span *ngIf="!(properties.showLastIndexInformationLink)">Last update</span>
|
||||
of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
|
||||
[texts]="pageContents['bottom']"></helper>
|
||||
</div>
|
||||
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
|
||||
[texts]="pageContents['bottom']"></helper>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</ng-template>
|
||||
</div>
|
||||
</ng-template>
|
||||
<div *ngIf="!isMobile" class="uk-visible@m">
|
||||
<ng-container *ngTemplateOutlet="main; context: {mobile: false}"></ng-container>
|
||||
</div>
|
||||
<div *ngIf="isMobile || isServer" class="uk-hidden@m">
|
||||
<ng-container *ngTemplateOutlet="main; context: {mobile: true}"></ng-container>
|
||||
</div>
|
||||
<modal-alert #removeCustomFilter (alertOutput)="closeCustomFilterModal()"></modal-alert>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
import {
|
||||
ChangeDetectorRef,
|
||||
Component,
|
||||
ElementRef,
|
||||
ElementRef, Inject,
|
||||
Input,
|
||||
OnChanges,
|
||||
OnDestroy,
|
||||
OnInit,
|
||||
OnInit, PLATFORM_ID,
|
||||
SimpleChanges,
|
||||
ViewChild
|
||||
} from '@angular/core';
|
||||
import {Location} from '@angular/common';
|
||||
import {isPlatformServer, Location} from '@angular/common';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import {Meta, Title} from '@angular/platform-browser';
|
||||
|
||||
|
|
@ -35,6 +35,8 @@ import {AlertModal} from "../../utils/modal/alert";
|
|||
import {Subscriber} from "rxjs";
|
||||
import {IndexInfoService} from "../../utils/indexInfo.service";
|
||||
import {Background} from "../../utils/background-utils";
|
||||
import {LayoutService} from "../../dashboard/sharedComponents/sidebar/layout.service";
|
||||
import {Platform} from "@angular/cdk/platform";
|
||||
|
||||
export interface SearchForm extends Background {}
|
||||
|
||||
|
|
@ -147,13 +149,8 @@ export class NewSearchPageComponent implements OnInit, OnDestroy, OnChanges {
|
|||
currentFilterToRemove;
|
||||
public indexUpdateDate: Date;
|
||||
showOffCanvas:boolean = false;
|
||||
// public resultsPerPageOptions = [
|
||||
// {label: '5', value: '5'},
|
||||
// {label: '10', value: '10'},
|
||||
// {label: '20', value: '20'},
|
||||
// {label: '50', value: '50'},
|
||||
// ];
|
||||
|
||||
isMobile: boolean = false;
|
||||
isServer: boolean;
|
||||
|
||||
constructor(private route: ActivatedRoute,
|
||||
private location: Location,
|
||||
|
|
@ -163,7 +160,10 @@ export class NewSearchPageComponent implements OnInit, OnDestroy, OnChanges {
|
|||
private router: Router,
|
||||
private seoService: SEOService,
|
||||
private helper: HelperService,
|
||||
private layoutService: LayoutService,
|
||||
@Inject(PLATFORM_ID) private platform: any,
|
||||
private cdr: ChangeDetectorRef, private indexInfoService: IndexInfoService) {
|
||||
this.isServer = isPlatformServer(this.platform);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
|
@ -178,6 +178,10 @@ export class NewSearchPageComponent implements OnInit, OnDestroy, OnChanges {
|
|||
if (typeof document !== 'undefined' && this.isPiwikEnabled && !this.includeOnlyResultsAndFilter && this.piwikSiteId) {
|
||||
this.subscriptions.push(this._piwikService.trackView(this.properties, this.pageTitle, this.piwikSiteId).subscribe());
|
||||
}
|
||||
this.layoutService.isMobile.subscribe(isMobile => {
|
||||
this.isMobile = isMobile;
|
||||
this.cdr.detectChanges();
|
||||
});
|
||||
this.route.queryParams.subscribe(params => {
|
||||
if (params['page'] && params['page'] != 1) {
|
||||
HelperFunctions.scrollToId("searchForm");
|
||||
|
|
|
|||
|
|
@ -1,71 +1,40 @@
|
|||
<ul class="uk-list uk-list-xlarge" [class]="'uk-list uk-margin ' + custom_class"
|
||||
<ul class="uk-list uk-list-large uk-margin" [class.uk-list-xlarge]="!isMobile" [ngClass]="custom_class"
|
||||
uk-height-match="target: .uk-card-default; row: false">
|
||||
<errorMessages [status]="[status]" [type]="'results'"></errorMessages>
|
||||
<li *ngFor="let result of results">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-position-relative uk-flex uk-flex-column uk-flex-center"
|
||||
[ngClass]="result.type" [class.uk-disabled]="!hasPermission(result)">
|
||||
<div>
|
||||
<div *ngIf="type === 'community' && result.isSubscribed"
|
||||
class="uk-text-background uk-text-center uk-position-top-left uk-padding-small uk-text-uppercase uk-text-bold">
|
||||
<span>Member</span>
|
||||
</div>
|
||||
<div *ngIf="type === 'community' && result.status === 'manager'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('RESTRICTED')" ratio="1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">restricted</span>
|
||||
</div>
|
||||
<div *ngIf="type === 'community' && result.status === 'hidden'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('PRIVATE')" ratio="1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">private</span>
|
||||
</div>
|
||||
<div *ngIf="result.visibility && result.visibility !== 'PUBLIC'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get(result.visibility)" ratio="1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">{{result.visibility.toLowerCase()}}</span>
|
||||
<div *ngIf="type === 'community' && result.isSubscribed" [class.uk-position-top-left]="!isMobile" [class.uk-position-top-right]="isMobile" class="uk-text-background uk-text-center uk-padding-small uk-text-uppercase uk-text-bold">
|
||||
<span>Member</span>
|
||||
</div>
|
||||
<div [ngClass]="isMobile?'uk-flex uk-flex-middle uk-margin-bottom':'uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle'">
|
||||
<div *ngIf="type === 'community' && result.status === 'manager'">
|
||||
<icon [name]="visibilityIcon.get('RESTRICTED')" [ratio]="isMobile?0.8:1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize" [class.uk-text-xsmall]="isMobile" [class.uk-margin-xsmall-left]="isMobile">restricted</span>
|
||||
</div>
|
||||
<ng-container *ngIf="type === 'community' && result.status === 'hidden'">
|
||||
<icon [name]="visibilityIcon.get('PRIVATE')" [ratio]="isMobile?0.8:1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize" [class.uk-text-xsmall]="isMobile" [class.uk-margin-xsmall-left]="isMobile">private</span>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="result.visibility && result.visibility !== 'PUBLIC'">
|
||||
<icon [name]="visibilityIcon.get(result.visibility)" [ratio]="isMobile?0.8:1.2" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize" [class.uk-text-xsmall]="isMobile" [class.uk-margin-xsmall-left]="isMobile">{{result.visibility.toLowerCase()}}</span>
|
||||
</ng-container>
|
||||
</div>
|
||||
<div class="uk-grid uk-flex uk-flex-middle uk-margin-medium-right" uk-grid>
|
||||
<a *ngIf="directLink && hasPermission(result)"
|
||||
[href]="(type === 'community')?getCommunityPageUrl(result):getStakeholderPageUrl(result)"
|
||||
target="_blank" class="uk-width-1-5@s">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)"
|
||||
class="uk-width-1-5@s uk-width-1-1"
|
||||
(click)="confirmModalOpen(result)">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</a>
|
||||
<div *ngIf="!hasPermission(result)" class="uk-width-1-5@s">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</div>
|
||||
<div class="uk-width-expand">
|
||||
<div *ngIf="type === 'community'" [title]="result.shortTitle" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getCommunityPageUrl(result)"
|
||||
class="uk-h5 uk-link-heading" target="_blank">
|
||||
{{(result.title) ? result.title : result.shortTitle}}
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)"
|
||||
class="uk-h5 uk-link-heading">
|
||||
{{(result.title) ? result.title : result.shortTitle}}
|
||||
</a>
|
||||
<h5 *ngIf="!hasPermission(result)">
|
||||
{{(result.title) ? result.title : result.shortTitle}}
|
||||
</h5>
|
||||
</div>
|
||||
<div *ngIf="type === 'stakeholder'" [title]="result.index_shortName" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getStakeholderPageUrl(result)"
|
||||
class="uk-h5 uk-link-heading" target="_blank">
|
||||
{{(result.name) ? result.name : result.index_shortName}}
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)"
|
||||
class="uk-h5 uk-link-heading">
|
||||
{{(result.name) ? result.name : result.index_shortName}}
|
||||
</a>
|
||||
<h5 *ngIf="!hasPermission(result)">
|
||||
{{(result.name) ? result.name : result.index_shortName}}
|
||||
</h5>
|
||||
</div>
|
||||
<h5 [class.uk-h5]="!isMobile" [class.uk-h6]="isMobile">
|
||||
<div *ngIf="type === 'community'" [title]="result.shortTitle" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getCommunityPageUrl(result)" class="uk-link-heading uk-text-truncate uk-display-inline-block" target="_blank">{{(result.title) ? result.title : result.shortTitle}}</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)" class="uk-link-heading uk-text-truncate uk-display-inline-block">{{(result.title) ? result.title : result.shortTitle}}</a>
|
||||
<div *ngIf="!hasPermission(result)" class="uk-text-truncate uk-display-inline-block">{{(result.title) ? result.title : result.shortTitle}}</div>
|
||||
</div>
|
||||
<div *ngIf="type === 'stakeholder'" [title]="result.index_shortName" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getStakeholderPageUrl(result)" class="uk-link-heading uk-text-truncate uk-display-inline-block" target="_blank">{{(result.name) ? result.name : result.index_shortName}}</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)" class="uk-link-heading uk-text-truncate uk-display-inline-block">{{(result.name) ? result.name : result.index_shortName}}</a>
|
||||
<div *ngIf="!hasPermission(result)" class="uk-text-truncate uk-display-inline-block">{{(result.name) ? result.name : result.index_shortName}}</div>
|
||||
</div>
|
||||
</h5>
|
||||
<div class="uk-text-small">
|
||||
<div *ngIf="result.date || result.creationDate" class="uk-flex uk-flex-middle uk-margin-small-bottom">
|
||||
<span class="uk-text-meta">Creation Date: </span>
|
||||
|
|
@ -78,10 +47,21 @@
|
|||
<span class="uk-margin-small-left uk-text-capitalize">{{mapType(result.type)}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="result.description" class="uk-margin-top uk-text-small multi-line-ellipsis lines-3">
|
||||
<div *ngIf="result.description && !isMobile" class="uk-margin-top uk-text-small multi-line-ellipsis lines-3">
|
||||
<p class="uk-text-meta" [innerHTML]="result.description"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-5@m uk-width-1-3 uk-flex-first@m">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="(type === 'community')?getCommunityPageUrl(result):getStakeholderPageUrl(result)" target="_blank">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</a>
|
||||
<div *ngIf="!hasPermission(result)">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="result.isManager" class="uk-flex uk-flex-right uk-margin-top">
|
||||
<manage [communityId]="result.communityId" [alias]="result.alias"></manage>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,42 @@
|
|||
@import (reference) "~src/assets/openaire-theme/less/color.less";
|
||||
@import (reference) "~src/assets/openaire-theme/less/_import-variables.less";
|
||||
|
||||
.setType(@color) {
|
||||
border-left: 4px solid fade(@color, 30%);
|
||||
.setType(@color, @position: left) {
|
||||
border-@{position}: 4px solid fade(@color, 30%);
|
||||
|
||||
& .type {
|
||||
color: @color;
|
||||
}
|
||||
}
|
||||
|
||||
.uk-card {
|
||||
&.funder {
|
||||
.setType(@funder-color);
|
||||
}
|
||||
@media(min-width: @breakpoint-medium) {
|
||||
.uk-card {
|
||||
&.funder {
|
||||
.setType(@funder-color);
|
||||
}
|
||||
|
||||
&.ri {
|
||||
.setType(@ri-color);
|
||||
}
|
||||
&.ri {
|
||||
.setType(@ri-color);
|
||||
}
|
||||
|
||||
&.organization {
|
||||
.setType(@organization-color);
|
||||
&.organization {
|
||||
.setType(@organization-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media(max-width: @breakpoint-small-max) {
|
||||
.uk-card {
|
||||
&.funder {
|
||||
.setType(@funder-color, bottom);
|
||||
}
|
||||
|
||||
&.ri {
|
||||
.setType(@ri-color, bottom);
|
||||
}
|
||||
|
||||
&.organization {
|
||||
.setType(@organization-color, bottom);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ export class PortalSearchResultComponent implements OnInit{
|
|||
@Input() showLoading: boolean = false;
|
||||
@Input() custom_class: string = "search-results";
|
||||
@Input() properties: EnvProperties;
|
||||
@Input() isMobile: boolean = false;
|
||||
@ViewChild('AlertModal') modal;
|
||||
visibilityIcon: Map<Visibility, string> = new Map<Visibility, string> ([
|
||||
["PRIVATE", 'incognito'],
|
||||
|
|
|
|||
|
|
@ -4,13 +4,13 @@ import {ErrorCodes} from '../../utils/properties/errorCodes';
|
|||
@Component({
|
||||
selector: 'search-paging',
|
||||
template: `
|
||||
<paging *ngIf="results && searchUtils.totalResults > searchUtils.size"
|
||||
<paging *ngIf="results && searchUtils.totalResults > searchUtils.size" [position]="isMobile?'center':'right'"
|
||||
[currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [baseUrl]="baseUrl"
|
||||
[size]="searchUtils.size" [parameterNames]="parameterNames" [parameterValues]="parameterValues"
|
||||
[isDisabled]="isDisabled">
|
||||
</paging>
|
||||
<paging *ngIf="!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING"
|
||||
[currentPage]="searchUtils.page" [totalResults]="oldTotalResults" [baseUrl]="baseUrl"
|
||||
[currentPage]="searchUtils.page" [totalResults]="oldTotalResults" [baseUrl]="baseUrl" [position]="isMobile?'center':'right'"
|
||||
[size]="searchUtils.size" [parameterNames]="parameterNames" [parameterValues]="parameterValues"
|
||||
[isDisabled]="isDisabled">
|
||||
</paging>
|
||||
|
|
@ -26,6 +26,7 @@ export class SearchPagingComponent {
|
|||
@Input() parameterValues: string[];
|
||||
@Input() loadPaging: boolean = true;
|
||||
@Input() oldTotalResults: number = 0;
|
||||
@Input() isMobile: boolean = false;
|
||||
|
||||
public totalResults: number = 0;
|
||||
public errorCodes: ErrorCodes = new ErrorCodes();
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ import {ClickEvent} from "../../utils/click/click-outside-or-esc.directive";
|
|||
[class.collapsed]="hidden" [ngClass]="searchInputClass">
|
||||
<div class="uk-flex uk-flex-middle">
|
||||
<div class="uk-width-expand">
|
||||
<div #input [class.uk-hidden]="hidden" input [formInput]="searchControl" inputClass="search" [disabledIcon]="null"
|
||||
<div #input [class.uk-hidden]="hidden" input [formInput]="searchControl" [inputClass]="'search'+(iconPosition === 'left'?' icon-left':'')" [disabledIcon]="null"
|
||||
[placeholder]="{label: placeholder, static: true}" [value]="value" (valueChange)="valueChange.emit($event)"
|
||||
[disabled]="disabled" [showOptionsOnEmpty]="false" [type]="(options.length > 0?'autocomplete_soft':'text')" [options]="options"></div>
|
||||
</div>
|
||||
|
|
@ -36,6 +36,9 @@ import {ClickEvent} from "../../utils/click/click-outside-or-esc.directive";
|
|||
<icon name="search" [flex]="true" ratio="1.3"></icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-auto filters-toggle">
|
||||
<ng-content select="[filters-toggle]"></ng-content>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue