set localized text to moment.js

src/consts/datetime.js

@@ -29,6 +29,16 @@ const allWeekDays = {
     }
 };
 
+const allWeekDaysArray = [
+    allWeekDays.Sunday,
+    allWeekDays.Monday,
+    allWeekDays.Tuesday,
+    allWeekDays.Wednesday,
+    allWeekDays.Thursday,
+    allWeekDays.Friday,
+    allWeekDays.Saturday
+];
+
 const allDateRanges = {
     All: {
         type: 0,
@@ -84,6 +94,7 @@ const defaultFirstDayOfWeek = allWeekDays.Sunday.type;
 
 export default {
     allWeekDays: allWeekDays,
+    allWeekDaysArray: allWeekDaysArray,
     allDateRanges: allDateRanges,
     defaultFirstDayOfWeek: defaultFirstDayOfWeek
 };

src/lib/utils.js

@@ -151,8 +151,9 @@ function getDay(date) {
     return moment(date).date();
 }
 
-function getDayOfWeek(date) {
-    return moment(date).format('dddd');
+function getDayOfWeekName(date) {
+    const dayOfWeek = moment(date).days();
+    return dateTimeConstants.allWeekDaysArray[dayOfWeek].name;
 }
 
 function getHour(date) {
@@ -658,7 +659,7 @@ export default {
     getMonth,
     getYearAndMonth,
     getDay,
-    getDayOfWeek,
+    getDayOfWeekName,
     getHour,
     getMinute,
     getSecond,

src/locales/en.js

@@ -8,7 +8,7 @@ export default {
         'currency': 'USD',
         'firstDayOfWeek': 'Sunday'
     },
-    'format': {
+    'format': { // The type of date or time format is moment format, ref: https://momentjs.com/docs/#/displaying/
         'date': {
             'long': 'M/D/YYYY',
             'short': 'M/D/YYYY'
@@ -36,37 +36,44 @@ export default {
             'symbol': '{symbol} {amount}'
         }
     },
-    'input-format': {
+    'input-format': { // The type of date or time format is framework7 format, ref: https://v5.framework7.io/docs/calendar.html#calendar-parameters
         'datetime': {
             'long': 'm/d/yyyy hh::mm A',
         },
     },
     'datetime': {
         'Monday': {
+            'min': 'Mo',
             'short': 'Mon',
             'long': 'Monday'
         },
         'Tuesday': {
+            'min': 'Tu',
             'short': 'Tue',
             'long': 'Tuesday'
         },
         'Wednesday': {
+            'min': 'We',
             'short': 'Wed',
             'long': 'Wednesday'
         },
         'Thursday': {
+            'min': 'Th',
             'short': 'Thu',
             'long': 'Thursday'
         },
         'Friday': {
+            'min': 'Fr',
             'short': 'Fri',
             'long': 'Friday'
         },
         'Saturday': {
+            'min': 'Sa',
             'short': 'Sat',
             'long': 'Saturday'
         },
         'Sunday': {
+            'min': 'Su',
             'short': 'Sun',
             'long': 'Sunday'
         },

src/locales/zh_Hans.js

@@ -43,30 +43,37 @@ export default {
     },
     'datetime': {
         'Monday': {
+            'min': '一',
             'short': '周一',
             'long':  '星期一'
         },
         'Tuesday': {
+            'min': '二',
             'short': '周二',
             'long': '星期二'
         },
         'Wednesday': {
+            'min': '三',
             'short': '周三',
             'long': '星期三'
         },
         'Thursday': {
+            'min': '四',
             'short': '周四',
             'long': '星期四'
         },
         'Friday': {
+            'min': '五',
             'short': '周五',
             'long': '星期五'
         },
         'Saturday': {
+            'min': '六',
             'short': '周六',
             'long': '星期六'
         },
         'Sunday': {
+            'min': '日',
             'short': '周日',
             'long': '星期日'
         },

src/mobile-main.js

@@ -265,6 +265,17 @@ Vue.prototype.$locale = {
             i18n.t('datetime.Saturday.short')
         ];
     },
+    getAllMinWeekdayNames: function () {
+        return [
+            i18n.t('datetime.Sunday.min'),
+            i18n.t('datetime.Monday.min'),
+            i18n.t('datetime.Tuesday.min'),
+            i18n.t('datetime.Wednesday.min'),
+            i18n.t('datetime.Thursday.min'),
+            i18n.t('datetime.Friday.min'),
+            i18n.t('datetime.Saturday.min')
+        ];
+    },
     getInputTimeIntlDateTimeFormatOptions: function () {
         const hourMinuteFormat = i18n.t('input-format.datetime.long');
         const is24HourFormat = hourMinuteFormat.indexOf('H') > 0;
@@ -284,7 +295,13 @@ Vue.prototype.$locale = {
         }
 
         i18n.locale = locale;
-        moment.locale(locale);
+        moment.locale(locale, {
+            months : this.getAllLongMonthNames(),
+            monthsShort : this.getAllShortMonthNames(),
+            weekdays : this.getAllLongWeekdayNames(),
+            weekdaysShort : this.getAllShortWeekdayNames(),
+            weekdaysMin : this.getAllMinWeekdayNames(),
+        });
         services.setLocale(locale);
         document.querySelector('html').setAttribute('lang', locale);
 

src/store/transaction.js

@@ -287,7 +287,7 @@ export function fillTransactionObject(state, transaction, currentUtcOffset) {
     const transactionTime = utils.parseDateFromUnixTime(transaction.time, transaction.utcOffset, currentUtcOffset);
 
     transaction.day = utils.getDay(transactionTime);
-    transaction.dayOfWeek = utils.getDayOfWeek(transactionTime);
+    transaction.dayOfWeek = utils.getDayOfWeekName(transactionTime);
 
     if (transaction.sourceAccountId) {
         transaction.sourceAccount = state.allAccountsMap[transaction.sourceAccountId];

src/views/mobile/Home.vue

@@ -13,7 +13,7 @@
                         <small>Expense</small>
                     </span>
                     <span class="card-header-content" v-else-if="!loading">
-                        <span class="home-summary-month">{{ dateRange.thisMonth.startTime | moment('MMMM') | format('datetime.#{value}.long') | localized }}</span>
+                        <span class="home-summary-month">{{ dateRange.thisMonth.startTime | moment('MMMM') }}</span>
                         <span>·</span>
                         <small>{{ $t('Expense') }}</small>
                     </span>