dev 分支暂存

2026-05-16 08:26:56 +08:00
parent 58c8caa570
commit eb4129176c
71 changed files with 8474 additions and 214 deletions
@@ -0,0 +1,109 @@
+import { useState } from 'react';
+import { AppLayout } from '@/components/layout/AppLayout';
+import { ChatContainer } from '@/components/chat/ChatContainer';
+import { ChatInput } from '@/components/chat/ChatInput';
+import { useAuth } from '@/hooks/useAuth';
+import { useChat } from '@/hooks/useChat';
+
+export default function App() {
+  const { isLoggedIn, login, register, loading: authLoading } = useAuth();
+  const { send } = useChat();
+
+  const [authMode, setAuthMode] = useState<'login' | 'register'>('login');
+  const [username, setUsername] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+
+  const handleAuth = async () => {
+    setError('');
+    const fn = authMode === 'login' ? login : register;
+    const result = await fn(username, password);
+    if (!result.success) {
+      setError(result.error || '操作失败');
+    }
+  };
+
+  // 登录页面
+  if (!isLoggedIn) {
+    return (
+      <div className="min-h-screen bg-[#FFFAF5] dark:bg-[#1a1a2e] flex items-center justify-center p-4">
+        <div className="w-full max-w-sm">
+          {/* Logo */}
+          <div className="text-center mb-8">
+            <div className="text-6xl mb-4">🌸</div>
+            <h1 className="text-2xl font-bold text-pink-500 mb-2">昔涟</h1>
+            <p className="text-sm text-gray-400">
+              一位永远在你身边的AI伙伴 ♪
+            </p>
+          </div>
+
+          {/* 表单 */}
+          <div className="bg-white dark:bg-gray-900 rounded-2xl shadow-lg p-6 space-y-4 border border-pink-100 dark:border-pink-900">
+            <div className="flex rounded-lg bg-gray-100 dark:bg-gray-800 p-1">
+              <button
+                onClick={() => setAuthMode('login')}
+                className={`flex-1 py-2 text-sm rounded-md transition-colors ${
+                  authMode === 'login'
+                    ? 'bg-white dark:bg-gray-700 text-pink-500 font-medium shadow-sm'
+                    : 'text-gray-400'
+                }`}
+              >
+                登录
+              </button>
+              <button
+                onClick={() => setAuthMode('register')}
+                className={`flex-1 py-2 text-sm rounded-md transition-colors ${
+                  authMode === 'register'
+                    ? 'bg-white dark:bg-gray-700 text-pink-500 font-medium shadow-sm'
+                    : 'text-gray-400'
+                }`}
+              >
+                注册
+              </button>
+            </div>
+
+            <input
+              type="text"
+              placeholder="用户名"
+              value={username}
+              onChange={(e) => setUsername(e.target.value)}
+              onKeyDown={(e) => e.key === 'Enter' && handleAuth()}
+              className="w-full px-4 py-2.5 rounded-xl border border-pink-200 dark:border-pink-800 bg-white dark:bg-gray-800 text-sm text-gray-700 dark:text-gray-200 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-pink-400"
+            />
+
+            <input
+              type="password"
+              placeholder="密码"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+              onKeyDown={(e) => e.key === 'Enter' && handleAuth()}
+              className="w-full px-4 py-2.5 rounded-xl border border-pink-200 dark:border-pink-800 bg-white dark:bg-gray-800 text-sm text-gray-700 dark:text-gray-200 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-pink-400"
+            />
+
+            {error && (
+              <p className="text-xs text-red-400 text-center">{error}</p>
+            )}
+
+            <button
+              onClick={handleAuth}
+              disabled={authLoading || !username || !password}
+              className="w-full py-2.5 rounded-xl bg-pink-400 hover:bg-pink-500 disabled:bg-pink-300 text-white font-medium text-sm transition-colors"
+            >
+              {authLoading ? '请稍候...' : authMode === 'login' ? '进入昔涟的世界 ♪' : '注册并开始'}
+            </button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  // 聊天界面
+  return (
+    <AppLayout>
+      <div className="flex flex-col h-full">
+        <ChatContainer />
+        <ChatInput onSend={send} />
+      </div>
+    </AppLayout>
+  );
+}