mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-31 17:38:48 +00:00
ACS-7402: search components [ci:force]
This commit is contained in:
@@ -16,13 +16,17 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
||||||
import { MatCheckboxChange } from '@angular/material/checkbox';
|
import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox';
|
||||||
import { SearchWidget } from '../../models/search-widget.interface';
|
import { SearchWidget } from '../../models/search-widget.interface';
|
||||||
import { SearchWidgetSettings } from '../../models/search-widget-settings.interface';
|
import { SearchWidgetSettings } from '../../models/search-widget-settings.interface';
|
||||||
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
||||||
import { SearchFilterList } from '../../models/search-filter-list.model';
|
import { SearchFilterList } from '../../models/search-filter-list.model';
|
||||||
import { TranslationService } from '@alfresco/adf-core';
|
import { TranslationService } from '@alfresco/adf-core';
|
||||||
import { Subject } from 'rxjs';
|
import { Subject } from 'rxjs';
|
||||||
|
import { CommonModule } from '@angular/common';
|
||||||
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
|
import { MatButtonModule } from '@angular/material/button';
|
||||||
|
import { MatIconModule } from '@angular/material/icon';
|
||||||
|
|
||||||
export interface SearchListOption {
|
export interface SearchListOption {
|
||||||
name: string;
|
name: string;
|
||||||
@@ -32,13 +36,14 @@ export interface SearchListOption {
|
|||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'adf-search-check-list',
|
selector: 'adf-search-check-list',
|
||||||
|
standalone: true,
|
||||||
|
imports: [CommonModule, MatCheckboxModule, TranslateModule, MatButtonModule, MatIconModule],
|
||||||
templateUrl: './search-check-list.component.html',
|
templateUrl: './search-check-list.component.html',
|
||||||
styleUrls: ['./search-check-list.component.scss'],
|
styleUrls: ['./search-check-list.component.scss'],
|
||||||
encapsulation: ViewEncapsulation.None,
|
encapsulation: ViewEncapsulation.None,
|
||||||
host: { class: 'adf-search-check-list' }
|
host: { class: 'adf-search-check-list' }
|
||||||
})
|
})
|
||||||
export class SearchCheckListComponent implements SearchWidget, OnInit {
|
export class SearchCheckListComponent implements SearchWidget, OnInit {
|
||||||
|
|
||||||
id: string;
|
id: string;
|
||||||
settings?: SearchWidgetSettings;
|
settings?: SearchWidgetSettings;
|
||||||
context?: SearchQueryBuilderService;
|
context?: SearchQueryBuilderService;
|
||||||
@@ -101,7 +106,7 @@ export class SearchCheckListComponent implements SearchWidget, OnInit {
|
|||||||
updateDisplayValue(): void {
|
updateDisplayValue(): void {
|
||||||
const displayValue = this.options.items
|
const displayValue = this.options.items
|
||||||
.filter((option) => option.checked)
|
.filter((option) => option.checked)
|
||||||
.map(({name}) => this.translationService.instant(name))
|
.map(({ name }) => this.translationService.instant(name))
|
||||||
.join(', ');
|
.join(', ');
|
||||||
this.displayValue$.next(displayValue);
|
this.displayValue$.next(displayValue);
|
||||||
}
|
}
|
||||||
@@ -125,15 +130,12 @@ export class SearchCheckListComponent implements SearchWidget, OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
setValue(value: any) {
|
setValue(value: any) {
|
||||||
this.options.items.filter((item) => value.includes(item.value))
|
this.options.items.filter((item) => value.includes(item.value)).map((item) => (item.checked = true));
|
||||||
.map((item) => item.checked = true);
|
|
||||||
this.submitValues();
|
this.submitValues();
|
||||||
}
|
}
|
||||||
|
|
||||||
private getCheckedValues() {
|
private getCheckedValues() {
|
||||||
return this.options.items
|
return this.options.items.filter((option) => option.checked).map((option) => option.value);
|
||||||
.filter((option) => option.checked)
|
|
||||||
.map((option) => option.value);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
submitValues() {
|
submitValues() {
|
||||||
|
@@ -57,8 +57,19 @@ import { SearchFacetChipTabbedComponent } from './components/search-filter-chips
|
|||||||
import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component';
|
import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component';
|
||||||
import { SearchInputComponent } from './components/search-input';
|
import { SearchInputComponent } from './components/search-input';
|
||||||
|
|
||||||
|
export const CONTENT_SEARCH_DIRECTIVES = [SearchCheckListComponent] as const;
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [CommonModule, FormsModule, ReactiveFormsModule, MaterialModule, CoreModule, SearchTextModule, SearchInputComponent],
|
imports: [
|
||||||
|
...CONTENT_SEARCH_DIRECTIVES,
|
||||||
|
CommonModule,
|
||||||
|
FormsModule,
|
||||||
|
ReactiveFormsModule,
|
||||||
|
MaterialModule,
|
||||||
|
CoreModule,
|
||||||
|
SearchTextModule,
|
||||||
|
SearchInputComponent
|
||||||
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
SearchComponent,
|
SearchComponent,
|
||||||
SearchControlComponent,
|
SearchControlComponent,
|
||||||
@@ -74,7 +85,6 @@ import { SearchInputComponent } from './components/search-input';
|
|||||||
SearchSliderComponent,
|
SearchSliderComponent,
|
||||||
SearchNumberRangeComponent,
|
SearchNumberRangeComponent,
|
||||||
SearchPanelComponent,
|
SearchPanelComponent,
|
||||||
SearchCheckListComponent,
|
|
||||||
SearchDatetimeRangeComponent,
|
SearchDatetimeRangeComponent,
|
||||||
SearchSortingPickerComponent,
|
SearchSortingPickerComponent,
|
||||||
SearchFilterContainerComponent,
|
SearchFilterContainerComponent,
|
||||||
@@ -109,7 +119,7 @@ import { SearchInputComponent } from './components/search-input';
|
|||||||
SearchSliderComponent,
|
SearchSliderComponent,
|
||||||
SearchNumberRangeComponent,
|
SearchNumberRangeComponent,
|
||||||
SearchPanelComponent,
|
SearchPanelComponent,
|
||||||
SearchCheckListComponent,
|
...CONTENT_SEARCH_DIRECTIVES,
|
||||||
SearchDatetimeRangeComponent,
|
SearchDatetimeRangeComponent,
|
||||||
SearchSortingPickerComponent,
|
SearchSortingPickerComponent,
|
||||||
SearchFilterContainerComponent,
|
SearchFilterContainerComponent,
|
||||||
|
Reference in New Issue
Block a user