修改个人中心
Change-Id: I12098cefccf17e48c5fae86771969bad455aa04f
diff --git a/src/pages/UserCenter/UserProfile.jsx b/src/pages/UserCenter/UserProfile.jsx
index fb472c8..902fbb7 100644
--- a/src/pages/UserCenter/UserProfile.jsx
+++ b/src/pages/UserCenter/UserProfile.jsx
@@ -1,8 +1,161 @@
+// import React, { useEffect, useState } from 'react';
+// import axios from 'axios';
+// import './UserProfile.css';
+// import UserNav from './UserNav';
+// import Header from '../../components/Header';
+// import { useUser } from '../../context/UserContext';
+
+// const DEFAULT_AVATAR_URL = `${process.env.PUBLIC_URL}/default-avatar.png`;
+
+// const UserProfile = () => {
+// const { user, loading } = useUser();
+// const [userProfile, setUserProfile] = useState(null);
+// const [error, setError] = useState(null);
+
+// useEffect(() => {
+// if (loading) return;
+// if (!user || !user.userId) {
+// setError('未登录或用户信息缺失');
+// setUserProfile(null);
+// return;
+// }
+
+// const fetchUserProfile = async () => {
+// try {
+// setError(null);
+// const { data: raw } = await axios.get(`/echo/user/${user.userId}/getProfile`);
+
+// if (!raw) {
+// setError('用户数据为空');
+// setUserProfile(null);
+// return;
+// }
+
+// const profile = {
+// avatarUrl: raw.avatarUrl
+// ? `${process.env.REACT_APP_AVATAR_BASE_URL}${raw.avatarUrl}`
+// : DEFAULT_AVATAR_URL,
+// nickname: raw.username || '未知用户',
+// email: raw.email || '未填写',
+// gender: raw.gender || '保密',
+// bio: raw.description || '无',
+// interests: raw.hobbies ? raw.hobbies.split(',') : [],
+// level: raw.level || '未知',
+// experience: raw.experience ?? 0,
+// uploadAmount: raw.uploadCount ?? 0,
+// downloadAmount: raw.downloadCount ?? 0,
+// shareRate: raw.shareRate ?? 0,
+// joinedDate: raw.registrationTime,
+// };
+
+// setUserProfile(profile);
+// } catch (err) {
+// setError(err.response?.status === 404 ? '用户不存在' : '请求失败，请稍后再试');
+// setUserProfile(null);
+// }
+// };
+
+// fetchUserProfile();
+// }, [user, loading]);
+
+// const handleAvatarUpload = async (e) => {
+// const file = e.target.files[0];
+// if (!file) return;
+
+// const formData = new FormData();
+// formData.append('file', file);
+
+// try {
+// const { data } = await axios.post(
+// `/echo/user/${user.userId}/uploadAvatar`,
+// formData,
+// { headers: { 'Content-Type': 'multipart/form-data' } }
+// );
+
+// if (data?.avatarUrl) {
+// setUserProfile((prev) => ({
+// ...prev,
+// avatarUrl: `${process.env.REACT_APP_AVATAR_BASE_URL}${data.avatarUrl}`,
+// }));
+// alert('头像上传成功');
+// } else {
+// alert('头像上传成功，但未返回新头像地址');
+// }
+// } catch (err) {
+// console.error('上传失败:', err);
+// alert('头像上传失败，请重试');
+// }
+// };
+
+// if (loading) return <p>正在加载用户信息...</p>;
+// if (error) return <p className="error">{error}</p>;
+// if (!userProfile) return null;
+
+// const {
+// avatarUrl,
+// nickname,
+// email,
+// gender,
+// bio,
+// interests,
+// level,
+// experience,
+// uploadAmount,
+// downloadAmount,
+// shareRate,
+// joinedDate,
+// } = userProfile;
+
+// return (
+// <div className="user-profile-container">
+// <Header />
+// <div className="user-center">
+// <div className="user-nav-container">
+// <UserNav />
+// </div>
+// <div className="common-card">
+// <div className="right-content">
+// <div className="profile-header">
+// <div className="avatar-wrapper">
+// <img src={avatarUrl} alt={nickname} className="avatar" />
+// <label htmlFor="avatar-upload" className="avatar-upload-label">
+// 上传头像
+// </label>
+// <input
+// type="file"
+// id="avatar-upload"
+// accept="image/*"
+// style={{ display: 'none' }}
+// onChange={handleAvatarUpload}
+// />
+// </div>
+// <h1>{nickname}</h1>
+// </div>
+
+// <div className="profile-details">
+// <p><strong>邮箱：</strong>{email}</p>
+// <p><strong>性别：</strong>{gender}</p>
+// <p><strong>个人简介：</strong>{bio}</p>
+// <p><strong>兴趣：</strong>{interests.length > 0 ? interests.join(', ') : '无'}</p>
+// <p><strong>等级：</strong>{level}</p>
+// <p><strong>经验：</strong>{experience}</p>
+// <p><strong>上传量：</strong>{uploadAmount}</p>
+// <p><strong>下载量：</strong>{downloadAmount}</p>
+// <p><strong>分享率：</strong>{(shareRate * 100).toFixed(2)}%</p>
+// <p><strong>加入时间：</strong>{new Date(joinedDate).toLocaleDateString()}</p>
+// </div>
+// </div>
+// </div>
+// </div>
+// </div>
+// );
+// };
+
+// export default UserProfile;
+
import React, { useEffect, useState } from 'react';
import axios from 'axios';
import './UserProfile.css';
-import UserNav from './UserNav';
-import Header from '../../components/Header';
import { useUser } from '../../context/UserContext';
const DEFAULT_AVATAR_URL = `${process.env.PUBLIC_URL}/default-avatar.png`;
@@ -107,44 +260,36 @@
} = userProfile;
return (
- <div className="user-profile-container">
- <Header />
- <div className="user-center">
- <div className="user-nav-container">
- <UserNav />
- </div>
- <div className="common-card">
- <div className="right-content">
- <div className="profile-header">
- <div className="avatar-wrapper">
- <img src={avatarUrl} alt={nickname} className="avatar" />
- <label htmlFor="avatar-upload" className="avatar-upload-label">
- 上传头像
- </label>
- <input
- type="file"
- id="avatar-upload"
- accept="image/*"
- style={{ display: 'none' }}
- onChange={handleAvatarUpload}
- />
- </div>
- <h1>{nickname}</h1>
- </div>
-
- <div className="profile-details">
- <p><strong>邮箱：</strong>{email}</p>
- <p><strong>性别：</strong>{gender}</p>
- <p><strong>个人简介：</strong>{bio}</p>
- <p><strong>兴趣：</strong>{interests.length > 0 ? interests.join(', ') : '无'}</p>
- <p><strong>等级：</strong>{level}</p>
- <p><strong>经验：</strong>{experience}</p>
- <p><strong>上传量：</strong>{uploadAmount}</p>
- <p><strong>下载量：</strong>{downloadAmount}</p>
- <p><strong>分享率：</strong>{(shareRate * 100).toFixed(2)}%</p>
- <p><strong>加入时间：</strong>{new Date(joinedDate).toLocaleDateString()}</p>
- </div>
+ <div className="common-card">
+ <div className="right-content">
+ <div className="profile-header">
+ <div className="avatar-wrapper">
+ <img src={avatarUrl} alt={nickname} className="avatar" />
+ <label htmlFor="avatar-upload" className="avatar-upload-label">
+ 上传头像
+ </label>
+ <input
+ type="file"
+ id="avatar-upload"
+ accept="image/*"
+ style={{ display: 'none' }}
+ onChange={handleAvatarUpload}
+ />
</div>
+ <h1>{nickname}</h1>
+ </div>
+
+ <div className="profile-details">
+ <p><strong>邮箱：</strong>{email}</p>
+ <p><strong>性别：</strong>{gender}</p>
+ <p><strong>个人简介：</strong>{bio}</p>
+ <p><strong>兴趣：</strong>{interests.length > 0 ? interests.join(', ') : '无'}</p>
+ <p><strong>等级：</strong>{level}</p>
+ <p><strong>经验：</strong>{experience}</p>
+ <p><strong>上传量：</strong>{uploadAmount}</p>
+ <p><strong>下载量：</strong>{downloadAmount}</p>
+ <p><strong>分享率：</strong>{(shareRate * 100).toFixed(2)}%</p>
+ <p><strong>加入时间：</strong>{new Date(joinedDate).toLocaleDateString()}</p>
</div>
</div>
</div>
@@ -152,3 +297,4 @@
};
export default UserProfile;
+