feat: add user medal selection and display

This commit is contained in:
Tim
2025-08-10 00:13:54 +08:00
parent 6aedec7a9b
commit 041496cf98
14 changed files with 202 additions and 20 deletions

View File

@@ -11,6 +11,7 @@
<div class="common-info-content-header">
<div class="info-content-header-left">
<span class="user-name">{{ comment.userName }}</span>
<span v-if="comment.medal" class="medal-name">{{ getMedalTitle(comment.medal) }}</span>
<span v-if="level >= 2">
<i class="fas fa-reply reply-icon"></i>
<span class="user-name reply-user-name">{{ comment.parentUserName }}</span>
@@ -64,6 +65,7 @@ import VueEasyLightbox from 'vue-easy-lightbox'
import { useRouter } from 'vue-router'
import CommentEditor from './CommentEditor.vue'
import { renderMarkdown, handleMarkdownClick } from '../utils/markdown'
import { getMedalTitle } from '../utils/medal'
import TimeManager from '../utils/time'
import BaseTimeline from './BaseTimeline.vue'
import { API_BASE_URL, toast } from '../main'
@@ -232,7 +234,7 @@ const CommentItem = {
lightboxVisible.value = true
}
}
return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, copyCommentLink, renderMarkdown, isWaitingForReply, commentMenuItems, deleteComment, lightboxVisible, lightboxIndex, lightboxImgs, handleContentClick, loggedIn, replyCount, replyList }
return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, copyCommentLink, renderMarkdown, isWaitingForReply, commentMenuItems, deleteComment, lightboxVisible, lightboxIndex, lightboxImgs, handleContentClick, loggedIn, replyCount, replyList, getMedalTitle }
}
}
@@ -283,6 +285,12 @@ export default CommentItem
opacity: 0.3;
}
.medal-name {
font-size: 12px;
margin-left: 4px;
opacity: 0.6;
}
@keyframes highlight {
from {
background-color: yellow;