✨ feat: 修复搜索播放 bug 优化搜索 mv播放器

src/components/MvPlayer.vue

@@ -44,9 +44,9 @@
 
           <div class="controls-main">
             <div class="left-controls">
-              <n-tooltip placement="top">
+              <n-tooltip v-if="!props.noList" placement="top">
                 <template #trigger>
-                  <n-button quaternary circle :disabled="isPrevDisabled" @click="handlePrev">
+                  <n-button quaternary circle @click="handlePrev">
                     <template #icon>
                       <n-icon size="24">
                         <n-spin v-if="prevLoading" size="small" />
@@ -72,7 +72,7 @@
                 {{ isPlaying ? '暂停' : '播放' }}
               </n-tooltip>
 
-              <n-tooltip placement="top">
+              <n-tooltip v-if="!props.noList" placement="top">
                 <template #trigger>
                   <n-button quaternary circle @click="handleNext">
                     <template #icon>
@@ -106,7 +106,7 @@
                 <n-slider v-model:value="volume" :min="0" :max="100" :tooltip="false" class="volume-slider" />
               </div>
 
-              <n-tooltip placement="top">
+              <n-tooltip v-if="!props.noList" placement="top">
                 <template #trigger>
                   <n-button quaternary circle class="play-mode-btn" @click="togglePlayMode">
                     <template #icon>
@@ -171,7 +171,7 @@
 </template>
 
 <script setup lang="ts">
-import { NButton, NIcon, NSlider, NTooltip, useMessage } from 'naive-ui';
+import { NButton, NIcon, NSlider, NTooltip } from 'naive-ui';
 import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 import { useStore } from 'vuex';
 
@@ -184,10 +184,18 @@ const PLAY_MODE = {
   Auto: 'auto' as PlayMode,
 } as const;
 
-const props = defineProps<{
+const props = withDefaults(
-  show: boolean;
+  defineProps<{
-  currentMv?: IMvItem;
+    show: boolean;
-}>();
+    currentMv?: IMvItem;
+    noList?: boolean;
+  }>(),
+  {
+    show: false,
+    currentMv: undefined,
+    noList: false,
+  },
+);
 
 const emit = defineEmits<{
   (e: 'update:show', value: boolean): void;
@@ -345,7 +353,9 @@ const handleEnded = () => {
     }
   } else {
     // 自动播放模式，触发下一个
-    emit('next');
+    emit('next', (value: boolean) => {
+      nextLoading.value = value;
+    });
   }
 };
 
@@ -369,9 +379,9 @@ const checkFullscreenAPI = () => {
   return {
     requestFullscreen:
       videoContainerRef.value?.requestFullscreen ||
-      videoContainerRef.value?.webkitRequestFullscreen ||
+      (videoContainerRef.value as any)?.webkitRequestFullscreen ||
-      videoContainerRef.value?.mozRequestFullScreen ||
+      (videoContainerRef.value as any)?.mozRequestFullScreen ||
-      videoContainerRef.value?.msRequestFullscreen,
+      (videoContainerRef.value as any)?.msRequestFullscreen,
     exitFullscreen: doc.exitFullscreen || doc.webkitExitFullscreen || doc.mozCancelFullScreen || doc.msExitFullscreen,
     fullscreenElement:
       doc.fullscreenElement || doc.webkitFullscreenElement || doc.mozFullScreenElement || doc.msFullscreenElement,
@@ -441,9 +451,6 @@ onUnmounted(() => {
   document.removeEventListener('keydown', handleKeyPress);
 });
 
-// 在 setup 中初始化 message
-const message = useMessage();
-
 // 添加提示状态
 const showModeHint = ref(false);
 

src/components/common/SearchItem.vue

@@ -18,14 +18,15 @@
       :song-list="songList"
       :list-info="listInfo"
     />
-
+    <mv-player v-if="item.type === 'mv'" v-model:show="showPop" :current-mv="getCurrentMv()" no-list />
-    <PlayVideo v-if="item.type === 'mv'" v-model:show="showPop" :title="item.name" :url="url" />
   </div>
 </template>
 
 <script setup lang="ts">
 import { getAlbum, getListDetail } from '@/api/list';
 import { getMvUrl } from '@/api/mv';
+import MvPlayer from '@/components/MvPlayer.vue';
+import { IMvItem } from '@/type/mv';
 import { getImgUrl } from '@/utils';
 
 const props = defineProps<{
@@ -45,6 +46,13 @@ const songList = ref<any[]>([]);
 const showPop = ref(false);
 const listInfo = ref<any>(null);
 
+const getCurrentMv = () => {
+  return {
+    id: props.item.id,
+    name: props.item.name,
+  } as unknown as IMvItem;
+};
+
 const handleClick = async () => {
   listInfo.value = null;
   if (props.item.type === '专辑') {

src/layout/components/MusicFull.vue

@@ -12,8 +12,8 @@
         <div>
           <div class="music-content-name">{{ playMusic.name }}</div>
           <div class="music-content-singer">
-            <span v-for="(item, index) in playMusic.song.artists" :key="index">
+            <span v-for="(item, index) in playMusic.ar || playMusic.song.artists" :key="index">
-              {{ item.name }}{{ index < playMusic.song.artists.length - 1 ? ' / ' : '' }}
+              {{ item.name }}{{ index < (playMusic.ar || playMusic.song.artists).length - 1 ? ' / ' : '' }}
             </span>
           </div>
         </div>

src/layout/components/PlayBar.vue

@@ -26,9 +26,10 @@
       </div>
       <div class="music-content-name">
         <n-ellipsis class="text-ellipsis" line-clamp="1">
-          <span v-for="(item, index) in playMusic.song.artists" :key="index">
+          <span v-for="(artists, artistsindex) in playMusic.ar || playMusic.song.artists" :key="artistsindex"
-            {{ item.name }}{{ index < playMusic.song.artists.length - 1 ? ' / ' : '' }}
+            >{{ artists.name
-          </span>
+            }}{{ artistsindex < (playMusic.ar || playMusic.song.artists).length - 1 ? ' / ' : '' }}</span
+          >
         </n-ellipsis>
       </div>
     </div>

src/store/index.ts

@@ -35,7 +35,6 @@ const state: State = {
   searchValue: '',
   searchType: 1,
 };
-const windowData = window as any;
 
 const { handlePlayMusic, nextPlay, prevPlay } = useMusicListHook();
 
@@ -64,7 +63,9 @@ const mutations = {
   },
   async setSetData(state: State, setData: any) {
     state.setData = setData;
-    window.electron && window.electron.ipcRenderer.setStoreValue('set', JSON.parse(JSON.stringify(setData)));
+    if ((window as any).electron) {
+      (window as any).electron.ipcRenderer.setStoreValue('set', JSON.parse(JSON.stringify(setData)));
+    }
   },
 };
 

src/type/music.ts

@@ -81,6 +81,7 @@ export interface Song {
   count?: number;
   playLoading?: boolean;
   picUrl?: string;
+  ar: Artist[];
 }
 
 interface Privilege {