Timestamp with Time Zone Annotation in Fiori Elements

Assumption: UTC timestamp data is stored in the DB table

Default Logic:

Without any additional tweaking, UTC timestamp is sent to SAPUI5. SAPIU5 converts it to a time zone either set by FLP or by local operation system. For example, timestamp 202304200800.000000 is stored in the table and its metadata data type is Edm.DataTimeOffset.

The time zone of the operation system is Europe/Berlin. Then it will be displayed as 2023-04-20 10:00:00(formate is determined by locale or FLP setting). The logic is very common and SAPUI5 supports this since from early versions.

With Specified Time Zone:

But there could also be requirements that to present certain timestamp values in dedicated time zones. Or display the same time in different concerned time zones on the UI. Think about a row of clocks which are showing time for cites New York, Berlin, Shanghai and Tokyo. They are running the same UTC time but in differnt time zones. With timezone relevant annotations, we can not achive this without any additional codes. In a ABAP CDS view, annotation @Semantics.timezone:true is used to mark a field as a time zone field, and @Semantics.timezoneReference is used to bind a timestamp field to a time zone field. The same mechanism as unit of measurement. With these two annotations, the timestamp will be displayed in the timezone specified from the time zone field. With this approach, backend service needs to provide an additional field contains time zone value. But think about a situation that there is no such field holds time zone from the DB table. And the requirment is simply display timestamp in a wanted time zone which is different with the one from operation system. ABAP CDS annotation is not supporting this case, thus XML annotation can be used. Example as below. Annotation timezoneReference mapped to XML annotation Timezone with Path property.

Then we can just replace Path with String, and give a fixed time zone value in the XML annotation.

Display mode:

Change mode: