Files
MMGame/frontend/src/components/Navbar.tsx
T

31 lines
768 B
TypeScript

import { Link, useNavigate } from 'react-router-dom'
import { useStore } from '../store'
export function Navbar() {
const { user, logout } = useStore()
const navigate = useNavigate()
const handleLogout = () => {
logout()
navigate('/')
}
return (
<nav>
<Link to="/" className="logo">AI 剧本杀</Link>
<div className="nav-links">
<Link to="/scripts">剧本库</Link>
{user ? (
<>
<Link to="/history">历史记录</Link>
<span style={{ color: '#aaa', fontSize: 14 }}>{user.nickname}</span>
<button className="btn-ghost" onClick={handleLogout}>退出</button>
</>
) : (
<Link to="/login">登录</Link>
)}
</div>
</nav>
)
}