解决中英文问题

WebVue/src/locales/index.ts

@@ -2,7 +2,11 @@ import { createI18n } from 'vue-i18n'
 import type { I18nOptions } from 'vue-i18n';
 import type { App } from 'vue';
 import { set } from 'lodash-es';
+import axios from 'axios';
 import type { LocaleEntity } from '@/data/auto/localeEntity';
+import { WebSitePolicy } from '@/policy/custom/webSitePolicy';
+import en from './lang/en.ts';
+import cn from './lang/zh-cn.ts';
 
 //这儿使用await，需要如下两步处理
 //npm install vite-plugin-top-level-await -D
@@ -15,16 +19,14 @@ const i18n:any =createI18n( options)
 
 async function createI18nOptions(): Promise<I18nOptions> {
   const locale:string='zh-cn';
-  const en = await import(`./lang/en.ts`);
-  const cn = await import(`./lang/zh-cn.ts`);
 
   return {
     legacy: false,
     globalInjection: true, //全局生效$t
     locale: locale,          // 默认cn翻译
     messages: {
-      ['zh-cn']: cn.default?.message,
-      ['en']: en.default?.message,
+      ['zh-cn']: cn?.message,
+      ['en']: en?.message,
     },
     sync: true, //If you don’t want to inherit locale from global scope, you need to set sync of i18n component option to false.
     silentTranslationWarn: true, // true - warning off
@@ -36,6 +38,10 @@ async function createI18nOptions(): Promise<I18nOptions> {
 // setup i18n instance with global
 export async function setupI18n(app: App) {
   app.use(i18n);
+  // 初始化 i18n 后拉取数据库翻译并合并。
+  // 注意：不能 await，否则接口慢/挂起会阻塞 app.mount 导致白屏；
+  // mergeLocaleMessage 是响应式的，合并完成界面文案会自动更新，失败只 warn。
+  mergeDbLocaleMessages();
 }
 
 /**
@@ -46,12 +52,24 @@ export async function setupI18n(app: App) {
  *   GroupName -> 顶层分组（对应 json 文件名的 key，如 layout / login / request）
  *   Name      -> 点分隔的翻译 key（如 header.logout）
  *   Value     -> 翻译文本
- * 需在应用启动后调用；内部使用动态 import，避免与 utils/request 形成循环依赖。
+ * 需在应用启动后调用；参考 router/insideLayout.ts，直接使用 axios 裸调接口，
+ * 不经过 utils/request 封装，避免与其形成循环依赖。
  */
 export async function mergeDbLocaleMessages() {
   try {
-    const { default: localeService } = await import('@/service/security/localeService');
-    const list = await localeService.FindAll();
+    // 参考 router/insideLayout.ts 的 axios 调用方式
+    if (process.env.NODE_ENV === "development") {
+      axios.defaults.baseURL = WebSitePolicy.WebApiRootDev;
+      axios.defaults.withCredentials = true;
+    } else {
+      axios.defaults.baseURL = WebSitePolicy.WebApiRoot;
+    }
+    const response = await axios.create().request({
+      url: "/Locale/FindAll",
+      method: "get",
+    });
+
+    const list: LocaleEntity[] = response.status == 200 ? response.data : [];
     if (!list || list.length === 0) return;
 
     // 按语言分组，并将 GroupName.Name 铺平成嵌套对象

WebVue/src/locales/lang/en/login.json

@@ -1,15 +1,17 @@
 {
+    "login": {
+        "login": "Login"
+    },
     "register": {
         "twoDifferentPasswords": "Two different passwords",
         "pleaseEnterYourConfirmationPassword": "Please enter your confirmation password"
     },
     "changePassword": {
         "changePassword": "Change Password",
-        "oldPassword":"Old Password",
-        "newPassword":"New Password",
-        "confirmPassword":"Confirm Password",
-        "pleaseInputOldPassword":"Please input old password",
-        "pleaseInputNewPassword":"Please input new password"
-
+        "oldPassword": "Old Password",
+        "newPassword": "New Password",
+        "confirmPassword": "Confirm Password",
+        "pleaseInputOldPassword": "Please input old password",
+        "pleaseInputNewPassword": "Please input new password"
     }
 }

WebVue/src/locales/lang/zh-cn/login.json

@@ -1,14 +1,17 @@
 {
+  "login": {
+    "login": "登录"
+  },
   "register": {
     "pleaseEnterYourConfirmationPassword": "请输入确认密码",
     "twoDifferentPasswords": "两次密码不一样"
   },
   "changePassword": {
     "changePassword": "修改密码",
-    "oldPassword":"旧密码",
-    "newPassword":"新密码",
-    "confirmPassword":"确认密码",
-    "pleaseInputOldPassword":"请输入旧密码",
-    "pleaseInputNewPassword":"请输入新密码"
-}
-}
+    "oldPassword": "旧密码",
+    "newPassword": "新密码",
+    "confirmPassword": "确认密码",
+    "pleaseInputOldPassword": "请输入旧密码",
+    "pleaseInputNewPassword": "请输入新密码"
+  }
+}

WebVue/src/main.ts

@@ -5,7 +5,7 @@ import App from "./App.vue";
 import { setupStore } from "./store";
 //使用了Top await
 import { setupRouter } from "./router";
-import { mergeDbLocaleMessages } from "./locales";
+import { setupI18n } from "./locales";
 
 import {
   setupAntd,
@@ -33,11 +33,10 @@ function setupPlugins() {
 async function setupApp() {
   // 挂载pinia状态管理
   setupStore(app);
-  // 并行加载数据库 locale 表内容作为中英文翻译补充
-  const dbLocale = mergeDbLocaleMessages();
   // 挂载路由
   await setupRouter(app);
-  await dbLocale;
+  // 初始化 i18n（内部会异步拉取数据库翻译补充，不阻塞挂载）
+  await setupI18n(app);
 
   app.mount("#app");
 }

WebVue/src/views/login/index.vue

@@ -17,10 +17,10 @@
           </a-input>
         </a-form-item>
         <a-form-item>
-          <a-button type="primary" html-type="submit" size="large" block> 登录 </a-button>
+          <a-button type="primary" html-type="submit" size="large" block> {{ t('login.login.login')}} </a-button>
         </a-form-item>
         <!-- 技术上已实现，暂时不加入中文系统 -->
-        <div class="culture-switch" v-if="false">
+        <div class="culture-switch" v-if="true">
           <a-button
             type="text"
             size="large"