feat(playlist): 增加歌单收藏状态检查功能

- 新增 isPlaylistCollected 接口和相关实现
- 修改 toggleCollectPlaylist 函数,增加当前收藏状态参数
- 在前端 PlaylistDetail 组件中添加收藏状态检查逻辑
- 后端增加对应的控制层、服务层和实现类方法
This commit is contained in:
ikmkj
2025-07-26 12:44:51 +08:00
parent 40710d9ec0
commit 678149df79
10 changed files with 133 additions and 29 deletions

View File

@@ -289,10 +289,24 @@ export function deletePlaylist(id) {
/**
* 收藏/取消收藏歌单
* @param {number} id 歌单ID
* @param {boolean} isCollected 当前是否收藏
* @returns {Promise<any>}
*/
export function toggleCollectPlaylist(id) {
return api.post(`/playlist/${id}/collect`)
export function toggleCollectPlaylist(id, isCollected) {
if (isCollected) {
return api.delete(`/playlist/${id}/collect`)
} else {
return api.post(`/playlist/${id}/collect`)
}
}
/**
* 检查当前用户是否收藏了该歌单
* @param {number} id 歌单ID
* @returns {Promise<any>}
*/
export function isPlaylistCollected(id) {
return api.get(`/playlist/${id}/is-collected`)
}
/**

View File

@@ -203,24 +203,24 @@ export function getHotSinger(limit = 10) {
/**
* 收藏/取消收藏歌手
* @param {number} id 歌手ID
* @param {boolean} isCollected 当前是否收藏
* @returns {Promise<any>}
*/
export function toggleCollectSinger(id) {
// 检查是否已收藏
return api.get(`/singer/${id}`).then(res => {
if (res.code === 200) {
const isCollected = res.data.isCollected === true
export function toggleCollectSinger(id, isCollected) {
if (isCollected) {
return api.delete(`/singer/${id}/collect`)
} else {
return api.post(`/singer/${id}/collect`)
}
}
// 根据当前收藏状态决定调用收藏或取消收藏接口
if (isCollected) {
return api.delete(`/singer/${id}/collect`)
} else {
return api.post(`/singer/${id}/collect`)
}
} else {
return Promise.reject(new Error(res.message || '获取歌手信息失败'))
}
})
/**
* 检查当前用户是否收藏了该歌手
* @param {number} id 歌手ID
* @returns {Promise<any>}
*/
export function isSingerCollected(id) {
return api.get(`/singer/${id}/is-collected`)
}
/**

View File

@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router'
import { usePlayerStore } from '../stores/player'
import { useUserStore } from '../stores/user'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getPlaylistById, toggleCollectPlaylist, deletePlaylist as apiDeletePlaylist } from '../api/playlist'
import { getPlaylistById, toggleCollectPlaylist, deletePlaylist as apiDeletePlaylist, isPlaylistCollected } from '../api/playlist'
import { getMusicStatus } from '../api/music'
import { getCommentList, addComment, deleteComment as apiDeleteComment } from '../api/comment'
import { connect, subscribe, unsubscribe, disconnect } from '../utils/websocket' // 导入 WebSocket 工具
@@ -67,8 +67,10 @@ const fetchPlaylistDetail = async () => {
// 判断是否是创建者
isCreator.value = playlist.value.creator?.id === userStore.user?.id
// 获取收藏状态
isCollected.value = playlist.value.collected === true
// 如果用户已登录,则检查是否收藏
if (userStore.isLoggedIn) {
checkIfCollected()
}
// 更新歌单内歌曲的状态
updateMusicStatuses(playlist.value.songs)
@@ -83,6 +85,18 @@ const fetchPlaylistDetail = async () => {
}
}
// 检查是否收藏
const checkIfCollected = async () => {
try {
const res = await isPlaylistCollected(playlistId.value)
if (res.code === 200) {
isCollected.value = res.data
}
} catch (error) {
console.error('检查收藏状态失败:', error)
}
}
// 获取评论列表
const fetchComments = async () => {
try {
@@ -139,7 +153,7 @@ const toggleCollect = async () => {
}
try {
const res = await toggleCollectPlaylist(playlistId.value)
const res = await toggleCollectPlaylist(playlistId.value, isCollected.value)
if (res.code === 200) {
isCollected.value = !isCollected.value
// 更新收藏数

View File

@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router'
import { usePlayerStore } from '../stores/player'
import { useUserStore } from '../stores/user'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getSingerById, toggleCollectSinger } from '../api/singer'
import { getSingerById, isSingerCollected, collectSinger, uncollectSinger } from '../api/singer'
import { getCommentList, addComment, deleteComment as apiDeleteComment } from '../api/comment'
import { processImageUrl } from '../utils/imageUtils'
import { processMusicUrl, getMusicBySinger, getMusicStatus } from '../api/music'
@@ -67,8 +67,10 @@ const fetchSingerDetail = async () => {
// 获取歌手的音乐列表
await fetchSingerMusic()
// 获取收藏状态
isCollected.value = singer.value.collected === true
// 如果用户已登录,则检查是否收藏
if (userStore.isLoggedIn) {
checkIfCollected()
}
} else {
ElMessage.error(res.message || '获取歌手详情失败')
}
@@ -80,6 +82,18 @@ const fetchSingerDetail = async () => {
}
}
// 检查是否收藏
const checkIfCollected = async () => {
try {
const res = await isSingerCollected(singerId.value)
if (res.code === 200) {
isCollected.value = res.data
}
} catch (error) {
console.error('检查收藏状态失败:', error)
}
}
// 获取歌手的音乐列表
const fetchSingerMusic = async () => {
try {
@@ -181,7 +195,7 @@ const toggleCollect = async () => {
}
try {
const res = await toggleCollectSinger(singerId.value)
const res = await toggleCollectSinger(singerId.value, isCollected.value)
if (res.code === 200) {
isCollected.value = !isCollected.value
// 更新收藏数