From 86407c16a2d6380ec69457f979688907d6152301 Mon Sep 17 00:00:00 2001
From: anghunk <anghunk@gmail.com>
Date: Tue, 20 Jan 2026 11:34:29 +0800
Subject: [PATCH] =?UTF-8?q?feat(CommentsView):=20=E5=B0=86=E6=96=87?=
 =?UTF-8?q?=E7=AB=A0=E9=93=BE=E6=8E=A5=E6=94=B9=E4=B8=BA=E5=8F=AF=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB=E5=B9=B6=E8=B0=83=E6=95=B4=E8=A1=A8=E6=A0=BC=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将文章slug从普通文本改为可点击链接
- 调整表格列宽和内容布局
- 增加链接悬停效果和内容间距
---
 cwd-comments-admin/src/views/CommentsView.vue | 28 +++++++++++++++----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/cwd-comments-admin/src/views/CommentsView.vue b/cwd-comments-admin/src/views/CommentsView.vue
index 7558a68..6785827 100644
--- a/cwd-comments-admin/src/views/CommentsView.vue
+++ b/cwd-comments-admin/src/views/CommentsView.vue
@@ -45,9 +45,14 @@
             <div class="cell-content-text">{{ item.contentText }}</div>
           </div>
           <div class="table-cell table-cell-path">
-            <span class="cell-path" :title="item.postSlug">{{ item.postSlug }}</span>
+            <a
+              :href="item.postSlug"
+              target="_blank"
+              class="cell-path"
+              :title="item.postSlug"
+              >{{ item.postSlug }}</a
+            >
           </div>
-
           <div class="table-cell table-cell-status">
             <span class="cell-status" :class="`cell-status-${item.status}`">
               {{ formatStatus(item.status) }}
@@ -291,6 +296,7 @@ onMounted(() => {
   color: #24292f;
   display: flex;
   align-items: center;
+  box-sizing: border-box;
 }
 
 .table-cell-id {
@@ -300,17 +306,20 @@ onMounted(() => {
 }
 
 .table-cell-author {
-  width: 180px;
+  width: 220px;
   flex-shrink: 0;
 }
 
 .table-cell-content {
+  flex-direction: column;
   flex: 1;
+  align-items: flex-start !important;
+  justify-content: center;
   min-width: 200px;
 }
 
 .table-cell-path {
-  width: 160px;
+  width: 240px;
   flex-shrink: 0;
 }
 
@@ -320,7 +329,7 @@ onMounted(() => {
 }
 
 .table-cell-status {
-  width: 80px;
+  width: 100px;
   flex-shrink: 0;
   justify-content: center;
   align-items: center;
@@ -331,6 +340,7 @@ onMounted(() => {
   flex-shrink: 0;
   justify-content: flex-start;
   align-items: center;
+  width: 250px;
 }
 
 .table-header .table-cell {
@@ -362,14 +372,20 @@ onMounted(() => {
   line-height: 1.5;
   white-space: pre-wrap;
   word-break: break-word;
+  margin-bottom: 5px;
 }
 
 .cell-path {
   font-size: 12px;
-  color: #57606a;
+  color: #2774cb;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  text-decoration: none;
+}
+
+.cell-path:hover {
+  text-decoration: underline;
 }
 
 .cell-time {