↩ revert: 回退
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 961 B |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 1.7 KiB |
|
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 4.9 KiB |
|
Before Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 51 KiB After Width: | Height: | Size: 7.4 KiB |
|
Before Width: | Height: | Size: 1.9 KiB |
BIN
public/images/pic/avatar.png
Normal file
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 158 KiB After Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 95 KiB After Width: | Height: | Size: 13 KiB |
|
Before Width: | Height: | Size: 98 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 83 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 92 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 7.1 KiB After Width: | Height: | Size: 6.2 KiB |
|
Before Width: | Height: | Size: 51 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 70 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 2.8 KiB |
BIN
public/images/pic/video.jpg
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 77 KiB |
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 164 KiB |
|
Before Width: | Height: | Size: 261 KiB After Width: | Height: | Size: 176 KiB |
|
Before Width: | Height: | Size: 241 KiB After Width: | Height: | Size: 149 KiB |
|
Before Width: | Height: | Size: 126 KiB After Width: | Height: | Size: 90 KiB |
|
Before Width: | Height: | Size: 171 KiB After Width: | Height: | Size: 119 KiB |
|
Before Width: | Height: | Size: 208 KiB After Width: | Height: | Size: 149 KiB |
|
Before Width: | Height: | Size: 126 KiB After Width: | Height: | Size: 126 KiB |
|
Before Width: | Height: | Size: 87 KiB After Width: | Height: | Size: 87 KiB |
@@ -95,3 +95,24 @@ export const likeComment = (id, cid, t, type = 0) => {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 电台节目评论
|
||||||
|
* @param {number} id - 电台节目的 id
|
||||||
|
* @param {number} limit - 取出评论数量 , 默认为 20
|
||||||
|
* @param {number} offset - 偏移数量 , 用于分页 , 如 :( 评论页数 -1)*20, 其中 20 为 limit 的值
|
||||||
|
* @param {string} before - 分页参数,取上一页最后一项的 time 获取下一页数据(获取超过 5000 条评论的时候需要用到)
|
||||||
|
*/
|
||||||
|
export const commentDj = (id, limit, offset, before) => {
|
||||||
|
return axios({
|
||||||
|
method: "GET",
|
||||||
|
url: "/comment/dj",
|
||||||
|
params: {
|
||||||
|
id,
|
||||||
|
limit,
|
||||||
|
offset,
|
||||||
|
before,
|
||||||
|
timestamp: new Date().getTime(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|||||||
@@ -118,6 +118,20 @@ export const getDjProgram = (rid, limit = 50, offset = 0) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 电台 - 节目详情
|
||||||
|
* @param {string} id - 电台 的 id
|
||||||
|
*/
|
||||||
|
export const getDjProgramDetail = (id) => {
|
||||||
|
return axios({
|
||||||
|
method: "GET",
|
||||||
|
url: "/dj/program/detail",
|
||||||
|
params: {
|
||||||
|
id,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 电台 - 订阅
|
* 电台 - 订阅
|
||||||
* @param {number} rid - 电台 的 id
|
* @param {number} rid - 电台 的 id
|
||||||
|
|||||||
@@ -40,7 +40,7 @@
|
|||||||
class="loading-img"
|
class="loading-img"
|
||||||
:src="
|
:src="
|
||||||
type === 'mv'
|
type === 'mv'
|
||||||
? '/images/pic/video.png?assest'
|
? '/images/pic/video.jpg?assest'
|
||||||
: type === 'artist'
|
: type === 'artist'
|
||||||
? '/images/pic/artist.jpg?assest'
|
? '/images/pic/artist.jpg?assest'
|
||||||
: '/images/pic/album.jpg?assest'
|
: '/images/pic/album.jpg?assest'
|
||||||
|
|||||||
@@ -25,7 +25,7 @@
|
|||||||
>
|
>
|
||||||
<template #placeholder>
|
<template #placeholder>
|
||||||
<div class="cover-loading">
|
<div class="cover-loading">
|
||||||
<img class="loading-img" src="/images/pic/avatar.jpg?assest" alt="avatar" />
|
<img class="loading-img" src="/images/pic/avatar.png?assest" alt="avatar" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</n-image>
|
</n-image>
|
||||||
|
|||||||
@@ -79,13 +79,16 @@
|
|||||||
class="main-player"
|
class="main-player"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
v-show="!(pureLyricMode && isHasLrc)"
|
v-show="!(pureLyricMode && isHasLrc) || playMode === 'dj'"
|
||||||
:class="['content', { 'no-lrc': !isHasLrc || playMode === 'dj' }]"
|
:class="['content', { 'no-lrc': !isHasLrc || playMode === 'dj' }]"
|
||||||
>
|
>
|
||||||
<!-- 封面 -->
|
<!-- 封面 -->
|
||||||
<PlayerCover />
|
<PlayerCover />
|
||||||
<!-- 信息 -->
|
<!-- 信息 -->
|
||||||
<div v-show="playCoverType === 'cover' || !isHasLrc" :class="['data', playCoverType]">
|
<div
|
||||||
|
v-show="playCoverType === 'cover' || !isHasLrc || playMode === 'dj'"
|
||||||
|
:class="['data', playCoverType]"
|
||||||
|
>
|
||||||
<div class="desc">
|
<div class="desc">
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<span class="name">{{ music.getPlaySongData.name || "未知曲目" }}</span>
|
<span class="name">{{ music.getPlaySongData.name || "未知曲目" }}</span>
|
||||||
|
|||||||
@@ -94,7 +94,7 @@
|
|||||||
</n-icon>
|
</n-icon>
|
||||||
<!-- 更多操作 -->
|
<!-- 更多操作 -->
|
||||||
<n-dropdown
|
<n-dropdown
|
||||||
v-if="playMode !== 'dj' && !music.getPlaySongData?.path"
|
v-if="!music.getPlaySongData?.path"
|
||||||
:options="songMoreOptions"
|
:options="songMoreOptions"
|
||||||
:show-arrow="true"
|
:show-arrow="true"
|
||||||
placement="top-start"
|
placement="top-start"
|
||||||
@@ -415,6 +415,7 @@ const songMoreOptions = computed(() => [
|
|||||||
{
|
{
|
||||||
key: "add-pl",
|
key: "add-pl",
|
||||||
label: "添加到歌单",
|
label: "添加到歌单",
|
||||||
|
show: playMode.value !== "dj",
|
||||||
props: {
|
props: {
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
addPlaylistRef.value?.openAddToPlaylist(music.getPlaySongData?.id);
|
addPlaylistRef.value?.openAddToPlaylist(music.getPlaySongData?.id);
|
||||||
@@ -431,6 +432,7 @@ const songMoreOptions = computed(() => [
|
|||||||
path: "/comment",
|
path: "/comment",
|
||||||
query: {
|
query: {
|
||||||
id: music.getPlaySongData?.id,
|
id: music.getPlaySongData?.id,
|
||||||
|
type: playMode.value,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
@@ -440,7 +442,9 @@ const songMoreOptions = computed(() => [
|
|||||||
{
|
{
|
||||||
key: "mv",
|
key: "mv",
|
||||||
label: "观看 MV",
|
label: "观看 MV",
|
||||||
show: music.getPlaySongData?.mv && music.getPlaySongData?.mv !== 0 ? true : false,
|
show:
|
||||||
|
playMode.value !== "dj" &&
|
||||||
|
(music.getPlaySongData?.mv && music.getPlaySongData?.mv !== 0 ? true : false),
|
||||||
props: {
|
props: {
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
router.push({
|
router.push({
|
||||||
@@ -456,7 +460,7 @@ const songMoreOptions = computed(() => [
|
|||||||
{
|
{
|
||||||
key: "download",
|
key: "download",
|
||||||
label: "下载歌曲",
|
label: "下载歌曲",
|
||||||
show: music.getPlaySongData?.path ? false : true,
|
show: playMode.value !== "dj" && (music.getPlaySongData?.path ? false : true),
|
||||||
props: {
|
props: {
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
downloadSongRef.value?.openDownloadModal(music.getPlaySongData);
|
downloadSongRef.value?.openDownloadModal(music.getPlaySongData);
|
||||||
|
|||||||
@@ -122,12 +122,10 @@
|
|||||||
</n-icon>
|
</n-icon>
|
||||||
<!-- 评论 -->
|
<!-- 评论 -->
|
||||||
<n-icon
|
<n-icon
|
||||||
v-if="!music.getPlaySongData?.path && playMode !== 'dj'"
|
v-if="!music.getPlaySongData?.path"
|
||||||
class="hidden"
|
class="hidden"
|
||||||
size="22"
|
size="22"
|
||||||
@click.stop="
|
@click.stop="jumpToComment"
|
||||||
(showFullPlayer = false), router.push(`/comment?id=${music.getPlaySongData?.id}`)
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<SvgIcon icon="comment-text" />
|
<SvgIcon icon="comment-text" />
|
||||||
</n-icon>
|
</n-icon>
|
||||||
@@ -311,6 +309,18 @@ const controlEnter = () => {
|
|||||||
const controlMove = (e) => {
|
const controlMove = (e) => {
|
||||||
if (!e.target.closest(".slider")) e.stopPropagation();
|
if (!e.target.closest(".slider")) e.stopPropagation();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 跳转至评论
|
||||||
|
const jumpToComment = () => {
|
||||||
|
showFullPlayer.value = false;
|
||||||
|
router.push({
|
||||||
|
path: "/comment",
|
||||||
|
query: {
|
||||||
|
id: music.getPlaySongData?.id,
|
||||||
|
type: playMode.value,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<!-- 播放器 - 专辑封面 -->
|
<!-- 播放器 - 专辑封面 -->
|
||||||
<template>
|
<template>
|
||||||
<div :class="['cover', playCoverType, { playing: playState }]">
|
<div :class="['mian-cover', playCoverType, { playing: playState }]">
|
||||||
<!-- 指针 -->
|
<!-- 指针 -->
|
||||||
<img
|
<img
|
||||||
v-if="playCoverType === 'record'"
|
v-if="playCoverType === 'record'"
|
||||||
@@ -57,7 +57,7 @@ const { playState } = storeToRefs(status);
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.cover {
|
.mian-cover {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -66,7 +66,6 @@ const { playState } = storeToRefs(status);
|
|||||||
max-width: 55vh;
|
max-width: 55vh;
|
||||||
height: auto;
|
height: auto;
|
||||||
aspect-ratio: 1 / 1;
|
aspect-ratio: 1 / 1;
|
||||||
transform: scale(0.9);
|
|
||||||
transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
|
transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
|
||||||
.cover-img {
|
.cover-img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -208,9 +207,13 @@ const { playState } = storeToRefs(status);
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&.cover {
|
||||||
|
transform: scale(0.9);
|
||||||
&.playing {
|
&.playing {
|
||||||
transform: scale(1);
|
transform: scale(1);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 700px) {
|
@media (max-width: 700px) {
|
||||||
&.record {
|
&.record {
|
||||||
.pointer {
|
.pointer {
|
||||||
|
|||||||
@@ -57,13 +57,15 @@ export const initPlayer = async (playNow = false) => {
|
|||||||
if (playMode === "fm") music.playSongData = {};
|
if (playMode === "fm") music.playSongData = {};
|
||||||
// 在线歌曲
|
// 在线歌曲
|
||||||
if (!isLocalSong) {
|
if (!isLocalSong) {
|
||||||
// 获取歌曲信息
|
// 获取歌曲 ID
|
||||||
const { id } = playSongData;
|
let songId = playSongData?.id;
|
||||||
if (!id) return false;
|
if (!songId) return false;
|
||||||
|
// 若为电台模式
|
||||||
|
if (playMode === "dj") songId = music.getPlaySongData?.djId;
|
||||||
// 开启加载状态
|
// 开启加载状态
|
||||||
status.playLoading = true;
|
status.playLoading = true;
|
||||||
// 获取播放地址
|
// 获取播放地址
|
||||||
const url = await getNormalSongUrl(id, status, playNow);
|
const url = await getNormalSongUrl(songId, status, playNow);
|
||||||
// 正常播放地址
|
// 正常播放地址
|
||||||
if (url) {
|
if (url) {
|
||||||
status.playUseOtherSource = false;
|
status.playUseOtherSource = false;
|
||||||
@@ -91,7 +93,7 @@ export const initPlayer = async (playNow = false) => {
|
|||||||
// 下一曲
|
// 下一曲
|
||||||
else {
|
else {
|
||||||
if (playIndex !== playList.length - 1) {
|
if (playIndex !== playList.length - 1) {
|
||||||
changePlayIndex();
|
// changePlayIndex();
|
||||||
} else {
|
} else {
|
||||||
status.playLoading = false;
|
status.playLoading = false;
|
||||||
status.playState = false;
|
status.playState = false;
|
||||||
@@ -236,7 +238,7 @@ export const createPlayer = async (src, autoPlay = true) => {
|
|||||||
const audioDom = player._sounds[0]._node;
|
const audioDom = player._sounds[0]._node;
|
||||||
audioDom.crossOrigin = "anonymous";
|
audioDom.crossOrigin = "anonymous";
|
||||||
// 写入播放历史
|
// 写入播放历史
|
||||||
music.setPlayHistory(playSongData);
|
if (playMode !== "dj") music.setPlayHistory(playSongData);
|
||||||
// 生成音乐频谱
|
// 生成音乐频谱
|
||||||
// 由于浏览器安全策略,无法在此处启动
|
// 由于浏览器安全策略,无法在此处启动
|
||||||
if (showSpectrums && checkPlatform.electron()) processSpectrum(player);
|
if (showSpectrums && checkPlatform.electron()) processSpectrum(player);
|
||||||
|
|||||||
@@ -112,7 +112,8 @@ const formatData = (data, type = "playlist", noTracks = false) => {
|
|||||||
// dj
|
// dj
|
||||||
case "dj":
|
case "dj":
|
||||||
return {
|
return {
|
||||||
id: v.mainTrackId || v.id || v.vid,
|
id: v.id || v.vid,
|
||||||
|
djId: v.mainTrackId || v.id,
|
||||||
name: v.name,
|
name: v.name,
|
||||||
creator: v.dj,
|
creator: v.dj,
|
||||||
count: v.programCount,
|
count: v.programCount,
|
||||||
|
|||||||
@@ -11,7 +11,6 @@ const globalEvents = (router) => {
|
|||||||
// 显示播放器
|
// 显示播放器
|
||||||
electron.ipcRenderer.on("showPlayer", () => {
|
electron.ipcRenderer.on("showPlayer", () => {
|
||||||
const status = siteStatus();
|
const status = siteStatus();
|
||||||
if (status.playMode === "dj") return false;
|
|
||||||
status.showFullPlayer = true;
|
status.showFullPlayer = true;
|
||||||
});
|
});
|
||||||
// 播放或暂停
|
// 播放或暂停
|
||||||
|
|||||||
@@ -18,7 +18,7 @@
|
|||||||
>
|
>
|
||||||
<template #placeholder>
|
<template #placeholder>
|
||||||
<div class="cover-loading">
|
<div class="cover-loading">
|
||||||
<img class="loading-img" src="/images/pic/avatar.jpg?assest" alt="avatar" />
|
<img class="loading-img" src="/images/pic/avatar.png?assest" alt="avatar" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</n-image>
|
</n-image>
|
||||||
|
|||||||
@@ -32,7 +32,7 @@
|
|||||||
</n-image>
|
</n-image>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="name">{{ songDetail?.name || "未知曲目" }}</div>
|
<div class="name">{{ songDetail?.name || "未知曲目" }}</div>
|
||||||
<div class="artist">
|
<div v-if="commentType === 'normal'" class="artist">
|
||||||
<n-icon depth="3" size="20">
|
<n-icon depth="3" size="20">
|
||||||
<SvgIcon icon="account-music" />
|
<SvgIcon icon="account-music" />
|
||||||
</n-icon>
|
</n-icon>
|
||||||
@@ -45,6 +45,14 @@
|
|||||||
<span class="ar"> {{ songDetail?.artists || "未知艺术家" }} </span>
|
<span class="ar"> {{ songDetail?.artists || "未知艺术家" }} </span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-else-if="songDetail?.creator" class="artist dj">
|
||||||
|
<n-icon depth="3" size="20">
|
||||||
|
<SvgIcon icon="record" />
|
||||||
|
</n-icon>
|
||||||
|
<span class="all-ar dj-name">
|
||||||
|
{{ songDetail.creator?.brand || "未知电台" }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</n-card>
|
</n-card>
|
||||||
</Transition>
|
</Transition>
|
||||||
@@ -86,7 +94,8 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
import { getSongDetail } from "@/api/song";
|
import { getSongDetail } from "@/api/song";
|
||||||
import { getComment, getHotComment } from "@/api/comment";
|
import { getDjProgramDetail } from "@/api/dj";
|
||||||
|
import { getComment, getHotComment, commentDj } from "@/api/comment";
|
||||||
import formatData from "@/utils/formatData";
|
import formatData from "@/utils/formatData";
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -94,6 +103,9 @@ const router = useRouter();
|
|||||||
// 歌曲 id
|
// 歌曲 id
|
||||||
const songId = ref(router.currentRoute.value.query.id);
|
const songId = ref(router.currentRoute.value.query.id);
|
||||||
|
|
||||||
|
// 评论类型
|
||||||
|
const commentType = ref(router.currentRoute.value.query.type || "normal");
|
||||||
|
|
||||||
// 歌曲信息
|
// 歌曲信息
|
||||||
const songDetail = ref(null);
|
const songDetail = ref(null);
|
||||||
|
|
||||||
@@ -105,9 +117,15 @@ const hotCommentData = ref(null);
|
|||||||
// 获取歌曲详情
|
// 获取歌曲详情
|
||||||
const getSongDetailData = async (id) => {
|
const getSongDetailData = async (id) => {
|
||||||
try {
|
try {
|
||||||
|
if (commentType.value === "normal") {
|
||||||
const detail = await getSongDetail(id);
|
const detail = await getSongDetail(id);
|
||||||
const data = formatData(detail?.songs?.[0], "song");
|
const data = formatData(detail?.songs?.[0], "song");
|
||||||
songDetail.value = data?.[0] ?? null;
|
songDetail.value = data?.[0] ?? null;
|
||||||
|
} else if (commentType.value === "dj") {
|
||||||
|
const detail = await getDjProgramDetail(id);
|
||||||
|
const data = formatData(detail?.program, "dj");
|
||||||
|
songDetail.value = data?.[0] ?? null;
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("获取歌曲详情失败:", error);
|
console.error("获取歌曲详情失败:", error);
|
||||||
}
|
}
|
||||||
@@ -120,6 +138,7 @@ const getCommentData = async (id, pageNo = 1, sortType = 3, pageSize = 20) => {
|
|||||||
const cursor =
|
const cursor =
|
||||||
pageNo !== 1 && commentData.value?.cursor !== "0" ? commentData.value.cursor : null;
|
pageNo !== 1 && commentData.value?.cursor !== "0" ? commentData.value.cursor : null;
|
||||||
// 获取热门评论和普通评论
|
// 获取热门评论和普通评论
|
||||||
|
if (commentType.value === "normal") {
|
||||||
const [hotComments, comments] = await Promise.all([
|
const [hotComments, comments] = await Promise.all([
|
||||||
pageNo === 1 ? getHotComment(id, 0, 10) : null,
|
pageNo === 1 ? getHotComment(id, 0, 10) : null,
|
||||||
getComment(id, 0, pageNo, sortType, pageSize, cursor),
|
getComment(id, 0, pageNo, sortType, pageSize, cursor),
|
||||||
@@ -128,6 +147,15 @@ const getCommentData = async (id, pageNo = 1, sortType = 3, pageSize = 20) => {
|
|||||||
if (comments?.data.totalCount === 0) return (commentData.value = "empty");
|
if (comments?.data.totalCount === 0) return (commentData.value = "empty");
|
||||||
commentData.value = comments?.data;
|
commentData.value = comments?.data;
|
||||||
hotCommentData.value = hotComments?.hotComments?.[0] ? hotComments.hotComments : "no-comment";
|
hotCommentData.value = hotComments?.hotComments?.[0] ? hotComments.hotComments : "no-comment";
|
||||||
|
} else if (commentType.value === "dj") {
|
||||||
|
const offset = (pageNo - 1) * pageSize;
|
||||||
|
const { hotComments, comments, total } = await commentDj(id, pageSize, offset, cursor);
|
||||||
|
// 更新数据
|
||||||
|
if (total === 0) return (commentData.value = "empty");
|
||||||
|
commentData.value = { totalCount: comments?.length, comments };
|
||||||
|
hotCommentData.value = hotComments?.[0] ? hotComments : "no-comment";
|
||||||
|
console.log(commentData.value, hotCommentData.value);
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("获取评论数据出错:", error);
|
console.error("获取评论数据出错:", error);
|
||||||
$message.error("获取评论数据出错");
|
$message.error("获取评论数据出错");
|
||||||
|
|||||||
@@ -34,7 +34,7 @@
|
|||||||
<div class="creator">
|
<div class="creator">
|
||||||
<n-avatar
|
<n-avatar
|
||||||
:src="(djDetail.creator?.avatarUrl + '?param=300y$300').replace(/^http:/, 'https:')"
|
:src="(djDetail.creator?.avatarUrl + '?param=300y$300').replace(/^http:/, 'https:')"
|
||||||
fallback-src="/images/pic/avatar.jpg?assest"
|
fallback-src="/images/pic/avatar.png?assest"
|
||||||
round
|
round
|
||||||
/>
|
/>
|
||||||
<n-text class="nickname">{{ djDetail.creator?.nickname || "未知创建者" }}</n-text>
|
<n-text class="nickname">{{ djDetail.creator?.nickname || "未知创建者" }}</n-text>
|
||||||
|
|||||||
@@ -39,7 +39,7 @@
|
|||||||
:src="
|
:src="
|
||||||
(playListDetail.creator?.avatarUrl + '?param=300y$300').replace(/^http:/, 'https:')
|
(playListDetail.creator?.avatarUrl + '?param=300y$300').replace(/^http:/, 'https:')
|
||||||
"
|
"
|
||||||
fallback-src="/images/pic/avatar.jpg?assest"
|
fallback-src="/images/pic/avatar.png?assest"
|
||||||
round
|
round
|
||||||
/>
|
/>
|
||||||
<n-text class="nickname">{{ playListDetail.creator?.nickname || "未知创建者" }}</n-text>
|
<n-text class="nickname">{{ playListDetail.creator?.nickname || "未知创建者" }}</n-text>
|
||||||
|
|||||||
@@ -174,7 +174,7 @@
|
|||||||
>
|
>
|
||||||
<template #placeholder>
|
<template #placeholder>
|
||||||
<div class="cover-loading">
|
<div class="cover-loading">
|
||||||
<img class="loading-img" src="/images/pic/avatar.jpg?assest" alt="song" />
|
<img class="loading-img" src="/images/pic/avatar.png?assest" alt="song" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</n-image>
|
</n-image>
|
||||||
|
|||||||