From 3b0ec518a0f89b8864e4bbdf7073d3d84861b0f7 Mon Sep 17 00:00:00 2001
From: xuan <3142316616@qq.com>
Date: Tue, 17 Dec 2024 00:00:17 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E7=99=BB=E5=BD=95=E6=8E=A5=E5=8F=A3?=
 =?UTF-8?q?=E5=AE=8C=E6=88=90=EF=BC=8C=E7=99=BB=E5=BD=95=E6=88=90=E5=8A=9F?=
 =?UTF-8?q?=E5=90=8E=E4=BC=9A=E5=B0=86ID=E5=AD=98=E5=82=A8=E5=88=B0?=
 =?UTF-8?q?=E6=9C=AC=E5=9C=B0=EF=BC=8C=E7=9B=B8=E5=85=B3=E5=87=BD=E6=95=B0?=
 =?UTF-8?q?=E5=9C=A8token=E6=96=87=E4=BB=B6=E5=A4=B9=E3=80=82=E8=81=8A?=
 =?UTF-8?q?=E5=A4=A9=E6=8E=A5=E5=8F=A3=E8=BF=98=E6=9C=89=E5=B0=8Fbug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/token/auth.js         |  19 +++-
 src/utils/axiosConfig.js  |   2 +-
 src/views/chat/chat.vue   | 222 +++++++++++++++++++++++++++-----------
 src/views/login/login.vue |   9 +-
 vue.config.js             |  16 +++
 5 files changed, 202 insertions(+), 66 deletions(-)

diff --git a/src/token/auth.js b/src/token/auth.js
index 56c35e6f..bfe36193 100644
--- a/src/token/auth.js
+++ b/src/token/auth.js
@@ -13,6 +13,23 @@ export  function getToken() {
 export  function removeToken() {
     localStorage.removeItem('authToken');
   }
-  
+
+
+// 存储、获取、删除用户登录后的个人ID
+// 定义 setUserId 函数，用于将 UserId 存储到 localStorage
+export function setUserId(id) {
+  localStorage.setItem('UserId', id);
+}
+
+// 定义 getUserId 函数，用于从 localStorage 获取 UserId
+export  function getUserId() {
+  return localStorage.getItem('UserId');
+}
+
+// 定义 removeUserId 函数，用于从 localStorage 删除 UserId
+export  function removeUserId() {
+  localStorage.removeItem('UserId');
+}
+
 
   
\ No newline at end of file
diff --git a/src/utils/axiosConfig.js b/src/utils/axiosConfig.js
index c0dfc6da..a6561ad7 100644
--- a/src/utils/axiosConfig.js
+++ b/src/utils/axiosConfig.js
@@ -4,7 +4,7 @@ import {getToken} from '@/token/auth' // 注意这里使用了解构赋值来导
 
 // 创建axios实例
 const service = axios.create({
-  // baseURL: 'http://47.122.59.26:8080/api', // 配置基础URL   如果服务器域名发生变化统一可以去.env文件修改
+  // baseURL: 'http://47.122.59.26:8080/api', 
   // baseURL: 'http://10.205.10.22:8081/loveforest/api/',
   timeout: 5000, // 请求超时时间
 });
diff --git a/src/views/chat/chat.vue b/src/views/chat/chat.vue
index ce8e6e13..6254a114 100644
--- a/src/views/chat/chat.vue
+++ b/src/views/chat/chat.vue
@@ -17,7 +17,8 @@
                         <p id="chatFriendName">{{ item.name }}</p>
                         <p id="chatFriendMsg">{{ getLatestNew(item) }}</p>
                     </div>
-                    <p id="chatTime">{{ item.chatHistory[item.chatHistory.length - 1].time.split(' ')[1] }}</p>
+                    <p id="chatTime" v-if="item.chatHistory.length != 0">{{ item.chatHistory[item.chatHistory.length - 1].time.split(' ')[1] }}</p>
+                    <p id="chatTime" v-else>00:00</p>
                 </div>
                 </ChatList>
 
@@ -84,6 +85,9 @@
 import HonneyBtn from './HonneyBtn.vue';
 import ChatCard from './ChatCard.vue';
 import ChatList from './ChatList.vue';
+import {getToken,getUserId} from '@/token/auth'
+import axios from 'axios';
+
 export default {
     name: 'chatIndex', // 添加组件名称
     data(){
@@ -92,6 +96,7 @@ export default {
             new_msg_nums: 1,
             chatWith:'',
             userInfo:{
+                id: Number(),
                 name:'我',
                 icon:'/icon/abc.jpg'
             },
@@ -101,62 +106,62 @@ export default {
             // 由于编译后文件夹名称会发生改变，所以把icon图片单独放到服务器的文件夹下面以此来跳过编译（public文件夹）
             // 这里文件路径命名是相对于public的绝对路径
             friendsInfoList: [
-                {name:'潇潇',icon:'/icon/icon.png',position:'london',birth:'2004-1-1',concern_status:false,black_status:true,beeing_friends_time: 302,
-                chatHistory:[
-                    {name:'我',content:'早重中之重做做做做做做做做做做做做做做做做做做做战争之子战争之子做做做做',time:'2024-11-24 1:24'},
-                    {name:'潇潇',content:'中',time:'2024-11-24 2:11'},
-                    {name:'我',content:'晚',time:'2024-11-24 3:24'},
-                ]},
-                {name:'小刚','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 2,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'小刚',content:'hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh',time:'2024-11-25 22:11'},
-                ]},
-                {name:'吴伟',icon:'/icon/icon.png',position:'endland',birth:'2004-5-2',concern_status:false,black_status:false,beeing_friends_time: 32,
-                chatHistory:[
-                    {name:'我',content:'早上好',time:'2024-11-24 22:25'},
-                    {name:'吴伟',content:'iii',time:'2024-11-24 23:11'},
-                ]},
-                {name:'小闽','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'小闽',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'小','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'小',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'闽','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'闽',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'哈哈','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'哈哈',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'kk','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'kk',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'44','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'44',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'77','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'77',content:'h',time:'2024-11-25 22:11'},
-                ]},
-                {name:'88','icon':'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
-                chatHistory:[
-                    {name:'我',content:'you are',time:'2024-11-24 22:24'},
-                    {name:'88',content:'h',time:'2024-11-25 22:11'},
-                ]},
+                // {name:'潇潇',icon:'/icon/icon.png',position:'london',birth:'2004-1-1',concern_status:false,black_status:true,beeing_friends_time: 302,
+                // chatHistory:[
+                //     {name:'我',content:'早重中之重做做做做做做做做做做做做做做做做做做做战争之子战争之子做做做做',time:'2024-11-24 1:24'},
+                //     {name:'潇潇',content:'中',time:'2024-11-24 2:11'},
+                //     {name:'我',content:'晚',time:'2024-11-24 3:24'},
+                // ]},
+                // {name:'小刚',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 2,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'小刚',content:'hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'吴伟',icon:'/icon/icon.png',position:'endland',birth:'2004-5-2',concern_status:false,black_status:false,beeing_friends_time: 32,
+                // chatHistory:[
+                //     {name:'我',content:'早上好',time:'2024-11-24 22:25'},
+                //     {name:'吴伟',content:'iii',time:'2024-11-24 23:11'},
+                // ]},
+                // {name:'小闽',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'小闽',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'小',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'小',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'闽',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'闽',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'哈哈',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'哈哈',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'kk',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'kk',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'44',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'44',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'77',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'77',content:'h',time:'2024-11-25 22:11'},
+                // ]},
+                // {name:'88',icon:'/icon/UserIcon.png',position:'china',birth:'2003-3-4',concern_status:false,black_status:false,beeing_friends_time: 1,
+                // chatHistory:[
+                //     {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                //     {name:'88',content:'h',time:'2024-11-25 22:11'},
+                // ]},
             ],
             showSearchList: [],
             recomendList: [
@@ -169,6 +174,8 @@ export default {
     mounted(){
         if(this.searchName == '')
             this.showSearchList = this.friendsInfoList
+
+            this.get_friendsInfoList()
     },
     components:{
         HonneyBtn,
@@ -177,6 +184,94 @@ export default {
         ChatList
     },
     methods:{
+        async save_chat_message(senderId,receiverId,content){
+            try{
+                const response = await axios.post('/messages/send',{
+                senderId: senderId,
+                receiverId: receiverId,
+                content: content
+                },{
+                    headers:{Authorization : 'Bearer '+getToken()}
+                })
+                console.log(response.data)
+            }catch(error){
+                alert('消息保存失败',error)
+            }
+        },
+        async get_friendsInfoList(){
+            try{
+                // const tempt_chat = {name:'',content:'',time:''}
+                const UserId = getUserId()
+                const token = 'Bearer '+getToken()
+                console.log(UserId,token)
+                const response1 =await axios.get(`/relationships/${UserId}`,{
+                    headers:{Authorization : token}
+                })
+                const data = response1.data
+                console.log(data)
+
+                for(let i = 0;i< data.length;i++)
+                {
+                    let tempt_data = {id:Number(),name:'',icon:'/icon/UserIcon.png',position:'DEFAULT',birth:'',concern_status:false,black_status:false,beeing_friends_time: 0,
+                    chatHistory:[]}
+
+                    // {name:'我',content:'you are',time:'2024-11-24 22:24'},
+                    let response2
+                    if(data[i].userId1 == UserId){
+                        tempt_data.id = data[i].userId2
+                        response2 = await axios.get(`/messages/chat?userId1=${UserId}&userId2=${data[i].userId2}`,{
+                            headers:{Authorization : token}
+                        })
+                    }else if(data[i].userId2 == UserId){
+                        tempt_data.id = data[i].userId1
+                        response2 = await axios.get(`/messages/chat?userId1=${UserId}&userId2=${data[i].userId1}`,{
+                            headers:{Authorization : token}
+                        })
+                    }
+
+                    let chat_history = response2.data
+                    console.log(chat_history)
+
+                    if(chat_history.length != 0){
+                        for(let j = 0;j < chat_history.length ; j++){
+                            let tempt_chat = {name:'',content:'',time:''}
+
+                            if(chat_history[j].senderId == UserId){
+                                tempt_chat.name = data[i].myNickname
+                            }else{
+                                tempt_chat.name = data[i].otherUserNickname
+                            }
+
+                            tempt_chat.content = chat_history[j].content
+                            tempt_chat.time = chat_history[j].timestamp.replace('T',' ')
+                            // console.log(tempt_chat)
+                            tempt_data.chatHistory.push(tempt_chat)
+                        }
+                    }
+
+                    tempt_data.name = data[i].otherUserNickname
+                    tempt_data.birth = data[i].otherUserBirthday
+                    tempt_data.beeing_friends_time = data[i].daysSinceCreated
+                    if(data[i].status == 'friend'){
+                        tempt_data.concern_status = true
+                        tempt_data.black_status = false
+                    }else if(data[i].status == 'black'){
+                        tempt_data.concern_status = false
+                        tempt_data.black_status = true
+                    }else if(data[i].status == 'normal'){
+                        tempt_data.concern_status = false
+                        tempt_data.black_status = false
+                    }
+                    this.friendsInfoList.push(tempt_data) 
+                    this.userInfo.name = data[i].myNickname
+                }
+                
+                this.userInfo.id = UserId
+                console.log(this.friendsInfoList,this.userInfo)
+            }catch(error){
+                alert('获取好友信息失败',error)
+            }
+        },
         clickFriendList(item){
             let who = item.name
             if(this.chatWith != who){
@@ -190,13 +285,15 @@ export default {
             const dayjs = require('dayjs')
             const formattedTime = dayjs().format('YYYY-MM-DD HH:mm');
             console.log(formattedTime) 
-            for(let i=0;i<this.friendsInfoList.length;i++){
+            let i = 0
+            for(i=0;i<this.friendsInfoList.length;i++){
                 if(this.friendsInfoList[i].name == this.chatWith && this.sendingMsg != ''){
                     this.friendsInfoList[i].chatHistory.push({name:this.userInfo.name,content:this.sendingMsg,time:formattedTime})
                     // console.log(this.friendsInfoList[i].chatHistory)
                     break
                 }
             }
+            this.save_chat_message(this.userInfo.id,this.friendsInfoList[i].id,this.sendingMsg)
             this.sendingMsg = ''
         },
         concernStatusRevise(data){
@@ -222,9 +319,12 @@ export default {
             return new_content
         },
         getLatestNew(object){
-            let latest_new = object.chatHistory[object.chatHistory.length - 1].content
-            if(latest_new.length > 14){
-                latest_new= latest_new.slice(0,13) + '...'
+            let latest_new = ''
+            if(object.chatHistory.length != 0){
+                latest_new = object.chatHistory[object.chatHistory.length - 1].content
+                if(latest_new.length > 14){
+                    latest_new= latest_new.slice(0,13) + '...'
+                }
             }
             return latest_new
         },
diff --git a/src/views/login/login.vue b/src/views/login/login.vue
index 64b5cdd1..d4d75316 100644
--- a/src/views/login/login.vue
+++ b/src/views/login/login.vue
@@ -177,7 +177,7 @@
 // eslint-disable-next-line no-unused-vars
 import {Axios as request} from "axios";
 import axios from '@/utils/axiosConfig';
-import {setToken} from '@/token/auth'
+import {setToken,getToken,setUserId,getUserId} from '@/token/auth'
 export default {
     name:'loginIndex',
     data(){
@@ -235,10 +235,13 @@ export default {
                     console.log('登录成功', response)
                     // 假设token在响应的data字段中
                     // !!存疑！!
-                    const token = response.token;
+                    const token = response.jwt;
+                    const userId = response.userId
+                    // console.log(token)
                     // 存储token
                     setToken(token);
-                    // console.log( 'token是：' + getToken() )
+                    setUserId(userId)
+                    console.log( 'token是：' + getToken() + '\n' + '拿到的userId是：' + getUserId() )
                     // 登录成功后的操作，比如跳转到主页
                     this.$router.push('/main');
                 } catch (error) {
diff --git a/vue.config.js b/vue.config.js
index 2dc5ff8b..7c5a56ff 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -5,10 +5,26 @@ module.exports = defineConfig({
     port: 8080,
     https: false,
     proxy:{
+      //登录接口
       '/auth/login':{
         target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
         changeOrigin : true,
       },
+      //获取好友列表接口
+      '/relationships':{
+        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
+        changeOrigin : true
+      },
+      //获取相应的聊天记录的接口
+      '/messages/chat':{
+        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
+        changeOrigin : true
+      },
+      //保存聊天的一条消息接口
+      '/messages/send':{
+        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
+        changeOrigin : true
+      }
     }
   },
   transpileDependencies: true

From 4d650512b00be80eb907b4930708e47bdba1789a Mon Sep 17 00:00:00 2001
From: xuan <3142316616@qq.com>
Date: Tue, 17 Dec 2024 19:43:48 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E8=81=8A=E5=A4=A9=E6=8E=A5=E5=8F=A3OK?=
 =?UTF-8?q?=EF=BC=8C=E4=BD=86=E6=98=AF=E8=BF=98=E4=B8=8D=E8=83=BD=E5=AE=9E?=
 =?UTF-8?q?=E6=97=B6=E9=80=9A=E4=BF=A1=E3=80=82=E6=BB=9A=E5=8A=A8=E6=9D=A1?=
 =?UTF-8?q?=E8=87=AA=E5=8A=A8=E5=88=92=E5=88=B0=E6=9C=80=E5=BA=95=E9=83=A8?=
 =?UTF-8?q?=E5=8F=AF=E8=83=BD=E6=BB=91=E4=B8=8D=E6=9C=80=E5=BA=95=E9=83=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/chat/ChatList.vue  |  26 +++++----
 src/views/chat/HonneyBtn.vue |   1 +
 src/views/chat/chat.vue      | 105 ++++++++++++++++++++++++++++-------
 vue.config.js                |   5 ++
 4 files changed, 107 insertions(+), 30 deletions(-)

diff --git a/src/views/chat/ChatList.vue b/src/views/chat/ChatList.vue
index bd6a11ac..90c3607d 100644
--- a/src/views/chat/ChatList.vue
+++ b/src/views/chat/ChatList.vue
@@ -1,9 +1,10 @@
 <template>
     <div ref="scrollDiv" class="container" :style="{height: containerHeight}" @scroll="scroll_event">
         <div class="list" :style="{top: listTop}">
-            <slot :show_list="getShowList" :show_height="one_height" @chatWithEvent="chatWithHandle"></slot>
+            <slot :show_list="getShowList" :show_height="one_height"></slot>
             <div :style="{height: barHeight}"></div>
         </div>
+
     </div>
 
 </template>
@@ -37,7 +38,10 @@ export default{
             return this.items.slice(this.start,this.end)
         },
         barHeight(){
-            return this.one_height * (this.items.length-this.start-this.shownum+1) + 'px'
+            if((this.items.length-this.start-this.shownum+1) <= 0)
+                return 0 + 'px'
+            else
+                return this.one_height * (this.items.length-this.start-this.shownum+1) + 'px'
         },
         listTop(){
             // console.log(this.items,this.shownum,this.one_height)
@@ -49,24 +53,24 @@ export default{
             const top = e.target.scrollTop
             this.start = Math.floor(top / this.one_height)
             this.end = this.start + this.shownum
+
+            // e.target.scrollTop = e.target.scrollHeight
+            // this.end = this.items.length
+            // this.start = this.end - this.shownum
         },
         chatWithHandle(){
-            console.log(1)
             if(this.status == true){
+                let scrollElem = this.$refs.scrollDiv
+                scrollElem.scrollTop = scrollElem.scrollHeight 
+                console.log(scrollElem.scrollHeight,scrollElem.scrollTop)
                 this.end = this.items.length
-                // console.log(this.end)
                 this.start = this.end - this.shownum
-                if(this.start < 0 ){
+                if(this.start<0)
                     this.start = 0
-                }else{
-                    let scrollElem = this.$refs.scrollDiv
-                    scrollElem.scrollTo({top: scrollElem
-                        ,behavior: 'smooth'})
-                    console.log(1)
-                }
             }
         }
     },
+    expose: ['chatWithHandle'],
     watch:{
         status(){
             console.log(1)
diff --git a/src/views/chat/HonneyBtn.vue b/src/views/chat/HonneyBtn.vue
index 3a2f8343..00e86e54 100644
--- a/src/views/chat/HonneyBtn.vue
+++ b/src/views/chat/HonneyBtn.vue
@@ -21,6 +21,7 @@ export default{
     props:{
         Status:Boolean,
         cnt:String,
+        userId1: Number,
         ReviseStatus2Father: Function
         // Status2:String
     },
diff --git a/src/views/chat/chat.vue b/src/views/chat/chat.vue
index 6254a114..8e8e8fae 100644
--- a/src/views/chat/chat.vue
+++ b/src/views/chat/chat.vue
@@ -19,13 +19,14 @@
                     </div>
                     <p id="chatTime" v-if="item.chatHistory.length != 0">{{ item.chatHistory[item.chatHistory.length - 1].time.split(' ')[1] }}</p>
                     <p id="chatTime" v-else>00:00</p>
+                    <label v-if="item.unreading_num != 0" style="position: relative;bottom:25%;background-color: red;color: white;border-radius: 50%;font-weight: 400;font-size: 8px;text-align: center;height: 15px;width: 15px;line-height: 180%;">{{ item.unreading_num }}</label>
                 </div>
                 </ChatList>
 
             </div>
         </div>
         <div class="chat-middlelayout">
-            <ChatList v-if="chatWith == '' ? false : true" :shownum="Number(5)" :items="getFriendObject.chatHistory" :one_height="Number(100)" :status="true" v-slot="a">
+            <ChatList ref="chatHandle" v-if="chatWith == '' ? false : true" :shownum="Number(5)" :items="getFriendObject.chatHistory" :one_height="Number(100)" :status="true" v-slot="a">
                 <div  v-for="(item,index) of a.show_list" :key="index">
                     <ChatCard :your_icon="getFriendObject.icon" :my_icon="userInfo.icon" :name="item.name" :yours="chatWith" :content="historyContentHandle(item.content)"></ChatCard>               
                 </div>
@@ -51,7 +52,7 @@
                     <p style="color: #f85096;">他的主页</p>
                 </div>
                 <div class="chat-home-tree-btn">
-                    <button class="chat-tree-btn"></button>
+                    <button class="chat-tree-btn" @click="cliTreeBtn"></button>
                     <p style="color: #a75efb;">族谱树</p>
                 </div>
             </div>
@@ -87,13 +88,12 @@ import ChatCard from './ChatCard.vue';
 import ChatList from './ChatList.vue';
 import {getToken,getUserId} from '@/token/auth'
 import axios from 'axios';
-
 export default {
     name: 'chatIndex', // 添加组件名称
     data(){
         return{
             searchName: '',
-            new_msg_nums: 1,
+            new_msg_nums: 0,
             chatWith:'',
             userInfo:{
                 id: Number(),
@@ -184,7 +184,34 @@ export default {
         ChatList
     },
     methods:{
+        async revise_honneyBtn_status(userId1,userId2,status){
+            //向后端发送是出于好友状态还是黑名单状态
+            try{
+                const response = await axios.post('/relationships',{
+                    userId1: userId1,
+                    userId2: userId2,
+                    status: status
+                },{
+                    headers:{Authorization : 'Bearer '+getToken()}
+                })
+                console.log(response.data)
+            }catch(error){
+                alert('好友状态修改失败',error)
+            }
+        },
+        async revise_reading(senderId,receiverId){ 
+            //向后端传输信息标记是否已读（一个axios
+            try{
+                const response = await axios.post(`/messages/mark-as-read/${senderId}/${receiverId}`,{},{
+                    headers:{Authorization : 'Bearer '+getToken()}
+                })
+                console.log(response.data)
+            }catch(error){
+                alert('消息已读失败',error)
+            }
+        },
         async save_chat_message(senderId,receiverId,content){
+            //向后端发送消息（一个axios
             try{
                 const response = await axios.post('/messages/send',{
                 senderId: senderId,
@@ -199,6 +226,7 @@ export default {
             }
         },
         async get_friendsInfoList(){
+            //向后端获取好友列表和聊天记录（两个axios
             try{
                 // const tempt_chat = {name:'',content:'',time:''}
                 const UserId = getUserId()
@@ -212,19 +240,19 @@ export default {
 
                 for(let i = 0;i< data.length;i++)
                 {
-                    let tempt_data = {id:Number(),name:'',icon:'/icon/UserIcon.png',position:'DEFAULT',birth:'',concern_status:false,black_status:false,beeing_friends_time: 0,
+                    let tempt_data = {id:Number(),name:'',icon:'/icon/UserIcon.png',position:'DEFAULT',birth:'',concern_status:false,black_status:false,beeing_friends_time: 0,unreading_num: 0,
                     chatHistory:[]}
 
                     // {name:'我',content:'you are',time:'2024-11-24 22:24'},
                     let response2
                     if(data[i].userId1 == UserId){
                         tempt_data.id = data[i].userId2
-                        response2 = await axios.get(`/messages/chat?userId1=${UserId}&userId2=${data[i].userId2}`,{
+                        response2 = await axios.get(`/messages/chat/${UserId}/${data[i].userId2}`,{
                             headers:{Authorization : token}
                         })
                     }else if(data[i].userId2 == UserId){
                         tempt_data.id = data[i].userId1
-                        response2 = await axios.get(`/messages/chat?userId1=${UserId}&userId2=${data[i].userId1}`,{
+                        response2 = await axios.get(`/messages/chat/${UserId}/${data[i].userId1}`,{
                             headers:{Authorization : token}
                         })
                     }
@@ -246,11 +274,16 @@ export default {
                             tempt_chat.time = chat_history[j].timestamp.replace('T',' ')
                             // console.log(tempt_chat)
                             tempt_data.chatHistory.push(tempt_chat)
+
+                            if(chat_history[j].read == false && chat_history[j].receiverId == UserId){
+                                tempt_data.unreading_num += 1
+                            }
                         }
                     }
 
                     tempt_data.name = data[i].otherUserNickname
                     tempt_data.birth = data[i].otherUserBirthday
+                    tempt_data.position = data[i].otherUserAddress
                     tempt_data.beeing_friends_time = data[i].daysSinceCreated
                     if(data[i].status == 'friend'){
                         tempt_data.concern_status = true
@@ -263,6 +296,7 @@ export default {
                         tempt_data.black_status = false
                     }
                     this.friendsInfoList.push(tempt_data) 
+                    this.new_msg_nums += tempt_data.unreading_num
                     this.userInfo.name = data[i].myNickname
                 }
                 
@@ -273,34 +307,67 @@ export default {
             }
         },
         clickFriendList(item){
+            //更新chatWith
             let who = item.name
             if(this.chatWith != who){
                 this.sendingMsg = ''
             }
             this.chatWith = item.name
             // console.log(this.chatWith)
-
+            //更新是否已读
+            this.revise_reading(this.userInfo.id,item.id)
+            this.new_msg_nums -= item.unreading_num
+            item.unreading_num = 0
+            //将列表下拉到最下面
+            this.$nextTick(() =>{
+                console.log(this.$refs.chatHandle)
+                this.$refs.chatHandle.chatWithHandle()
+            })
+        },
+        cliTreeBtn(){
+            this.$router.push('/main/familyTree')
         },
         sendMsg(){
-            const dayjs = require('dayjs')
-            const formattedTime = dayjs().format('YYYY-MM-DD HH:mm');
-            console.log(formattedTime) 
-            let i = 0
-            for(i=0;i<this.friendsInfoList.length;i++){
-                if(this.friendsInfoList[i].name == this.chatWith && this.sendingMsg != ''){
-                    this.friendsInfoList[i].chatHistory.push({name:this.userInfo.name,content:this.sendingMsg,time:formattedTime})
-                    // console.log(this.friendsInfoList[i].chatHistory)
-                    break
+            if(this.chatWith != ''){
+                const dayjs = require('dayjs')
+                const formattedTime = dayjs().format('YYYY-MM-DD HH:mm');
+                console.log(formattedTime) 
+                let i = 0
+                for(i=0;i<this.friendsInfoList.length;i++){
+                    if(this.friendsInfoList[i].name == this.chatWith && this.sendingMsg != ''){
+                        this.friendsInfoList[i].chatHistory.push({name:this.userInfo.name,content:this.sendingMsg,time:formattedTime})
+                        // console.log(this.friendsInfoList[i].chatHistory)
+                        break
+                    }
                 }
+                this.save_chat_message(this.userInfo.id,this.friendsInfoList[i].id,this.sendingMsg)
+                this.sendingMsg = ''
+                this.$nextTick(() =>{
+                    console.log(this.$refs.chatHandle)
+                    this.$refs.chatHandle.chatWithHandle()
+                })
             }
-            this.save_chat_message(this.userInfo.id,this.friendsInfoList[i].id,this.sendingMsg)
-            this.sendingMsg = ''
         },
         concernStatusRevise(data){
             this.getFriendObject.concern_status = data
+            // console.log(this.userInfo.id,this.getFriendObject.id)
+            if(data == true){
+                this.revise_honneyBtn_status(this.userInfo.id,this.getFriendObject.id,'friend')
+                this.getFriendObject.black_status = false
+            }else if(this.getFriendObject.black_status == false && this.getFriendObject.concern_status == false){
+                this.revise_honneyBtn_status(this.userInfo.id,this.getFriendObject.id,'normal')
+            }
+
         },
         blackStatusRevise(data){
             this.getFriendObject.black_status = data
+            if(data == true){
+                this.revise_honneyBtn_status(this.userInfo.id,this.getFriendObject.id,'black')
+                this.getFriendObject.concern_status = false
+            }else if(this.getFriendObject.black_status == false && this.getFriendObject.concern_status == false){
+                this.revise_honneyBtn_status(this.userInfo.id,this.getFriendObject.id,'normal')
+            }
+
         },
         historyContentHandle(content){
             let char_sizeof = 0
diff --git a/vue.config.js b/vue.config.js
index 7c5a56ff..ca3e7031 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -24,6 +24,11 @@ module.exports = defineConfig({
       '/messages/send':{
         target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
         changeOrigin : true
+      },
+      //新消息是否被已读的接口
+      '/messages/mark-as-read':{
+        target : 'https://911fb0525ms3.vicp.fun/loveforest/api',
+        changeOrigin : true
       }
     }
   },

From 415a44db30a62f6c282bcb3fb30a6d571def8419 Mon Sep 17 00:00:00 2001
From: QMZ <1164250597@qq.com>
Date: Tue, 17 Dec 2024 20:49:06 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E7=A4=BE=E5=8C=BA=E5=AE=8C=E5=96=84?=
 =?UTF-8?q?=E5=B8=96=E5=AD=90=E4=BB=A5=E5=8F=8A=E8=AF=84=E8=AE=BA=E5=88=A0?=
 =?UTF-8?q?=E9=99=A4=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/community/community.css |  26 +---
 src/utils/axiosConfig.js               |   1 +
 src/views/community/PostCard.vue       | 192 ++++++++++++++++++++++---
 src/views/community/Postform.vue       |   6 +-
 src/views/community/trends.vue         |  79 +++++-----
 5 files changed, 223 insertions(+), 81 deletions(-)

diff --git a/src/assets/css/community/community.css b/src/assets/css/community/community.css
index 9cb0a82d..96cd3f10 100644
--- a/src/assets/css/community/community.css
+++ b/src/assets/css/community/community.css
@@ -1,35 +1,17 @@
 
-/* 设置进入和离开的过渡效果 */
 
+/* 离开动画 */
 .post-list .fade-leave-active {
   transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
 }
 
-.post-list .fade-enter-active {
-  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
-}
-
-/* 元素进入时，缩放并渐变 */
-.post-list .fade-leave-to /* .fade-leave-active in Vue 2.x */ {
-  opacity: 0;
-  transform: scale(0.5); /* 初始状态为缩小 */
-}
-.post-list .fade-enter{
+.post-list .fade-leave-to /* 离开完成后状态 */
+{
   opacity: 0;
-  transform: scale(0.5); /* 初始状态为缩小 */
+  transform: translateX(100%) scale(0.5); /* 离开时从右边滑出并缩小 */
 }
 
-/* 元素进入时恢复到原尺寸 */
-.post-list .fade-enter-to {
-  opacity: 1;
-  transform: scale(1); /* 变大恢复正常尺寸 */
-}
 
-/* 元素离开时，继续保持缩小状态 */
-.post-list .fade-leave-to {
-  opacity: 0;
-  transform: scale(0.5); /* 离开时缩小 */
-}
 
 
 
diff --git a/src/utils/axiosConfig.js b/src/utils/axiosConfig.js
index c0dfc6da..ed4c0d2b 100644
--- a/src/utils/axiosConfig.js
+++ b/src/utils/axiosConfig.js
@@ -6,6 +6,7 @@ import {getToken} from '@/token/auth' // 注意这里使用了解构赋值来导
 const service = axios.create({
   // baseURL: 'http://47.122.59.26:8080/api', // 配置基础URL   如果服务器域名发生变化统一可以去.env文件修改
   // baseURL: 'http://10.205.10.22:8081/loveforest/api/',
+  // baseURL: 'http://10.133.13.52:8082/loveforest',
   timeout: 5000, // 请求超时时间
 });
 
diff --git a/src/views/community/PostCard.vue b/src/views/community/PostCard.vue
index f9fecb2d..28fd35b1 100644
--- a/src/views/community/PostCard.vue
+++ b/src/views/community/PostCard.vue
@@ -1,4 +1,5 @@
 <template>
+
   <div class="post-card">
     <div class="post-header">
       <img :src="avatarUrl" alt="avatar" class="avatar" />
@@ -15,11 +16,31 @@
           </div>
         </button>
 
+
+
+
         <span>{{ timestamp }}</span>
 
 
 
       </div>
+      <div style="right: -50%;position: relative;">
+        <button class="deletebutto" @click="openModal" v-if="this.userid===this.postuserid&&!showModal">
+          ×
+          删除
+
+        </button>
+        <transition name="fade" @before-enter="beforeEnter" @enter="enter" @leave="leave">
+          <div v-if="showModal">
+            <button @click="deletebutton" class="deletebutto">确定</button>
+            <button @click="cancelDelete" class="deletebutto">取消</button>
+          </div>
+        </transition>
+      </div>
+
+
+
+
       <div v-if="isfamilystory" class="ribbon-8">
         <span>
           家族故事
@@ -51,7 +72,8 @@
     <transition name="fade" @before-enter="beforeEnter" @enter="enter" @leave="leave">
       <div v-if="isCommentsVisible" class="comments-section">
         <div v-for="(comment, index) in comments" :key="index" class="comment">
-          <p><strong>{{ comment.userid}}:</strong> {{ comment.content }}</p>
+          <p><strong>{{ comment.userid}}:</strong> {{ comment.content }} <button v-if="comment.userid==this.userid" style="color:#FE4E96;"
+              @click="deletecomment(comment.commentid)">删除</button> </p>
         </div>
 
         <!-- 发布评论 -->
@@ -63,7 +85,7 @@
 
 <script>
   import CommentInput from './CommentInput.vue';
-  import axios from 'axios';
+  import axios from '@/utils/axiosConfig';
 
   export default {
 
@@ -94,11 +116,11 @@
     },
     created() {
 
-      if (this.userlikelist.some(follow => follow.postid === this.postid)) {
+      if (this.userlikelist.some(follow => follow.postid === this.postid)) {//是否已经点赞判断 查找列表中是否有当前postid
 
         this.isLiked = true;
       }
-      if (this.myfollows.some(follow => follow.myfollowid === this.postuserid)) {
+      if (this.myfollows.some(follow => follow.myfollowid === this.postuserid)) {//是否已经关注判断 查找列表中是否有当前postuserid
         this.followsbuttonActive = true;
       }
 
@@ -112,6 +134,7 @@
     },
     data() {
       return {
+        showModal: false,
         isActive: false,
         isLiked: false,
         isClicked: false,
@@ -120,7 +143,56 @@
       };
     },
     methods: {
+      async deletecomment(commentid) {
+        try {
+
+          const response = await axios.delete(`/comments/commentid=${commentid}`);
+          if (response === "删除评论成功!!") {
+
+            this.$message.success("删除评论成功!!可刷新后查看");
+
+
+          }
+          else {
+            this.$message.error(response);
+          }
+
+        } catch (error) {
+
+          this.$message.error("删除评论失败");
+          console.log(error);
+        }
+      },
 
+      cancelDelete() {
+        // 取消删除，隐藏弹窗
+        this.showModal = false;
+      },
+      openModal() {
+        this.showModal = true;
+      },
+      async deletebutton() {
+        try {
+
+          const response = await axios.delete(`/posts/postid=${this.postid}`);
+          if (response === "删除动态成功 ！！") {
+
+            this.$message.success("删除动态成功 ！！可刷新后查看");
+
+
+          }
+          else {
+            this.$message.error(response);
+          }
+
+        } catch (error) {
+
+          this.$message.error("删除动态失败");
+          console.log(error);
+        }
+        this.showModal = false;
+
+      },
       async followsbutton() {//关注按钮
         // 设置为 active，触发动画
         const useride = this.userid;
@@ -128,14 +200,14 @@
         if (this.followsbuttonActive == false) {
           try {
 
-            const response = await axios.post(`http://localhost:8082/loveforest/Myfollows/userid=${useride}/myfollowid=${this.postuserid}`);
-            if (response.data === "关注成功！") {
+            const response = await axios.post(`/Myfollows/userid=${useride}/myfollowid=${this.postuserid}`);
+            if (response === "关注成功！") {
 
-              this.$message.success(response.data);
+              this.$message.success(response);
               this.followsbuttonActive = true;
             }
             else {
-              this.$message.error(response.data);
+              this.$message.error(response);
             }
 
           } catch (error) {
@@ -149,14 +221,14 @@
         else {
           try {
 
-            const response = await axios.delete(`http://localhost:8082/loveforest/Myfollows/userid=${useride}/myfollowid=${this.postuserid}`);
-            if (response.data === "取消关注成功！") {
-              this.$message.success(response.data);
+            const response = await axios.delete(`/Myfollows/userid=${useride}/myfollowid=${this.postuserid}`);
+            if (response === "取消关注成功！") {
+              this.$message.success(response);
               this.followsbuttonActive = false;
 
             }
             else {
-              this.$message.error(response.data);
+              this.$message.error(response);
             }
 
           } catch (error) {
@@ -180,15 +252,15 @@
       async increaseLikeCount() {//点赞按钮
         if (!this.isLiked) {//假如没点赞
           try {
-            const response = await axios.post(`http://localhost:8082/loveforest/likes/userid=${this.userid}/postid=${this.postid}`);
-            if (response.data === "点赞成功！") {
-              this.$message.success(response.data);
+            const response = await axios.post(`/likes/userid=${this.userid}/postid=${this.postid}`);
+            if (response === "点赞成功！") {
+              this.$message.success(response);
               this.$emit('updateLikeCount', this.likeCount + 1);
               this.isLiked = !this.isLiked;
 
             }
             else {
-              this.$message.error(response.data);
+              this.$message.error(response);
             }
           } catch (error) {
 
@@ -198,16 +270,16 @@
         }
         else {//假如已经点赞
           try {
-            const response = await axios.delete(`http://localhost:8082/loveforest/likes/userid=${this.userid}/postid=${this.postid}`);
-            if (response.data === "取消点赞成功！") {
+            const response = await axios.delete(`/likes/userid=${this.userid}/postid=${this.postid}`);
+            if (response === "取消点赞成功！") {
 
-              this.$message.error("取消点赞成功");
+              this.$message.success("取消点赞成功");
               this.$emit('updateLikeCount', this.likeCount - 1);
               this.isLiked = !this.isLiked;
 
             }
             else {
-              this.$message.error(response.data);
+              this.$message.error(response);
             }
           } catch (error) {
 
@@ -245,6 +317,80 @@
 </script>
 
 <style scoped>
+  .fade-enter-active,
+  .fade-leave-active {
+    transition: opacity 0.5s ease-in-out;
+    /* 渐变动画 */
+  }
+
+  .fade-enter,
+  .fade-leave-to {
+    opacity: 0;
+    /* 初始透明度 */
+  }
+
+  /* 可选：按钮在进入时的缩放效果 */
+  .fade-enter {
+    transform: scale(0.8);
+  }
+
+  .fade-enter-active {
+    transition: opacity 0.3s ease, transform 0.3s ease;
+  }
+
+  .fade-leave-active {
+    transition: opacity 0.3s ease, transform 0.3s ease;
+  }
+
+  .fade-leave-to {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+
+  /* 控制显示时的定位变化 */
+  .fade-enter-to {
+    transform: translateY(0);
+  }
+
+  .fade-leave-to {
+    transform: translateY(-10px);
+  }
+
+  .modal-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 999;
+  }
+
+
+
+
+  .deletebutto {
+    margin-left: 10px;
+    margin-right: 10px;
+    position: relative;
+    width: 70px;
+    height: 30px;
+    line-height: 30px;
+    /* 修改 line-height 为与高度一致 */
+    border: none;
+    border-radius: 30px;
+    background: #FE4E96;
+    color: #fff;
+    text-align: center;
+    cursor: pointer;
+    font-size: 14px;
+
+
+  }
+
   .postimage {
     max-width: 600px;
     max-height: 600px;
@@ -348,12 +494,12 @@
   }
 
   .post-card {
-    opacity: 0.95;
+    opacity: 0.9;
     margin: 20px;
     border: 1px solid #ddd;
     padding: 15px;
-    border-radius: 8px;
-    background-color: #fff;
+    border-radius: 15px;
+    background-color: #FFFBFB;
   }
 
   .post-header {
diff --git a/src/views/community/Postform.vue b/src/views/community/Postform.vue
index 22ffdf80..96db7a39 100644
--- a/src/views/community/Postform.vue
+++ b/src/views/community/Postform.vue
@@ -126,7 +126,6 @@
           return;
         }
         const newPost = {
-          
           userid:1,
           username: '用户',
           avatarurl: 'https://via.placeholder.com/50',
@@ -234,8 +233,9 @@
   }
 
   .animate-card__layer {
-    height: 5%;
-    width: 5%;
+    height: 16px;
+    width: 7%;
+    font-size: 14px;
     background-color: #FE4E96;
     border: none;
   }
diff --git a/src/views/community/trends.vue b/src/views/community/trends.vue
index 4bfc1562..1f10ea81 100644
--- a/src/views/community/trends.vue
+++ b/src/views/community/trends.vue
@@ -76,7 +76,7 @@
       </div>
       <div class=heatlist style="margin-top:20px;display: flex;flex-direction:row;">
         <div
-          style="position:relative; display: flex;flex-direction:column;  color: white; font-weight: bold;margin-left: 20px ;gap:51px">
+          style="position:relative; display: flex;flex-direction:column;  color: white; font-weight: bold;margin-left: 20px ;gap:51px;margin-top:10px">
           <div class=Hotsearchnum style="background-color:red;">1</div>
           <div class=Hotsearchnum style="background-color:#ff8e51;">2</div>
           <div class=Hotsearchnum style="background-color:#ffc74fd2;">3</div>
@@ -85,16 +85,16 @@
 
         </div>
         <div
-          style="font-size: 14px; font-weight: 500; margin-left: 30px; display: flex; flex-direction: column; gap: 17px;width: 100%;">
+          style="font-size: 14px; font-weight: 500; margin-left: 20px; display: flex; flex-direction: column; gap: 17px;width: 100%; ">
           <div
-            style="overflow: hidden; list-style-type: none; width: 90%; height: 20%; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative; cursor: pointer;"
+            style="overflow: hidden; list-style-type: none; width: 90%; height: 20%;max-height: 60px; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative; cursor: pointer;"
             v-for="(Hotsearch, index) in HotsearchList" :key="index" @click="checkbypostid(Hotsearch.postid)">
 
             <div style=" font-weight: bold; margin-left: 10%; margin-top: 1%; ">{{ Hotsearch.username }}:</div>
             <div style="left:10%;width: 70%; font-size: 12px;position: relative;">{{ Hotsearch.content}}</div>
 
             <svg width="20" height="20" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" id="fire-station"
-              style="position: absolute;right:7% ;top:20%;fill:red ">
+              style="position: absolute;right:5.8% ;top:20%;fill:red ">
               <path
                 d="M7.5 14C11.0899 14 14 11 14 7.50003C14 4.5 11.5 2 11.5 2L10.5 5.5L7.5 1L4.5 5.5L3.5 2C3.5 2 1 4.5 1 7.50003C1 11 3.91015 14 7.5 14ZM7.5 12.5C6.11929 12.5 5 11.3807 5 10C5 8.61929 7.5 5.5 7.5 5.5C7.5 5.5 10 8.61929 10 10C10 11.3807 8.88071 12.5 7.5 12.5Z" />
             </svg>
@@ -123,8 +123,8 @@
 
       </div>
       <div class="familystorelist"
-        style="margin-top: 20px; display: flex; justify-content: center; flex-direction: column; gap: 10px;">
-        <div v-for="(story, index) in familystories" :key="index" class="familystore"
+        style="margin-top: 20px; display: flex; justify-content: center; flex-direction: column; gap: 10px;margin-left: 20px;">
+        <div v-for="(story, index) in checkfamilystories" :key="index" class="familystore"
           style="width: 95%; height: 70px; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative;cursor: pointer;"
           @click="checkbypostid(story.postid)">
           <img class="touxiang" src="../../assets/pictures/touxiang.png" />
@@ -142,7 +142,8 @@
 <script>
   import PostCard from './PostCard.vue';
   import PostForm from './Postform.vue';
-  import axios from 'axios';
+  import axios from '@/utils/axiosConfig';
+  // import {getToken} from '@/token/auth'
   export default {
     name: 'CommunityIndex', // 添加组件名称
     components: { PostCard, PostForm },
@@ -156,12 +157,13 @@
         hoverIndex: -1,
         selectedIndex: -1,
         isloading: false,
-        loaddone: 0,
         checkPostsindex: 0,
         checkPosts: [],
         page: 1,
         userid: 1,
         totalPages: 1,
+        familystoriespage:0,
+        checkfamilystories:[],
         posts: [
           {
 
@@ -207,14 +209,14 @@
       async fllowlist() {
 
         const userid = this.userid;//获取用户id
-        axios.get(`http://localhost:8082/loveforest/Myfollows/userid=${userid}`)
+        axios.get(`/Myfollows/userid=${userid}`)
           .then(response => {
 
 
             this.myfollows.splice(0, this.myfollows.length);
-            this.myfollows.push(...response.data);
+            this.myfollows.push(...response);
 
-            return response.data;
+            return response;
           })
           .catch(error => {
             console.error('Error:', error);
@@ -223,20 +225,20 @@
       },
 
       submitPost(newpost) {//发布帖子后，本地显示帖子
-        this.checkPosts = [newpost, ...this.checkPosts];
+        this.checkPosts.unshift(newpost); 
 
       },
       async load() {//加载帖子函数
         if (this.isloading) {
           try {
-            const response = await axios.get(`http://localhost:8082/loveforest/posts`, {
+            const response = await axios.get(`/posts`, {
               params: {
                 page: this.page,
                 size: 5,
               },
             });
 
-            const filteredPostsList = response.data.records;
+            const filteredPostsList = response.records;
 
 
             this.$message("动态加载中page" + this.page);
@@ -253,14 +255,16 @@
 
 
         try {
-          const response = await axios.get(`http://localhost:8082/loveforest/posts/postid=${postid}`);
+          const response = await axios.get(`/posts/postid=${postid}`);
           this.isloading = false;
+          console.error('动态动态！！！！：',response);
           this.checkPosts.splice(0, this.checkPosts.length);
-          this.checkPosts.push(response.data);
+          this.checkPosts.push(response);
 
 
         } catch (error) {
           console.error('动态获取失败', error);
+          
         }
 
 
@@ -268,13 +272,13 @@
 
       async loaduserlikes() {//加载user点赞列表 并会传入每个帖子做是否已经点赞的判断
         const userid = this.userid;//获取用户id
-        axios.get(`http://localhost:8082/loveforest/likes/userid=${userid}`)
+        axios.get(`/likes/userid=${userid}`)
           .then(response => {
 
-            this.userlikelist.splice(0, this.myfollows.length);
-            this.userlikelist.push(...response.data);
+            this.userlikelist.splice(0, this.userlikelist.length);
+            this.userlikelist.push(...response);
 
-            return response.data;
+            return response;
           })
           .catch(error => {
             console.error('Error:', error);
@@ -293,9 +297,9 @@
       },
       async loadhotpost() {//加载热门动态
         try {
-          const response = await axios.get(`http://localhost:8082/loveforest/posts/topposts`);
-          this.HotsearchList.push(...response.data);
-          console.log(response.data);
+          const response = await axios.get(`/posts/topposts`);
+          this.HotsearchList.push(...response);
+          
 
         } catch (error) {
           this.$message.error("热门动态获取失败");
@@ -306,8 +310,9 @@
 
       async loadhotfamilystory() {//加载热门家族故事
         try {
-          const response = await axios.get(`http://localhost:8082/loveforest/posts/topfamilystory`);
-          this.familystories.push(...response.data);
+          const response = await axios.get(`/posts/topfamilystory`);
+          this.familystories.push(...response);
+          this.checkfamilystories.push(...response.slice(0, 4));
 
 
         } catch (error) {
@@ -323,12 +328,12 @@
         this.selectedIndex = index;  // 点击后设置选中的项
 
         try {
-          const response = await axios.get(`http://localhost:8082/loveforest/posts/userid=${userid}`);
+          const response = await axios.get(`/posts/userid=${userid}`);
           this.isloading = false;
           this.checkPosts.splice(0, this.checkPosts.length);
 
-          this.checkPosts.push(...response.data);
-          if (response.data.length === 0) {
+          this.checkPosts.push(...response);
+          if (response.length === 0) {
             this.$message("对方还没有发过动态哦");
           }
 
@@ -350,8 +355,8 @@
       async toggleCommentsVisibility(index, postid) {//展开评论以及获取评论列表
         this.$message("评论区展开" + index);
         try {
-          const response = await axios.get(`http://localhost:8082/loveforest/comments/postid=${postid}`);
-          this.checkPosts[index].comments = response.data;
+          const response = await axios.get(`/comments/postid=${postid}`);
+          this.checkPosts[index].comments = response;
           //等待获取user名字接口
           this.checkPosts[index].isCommentsVisible = !this.checkPosts[index].isCommentsVisible;
 
@@ -365,7 +370,7 @@
       async addComment(index, commentText, postid) {//发送评论
 
         try {
-          const response = await axios.post('http://localhost:8082/loveforest/comments/addcomments', {
+          const response = await axios.post('/comments/addcomments', {
             userid: this.userid,
             postid: postid,
             content: commentText
@@ -375,7 +380,7 @@
               'Accept': 'application/json'
             }
           });
-          if (response.data === "评论成功！") {
+          if (response=== "评论成功！") {
             this.$message.success("评论成功！");
             this.checkPosts[index].comments.push({
               username: '用户名',//等待user接口
@@ -386,7 +391,7 @@
             this.checkPosts[index].commentCount += 1;
           }
           else {
-            this.$message.error(response.data);
+            this.$message.error(response);
           }
 
         } catch (error) {
@@ -400,6 +405,14 @@
       refresh() {//热门家族故事刷新换一批按钮
         // 点击后触发的刷新动作
         console.log('Refreshing...');
+
+        this.familystoriespage+=4;
+        if(this.familystoriespage>12){
+          this.familystoriespage=0;
+        }
+        this.checkfamilystories.splice(0, this.checkfamilystories.length);
+        this.checkfamilystories.push(...this.familystories.slice(this.familystoriespage, this.familystoriespage+4));
+
         this.triggerAnimation();
       },