UI component - display the time to 'Y-m-d H:i:s' format(ISO time format)
Try to change the dateFormat
value of your column:
<column name="created_at" class="Magento\Ui\Component\Listing\Columns\Date">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="filter" xsi:type="string">dateRange</item>
<item name="component" xsi:type="string">Magento_Ui/js/grid/columns/date</item>
<item name="dataType" xsi:type="string">date</item>
<item name="label" xsi:type="string" translate="true">Created At</item>
<item name="dateFormat" xsi:type="string">Y-MM-dd HH:mm:ss</item>
</item>
</argument>
</column>
Default format could be fount inside the Date column component magento/module-ui/view/base/web/js/grid/columns/date.js
return Column.extend({
defaults: {
dateFormat: 'MMM d, YYYY h:mm:ss A'
},
...
Update:
Also, notice the use of the y instead of YYYY for the year. The date component uses the ICU Date Format.
Source
So, format should slightly different. I think this one could be suitable:
<item name="dateFormat" xsi:type="string">Y-MM-dd HH:mm:ss</item>
You need to add date format dateFormat
value of the column as YYYY-MM-dd hh:mm:ss, the ICU date time format.
Take a look at below link for more detail:
http://userguide.icu-project.org/formatparse/datetime
M month in year
M 9
MM 09
MMM Sep
MMMM September
MMMMM S
d day in month
dd 02
And YYYY for year
So the date format line of code is:
<item name="dateFormat" xsi:type="string" translate="true">YYYY-MM-dd hh:mm:ss</item>
You can try below code for your date column and data:
<column name="purchase_date" class="Magento\Ui\Component\Listing\Columns\Date">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="label" xsi:type="string" translate="true">Created At</item>
<item name="filter" xsi:type="string">dateRange</item>
<item name="component" xsi:type="string">Magento_Ui/js/grid/columns/date</item>
<item name="dataType" xsi:type="string">date</item>
<item name="dateFormat" xsi:type="string" translate="true">YYYY-MM-dd hh:mm a</item>
</item>
</argument>
</column>