fix: complete first version issue remediation

src/layouts/AppShell.tsx

@@ -11,7 +11,9 @@ import {
   PanelLeftOpen,
 } from 'lucide-react';
 import { NavLink, Outlet, useNavigate } from 'react-router-dom';
+import { adminApi } from '@/api/adminApi';
 import { clearSession } from '@/api/session';
+import { Button, Input, Modal } from '@/components/ui';
 
 export type ShellNavItem = {
   label: string;
@@ -56,6 +58,12 @@ export function AppShell({
   const [closedSections, setClosedSections] = useState<Record<string, boolean>>({});
   const [userMenuOpen, setUserMenuOpen] = useState(false);
   const [noticeOpen, setNoticeOpen] = useState(false);
+  const [passwordModalOpen, setPasswordModalOpen] = useState(false);
+  const [currentPassword, setCurrentPassword] = useState('');
+  const [newPassword, setNewPassword] = useState('');
+  const [confirmPassword, setConfirmPassword] = useState('');
+  const [passwordError, setPasswordError] = useState('');
+  const [passwordSaving, setPasswordSaving] = useState(false);
   const navigate = useNavigate();
   const ToggleIcon = collapsed ? PanelLeftOpen : PanelLeftClose;
   const auditTotal = useMemo(
@@ -63,6 +71,28 @@ export function AppShell({
     [auditNotifications],
   );
 
+  async function changeOwnPassword() {
+    if (!currentPassword || newPassword.length < 6) {
+      setPasswordError('请输入当前密码，新密码至少 6 位');
+      return;
+    }
+    if (newPassword !== confirmPassword) {
+      setPasswordError('两次输入的新密码不一致');
+      return;
+    }
+    setPasswordSaving(true);
+    setPasswordError('');
+    try {
+      await adminApi.changeOwnPassword({ currentPassword, password: newPassword });
+      clearSession();
+      navigate(loginPath, { replace: true });
+    } catch (error) {
+      setPasswordError(error instanceof Error ? error.message : '修改密码失败');
+    } finally {
+      setPasswordSaving(false);
+    }
+  }
+
   useEffect(() => {
     if (auditTotal <= 0 || typeof window === 'undefined') {
       return;
@@ -193,7 +223,7 @@ export function AppShell({
               </button>
               {userMenuOpen ? (
                 <div className="user-menu-popover" role="menu">
-                  <button onClick={() => setUserMenuOpen(false)} role="menuitem" type="button">
+                  <button onClick={() => { setUserMenuOpen(false); setPasswordModalOpen(true); setCurrentPassword(''); setNewPassword(''); setConfirmPassword(''); setPasswordError(''); }} role="menuitem" type="button">
                     <KeyRound size={16} />
                     修改密码
                   </button>
@@ -215,6 +245,19 @@ export function AppShell({
           <Outlet />
         </div>
       </main>
+      <Modal
+        footer={<><Button disabled={passwordSaving} onClick={() => setPasswordModalOpen(false)} variant="ghost">取消</Button><Button disabled={passwordSaving} icon={<KeyRound size={16} />} onClick={() => void changeOwnPassword()}>{passwordSaving ? '保存中...' : '确认修改'}</Button></>}
+        onClose={() => setPasswordModalOpen(false)}
+        open={passwordModalOpen}
+        title="修改密码"
+      >
+        <div className="admin-system-modal-form">
+          <Input label="当前密码" onChange={(event) => setCurrentPassword(event.target.value)} required type="password" value={currentPassword} />
+          <Input label="新密码" onChange={(event) => setNewPassword(event.target.value)} required type="password" value={newPassword} />
+          <Input label="确认新密码" onChange={(event) => setConfirmPassword(event.target.value)} required type="password" value={confirmPassword} />
+          {passwordError ? <p className="form-error">{passwordError}</p> : null}
+        </div>
+      </Modal>
     </div>
   );
 }