CODEWITHSUNDEEP
vue.jsvuejs2momentjsvue-tables-2
Pepe
Pepe

Reputation: 93

Format Datetime from array using momentjs

I have vue tables 2 like this:

<template>
 <v-server-table url="/"
                      :columns="orderListColumns"
                      :options="orderListOptions">
 </v-server-table>
</template>

import moment from 'moment';
import { Event } from 'vue-tables-2';

export default {
  name: 'order-list',

  components: { FontAwesomeIcon, LoaderIcon },

  mixins: [i18nMixin, userMixin],

  data() {
    return {
      query: '',
      orderList: [],
      orderListColumns: [
        'productDetailName',
        'email',
        'orderId',
        'orderDate',
        'type',
        'paymentStatus',
        'total',
      ],
      isDataLoading: false,
    };
  },

  computed: {
    orderListOptions() {
      return {
        uniqueKey: 'orderId',
        perPageValues: [],
        sortable: [],
        requestFunction: ({ page, limit, query }) =>
          orderService.getOrdersByUser(
            OrderSelectModel({
              mcUserName: this.$_user.userName,
              rowsPerPage: limit,
              pageNumber: page - 1,
              languageId: this.$_i18n_currentLanguageId,
              code: query,
            })
          ),
       responseAdapter: ({ order, totalItems }) => {
      const o = order;
      const orderDate = moment(order.orderDate).format('MMMM Do YYYY');
       o.orderDate = orderDate;
        return {
        data: o,
        count: totalItems,
         };
        },
            //etc

As you can see on responseAdapter I assign data as data: o problem is when I receive orderDate field I receive as: 2018-06-12T19:58:41.73 and I want to use momentjs to format it so in response adapter I try:

    responseAdapter: ({ order, totalItems }) => {
      const o = order;
      const orderDate = moment(order.orderDate).format('MMMM Do YYYY');
      o.orderDate = orderDate;
      return {
        data: o,
        count: totalItems,
      };
      },

But it no works, it just no format date. What am I doing wrong? Regards

enter image description here

Upvotes: 0

Views: 770

Answers (1)

ittus
ittus

Reputation: 22403

I think order is an array, you need to loop through it

responseAdapter: ({ order, totalItems }) => {
  const formatOrder = order.map(o => {
    const orderCopy = JSON.parse(JSON.stringify(o))
    orderCopy.orderDate = moment(o.orderDate).format('MMMM Do YYYY')
    return orderCopy
  })
  return {
    data: formatOrder,
    count: totalItems
  };
}

If you're using ES6, there is shorter syntax

const formatOrder = order.map(o => {
  const orderDate = moment(o.orderDate).format('MMMM Do YYYY')
  return {...o, orderDate}
})

Upvotes: 2

Related Questions