zc

src/views/learning/learningCourse.vue

@@ -433,13 +433,33 @@
             this._clearVerifyCountdown()
             this._pauseStudy()
             this.$set(this, 'sliderValue', 0)
-            this.$set(this, 'dialogVisible', true)
-            // 暂停视频
-            const video = this.$refs.videoRef
-            if (video) video.pause()
+            // 若当前全屏，先退出全屏再显示弹窗
+            this._exitFullscreenThen(() => {
+              this.$set(this, 'dialogVisible', true)
+              const video = this.$refs.videoRef
+              if (video) video.pause()
+            })
           }
         }, 1000)
       },
+      _exitFullscreenThen(callback) {
+        const isFs = !!(document.fullscreenElement || document.webkitFullscreenElement)
+        if (isFs) {
+          const exit = document.exitFullscreen || document.webkitExitFullscreen
+          if (exit) {
+            exit.call(document).then(() => { callback() }).catch(() => { callback() })
+          } else {
+            this.$set(this, 'isFullscreen', false)
+            callback()
+          }
+        } else if (this.isFullscreen) {
+          // CSS 旋转模拟全屏，直接退出
+          this.$set(this, 'isFullscreen', false)
+          callback()
+        } else {
+          callback()
+        }
+      },
       _pauseVerifyCountdown() {
         if (this._verifyTimer) { clearInterval(this._verifyTimer); this._verifyTimer = null }
       },
@@ -639,7 +659,7 @@
 
     .bottom-panel {
       flex-shrink: 0;
-      height: 40vh;
+      height: 30vh;
       display: flex;
       flex-direction: column;
       overflow: hidden;
@@ -649,7 +669,7 @@
       .info-meta {
         flex-shrink: 0;
         padding: 10px 16px;
-        font-size: 22px;
+        font-size: 26px;
         color: #999;
         border-bottom: 1px solid #eee;
         .dot { margin: 0 6px; }