Skip to content

Commit

Permalink
🐞 fix: 修复点击歌单不能播放歌单歌曲问题
Browse files Browse the repository at this point in the history 
#8
  • Loading branch information
@XiangZi7
XiangZi7 committed Jan 1, 2025
1 parent 67de1ec commit 2cd37b6
Show file tree
Hide file tree
Showing 48 changed files with 2,366 additions and 2,250 deletions.
4 changes: 2 additions & 2 deletions src/App.vue
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script setup>
import { useTheme } from '@/hooks/useTheme'
useTheme()
import { useTheme } from '@/hooks/useTheme'
useTheme()
</script>
<template>
<RouterView />
Expand Down
188 changes: 122 additions & 66 deletions src/api/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@ import {
MVAllResponse,
ArtistTopListResponse,
TopListResponse,
MVRankingResponse
} from './interface';
MVRankingResponse,
} from './interface'

import { LyricsResponse } from '@/utils/parseLyrics';
import { httpGet } from '@/utils/http';
import { LyricsResponse } from '@/utils/parseLyrics'
import { httpGet } from '@/utils/http'

// 计算分页
const calculatePagination = (params: Params, defaultLimit = 30) => {
Expand All @@ -27,137 +27,193 @@ const calculatePagination = (params: Params, defaultLimit = 30) => {

// 创建查询字符串
const createQueryString = (params: Record<string, any>): string => {
return new URLSearchParams(Object.entries(params).filter(([_, v]) => v != null)).toString();
};
return new URLSearchParams(
Object.entries(params).filter(([_, v]) => v != null)
).toString()
}

// 搜索歌曲
export const cloudsearch = ({ kw = '', offset = 0, type = 1, limit = 20 }: SearchParams) => {
const { limit: calculatedLimit, offset: calculatedOffset } = calculatePagination({ limit, offset });
return httpGet<ResultRes>('cloudsearch', { keywords: kw, limit: calculatedLimit, offset: calculatedOffset, type });
};
export const cloudsearch = ({
kw = '',
offset = 0,
type = 1,
limit = 20,
}: SearchParams) => {
const { limit: calculatedLimit, offset: calculatedOffset } =
calculatePagination({ limit, offset })
return httpGet<ResultRes>('cloudsearch', {
keywords: kw,
limit: calculatedLimit,
offset: calculatedOffset,
type,
})
}

// 获取音乐连接
export const urlV1 = (id: number | string) => httpGet<{ data: { url: string }[] }>(`song/url/v1?id=${id}&level=exhigh`);
export const urlV1 = (id: number | string) =>
httpGet<{ data: { url: string }[] }>(`song/url/v1?id=${id}&level=exhigh`)

// 获取歌单详情
export const playlistDetail = (id: number | string) => httpGet<PlaylistDetailResponse>(`/playlist/detail?id=${id}`);
export const playlistDetail = (id: number | string) =>
httpGet<PlaylistDetailResponse>(`/playlist/detail?id=${id}`)

// 获取 MV 数据
export const mvDetail = (mvid: number | string) => httpGet<ResultData>(`/mv/detail?mvid=${mvid}`);
export const mvDetail = (mvid: number | string) =>
httpGet<ResultData>(`/mv/detail?mvid=${mvid}`)

// MV 评论
export const commentMV = <T>(params: CommentMVParams) => {
const { limit, offset } = calculatePagination(params);
return httpGet<T>(`/comment/mv?id=${params.id}&limit=${limit}&offset=${offset}`);
};
const { limit, offset } = calculatePagination(params)
return httpGet<T>(
`/comment/mv?id=${params.id}&limit=${limit}&offset=${offset}`
)
}

// 获取 MV URL
export const mvUrl = (id: number | string) => httpGet<ResultData>(`/mv/url?id=${id}`);
export const mvUrl = (id: number | string) =>
httpGet<ResultData>(`/mv/url?id=${id}`)

// 获取用户歌单
export const userPlaylist = <T>(params: Params) => {
const { limit, offset } = calculatePagination(params);
return httpGet<T>(`/user/playlist?uid=${params.id}&limit=${limit}&offset=${offset}`);
};
const { limit, offset } = calculatePagination(params)
return httpGet<T>(
`/user/playlist?uid=${params.id}&limit=${limit}&offset=${offset}`
)
}

// 获取热门歌单
export const topPlaylist = (params: Params) => {
const { limit, offset } = calculatePagination(params, 10);
return httpGet<{ playlists: [] }>(`/top/playlist?limit=${limit}&offset=${offset}&cat=${params.cat}`);
};
const { limit, offset } = calculatePagination(params, 10)
return httpGet<{ playlists: [] }>(
`/top/playlist?limit=${limit}&offset=${offset}&cat=${params.cat}`
)
}

// 获取歌单分类
export const playlistCatList = () => httpGet<{ sub: [] }>('/playlist/catlist');
export const playlistCatList = () => httpGet<{ sub: [] }>('/playlist/catlist')

// 获取歌词
export const lyric = (id: number | string) => httpGet<LyricsResponse>(`/lyric?id=${id}`);
export const lyric = (id: number | string) =>
httpGet<LyricsResponse>(`/lyric?id=${id}`)

// 二维码 key 生成接口
export const loginQrKey = () => httpGet<ResultData>('/login/qr/key');
export const loginQrKey = () => httpGet<ResultData>('/login/qr/key')

// 二维码生成接口
export const loginQrCreate = (key: string) => httpGet<ResultData>(`/login/qr/create?key=${encodeURIComponent(key)}&qrimg=true`);
export const loginQrCreate = (key: string) =>
httpGet<ResultData>(
`/login/qr/create?key=${encodeURIComponent(key)}&qrimg=true`
)

// 二维码检测扫码状态接口
export const loginQrCheck = (key: string) => httpGet<CheckQR>(`/login/qr/check?key=${encodeURIComponent(key)}`);
export const loginQrCheck = (key: string) =>
httpGet<CheckQR>(`/login/qr/check?key=${encodeURIComponent(key)}`)

// 登录状态
export const loginStatus = () => httpGet<ResultData>('/login/status');
export const loginStatus = () => httpGet<ResultData>('/login/status')

// 退出登录
export const logout = () => httpGet('/logout');
export const logout = () => httpGet('/logout')

// 歌单评论
export const commentPlaylist = (params: CommentMVParams) => {
const { limit, offset } = calculatePagination(params);
return httpGet<CommentResponse>(`/comment/playlist?id=${params.id}&limit=${limit}&offset=${offset}`);
};
const { limit, offset } = calculatePagination(params)
return httpGet<CommentResponse>(
`/comment/playlist?id=${params.id}&limit=${limit}&offset=${offset}`
)
}

// 喜欢音乐
export const likeMusic = (id: number) => httpGet(`/like?id=${id}`);
export const likeMusic = (id: number) => httpGet(`/like?id=${id}`)

// 歌曲评论
export const commentMusic = (params: CommentMVParams) => {
const { limit, offset } = calculatePagination(params);
return httpGet<CommentResponse>(`/comment/music?id=${params.id}&limit=${limit}&offset=${offset}`);
};
const { limit, offset } = calculatePagination(params)
return httpGet<CommentResponse>(
`/comment/music?id=${params.id}&limit=${limit}&offset=${offset}`
)
}

// 默认搜索关键词
export const searchDefault = () => httpGet<ResultData<SearchResult>>('/search/default');
export const searchDefault = () =>
httpGet<ResultData<SearchResult>>('/search/default')

// 获取相似歌单
export const similarPlaylists = <T>(id: number | string) => httpGet<T>(`/simi/mv?mvid=${id}`);
export const similarPlaylists = <T>(id: number | string) =>
httpGet<T>(`/simi/mv?mvid=${id}`)

// 封装获取所有 MV 的接口
export const getAllMV = (params: MVAllParams = {}) => {
const { area = '', type = '', order = '上升最快', limit = 30, offset = 0 } = params;
const {
area = '',
type = '',
order = '上升最快',
limit = 30,
offset = 0,
} = params
const query = createQueryString({
area,
type,
order,
limit,
offset: ((offset || 1) - 1) * limit, // 偏移计算
});
})

return httpGet<MVAllResponse>(`/mv/all?${query}`);
};
return httpGet<MVAllResponse>(`/mv/all?${query}`)
}

// 动漫搜索
export const aniSearch = <T>({ kw = '', type = '' }: { kw: string; type: string }) => {
const query = createQueryString({ kw, type });
return httpGet<T>(`/animation/search?${query}`);
};
export const aniSearch = <T>({
kw = '',
type = '',
}: {
kw: string
type: string
}) => {
const query = createQueryString({ kw, type })
return httpGet<T>(`/animation/search?${query}`)
}

// 动漫播放地址的 API 函数
export const aniPlay = <T>({ id, type, ep }: { id: number | string | undefined; type: string; ep?: number | string }) => {
export const aniPlay = <T>({
id,
type,
ep,
}: {
id: number | string | undefined
type: string
ep?: number | string
}) => {
const query = createQueryString({
id: id ?? '', // 如果 id 为 undefined 则使用空字符串
type,
...(ep !== undefined ? { ep } : {}), // 有 ep 时才添加
});
})

return httpGet<T>(`/animation/play?${query}`);
};
return httpGet<T>(`/animation/play?${query}`)
}

// 获取轮播图
export const banner = <T>() => httpGet<T>('/banner');
export const banner = <T>() => httpGet<T>('/banner')

// 最新专辑
export const albumNewest = <T>() => httpGet<T>('/album/newest');
export const albumNewest = <T>() => httpGet<T>('/album/newest')
// 所有榜单
export const topList = () => httpGet<TopListResponse>('/toplist');
export const topList = () => httpGet<TopListResponse>('/toplist')
// 获取歌手榜
export const getArtistTopList = (type?: number) => {
const query = createQueryString({ type });
return httpGet<ArtistTopListResponse>(`/toplist/artist?${query}`);
};
const query = createQueryString({ type })
return httpGet<ArtistTopListResponse>(`/toplist/artist?${query}`)
}
// 封装获取 MV 排行的接口
export const getMVRanking = (params: {
limit?: number;
area?: '内地' | '港台' | '欧美' | '日本' | '韩国';
offset?: number; // 默认值为 0
} = {}) => {
const { limit = 30, area = "欧美", offset = 0 } = params; // 设置默认值
const query = createQueryString({ limit, area, offset });
return httpGet<MVRankingResponse>(`/top/mv?${query}`);
};
export const getMVRanking = (
params: {
limit?: number
area?: '内地' | '港台' | '欧美' | '日本' | '韩国'
offset?: number // 默认值为 0
} = {}
) => {
const { limit = 30, area = '欧美', offset = 0 } = params // 设置默认值
const query = createQueryString({ limit, area, offset })
return httpGet<MVRankingResponse>(`/top/mv?${query}`)
}
44 changes: 22 additions & 22 deletions src/api/interface/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,33 +337,33 @@ export interface TopListResponse extends Code {

// MV 的详细信息
export interface MVDetail {
authId: number; // 认证 ID
status: number; // 状态
id: number; // MV ID
title: string; // MV 标题
subTitle?: string; // MV 副标题，可选
authId: number // 认证 ID
status: number // 状态
id: number // MV ID
title: string // MV 标题
subTitle?: string // MV 副标题，可选
}

// MV 排行的单个 MV 信息结构
export interface MVRanking {
artistId: number; // 艺术家 ID
artistName: string; // 艺术家名称
artists: Array<{ id: number; name: string }>; // 艺术家数组
briefDesc?: string | null; // 简介，可选
cover: string; // 封面图 URL
duration: number; // 时长，单位为秒
id: number; // MV ID
lastRank: number; // 上一排名
mark: number; // 标记
mv: MVDetail; // MV 的详细信息
name: string; // MV 名称
playCount: number; // 播放次数
score: number; // 排名得分
subed: boolean; // 是否订阅
artistId: number // 艺术家 ID
artistName: string // 艺术家名称
artists: Array<{ id: number; name: string }> // 艺术家数组
briefDesc?: string | null // 简介，可选
cover: string // 封面图 URL
duration: number // 时长，单位为秒
id: number // MV ID
lastRank: number // 上一排名
mark: number // 标记
mv: MVDetail // MV 的详细信息
name: string // MV 名称
playCount: number // 播放次数
score: number // 排名得分
subed: boolean // 是否订阅
}
// MV 排行响应类型
export interface MVRankingResponse extends ResultData {
hasMore: boolean; // 是否有更多的 MV
updateTime: number; // 更新时间
data: MVRanking[]; // MV 排行列表
hasMore: boolean // 是否有更多的 MV
updateTime: number // 更新时间
data: MVRanking[] // MV 排行列表
}
Loading

0 comments on commit 2cd37b6

Please sign in to comment.