refactor: 视频类型复用已有VideoPlayer组件简化代码

src/views/components/element/FrameElement/BaseFrameElement.vue

@@ -27,20 +27,13 @@
             <div class="spinner"></div>
           </div>
         </div>
-        <!-- 视频类型（type 74）：使用 video 标签，src 由 VideoManager 手动管理 -->
-        <video
+        <!-- 视频类型（type 74）：复用项目已有的 VideoPlayer，内部已集成 VideoManager -->
+        <VideoPlayer
           v-if="elementInfo.toolType === 74 && !isThumbnail && isVisible"
-          ref="video74Ref"
-          :src="elementInfo.url"
           :width="width"
           :height="height"
-          preload="none"
-          playsinline
-          webkit-playsinline
-          controls
-          @play="onVideoPlay"
-          :style="{ width: '100%', height: '100%', objectFit: 'contain' }"
-        ></video>
+          :src="elementInfo.url"
+        />
         <!-- 英语口语预览（type 77）：使用 Vue 组件直接渲染，url 字段即 configId -->
         <TopicDiscussionPreview
           v-else-if="isTopicDiscussionTool(elementInfo.toolType) && !isThumbnail && isVisible"
@@ -127,12 +120,11 @@ import { ref, watch, nextTick, onMounted, onBeforeUnmount } from 'vue'
 import { computed } from 'vue'
 import useImport from '@/hooks/useImport'
 import { useSlidesStore } from '@/store/slides'
-import { useVideoManager } from '@/hooks/useVideoManager'
 import api from '@/services/course'
 import message from '@/utils/message'
+import VideoPlayer from '@/views/components/element/VideoElement/VideoPlayer/index.vue'
 
 const slidesStore = useSlidesStore()
-const manager = useVideoManager()
 const { getFile, getFile2 } = useImport()
 
 const props = defineProps({
@@ -156,7 +148,7 @@ const props = defineProps({
 
 // 用于强制刷新iframe的key
 const iframeKey = ref(0)
-const video74Ref = ref<HTMLVideoElement | null>(null)
+
 
 // 监听elementInfo.url的变化
 watch(
@@ -315,40 +307,6 @@ watch(frameloading, (val) => {
   slidesStore.updateElement({ id: props.elementInfo.id, props: { iframeLoading: val } })
 })
 
-// toolType=74 视频播放时：释放其他所有 video 的 src → 自己挂 src → play
-const onVideoPlay = () => {
-  const video = video74Ref.value
-  if (!video) return
-
-  // ① 释放其他所有
-  manager.releaseAllOthers(video)
-
-  // ② 如果自己还没 src，手动挂上去
-  if (!video.src && elementInfo.url) {
-    video.muted = true // 绕过 iOS 自动播放策略
-    video.setAttribute('preload', 'auto')
-    video.src = elementInfo.url
-    video.load()
-  }
-
-  // ③ play() 吞掉自动播放拦截的异常
-  const p = video.play()
-  if (p && (p as Promise<void>).catch) (p as Promise<void>).catch(() => {})
-}
-
-// toolType=74 video 生命周期注册（manager track meta + release）
-onMounted(() => {
-  const v = video74Ref.value
-  if (!v) return
-  manager.register(v)
-  // ★ mount 时就挂 src（preload=none 不会立即下载），否则 native controls 的 ▶ 按钮
-  // 内部 play() 会因无 src 直接失败，@play 事件不触发 → onVideoPlay 永远跑不到
-  if (!v.src && elementInfo.url) v.src = elementInfo.url
-})
-onBeforeUnmount(() => {
-  if (video74Ref.value) manager.unregister(video74Ref.value)
-})
-
 // 处理iframe加载完成事件
 const handleIframeLoad = async (event: Event) => {
   const iframe = event.target as HTMLIFrameElement