feat:课程章节详情页增加展开收起菜单

client/src/modules/viewer/index.vue

@@ -20,6 +20,10 @@
             </el-tooltip>
           </router-link>
         </template>
+        <div class="course-menu" @click="menuVisible = !menuVisible">
+          <i class="el-icon-s-unfold" v-if="menuVisible"></i>
+          <i class="el-icon-s-fold" v-else></i>
+        </div>
       </div>
       <!-- 主体区域 -->
       <div class="course-viewer-main-bd">
@@ -43,7 +47,7 @@
       :pptIndex="pptIndex"
       @change-ppt="handleChangePPT(...arguments, true)"
       v-if="detail.chapters"
-      v-show="!isLive && !isCourseExam"
+      v-show="menuVisible"
     ></v-aside>
   </div>
 </template>
@@ -62,13 +66,24 @@ export default {
       detail: {},
       ppts: [],
       pptIndex: 0,
-      isSeek: false
+      isSeek: false,
+      menuVisible: true
     }
   },
   watch: {
     activeChapter() {
       this.ppts = []
       this.pptIndex = 0
+    },
+    isLive(value) {
+      if (value) {
+        this.menuVisible = false
+      }
+    },
+    isCourseExam(value) {
+      if (value) {
+        this.menuVisible = false
+      }
     }
   },
   computed: {
@@ -241,4 +256,17 @@ export default {
   font-size: 18px;
   // border-bottom: 3px solid #707070;
 }
+.course-menu {
+  width: 24px;
+  height: 24px;
+  padding: 12px;
+  margin-right: 10px;
+  color: #fff;
+  text-align: center;
+  border-radius: 50%;
+  cursor: pointer;
+  &:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+  }
+}
 </style>