36 lines
1.2 KiB
JavaScript
36 lines
1.2 KiB
JavaScript
import { useNavigate } from 'react-router-dom'
|
||
import { useAuth } from '../auth/AuthContext.jsx'
|
||
|
||
export default function MePage() {
|
||
const { user, logout } = useAuth()
|
||
const navigate = useNavigate()
|
||
|
||
async function onLogout() {
|
||
if (!confirm('确定退出登录?')) return
|
||
await logout()
|
||
navigate('/login', { replace: true })
|
||
}
|
||
|
||
return (
|
||
<div>
|
||
<div className="me-header">
|
||
<div className="me-name">{user?.name || '用户'}</div>
|
||
<div className="me-email">{user?.email}</div>
|
||
</div>
|
||
<div className="me-list">
|
||
<div className="list-item">
|
||
<span className="label">用户 ID</span>
|
||
<span className="value">#{user?.id}</span>
|
||
</div>
|
||
<div className="list-item">
|
||
<span className="label">注册时间</span>
|
||
<span className="value">{user?.createdAt ? new Date(user.createdAt).toLocaleDateString() : '-'}</span>
|
||
</div>
|
||
<div className="list-item" onClick={onLogout} role="button" style={{ cursor: 'pointer' }}>
|
||
<span className="label danger">退出登录</span>
|
||
<span className="value">›</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
} |