Return category and tag change logs as DTOs

feat: expand post change log details

backend/src/main/java/com/openisle/dto/PostChangeLogDto.java

@@ -5,6 +5,7 @@ import lombok.Getter;
 import lombok.Setter;
 
 import java.time.LocalDateTime;
+import java.util.List;
 
 @Getter
 @Setter
@@ -18,10 +19,10 @@ public class PostChangeLogDto {
     private String newTitle;
     private String oldContent;
     private String newContent;
-    private String oldCategory;
-    private String newCategory;
-    private String oldTags;
-    private String newTags;
+    private CategoryDto oldCategory;
+    private CategoryDto newCategory;
+    private List<TagDto> oldTags;
+    private List<TagDto> newTags;
     private Boolean oldClosed;
     private Boolean newClosed;
     private LocalDateTime oldPinnedAt;

backend/src/main/java/com/openisle/mapper/PostChangeLogMapper.java

@@ -1,11 +1,28 @@
 package com.openisle.mapper;
 
+import com.openisle.dto.CategoryDto;
 import com.openisle.dto.PostChangeLogDto;
+import com.openisle.dto.TagDto;
 import com.openisle.model.*;
+import com.openisle.repository.CategoryRepository;
+import com.openisle.repository.TagRepository;
+import lombok.RequiredArgsConstructor;
 import org.springframework.stereotype.Component;
 
+import java.util.Arrays;
+import java.util.Collections;
+import java.util.List;
+import java.util.stream.Collectors;
+
 @Component
+@RequiredArgsConstructor
 public class PostChangeLogMapper {
+
+    private final CategoryRepository categoryRepository;
+    private final TagRepository tagRepository;
+    private final CategoryMapper categoryMapper;
+    private final TagMapper tagMapper;
+
     public PostChangeLogDto toDto(PostChangeLog log) {
         PostChangeLogDto dto = new PostChangeLogDto();
         dto.setId(log.getId());
@@ -22,11 +39,11 @@ public class PostChangeLogMapper {
             dto.setOldContent(c.getOldContent());
             dto.setNewContent(c.getNewContent());
         } else if (log instanceof PostCategoryChangeLog cat) {
-            dto.setOldCategory(cat.getOldCategory());
-            dto.setNewCategory(cat.getNewCategory());
+            dto.setOldCategory(mapCategory(cat.getOldCategory()));
+            dto.setNewCategory(mapCategory(cat.getNewCategory()));
         } else if (log instanceof PostTagChangeLog tag) {
-            dto.setOldTags(tag.getOldTags());
-            dto.setNewTags(tag.getNewTags());
+            dto.setOldTags(mapTags(tag.getOldTags()));
+            dto.setNewTags(mapTags(tag.getNewTags()));
         } else if (log instanceof PostClosedChangeLog cl) {
             dto.setOldClosed(cl.isOldClosed());
             dto.setNewClosed(cl.isNewClosed());
@@ -39,4 +56,37 @@ public class PostChangeLogMapper {
         }
         return dto;
     }
+
+    private CategoryDto mapCategory(String name) {
+        if (name == null) {
+            return null;
+        }
+        return categoryRepository.findByName(name)
+                .map(categoryMapper::toDto)
+                .orElseGet(() -> {
+                    CategoryDto dto = new CategoryDto();
+                    dto.setName(name);
+                    return dto;
+                });
+    }
+
+    private List<TagDto> mapTags(String tags) {
+        if (tags == null || tags.isBlank()) {
+            return Collections.emptyList();
+        }
+        return Arrays.stream(tags.split(","))
+                .map(String::trim)
+                .map(this::mapTag)
+                .collect(Collectors.toList());
+    }
+
+    private TagDto mapTag(String name) {
+        return tagRepository.findByName(name)
+                .map(tagMapper::toDto)
+                .orElseGet(() -> {
+                    TagDto dto = new TagDto();
+                    dto.setName(name);
+                    return dto;
+                });
+    }
 }

backend/src/main/java/com/openisle/repository/CategoryRepository.java

@@ -4,7 +4,10 @@ import com.openisle.model.Category;
 import org.springframework.data.jpa.repository.JpaRepository;
 
 import java.util.List;
+import java.util.Optional;
 
 public interface CategoryRepository extends JpaRepository<Category, Long> {
     List<Category> findByNameContainingIgnoreCase(String keyword);
+
+    Optional<Category> findByName(String name);
 }

backend/src/main/java/com/openisle/repository/TagRepository.java

@@ -6,6 +6,7 @@ import org.springframework.data.jpa.repository.JpaRepository;
 import org.springframework.data.domain.Pageable;
 
 import java.util.List;
+import java.util.Optional;
 
 public interface TagRepository extends JpaRepository<Tag, Long> {
     List<Tag> findByNameContainingIgnoreCase(String keyword);
@@ -15,4 +16,6 @@ public interface TagRepository extends JpaRepository<Tag, Long> {
 
     List<Tag> findByCreatorOrderByCreatedAtDesc(User creator, Pageable pageable);
     List<Tag> findByCreator(User creator);
+
+    Optional<Tag> findByName(String name);
 }

frontend_nuxt/components/PostChangeLogItem.vue

@@ -6,26 +6,27 @@
         class="change-log-avatar"
         :src="log.userAvatar"
         alt="avatar"
+        @click="() => navigateTo(`/users/${log.username}`)"
       />
       <span v-if="log.username" class="change-log-user">{{ log.username }}</span>
-      <span v-if="log.type === 'CONTENT'">变更了文章内容</span>
-      <span v-else-if="log.type === 'TITLE'">变更了文章标题</span>
-      <span v-else-if="log.type === 'CATEGORY'">变更了文章分类</span>
-      <span v-else-if="log.type === 'TAG'">变更了文章标签</span>
-      <span v-else-if="log.type === 'CLOSED'">
+      <span v-if="log.type === 'CONTENT'" class="change-log-content">变更了文章内容</span>
+      <span v-else-if="log.type === 'TITLE'" class="change-log-content">变更了文章标题</span>
+      <span v-else-if="log.type === 'CATEGORY'" class="change-log-content">变更了文章分类</span>
+      <span v-else-if="log.type === 'TAG'" class="change-log-content">变更了文章标签</span>
+      <span v-else-if="log.type === 'CLOSED'" class="change-log-content">
         <template v-if="log.newClosed">关闭了文章</template>
         <template v-else>重新打开了文章</template>
       </span>
-      <span v-else-if="log.type === 'PINNED'">
+      <span v-else-if="log.type === 'PINNED'" class="change-log-content">
         <template v-if="log.newPinnedAt">置顶了文章</template>
-        <template v-else>取消置顶了文章</template>
+        <template v-else>取消置顶文章</template>
       </span>
-      <span v-else-if="log.type === 'FEATURED'">
+      <span v-else-if="log.type === 'FEATURED'" class="change-log-content">
         <template v-if="log.newFeatured">将文章设为精选</template>
         <template v-else>取消精选文章</template>
       </span>
-      <span v-else-if="log.type === 'VOTE_RESULT'">投票已出结果</span>
-      <span v-else-if="log.type === 'LOTTERY_RESULT'">抽奖已开奖</span>
+      <span v-else-if="log.type === 'VOTE_RESULT'" class="change-log-content">投票已出结果</span>
+      <span v-else-if="log.type === 'LOTTERY_RESULT'" class="change-log-content">抽奖已开奖</span>
     </div>
     <div class="change-log-time">{{ log.time }}</div>
     <div
@@ -43,6 +44,7 @@ import { createTwoFilesPatch } from 'diff'
 import { useIsMobile } from '~/utils/screen'
 import 'diff2html/bundles/css/diff2html.min.css'
 import BaseImage from '~/components/BaseImage.vue'
+import { navigateTo } from 'nuxt/app'
 const props = defineProps({
   log: Object,
   title: String,
@@ -81,8 +83,8 @@ const diffHtml = computed(() => {
 .change-log-container {
   display: flex;
   flex-direction: column;
+  /* padding-top: 5px; */
   /* padding-bottom: 30px; */
-  opacity: 0.7;
   font-size: 14px;
 }
 .change-log-text {
@@ -93,11 +95,18 @@ const diffHtml = computed(() => {
   font-weight: bold;
   margin-right: 4px;
 }
+
+.change-log-user,
+.change-log-content {
+  opacity: 0.7;
+}
+
 .change-log-avatar {
   width: 20px;
   height: 20px;
   border-radius: 50%;
   margin-right: 4px;
+  cursor: pointer;
 }
 .change-log-time {
   font-size: 12px;