refactor: 调整播放器与播放条组件

This commit is contained in:
alger
2026-02-04 20:15:39 +08:00
parent 6ff2a0337a
commit b06459f10d
4 changed files with 432 additions and 571 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -130,7 +130,7 @@ import SongItem from '@/components/common/SongItem.vue';
import { allTime, artistList, nowTime, playMusic } from '@/hooks/MusicHook';
import { useArtist } from '@/hooks/useArtist';
import { audioService } from '@/services/audioService';
import { isBilibiliIdMatch, usePlayerStore, useSettingsStore } from '@/store';
import { usePlayerStore, useSettingsStore } from '@/store';
import type { SongResult } from '@/types/music';
import { getImgUrl } from '@/utils';
@@ -200,26 +200,13 @@ const handleVolumeWheel = (e: WheelEvent) => {
// 收藏相关
const isFavorite = computed(() => {
// 对于B站视频使用ID匹配函数
if (playMusic.value.source === 'bilibili' && playMusic.value.bilibiliData?.bvid) {
return playerStore.favoriteList.some((id) => isBilibiliIdMatch(id, playMusic.value.id));
}
// 非B站视频直接比较ID
return playerStore.favoriteList.includes(playMusic.value.id);
});
const toggleFavorite = async (e: Event) => {
e.stopPropagation();
// 处理B站视频的收藏ID
let favoriteId = playMusic.value.id;
if (playMusic.value.source === 'bilibili' && playMusic.value.bilibiliData?.bvid) {
// 如果当前播放的是B站视频且已有ID不包含--格式则需要构造完整ID
if (!String(favoriteId).includes('--')) {
favoriteId = `${playMusic.value.bilibiliData.bvid}--${playMusic.value.song?.ar?.[0]?.id || 0}--${playMusic.value.bilibiliData.cid}`;
}
}
if (isFavorite.value) {
playerStore.removeFromFavorite(favoriteId);

View File

@@ -184,7 +184,7 @@ import {
import { useArtist } from '@/hooks/useArtist';
import { usePlayMode } from '@/hooks/usePlayMode';
import { audioService } from '@/services/audioService';
import { isBilibiliIdMatch, usePlayerStore } from '@/store/modules/player';
import { usePlayerStore } from '@/store/modules/player';
import { useSettingsStore } from '@/store/modules/settings';
import { getImgUrl, isElectron, isMobile, secondToMinute, setAnimationClass } from '@/utils';
@@ -338,12 +338,6 @@ const setMusicFull = () => {
const isFavorite = computed(() => {
if (!playMusic || !playMusic.value) return false;
// 对于B站视频使用ID匹配函数
if (playMusic.value.source === 'bilibili' && playMusic.value.bilibiliData?.bvid) {
return playerStore.favoriteList.some((id) => isBilibiliIdMatch(id, playMusic.value.id));
}
// 非B站视频直接比较ID
return playerStore.favoriteList.includes(playMusic.value.id);
});
@@ -351,14 +345,7 @@ const toggleFavorite = async (e: Event) => {
console.log('playMusic.value', playMusic.value);
e.stopPropagation();
// 处理B站视频的收藏ID
let favoriteId = playMusic.value.id;
if (playMusic.value.source === 'bilibili' && playMusic.value.bilibiliData?.bvid) {
// 如果当前播放的是B站视频且已有ID不包含--格式则需要构造完整ID
if (!String(favoriteId).includes('--')) {
favoriteId = `${playMusic.value.bilibiliData.bvid}--${playMusic.value.song?.ar?.[0]?.id || 0}--${playMusic.value.bilibiliData.cid}`;
}
}
if (isFavorite.value) {
playerStore.removeFromFavorite(favoriteId);

View File

@@ -30,7 +30,7 @@
class="source-button flex items-center p-2 rounded-lg cursor-pointer transition-all duration-200 bg-light-200 dark:bg-dark-200 hover:bg-light-300 dark:hover:bg-dark-300"
:class="{
'bg-green-50 dark:bg-green-900/20 text-green-500': isCurrentSource(source.value),
'opacity-50 cursor-not-allowed': isReparsing || playMusic.source === 'bilibili'
'opacity-50 cursor-not-allowed': isReparsing
}"
@click="directReparseMusic(source.value)"
>
@@ -55,9 +55,6 @@
</div>
</div>
</div>
<div v-if="playMusic.source === 'bilibili'" class="text-red-500 text-sm">
{{ t('player.reparse.bilibiliNotSupported') }}
</div>
<!-- 清除自定义音源 -->
<div
class="text-red-500 text-sm flex items-center bg-light-200 dark:bg-dark-200 rounded-lg p-2 cursor-pointer"
@@ -103,7 +100,6 @@ const musicSourceOptions = ref([
{ label: 'MiGu', value: 'migu' as Platform },
{ label: 'KuGou', value: 'kugou' as Platform },
{ label: 'pyncmd', value: 'pyncmd' as Platform },
{ label: 'Bilibili', value: 'bilibili' as Platform },
{ label: 'GdMuisc', value: 'gdmusic' as Platform }
]);
@@ -120,7 +116,6 @@ const getSourceIcon = (source: Platform) => {
qq: 'ri-qq-fill',
joox: 'ri-disc-fill',
pyncmd: 'ri-netease-cloud-music-fill',
bilibili: 'ri-bilibili-fill',
gdmusic: 'ri-google-fill',
kuwo: 'ri-music-fill',
lxMusic: 'ri-leaf-fill'
@@ -149,7 +144,7 @@ const clearCustomSource = () => {
// 直接重新解析当前歌曲
const directReparseMusic = async (source: Platform) => {
if (isReparsing.value || playMusic.value.source === 'bilibili') {
if (isReparsing.value) {
return;
}