fix: 不喜欢的操作只有每日推荐歌曲才请求接口,去除不喜欢的提示

This commit is contained in:
alger
2025-09-13 23:58:33 +08:00
parent fb8b4c9341
commit 70677dfb14
5 changed files with 102 additions and 99 deletions
+2 -2
View File
@@ -136,7 +136,7 @@ import { getMusicDetail } from '@/api/music';
import { getUserPlaylist } from '@/api/user'; import { getUserPlaylist } from '@/api/user';
import { navigateToMusicList } from '@/components/common/MusicListNavigator'; import { navigateToMusicList } from '@/components/common/MusicListNavigator';
import { useArtist } from '@/hooks/useArtist'; import { useArtist } from '@/hooks/useArtist';
import { usePlayerStore, useUserStore, useRecommendStore } from '@/store'; import { usePlayerStore, useRecommendStore, useUserStore } from '@/store';
import { Playlist } from '@/types/list'; import { Playlist } from '@/types/list';
import type { IListDetail } from '@/types/listDetail'; import type { IListDetail } from '@/types/listDetail';
import { SongResult } from '@/types/music'; import { SongResult } from '@/types/music';
@@ -161,7 +161,7 @@ const hotSingerData = ref<IHotSinger>();
const dayRecommendData = computed(() => { const dayRecommendData = computed(() => {
if (recommendStore.dailyRecommendSongs.length > 0) { if (recommendStore.dailyRecommendSongs.length > 0) {
return { return {
dailySongs: recommendStore.dailyRecommendSongs, dailySongs: recommendStore.dailyRecommendSongs
}; };
} }
return null; return null;
+44 -43
View File
@@ -1,4 +1,4 @@
import { useDialog, useMessage } from 'naive-ui'; import { useMessage } from 'naive-ui';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
@@ -7,16 +7,15 @@ import type { SongResult } from '@/types/music';
import { getImgUrl } from '@/utils'; import { getImgUrl } from '@/utils';
import { getImageBackground } from '@/utils/linearColor'; import { getImageBackground } from '@/utils/linearColor';
import { dislikeRecommendedSong } from "../api/music";
import { useArtist } from './useArtist'; import { useArtist } from './useArtist';
import { useDownload } from './useDownload'; import { useDownload } from './useDownload';
import { dislikeRecommendedSong } from "../api/music";
export function useSongItem(props: { item: SongResult; canRemove?: boolean }) { export function useSongItem(props: { item: SongResult; canRemove?: boolean }) {
const { t } = useI18n(); const { t } = useI18n();
const playerStore = usePlayerStore(); const playerStore = usePlayerStore();
const recommendStore = useRecommendStore(); const recommendStore = useRecommendStore();
const message = useMessage(); const message = useMessage();
const dialog = useDialog();
const { downloadMusic } = useDownload(); const { downloadMusic } = useDownload();
const { navigateToArtist } = useArtist(); const { navigateToArtist } = useArtist();
@@ -88,8 +87,13 @@ export function useSongItem(props: { item: SongResult; canRemove?: boolean }) {
} }
}; };
// 判断当前歌曲是否为每日推荐歌曲
const isDailyRecommendSong = computed(() => {
return recommendStore.dailyRecommendSongs.some(song => song.id === props.item.id);
});
// 切换不喜欢状态 // 切换不喜欢状态
const toggleDislike = async (e: Event) => { const toggleDislike = async (e: Event) => {
e && e.stopPropagation(); e && e.stopPropagation();
if (isDislike.value) { if (isDislike.value) {
@@ -97,46 +101,43 @@ export function useSongItem(props: { item: SongResult; canRemove?: boolean }) {
return; return;
} }
dialog.warning({ playerStore.addToDislikeList(props.item.id);
title: t('songItem.dialog.dislike.title'),
content: t('songItem.dialog.dislike.content'), // 只有当前歌曲是每日推荐歌曲时才调用接口
positiveText: t('songItem.dialog.dislike.positiveText'), if (!isDailyRecommendSong.value) {
negativeText: t('songItem.dialog.dislike.negativeText'), return;
onPositiveClick: async () => { }
playerStore.addToDislikeList(props.item.id); try {
try { console.log('发送不感兴趣请求,歌曲ID:', props.item.id);
console.log('发送不感兴趣请求,歌曲ID:', props.item.id); const numericId = typeof props.item.id === 'string' ? parseInt(props.item.id) : props.item.id;
const numericId = typeof props.item.id === 'string' ? parseInt(props.item.id) : props.item.id; const response = await dislikeRecommendedSong(numericId);
const response = await dislikeRecommendedSong(numericId); if (response.data.data) {
if (response.data.data) { console.log(response)
console.log(response) const newSongData = response.data.data;
const newSongData = response.data.data; const newSong: SongResult = {
const newSong: SongResult = { ...newSongData,
...newSongData, name: newSongData.name,
name: newSongData.name, id: newSongData.id,
id: newSongData.id, picUrl: newSongData.al?.picUrl || newSongData.album?.picUrl,
picUrl: newSongData.al?.picUrl || newSongData.album?.picUrl, ar: newSongData.ar || newSongData.artists,
ar: newSongData.ar || newSongData.artists, al: newSongData.al || newSongData.album,
al: newSongData.al || newSongData.album, song: {
song: { ...newSongData.song,
...newSongData.song, id: newSongData.id,
id: newSongData.id, name: newSongData.name,
name: newSongData.name, artists: newSongData.ar || newSongData.artists,
artists: newSongData.ar || newSongData.artists, album: newSongData.al || newSongData.album,
album: newSongData.al || newSongData.album, },
}, source: 'netease',
source: 'netease', count: 0,
count: 0, };
}; recommendStore.replaceSongInDailyRecommend(props.item.id, newSong);
recommendStore.replaceSongInDailyRecommend(props.item.id, newSong); } else {
} else { console.warn('标记不感兴趣API成功,但未返回新歌曲。', response.data);
console.warn('标记不感兴趣API成功,但未返回新歌曲。', response.data);
}
} catch (error) {
console.error('发送不感兴趣请求时出错:', error);
}
} }
}); } catch (error) {
console.error('发送不感兴趣请求时出错:', error);
}
}; };
// 添加到下一首播放 // 添加到下一首播放
+1 -1
View File
@@ -15,9 +15,9 @@ export * from './modules/lyric';
export * from './modules/menu'; export * from './modules/menu';
export * from './modules/music'; export * from './modules/music';
export * from './modules/player'; export * from './modules/player';
export * from './modules/recommend';
export * from './modules/search'; export * from './modules/search';
export * from './modules/settings'; export * from './modules/settings';
export * from './modules/user'; export * from './modules/user';
export * from './modules/recommend';
export default pinia; export default pinia;
+33 -32
View File
@@ -1,42 +1,43 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { ref } from 'vue'; import { ref } from 'vue';
import { getDayRecommend } from '@/api/home'; import { getDayRecommend } from '@/api/home';
import type { SongResult } from '@/types/music';
import type { IDayRecommend } from '@/types/day_recommend'; import type { IDayRecommend } from '@/types/day_recommend';
import type { SongResult } from '@/types/music';
export const useRecommendStore = defineStore('recommend', () => { export const useRecommendStore = defineStore('recommend', () => {
const dailyRecommendSongs = ref<SongResult[]>([]); const dailyRecommendSongs = ref<SongResult[]>([]);
const fetchDailyRecommendSongs = async () => { const fetchDailyRecommendSongs = async () => {
try { try {
const { data } = await getDayRecommend(); const { data } = await getDayRecommend();
const recommendData = data.data as unknown as IDayRecommend; const recommendData = data.data as unknown as IDayRecommend;
if (recommendData && Array.isArray(recommendData.dailySongs)) { if (recommendData && Array.isArray(recommendData.dailySongs)) {
dailyRecommendSongs.value = recommendData.dailySongs as any; dailyRecommendSongs.value = recommendData.dailySongs as any;
console.log(`[Recommend Store] 已加载 ${recommendData.dailySongs.length} 首每日推荐歌曲。`); console.log(`[Recommend Store] 已加载 ${recommendData.dailySongs.length} 首每日推荐歌曲。`);
} else { } else {
dailyRecommendSongs.value = []; dailyRecommendSongs.value = [];
} }
} catch (error) { } catch (error) {
console.error('[Recommend Store] 获取每日推荐失败:', error); console.error('[Recommend Store] 获取每日推荐失败:', error);
dailyRecommendSongs.value = []; dailyRecommendSongs.value = [];
} }
}; };
const replaceSongInDailyRecommend = (oldSongId: number | string, newSong: SongResult) => { const replaceSongInDailyRecommend = (oldSongId: number | string, newSong: SongResult) => {
const index = dailyRecommendSongs.value.findIndex(song => song.id === oldSongId); const index = dailyRecommendSongs.value.findIndex((song) => song.id === oldSongId);
if (index !== -1) { if (index !== -1) {
dailyRecommendSongs.value.splice(index, 1, newSong as any); dailyRecommendSongs.value.splice(index, 1, newSong as any);
console.log(`[Recommend Store] 已将歌曲 ${oldSongId} 替换为 ${newSong.name}`); console.log(`[Recommend Store] 已将歌曲 ${oldSongId} 替换为 ${newSong.name}`);
} else { } else {
console.warn(`[Recommend Store] 未在日推列表中找到要替换的歌曲ID: ${oldSongId}`); console.warn(`[Recommend Store] 未在日推列表中找到要替换的歌曲ID: ${oldSongId}`);
} }
}; };
return { return {
dailyRecommendSongs, dailyRecommendSongs,
fetchDailyRecommendSongs, fetchDailyRecommendSongs,
replaceSongInDailyRecommend, replaceSongInDailyRecommend
}; };
}); });
+22 -21
View File
@@ -354,11 +354,13 @@ const getCoverImgUrl = computed(() => {
const filteredSongs = computed(() => { const filteredSongs = computed(() => {
// 1. 确定数据源是来自store的完整列表(日推)还是来自本地分页的列表(其他) // 1. 确定数据源是来自store的完整列表(日推)还是来自本地分页的列表(其他)
const sourceList = isDailyRecommend.value const sourceList = isDailyRecommend.value
? songList.value // 如果是日推,直接使用来自 recommendStore 的完整、响应式列表 ? songList.value // 如果是日推,直接使用来自 recommendStore 的完整、响应式列表
: displayedSongs.value; // 否则,使用用于分页加载的 displayedSongs : displayedSongs.value; // 否则,使用用于分页加载的 displayedSongs
// 2. 过滤不喜欢的歌曲 // 2. 过滤不喜欢的歌曲
const dislikeFilteredList = sourceList.filter(song => !playerStore.dislikeList.includes(song.id)); const dislikeFilteredList = sourceList.filter(
(song) => !playerStore.dislikeList.includes(song.id)
);
// ================================================================= // =================================================================
// 3. 如果没有搜索词,直接返回处理后的列表 // 3. 如果没有搜索词,直接返回处理后的列表
@@ -388,12 +390,12 @@ const filteredSongs = computed(() => {
}); });
return ( return (
nameMatch || nameMatch ||
albumMatch || albumMatch ||
artistsMatch || artistsMatch ||
namePinyinMatch || namePinyinMatch ||
albumPinyinMatch || albumPinyinMatch ||
artistsPinyinMatch artistsPinyinMatch
); );
}); });
}); });
@@ -774,17 +776,17 @@ watch(searchKeyword, () => {
}); });
watch( watch(
songList, songList,
(newSongs) => { (newSongs) => {
resetListState(); resetListState();
initSongList(newSongs); initSongList(newSongs);
if (hasMore.value && listInfo.value?.trackIds) { if (hasMore.value && listInfo.value?.trackIds) {
setTimeout(() => { setTimeout(() => {
loadMoreSongs(); loadMoreSongs();
}, 300); }, 300);
} }
}, },
{ immediate: true } { immediate: true }
); );
// 组件卸载时清理状态 // 组件卸载时清理状态
@@ -929,7 +931,6 @@ const handleBatchDownload = async () => {
await batchDownloadMusic(selectedSongsList); await batchDownloadMusic(selectedSongsList);
cancelSelect(); cancelSelect();
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">