core/dashboard/wiget-time-context/aggregation-picker/aggregation-picker.component.ts
ControlValueAccessor
| providers |
{
provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => AggregationPickerComponent), multi: true
}
|
| selector | c8y-aggregation-picker |
| templateUrl | ./aggregation-picker.component.html |
Properties |
|
Methods |
Inputs |
| disabledAggregations |
Type : Partial<Record<aggregationType, boolean>>
|
Default value : {}
|
|
Configuration for disabling specific types of aggregation. By default no aggregation type is disabled. |
| markAsTouched |
markAsTouched()
|
|
Returns :
void
|
| registerOnChange | ||||||
registerOnChange(fn: any)
|
||||||
|
Parameters :
Returns :
void
|
| registerOnTouched | ||||||
registerOnTouched(onTouched: any)
|
||||||
|
Parameters :
Returns :
void
|
| setDisabledState | ||||||
setDisabledState(disabled: boolean)
|
||||||
|
Parameters :
Returns :
void
|
| writeValue | ||||||
writeValue(value: aggregationType)
|
||||||
|
Parameters :
Returns :
void
|
| Readonly AGGREGATION_ICONS |
Default value : AGGREGATION_ICONS
|
| Readonly AGGREGATION_TEXTS |
Default value : AGGREGATION_TEXTS
|
| Readonly AGGREGATIONS |
Default value : AGGREGATIONS
|
| disabled |
Default value : false
|
| onChange |
Default value : () => {...}
|
| onTouched |
Default value : () => {...}
|
| touched |
Default value : false
|
| value |
Type : aggregationType
|
<div
class="dropdown"
style="border: 0; margin-left: -1px"
#dropdown="bs-dropdown"
dropdown
[insideClick]="true"
[isDisabled]="disabled"
>
<button
class="dropdown-toggle form-control p-t-0 p-b-0 l-h-1 d-flex a-i-center"
[attr.aria-label]="(value ? AGGREGATION_TEXTS[value] : AGGREGATION_TEXTS.undefined) | translate"
tooltip="{{
(value
? AGGREGATION_TEXTS[value]
: disabled
? AGGREGATION_TEXTS.disabled
: AGGREGATION_TEXTS.undefined
) | translate
}}"
placement="top"
container="body"
type="button"
[adaptivePosition]="false"
[delay]="500"
dropdownToggle
>
<i
class="icon-14"
[c8yIcon]="value ? AGGREGATION_ICONS[value] : AGGREGATION_ICONS.undefined"
></i>
<span class="caret m-r-8 m-l-4"></span>
</button>
<ul
class="dropdown-menu dropdown-menu-right--xs"
*dropdownMenu
>
<li
*ngFor="let aggregation of AGGREGATIONS"
[ngClass]="{
active: aggregation.id === value,
disabled: disabledAggregations[aggregation.id]
}"
>
<button
class=""
(click)="onChange(aggregation.id); dropdown.isOpen = false"
[disabled]="disabledAggregations[aggregation.id]"
>
<i
class="icon-14"
[c8yIcon]="
aggregation.id ? AGGREGATION_ICONS[aggregation.id] : AGGREGATION_ICONS.undefined
"
></i>
<span>{{ aggregation.title | translate }}</span>
</button>
</li>
</ul>
</div>