'use client';
|
|
import { useState, useEffect } from 'react';
|
import Link from 'next/link';
|
import { useRouter } from 'next/navigation';
|
|
export default function Page() {
|
const router = useRouter();
|
const [token, setToken] = useState<string | null>(null);
|
|
useEffect(() => {
|
// 获取token
|
const storedToken = localStorage.getItem('token');
|
setToken(storedToken);
|
|
// 如果没有token，直接跳转到登录页面
|
if (!storedToken) {
|
router.push('/login');
|
}
|
}, []);
|
|
// 如果没有token，不渲染任何内容
|
if (!token) {
|
return null;
|
}
|
|
return (
|
<div className="min-h-screen bg-[#0A1033] text-white">
|
{/* 顶部导航 */}
|
<div className="bg-[#131C41] p-4 border-b border-[#6ADBFF]/20">
|
<div className="max-w-4xl mx-auto flex justify-between items-center">
|
<Link href="/" className="text-[#6ADBFF] hover:underline flex items-center gap-2">
|
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
<path fillRule="evenodd" d="M9.707 16.707a1 1 0 01-1.414 0l-6-6a1 1 0 010-1.414l6-6a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l4.293 4.293a1 1 0 010 1.414z" clipRule="evenodd" />
|
</svg>
|
返回首页
|
</Link>
|
<h1 className="text-xl font-bold">AI助手对话</h1>
|
</div>
|
</div>
|
|
{/* 聊天区域 */}
|
<div className="max-w-4xl mx-auto p-4">
|
<div className="space-y-4 mb-20">
|
<div className="flex justify-start">
|
<div className="max-w-[80%] rounded-lg p-4 bg-[#131C41]">
|
<p>你好！欢迎来到聊天室。</p>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
{/* 输入区域 */}
|
<div className="fixed bottom-0 left-0 right-0 bg-[#131C41] border-t border-[#6ADBFF]/20 p-4">
|
<div className="max-w-4xl mx-auto flex gap-4">
|
<input
|
type="text"
|
placeholder="输入消息..."
|
className="flex-1 bg-[#1E2B63] rounded-lg px-4 py-2 text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-[#6ADBFF]/50"
|
/>
|
<button
|
className="bg-gradient-to-r from-[#6ADBFF] to-[#5E72EB] text-white px-6 py-2 rounded-lg font-medium hover:opacity-90 transition-opacity"
|
>
|
发送
|
</button>
|
</div>
|
</div>
|
</div>
|
);
|
}
|
