feat: 登录页新增语言切换组件并更新登录成功提示多语言

src/components/LanguageSwitcher.vue

@@ -0,0 +1,28 @@
+<template>
+  <t-dropdown trigger="click">
+    <t-button theme="default" shape="square" variant="text">
+      <translate-icon />
+    </t-button>
+    <t-dropdown-menu>
+      <t-dropdown-item
+        v-for="(lang, index) in langList"
+        :key="index"
+        :value="lang.value"
+        @click="(options) => changeLang(options.value as string)"
+        >{{ lang.content }}</t-dropdown-item
+      ></t-dropdown-menu
+    >
+  </t-dropdown>
+</template>
+<script setup lang="ts">
+import { TranslateIcon } from 'tdesign-icons-vue-next';
+
+import { langList } from '@/locales';
+import { useLocale } from '@/locales/useLocale';
+
+const { changeLocale } = useLocale();
+
+const changeLang = (lang: string) => {
+  changeLocale(lang);
+};
+</script>

src/layouts/components/Header.vue

@@ -33,20 +33,7 @@
               <t-icon name="help-circle" />
             </t-button>
           </t-tooltip>
-          <t-dropdown trigger="click">
-            <t-button theme="default" shape="square" variant="text">
-              <translate-icon />
-            </t-button>
-            <t-dropdown-menu>
-              <t-dropdown-item
-                v-for="(lang, index) in langList"
-                :key="index"
-                :value="lang.value"
-                @click="(options) => changeLang(options.value as string)"
-                >{{ lang.content }}</t-dropdown-item
-              ></t-dropdown-menu
-            >
-          </t-dropdown>
+          <language-switcher />
           <t-dropdown :min-column-width="120" trigger="click">
             <template #dropdown>
               <t-dropdown-item class="operations-dropdown-container-item" @click="handleNav('/user/index')">
@@ -75,15 +62,15 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ChevronDownIcon, PoweroffIcon, SettingIcon, TranslateIcon, UserCircleIcon } from 'tdesign-icons-vue-next';
+import { ChevronDownIcon, PoweroffIcon, SettingIcon, UserCircleIcon } from 'tdesign-icons-vue-next';
 import type { PropType } from 'vue';
 import { computed } from 'vue';
 import { useRouter } from 'vue-router';
 
 import LogoFull from '@/assets/assets-logo-full.svg?component';
+import LanguageSwitcher from '@/components/LanguageSwitcher.vue';
 import { prefix } from '@/config/global';
-import { langList, t } from '@/locales';
-import { useLocale } from '@/locales/useLocale';
+import { t } from '@/locales';
 import { getActive } from '@/router';
 import { useSettingStore, useUserStore } from '@/store';
 import type { MenuRoute, ModeType } from '@/types/interface';
@@ -150,11 +137,6 @@ const menuCls = computed(() => {
 const menuTheme = computed(() => theme as ModeType);
 
 // 切换语言
-const { changeLocale } = useLocale();
-const changeLang = (lang: string) => {
-  changeLocale(lang);
-};
-
 const changeCollapsed = () => {
   settingStore.updateConfig({
     isSidebarCompact: !settingStore.isSidebarCompact,

src/locales/lang/en_US/pages/login.ts

@@ -10,6 +10,7 @@ export default {
   wechatLogin: 'Login with WeChat',
   accountLogin: 'Login with Account',
   phoneLogin: 'Login with Mobile Phone',
+  loginSuccess: 'Login successful',
   input: {
     account: 'please enter account',
     password: 'please enter password',

src/locales/lang/zh_CN/pages/login.ts

@@ -11,6 +11,7 @@ export default {
   wechatLogin: '使用微信扫一扫登录',
   accountLogin: '使用账号登录',
   phoneLogin: '使用手机号登录',
+  loginSuccess: '登录成功',
   input: {
     account: '请输入账号',
     password: '请输入登录密码',

src/pages/login/components/Header.vue

@@ -8,6 +8,7 @@
       <t-button theme="default" shape="square" variant="text" @click="navToHelper">
         <t-icon name="help-circle" class="icon" />
       </t-button>
+      <language-switcher />
       <t-button theme="default" shape="square" variant="text" @click="toggleSettingPanel">
         <t-icon name="setting" class="icon" />
       </t-button>
@@ -16,9 +17,11 @@
 </template>
 <script setup lang="ts">
 import LogoFullIcon from '@/assets/assets-logo-full.svg?component';
+import LanguageSwitcher from '@/components/LanguageSwitcher.vue';
 import { useSettingStore } from '@/store';
 
 const settingStore = useSettingStore();
+
 const toggleSettingPanel = () => {
   settingStore.updateConfig({
     showSettingPanel: true,

src/pages/login/components/Login.vue

@@ -138,7 +138,7 @@ const onSubmit = async (ctx: SubmitContext) => {
     try {
       await userStore.login(formData.value);
 
-      MessagePlugin.success('登录成功');
+      MessagePlugin.success(t('pages.login.loginSuccess'));
       const redirect = route.query.redirect as string;
       const redirectUrl = redirect ? decodeURIComponent(redirect) : '/dashboard';
       router.push(redirectUrl);