From 28a5f451ca6b9baefd2e8ec7c8bbbca5eb5a274e Mon Sep 17 00:00:00 2001
From: ikmkj <1@qq,com>
Date: Mon, 28 Jul 2025 23:47:42 +0800
Subject: [PATCH] =?UTF-8?q?feat(PlaylistDetail):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E8=AF=84=E8=AE=BA=E6=95=B0=E6=98=BE=E7=A4=BA=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在获取评论列表时，将评论总数更新到 playlist 对象中
- 添加 formattedCommentCount 计算属性，用于格式化评论数显示
- 在评论数大于 99 时显示为 "99+"，避免数字过长
- 更新模板中评论数的显示，使用 formattedCommentCount 替代原始值
---
 music-qianduan/src/views/PlaylistDetail.vue | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/music-qianduan/src/views/PlaylistDetail.vue b/music-qianduan/src/views/PlaylistDetail.vue
index 7762538..1c11f1a 100644
--- a/music-qianduan/src/views/PlaylistDetail.vue
+++ b/music-qianduan/src/views/PlaylistDetail.vue
@@ -117,6 +117,9 @@ const fetchComments = async () => {
     const res = await getCommentList(playlistId.value, 2, 1, 20) // targetType 2 表示歌单
     if (res.code === 200) {
       comments.value = res.data.list || res.data.records || []
+      if (playlist.value && res.data.total !== undefined) {
+        playlist.value.commentCount = res.data.total
+      }
     } else {
       ElMessage.error(res.message || '获取评论列表失败')
     }
@@ -396,6 +399,17 @@ const formatTime = (seconds) => {
   return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`
 }
 
+// 格式化评论数
+const formattedCommentCount = computed(() => {
+  if (!playlist.value || playlist.value.commentCount === undefined) {
+    return 0;
+  }
+  if (playlist.value.commentCount > 99) {
+    return '99+';
+  }
+  return playlist.value.commentCount;
+});
+
 // 格式化播放次数
 const formatPlayCount = (count) => {
   if (count < 10000) {
@@ -525,7 +539,7 @@ onUnmounted(() => {
           <div class="playlist-stats">
             <span>收藏数：{{ playlist.collectCount }}</span>
             <el-divider direction="vertical" />
-            <span>评论数：{{ playlist.commentCount }}</span>
+            <span>评论数：{{ formattedCommentCount }}</span>
           </div>
           <div class="playlist-desc">{{ playlist.description }}</div>
 
@@ -569,7 +583,7 @@ onUnmounted(() => {
           />
         </el-tab-pane>
 
-        <el-tab-pane :label="`评论(${playlist.commentCount || 0})`">
+        <el-tab-pane :label="`评论(${formattedCommentCount})`">
           <!-- 评论输入框 -->
           <div class="comment-input">
             <el-input