feat: 历史记录页面 添加本地和云端两种记录支持,支持歌曲、歌单、专辑

This commit is contained in:
alger
2025-10-22 21:51:16 +08:00
parent a9adb6be36
commit 6d7ba6dbae
16 changed files with 1045 additions and 137 deletions
+57 -5
View File
@@ -3,7 +3,7 @@ import { ref } from 'vue';
import { logout } from '@/api/login';
import { getLikedList } from '@/api/music';
import { getUserAlbumSublist } from '@/api/user';
import { getUserAlbumSublist, getUserPlaylist } from '@/api/user';
import { clearLoginStatus } from '@/utils/auth';
interface UserData {
@@ -30,6 +30,10 @@ export const useUserStore = defineStore('user', () => {
const searchType = ref(1);
// 收藏的专辑 ID 列表
const collectedAlbumIds = ref<Set<number>>(new Set());
// 用户的歌单列表
const playList = ref<any[]>([]);
// 用户的专辑列表
const albumList = ref<any[]>([]);
// 方法
const setUser = (userData: UserData) => {
@@ -51,6 +55,9 @@ export const useUserStore = defineStore('user', () => {
await logout();
user.value = null;
loginType.value = null;
collectedAlbumIds.value.clear();
playList.value = [];
albumList.value = [];
clearLoginStatus();
// 刷新
window.location.reload();
@@ -59,6 +66,9 @@ export const useUserStore = defineStore('user', () => {
// 即使API调用失败,也要清除本地状态
user.value = null;
loginType.value = null;
collectedAlbumIds.value.clear();
playList.value = [];
albumList.value = [];
clearLoginStatus();
window.location.reload();
}
@@ -72,7 +82,41 @@ export const useUserStore = defineStore('user', () => {
searchType.value = type;
};
// 初始化收藏的专辑列表
// 初始化歌单列表
const initializePlaylist = async () => {
if (!user.value) {
playList.value = [];
return;
}
try {
const { data } = await getUserPlaylist(user.value.userId, 1000, 0);
playList.value = data?.playlist || [];
console.log(`已加载 ${playList.value.length} 个歌单`);
} catch (error) {
console.error('获取歌单列表失败:', error);
playList.value = [];
}
};
// 初始化专辑列表
const initializeAlbumList = async () => {
if (!user.value || !localStorage.getItem('token')) {
albumList.value = [];
return;
}
try {
const { data } = await getUserAlbumSublist({ limit: 1000, offset: 0 });
albumList.value = data?.data || [];
console.log(`已加载 ${albumList.value.length} 个收藏专辑`);
} catch (error) {
console.error('获取专辑列表失败:', error);
albumList.value = [];
}
};
// 初始化收藏的专辑ID列表
const initializeCollectedAlbums = async () => {
if (!user.value || !localStorage.getItem('token')) {
collectedAlbumIds.value.clear();
@@ -83,7 +127,7 @@ export const useUserStore = defineStore('user', () => {
const { data } = await getUserAlbumSublist({ limit: 1000, offset: 0 });
const albumIds = (data?.data || []).map((album: any) => album.id);
collectedAlbumIds.value = new Set(albumIds);
console.log(`已加载 ${albumIds.length} 个收藏专辑`);
console.log(`已加载 ${albumIds.length} 个收藏专辑ID`);
} catch (error) {
console.error('获取收藏专辑列表失败:', error);
collectedAlbumIds.value.clear();
@@ -113,8 +157,12 @@ export const useUserStore = defineStore('user', () => {
// 如果用户已登录,获取收藏列表
if (localStorage.getItem('token')) {
try {
// 同时初始化收藏专辑列表
await initializeCollectedAlbums();
// 并行加载歌单、专辑和收藏ID列表
await Promise.all([
initializePlaylist(),
initializeAlbumList(),
initializeCollectedAlbums()
]);
const { data } = await getLikedList(savedUser.userId);
return data?.ids || [];
@@ -134,6 +182,8 @@ export const useUserStore = defineStore('user', () => {
searchValue,
searchType,
collectedAlbumIds,
playList,
albumList,
// 方法
setUser,
@@ -142,6 +192,8 @@ export const useUserStore = defineStore('user', () => {
setSearchValue,
setSearchType,
initializeUser,
initializePlaylist,
initializeAlbumList,
initializeCollectedAlbums,
addCollectedAlbum,
removeCollectedAlbum,