core/time-interval/time-interval.component.ts
AfterViewInit
| selector | c8y-time-interval |
| standalone | true |
| imports |
CommonModule
FormsModule
BsDatepickerModule
|
| templateUrl | ./time-interval.component.html |
Properties |
Methods |
Inputs |
Outputs |
| dateRangePickerConfig |
Type : DateRangePickerConfig
|
| maxCustomDate |
Type : Date
|
| minCustomDate |
Type : Date
|
| selectedInterval |
Type : TimeIntervalOption
|
Default value : LAST_HOUR
|
| interval |
Type : EventEmitter<TimeInterval>
|
| changeCustomRange | ||||||
changeCustomRange(range: Date[])
|
||||||
|
Parameters :
Returns :
void
|
| changeInterval | ||||||
changeInterval(intervalOption: TimeIntervalOption)
|
||||||
|
Parameters :
Returns :
void
|
| ngAfterViewInit |
ngAfterViewInit()
|
|
Returns :
void
|
| reload |
reload()
|
|
Returns :
void
|
| CUSTOM |
Default value : CUSTOM
|
| customRange |
Type : Date[]
|
| intvervals |
Default value : INTERVAL_OPTIONS
|
<form class="form-inline">
<div class="form-group">
<div class="c8y-select-wrapper">
<select
class="form-control"
[attr.aria-label]="'Time interval' | translate"
name="interval"
[(ngModel)]="selectedInterval"
(ngModelChange)="changeInterval($event)"
>
<option
*ngFor="let interval of intvervals"
[ngValue]="interval"
>
{{ interval.label | translate }}
</option>
</select>
</div>
</div>
<div
class="form-group datepicker"
*ngIf="selectedInterval === CUSTOM"
>
<input
class="form-control"
[placeholder]="'Select date range' | translate"
bsDaterangepicker
[bsConfig]="dateRangePickerConfig"
[minDate]="minCustomDate"
[maxDate]="maxCustomDate"
[(bsValue)]="customRange"
(bsValueChange)="changeCustomRange($event)"
/>
</div>
<button
class="btn btn-link"
[title]="'Reload' | translate"
type="button"
[disabled]="selectedInterval === CUSTOM && (!customRange || customRange.length === 0)"
(click)="reload()"
>
<i c8yIcon="refresh"></i>
{{ 'Reload' | translate }}
</button>
</form>