From f81e94ea2ba42985f7ea353afe89257236246f90 Mon Sep 17 00:00:00 2001
From: hwj <huangweijie@gdngsk.com>
Date: Tue, 16 Jun 2026 10:46:09 +0800
Subject: [PATCH] =?UTF-8?q?style=EF=BC=9A=E8=8F=9C=E5=8D=95=E4=B8=AD?=
 =?UTF-8?q?=E8=8B=B1=E6=96=87=E9=80=82=E9=85=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/PermissionMenuPage.vue | 25 +++++++++++++-------
 src/components/common/TabBar.vue             |  5 ++--
 src/pages_mine/pages/setting/index.vue       |  2 +-
 src/utils/permissionMenu.js                  | 16 ++++++++++---
 4 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/src/components/common/PermissionMenuPage.vue b/src/components/common/PermissionMenuPage.vue
index 8e1b115..314a4e5 100644
--- a/src/components/common/PermissionMenuPage.vue
+++ b/src/components/common/PermissionMenuPage.vue
@@ -37,7 +37,7 @@
             <!-- <view class="module-icon" :style="{ background: getModuleColor(moduleIndex) }">
               <text class="icon-text">{{ getMenuSymbol(module.name, moduleIndex) }}</text>
             </view> -->
-            <text class="module-title">{{ translateLiteral(module.name) }}</text>
+            <text class="module-title">{{ getDisplayName(module) }}</text>
           </view>
 
           <view class="function-grid">
@@ -60,9 +60,9 @@
                   size="24"
                   :color="getModuleColor(moduleIndex)"
                 ></u-icon>
-                <text v-else class="icon-inner">{{ getMenuSymbol(entry.name, entryIndex) }}</text>
+                <text v-else class="icon-inner">{{ getMenuSymbol(getDisplayName(entry), entryIndex) }}</text>
               </view>
-              <text class="function-name">{{ translateLiteral(entry.name) }}</text>
+              <text class="function-name">{{ getDisplayName(entry) }}</text>
             </view>
           </view>
         </view>
@@ -77,10 +77,10 @@
 
 <script setup>
 import { computed, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
 import AppEmptyState from '@/components/common/AppEmptyState.vue'
-import { translateLiteral } from '@/locales'
 import useUserStore from '@/store/modules/user'
-import { buildPageModules, findTabMenuByPage, getMenuSymbol, getModuleColor, resolveMenuUrl } from '@/utils/permissionMenu'
+import { buildPageModules, findTabMenuByPage, getLocalizedMenuName, getMenuSymbol, getModuleColor, resolveMenuUrl } from '@/utils/permissionMenu'
 
 const props = defineProps({
   pagePath: {
@@ -118,6 +118,7 @@ const props = defineProps({
 })
 
 const userStore = useUserStore()
+const { locale } = useI18n()
 const menuSearchKeyword = ref('')
 const scrollTop = ref(0)
 const currentScrollTop = ref(0)
@@ -138,11 +139,11 @@ const filteredModules = computed(() => {
     .map((module) => ({
       ...module,
       children: (module.children || []).filter((entry) => {
-        const target = `${module.name}|${entry.name}`.toLowerCase()
+        const target = `${getDisplayName(module)}|${getDisplayName(entry)}`.toLowerCase()
         return target.includes(keyword)
       })
     }))
-    .filter((module) => (module.children || []).length > 0 || String(module.name || '').toLowerCase().includes(keyword))
+    .filter((module) => (module.children || []).length > 0 || getDisplayName(module).toLowerCase().includes(keyword))
 })
 
 const hasMenuPermission = computed(() => modules.value.length > 0)
@@ -209,16 +210,22 @@ function getUviewIconName(icon) {
   return String(icon || '').replace(/^uview-plus:/, '').trim()
 }
 
+function getDisplayName(menu) {
+  locale.value
+  return getLocalizedMenuName(menu)
+}
+
 function handleClick(menu) {
   const url = resolveMenuUrl(menu)
-  console.log('[PermissionMenu] 点击菜单:', menu?.name, '| _splitKey:', menu?._splitKey, '| 路由:', url)
+  const displayName = getDisplayName(menu)
+  console.log('[PermissionMenu] 点击菜单:', displayName, '| _splitKey:', menu?._splitKey, '| 路由:', url)
   if (url) {
     uni.navigateTo({ url })
     return
   }
 
   uni.showToast({
-    title: `暂未配置${menu?.name || '该菜单'}页面`,
+    title: `暂未配置${displayName || '该菜单'}页面`,
     icon: 'none'
   })
 }
diff --git a/src/components/common/TabBar.vue b/src/components/common/TabBar.vue
index b64fd24..82852a2 100644
--- a/src/components/common/TabBar.vue
+++ b/src/components/common/TabBar.vue
@@ -25,9 +25,8 @@
 import { ref, computed, onMounted, onUnmounted, watch } from 'vue'
 import useUserStore from '@/store/modules/user'
 import { storeToRefs } from 'pinia'
-import { getTabBarMenus } from '@/utils/permissionMenu'
+import { getLocalizedMenuName, getTabBarMenus } from '@/utils/permissionMenu'
 import { useI18n } from 'vue-i18n'
-import { translateLiteral } from '@/locales'
 
 const TABBAR_VISIBILITY_EVENT = 'tabbar-visibility-change'
 
@@ -87,7 +86,7 @@ function resolveTabIconMeta(menu) {
 function createTabItem(menu) {
   const iconMeta = resolveTabIconMeta(menu)
   return {
-    text: translateLiteral(String(menu.name || menu.enName || '').trim()),
+    text: getLocalizedMenuName(menu),
     icon: iconMeta.icon,
     selectedIcon: iconMeta.selectedIcon,
     iconType: iconMeta.iconType,
diff --git a/src/pages_mine/pages/setting/index.vue b/src/pages_mine/pages/setting/index.vue
index e749f95..503daab 100644
--- a/src/pages_mine/pages/setting/index.vue
+++ b/src/pages_mine/pages/setting/index.vue
@@ -178,7 +178,7 @@ function dialogClose() {
 
 .server-address-text {
   max-width: 400rpx;
-  text-align: right;
+  // text-align: right;
   word-break: break-all;
 }
 </style>
diff --git a/src/utils/permissionMenu.js b/src/utils/permissionMenu.js
index f431de9..60de1a1 100644
--- a/src/utils/permissionMenu.js
+++ b/src/utils/permissionMenu.js
@@ -1,3 +1,4 @@
+import { getCurrentLocale } from '@/locales'
 
 const DIRECT_ROUTE_PREFIXES = ['pages/', 'page_', 'pages_']
 
@@ -191,7 +192,7 @@ export function getConfigurableNavMenus(menus) {
 
 export function buildNavMenuViewModels(menus) {
   return getConfigurableNavMenus(menus).map((menu, index) => {
-    const displayName = String(menu.name || menu.enName || '').trim() || `菜单${index + 1}`
+    const displayName = getLocalizedMenuName(menu, `菜单${index + 1}`)
     return {
       ...menu,
       displayName,
@@ -334,13 +335,22 @@ export function getMenuSymbol(name, index) {
   return MENU_SYMBOLS[index % MENU_SYMBOLS.length]
 }
 
+export function getLocalizedMenuName(menu, fallback = '') {
+  const name = String(menu?.name || '').trim()
+  const enName = String(menu?.enName || '').trim()
+  if (getCurrentLocale() === 'en-US') {
+    return enName || name || fallback
+  }
+  return name || enName || fallback
+}
+
 export function syncTabBarMenus(menus, options = {}) {
   const reportMenu = findTabMenuByPage(menus, 'pages/report')
   const workMenu = findTabMenuByPage(menus, 'pages/work')
   return [
     options.homeText || '首页',
-    reportMenu?.name || options.reportFallback || '报表',
-    workMenu?.name || reportMenu?.name || options.workFallback || '管理',
+    getLocalizedMenuName(reportMenu, options.reportFallback || '报表'),
+    getLocalizedMenuName(workMenu, getLocalizedMenuName(reportMenu, options.workFallback || '管理')),
     options.mineText || '我的'
   ]
 }