57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import {Component, EventEmitter, Input, Output} from '@angular/core';
|
|
import {NgClass} from '@angular/common';
|
|
|
|
@Component({
|
|
selector: 'sae-multi-selector',
|
|
imports: [
|
|
NgClass
|
|
],
|
|
templateUrl: './multi-selector.html',
|
|
styleUrl: './multi-selector.scss'
|
|
})
|
|
export class MultiSelector {
|
|
@Input() disabled: boolean = false;
|
|
@Input() label!: string;
|
|
// @Input() store: any;
|
|
// @Input() ActionTypes: any;
|
|
@Input() availableChoices: any = ['choix 1', 'choix 2', 'choix 3'];
|
|
@Input() selectedChoices: any = ['choix 4', 'choix 5'];
|
|
@Input() displayDropdown: boolean = false;
|
|
@Output() selectedChoicesChange = new EventEmitter<any>();
|
|
@Output() availableChoicesChange = new EventEmitter<any>();
|
|
|
|
constructor() {
|
|
|
|
}
|
|
|
|
selectedChoicesChangeToggleItem(choice: any) {
|
|
console.log('toggle selected choice ', choice, 'in filter ', this.label);
|
|
this.selectedChoicesChange.emit(choice);
|
|
// console.log(choice);
|
|
// this.store.dispatch({
|
|
// type: this.ActionTypes.UPDATE_FILTER,
|
|
// payload: {
|
|
// filter: this.label,
|
|
// selectedChoice: choice
|
|
// }
|
|
// })
|
|
}
|
|
|
|
availableChoicesChangeToggleItem(choice: any) {
|
|
this.availableChoicesChange.emit(choice);
|
|
console.log('toggle available choice ', choice, 'in filter ', this.label);
|
|
// this.store.dispatch({
|
|
// type: this.ActionTypes.UPDATE_FILTER,
|
|
// payload: {
|
|
// filter: this.label,
|
|
// availableChoice: choice
|
|
// }
|
|
// }
|
|
// )
|
|
}
|
|
|
|
onClickInput() {
|
|
if (this.disabled) return;
|
|
this.displayDropdown = !this.displayDropdown
|
|
}
|
|
}
|