فهرست منبع

课程标题默认选中样式

丸子 11 ماه پیش
والد
کامیت
a82b73d11c
4فایلهای تغییر یافته به همراه32 افزوده شده و 9 حذف شده
  1. 14 4
      src/views/AIDevelop.vue
  2. 5 4
      src/views/AIGeneralCourse.vue
  3. 6 0
      src/views/AILaboratory.vue
  4. 7 1
      src/views/AIQuestions.vue

+ 14 - 4
src/views/AIDevelop.vue

@@ -23,7 +23,7 @@
                 课程小节
               </h3>
               <el-menu
-                default-active="1"
+                default-active="1-1"
                 @open="handleOpen"
                 @close="handleClose"
                 @select="handleSelect"
@@ -78,6 +78,8 @@
           </div>
         </div>
       </div>
+
+      
       <div class="box-2">
         <!-- 课程标题 autoplay自动播放   @ended="playNextVideo"-->
         <div class="small-title">
@@ -280,6 +282,7 @@ const toggleDrawer = () => {
 const goBack = () => {
   router.go(-1)
 }
+
 // 渲染页面标题
 const boxIconTitle = ref('')
 // 课程数据
@@ -295,13 +298,13 @@ const videoPathMap = ref({})
 // 渲染 课程数据结构 以及 视频
 onMounted(async () => {
   const typeId = router.currentRoute.value.query.typeId
-  console.log(typeId, '----')
   if (typeId) {
     try {
-      // 取课程数据
+      // 取接口课程数据
       const res = await ClassType(typeId)
+      console.log(res);
+      
       courseList.value = res.data
-      console.log('课程数据:', courseList.value)
 
       // 初始化第一个视频源和标题
       if (courseList.value.length > 0 && courseList.value[0].courseVideoPath) {
@@ -924,6 +927,12 @@ $text-color: #483d8b; // 文本颜色:靛蓝色
   font-size: rpx(8);
   box-shadow: 0 4px 8px rgba(3, 3, 3, 0.3);
 }
+.el-menu .el-menu-item.is-active {
+   background: linear-gradient(to bottom, #fee78a, #ffce1b);
+  color: black;
+  font-size: rpx(8);
+  box-shadow: 0 4px 8px rgba(3, 3, 3, 0.3);
+}
 .drawer-box {
   position: absolute;
   display: flex;
@@ -1003,6 +1012,7 @@ $text-color: #483d8b; // 文本颜色:靛蓝色
   color: black; // 设置图标颜色为白色
   padding-left: rpx(15);
   font-size: rpx(10); // 设置图标大小,可按需调整
+  z-index: 9999;
 }
 .box-icon .left-icon {
   margin-left: rpx(10);

+ 5 - 4
src/views/AIGeneralCourse.vue

@@ -177,7 +177,7 @@ const getCourseTitle = index => {
   }
   return ''
 }
-// 新增课程标题数组,依赖修改后的 getCourseTitle 函数 修改课程标题数组为 computed 属性
+// 课程标题数组,依赖修改后的 getCourseTitle 函数 修改课程标题数组为 computed 属性
 const courseTitles = computed(() => {
   return Array.from({ length: 8 }, (_, i) => getCourseTitle(i + 1))
 })
@@ -192,7 +192,7 @@ const toggleDrawer = () => {
   drawerVisible.value = !drawerVisible.value
 }
 
-import {Message} from "@/utils/message/Message.js";
+import { Message } from "@/utils/message/Message.js";
 
 
 // 搜索框
@@ -212,8 +212,8 @@ const drawerVisible = ref(true)
 const goBack = () => {
   router.go(-1) // 返回上一页
 }
-// 添加跳转课程页面的函数
 
+// 添加跳转课程页面的函数
 // const goToAIExperience = index => {
 //   const routes = [
 //     '/ai-initial-experience', // 跳转AI初体验
@@ -246,7 +246,7 @@ const goToAIExperience = outlineData => {
 
   if (outlineData.ctTypeSort === 2) {
     router.push({
-      path: '/ai-develop', // 跳转AI初体验
+      path: '/ai-develop', // 跳转视频页面
       query: { typeId: outlineData.id, typeName: outlineData.ctType }
     })
   }else {
@@ -463,6 +463,7 @@ onMounted(() => {
   padding-left: rpx(15);
   font-size: rpx(10); // 设置图标大小,可按需调整
   cursor: pointer; // 添加鼠标指针样式
+  z-index: 999;
 }
 .box-icon .left-icon {
   margin-left: rpx(10);

+ 6 - 0
src/views/AILaboratory.vue

@@ -255,6 +255,12 @@ const groupList = ref([
   color: black;
   font-size: rpx(8);
 }
+.el-menu .el-menu-item.is-active {
+   background: linear-gradient(to bottom, #fee78a, #ffce1b);
+  color: black;
+  font-size: rpx(8);
+  box-shadow: 0 4px 8px rgba(3, 3, 3, 0.3);
+}
 // 右侧数字人内容
 .number-people {
   flex: 1;

+ 7 - 1
src/views/AIQuestions.vue

@@ -17,7 +17,7 @@
         <el-row class="tac">
           <el-col :span="12">
             <el-menu
-              default-active="2"
+              default-active="1-1"
               class="el-menu-vertical-demo"
               @open="handleOpen"
               @close="handleClose"
@@ -581,6 +581,12 @@ onMounted(async () => {
   color: black;
   font-size: rpx(8);
 }
+.el-menu .el-menu-item.is-active {
+   background: linear-gradient(to bottom, #fee78a, #ffce1b);
+  color: black;
+  font-size: rpx(8);
+  box-shadow: 0 4px 8px rgba(3, 3, 3, 0.3);
+}
 // 侧边栏
 .left-group2 {
   width: rpx(150);