浏览代码

添加总时长

lex 1 年之前
父节点
当前提交
9a6956f92b
共有 2 个文件被更改,包括 19 次插入0 次删除
  1. 13 0
      src/views/student-register/index.module.less
  2. 6 0
      src/views/student-register/index.tsx

+ 13 - 0
src/views/student-register/index.module.less

@@ -22,6 +22,19 @@
     height: 171.125px;
     // 154.125
     box-sizing: content-box;
+    position: relative;
+
+    .videoDuration {
+      position: absolute;
+      background-color: rgba(0, 0, 0, 0.3);
+      border-radius: 6px;
+      padding: 4px 6px;
+      font-size: 13px;
+      line-height: 1;
+      color: #fff;
+      right: 14px;
+      bottom: 12px;
+    }
 
     .coverImg {
       width: 100%;

+ 6 - 0
src/views/student-register/index.tsx

@@ -167,6 +167,7 @@ export default defineComponent({
       cancelButtonText: '取消',
       messageAlign: 'center' as 'left' | 'center' | 'right',
 
+      showDuration: true,
       dialogConfirmStatus: false,
       contract_sign: false, // 是否实名认证
       countDownTimePay: 60 * 1000,
@@ -1395,6 +1396,7 @@ export default defineComponent({
         // 开始播放
         videoForms.player.on('play', () => {
           console.log('play');
+          forms.showDuration = false;
           // 判断视频计时器是否暂停,如果暂停则恢复
           videoIntervalRef.resume();
           timer.resume();
@@ -1662,6 +1664,10 @@ export default defineComponent({
                   'https://oss.dayaedu.com/ktyq/17158281330381317fd87.png'
                 }
                 preload="auto"></video>
+
+              {forms.showDuration && (
+                <span class={styles.videoDuration}>1:56</span>
+              )}
             </div>
           </div>