diff --git a/src/components/postsPanel/postsPanel.module.css b/src/components/postsPanel/postsPanel.module.css
index dc10683..b4b75ce 100644
--- a/src/components/postsPanel/postsPanel.module.css
+++ b/src/components/postsPanel/postsPanel.module.css
@@ -2,6 +2,7 @@
     background-color: var(--card-bg);
     height:100%;
     width:100%;
+    padding:0px 5px;
 }
 
 .header{
@@ -27,7 +28,16 @@
 .content .item{
     display:flex;
     justify-content:space-between;
+    align-items:center;
+    padding-top:10px;
+    padding-bottom:10px;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.04); /* 添加边框阴影 */
+    border:1px solid rgba(0,0,0,0.04);
+}
 
+.content .item:hover {
+    background:var(--select-bg-color);
+    cursor:pointer
 }
 .content .item .text{
     width:70%;
diff --git a/src/components/postsPanel/postsPanel.tsx b/src/components/postsPanel/postsPanel.tsx
index e4f87c0..2916753 100644
--- a/src/components/postsPanel/postsPanel.tsx
+++ b/src/components/postsPanel/postsPanel.tsx
@@ -2,6 +2,7 @@
 import React, { useCallback } from  'react';
 import request from '@/utils/request'
 import style from './postsPanel.module.css'
+import { useNavigate } from 'react-router';
 
 
 interface panelProps{
@@ -11,23 +12,24 @@
 }
 
 const PostsPanel:React.FC<panelProps> = (props) => {
-    const fenchData = useCallback(() => request.get(props.url), [props.url])
+    const nav = useNavigate();
+    const fenchData = useCallback(() => request.get(`${props.url}?page=1&size=5`), [props.url])
     const {data} = useApi(fenchData, true);
-
-
-
+    const handlePostCheck =(postId:string) =>{
+        nav('/postDetail?postId=' + postId);
+    }
     return (
         <div className={style.panel}>
             <div className={style.header}>
                 <span className={style.title}>{props.name}</span>
                 <span className={style.more}>更多</span>
             </div>
-            <div className={style.content}>
+            <div className={style.content} >
                 {data && data.length > 0 ?
-                data?.map((item: { title: string; date: string }, index: number) => (
-                    <div key={index} className={style.item}>
-                        <span className={style.text}>{item.title}</span>
-                        <span>{item.date}</span>
+                data?.map((item: {postId:string, postTitle: string; createdAt: string }, index: number) => (
+                    <div key={index} className={style.item} onClick={()=> handlePostCheck(item.postId)} >
+                        <span className={style.text}>{item.postTitle}</span>
+                        <span>{item.createdAt}</span>
                     </div>
                 ))  :(
                     <div>未查询到相关记录</div>