111731: Created new advanced search component

This commit is contained in:
Alexandre Vryghem
2024-04-12 11:54:45 +02:00
parent 5ec0880d7d
commit b9fa479519
9 changed files with 149 additions and 1 deletions

View File

@@ -0,0 +1,14 @@
<h3>{{ 'search.sidebar.advanced-search.title' | translate }}</h3>
<div *ngVar="advancedFilterMap$ | async as advancedFilterMap" class="advanced-search b-3 p-3">
<h5>{{ 'search.sidebar.advanced-search.filter-by' | translate }}</h5>
<select [(ngModel)]="currentFilter" class="form-control mb-2">
<option *ngFor="let advancedFilter of (advancedFilters$ | async) | keyvalue" [value]="advancedFilter.value.filter">
{{ 'search.filters.filter.' + advancedFilter.value.filter + '.head' | translate }}
</option>
</select>
<select [(ngModel)]="currentOperator" class="form-control mb-2">
<option *ngFor="let operator of advancedFilterMap.get(currentFilter)?.operators" [value]="operator.operator">
{{ 'search.filters.operator.' + operator.operator + '.text' | translate }}
</option>
</select>
</div>

View File

@@ -0,0 +1,36 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AdvancedSearchComponent } from './advanced-search.component';
import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
import { SearchConfigurationServiceStub } from '../../testing/search-configuration-service.stub';
import { TranslateModule } from '@ngx-translate/core';
describe('AdvancedSearchComponent', () => {
let component: AdvancedSearchComponent;
let fixture: ComponentFixture<AdvancedSearchComponent>;
let searchConfigurationService: SearchConfigurationServiceStub;
beforeEach(async () => {
searchConfigurationService = new SearchConfigurationServiceStub();
await TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot(),
],
declarations: [
AdvancedSearchComponent,
],
providers: [
{ provide: SearchConfigurationService, useValue: searchConfigurationService },
],
}).compileComponents();
fixture = TestBed.createComponent(AdvancedSearchComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@@ -0,0 +1,47 @@
import { Component, Input, OnInit } from '@angular/core';
import { map, Observable } from 'rxjs';
import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
import { FilterConfig, SearchConfig } from '../../../core/shared/search/search-filters/search-config.model';
@Component({
selector: 'ds-advanced-search',
templateUrl: './advanced-search.component.html',
styleUrls: ['./advanced-search.component.scss'],
})
export class AdvancedSearchComponent implements OnInit {
@Input() configuration: string;
advancedFilters$: Observable<FilterConfig[]>;
advancedFilterMap$: Observable<Map<string, FilterConfig>>;
currentFilter: string;
currentOperator: string;
constructor(
protected searchConfigurationService: SearchConfigurationService,
) {
}
ngOnInit(): void {
this.advancedFilters$ = this.searchConfigurationService.getConfigurationSearchConfig(this.configuration).pipe(
map((searchConfiguration: SearchConfig) => searchConfiguration.filters),
);
this.advancedFilterMap$ = this.advancedFilters$.pipe(
map((filters: FilterConfig[]) => {
const filterMap: Map<string, FilterConfig> = new Map();
if (filters.length > 0) {
this.currentFilter = filters[0].filter;
this.currentOperator = filters[0].operators[0].operator;
for (const filter of filters) {
filterMap.set(filter.filter, filter);
}
}
return filterMap;
}),
);
}
}

View File

@@ -24,6 +24,8 @@
[inPlaceSearch]="inPlaceSearch"
(changeAppliedFilters)="changeAppliedFilters.emit($event)">
</ds-themed-search-filters>
<ds-advanced-search [configuration]="configuration">
</ds-advanced-search>
<ds-themed-search-settings [currentSortOption]="currentSortOption"
[sortOptionsList]="sortOptionsList"></ds-themed-search-settings>
</div>

View File

@@ -37,6 +37,7 @@ import { ThemedSearchSettingsComponent } from './search-settings/themed-search-s
import { NouisliderModule } from 'ng2-nouislider';
import { ThemedSearchFiltersComponent } from './search-filters/themed-search-filters.component';
import { ThemedSearchSidebarComponent } from './search-sidebar/themed-search-sidebar.component';
import { AdvancedSearchComponent } from './advanced-search/advanced-search.component';
const ENTRY_COMPONENTS = [
SearchFacetFilterComponent,
@@ -66,6 +67,7 @@ const COMPONENTS = [
SearchFacetFilterWrapperComponent,
SearchSwitchConfigurationComponent,
ConfigurationSearchPageComponent,
AdvancedSearchComponent,
ThemedConfigurationSearchPageComponent,
ThemedSearchResultsComponent,
ThemedSearchSettingsComponent,

View File

@@ -1,5 +1,6 @@
import { BehaviorSubject, of as observableOf, Observable } from 'rxjs';
import { Params } from '@angular/router';
import { SearchConfig } from '../../core/shared/search/search-filters/search-config.model';
export class SearchConfigurationServiceStub {
@@ -28,6 +29,10 @@ export class SearchConfigurationServiceStub {
return observableOf({ hasSucceeded: true, payload: [] });
}
getConfigurationSearchConfig(_configuration: string, _scope?: string): Observable<SearchConfig> {
return observableOf(new SearchConfig());
}
getAvailableConfigurationOptions() {
return observableOf([{value: 'test', label: 'test'}]);
}

View File

@@ -3620,6 +3620,8 @@
"search.search-form.placeholder": "Search the repository ...",
"search.filters.applied.f.title": "Title",
"search.filters.applied.f.author": "Author",
"search.filters.applied.f.dateIssued.max": "End date",
@@ -3634,6 +3636,10 @@
"search.filters.applied.f.has_content_in_original_bundle": "Has files",
"search.filters.applied.f.original_bundle_filenames": "File name",
"search.filters.applied.f.original_bundle_descriptions": "File description",
"search.filters.applied.f.itemtype": "Type",
"search.filters.applied.f.namedresourcetype": "Status",
@@ -3652,6 +3658,12 @@
"search.filters.applied.f.withdrawn": "Withdrawn",
"search.filters.filter.title.head": "Title",
"search.filters.filter.title.placeholder": "Title",
"search.filters.filter.title.label": "Search Title",
"search.filters.filter.author.head": "Author",
"search.filters.filter.author.placeholder": "Author name",
@@ -3720,6 +3732,18 @@
"search.filters.filter.has_content_in_original_bundle.head": "Has files",
"search.filters.filter.original_bundle_filenames.head": "File name",
"search.filters.filter.original_bundle_filenames.placeholder": "File name",
"search.filters.filter.original_bundle_filenames.label": "Search File name",
"search.filters.filter.original_bundle_descriptions.head": "File description",
"search.filters.filter.original_bundle_descriptions.placeholder": "File description",
"search.filters.filter.original_bundle_descriptions.label": "Search File description",
"search.filters.filter.itemtype.head": "Type",
"search.filters.filter.itemtype.placeholder": "Type",
@@ -3822,6 +3846,20 @@
"search.filters.search.submit": "Submit",
"search.filters.operator.equals.text": "Equals",
"search.filters.operator.notequals.text": "Not Equals",
"search.filters.operator.authority.text": "Authority",
"search.filters.operator.notauthority.text": "Not Authority",
"search.filters.operator.contains.text": "Contains",
"search.filters.operator.notcontains.text": "Not Contains",
"search.filters.operator.query.text": "Query",
"search.form.search": "Search",
"search.form.search_dspace": "All repository",
@@ -3856,6 +3894,10 @@
"search.sidebar.settings.sort-by": "Sort By",
"search.sidebar.advanced-search.title": "Advanced Search",
"search.sidebar.advanced-search.filter-by": "Filter by",
"search.sidebar.settings.title": "Settings",
"search.view-switch.show-detail": "Show detail",

View File

@@ -3,7 +3,7 @@
// imports the base global style
@import '../../../styles/_global-styles.scss';
.facet-filter, .setting-option {
.facet-filter, .setting-option, .advanced-search {
background-color: var(--bs-light);
border-radius: var(--bs-border-radius);