修改显示

src/views/coursewarePlay/component/courseware-type/index.module.less

@@ -133,14 +133,38 @@
   }
 
   .name {
-    width: 109%;
+    width: 100%;
     font-size: 12px;
     font-weight: 600;
     color: rgba(255,255,255,0.5);
-    line-height: 20px;
+    line-height: 20px !important;
+
+    :global {
+      .van-notice-bar {
+        padding: 0 !important;
+        line-height: 20px !important;
+        height: 20px !important;
+      }
+    }
 
     &.active {
-      color: #FFFFFF;
+      
+      :global {
+        .van-notice-bar__content {
+          color: #FFFFFF;
+          transition-property: transform;
+        }
+      }
+    }
+
+    &.disabled {
+      :global {
+        .van-notice-bar__content {
+          color: rgba(255,255,255,0.5);
+          transition-duration: 0s !important;
+          transform: none !important;
+        }
+      }
     }
   }
 }

src/views/coursewarePlay/component/courseware-type/index.tsx

@@ -1,6 +1,7 @@
 import { defineComponent } from 'vue';
 import styles from './index.module.less';
 import { iconMenucw, iconArrow } from '../../image/icons.json';
+import { NoticeBar } from 'vant';
 
 export default defineComponent({
   name: 'courseware-type',
@@ -36,7 +37,13 @@ export default defineComponent({
               </div>
               {item.useFlag && <span class={styles.currentText}></span>}
             </div>
-            <div class={[styles.name, styles.active, 'van-ellipsis']}>{item.lessonCoursewareName}</div>
+            <div class={[styles.name, item.useFlag ? styles.active : styles.disabled, 'van-ellipsis']}>
+              <NoticeBar
+                  text={item.lessonCoursewareName}
+                  class={styles.noticeBar}
+                  background="none"
+                />
+            </div>
           </div>)}
         </div>
       </div>

src/views/coursewarePlay/component/video-play.tsx

@@ -180,7 +180,7 @@ export default defineComponent({
 
     const __initVideo = () => {
       if (videoItem.value && props.item.id) {
-        console.log(videoItem.value, 'videoItem.value');
+        // console.log(videoItem.value, 'videoItem.value');
         nextTick(() => {
           videoItem.value?.currentTime(0);
         });

src/views/coursewarePlay/index.tsx

@@ -566,7 +566,7 @@ export default defineComponent({
         const videoEle = videos[i] as HTMLVideoElement;
         await stopVideo(videoEle);
       }
-      console.log('视频暂停完成');
+      // console.log('视频暂停完成');
       data.itemList.forEach((item: any) => {
         if (item.typeCode === 'SONG') {
           item.iframeRef?.contentWindow?.postMessage(
@@ -769,6 +769,14 @@ export default defineComponent({
         item.typeCode &&
         item.typeCode.toLocaleUpperCase() === 'VIDEO'
       ) {
+        if(whitePenShow.value || penShow.value || popupData.coursewareOpen || popupData.open || popupData.guideOpen || popupData.pointOpen) {
+          item.autoplay = false
+        } else {
+          // 是否自动播放
+          if (activeData.isAutoPlay) {
+            item.autoPlay = true;
+          }
+        }
         return item;
       }
       return {};
@@ -968,6 +976,9 @@ export default defineComponent({
                 onPlay={() => {
                   data.videoState = 'play';
                   data.animationState = 'end';
+                  if(activeVideoItem.value.autoplay === false) {
+                    handleStop()
+                  }
                 }}
                 onLoadedmetadata={(videoItem: any) => {
                   data.videoState = 'play';
@@ -1162,7 +1173,10 @@ export default defineComponent({
                   clearTimeout(activeData.timer)
                 }}
               >
-                <div class={styles.rightBtn} onClick={() => (popupData.guideOpen = true)}>
+                <div class={styles.rightBtn} onClick={() => {
+                  handleStop()
+                  popupData.guideOpen = true
+                }}>
                   <img src={iconTouping} />
                 </div>
               </div>