diff --git a/src/components/Personal/Personal.jsx b/src/components/Personal/Personal.jsx
index 033952d..8c60baf 100644
--- a/src/components/Personal/Personal.jsx
+++ b/src/components/Personal/Personal.jsx
@@ -1,34 +1,91 @@
-import React from 'react';
-import { useNavigate,useLocation, Outlet } from 'react-router-dom';
+// Personal.jsx
+import React, { useState, useEffect } from 'react';
+import { useNavigate, useLocation, Outlet } from 'react-router-dom';
+import { getUserInfo, getDownloadQuota, getDownloadProgress } from '../../api/personal';
 import './Personal.css';
 import ActionCard from './ActionCard';
 
 const Personal = () => {
   const navigate = useNavigate();
-  const location = useLocation(); // 获取路由信息
-  
-  // 模拟用户数据
-  const userData = {
-    username: 'PT爱好者',
-    avatar: 'https://via.placeholder.com/150',
-    joinDate: '2023-01-15',
-    level: '中级会员',
-    points: 1250,
-    upload: '3.2TB',
-    download: '1.5TB',
-    ratio: '2.13',
-    downloadQuota: {
-      total: 10,  // 10GB
-      used: 3.7,  // 已使用3.7GB
-      remaining: 6.3  // 剩余6.3GB
+  const location = useLocation();
+  const [userData, setUserData] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const [downloadProgress, setDownloadProgress] = useState({});
+
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        // 并行获取用户信息和下载额度
+        const [userInfo, downloadQuota] = await Promise.all([
+          getUserInfo(),
+          getDownloadQuota()
+        ]);
+        
+        setUserData({
+          username: userInfo.username,
+          avatar: 'https://via.placeholder.com/150',
+          joinDate: userInfo.registTime,
+          level: userInfo.level, // 可以根据userInfo.level设置不同等级
+          points: userInfo.magicPoints,
+          upload: userInfo.upload,
+          download: userInfo.download,
+          ratio: userInfo.shareRate,
+          downloadQuota: {
+            total: downloadQuota.total,
+            used: downloadQuota.used,
+            remaining: downloadQuota.remaining
+          }
+        });
+      } catch (err) {
+        setError(err.message);
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    fetchData();
+  }, []);
+
+  // 获取下载进度数据
+  const fetchDownloadProgress = async () => {
+    try {
+      const progressData = await getDownloadProgress();
+      setDownloadProgress(progressData);
+    } catch (err) {
+      console.error('获取下载进度失败:', err);
     }
   };
 
+  useEffect(() => {
+    // 初始获取下载进度
+    fetchDownloadProgress();
+    
+    // 设置定时器，每10秒获取一次下载进度
+    const intervalId = setInterval(fetchDownloadProgress, 10000);
+    
+    // 组件卸载时清除定时器
+    return () => clearInterval(intervalId);
+  }, []);
+
+
+  if (loading) {
+    return <div className="loading">加载中...</div>;
+  }
+
+  if (error) {
+    return <div className="error">错误: {error}</div>;
+  }
+
+  if (!userData) {
+    return <div className="error">未获取到用户数据</div>;
+  }
+
   const features = [
     { 
-      title: '我的收藏', 
-      description: '查看收藏的资源',
-      path: '/personal/Favorite' // 相对路径
+      title: '兑换区', 
+      description: '下载量/邀请码',
+      path: '/personal/Exchange' // 相对路径
     },
     { 
       title: '上传记录', 
@@ -63,6 +120,23 @@
     }
   };
 
+  const formatSize = (bytes) => {
+    if (bytes < 1024) return `${bytes} B`;
+    const kb = bytes / 1024;
+    if (kb < 1024) return `${kb.toFixed(2)} KB`;
+    const mb = kb / 1024;
+    if (mb < 1024) return `${mb.toFixed(2)} MB`;
+    const gb = mb / 1024;
+    return `${gb.toFixed(2)} GB`;
+  };
+
+  // 添加进度条颜色函数
+  const getProgressColor = (percentage) => {
+    if (percentage < 0.3) return '#4CAF50'; // 绿色
+    if (percentage < 0.7) return '#FFC107'; // 黄色
+    return '#F44336'; // 红色
+  };
+
   return (
     <div className="personal-container">
       {/* 返回按钮 */}
@@ -82,7 +156,7 @@
             <h2 className="username">{userData.username}</h2>
             <div className="user-meta">
               <span>加入时间: {userData.joinDate}</span>
-              <span>等级: {userData.level}</span>
+              <span>会员等级: Lv.{userData.level}</span> 
             </div>
           </div>
         </div>
@@ -90,16 +164,16 @@
         {/* 用户数据统计 */}
         <div className="stats-grid">
           <div className="stat-item">
-            <div className="stat-label">积分</div>
+            <div className="stat-label">保种积分</div>
             <div className="stat-value">{userData.points}</div>
           </div>
           <div className="stat-item">
             <div className="stat-label">上传量</div>
-            <div className="stat-value">{userData.upload}</div>
+            <div className="stat-value">{formatSize(userData.upload)}</div>
           </div>
           <div className="stat-item">
             <div className="stat-label">下载量</div>
-            <div className="stat-value">{userData.download}</div>
+            <div className="stat-value">{formatSize(userData.download)}</div>
           </div>
           <div className="stat-item">
             <div className="stat-label">分享率</div>
@@ -112,17 +186,46 @@
       <div className="quota-card">
         <h3>下载额度</h3>
         <div className="quota-info">
-          <span className="quota-used">{userData.downloadQuota.used}GB 已使用</span>
-          <span className="quota-remaining">{userData.downloadQuota.remaining}GB 剩余</span>
+          <span className="quota-used">
+            {formatSize(userData.downloadQuota.used)} 已使用
+          </span>
+          <span className="quota-remaining">
+            {formatSize(userData.downloadQuota.remaining)} 剩余
+          </span>
         </div>
         <div className="progress-bar">
           <div 
             className="progress-fill"
-            style={{ width: `${(userData.downloadQuota.used / userData.downloadQuota.total) * 100}%` }}
+            style={{ 
+              width: `${(userData.downloadQuota.used / userData.downloadQuota.total) * 100}%`,
+              backgroundColor: getProgressColor(userData.downloadQuota.used / userData.downloadQuota.total)
+            }}
           ></div>
         </div>
-        <div className="quota-total">总额度: {userData.downloadQuota.total}GB</div>
+        <div className="quota-total">
+          总额度: {formatSize(userData.downloadQuota.total)}
+        </div>
       </div>
+
+      {Object.keys(downloadProgress).length > 0 && (
+        <div className="progress-card">
+          <h3>当前下载进度</h3>
+          {Object.entries(downloadProgress).map(([taskId, progress]) => (
+            <div key={taskId} className="download-task">
+              <div className="task-info">
+                <span className="task-id">任务: {taskId.substring(0, 8)}...</span>
+                <span className="task-progress">{Math.round(progress * 100)}%</span>
+              </div>
+              <div className="progress-bar">
+                <div 
+                  className="progress-fill"
+                  style={{ width: `${progress * 100}%` }}
+                ></div>
+              </div>
+            </div>
+          ))}
+        </div>
+      )}
       
       {/* 功能卡片区 */}
       <div className="action-cards">
