分类查询显示

珞珈岛-项目相关文件/luojia-island/service/src/main/resources/application-local.yaml

@@ -1,20 +1,20 @@
-lj:
-  db:
-    host: 192.168.59.129
-    password: Forely123!
-  redis:
-    host: 192.168.59.129
-    port: 6379
-    password: Forely123!
-  rabbitmq:
-    host: 192.168.59.129
-    port: 5672
-    username: admin
-    password: Forely123!
-  minio:
-    endpoint: http://192.168.59.129:9000
-    accessKey: forely
-    secretKey: Forely123!
+#lj:
+#  db:
+#    host: 192.168.59.129
+#    password: Forely123!
+#  redis:
+#    host: 192.168.59.129
+#    port: 6379
+#    password: Forely123!
+#  rabbitmq:
+#    host: 192.168.59.129
+#    port: 5672
+#    username: admin
+#    password: Forely123!
+#  minio:
+#    endpoint: http://192.168.59.129:9000
+#    accessKey: forely
+#    secretKey: Forely123!
 
 #lj:
 #  db:
@@ -34,20 +34,20 @@ lj:
 #    accessKey: minio_admin
 #    secretKey: Minio@1234
 
-#lj:
-#  db:
-#    host: localhost
-#    password: 123456
-#  redis:
-#    host: localhost
-#    port: 6379
-#    password: 123456
-#  rabbitmq:
-#    host: localhost
-#    port: 5672
-#    username: guest
-#    password: guest
-#  minio:
-#    endpoint: http://localhost:9005
-#    accessKey: leezt
-#    secretKey: lzt264610
+lj:
+  db:
+    host: localhost
+    password: 123456
+  redis:
+    host: localhost
+    port: 6379
+    password: 123456
+  rabbitmq:
+    host: localhost
+    port: 5672
+    username: guest
+    password: guest
+  minio:
+    endpoint: http://localhost:9005
+    accessKey: leezt
+    secretKey: lzt264610

珞珈岛-项目相关文件/luojia-island/vue-frontend/src/components/PostPage.vue

@@ -16,7 +16,7 @@
         <!-- 右侧帖子列表 -->
         <div class="post-list">
             <div
-                v-for="(post, index) in filteredPosts"
+                v-for="(post, index) in postListStore.posts"
                 :key="index"
                 class="post-item"
                 @click="goToPostDetail(post.id)"
@@ -37,26 +37,30 @@
 </template>
 
 <script setup lang="js" name="PostPage">
-import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
+import { ref, onMounted, onUnmounted, watch } from 'vue';
 import { useRouter } from 'vue-router';
 import { usePostListStore } from '@/stores/postlist.js';
 
-const categories = ref(['全部', '学习', '娱乐', '二手交易']);
+// 分类名与id映射
+const categoryMap = [
+  { name: '全部', id: null },
+  { name: '校园活动', id: 1 },
+  { name: '学习', id: 2 },
+  { name: '娱乐', id: 3 },
+  { name: '二手交易', id: 4 }
+];
+const categories = ref(categoryMap.map(item => item.name));
 const selectedCategory = ref('全部');
 const postListStore = usePostListStore();
 const router = useRouter();
 
-// 计算属性，动态筛选
-const filteredPosts = computed(() => {
-  if (selectedCategory.value === '全部') return postListStore.posts;
-  return postListStore.posts.filter(post => post.category === selectedCategory.value);
-});
-
 // 分类切换
-const selectCategory = async (category) => {
-  selectedCategory.value = category;
+const selectCategory = async (categoryName) => {
+  selectedCategory.value = categoryName;
   postListStore.resetList();
-  await postListStore.getList({});
+  // 找到对应的id
+  const categoryObj = categoryMap.find(item => item.name === categoryName);
+  await postListStore.getList(categoryObj ? categoryObj.id : null);
 };
 
 // 跳转详情
@@ -72,13 +76,14 @@ const handleScroll = async () => {
     !postListStore.loading &&
     !postListStore.finished
   ) {
-    await postListStore.getList({});
+    const categoryObj = categoryMap.find(item => item.name === selectedCategory.value);
+    await postListStore.getList(categoryObj ? categoryObj.id : null);
   }
 };
 
 onMounted(async () => {
   // 首次加载
-  await postListStore.getList({});
+  await postListStore.getList();
   window.addEventListener('scroll', handleScroll);
 });
 

珞珈岛-项目相关文件/luojia-island/vue-frontend/src/stores/postlist.js

@@ -11,36 +11,22 @@ export const usePostListStore = defineStore('postList', {
     offset: 0, // 偏移量
     loading: false, // 加载状态
     finished: false, // 是否加载完全部
+    currentCategory: null, // 当前分类id
   }),
   actions: {
-    setPosts(posts) {
-      this.posts = posts;
-    },
-    setTotal(total) {
-      this.total = total;
-    },
-    setPage(page) {
-      this.page = page;
-    },
-    setPageSize(pageSize) {
-      this.pageSize = pageSize;
-    },
-    addPost(post) {
-      this.posts.push(post);
-      this.total += 1; // 更新总数
-    },
-    removePost(postId) {
-      this.posts = this.posts.filter(post => post.id !== postId);
-      this.total -= 1; // 更新总数
-    },
-    async getList() {
+    async getList(categoryId = null) {
       if (this.loading || this.finished) return;
       this.loading = true;
+      // 记录当前分类
+      this.currentCategory = categoryId;
       try {
         // 保证 lastVal 不为 null
         const lastVal = (typeof this.lastVal === 'number' && this.lastVal > 0) ? this.lastVal : Date.now();
         // 拼接参数到URL
-        const url = `/post/list?lastVal=${lastVal}&offset=${this.offset}&size=${this.pageSize}`;
+        let url = `/post/list?lastVal=${lastVal}&offset=${this.offset}&size=${this.pageSize}`;
+        if(categoryId!== null) {
+          url += `&categoryId=${categoryId}`;
+        }
         const res = await request.get(url);
         if (res.code === 200) {
           const { records, lastVal: newLastVal, offset: newOffset, size: newSize } = res.data;
@@ -55,7 +41,7 @@ export const usePostListStore = defineStore('postList', {
               viewCount: post.viewCount || 0,
               likes: post.likeCount || 0,
               comments: post.commentCount || 0,
-              category: post.category || '全部',
+              categoryId: post.categoryId,
               createTime: post.createTime,
               userName: post.userName,
             }));

珞珈岛-项目相关文件/luojia-island/vue-frontend/src/views/PostPublish.vue

@@ -79,9 +79,10 @@ export default {
     const router = useRouter()
     const submitting = ref(false)
     const categories = ref([
-      { id: 1, name: '学习' },
-      { id: 2, name: '娱乐' },
-      { id: 3, name: '二手交易' }
+      { id: 1, name: '校园活动' },
+      { id: 2, name: '学习' },
+      { id: 3, name: '娱乐' },
+      { id: 4, name: '二手交易' }
     ])
     const form = ref({
       title: '',