Skip to main content

Date Range Component

Goal: UX/Functional

Developer: cloudempiere, Takacs Peter, Design: Norbert Bede Review: Hengsin Low, CarlosRuiz

Feature Ticket: IDEMPIERE-5443

Improvement

This feature introduces a new UI component that allows the user to select date ranges more effectively. The component can be used in various parts of the system. Mainly: windows, report and process, forms, info windows.- also custom modules as Dashboard Filter. (upcoming in next releases)

Implementations in system modules

Implementation - Process/Report Screencast for date range picker

When Range is enabled, on process parameter, then new icon appear, allow select range with new range component

Implementation - Window Lookup Record/Advanced Tab Window range

When use click on Date to on Lookup, or Select Advanced Search Between operator, allow select range with new range component

Implementation for Info Window Infowindow daterange

When 2 date fields added automatically Date Range detected, and Date Range Component appear.

Date vs Date Range Reference (new)

Date Field: on each Dates fields small "time" icons appear, which allow open Date Range Component - when user select specific range, the dates are filled into date from/to fields.

Date Range: replace date from to with human readable range eg. Before 10 november 2022 or Last 3 months etc. (TODO)

Functionalities

Current (default) - allow select full ranges of Day, Week, Month, Year

Date range current

Allow select Current: Day, Week, Month, Quarter, Year

Previous N / Day, Week, Month, Quarter, Year (range) - starts with previous period (excl. actual)

Date range previous

Illustrates, how the user able to select previous period

Next N / Day, Week, Month, Quarter, Year (range) - starts with previous period (excl. actual)

Date range next

Illustrates, how the user able to select future period

Before a specific date

Date range before

Illustrates, how the user able to select a period before selected date.

After a specific date

Date range after

Illustrates, how the user able to select a period after selected date.

ON exact date

Date range on

Illustrates, how the user able to select a period On selected date. Date range quickmode

Illustrates specific layout for selecting various periods quickly.

Between two dates

Date range between

Illustrates how the user able to select a specific date ranges with 2 calendar pickers

Ago - defines a time interval in the past, in the length of the specified unit

DatePickerAgo


Source: Wiki