Skip to content
Snippets Groups Projects
Commit 7f3d2ac5 authored by Lotte Hofstede's avatar Lotte Hofstede
Browse files

44024: pagination fixes and translation

parent 1a3742d2
Branches
Tags
No related merge requests found
......@@ -69,5 +69,14 @@
"head": "Communities in DSpace",
"help": "Select a community to browse its collections."
}
},
"search": {
"form": {
"search": "Search",
"search_dspace": "Search DSpace"
},
"results": {
"title": "Search Results"
}
}
}
<div class="search-page">
<ds-search-form (formSubmit)="updateSearch($event)" [query]="query"></ds-search-form>
<ds-search-results [searchResults]="results"></ds-search-results>
<ds-search-results [searchResults]="results" [searchConfig]="searchOptions"></ds-search-results>
</div>
......@@ -6,6 +6,7 @@ import { SearchResult } from '../search/search-result.model';
import { DSpaceObject } from '../core/shared/dspace-object.model';
import { SortOptions } from '../core/cache/models/sort-options.model';
import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
import { SearchOptions } from '../search/search-options.model';
/**
* This component renders a simple item page.
......@@ -20,11 +21,12 @@ import { PaginationComponentOptions } from '../shared/pagination/pagination-comp
})
export class SearchPageComponent implements OnInit, OnDestroy {
private sub;
private query: string;
query: string;
private scope: string;
private page: number;
private results: RemoteData<Array<SearchResult<DSpaceObject>>>;
results: RemoteData<Array<SearchResult<DSpaceObject>>>;
private currentParams = {};
searchOptions: SearchOptions;
constructor(private service: SearchService,
private route: ActivatedRoute,
......@@ -40,13 +42,12 @@ export class SearchPageComponent implements OnInit, OnDestroy {
this.scope = params.scope;
this.page = +params.page || 1;
const pagination: PaginationComponentOptions = new PaginationComponentOptions();
pagination.id = 'results-pagination';
pagination.id = 'search-results-pagination';
pagination.currentPage = this.page;
pagination.pageSize = +params.pageSize;
this.results = this.service.search(this.query, this.scope, {
pagination: pagination,
sort: new SortOptions(params.sortField, params.sortDirection)
});
pagination.pageSize = +params.pageSize || 10;
const sort: SortOptions = new SortOptions(params.sortField, params.sortDirection);
this.searchOptions = {pagination: pagination, sort: sort};
this.results = this.service.search(this.query, this.scope, this.searchOptions);
}
);
}
......
<h2 *ngIf="(searchResults.payload | async)?.length > 0">{{ 'search.results.title' | translate }}</h2>
<ds-object-list [config]="searchConfig.pagination" [sortConfig]="searchConfig.sort"
[objects]="searchResults" [hideGear]="false"></ds-object-list>
\ No newline at end of file
......@@ -17,16 +17,7 @@ import { SearchOptions } from '../../search/search-options.model';
templateUrl: './search-results.component.html',
})
export class SearchResultsComponent implements OnInit {
export class SearchResultsComponent {
@Input() searchResults: RemoteData<Array<SearchResult<DSpaceObject>>>;
@Input() searchConfig: SearchOptions;
ngOnInit(): void {
this.searchConfig = new SearchOptions();
this.searchConfig.pagination = new PaginationComponentOptions();
this.searchConfig.pagination.id = 'search-results-pagination';
this.searchConfig.sort = new SortOptions();
}
}
......@@ -199,8 +199,8 @@ export class PaginationComponent implements OnDestroy, OnInit {
this.sortDirection = this.sortOptions.direction;
this.sortField = this.sortOptions.field;
}
this.setShowingDetail();
}));
this.setShowingDetail();
}
/**
......@@ -246,6 +246,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
*/
public setPageSize(pageSize: number) {
this.pageSize = pageSize;
this.doPageChange(1);
this.updateRoute();
this.setShowingDetail();
this.pageSizeChange.emit(pageSize);
......@@ -259,6 +260,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
*/
public setSortDirection(sortDirection: SortDirection) {
this.sortDirection = sortDirection;
this.doPageChange(1);
this.updateRoute();
this.setShowingDetail();
this.sortDirectionChange.emit(sortDirection);
......@@ -272,6 +274,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
*/
public setSortField(field: string) {
this.sortField = field;
this.doPageChange(1);
this.updateRoute();
this.setShowingDetail();
this.sortFieldChange.emit(field);
......@@ -298,11 +301,11 @@ export class PaginationComponent implements OnDestroy, OnInit {
private setShowingDetail() {
let firstItem;
let lastItem;
const lastPage = Math.round(this.collectionSize / this.pageSize);
const pageMax = this.pageSize * this.currentPage;
firstItem = this.pageSize * (this.currentPage - 1) + 1;
if (this.currentPage !== lastPage) {
lastItem = this.pageSize * this.currentPage;
if (this.collectionSize > pageMax) {
lastItem = pageMax;
} else {
lastItem = this.collectionSize;
}
......
<form #form="ngForm" (ngSubmit)="onSubmit(form.value)">
<div class="input-group">
<div class="form-group input-group">
<input type="text" [ngModel]="query" name="query" class="form-control" aria-label="Search input">
<div class="input-group-btn" ngbDropdown>
<button type="submit" class="btn btn-secondary">Search DSpace</button>
<button type="submit" class="btn btn-secondary">{{ 'search.form.search_dspace' | translate }}</button>
<button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false" id="searchDropdown" ngbDropdownToggle>
<span class="sr-only">Toggle Dropdown</span>
</button>
<div ngbDropdownMenu class="dropdown-menu dropdown-menu-right" aria-labelledby="searchDropdown">
<a class="dropdown-item" (click)="onSubmit(form.value)">Search DSpace</a>
<a class="dropdown-item" (click)="onSubmit(form.value, '7669c72a-3f2a-451f-a3b9-9210e7a4c02f')">Search OR2017 - Demonstration</a>
<a class="dropdown-item" (click)="onSubmit(form.value, '9076bd16-e69a-48d6-9e41-0238cb40d863')">Search Sample Community</a>
<a class="dropdown-item" (click)="onSubmit(form.value)">{{ 'search.form.search_dspace' | translate }}</a>
<a class="dropdown-item" (click)="onSubmit(form.value, '7669c72a-3f2a-451f-a3b9-9210e7a4c02f')">{{ 'search.form.search' | translate }} OR2017 - Demonstration</a>
<a class="dropdown-item" (click)="onSubmit(form.value, '9076bd16-e69a-48d6-9e41-0238cb40d863')">{{ 'search.form.search' | translate }} Sample Community</a>
</div>
</div>
</div>
......
......@@ -11,12 +11,10 @@ import { Component, OnInit, EventEmitter, Output, Input } from '@angular/core';
styleUrls: ['./search-form.component.scss'],
templateUrl: './search-form.component.html',
})
export class SearchFormComponent implements OnInit {
export class SearchFormComponent {
@Output() formSubmit: EventEmitter<any> = new EventEmitter<any>();
@Input() query: string;
ngOnInit(): void { }
onSubmit(form: any, scope?: string) {
const data: any = Object.assign({}, form, { scope: scope });
this.formSubmit.emit(data);
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment