mirror of
https://github.com/algerkong/AlgerMusicPlayer.git
synced 2026-04-24 16:27:23 +08:00
refactor: 调整播放器与播放条组件
This commit is contained in:
File diff suppressed because it is too large
Load Diff
@@ -130,7 +130,7 @@ import SongItem from '@/components/common/SongItem.vue';
|
|||||||
import { allTime, artistList, nowTime, playMusic } from '@/hooks/MusicHook';
|
import { allTime, artistList, nowTime, playMusic } from '@/hooks/MusicHook';
|
||||||
import { useArtist } from '@/hooks/useArtist';
|
import { useArtist } from '@/hooks/useArtist';
|
||||||
import { audioService } from '@/services/audioService';
|
import { audioService } from '@/services/audioService';
|
||||||
import { isBilibiliIdMatch, usePlayerStore, useSettingsStore } from '@/store';
|
import { usePlayerStore, useSettingsStore } from '@/store';
|
||||||
import type { SongResult } from '@/types/music';
|
import type { SongResult } from '@/types/music';
|
||||||
import { getImgUrl } from '@/utils';
|
import { getImgUrl } from '@/utils';
|
||||||
|
|
||||||
@@ -200,26 +200,13 @@ const handleVolumeWheel = (e: WheelEvent) => {
|
|||||||
|
|
||||||
// 收藏相关
|
// 收藏相关
|
||||||
const isFavorite = computed(() => {
|
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);
|
return playerStore.favoriteList.includes(playMusic.value.id);
|
||||||
});
|
});
|
||||||
|
|
||||||
const toggleFavorite = async (e: Event) => {
|
const toggleFavorite = async (e: Event) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
|
||||||
// 处理B站视频的收藏ID
|
|
||||||
let favoriteId = playMusic.value.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) {
|
if (isFavorite.value) {
|
||||||
playerStore.removeFromFavorite(favoriteId);
|
playerStore.removeFromFavorite(favoriteId);
|
||||||
|
|||||||
@@ -184,7 +184,7 @@ import {
|
|||||||
import { useArtist } from '@/hooks/useArtist';
|
import { useArtist } from '@/hooks/useArtist';
|
||||||
import { usePlayMode } from '@/hooks/usePlayMode';
|
import { usePlayMode } from '@/hooks/usePlayMode';
|
||||||
import { audioService } from '@/services/audioService';
|
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 { useSettingsStore } from '@/store/modules/settings';
|
||||||
import { getImgUrl, isElectron, isMobile, secondToMinute, setAnimationClass } from '@/utils';
|
import { getImgUrl, isElectron, isMobile, secondToMinute, setAnimationClass } from '@/utils';
|
||||||
|
|
||||||
@@ -338,12 +338,6 @@ const setMusicFull = () => {
|
|||||||
|
|
||||||
const isFavorite = computed(() => {
|
const isFavorite = computed(() => {
|
||||||
if (!playMusic || !playMusic.value) return false;
|
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);
|
return playerStore.favoriteList.includes(playMusic.value.id);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -351,14 +345,7 @@ const toggleFavorite = async (e: Event) => {
|
|||||||
console.log('playMusic.value', playMusic.value);
|
console.log('playMusic.value', playMusic.value);
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
|
||||||
// 处理B站视频的收藏ID
|
|
||||||
let favoriteId = playMusic.value.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) {
|
if (isFavorite.value) {
|
||||||
playerStore.removeFromFavorite(favoriteId);
|
playerStore.removeFromFavorite(favoriteId);
|
||||||
|
|||||||
@@ -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="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="{
|
:class="{
|
||||||
'bg-green-50 dark:bg-green-900/20 text-green-500': isCurrentSource(source.value),
|
'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)"
|
@click="directReparseMusic(source.value)"
|
||||||
>
|
>
|
||||||
@@ -55,9 +55,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="playMusic.source === 'bilibili'" class="text-red-500 text-sm">
|
|
||||||
{{ t('player.reparse.bilibiliNotSupported') }}
|
|
||||||
</div>
|
|
||||||
<!-- 清除自定义音源 -->
|
<!-- 清除自定义音源 -->
|
||||||
<div
|
<div
|
||||||
class="text-red-500 text-sm flex items-center bg-light-200 dark:bg-dark-200 rounded-lg p-2 cursor-pointer"
|
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: 'MiGu', value: 'migu' as Platform },
|
||||||
{ label: 'KuGou', value: 'kugou' as Platform },
|
{ label: 'KuGou', value: 'kugou' as Platform },
|
||||||
{ label: 'pyncmd', value: 'pyncmd' as Platform },
|
{ label: 'pyncmd', value: 'pyncmd' as Platform },
|
||||||
{ label: 'Bilibili', value: 'bilibili' as Platform },
|
|
||||||
{ label: 'GdMuisc', value: 'gdmusic' as Platform }
|
{ label: 'GdMuisc', value: 'gdmusic' as Platform }
|
||||||
]);
|
]);
|
||||||
|
|
||||||
@@ -120,7 +116,6 @@ const getSourceIcon = (source: Platform) => {
|
|||||||
qq: 'ri-qq-fill',
|
qq: 'ri-qq-fill',
|
||||||
joox: 'ri-disc-fill',
|
joox: 'ri-disc-fill',
|
||||||
pyncmd: 'ri-netease-cloud-music-fill',
|
pyncmd: 'ri-netease-cloud-music-fill',
|
||||||
bilibili: 'ri-bilibili-fill',
|
|
||||||
gdmusic: 'ri-google-fill',
|
gdmusic: 'ri-google-fill',
|
||||||
kuwo: 'ri-music-fill',
|
kuwo: 'ri-music-fill',
|
||||||
lxMusic: 'ri-leaf-fill'
|
lxMusic: 'ri-leaf-fill'
|
||||||
@@ -149,7 +144,7 @@ const clearCustomSource = () => {
|
|||||||
|
|
||||||
// 直接重新解析当前歌曲
|
// 直接重新解析当前歌曲
|
||||||
const directReparseMusic = async (source: Platform) => {
|
const directReparseMusic = async (source: Platform) => {
|
||||||
if (isReparsing.value || playMusic.value.source === 'bilibili') {
|
if (isReparsing.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user