Appearance
Date / Time Range
Picks a start and end time for trends, reports and tables.
In Studio
In Studio, double-click Date / Time Range in the Components category of the Components panel. It is added to the open view, where you can drag it into place.
When to use
Use Date / Time Range wherever an operator chooses a window: pick presets for quick spans, fields for exact times, calendar for shift and day reports.
Properties
| Property | Type | Default | Description |
|---|---|---|---|
| Label | String | Range | The accessible name of the control. |
| Variant | presets, fields, calendar | presets | How it looks: presets (default; Custom opens the field picker), fields (exact start and end) or calendar (click a first and last day). |
| Presets (comma-sep) | String | 1 h,8 h,24 h,7 d,Custom | The preset buttons, comma-separated. A span such as 8 h, 24 h, 7 d or 15 min is relative to the moment it is picked; any other entry (Custom) opens the field picker. |
| Default Preset | String | 8 h | The preset selected when the screen opens. |
Binding
This component has no single value binding.
The range is an OUTPUT: start and end (epoch milliseconds) and preset are published as live values, so a property binding such as {dateRange.start} can feed a Data Table's range, a Named Query parameter or a script. It also fires On Action Performed with the range.