后端链接主页
Change-Id: I9ecd6ce05ff8fedd511c868b2916ebf299a2e0da
diff --git a/src/views/homepage/homepage.tsx b/src/views/homepage/homepage.tsx
index ec74187..165ed67 100644
--- a/src/views/homepage/homepage.tsx
+++ b/src/views/homepage/homepage.tsx
@@ -4,7 +4,7 @@
import { useSelector } from 'react-redux';
import { RootState } from '@/store';
import { useNavigate } from 'react-router';
-import logo from '&/assets/logo.png';
+import Logo from '&/assets/logo.png';
import { getUserMessage } from '@/api/homepage'
import { getUserDetail } from '@/api/homepage'
import request from '@/utils/request'
@@ -64,7 +64,19 @@
try{
const res = await getUserDetailRefresh({userId});
console.log("res", res);
- setUserStats(res);
+ const data = res?.userInfo;
+
+ const formatted: UserStats = {
+ username: data.username,
+ uploadAmount: data.uploadAmount,
+ level: data.level,
+ likes: data.likes,
+ following: data.following,
+ followers: data.followers,
+ mutualFollows: data.mutualFollows
+ };
+
+ setUserStats(formatted);
}catch(error){
console.error('获取用户信息错误', error);
}
@@ -73,6 +85,10 @@
const getUserPost = debounce(async () => {
try{
+
+ const url = `${getUserMessage}?userId=${userId}`;
+ console.log("请求发送:", url);
+
const res = await getUserMessageRefresh({userId});
console.log("res", res);
worksRef.current = res;
@@ -110,8 +126,8 @@
className={styles.userAvatar}
/>
<div className={styles.userInfo}>
- <h2 className={styles.username}>阳菜，放睛！</h2>
- <div className={styles.inviteCode}>邀请码：1314520</div>
+ <h2 className={styles.username}>{userStats?.username}</h2>
+ <div className={styles.inviteCode}>邀请码：123456</div>
<button className={styles.editButton}>编辑主页</button>
</div>
</div>
@@ -169,7 +185,7 @@
<h3 className={styles.sectionTitle}>宠物图</h3>
<div className={styles.petContainer}>
<img
- src="/assets/pet-blue-star.png"
+ src={Logo}
alt="蓝色星星宠物"
className={styles.petImage}
/>
diff --git a/src/views/search/search.module.css b/src/views/search/search.module.css
index 2e1f40a..4475d20 100644
--- a/src/views/search/search.module.css
+++ b/src/views/search/search.module.css
@@ -130,3 +130,28 @@
display: flex;
justify-content: flex-end;
}
+
+
+.secondaryHeader {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+ padding: 16px;
+ border-bottom: 1px solid var(--primary-color);
+ background-color: var(--light-color);
+}
+
+.results {
+ margin-top: 20px;
+ padding: 20px;
+}
+
+.resultList {
+ list-style: none;
+ padding: 0;
+}
+
+.resultItem {
+ border-bottom: 1px solid var(--primary-color);
+ padding: 12px 0;
+}
diff --git a/src/views/search/search.tsx b/src/views/search/search.tsx
index 6dba69c..bf252c5 100644
--- a/src/views/search/search.tsx
+++ b/src/views/search/search.tsx
@@ -2,6 +2,7 @@
import React, { useState, useEffect } from 'react';
import styles from './search.module.css';
import { useLocation } from "react-router-dom";
+import { getSearch } from '@/api/search'
interface PostItem {
postId: number;
@@ -32,19 +33,49 @@
11: "table",
},
video: {
- 20: "视频标签1",
- 21: "视频标签2",
- 22: "视频标签3",
+ 20: "chinese",
+ 21: "America",
+ 22: "Japan",
+ 23: "Koera",
+ 24: "Europe",
+ 25: "other",
+ 26: "Short",
+ 27: "plot",
+ 28: "comedy",
+ 29: "love",
+ 30: "action",
+ 31: "terror",
+ 32: "science fiction",
+ 33: "commit a crime",
+ 34: "Thriller",
},
music: {
- 40: "音乐标签1",
- 41: "音乐标签2",
- 42: "音乐标签3",
+ 40: "chinese",
+ 41: "America",
+ 42: "Japan",
+ 43: "Korea",
+ 44: "Europe",
+ 45: "other",
+ 46: "rap",
+ 47: "Electric sound",
+ 48: "Guofeng",
+ 49: "motion",
+ 50: "ballad",
+ 51: "Rock and roll",
+ 52: "classical",
},
software: {
- 60: "软件标签1",
- 61: "软件标签2",
- 62: "软件标签3",
+ 60: "android",
+ 61: "mac",
+ 62: "pc",
+ 63: "ios",
+ 64: "other",
+ 65: "life",
+ 66: "shopping",
+ 67: "video",
+ 68: "music",
+ 69: "read",
+ 70: "system",
},
};
@@ -64,13 +95,34 @@
};
useEffect(() => {
- fetch('/api/posts')
- .then((res) => res.json())
- .then((data) => {
+ if (!keyword) return;
+
+ const requestBody = {
+ keyword,
+ tags: [] // 可以为空
+ };
+
+ console.log("请求发送:", getSearch, requestBody);
+
+
+ fetch(getSearch, {
+ method: 'Get',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify(requestBody)
+ })
+ .then(res => res.json())
+ .then((res) => {
+ const data: PostItem[] = res.data;
setPosts(data);
setFilteredPosts(data);
+ })
+ .catch((error) => {
+ console.error('搜索请求失败:', error);
});
- }, []);
+ }, [keyword]);
+
const applyFilters = () => {
let filtered = posts;
@@ -94,6 +146,7 @@
};
return (
+ <div>
<div className={styles.secondaryHeader}>
<div className={styles.leftSection}>
<select
@@ -154,6 +207,26 @@
</div>
</div>
+ <div className={styles.results}>
+ {filteredPosts.length === 0 ? (
+ <p>暂无搜索结果</p>
+ ) : (
+ <ul className={styles.resultList}>
+ {filteredPosts.map((post) => (
+ <li key={post.postId} className={styles.resultItem}>
+ <h3>{post.postTitle || '无标题'}</h3>
+ <p>{post.postContent || '无内容'}</p>
+ <p>类型：{post.postType || '未知'} | 热度评分：{post.hotScore}</p>
+ </li>
+ ))}
+ </ul>
+ )}
+ </div>
+
+ </div>
+
+
+
);
};