skyblued 2 years ago
parent
commit
1f3114e61e
2 changed files with 42 additions and 35 deletions
  1. 7 1
      src/views/coursewarePlay/index.module.less
  2. 35 34
      src/views/coursewarePlay/index.tsx

+ 7 - 1
src/views/coursewarePlay/index.module.less

@@ -30,13 +30,17 @@
 }
 .backBtn {
   color: #fff;
-  width: 40px;
   height: 26px;
   display: flex;
   justify-content: space-between;
   align-items: center;
   z-index: 10;
   padding: 4px 10px 4px 15px;
+  :global{
+    .van-icon{
+      margin-right: 8px;
+    }
+  }
 }
 .menu {
   position: absolute;
@@ -115,6 +119,8 @@
   align-items: center;
   color: #fff;
   justify-content: space-evenly;
+  overflow: hidden;
+  white-space: nowrap;
   &:active {
     opacity: 0.8;
   }

+ 35 - 34
src/views/coursewarePlay/index.tsx

@@ -483,40 +483,41 @@ export default defineComponent({
                                   setModelOpen()
                                 }}
                               >
-                                <div class={styles.time}>
-                                  <span>{getSecondRPM(m.currentTime)}</span>
-                                  <span>{getSecondRPM(m.duration)}</span>
-                                </div>
-                                <div class={styles.slider}>
-                                  <Slider
-                                    onClick={() => setModelOpen()}
-                                    style={{ display: m.isprepare ? 'block' : 'none' }}
-                                    buttonSize={16}
-                                    step={0.1}
-                                    modelValue={m.progress}
-                                    onUpdate:modelValue={(val: any) => {
-                                      m.progress = val
-                                      handleChangeSlider(m)
-                                    }}
-                                    onDragStart={(e: Event) => {
-                                      // 开始拖动,暂停播放
-                                      console.log('开始拖动')
-                                      // 如果拖动之前,视频是播放状态,拖动完毕后继续播放
-                                      if (!m.paused) {
-                                        m.isDrage = true
-                                      }
-                                      handlePaused(e, m)
-                                    }}
-                                    onDragEnd={(e: Event) => {
-                                      console.log('结束拖动')
-                                      if (m.isDrage) {
-                                        m.isDrage = false
-                                        handlePlay(e, m)
-                                      }
-                                    }}
-                                    min={0}
-                                    max={100}
-                                  />
+                                <div style={{ opacity: m.isprepare ? '1' : '0' }}>
+                                  <div class={styles.time}>
+                                    <span>{getSecondRPM(m.currentTime)}</span>
+                                    <span>{getSecondRPM(m.duration)}</span>
+                                  </div>
+                                  <div class={styles.slider}>
+                                    <Slider
+                                      onClick={() => setModelOpen()}
+                                      buttonSize={16}
+                                      step={0.1}
+                                      modelValue={m.progress}
+                                      onUpdate:modelValue={(val: any) => {
+                                        m.progress = val
+                                        handleChangeSlider(m)
+                                      }}
+                                      onDragStart={(e: Event) => {
+                                        // 开始拖动,暂停播放
+                                        console.log('开始拖动')
+                                        // 如果拖动之前,视频是播放状态,拖动完毕后继续播放
+                                        if (!m.paused) {
+                                          m.isDrage = true
+                                        }
+                                        handlePaused(e, m)
+                                      }}
+                                      onDragEnd={(e: Event) => {
+                                        console.log('结束拖动')
+                                        if (m.isDrage) {
+                                          m.isDrage = false
+                                          handlePlay(e, m)
+                                        }
+                                      }}
+                                      min={0}
+                                      max={100}
+                                    />
+                                  </div>
                                 </div>
 
                                 <div class={styles.actions}>