diff --git a/src/components/Personal/Setting.jsx b/src/components/Personal/Setting.jsx
index 967be6c..9ba07e8 100644
--- a/src/components/Personal/Setting.jsx
+++ b/src/components/Personal/Setting.jsx
@@ -1,97 +1,161 @@
-import React, { useState } from 'react';
-import { useNavigate,useLocation } from 'react-router-dom';
+import React, { useState,useEffect } from 'react';
+import { useNavigate, useLocation } from 'react-router-dom';
+import { getUserInfo, updatePassword } from '../../api/personal';
 import './personalSubpage.css';
 
 const Setting = ({ onLogout }) => {
   const navigate = useNavigate();
   const location = useLocation();
-  // 模拟数据
-  const [formData, setFormData] = useState({
-    username: 'user123',
-    email: 'user@example.com',
-    notification: true
+  const [userInfo, setUserInfo] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [success, setSuccess] = useState(null);
+  const [passwordForm, setPasswordForm] = useState({
+    oldPassword: '',
+    newPassword: '',
+    confirmPassword: ''
   });
 
-  const handleChange = (e) => {
-    const { name, value, type, checked } = e.target;
-    setFormData(prev => ({
+  // 获取用户信息
+  useEffect(() => {
+    const fetchUserInfo = async () => {
+      try {
+        const info = await getUserInfo();
+        setUserInfo(info);
+      } catch (err) {
+        console.error('获取用户信息失败:', err);
+      }
+    };
+    fetchUserInfo();
+  }, []);
+
+  const handleBack = () => {
+    navigate('/personal', { 
+      state: { 
+        fromSubpage: true,
+        dashboardTab: location.state?.dashboardTab
+      },
+      replace: true
+    });
+  };
+
+  const handlePasswordChange = (e) => {
+    const { name, value } = e.target;
+    setPasswordForm(prev => ({
       ...prev,
-      [name]: type === 'checkbox' ? checked : value
+      [name]: value
     }));
   };
 
-  const handleSubmit = (e) => {
+  const handlePasswordSubmit = async (e) => {
     e.preventDefault();
-    alert('设置已保存');
-  };
+    setError(null);
+    setSuccess(null);
 
-  const handleBack = () => {
-    // 返回个人中心，并携带来源标记
-    navigate('/personal', { 
-      state: { 
-        fromSubpage: true,  // 标记来自子页面
-        dashboardTab: location.state?.dashboardTab // 保留Dashboard的标签页状态
-      },
-      replace: true  // 替换当前历史记录
-    });
+    // 验证表单
+    if (!passwordForm.oldPassword || !passwordForm.newPassword || !passwordForm.confirmPassword) {
+      setError('请填写所有密码字段');
+      return;
+    }
+
+    if (passwordForm.newPassword !== passwordForm.confirmPassword) {
+      setError('新密码与确认密码不一致');
+      return;
+    }
+
+    if (passwordForm.newPassword.length < 6) {
+      setError('新密码长度至少为6位');
+      return;
+    }
+
+    try {
+      setLoading(true);
+      await updatePassword(passwordForm.oldPassword, passwordForm.newPassword);
+      setSuccess('密码修改成功');
+      setPasswordForm({
+        oldPassword: '',
+        newPassword: '',
+        confirmPassword: ''
+      });
+    } catch (err) {
+      setError(err.message || '修改密码失败');
+    } finally {
+      setLoading(false);
+    }
   };
 
   return (
     <div className="subpage-container">
-      <button className="back-button" onClick={(handleBack)}>
+      <button className="back-button" onClick={handleBack}>
         ← 返回个人中心
       </button>
 
-      <h2 className="page-title">账号设置</h2>
-      
-      <form onSubmit={handleSubmit}>
-        <div className="form-group">
-          <label className="form-label">用户名</label>
-          <input
-            type="text"
-            name="username"
-            value={formData.username}
-            onChange={handleChange}
-            className="form-input"
-          />
+      <h2 className="page-title">个人设置</h2>
+
+      <div className="setting-section">
+        <div className="user-info-card">
+          <h3>账户信息</h3>
+          <div className="info-item">
+            <label>用户名:</label>
+            <span>{userInfo?.username || '加载中...'}</span>
+          </div>
+          <p className="info-note">用户名不可更改</p>
         </div>
 
-        <div className="form-group">
-          <label className="form-label">电子邮箱</label>
-          <input
-            type="email"
-            name="email"
-            value={formData.email}
-            onChange={handleChange}
-            className="form-input"
-          />
-        </div>
+        <div className="password-form-card">
+          <h3>修改密码</h3>
+          <form onSubmit={handlePasswordSubmit}>
+            <div className="form-group">
+              <label htmlFor="oldPassword">原密码:</label>
+              <input
+                type="password"
+                id="oldPassword"
+                name="oldPassword"
+                value={passwordForm.oldPassword}
+                onChange={handlePasswordChange}
+                required
+              />
+            </div>
 
-        <div className="form-group">
-          <label className="form-label">
-            <input
-              type="checkbox"
-              name="notification"
-              checked={formData.notification}
-              onChange={handleChange}
-            />
-            接收邮件通知
-          </label>
-        </div>
+            <div className="form-group">
+              <label htmlFor="newPassword">新密码:</label>
+              <input
+                type="password"
+                id="newPassword"
+                name="newPassword"
+                value={passwordForm.newPassword}
+                onChange={handlePasswordChange}
+                required
+                minLength="6"
+              />
+            </div>
 
-        <div className="form-actions">
-          <button type="submit" className="action-btn">
-            保存设置
-          </button>
-          <button 
-            type="button" 
-            className="action-btn danger-btn"
-            onClick={onLogout}
-          >
-            退出登录
-          </button>
+            <div className="form-group">
+              <label htmlFor="confirmPassword">确认新密码:</label>
+              <input
+                type="password"
+                id="confirmPassword"
+                name="confirmPassword"
+                value={passwordForm.confirmPassword}
+                onChange={handlePasswordChange}
+                required
+                minLength="6"
+              />
+            </div>
+
+            {error && <div className="error-message">{error}</div>}
+            {success && <div className="success-message">{success}</div>}
+
+            <button 
+              type="submit" 
+              className="submit-button"
+              disabled={loading}
+            >
+              {loading ? '处理中...' : '修改密码'}
+            </button>
+          </form>
         </div>
-      </form>
+      </div>
     </div>
   );
 };
