添加国际化支持

package-lock.json

@@ -12,6 +12,7 @@
         "pinia": "^2.2.6",
         "sweetalert2": "^11.14.5",
         "vue": "^3.5.12",
+        "vue-i18n": "^10.0.4",
         "vue-router": "^4.4.5",
         "vue-sweetalert2": "^5.0.11"
       },
@@ -458,6 +459,50 @@
         "node": ">=12"
       }
     },
+    "node_modules/@intlify/core-base": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/core-base/-/core-base-10.0.4.tgz",
+      "integrity": "sha512-GG428DkrrWCMhxRMRQZjuS7zmSUzarYcaHJqG9VB8dXAxw4iQDoKVQ7ChJRB6ZtsCsX3Jse1PEUlHrJiyQrOTg==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/message-compiler": "10.0.4",
+        "@intlify/shared": "10.0.4"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/message-compiler": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/message-compiler/-/message-compiler-10.0.4.tgz",
+      "integrity": "sha512-AFbhEo10DP095/45EauinQJ5hJ3rJUmuuqltGguvc3WsvezZN+g8qNHLGWKu60FHQVizMrQY7VJ+zVlBXlQQkQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/shared": "10.0.4",
+        "source-map-js": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/shared": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-10.0.4.tgz",
+      "integrity": "sha512-ukFn0I01HsSgr3VYhYcvkTCLS7rGa0gw4A4AMpcy/A9xx/zRJy7PS2BElMXLwUazVFMAr5zuiTk3MQeoeGXaJg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
     "node_modules/@jridgewell/sourcemap-codec": {
       "version": "1.5.0",
       "resolved": "https://registry.npmmirror.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
@@ -1489,6 +1534,26 @@
         }
       }
     },
+    "node_modules/vue-i18n": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-10.0.4.tgz",
+      "integrity": "sha512-1xkzVxqBLk2ZFOmeI+B5r1J7aD/WtNJ4j9k2mcFcQo5BnOmHBmD7z4/oZohh96AAaRZ4Q7mNQvxc9h+aT+Md3w==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/core-base": "10.0.4",
+        "@intlify/shared": "10.0.4",
+        "@vue/devtools-api": "^6.5.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/vue-router": {
       "version": "4.4.5",
       "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.4.5.tgz",

package.json

@@ -13,6 +13,7 @@
     "pinia": "^2.2.6",
     "sweetalert2": "^11.14.5",
     "vue": "^3.5.12",
+    "vue-i18n": "^10.0.4",
     "vue-router": "^4.4.5",
     "vue-sweetalert2": "^5.0.11"
   },

src/i18n/index.js

@@ -0,0 +1,16 @@
+import {createI18n} from "vue-i18n";
+import zh from "@/i18n/languages/language-zh.json"
+import en from "@/i18n/languages/language-en.json"
+
+const lang = window.navigator.language.replace('-', '_')
+
+const i18n = createI18n({
+    locale: lang,
+    fallbackLocale: 'zh_CN',
+    messages: {
+        'zh_CN': zh,
+        'en_US': en
+    }
+})
+
+export default i18n;

src/i18n/languages/language-en.json

@@ -0,0 +1,5 @@
+{
+  "system": {
+    "name": "Crazy child program club"
+  }
+}

src/i18n/languages/language-zh.json

@@ -0,0 +1,5 @@
+{
+  "system": {
+    "name": "开心少儿编程俱乐部"
+  }
+}

src/main.js

@@ -6,11 +6,13 @@ import router from './router'
 
 import VueSweetalert2 from 'vue-sweetalert2';
 import 'sweetalert2/dist/sweetalert2.min.css';
+import i18n from "@/i18n/index.js";
 
 const app = createApp(App)
 
 app.use(VueSweetalert2);
 app.use(createPinia())
 app.use(router)
+app.use(i18n)
 
 app.mount('#app')

src/net/index.js

@@ -2,6 +2,7 @@ import axios from "axios";
 import {clearToken, getToken} from "@/utils/token.js";
 import Swal from "sweetalert2";
 import router from "@/router/index.js";
+import i18n from "@/i18n/index.js";
 
 axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 const request = axios.create({
@@ -17,6 +18,9 @@ request.interceptors.request.use(config => {
         config.headers['Authorization'] = 'Bearer ' + token
     }
 
+    if(!config.params) config.params = {}
+    config.params.lang = i18n.global.locale
+
     return config
 })
 

src/views/Welcome.vue

@@ -49,7 +49,7 @@ const vips = [
             <div class="hero-content-text">
               <h6 class="wow fadeInUp" data-wow-delay="500ms" style="visibility: visible; animation-delay: 500ms; animation-name: fadeInUp;"><i class="icon-icon_document_alt"></i>
                 欢迎加入柏码</h6>
-              <h2 class="wow fadeInUp" data-wow-delay="900ms" style="visibility: visible; animation-delay: 900ms; animation-name: fadeInUp;">开心少儿编程俱乐部
+              <h2 class="wow fadeInUp" data-wow-delay="900ms" style="visibility: visible; animation-delay: 900ms; animation-name: fadeInUp;">{{ $t('system.name') }}
               </h2>
               <div class="hero-btn-area mt-5 wow fadeInUp" data-wow-delay="1300ms" style="visibility: visible; animation-delay: 1300ms; animation-name: fadeInUp;">
                 <a class="btn-1" href="about.html">了解更多 <span class="icon-right-arrow-11"></span></a>

src/views/auth/Login.vue

@@ -30,7 +30,7 @@ function login() {
       refreshImage()
       Swal.fire({
         title: "登录失败",
-        text: "请检查您的账号或密码是否正确",
+        text: data.msg,
         icon: "error"
       })
     } else {