src/Dashboard.tsx

@@ -20,6 +20,8 @@ import { toast } from 'sonner';
 import { Toaster } from 'sonner';
 import { env } from './utils/env';
 import { getMenus, hasMenuPathPermission, mapMenuPathToKey, getPermissionUser, hasRole } from './utils/permission';
+import { Dropdown } from 'antd';
+import type { MenuProps } from 'antd';
 
 export default function Dashboard() {
   const navigate = useNavigate();
@@ -96,14 +98,27 @@ export default function Dashboard() {
   const userInfo = useMemo(() => getPermissionUser(), []);
 
   // 切换语言
-  const toggleLanguage = () => {
-    const newLang = i18n.language === 'zh' ? 'en' : 'zh';
-    i18n.changeLanguage(newLang).then(() => {
+  const changeLanguage = (lang: 'zh' | 'en') => {
+    i18n.changeLanguage(lang).then(() => {
       // 语言切换后，强制组件更新以确保菜单重新渲染
       window.dispatchEvent(new Event('languagechange'));
     });
   };
 
+  // 语言下拉菜单项
+  const languageMenuItems: MenuProps['items'] = [
+    {
+      key: 'zh',
+      label: '中文',
+      onClick: () => changeLanguage('zh'),
+    },
+    {
+      key: 'en',
+      label: 'English',
+      onClick: () => changeLanguage('en'),
+    },
+  ];
+
   // 登出处理
   const handleLogout = async () => {
     try {
@@ -1307,13 +1322,23 @@ export default function Dashboard() {
             {/* 右侧功能区 */}
             <div className="flex items-center gap-2 lg:gap-4 flex-shrink-0">
               {/* 语言切换 */}
-              <button
-                onClick={toggleLanguage}
-                className="flex items-center gap-2 px-3 py-2 hover:bg-gray-100 rounded-xl transition-colors group"
+              <Dropdown
+                menu={{ items: languageMenuItems }}
+                trigger={['click']}
+                placement="bottomRight"
               >
-                <Globe className="w-4 h-4 text-gray-600 group-hover:rotate-12 transition-transform" />
-                <span className="text-sm text-gray-700">{i18n.language === 'zh' ? t('nav.switchToEnglish') : t('nav.switchToChinese')}</span>
-              </button>
+                <button
+                  className="flex items-center gap-2 px-3 py-2 hover:bg-gray-100 rounded-xl transition-colors group"
+                >
+                  {/* <Globe className="w-4 h-4 text-gray-600 group-hover:rotate-12 transition-transform" /> */}
+                  {/* <span className="text-sm text-gray-700">{i18n.language === 'zh' ? '中文' : 'English'}</span> */}
+                  {/* <span className="text-sm text-gray-700">语言切换</span> */}
+                  {/* <ChevronDown className="w-3 h-3 text-gray-500" /> */}
+                    <svg t="1770183289750" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5073" width="24" height="24" ><path d="M789.312 426.688L977.088 896H885.12l-51.2-128h-174.528l-51.2 128H516.352L704 426.688h85.312zM426.688 85.312v85.376h256V256H598.72A777.472 777.472 0 0 1 444.16 524.8c30.784 27.52 64.192 51.84 99.712 72.896l-32 80.128A728.96 728.96 0 0 1 384 585.664a711.68 711.68 0 0 1-264.512 151.296l-22.976-82.304A627.2 627.2 0 0 0 323.84 524.928a771.328 771.328 0 0 1-120.448-183.616H298.88c23.808 43.968 52.352 85.12 85.056 122.816C437.312 402.56 479.36 332.16 508.16 256H85.312V170.688h256V85.312h85.376z m320 464.448l-53.184 132.928h106.24l-53.12-132.928z" fill="#515151" p-id="5074">
+                      </path></svg>
+         
+                </button>
+              </Dropdown>
               
               {/* 消息通知 - 显示未读消息红点和消息列表 */}
               <MessageNotification />

src/views/Login.tsx

@@ -1,7 +1,9 @@
 import React, { useState, useEffect } from 'react';
 import { useNavigate, useSearchParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
-import { Shield, Zap, Lock, User, Eye, EyeOff, ArrowRight, Activity, Radio, Layers, Building2, Globe } from 'lucide-react';
+import { Shield, Zap, Lock, User, Eye, EyeOff, ArrowRight, Activity, Radio, Layers, Building2, Globe, ChevronDown } from 'lucide-react';
+import { Dropdown } from 'antd';
+import type { MenuProps } from 'antd';
 import { loginApi } from '../api';
 import type { LoginFormParams } from '../api/Login';
 import { toast } from 'sonner';
@@ -45,11 +47,24 @@ export default function Login() {
   const [resetPasswordLoading, setResetPasswordLoading] = useState(false);
 
   // 切换语言
-  const toggleLanguage = () => {
-    const newLang = i18n.language === 'zh' ? 'en' : 'zh';
-    i18n.changeLanguage(newLang);
+  const changeLanguage = (lang: 'zh' | 'en') => {
+    i18n.changeLanguage(lang);
   };
 
+  // 语言下拉菜单项
+  const languageMenuItems: MenuProps['items'] = [
+    {
+      key: 'zh',
+      label: '中文',
+      onClick: () => changeLanguage('zh'),
+    },
+    {
+      key: 'en',
+      label: 'English',
+      onClick: () => changeLanguage('en'),
+    },
+  ];
+
   // 密码强度计算
   const calculatePasswordStrength = (pwd: string) => {
     let strength = 0;
@@ -590,15 +605,23 @@ export default function Login() {
 
   return (
     <div className="min-h-screen h-screen relative overflow-hidden bg-white">
-      {/* 语言切换按钮 */}
+      {/* 语言切换 */}
       <div className="absolute top-6 right-6 z-50">
-        <button
-          onClick={toggleLanguage}
-          className="flex items-center gap-2 px-4 py-2.5 bg-white/90 backdrop-blur-sm border border-gray-200/50 rounded-xl shadow-lg hover:shadow-xl hover:bg-white transition-all group"
+        <Dropdown
+          menu={{ items: languageMenuItems }}
+          trigger={['click']}
+          placement="bottomRight"
         >
-          <Globe className="w-4 h-4 text-blue-600 group-hover:rotate-12 transition-transform" />
-          <span className="text-sm text-gray-700">{i18n.language === 'zh' ? 'EN' : '中文'}</span>
-        </button>
+          <button
+            className="flex items-center gap-2 px-4 py-2.5 bg-white/90 backdrop-blur-sm border border-gray-200/50 rounded-xl shadow-lg hover:shadow-xl hover:bg-white transition-all group"
+          >
+            {/* <Globe className="w-4 h-4 text-blue-600 group-hover:rotate-12 transition-transform" />
+            <span className="text-sm text-gray-700">{i18n.language === 'zh' ? '中文' : 'English'}</span>
+            <ChevronDown className="w-3 h-3 text-gray-500" /> */}
+             <svg t="1770183289750" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5073" width="24" height="24" ><path d="M789.312 426.688L977.088 896H885.12l-51.2-128h-174.528l-51.2 128H516.352L704 426.688h85.312zM426.688 85.312v85.376h256V256H598.72A777.472 777.472 0 0 1 444.16 524.8c30.784 27.52 64.192 51.84 99.712 72.896l-32 80.128A728.96 728.96 0 0 1 384 585.664a711.68 711.68 0 0 1-264.512 151.296l-22.976-82.304A627.2 627.2 0 0 0 323.84 524.928a771.328 771.328 0 0 1-120.448-183.616H298.88c23.808 43.968 52.352 85.12 85.056 122.816C437.312 402.56 479.36 332.16 508.16 256H85.312V170.688h256V85.312h85.376z m320 464.448l-53.184 132.928h106.24l-53.12-132.928z" fill="#515151" p-id="5074">
+                      </path></svg>
+          </button>
+        </Dropdown>
       </div>
 
       {/* 太极式背景分割 */}