Format Datetime from array using momentjs

Question

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

ittus · Accepted Answer · 2018-06-15 02:32:50Z

2

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

edited Jun 15, 2018 at 2:32

answered Jun 15, 2018 at 2:24

ittus

22.5k5 gold badges62 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Pepe Over a year ago

I triy it but I get http://eslint.org/docs/rules/no-param-reassign Assignment to property of function parameter 'o'

Collectives™ on Stack Overflow

Format Datetime from array using momentjs

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related