diff --git a/src/api/list.ts b/src/api/list.ts index 096cbbe..bceb4fb 100644 --- a/src/api/list.ts +++ b/src/api/list.ts @@ -1,37 +1,42 @@ -import request from "@/utils/request"; -import { IList } from "@/type/list"; -import type { IListDetail } from "@/type/listDetail"; - -interface IListByTagParams { - tag: string; - before: number; - limit: number; -} - -interface IListByCatParams { - cat: string; - offset: number; - limit: number; -} - -// 根据tag 获取歌单列表 -export function getListByTag(params: IListByTagParams) { - return request.get("/top/playlist/highquality", { params: params }); -} - -// 根据cat 获取歌单列表 -export function getListByCat(params: IListByCatParams) { - return request.get("/top/playlist", { - params: params, - }); -} - -// 获取推荐歌单 -export function getRecommendList(limit: number = 30) { - return request.get("/personalized", { params: { limit } }); -} - -// 获取歌单详情 -export function getListDetail(id: number | string) { - return request.get("/playlist/detail", { params: { id } }); -} +import request from "@/utils/request"; +import { IList } from "@/type/list"; +import type { IListDetail } from "@/type/listDetail"; + +interface IListByTagParams { + tag: string; + before: number; + limit: number; +} + +interface IListByCatParams { + cat: string; + offset: number; + limit: number; +} + +// 根据tag 获取歌单列表 +export function getListByTag(params: IListByTagParams) { + return request.get("/top/playlist/highquality", { params: params }); +} + +// 根据cat 获取歌单列表 +export function getListByCat(params: IListByCatParams) { + return request.get("/top/playlist", { + params: params, + }); +} + +// 获取推荐歌单 +export function getRecommendList(limit: number = 30) { + return request.get("/personalized", { params: { limit } }); +} + +// 获取歌单详情 +export function getListDetail(id: number | string) { + return request.get("/playlist/detail", { params: { id } }); +} + +// 获取专辑内容 +export function getAlbum(id: number | string) { + return request.get("/album", { params: { id } }); +} \ No newline at end of file diff --git a/src/components/MusicList.vue b/src/components/MusicList.vue index 08eb5ea..db438b6 100644 --- a/src/components/MusicList.vue +++ b/src/components/MusicList.vue @@ -2,11 +2,11 @@
-
{{ musicList?.name }}
+
{{ name }}
-
@@ -28,7 +28,8 @@ const store = useStore() const props = defineProps<{ show: boolean; - musicList: Playlist; + name: string; + songList: any[] }>() const emit = defineEmits(['update:show']) @@ -45,7 +46,7 @@ const formatDetail = computed(() => (detail: any) => { }) const handlePlay = (item: any) => { - const tracks = props.musicList?.tracks || [] + const tracks = props.songList || [] const musicIndex = (tracks.findIndex((music: any) => music.id == item.id) || 0) store.commit('setPlayList', tracks) } diff --git a/src/components/RecommendAlbum.vue b/src/components/RecommendAlbum.vue index ef0f189..7362447 100644 --- a/src/components/RecommendAlbum.vue +++ b/src/components/RecommendAlbum.vue @@ -8,6 +8,7 @@ class="recommend-album-list-item" :class="setAnimationClass('animate__backInUp')" :style="setAnimationDelay(index, 100)" + @click="handleClick(item)" >
+
@@ -27,6 +29,7 @@ import { getNewAlbum } from "@/api/home" import { ref, onMounted } from "vue"; import type { IAlbumNew } from "@/type/album" import { setAnimationClass, setAnimationDelay, getImgUrl } from "@/utils"; +import { getAlbum } from "@/api/list"; const albumData = ref() @@ -35,6 +38,20 @@ const loadAlbumList = async () => { albumData.value = data } +const showMusic = ref(false) +const songList = ref([]) +const albumName = ref('') + +const handleClick = async (item:any) => { + albumName.value = item.name + showMusic.value = true + const res = await getAlbum(item.id) + songList.value = res.data.songs.map((song:any)=>{ + song.al.picUrl = song.al.picUrl || item.picUrl + return song + }) +} + onMounted(() => { loadAlbumList() }) diff --git a/src/components/common/SearchItem.vue b/src/components/common/SearchItem.vue index 69035e8..2a9ea6b 100644 --- a/src/components/common/SearchItem.vue +++ b/src/components/common/SearchItem.vue @@ -1,5 +1,5 @@