mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
selct box can use numbers as value in the card view (#6020)
This commit is contained in:
parent
a4632cf9a5
commit
beeb3ad080
@ -32,6 +32,7 @@ describe('CardViewSelectItemComponent', () => {
|
||||
let overlayContainer: OverlayContainer;
|
||||
let appConfig: AppConfigService;
|
||||
const mockData = [{ key: 'one', label: 'One' }, { key: 'two', label: 'Two' }, { key: 'three', label: 'Three' }];
|
||||
const mockDataNumber = [{ key: 1, label: 'One' }, { key: 2, label: 'Two' }, { key: 3, label: 'Three' }];
|
||||
const mockDefaultProps = {
|
||||
label: 'Select box label',
|
||||
value: 'two',
|
||||
@ -39,6 +40,13 @@ describe('CardViewSelectItemComponent', () => {
|
||||
key: 'key',
|
||||
editable: true
|
||||
};
|
||||
const mockDefaultNumbersProps = {
|
||||
label: 'Select box label',
|
||||
value: 2,
|
||||
options$: of(mockDataNumber),
|
||||
key: 'key',
|
||||
editable: true
|
||||
};
|
||||
|
||||
setupTestBed({
|
||||
imports: [
|
||||
@ -108,6 +116,30 @@ describe('CardViewSelectItemComponent', () => {
|
||||
expect(component.value).toEqual('one');
|
||||
});
|
||||
|
||||
it('should be possible edit selectBox item with numbers', () => {
|
||||
component.property = new CardViewSelectItemModel({
|
||||
...mockDefaultNumbersProps,
|
||||
editable: true
|
||||
});
|
||||
component.editable = true;
|
||||
component.displayNoneOption = true;
|
||||
component.ngOnChanges();
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(component.value).toEqual(2);
|
||||
expect(component.isEditable()).toBe(true);
|
||||
const selectBox = fixture.debugElement.query(By.css('.mat-select-trigger'));
|
||||
selectBox.triggerEventHandler('click', {});
|
||||
|
||||
fixture.detectChanges();
|
||||
const optionsElement = Array.from(overlayContainer.getContainerElement().querySelectorAll('mat-option'));
|
||||
expect(optionsElement.length).toEqual(4);
|
||||
optionsElement[1].dispatchEvent(new Event('click'));
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(component.value).toEqual(1);
|
||||
});
|
||||
|
||||
it('should be able to enable None option', () => {
|
||||
component.property = new CardViewSelectItemModel({
|
||||
...mockDefaultProps,
|
||||
|
@ -30,12 +30,12 @@ import { takeUntil, map } from 'rxjs/operators';
|
||||
templateUrl: './card-view-selectitem.component.html',
|
||||
styleUrls: ['./card-view-selectitem.component.scss']
|
||||
})
|
||||
export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItemModel<string>> implements OnChanges, OnDestroy {
|
||||
export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItemModel<string | number>> implements OnChanges, OnDestroy {
|
||||
static HIDE_FILTER_LIMIT = 5;
|
||||
|
||||
@Input() editable: boolean = false;
|
||||
|
||||
@Input() options$: Observable<CardViewSelectItemOption<string>[]>;
|
||||
@Input() options$: Observable<CardViewSelectItemOption<string | number>[]>;
|
||||
|
||||
@Input()
|
||||
displayNoneOption: boolean = true;
|
||||
@ -43,7 +43,7 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
|
||||
@Input()
|
||||
displayEmpty: boolean = true;
|
||||
|
||||
value: string;
|
||||
value: string | number;
|
||||
filter: string = '';
|
||||
showInputFilter: boolean = false;
|
||||
|
||||
@ -54,7 +54,7 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
|
||||
}
|
||||
|
||||
ngOnChanges(): void {
|
||||
this.value = this.property.value?.toString();
|
||||
this.value = this.property.value;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
@ -66,14 +66,14 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
|
||||
}
|
||||
|
||||
onFilterInputChange(value: string) {
|
||||
this.filter = value;
|
||||
this.filter = value.toString();
|
||||
}
|
||||
|
||||
isEditable(): boolean {
|
||||
return this.editable && this.property.editable;
|
||||
}
|
||||
|
||||
getOptions(): Observable<CardViewSelectItemOption<string>[]> {
|
||||
getOptions(): Observable<CardViewSelectItemOption<string | number>[]> {
|
||||
return this.options$ || this.property.options$;
|
||||
}
|
||||
|
||||
|
@ -24,6 +24,6 @@ export interface CardViewSelectItemOption<T> {
|
||||
}
|
||||
|
||||
export interface CardViewSelectItemProperties<T> extends CardViewItemProperties {
|
||||
value: string;
|
||||
value: string | number;
|
||||
options$: Observable<CardViewSelectItemOption<T>[]>;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user