fix: 修复已知问题

src/components/VideoControls/index.vue

@@ -195,14 +195,14 @@ import {
   VolumeHighOutline,
   VolumeMuteOutline,
 } from '@vicons/ionicons5';
-import { debounce } from 'billd-utils';
+import { debounce, isSafari } from 'billd-utils';
+import { onMounted, onUnmounted } from 'vue';
 
 import { handleTip } from '@/hooks/use-common';
 import { LiveLineEnum, LiveRenderEnum } from '@/interface';
 import { AppRootState, useAppStore } from '@/store/app';
 import { usePiniaCacheStore } from '@/store/cache';
 import { LiveRoomTypeEnum } from '@/types/ILiveRoom';
-import { onMounted } from 'vue';
 
 const props = withDefaults(
   defineProps<{
@@ -230,6 +230,10 @@ onMounted(() => {
   window.addEventListener('keydown', handleKeydown);
 });
 
+onUnmounted(() => {
+  window.removeEventListener('keydown', handleKeydown);
+});
+
 function handleKeydown(e) {
   if (e.key === 'Escape') {
     console.log('esc');
@@ -241,6 +245,13 @@ function handleKeydown(e) {
 }
 
 function handlePip() {
+  if (
+    isSafari() &&
+    appStore.videoControls.renderMode === LiveRenderEnum.canvas
+  ) {
+    window.$message.info('请先切换渲染模式为video');
+    return;
+  }
   emits('pictureInPicture');
   appStore.videoControlsValue.pipMode = !appStore.videoControlsValue.pipMode;
 }

src/hooks/use-play.ts

@@ -25,13 +25,25 @@ function handlePlayUrl(url: string) {
       }=${userInfo.id!}&${SRS_CB_URL_PARAMS.randomId}=${getRandomString(8)}`;
 }
 
+let pipVideo;
+
 function closePip() {
-  const appStore = useAppStore();
-  appStore.videoControlsValue.pipMode = false;
+  try {
+    const appStore = useAppStore();
+    appStore.videoControlsValue.pipMode = false;
+    // 直接play貌似会有延迟
+    setTimeout(() => {
+      pipVideo.play?.();
+    }, 50);
+  } catch (error) {
+    console.error('closePip错误');
+    console.error(error);
+  }
 }
 
 export async function usePictureInPicture(el, parentEl) {
   try {
+    pipVideo = el;
     if (el?.tagName?.toLowerCase() === 'video') {
       await el.requestPictureInPicture();
       el.addEventListener('leavepictureinpicture', closePip);

src/views/push/index.vue

@@ -2218,7 +2218,9 @@ function handleChangeMuted(item: AppRootState['allTrack'][0]) {
     item.volume = res ? 0 : appStore.normalVolume;
     item.muted = res;
     if (item.type) {
-      item.videoEl.muted = res;
+      if (item.type !== MediaTypeEnum.microphone) {
+        item.videoEl.muted = res;
+      }
       item.videoEl.volume = res ? 0 : appStore.normalVolume / 100;
     }
     cacheStore.setResourceList(appStore.allTrack);
@@ -2234,7 +2236,9 @@ function handleChangeVolume(item: AppRootState['allTrack'][0], v) {
         iten.muted = v === 0;
         if (iten.videoEl && item.type) {
           iten.videoEl.volume = v / 100;
-          iten.videoEl.muted = v === 0;
+          if (item.type !== MediaTypeEnum.microphone) {
+            iten.videoEl.muted = v === 0;
+          }
         }
       }
     }