From 96b213354b9a04ce254bf3e4b71e6973e04486df Mon Sep 17 00:00:00 2001
From: Zhou Weidong <502333560@qq.com>
Date: Mon, 9 Nov 2026 10:27:49 +0800
Subject: [PATCH] =?UTF-8?q?fix(layout):=20=E6=89=A9=E5=A4=A7=E9=A1=B6?=
 =?UTF-8?q?=E6=A0=8F=E5=9B=BE=E6=A0=87=E4=B8=8E=E7=94=A8=E6=88=B7=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E7=82=B9=E5=87=BB=E7=83=AD=E5=8C=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/UserInfo/src/UserInfo.vue | 19 ++++++++++------
 src/layout/components/ToolHeader.vue     | 28 +++++++++++++++++++++++-
 2 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/src/components/UserInfo/src/UserInfo.vue b/src/components/UserInfo/src/UserInfo.vue
index f0a8ecc..19959a5 100644
--- a/src/components/UserInfo/src/UserInfo.vue
+++ b/src/components/UserInfo/src/UserInfo.vue
@@ -40,10 +40,19 @@ const dialogVisible = ref<boolean>(false)
 const lockScreen = () => {
   dialogVisible.value = true
 }
+
+// 点击整行菜单项都能触发（之前 click 绑在内层文字 div 上，点到菜单项左右内边距没反应）
+const handleCommand = (command: string) => {
+  if (command === 'lock') {
+    lockScreen()
+  } else if (command === 'logout') {
+    loginOut()
+  }
+}
 </script>
 
 <template>
-  <ElDropdown class="custom-hover" :class="prefixCls" trigger="click">
+  <ElDropdown class="custom-hover" :class="prefixCls" trigger="click" @command="handleCommand">
     <div class="flex items-center">
       <img
         v-if="avatarUrl"
@@ -63,12 +72,8 @@ const lockScreen = () => {
     </div>
     <template #dropdown>
       <ElDropdownMenu>
-        <ElDropdownItem>
-          <div @click="lockScreen">{{ t('lock.lockScreen') }}</div>
-        </ElDropdownItem>
-        <ElDropdownItem>
-          <div @click="loginOut">{{ t('common.loginOut') }}</div>
-        </ElDropdownItem>
+        <ElDropdownItem command="lock">{{ t('lock.lockScreen') }}</ElDropdownItem>
+        <ElDropdownItem command="logout">{{ t('common.loginOut') }}</ElDropdownItem>
       </ElDropdownMenu>
     </template>
   </ElDropdown>
diff --git a/src/layout/components/ToolHeader.vue b/src/layout/components/ToolHeader.vue
index eb17ab1..42ae7f3 100644
--- a/src/layout/components/ToolHeader.vue
+++ b/src/layout/components/ToolHeader.vue
@@ -10,6 +10,7 @@ import TranscodeNoticeButton from './TranscodeNoticeButton.vue'
 import { Screenfull } from '@/components/Screenfull'
 import { Breadcrumb } from '@/components/Breadcrumb'
 import { useAppStore } from '@/store/modules/app'
+import { useUserStore } from '@/store/modules/user'
 import { useDesign } from '@/hooks/web/useDesign'
 
 const { getPrefixCls, variables } = useDesign()
@@ -18,6 +19,16 @@ const prefixCls = getPrefixCls('tool-header')
 
 const appStore = useAppStore()
 
+const userStore = useUserStore()
+
+// 转码通知接口要求 drama:list，创作者账号没有该权限。
+// 不给入口，避免顶栏每 30 秒轮询打一次 403。
+const canSeeTranscodeNotice = computed(() => {
+  const permissions = userStore.getUserInfo?.permissions
+  if (Array.isArray(permissions)) return permissions.includes('drama:list')
+  return typeof permissions === 'string' && permissions.split(',').includes('drama:list')
+})
+
 // 面包屑
 const breadcrumb = computed(() => appStore.getBreadcrumb)
 
@@ -74,7 +85,9 @@ export default defineComponent({
               color="var(--top-header-text-color)"
             ></LocaleDropdown>
           ) : undefined}
-          <TranscodeNoticeButton color="var(--top-header-text-color)"></TranscodeNoticeButton>
+          {canSeeTranscodeNotice.value ? (
+            <TranscodeNoticeButton color="var(--top-header-text-color)"></TranscodeNoticeButton>
+          ) : undefined}
           <UserInfo></UserInfo>
         </div>
       </div>
@@ -95,6 +108,19 @@ export default defineComponent({
   :deep(.v-user-info) {
     flex-shrink: 0;
   }
+
+  // 顶栏图标的点击热区原来只有 18px 图标本身，容易点偏导致「点了没反应」。
+  // 统一撑满顶栏高度并左右留出内边距。
+  :deep(.v-screenfull),
+  :deep(.v-size-dropdown),
+  :deep(.v-locale-dropdown),
+  :deep(.v-user-info) {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    padding: 0 8px;
+    cursor: pointer;
+  }
 }
 
 @media (width <= 768px) {