feat 优化切换语言相关

web-vue/src/i18n/index.ts

@@ -11,18 +11,35 @@
 import { createI18n } from 'vue-i18n'
 
 type LangType = {
+  label: string
   antd: () => Promise<any>
   local: () => Promise<any>
 }
 
 export const langDict: { [key: string]: LangType } = {
   'zh-cn': {
+    // 🇨🇳
+    label: '\u4e2d\u6587\u002d\u7b80\u4f53',
     antd: () => import(/* @vite-ignore  */ 'ant-design-vue/es/locale/zh_CN'),
     local: () => import(/* @vite-ignore  */ './locales/zh_cn.json')
   },
   'en-us': {
+    // 🇺🇸
+    label: 'English',
     antd: () => import(/* @vite-ignore  */ 'ant-design-vue/es/locale/en_US'),
     local: () => import(/* @vite-ignore  */ './locales/en_us.json')
+  },
+  'zh-hk': {
+    // 🇭🇰
+    label: '\u4e2d\u6587\u002d\u9999\u6e2f',
+    antd: () => import(/* @vite-ignore  */ 'ant-design-vue/es/locale/zh_HK'),
+    local: () => import(/* @vite-ignore  */ './locales/zh_hk.json')
+  },
+  'zh-tw': {
+    // 🇨🇳
+    label: '\u4e2d\u6587\u002d\u81fa\u7063',
+    antd: () => import(/* @vite-ignore  */ 'ant-design-vue/es/locale/zh_TW'),
+    local: () => import(/* @vite-ignore  */ './locales/zh_tw.json')
   }
 }
 
@@ -32,6 +49,7 @@ const i18n = createI18n<Record<string, any>>({
   warnHtmlMessage: false
 })
 
+export default i18n
 export const changeLang = async (langKey: string) => {
   langKey = langKey.toLowerCase()
   const lang = langDict[langKey || 'zh-cn']
@@ -51,17 +69,22 @@ export const loadLanguageAsync = async (langKey: string, langDict: LangType) =>
   return setI18nLanguage(langKey) // 返回并且设置
 }
 
-export default i18n
-
 export const { t } = i18n.global
 
-export const supportLang = [
-  {
-    label: '\u7b80\u4f53\u4e2d\u6587',
-    value: 'zh-cn'
-  },
-  {
-    label: 'English',
-    value: 'en-us'
+export const supportLang = Object.keys(langDict).map((key: string) => {
+  return {
+    label: langDict[key].label,
+    value: key
   }
-]
+})
+
+// [
+//   {
+//     label: '\u7b80\u4f53\u4e2d\u6587',
+//     value: 'zh-cn'
+//   },
+//   {
+//     label: 'English',
+//     value: 'en-us'
+//   }
+// ]

web-vue/src/pages/layout/user-header.vue

@@ -457,11 +457,12 @@
         </a-form-item>
         <a-form-item :label="$t('i18n_295bb704f5')">
           <template #help>{{ $t('i18n_9030cebe31') }}</template>
-          <a-radio-group v-model:value="locale" button-style="solid">
-            <a-radio-button v-for="item in supportLang" :key="item.value" :value="item.value">{{
+
+          <a-select v-model:value="locale" style="width: 220px">
+            <a-select-option v-for="item in supportLang" :key="item.value" :value="item.value">{{
               item.label
-            }}</a-radio-button>
-          </a-radio-group>
+            }}</a-select-option>
+          </a-select>
         </a-form-item>
       </a-form>
     </CustomModal>
@@ -634,6 +635,7 @@ export default {
     },
     locale: {
       set: function (value) {
+        console.log(value)
         useGuideStore().changeLocale(value)
       },
       get: function () {

web-vue/src/stores/guide.ts

@@ -1,4 +1,4 @@
-import { t } from '@/i18n'
+import { supportLang, t } from '@/i18n'
 ///
 /// Copyright (c) 2019 Of Him Code Technology Studio
 /// Jpom is licensed under Mulan PSL v2.
@@ -265,8 +265,7 @@ export const useGuideStore = defineStore('guide', {
     getLocale: (state) => {
       return () => {
         const locale = state.guideCache.locale || navigator.language
-        const array = ['zh-cn', 'en-us', 'zh_cn', 'en_us']
-        if (array.includes(locale.toLowerCase())) {
+        if (supportLang.map((item) => item.value).includes(locale.toLowerCase())) {
           // 避免非法字符串
           return locale
         }