feat: 前端优化

frontend/app/web-gold/src/components/SidebarNav.vue

@@ -26,41 +26,40 @@ const items = computed(() => {
     {
       title: '功能',
       children: [
-        // { path: '/home', label: '首页', icon: 'home' },
-        { path: '/content-style/benchmark', label: '对标分析', icon: 'grid' },
-        { path: '/content-style/copywriting', label: '文案创作', icon: 'text' },
-        { path: '/trends/forecast', label: '热点趋势', icon: 'text' },
+        // { name: '首页', label: '首页', icon: 'home' },
+        { name: '对标分析', label: '对标分析', icon: 'grid' },
+        { name: '文案创作', label: '文案创作', icon: 'text' },
+        { name: '热点预测', label: '热点趋势', icon: 'text' },
       ]
     },
     {
       title: '数字人',
       children: [
-        { path: '/digital-human/voice-copy', label: '人声克隆', icon: 'mic' },
-        { path: "/digital-human/kling", label: "可灵数字人", icon: "user" },
-        // { path: '/digital-human/video', label: '数字人视频', icon: 'video' },
+        { name: '人声克隆', label: '人声克隆', icon: 'mic' },
+        { name: '可灵数字人', label: "可灵数字人", icon: "user" },
+        // { name: '数字人视频', label: '数字人视频', icon: 'video' },
       ]
     },
     {
       title: '素材库',
       children: [
-        { path: '/material/list', label: '素材列表', icon: 'grid' },
-        { path: '/material/mix', label: '智能混剪', icon: 'scissors' },
-        { path: '/material/mix-task', label: '混剪任务', icon: 'video' },
-        { path: '/material/group', label: '素材分组', icon: 'folder' },
+        { name: '素材列表', label: '素材列表', icon: 'grid' },
+        { name: '智能混剪', label: '智能混剪', icon: 'scissors' },
+        { name: '素材分组', label: '素材分组', icon: 'folder' },
+      ]
+    },
+    {
+      title: '任务管理',
+      children: [
+        { name: '任务中心', label: '任务中心', icon: 'video', params: { type: 'mix-task' } },
       ]
     },
     {
       title: '系统',
       children: [
-        { path: '/system/style-settings', label: '风格设置', icon: 'text' },
+        { name: '风格设置', label: '风格设置', icon: 'text' },
       ]
-    },
-    // {
-    //   title: '视频',
-    //   children: [
-    //     { path: '/digital-human/avatar', label: '生成数字人', icon: 'user' },
-    //   ]
-    // },
+    }
   ]
   
   // 如果未登录，过滤掉"系统"菜单组
@@ -71,8 +70,12 @@ const items = computed(() => {
   return allItems
 })
 
-function go(p) {
-  router.push(p)
+function go(item) {
+  if (item.params) {
+    router.push({ name: item.name, params: item.params })
+  } else {
+    router.push({ name: item.name })
+  }
 }
 </script>
 
@@ -81,7 +84,7 @@ function go(p) {
     <nav class="sidebar__nav">
       <div v-for="group in items" :key="group.title" class="nav-group">
         <div class="nav-group__title">{{ group.title }}</div>
-        <button v-for="it in group.children" :key="it.path" class="nav-item" :class="{ 'is-active': route.path === it.path }" @click="go(it.path)">
+        <button v-for="it in group.children" :key="it.name" class="nav-item" :class="{ 'is-active': route.name === it.name }" @click="go(it)">
           <span class="nav-item__icon" aria-hidden="true" v-html="icons[it.icon]"></span>
           <span class="nav-item__label">{{ it.label }}</span>
         </button>

frontend/app/web-gold/src/components/UserDropdown.vue

@@ -1,7 +1,9 @@
 <script setup>
 import { ref, computed } from 'vue'
+import { useRouter } from 'vue-router'
 import { useUserStore } from '@/stores/user'
 
+const router = useRouter()
 const userStore = useUserStore()
 const showDropdown = ref(false)
 
@@ -61,6 +63,17 @@ function handleMouseEnter() {
 function handleMouseLeave() {
   showDropdown.value = false
 }
+
+// 处理退出登录
+async function handleLogout() {
+  try {
+    await userStore.logout()
+    // 跳转到登录页
+    router.push('/login')
+  } catch (error) {
+    console.error('退出登录失败:', error)
+  }
+}
 </script>
 
 <template>
@@ -191,7 +204,7 @@ function handleMouseLeave() {
         <div class="dropdown-divider"></div>
 
         <div class="dropdown-footer">
-          <button class="action-btn" @click="userStore.logout">
+          <button class="action-btn" @click="handleLogout">
             <svg width="14" height="14" viewBox="0 0 14 14" fill="none">
               <path d="M5 2H2C1.44772 2 1 2.44772 1 3V11C1 11.5523 1.44772 12 2 12H5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
               <path d="M9 10L13 7L9 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>