diff --git a/src/App.js b/src/App.js
index a9b0d85..82a5def 100644
--- a/src/App.js
+++ b/src/App.js
@@ -18,6 +18,8 @@
 import CreateMoment from './pages/FriendMoments/CreateMoment';
 // import LevelPage from './pages/LevelPage/LevelPage';
 import NewbieTasks from './pages/UserCenter/NewbieTasks';
+import LevelPage from './pages/LevelPage/LevelPage';
+// import NewbieTasks from './pages/UserCenter/NewbieTasks';
 import UserDynamics from './pages/UserCenter/UserDynamics';
 import UserFriends from './pages/UserCenter/UserFriends';
 import UserCollect from './pages/UserCenter/UserCollect';
@@ -25,6 +27,7 @@
 import UserInfo from './pages/UserInfo/UserInfo';
 import UserLayout from './pages/UserCenter/UserLayout';
 import NewUserGuide from './pages/NewUserGuide/NewUserGuide';
+import Recharge from './pages/Recharge/Recharge';
 
 function RedirectToAuth() {
   if (typeof window !== 'undefined') {
@@ -80,9 +83,9 @@
           <Route path="/user/profile" component={() => (
             <PrivateRoute component={() => <UserLayout><UserProfile /></UserLayout>} />
           )} />
-          <Route path="/user/newbie-tasks" component={() => (
+          {/* <Route path="/user/newbie-tasks" component={() => (
             <PrivateRoute component={() => <UserLayout><NewbieTasks /></UserLayout>} />
-          )} />
+          )} /> */}
           <Route path="/user/dynamics" component={() => (
             <PrivateRoute component={() => <UserLayout><UserDynamics /></UserLayout>} />
           )} />
@@ -95,7 +98,11 @@
           <Route path="/user/invite" component={() => (
             <PrivateRoute component={() => <UserLayout><UserInvite /></UserLayout>} />
           )} />
-        </>
+          <Route path ="user/recharge" component={() => (
+            <PrivateRoute component={() => <UserLayout><Recharge /></UserLayout>} />
+          )} />
+
+             </>
       </GroupProvider>
     </UserProvider>
   );
diff --git a/src/pages/NewUserGuide/NewUserGuide.jsx b/src/pages/NewUserGuide/NewUserGuide.jsx
index 4c4d634..7a3dad1 100644
--- a/src/pages/NewUserGuide/NewUserGuide.jsx
+++ b/src/pages/NewUserGuide/NewUserGuide.jsx
@@ -1,6 +1,7 @@
-import Header from '../../components/Header';
 import React, { useState } from 'react';
+import Header from '../../components/Header';
 import './NewUserGuide.css';
+import NewbieTasks from './NewbieTasks.jsx';
 
 const NewUserGuide = () => {
   const [activeTab, setActiveTab] = useState('terms');
@@ -11,13 +12,15 @@
         return (
           <div className="guide-content">
             <h2>名词解释</h2>
-            <p>在本平台中，我们使用以下术语：</p>
+            <p>在echo Torrent中，我们使用以下术语：</p>
             <ul>
-              <li><strong>种子：</strong> 表示可下载的资源文件索引信息。</li>
+              <li><strong>Tracker：</strong> 监测用户流量的服务器。</li>
+              <li><strong>种子：</strong> 扩展名为.torrent的文件，主要包含文件信息、Tracker信息等。在本站发布的种子。每个用户下载都会下载包含特定信息的种子以便Tracker记录不同用户的流量情况。</li>
+              <li><strong>流量：</strong> 分为上传量（通过本站Tracker向其他用户上传的数据总量）和下载量（通过本站Tracker从其他用户下载的数据总量）。</li>
               <li><strong>做种：</strong> 指上传资源供他人下载。</li>
-              <li><strong>分享率：</strong> 上传流量与下载流量的比值。</li>
-              <li><strong>魔力值：</strong> 用于奖励活跃用户的虚拟积分。</li>
-              {/* 可继续添加名词 */}
+              <li><strong>分享率：</strong> 分享率＝上传量/下载量</li>
+              <li><strong>经验值：</strong> 用于奖励活跃用户的虚拟积分。</li>
+              <li><strong>金币：</strong> 用于兑换虚拟物品的虚拟货币，可在个人中心充值。</li>
             </ul>
           </div>
         );
@@ -30,21 +33,14 @@
               <li>浏览并下载感兴趣的种子资源</li>
               <li>做种、评论、评分获得积分</li>
               <li>发布你的第一个种子</li>
-              {/* 可继续扩展详细步骤 */}
             </ol>
           </div>
         );
       case 'tasks':
         return (
           <div className="guide-content">
-            <h2>成长任务</h2>
-            <p>完成以下任务可快速熟悉平台并获得奖励：</p>
-            <ul>
-              <li>🎯 浏览任意种子页面</li>
-              <li>🗣️ 在论坛发一条评论</li>
-              <li>📤 上传你的第一个资源</li>
-              <li>🌟 连续登录 3 天</li>
-            </ul>
+            <NewbieTasks /> 
+            {/* ✅ 使用真实组件替换静态任务列表 */}
           </div>
         );
       default:
@@ -76,7 +72,9 @@
             成长任务
           </button>
         </div>
-        <div className="guide-main">{renderContent()}</div>
+        <div className="guide-main">
+          {renderContent()}
+        </div>
       </div>
     </div>
   );
diff --git a/src/pages/NewUserGuide/NewbieTasks.css b/src/pages/NewUserGuide/NewbieTasks.css
new file mode 100644
index 0000000..4d64389
--- /dev/null
+++ b/src/pages/NewUserGuide/NewbieTasks.css
@@ -0,0 +1,64 @@
+.newbie-tasks {
+  font-size: 16px;
+  line-height: 1.6;
+}
+
+.task-list ul {
+  list-style: none;
+  padding: 0;
+}
+
+.task-card {
+  background-color: #f9f9f9;
+  border-radius: 12px;
+  padding: 15px;
+  margin-bottom: 15px;
+  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
+}
+
+.task-btn-group {
+  display: flex;
+  gap: 10px;
+  margin-top: 10px;
+}
+
+.task-btn-group button {
+  padding: 6px 12px;
+  border: none;
+  border-radius: 6px;
+  background-color: #0057ff;
+  color: white;
+  cursor: pointer;
+  transition: background-color 0.3s;
+}
+
+.task-btn-group button:hover {
+  background-color: #003fcc;
+}
+
+.status-completed {
+  color: green;
+}
+.status-pending {
+  color: orange;
+}
+.status-failed {
+  color: red;
+}
+.newbie-tasks {
+  max-width: 800px;
+  margin: 0 auto;
+  padding: 20px;
+  background-color: #fff;
+  border-radius: 12px;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
+}
+
+.task-card {
+  background-color: #f9f9f9;
+  border-radius: 12px;
+  padding: 15px;
+  margin-bottom: 20px;
+  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
+  border: 1px solid #eee;
+}
diff --git a/src/pages/NewUserGuide/NewbieTasks.jsx b/src/pages/NewUserGuide/NewbieTasks.jsx
new file mode 100644
index 0000000..5ff6a9c
--- /dev/null
+++ b/src/pages/NewUserGuide/NewbieTasks.jsx
@@ -0,0 +1,154 @@
+// export default NewbieTasks;
+import React, { useEffect, useState } from 'react';
+import axios from 'axios';
+
+const NewbieTasks = () => {
+  const [tasks, setTasks] = useState([]);
+  const [experience, setExperience] = useState({});
+  const [currentStep, setCurrentStep] = useState({});
+  const [loading, setLoading] = useState(true);
+
+  const baseURL = '/echo/task/tutorial';
+  const userId = 1;
+
+  const fetchTasks = async () => {
+    try {
+      const response = await axios.get(`${baseURL}/getAllTasks`, {
+        params: { user_id: userId },
+      });
+      setTasks(response.data.tasks || []);
+    } catch (error) {
+      console.error('获取任务失败:', error);
+    }
+  };
+
+  const fetchExperience = async () => {
+    try {
+      const response = await axios.get(`${baseURL}/getAllTasks`, {
+        params: { user_id: userId },
+      });
+      setExperience(response.data || {});
+    } catch (error) {
+      console.error('获取经验失败:', error);
+    }
+  };
+
+  const fetchCurrentStep = async () => {
+    try {
+      const response = await axios.get(`${baseURL}/getNewStep`, {
+        params: { user_id: userId },
+      });
+      setCurrentStep(response.data || {});
+    } catch (error) {
+      console.error('获取引导步骤失败:', error);
+    }
+  };
+
+  const updateStatus = async (taskId) => {
+    try {
+      await axios.post(`${baseURL}/updateStatus`, {
+        user_id: userId,
+        task_id: taskId,
+      });
+      await fetchTasks();
+      await fetchExperience();
+    } catch (error) {
+      console.error('更新状态失败:', error);
+    }
+  };
+
+  const updateProgress = async (taskId, progress) => {
+    try {
+      await axios.post(`${baseURL}/updateProgress`, {
+        user_id: userId,
+        task_id: taskId,
+        progress,
+      });
+      await fetchTasks();
+    } catch (error) {
+      console.error('更新进度失败:', error);
+    }
+  };
+
+  const claimReward = async (taskId) => {
+    try {
+      await axios.post(`${baseURL}/rewardClaim`, {
+        user_id: userId,
+        task_id: taskId,
+      });
+      await fetchTasks();
+      await fetchExperience();
+    } catch (error) {
+      console.error('领取奖励失败:', error);
+    }
+  };
+
+  const checkRewardStatus = async (taskId) => {
+    try {
+      const response = await axios.post(`${baseURL}/rewardReview`, {
+        user_id: userId,
+        task_id: taskId,
+      });
+      alert(response.data.message || '已完成');
+    } catch (error) {
+      console.error('查看失败:', error);
+    }
+  };
+
+  useEffect(() => {
+    const init = async () => {
+      await fetchTasks();
+      await fetchExperience();
+      await fetchCurrentStep();
+      setLoading(false);
+    };
+    init();
+  }, []);
+
+  if (loading) return <p className="loading">加载中...</p>;
+
+  return (
+    <div className="common-card right-content">
+      <div className="profile-header">
+        <h1>🎯 成长任务</h1>
+      </div>
+
+      <div className="profile-details">
+        <p><strong>当前经验：</strong>{experience.current_experience}</p>
+        <p><strong>等级：</strong>{experience.level}</p>
+        <p><strong>奖励经验：</strong>{experience.reward?.experience || 0}</p>
+        <p><strong>奖励积分：</strong>{experience.reward?.points || 0}</p>
+      </div>
+
+      <div className="profile-details">
+        <p><strong>🧭 当前引导步骤：</strong>{currentStep.current_step}</p>
+        <p>{currentStep.step_description}</p>
+      </div>
+
+      <div className="profile-details">
+        <h2>任务列表</h2>
+        <ul>
+          {tasks.map(task => (
+            <li key={task.task_id} style={{ marginBottom: '20px', borderBottom: '1px solid #eee', paddingBottom: '10px' }}>
+              <p><strong>任务：</strong>{task.title}</p>
+              <p><strong>描述：</strong>{task.description}</p>
+              <p><strong>进度：</strong>{task.progress}%</p>
+              <p><strong>状态：</strong>{task.status}</p>
+              <p><strong>奖励：</strong>经验 {task.reward.experience}，积分 {task.reward.points}</p>
+
+              <div className="task-btn-group">
+                <button className="task-btn" onClick={() => updateStatus(task.task_id)}>更新状态</button>
+                <button className="task-btn" onClick={() => updateProgress(task.task_id, 100)}>提交进度</button>
+                <button className="task-btn" onClick={() => claimReward(task.task_id)}>领取奖励</button>
+                <button className="task-btn" onClick={() => checkRewardStatus(task.task_id)}>查看奖励状态</button>
+              </div>
+            </li>
+          ))}
+        </ul>
+      </div>
+    </div>
+  );
+};
+
+export default NewbieTasks;
+
diff --git a/src/pages/Recharge/Recharge.css b/src/pages/Recharge/Recharge.css
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/pages/Recharge/Recharge.css
diff --git a/src/pages/Recharge/Recharge.jsx b/src/pages/Recharge/Recharge.jsx
new file mode 100644
index 0000000..0df1837
--- /dev/null
+++ b/src/pages/Recharge/Recharge.jsx
@@ -0,0 +1,192 @@
+// import React, { useState } from 'react';
+// import axios from 'axios';
+// import { useUser } from '../../context/UserContext';
+
+// const Recharge = () => {
+//   const [amount, setAmount] = useState('');
+//   const [loading, setLoading] = useState(false);
+//   const [message, setMessage] = useState('');
+
+//   // 从上下文获取当前登录用户
+//   const { user } = useUser();
+//   const userId = user?.userId;
+
+//   const handleRecharge = async () => {
+//     if (!userId) {
+//       setMessage('未登录，无法充值');
+//       return;
+//     }
+//     if (!amount || isNaN(amount) || Number(amount) <= 0) {
+//       setMessage('请输入有效的充值金额');
+//       return;
+//     }
+//     setLoading(true);
+//     setMessage('');
+//     try {
+//       // 充值接口调用，注意后端用的是请求参数形式传递 userId 和 amount
+//       const response = await axios.post('/echo/user/recharge', null, {
+//         params: {
+//           userId,
+//           amount: Number(amount),
+//         },
+//       });
+//       setMessage(response.data.message || '充值成功！');
+//       setAmount('');
+//     } catch (error) {
+//       setMessage(error.response?.data?.message || '充值失败，请重试');
+//     } finally {
+//       setLoading(false);
+//     }
+//   };
+
+//   return (
+//     <div className="recharge-page">
+//       <h2>充值服务</h2>
+//       <div>
+//         <label>
+//           充值金额：
+//           <input
+//             type="number"
+//             min="1"
+//             value={amount}
+//             onChange={(e) => setAmount(e.target.value)}
+//             disabled={loading}
+//           />
+//         </label>
+//       </div>
+//       <button onClick={handleRecharge} disabled={loading}>
+//         {loading ? '处理中...' : '提交充值'}
+//       </button>
+//       {message && <p>{message}</p>}
+//     </div>
+//   );
+// };
+
+// export default Recharge;
+import React, { useState } from 'react';
+import axios from 'axios';
+import { useUser } from '../../context/UserContext';
+
+const Recharge = () => {
+  const [amount, setAmount] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [message, setMessage] = useState('');
+  const [showPayDialog, setShowPayDialog] = useState(false);
+  const [payProcessing, setPayProcessing] = useState(false);
+
+  const { user } = useUser();
+  const userId = user?.userId;
+
+  // 点击提交充值，打开模拟支付弹窗
+  const handleSubmit = () => {
+    if (!userId) {
+      setMessage('未登录，无法充值');
+      return;
+    }
+    if (!amount || isNaN(amount) || Number(amount) <= 0) {
+      setMessage('请输入有效的充值金额');
+      return;
+    }
+    setMessage('');
+    setShowPayDialog(true);
+  };
+
+  // 模拟支付弹窗点击“确认支付”
+  const handlePayConfirm = async () => {
+    setPayProcessing(true);
+    setMessage('');
+
+    // 模拟支付等待 2 秒
+    setTimeout(async () => {
+      try {
+        // 支付成功后调用后端充值接口
+        const response = await axios.post('/echo/user/recharge', null, {
+          params: {
+            userId,
+            amount: Number(amount),
+          },
+        });
+
+        setMessage(response.data.message || '充值成功！');
+        setAmount('');
+      } catch (error) {
+        setMessage(error.response?.data?.message || '充值失败，请重试');
+      } finally {
+        setPayProcessing(false);
+        setShowPayDialog(false);
+      }
+    }, 2000);
+  };
+
+  // 取消支付弹窗
+  const handlePayCancel = () => {
+    setShowPayDialog(false);
+    setMessage('支付已取消');
+  };
+
+  return (
+    <div className="recharge-page" style={{ maxWidth: 400, margin: 'auto', padding: 20 }}>
+      <h2>充值服务</h2>
+      <div style={{ marginBottom: 12 }}>
+        <label>
+          充值金额：
+          <input
+            type="number"
+            min="1"
+            value={amount}
+            onChange={(e) => setAmount(e.target.value)}
+            disabled={loading || payProcessing}
+            style={{ marginLeft: 8, width: 120 }}
+          />
+        </label>
+      </div>
+      <button onClick={handleSubmit} disabled={loading || payProcessing}>
+        {loading || payProcessing ? '处理中...' : '提交充值'}
+      </button>
+
+      {message && <p style={{ marginTop: 12 }}>{message}</p>}
+
+      {/* 模拟支付弹窗 */}
+      {showPayDialog && (
+        <div
+          style={{
+            position: 'fixed',
+            top: 0, left: 0, right: 0, bottom: 0,
+            backgroundColor: 'rgba(0,0,0,0.5)',
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+            zIndex: 1000,
+          }}
+        >
+          <div
+            style={{
+              backgroundColor: '#fff',
+              padding: 20,
+              borderRadius: 8,
+              width: 300,
+              textAlign: 'center',
+              boxShadow: '0 0 10px rgba(0,0,0,0.25)',
+            }}
+          >
+            <h3>模拟支付</h3>
+            <p>支付金额：{amount} 元</p>
+
+            {payProcessing ? (
+              <p>支付处理中，请稍候...</p>
+            ) : (
+              <>
+                <button onClick={handlePayConfirm} style={{ marginRight: 10 }}>
+                  确认支付
+                </button>
+                <button onClick={handlePayCancel}>取消</button>
+              </>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default Recharge;
diff --git a/src/pages/SeedList/SeedList.jsx b/src/pages/SeedList/SeedList.jsx
index adb2bb3..4f558fc 100644
--- a/src/pages/SeedList/SeedList.jsx
+++ b/src/pages/SeedList/SeedList.jsx
@@ -1,3 +1,4 @@
+// export default SeedList;
 import React, { useState, useEffect } from 'react';
 import { Link } from 'wouter';
 import axios from 'axios';
@@ -18,28 +19,28 @@
     const [errorMsg, setErrorMsg] = useState('');
     const { user } = useUser();
 
-
     const TAGS = ['猜你喜欢', '电影', '电视剧', '动漫', '音乐', '游戏', '综艺', '软件', '体育', '学习', '纪录片', '其他'];
 
-    const CATEGORY_MAP = {
-        '电影': '电影',
-        '电视剧': '电视剧',
-        '动漫': '动漫',
-        '音乐': '音乐',
-        '游戏': '游戏',
-        '综艺': '综艺',
-        '软件': '软件',
-        '体育': '体育',
-        '学习': '学习',
-        '纪录片': '纪录片',
-        '其他': '其他',
+const CATEGORY_MAP = {
+        '电影': 'movie',
+        '电视剧': 'tv',
+        '动漫': 'anime',
+        '音乐': 'music',
+        '游戏': 'game',
+        '综艺': 'variety',
+        '软件': 'software',
+        '体育': 'sports',
+        '学习': 'study',
+        '纪录片': 'documentary',
+        '其他': 'other',
         '猜你喜欢': '',        
         '种子列表': '',        
-    };
+};
+
 
     const buildQueryParams = () => {
         const category = CATEGORY_MAP[activeTab] || '';
-        const orderKey = sortOption === '最新' ? ['upload_time'] : (sortOption === '最热' ? ['downloads'] : ['upload_time']);
+        const orderKey = sortOption === '最新' ? 'upload_time' : (sortOption === '最热' ? 'downloads' : 'upload_time');
         const params = {
             page: 1,
             size: 20,
@@ -72,8 +73,7 @@
         setErrorMsg('');
         try {
             const params = buildQueryParams();
-            const response = await axios.get('/seeds/list', params);
-            // const response = await axios.get('/seeds/list', { params });
+            const response = await axios.get('/seeds/list', { params });
 
             const data = response.data;
 
@@ -119,7 +119,6 @@
         fetchSeeds();
     }, [activeTab, sortOption, selectedFilters, tagMode, searchTerm]);
 
-    // ✅ 修改后的下载函数
     const handleDownload = async (seedId) => {
         if (!user || !user.userId) {
             alert('请先登录再下载种子文件');
@@ -254,7 +253,6 @@
                         </div>
                         <div className="seed-list-body">
                             {seeds.map((seed, index) => {
-                                // 处理 tags 字段，兼容字符串和数组
                                 let tagsArray = [];
                                 if (seed.tags) {
                                     if (Array.isArray(seed.tags)) {
@@ -263,18 +261,15 @@
                                         try {
                                             tagsArray = JSON.parse(seed.tags);
                                             if (!Array.isArray(tagsArray)) {
-                                                // 解析后不是数组，按逗号分割
                                                 tagsArray = seed.tags.split(',').map(t => t.trim()).filter(t => t);
                                             }
                                         } catch {
-                                            // 解析失败，按逗号分割
                                             tagsArray = seed.tags.split(',').map(t => t.trim()).filter(t => t);
                                         }
                                     }
                                 }
 
                                 return (
-                                    
                                    <Link to={`/seed/${seed.id}`} key={index} className="seed-item-link">
                                         <div className="seed-item">
                                             {seed.imageUrl && (
@@ -300,7 +295,7 @@
                                             <div className="seed-item-downloads">{seed.downloads ?? 0} 次下载</div>
                                             <div
                                                 className="seed-item-actions"
-                                                onClick={e => e.stopPropagation()} // 阻止事件冒泡，避免跳转
+                                                onClick={e => e.stopPropagation()}
                                             >
                                                 <button
                                                     className="btn-primary"
@@ -313,35 +308,34 @@
                                                     下载
                                                 </button>
                                                 <button
-    className="btn-outline"
-    onClick={async (e) => {
-        e.preventDefault();
-        e.stopPropagation();
+                                                    className="btn-outline"
+                                                    onClick={async (e) => {
+                                                        e.preventDefault();
+                                                        e.stopPropagation();
 
-        if (!user || !user.userId) {
-            alert('请先登录再收藏');
-            return;
-        }
+                                                        if (!user || !user.userId) {
+                                                            alert('请先登录再收藏');
+                                                            return;
+                                                        }
 
-        try {
-            const res = await axios.post(`/seeds/${seed.id}/favorite-toggle`, null, {
-                params: { user_id: user.userId },
-            });
+                                                        try {
+                                                            const res = await axios.post(`/seeds/${seed.id}/favorite-toggle`, null, {
+                                                                params: { user_id: user.userId },
+                                                            });
 
-            if (res.data.code === 0) {
-                alert('操作成功'); // 你可以改成 toast 或 icon 状态提示
-            } else {
-                alert(res.data.msg || '操作失败');
-            }
-        } catch (err) {
-            console.error('收藏失败:', err);
-            alert('收藏失败，请稍后再试。');
-        }
-    }}
->
-    收藏
-</button>
-
+                                                            if (res.data.code === 0) {
+                                                                alert('操作成功');
+                                                            } else {
+                                                                alert(res.data.msg || '操作失败');
+                                                            }
+                                                        } catch (err) {
+                                                            console.error('收藏失败:', err);
+                                                            alert('收藏失败，请稍后再试。');
+                                                        }
+                                                    }}
+                                                >
+                                                    收藏
+                                                </button>
                                             </div>
                                         </div>
                                     </Link>
diff --git a/src/pages/UserCenter/NewbieTasks.css b/src/pages/UserCenter/NewbieTasks.css
deleted file mode 100644
index 660cec3..0000000
--- a/src/pages/UserCenter/NewbieTasks.css
+++ /dev/null
@@ -1,20 +0,0 @@
-
-.task-btn {
-  margin-right: 8px;
-  padding: 6px 12px;
-  border: none;
-  border-radius: 6px;
-  background-color: #4a90e2;
-  color: white;
-  cursor: pointer;
-}
-
-.task-btn:hover {
-  background-color: #357abd;
-}
-
-.loading {
-  text-align: center;
-  font-size: 18px;
-  color: #333;
-}
diff --git a/src/pages/UserCenter/NewbieTasks.jsx b/src/pages/UserCenter/NewbieTasks.jsx
deleted file mode 100644
index 768f95a..0000000
--- a/src/pages/UserCenter/NewbieTasks.jsx
+++ /dev/null
@@ -1,327 +0,0 @@
-// import React, { useEffect, useState } from 'react';
-// import axios from 'axios';
-// import Header from '../../components/Header';
-// import './UserProfile.css'; // 复用个人资料页面的样式
-// import UserNav from './UserNav';
-
-// const NewbieTasks = () => {
-//   const [tasks, setTasks] = useState([]);
-//   const [experience, setExperience] = useState({});
-//   const [currentStep, setCurrentStep] = useState({});
-//   const [loading, setLoading] = useState(true);
-
-//   const baseURL = '/echo/task/tutorial';
-//   const userId = 1;
-
-//   // 获取所有任务
-//   const fetchTasks = async () => {
-//     try {
-//       const response = await axios.get(`${baseURL}/getAllTasks`, {
-//         params: { user_id: userId },
-//       });
-//       setTasks(response.data.tasks || []);
-//     } catch (error) {
-//       console.error('获取任务失败:', error);
-//     }
-//   };
-
-//   // 获取经验与等级信息
-//   const fetchExperience = async () => {
-//     try {
-//       const response = await axios.get(`${baseURL}/getAllTasks`, {
-//         params: { user_id: userId },
-//       });
-//       setExperience(response.data || {});
-//     } catch (error) {
-//       console.error('获取经验失败:', error);
-//     }
-//   };
-
-//   // 获取当前引导步骤
-//   const fetchCurrentStep = async () => {
-//     try {
-//       const response = await axios.get(`${baseURL}/getNewStep`, {
-//         params: { user_id: userId },
-//       });
-//       setCurrentStep(response.data || {});
-//     } catch (error) {
-//       console.error('获取引导步骤失败:', error);
-//     }
-//   };
-
-//   // 更新任务状态
-//   const updateStatus = async (taskId) => {
-//     try {
-//       await axios.post(`${baseURL}/updateStatus`, {
-//         user_id: userId,
-//         task_id: taskId,
-//       });
-//       await fetchTasks();
-//       await fetchExperience();
-//     } catch (error) {
-//       console.error('更新状态失败:', error);
-//     }
-//   };
-
-//   // 提交任务进度
-//   const updateProgress = async (taskId, progress) => {
-//     try {
-//       await axios.post(`${baseURL}/updateProgress`, {
-//         user_id: userId,
-//         task_id: taskId,
-//         progress,
-//       });
-//       await fetchTasks();
-//     } catch (error) {
-//       console.error('更新进度失败:', error);
-//     }
-//   };
-
-//   // 领取奖励
-//   const claimReward = async (taskId) => {
-//     try {
-//       await axios.post(`${baseURL}/rewardClaim`, {
-//         user_id: userId,
-//         task_id: taskId,
-//       });
-//       await fetchTasks();
-//       await fetchExperience();
-//     } catch (error) {
-//       console.error('领取奖励失败:', error);
-//     }
-//   };
-
-//   // 查看奖励是否已发放
-//   const checkRewardStatus = async (taskId) => {
-//     try {
-//       const response = await axios.post(`${baseURL}/rewardReview`, {
-//         user_id: userId,
-//         task_id: taskId,
-//       });
-//       alert(response.data.message || '已完成');
-//     } catch (error) {
-//       console.error('查看失败:', error);
-//     }
-//   };
-
-//   // 页面初始化
-//   useEffect(() => {
-//     const init = async () => {
-//       await fetchTasks();
-//       await fetchExperience();
-//       await fetchCurrentStep();
-//       setLoading(false);
-//     };
-//     init();
-//   }, []);
-
-//   if (loading) return <p className="loading">加载中...</p>;
-
-//   return (
-//     <div className="user-profile-container">
-//       <Header />
-//       <div className="user-center">
-//         <div className="user-nav-container">
-//           <UserNav activeKey="newbieTasks" onSelect={() => {}} />
-//         </div>
-
-//         <div className="common-card right-content">
-//           <div className="profile-header">
-//             <h1>🎯 新手考核</h1>
-//           </div>
-
-//           <div className="profile-details">
-//             <p><strong>当前经验：</strong>{experience.current_experience}</p>
-//             <p><strong>等级：</strong>{experience.level}</p>
-//             <p><strong>奖励经验：</strong>{experience.reward?.experience || 0}</p>
-//             <p><strong>奖励积分：</strong>{experience.reward?.points || 0}</p>
-//           </div>
-
-//           <div className="profile-details">
-//             <p><strong>🧭 当前引导步骤：</strong>{currentStep.current_step}</p>
-//             <p>{currentStep.step_description}</p>
-//           </div>
-
-//           <div className="profile-details">
-//             <h2>任务列表</h2>
-//             <ul>
-//               {tasks.map(task => (
-//                 <li key={task.task_id} style={{ marginBottom: '20px' }}>
-//                   <p><strong>任务：</strong>{task.title}</p>
-//                   <p><strong>描述：</strong>{task.description}</p>
-//                   <p><strong>进度：</strong>{task.progress}%</p>
-//                   <p><strong>状态：</strong>{task.status}</p>
-//                   <p><strong>奖励：</strong>经验 {task.reward.experience}，积分 {task.reward.points}</p>
-
-//                   <div style={{ marginTop: '10px' }}>
-//                     <button className="task-btn" onClick={() => updateStatus(task.task_id)}>更新状态</button>
-//                     <button className="task-btn" onClick={() => updateProgress(task.task_id, 100)}>提交进度</button>
-//                     <button className="task-btn" onClick={() => claimReward(task.task_id)}>领取奖励</button>
-//                     <button className="task-btn" onClick={() => checkRewardStatus(task.task_id)}>查看奖励是否已发放</button>
-//                   </div>
-//                 </li>
-//               ))}
-//             </ul>
-//           </div>
-//         </div>
-//       </div>
-//     </div>
-//   );
-// };
-
-// export default NewbieTasks;
-
-import React, { useEffect, useState } from 'react';
-import axios from 'axios';
-import './UserProfile.css'; // 继续复用样式
-
-const NewbieTasks = () => {
-  const [tasks, setTasks] = useState([]);
-  const [experience, setExperience] = useState({});
-  const [currentStep, setCurrentStep] = useState({});
-  const [loading, setLoading] = useState(true);
-
-  const baseURL = '/echo/task/tutorial';
-  const userId = 1;
-
-  const fetchTasks = async () => {
-    try {
-      const response = await axios.get(`${baseURL}/getAllTasks`, {
-        params: { user_id: userId },
-      });
-      setTasks(response.data.tasks || []);
-    } catch (error) {
-      console.error('获取任务失败:', error);
-    }
-  };
-
-  const fetchExperience = async () => {
-    try {
-      const response = await axios.get(`${baseURL}/getAllTasks`, {
-        params: { user_id: userId },
-      });
-      setExperience(response.data || {});
-    } catch (error) {
-      console.error('获取经验失败:', error);
-    }
-  };
-
-  const fetchCurrentStep = async () => {
-    try {
-      const response = await axios.get(`${baseURL}/getNewStep`, {
-        params: { user_id: userId },
-      });
-      setCurrentStep(response.data || {});
-    } catch (error) {
-      console.error('获取引导步骤失败:', error);
-    }
-  };
-
-  const updateStatus = async (taskId) => {
-    try {
-      await axios.post(`${baseURL}/updateStatus`, {
-        user_id: userId,
-        task_id: taskId,
-      });
-      await fetchTasks();
-      await fetchExperience();
-    } catch (error) {
-      console.error('更新状态失败:', error);
-    }
-  };
-
-  const updateProgress = async (taskId, progress) => {
-    try {
-      await axios.post(`${baseURL}/updateProgress`, {
-        user_id: userId,
-        task_id: taskId,
-        progress,
-      });
-      await fetchTasks();
-    } catch (error) {
-      console.error('更新进度失败:', error);
-    }
-  };
-
-  const claimReward = async (taskId) => {
-    try {
-      await axios.post(`${baseURL}/rewardClaim`, {
-        user_id: userId,
-        task_id: taskId,
-      });
-      await fetchTasks();
-      await fetchExperience();
-    } catch (error) {
-      console.error('领取奖励失败:', error);
-    }
-  };
-
-  const checkRewardStatus = async (taskId) => {
-    try {
-      const response = await axios.post(`${baseURL}/rewardReview`, {
-        user_id: userId,
-        task_id: taskId,
-      });
-      alert(response.data.message || '已完成');
-    } catch (error) {
-      console.error('查看失败:', error);
-    }
-  };
-
-  useEffect(() => {
-    const init = async () => {
-      await fetchTasks();
-      await fetchExperience();
-      await fetchCurrentStep();
-      setLoading(false);
-    };
-    init();
-  }, []);
-
-  if (loading) return <p className="loading">加载中...</p>;
-
-  return (
-    <div className="common-card right-content">
-      <div className="profile-header">
-        <h1>🎯 新手考核</h1>
-      </div>
-
-      <div className="profile-details">
-        <p><strong>当前经验：</strong>{experience.current_experience}</p>
-        <p><strong>等级：</strong>{experience.level}</p>
-        <p><strong>奖励经验：</strong>{experience.reward?.experience || 0}</p>
-        <p><strong>奖励积分：</strong>{experience.reward?.points || 0}</p>
-      </div>
-
-      <div className="profile-details">
-        <p><strong>🧭 当前引导步骤：</strong>{currentStep.current_step}</p>
-        <p>{currentStep.step_description}</p>
-      </div>
-
-      <div className="profile-details">
-        <h2>任务列表</h2>
-        <ul>
-          {tasks.map(task => (
-            <li key={task.task_id} style={{ marginBottom: '20px', borderBottom: '1px solid #eee', paddingBottom: '10px' }}>
-              <p><strong>任务：</strong>{task.title}</p>
-              <p><strong>描述：</strong>{task.description}</p>
-              <p><strong>进度：</strong>{task.progress}%</p>
-              <p><strong>状态：</strong>{task.status}</p>
-              <p><strong>奖励：</strong>经验 {task.reward.experience}，积分 {task.reward.points}</p>
-
-              <div className="task-btn-group">
-                <button className="task-btn" onClick={() => updateStatus(task.task_id)}>更新状态</button>
-                <button className="task-btn" onClick={() => updateProgress(task.task_id, 100)}>提交进度</button>
-                <button className="task-btn" onClick={() => claimReward(task.task_id)}>领取奖励</button>
-                <button className="task-btn" onClick={() => checkRewardStatus(task.task_id)}>查看奖励状态</button>
-              </div>
-            </li>
-          ))}
-        </ul>
-      </div>
-    </div>
-  );
-};
-
-export default NewbieTasks;
-
diff --git a/src/pages/UserCenter/UserNav.jsx b/src/pages/UserCenter/UserNav.jsx
index 3456195..c272424 100644
--- a/src/pages/UserCenter/UserNav.jsx
+++ b/src/pages/UserCenter/UserNav.jsx
@@ -14,6 +14,7 @@
     { to: '/user/collections', label: '我的收藏' },
     // { to: '/user/newbie-tasks', label: '新手考核' },
     { to: '/user/invite', label: '邀请新用户' },
+    { to: '/user/recharge', label: '充值服务' },
   ];
 
   // 判断路径是否是当前活动页面