fix:将侧边栏兼容移动端

src/views/profile/UserInfo.vue

@@ -184,25 +184,57 @@ import {
   User, Edit, Document, Timer, EditPen, Message, 
   Phone, OfficeBuilding, UploadFilled 
 } from '@element-plus/icons-vue'
+import { useUserStore } from '@/store/userStore.js'
 
 // 是否处于编辑模式
 const isEditing = ref(false)
 const loading = ref(false)
 
+const userStore = useUserStore()
+
+// 从localStorage或store获取用户信息
+const getSavedUserInfo = () => {
+  const savedInfo = userStore.userInfo
+  if (savedInfo && Object.keys(savedInfo).length > 0) {
+    return {
+      username: savedInfo.user_name || '',
+      realName: savedInfo.real_name?.Name || savedInfo.user_name || '',
+      email: savedInfo.email || '',
+      phone: savedInfo.phone || '',
+      department: savedInfo.admin_group?.name || '',
+      position: savedInfo.is_admin ? '管理员' : '普通用户',
+      role: savedInfo.admin_group?.name || '普通用户',
+      createTime: savedInfo.created_at || '',
+      lastLogin: savedInfo.created_at || '',
+      bio: savedInfo.admin_group?.note || '',
+      avatar: savedInfo.cover || 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
+      sex: savedInfo.sex || '',
+      age: savedInfo.age || '',
+      userId: savedInfo.user_id || '',
+      userGroup: savedInfo.user_group?.Name || ''
+    }
+  }
+  return {
+    username: '',
+    realName: '',
+    email: '',
+    phone: '',
+    department: '',
+    position: '',
+    role: '',
+    createTime: '',
+    lastLogin: '',
+    bio: '',
+    avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
+    sex: '',
+    age: '',
+    userId: '',
+    userGroup: ''
+  }
+}
+
 // 用户信息数据
-const userInfo = reactive({
-  username: 'admin',
-  realName: '管理员',
-  email: 'admin@example.com',
-  phone: '13800138000',
-  department: '技术部',
-  position: '系统管理员',
-  role: '超级管理员',
-  createTime: '2023-01-01 00:00:00',
-  lastLogin: '2023-06-15 10:30:45',
-  bio: '系统管理员，负责系统的日常维护和管理工作。拥有丰富的系统管理经验，精通Linux服务器配置和维护，熟悉网络安全，对系统性能优化有独到见解。',
-  avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png'
-})
+const userInfo = reactive(getSavedUserInfo())
 
 // 表单数据
 const userForm = reactive({...userInfo})
@@ -296,9 +328,9 @@ const handleAvatarSuccess = (res) => {
 // 获取用户信息
 const fetchUserInfo = async () => {
   try {
-    // 模拟API调用
-    await new Promise(resolve => setTimeout(resolve, 500))
-    // 实际项目中，应该从后端获取用户信息并更新userInfo
+    // 从store获取最新用户信息
+    const savedInfo = getSavedUserInfo()
+    Object.assign(userInfo, savedInfo)
   } catch (error) {
     ElMessage.error('获取用户信息失败')
     console.error(error)