feat: auto select medals and improve navigation

frontend_nuxt/components/AchievementList.vue

@@ -3,7 +3,7 @@
     <div
       v-for="medal in sortedMedals"
       :key="medal.type"
-      :class="['achievements-list-item', { select: medal.selected, clickable: canSelect }]"
+      :class="['achievements-list-item', { select: medal.selected && canSelect, clickable: canSelect }]"
       @click="selectMedal(medal)"
     >
       <img
@@ -11,7 +11,7 @@
         :alt="medal.title"
         :class="['achievements-list-item-icon', { not_completed: !medal.completed }]"
       />
-      <div v-if="medal.selected" class="achievements-list-item-top-right-label">展示</div>
+      <div v-if="medal.selected && canSelect" class="achievements-list-item-top-right-label">展示</div>
       <div class="achievements-list-item-title">{{ medal.title }}</div>
       <div class="achievements-list-item-description">
         {{ medal.description }}

frontend_nuxt/components/CommentItem.vue

@@ -11,7 +11,11 @@
       <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>
+          <router-link
+            v-if="comment.medal"
+            class="medal-name"
+            :to="`/users/${comment.userId}?tab=achievements`"
+          >{{ getMedalTitle(comment.medal) }}</router-link>
           <span v-if="level >= 2">
             <i class="fas fa-reply reply-icon"></i>
             <span class="user-name reply-user-name">{{ comment.parentUserName }}</span>
@@ -289,6 +293,7 @@ export default CommentItem
   font-size: 12px;
   margin-left: 4px;
   opacity: 0.6;
+  cursor: pointer;
 }
 
 @keyframes highlight {