Shipment Timeline

0
Let's say we want to display current status of shipments in database. We want to display timeline (horizontal line) for each shipment. Color for these horizontal lines will be either dark grey or light grey based on if the Arrival dates are in past or future. For example : Shipment1 :- Start Date : Dec-01-2019                        Arrival Date : Jan-31-2020 Shipment2 :- Start Date : Mar-01-2020                         Arrival Date : May-31-2020 So, timeline for first Shipment1 will be a dark grey line and timeline for Shipment2 will be light grey line.  
asked
2 answers
0

Can you just do these as a series of complete images and just swap the entire image depending on the status? The status can be stored in an attribute and you can use conditional visibility to display the correct image.

answered
0

There is a widget in the app store that displays a vertical timeline, I guess it would be possible to change it to a horizontal timeline.

If you have some styling knowledge, creating a horizontal timeline from a list view shouldn’t be too hard as well. You won’t even need the widget and do the styling in CSS. There are some examples if you google for it (e.g.: https://jsfiddle.net/uer3gxeo/1/)

Regarding the different shades of gray, I would suggest adding the text element twice, once with conditional visibility and class for dark gray, once for the lighter gray. Use as condition the expression with ArrivalDate <= CurrentDate or ArrivalDate > CurrentDate

 

 

answered