Componente UI: visualizza l'ora nel formato 'Ymd H: i: s' (formato ora ISO)

9

Creo alcune pagine di elenchi di amministratori per componente dell'interfaccia utente, il formato di ora predefinito nella loro colonna dell'ora tutto come di seguito

I codici dei componenti dell'interfaccia utente sono i seguenti

<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>
    </argument>
</column>

Il formato dell'ora nel database è corretto (formato dell'ora ISO), è quello che voglio visualizzare.

Quindi, come visualizzare l'ora nel formato " Ymd H: i: s " (formato ora ISO) nel componente UI? Grazie per qualsiasi consiglio :)

magento2 uicomponent time

— Key Shang
fonte

Dato che hai domande, non esitare a contattarmi. Proverò ad aiutarti.

— Siarhey Uchukhlebau,

@SiarheyUchukhlebau Grazie mille :) La tua risposta funziona già, accetta e vota.

— Key Shang

11

Prova a cambiare il dateFormatvalore della tua colonna:

<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>

Il formato predefinito può essere trovato all'interno del componente colonna Data magento/module-ui/view/base/web/js/grid/columns/date.js

return Column.extend({
    defaults: {
        dateFormat: 'MMM d, YYYY h:mm:ss A'
    },
...

Aggiornare:

Inoltre, nota l'uso di y invece di YYYY per l'anno. Il componente data utilizza il formato data ICU .

fonte

Quindi, il formato dovrebbe essere leggermente diverso. Penso che questo potrebbe essere adatto:

<item name="dateFormat" xsi:type="string">Y-MM-dd HH:mm:ss</item>

— Siarhey Uchukhlebau
fonte

5

È necessario aggiungere il dateFormatvalore del formato della data della colonna come AAAA-MM-gg hh: mm: ss , il formato dell'ora della data ICU .

Dai un'occhiata al link qui sotto per maggiori dettagli:

http://userguide.icu-project.org/formatparse/datetime

M mese in anno

M 9

MM 09

MMM Sep

MMMM settembre

MMMMM S

d giorno nel mese

gg 02

E AAAA per anno

Quindi la riga di codice del formato data è:

<item name="dateFormat" xsi:type="string" translate="true">YYYY-MM-dd hh:mm:ss</item>

Puoi provare sotto il codice per la colonna della data e i dati:

<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>

— Ashish Raj
fonte

voglio visualizzare solo la data usando il modificatore, ma non funziona

— Jaisa

<item name = "dateFormat" xsi: type = "string" translate = "true"> AAAA-MM-gg </item> Hai provato con la riga di codice sopra?

— Ashish Raj,