```

feat(header): 更新顶部菜单及用户登录状态展示

- 修改顶部菜单项文字，“我的学习”改为“工作流交易”
- 移除登录/注册按钮，替换为用户头像与下拉菜单
- 添加 LangSwitch 语言切换组件至 header 区域
- 调整 footer 文案，增加备案信息
- 引入 useAppStore 并在 setup 中初始化以支持用户信息获取

styling(container): 调整页面容器和 logo 样式布局

- 设置 `.header-content` 最小宽度、最大宽度和弹性布局
- 增加 logo 的最小宽度并调整字体大小
- 调整菜单项字体大小与右侧区域对齐方式
- 统一全局容器样式：设置最大宽度、百分比宽度和内边距

feat(lang): 优化语言切换组件交互形式

- 将语言切换按钮替换为下拉选择菜单
- 支持中英文互斥显示与点击切换功能
- 精简样式代码，移除冗余的 button 样式定义

feat(home): 替换首页 Banner 为自动播放轮播图

- 使用 Element Plus 的 el-carousel 实现图片轮播
- 动态计算轮播图高度以适配不同屏幕尺寸
- 移除原有 BlockNote 编辑器相关内容与引用依赖

feat(router): 配置 my-learning 路由嵌套结构

- 添加 MyLearningHome 页面作为父级路由组件
- 设置子路由用于渲染我的学习主页与课程详情页
- 完善路由元信息标题配置
```

src/App.vue

@@ -8,16 +8,32 @@
           <el-menu :default-active="activeIndex" mode="horizontal" :ellipsis="false" class="meauList">
             <el-menu-item index="1" @click="$router.push('/')">AI工作流</el-menu-item>
             <!-- <el-menu-item index="2" @click="$router.push('/my-learning')">工作流交易</el-menu-item> -->
-            <el-menu-item index="2" @click="goMyLearning">我的学习</el-menu-item>
+            <el-menu-item index="2" @click="goMyLearning">工作流交易</el-menu-item>
             <el-menu-item index="3" @click="$router.push('/my-learning')">学习教程系统</el-menu-item>
             <el-menu-item index="4" @click="$router.push('/my-learning')">学习笔记</el-menu-item>
             <el-menu-item index="5" @click="$router.push('/my-learning')">积分商城</el-menu-item>
           </el-menu>
           <div class="header-right">
-            <el-button type="text">登录</el-button>
-            <el-button type="primary">注册</el-button>
+            <el-avatar :size="32" :src="appStore.userInfo?.avatar || 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png'" />
+            <el-dropdown>
+              <span class="el-dropdown-link">
+                用户1
+                <el-icon class="el-icon--right">
+                  <arrow-down />
+                </el-icon>
+              </span>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item>Action 1</el-dropdown-item>
+                  <el-dropdown-item>Action 2</el-dropdown-item>
+                  <el-dropdown-item>Action 3</el-dropdown-item>
+                  <el-dropdown-item disabled>Action 4</el-dropdown-item>
+                  <el-dropdown-item divided>Action 5</el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
+            <LangSwitch />
           </div>
-          <LangSwitch />
         </div>
       </el-header>
       
@@ -27,7 +43,7 @@
       
       <el-footer>
         <div class="footer-content">
-          <p>© 2025 视频学习平台 - 版权所有</p>
+          <p>服务协议隐私政策浙ICP备2024141841号-6浙公网安备 33011002018505 号</p>
         </div>
       </el-footer>
     </el-container>
@@ -42,7 +58,9 @@ import { ElConfigProvider } from 'element-plus'
 import { useRoute, useRouter } from 'vue-router'
 // 在Pinia安装后再设置初始语言
 import { useLangStore } from '@/pinia/langStore'
-const langStore = useLangStore()
+import { useAppStore } from '@/pinia/appStore'
+const langStore = useLangStore();
+const appStore = useAppStore();
 $i18n.global.locale.value = langStore.currentLang
 // 动态更新页面标题
 langStore.updateDynamicTitle()
@@ -80,14 +98,17 @@ const activeIndex = computed(() => {
   border-bottom: 1px solid #eee;
   
   .header-content {
-    max-width: 1200px;
+    max-width: 1520px;
+    width: 80%;
+    min-width: 1200px;
     margin: 0 auto;
     display: flex;
     align-items: center;
     justify-content: space-between;
     
     .logo {
-      font-size: 1.5rem;
+      min-width: 220px;
+      font-size: 24px;
       font-weight: bold;
       cursor: pointer;
     }
@@ -98,22 +119,27 @@ const activeIndex = computed(() => {
       .el-menu--horizontal.el-menu{
         border-bottom: none;
       }
+      .el-menu-item{
+        font-size: 16px;
+      }
     }
     
     .header-right {
+      margin-right: 30px;
       display: flex;
+      align-items: center; /* 垂直居中 */
       gap: 10px;
     }
   }
 }
 
 .el-footer {
-  // background-color: #f5f5f5;
   color: #666;
   text-align: center;
   padding: 20px 0;
   
   .footer-content {
+    font-size: 14px;
     max-width: 1200px;
     margin: 0 auto;
   }

src/components/LangSwitch.vue

@@ -1,7 +1,18 @@
 <template>
-  <div class="lang-switch">
-    <el-button @click="switchToZh" :type="langStore.currentLang === 'zh-CN' ? 'primary' : 'text'">中文</el-button>
-    <el-button @click="switchToEn" :type="langStore.currentLang === 'en' ? 'primary' : 'text'">English</el-button>
+  <div class="lang-switch flex-center">
+    <!-- <el-button @click="switchToZh" :type="langStore.currentLang === 'zh-CN' ? 'primary' : 'text'">中文</el-button>
+    <el-button @click="switchToEn" :type="langStore.currentLang === 'en' ? 'primary' : 'text'">English</el-button> -->
+    <el-dropdown @command="handleClick" type="primary" round>
+      <span class="el-dropdown-link">
+        <el-button size="small" round>{{ langStore.currentLang === 'zh-CN' ? 'ZN' : 'EN' }}</el-button>
+      </span>
+      <template #dropdown>
+        <el-dropdown-menu>
+          <el-dropdown-item command="zh-CN" v-if="langStore.currentLang !== 'zh-CN'">中文</el-dropdown-item>
+          <el-dropdown-item command="en" v-if="langStore.currentLang !== 'en'">English</el-dropdown-item>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
   </div>
 </template>
 
@@ -10,6 +21,15 @@ import { useLangStore } from '@/pinia/langStore'
 
 const langStore = useLangStore()
 
+// 点击切换语言
+const handleClick = (command) => {
+  if (command === 'zh-CN') {
+    switchToZh()
+  } else if (command === 'en') {
+    switchToEn()
+  }
+}
+
 // 切换到中文
 const switchToZh = () => {
   langStore.changeLang('zh-CN')
@@ -22,9 +42,7 @@ const switchToEn = () => {
 </script>
 
 <style scoped>
-.lang-switch button {
-  margin: 0 8px;
-  padding: 4px 12px;
-  cursor: pointer;
+.lang-switch {
+
 }
 </style>

src/pages/Home.vue

@@ -1,56 +1,53 @@
 <template>
   <div class="home-page container">
-    <!-- 使用 BlockNote 编辑器 -->
     <div class="banner">
-     
+      <!-- autoplay -->
+      <el-carousel :height="carouselHeight">
+        <el-carousel-item>
+          <img
+            :src="bannerImage"
+            class="carousel-image"
+            @load="onImageLoad"
+          />
+        </el-carousel-item>
+        <el-carousel-item>
+          <img
+            :src="bannerImage"
+            class="carousel-image"
+            @load="onImageLoad"
+          />
+        </el-carousel-item>
+        
+      </el-carousel>
     </div>
     
   </div>
 </template>
 
 <script setup>
+import bannerImage from '@/assets/imgs/banner.png'
 import { onMounted,ref } from 'vue'
 import { useRouter } from 'vue-router'
-import { useCourseStore } from '../pinia/courseStore'
 
-// 导入封装好的 BlockNote 组件
-import BlockNoteEditor from '@/components/BlockNoteEditor.vue';
-
-// 绑定编辑器内容
-// [
-//   {
-//     type: "paragraph",
-//     content: [{ type: "text", text: "只读模式" }]
-//   }
-// ]
-
-const editorContent = ref(
-  [
-    {
-      type: "paragraph",
-      content: [{ type: "text", text: "只读模式" }]
-    },
-    {
-    "id": "378ce968-02c2-4856-888b-c35a355aa84b",
-    "type": "codeBlock",
-    "props": {
-        "language": "text"
-    },
-    "content": [],
-    "children": []
-    }
-  ]
-);
-const editorContent_html = ref();
-
-const router = useRouter()
-const courseStore = useCourseStore()
-const courseList = ref([])
 
 onMounted(() => {
   console.log('Home mounted')
 })
 
+const router = useRouter()
+
+
+// 监听图片加载完成，动态设置轮播图高度
+const carouselHeight = ref('auto')
+const onImageLoad = (event) => {
+  const img = event.target
+  const aspectRatio = img.naturalWidth / img.naturalHeight
+  const containerWidth = img.offsetWidth
+  const calculatedHeight = containerWidth / aspectRatio
+  carouselHeight.value = calculatedHeight + 'px'
+}
+
+
 
 
 const goToCourseDetail = (id,title) => {
@@ -65,9 +62,14 @@ const goToCourseDetail = (id,title) => {
 
 </script>
 
-<style scoped lang="scss">
+<style lang="scss">
 
 .banner {
- 
+  .carousel-image {
+    width: 100%;
+    height: auto;
+    // object-fit: cover; // 保持比例填充整个容器
+    // object-position: center; // 居中显示
+  }
 }
 </style>

src/pinia/appStore.js

@@ -0,0 +1,13 @@
+import { defineStore } from 'pinia'
+
+
+
+export const useAppStore = defineStore('lang', {
+  state: () => ({
+    // 当前语言
+    userInfo: localStorage.getItem('userInfo') ? JSON.parse(localStorage.getItem('userInfo')) : null
+  }),
+  actions: {
+   
+  }
+})

src/router/index.js

@@ -2,6 +2,7 @@ import { createRouter, createWebHistory } from 'vue-router'
 import Home from '../pages/Home.vue'
 import CourseDetail from '../pages/CourseDetail.vue'
 import MyLearning from '../pages/MyLearning.vue'
+import MyLearningHome from '../pages/MyLearningHome.vue'
 
 const routes = [
   {
@@ -18,9 +19,23 @@ const routes = [
   },
   {
     path: '/my-learning',
-    name: 'MyLearning',
-    component: MyLearning,
-    meta: { title: '我的学习' }
+    name: 'MyLearningHome',
+    component: MyLearningHome,
+    meta: { title: '我的学习' },
+    children: [
+      {
+        path: '',
+        name: 'MyLearning',
+        component: MyLearning,
+        meta: { title: '我的学习' }
+      },
+      {
+        path: '/my-learning/course/:id',
+        name: 'MyLearningCourseDetail',
+        component: CourseDetail,
+        meta: { title: '我的学习课程详情' }
+      }
+    ]
   }
 ]
 

src/styles/index.scss

@@ -14,6 +14,7 @@ body{
 // 2. 全局重置样式（统一浏览器默认样式）
 * {
   box-sizing: border-box;
+	font-family: PingFang SC, PingFang SC;
 }
 H1,
 H2,
@@ -36,9 +37,11 @@ body ,htm{
 // 3. 公共样式类（全局可复用）
 // 容器宽度限制（统一页面最大宽度，居中显示）
 .container {
-  max-width: 1200px;
+  max-width: 1520px;
+	width: 80%;
+	min-width: 1200px;
   margin: 0 auto;
-  padding: 0 20px;
+  padding: 20px;
 }
 
 // 清除浮动