[Page] [Layout] Fixed monent i18n

src/main.ts

@@ -3,7 +3,6 @@ import App from './App.vue'
 import router from '@/router'
 import i18n from '@/i18n'
 import moment from 'moment'
-import momentCN from './moment/zhCn'
 import './style.css'
 import './assets/index.css'
 
@@ -15,7 +14,6 @@ app.use(router)
 app.use(i18n)
 app.provide('$t', i18n.global.t)
 // Setting moment
-moment.locale('zh-cn', momentCN as any)
 app.config.globalProperties.$dt = moment
 app.provide('$dt', moment)
 app.mount('#app')

src/moment/zhCn.ts

@@ -1,17 +1,21 @@
-const momentCN = {
-    months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),
-    monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
+const zhCn = {
+    months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split(
+        '_'
+    ),
+    monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split(
+        '_'
+    ),
     weekdays: '星期日_星期一_星期二_星期三_星期四_星期五_星期六'.split('_'),
     weekdaysShort: '周日_周一_周二_周三_周四_周五_周六'.split('_'),
     weekdaysMin: '日_一_二_三_四_五_六'.split('_'),
     longDateFormat: {
         LT: 'HH:mm',
         LTS: 'HH:mm:ss',
-        L: 'YYYY-MM-DD',
-        LL: 'YYYY年MM月DD日',
-        LLL: 'YYYY年MM月DD日Ah点mm分',
-        LLLL: 'YYYY年MM月DD日ddddAh点mm分',
-        l: 'YYYY-M-D',
+        L: 'YYYY/MM/DD',
+        LL: 'YYYY年M月D日',
+        LLL: 'YYYY年M月D日Ah点mm分',
+        LLLL: 'YYYY年M月D日ddddAh点mm分',
+        l: 'YYYY/M/D',
         ll: 'YYYY年M月D日',
         lll: 'YYYY年M月D日 HH:mm',
         llll: 'YYYY年M月D日dddd HH:mm'
@@ -21,14 +25,14 @@ const momentCN = {
         if (hour === 12) {
             hour = 0;
         }
-        if (meridiem === '凌晨' || meridiem === '早上' ||
-            meridiem === '上午') {
+        if (meridiem === '凌晨' || meridiem === '早上' || meridiem === '上午') {
             return hour;
         }
         else if (meridiem === '下午' || meridiem === '晚上') {
             return hour + 12;
         }
         else {
+            // '中午'
             return hour >= 11 ? hour : hour + 12;
         }
     },
@@ -56,9 +60,9 @@ const momentCN = {
     calendar: {
         sameDay: '[今天]LT',
         nextDay: '[明天]LT',
-        nextWeek: '[下]ddddLT',
+        nextWeek: '[下]dddLT',
         lastDay: '[昨天]LT',
-        lastWeek: '[上]ddddLT',
+        lastWeek: '[上]dddLT',
         sameElse: 'L'
     },
     dayOfMonthOrdinalParse: /\d{1,2}(日|月|周)/,
@@ -78,24 +82,27 @@ const momentCN = {
         }
     },
     relativeTime: {
-        future: '%s内',
+        future: '%s后',
         past: '%s前',
         s: '几秒',
-        ss: '%d秒',
-        m: '1分钟',
-        mm: '%d分钟',
-        h: '1小时',
-        hh: '%d小时',
-        d: '1天',
-        dd: '%d天',
-        M: '1个月',
-        MM: '%d个月',
-        y: '1年',
-        yy: '%d年'
+        ss: '%d 秒',
+        m: '1 分钟',
+        mm: '%d 分钟',
+        h: '1 小时',
+        hh: '%d 小时',
+        d: '1 天',
+        dd: '%d 天',
+        w: '1 周',
+        ww: '%d 周',
+        M: '1 个月',
+        MM: '%d 个月',
+        y: '1 年',
+        yy: '%d 年'
     },
     week: {
+        // GB/T 7408-1994《数据元和交换格式·信息交换·日期和时间表示法》与ISO 8601:1988等效
         dow: 1, // Monday is the first day of the week.
         doy: 4 // The week that contains Jan 4th is the first week of the year.
     }
 }
-export default momentCN
+export default zhCn

src/views/layouts/base/components/components/LanguageSwitcher.vue

@@ -19,6 +19,8 @@ import { defineComponent, ref } from 'vue'
 import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from '@/components/ui/select'
 import { useI18n } from 'vue-i18n'
 import { StoreUtils } from '@/utils/Store'
+import moment from 'moment'
+import zhCn from '@/moment/zhCn'
 
 export default defineComponent({
   name: 'LanguageSwitcher',
@@ -39,6 +41,12 @@ export default defineComponent({
       else {
         locale.value = language
       }
+      if (language === 'language_zh_cn') {
+        moment.locale('zh-cn', zhCn as any)
+      }
+      else {
+        moment.locale('en')
+      }
     }
 
     injectLanguage(language.value)