Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 | 93x 93x 93x 93x 4x 4x 4x 4x 4x 4x 4x 1x 1x 5x 1x 4x 3x 1x 2x 2x 2x 1x | import { IDictionary, Metadata } from '@zeedhi/core';
import { Select } from '../zd-select/select';
import { IIterablePageSize } from './interfaces';
import { Iterable } from './iterable';
/**
* Base class for Iterable Page Size component
*/
export class IterablePageSize extends Select implements IIterablePageSize {
/**
* Iterable component name
*/
public iterableComponentName!: string;
/**
* Add input clear functionality if the input isn't readonly or disabled.
*/
public clearable = false;
/**
* Field used to display values
*/
public dataText: string | string[] = 'value';
/**
* Field used to save values
*/
public dataValue = 'value';
/**
* Enables search input
*/
public autocomplete = false;
/**
* Shows input helper.
*/
public showHelper = false;
/**
* Shows input label.
*/
public showLabel = false;
/**
* Input validations.
*/
public validations: IDictionary = { required: true };
/**
* Iterable component name
*/
public iterableComponent!: Iterable;
/* istanbul ignore next */
/**
* Creates a new Iterable Page component.
* @param props Iterable page component properties
*/
constructor(props: IIterablePageSize) {
super(props);
this.iterableComponentName = this.getInitValue(
'iterableComponentName',
props.iterableComponentName,
this.iterableComponent,
);
this.clearable = this.getInitValue('clearable', props.clearable, this.clearable);
this.dataText = this.getInitValue('dataText', props.dataText, this.dataText);
if (this.dataText && typeof this.dataText === 'string') this.dataText = [this.dataText];
this.dataValue = this.getInitValue('dataValue', props.dataValue, this.dataValue);
this.dense = this.getInitValue('dense', props.dense, false);
this.autocomplete = this.getInitValue('autocomplete', props.autocomplete, this.autocomplete);
this.showHelper = this.getInitValue('showHelper', props.showHelper, this.showHelper);
this.showLabel = this.getInitValue('showLabel', props.showLabel, this.showLabel);
this.validations = this.getInitValue('validations', props.validations, this.validations);
this.setIterableComponent();
}
/**
* Set the Iterable Component
* @param element Element mounted reference
*/
public onMounted(element: any) {
super.onMounted(element);
this.setIterableComponent();
}
private setIterableComponent() {
if (this.iterableComponentName && Metadata.getInstances(this.iterableComponentName).length > 0) {
this.iterableComponent = Metadata.getInstance(this.iterableComponentName) as Iterable;
} else if (this.parent instanceof Iterable) {
this.iterableComponent = this.parent;
} else {
throw new Error(`Could not find the iterable component associated with ${this.name}`);
}
}
/**
* Event trigged when component loses the focus and value changes
* @param value inputed value
*/
public selectChange(value: any, event?: Event, element?: any) {
super.selectChange(value, event, element);
if (value) this.changePageSize(parseFloat(value.value));
}
public changePageSize(size: number) {
if (this.iterableComponent.datasource.limit !== size) {
this.iterableComponent.datasource.setLimit(size);
}
}
}
|