添加推荐接口及优化评论、笔记、标签等组件显示

This commit is contained in:
2024-12-27 08:30:27 +08:00
parent dc43a2d40b
commit 10ab6380c4
8 changed files with 234 additions and 68 deletions
+34 -18
View File
@@ -10,8 +10,8 @@
<div style="margin-right: 5px;">
{{ comment.nickName }}
</div>
<div v-if="comment.parentId" class="reply-to"></div>
<div v-if="comment.parentId" class="reply-to-username">{{ comment.replyNickName }}</div>
<!-- <div v-if="comment.parentId" class="reply-to"></div>
<div v-if="comment.parentId" class="reply-to-username">{{ comment.replyNickName }}</div> -->
</div>
</div>
<div class="user-details">
@@ -21,21 +21,26 @@
<span class="ip-address">IP: {{ comment.address?comment.address:'未知' }}</span>
</div>
</div>
<!-- <div v-if="comment.replies && comment.replies.length" class="replies">
<div v-for="reply in comment.replies" :key="reply.id" class="reply-item">
<div v-if="comment.daList && comment.daList.length" class="replies">
<div v-for="reply in comment.daList" :key="reply.id" class="reply-item">
<div class="user-info">
<img :src="reply.avatar" alt="回复用户昵称" class="avatar">
<div class="user-details">
<div class="username">回复 {{ reply.username }}</div>
<div class="comment-content">{{ reply.content }}</div>
<div class="comment-info">
<span class="comment-time">{{ reply.time }}</span>
<span class="ip-address">IP: {{ reply.ipAddress }}</span>
<!-- <img :src="reply.avatar" alt="" class="avatar"> -->
<image-preview :src="reply.avatar" :width="25" :height="25" />
<div class="">
<div class="username">
<span>{{ reply.nickName }}</span>
<div class="reply-to"></div>
<span>{{ reply.replyNickName }}</span>
</div>
<div class="comment-content" style="margin-left: 10px;">{{ reply.content }}</div>
<div class="comment-info" style="margin-left: 10px;">
<span class="comment-time">{{ reply.createTime }}</span>
<span class="ip-address">IP: {{ reply.address?reply.address:'未知' }}</span>
</div>
</div>
</div>
</div>
</div> -->
</div>
</div>
</div>
<pagination v-show="total > 0" id="table_page" :total="total" v-model:page="queryParams.pageNum"
@@ -113,13 +118,15 @@ const getCommentList = async () => {
.reply-to {
width: 0;
height: 0;
margin-top: 5px;
border-top: 6px solid transparent;
/* 上边框透明 */
border-bottom: 6px solid transparent;
/* 下边框透明 */
border-left: 6px solid #999;
/* 左边框为箭头颜色,这里设为黑色,可按需更改 */
margin: 0px 8px;
margin-top: 5px;
}
.reply-to-username {
@@ -130,12 +137,12 @@ const getCommentList = async () => {
.user-details {
margin-left: 35px;
}
.comment-content {
color: #000;
font-size: 16px;
padding: 3px 0px;
}
.comment-content {
color: #000;
font-size: 16px;
padding: 3px 0px;
}
}
}
@@ -145,6 +152,15 @@ const getCommentList = async () => {
margin-left: 15px;
}
.replies {
margin-left: 35px;
.reply-item {
margin-top: 5px;
padding: 5px 0px;
}
}
#table_page {
height: 50px !important;
margin-top: 10px !important;