移动端适配

schoolNewsWeb/src/layouts/BasicLayout.vue

@@ -13,7 +13,7 @@
 
       <div class="header-right">
         <!-- 用户信息 -->
-        <UserDropdown :user="userInfo" @logout="handleLogout" />
+        <UserDropdown :userinfo="userInfo" @logout="handleLogout" />
       </div>
     </header>
     <!-- 主内容区域 -->

schoolNewsWeb/src/layouts/MobileLayout.vue

@@ -44,11 +44,15 @@
           </div>
         </button>
         
-        <!-- 用户头像 -->
-        <div class="user-avatar-section" @click="handleUserClick">
-          <el-avatar :size="32" :src="userInfo.avatar" class="user-avatar">
-            <el-icon><User /></el-icon>
-          </el-avatar>
+        <!-- 用户下拉菜单 -->
+        <div class="user-dropdown-section">
+          <UserDropdown 
+            :userinfo="userStore" 
+            :hideAdmin="true"
+            :disableHover="true"
+            @logout="handleLogout"
+            class="mobile-user-dropdown"
+          />
         </div>
       </div>
     </header>
@@ -104,7 +108,7 @@ import {
   Setting
 } from '@element-plus/icons-vue';
 import { FILE_DOWNLOAD_URL } from '@/config';
-import { MobileNavItem } from '@/components/base';
+import { MobileNavItem, UserDropdown } from '@/components/base';
 import { AIAgentMobile } from '@/views/public/ai';
 const route = useRoute();
 const router = useRouter();
@@ -126,6 +130,10 @@ const showMore = computed(() => route.meta?.showMore as boolean || false);
 const showTabBar = computed(() => route.meta?.showTabBar !== false);
 
 // 从store获取用户信息
+const userStore = computed(() => {
+  return store.getters['auth/userinfo'];
+});
+
 const userInfo = computed(() => {
   const userDetail = store.getters['auth/userinfo'];
   const user = store.getters['auth/user'];
@@ -224,9 +232,11 @@ const performSearch = () => {
   }
 };
 
-// 用户头像点击处理
-const handleUserClick = () => {
-  router.push('/user-center');
+// 用户退出登录处理
+const handleLogout = () => {
+  store.dispatch('auth/logout').then(() => {
+    router.push('/login');
+  });
 };
 
 // 处理导航菜单点击
@@ -428,16 +438,43 @@ onMounted(async () => {
       }
     }
 
-    .user-avatar-section {
-      cursor: pointer;
-      transition: opacity 0.2s;
-
-      &:hover {
-        opacity: 0.8;
-      }
-
-      .user-avatar {
-        border: 1px solid #e5e5e5;
+    .user-dropdown-section {
+      .mobile-user-dropdown {
+        :deep(.user-info) {
+          padding: 4px 8px;
+          background: transparent;
+          
+          &:hover {
+            background-color: rgba(0, 0, 0, 0.1);
+            color: #333;
+          }
+        }
+        
+        :deep(.user-avatar) {
+          width: 32px;
+          height: 32px;
+          border: 1px solid #e5e5e5;
+        }
+        
+        :deep(.user-details) {
+          display: none;
+        }
+        
+        :deep(.dropdown-icon) {
+          display: none;
+        }
+        
+        // 移动端下拉菜单样式调整
+        :deep(.dropdown-menu) {
+          right: 16px;
+          left: auto;
+          min-width: 140px;
+          
+          // 隐藏管理端相关选项
+          .dropdown-item.info {
+            display: none;
+          }
+        }
       }
     }
   }