- Added a new task store in `src-react/stores/task.ts` to manage tasks and their statuses. - Implemented functions for creating, executing, and retrying tasks, along with handling task progress and completion. - Introduced persistence for tasks using IPC. - Created utility functions for normalizing room types and building subtasks. - Added a new CSS file for global styles in `src-react/styles.css`. - Created runtime types in `src-react/types/runtime.ts` and exported them. - Updated the main entry points for Vue and React applications to support dynamic framework loading. - Refactored chat model interfaces and utility functions into `src/shared/chat-model.ts`. - Updated TypeScript configuration to include paths for React components and types. - Enhanced Vite configuration to support both Vue and React frameworks.
97 lines
4.6 KiB
TypeScript
97 lines
4.6 KiB
TypeScript
import { Link } from 'react-router-dom';
|
||
import TitleBar from '../../components/layout/TitleBar';
|
||
|
||
export default function LoginPage() {
|
||
return (
|
||
<div
|
||
className="h-screen flex flex-col"
|
||
style={{
|
||
background:
|
||
'linear-gradient(180deg, rgba(247, 249, 252, 1) 0%, rgba(235, 241, 247, 1) 100%)',
|
||
}}
|
||
>
|
||
<TitleBar variant="light" />
|
||
|
||
<main className="box-border pl-2 pr-2 pb-2 flex-auto flex pt-2">
|
||
<div className="w-[520px] box-border bg-white dark:bg-[#1b1b1d] rounded-2xl p-8 flex flex-col shadow-[0_18px_50px_rgba(15,23,42,0.12)] border border-black/5 dark:border-[#2a2a2d]">
|
||
<div className="flex items-center">
|
||
<div className="w-12 h-12 rounded-[14px] bg-[#2B7FFF] text-white flex items-center justify-center font-bold">
|
||
Z
|
||
</div>
|
||
</div>
|
||
|
||
<div className="flex flex-col items-center justify-center mb-6 box-border pt-10">
|
||
<div className="w-20 h-20 mb-3 rounded-full bg-[#f3f4f6] dark:bg-[#222225] flex items-center justify-center border border-black/5 dark:border-[#2a2a2d]">
|
||
<span className="text-[28px] font-semibold text-[#525866] dark:text-gray-300">◌</span>
|
||
</div>
|
||
<div className="text-[24px] font-medium text-gray-800 dark:text-gray-100 leading-[32px] mb-1">
|
||
欢迎回到 zn-ai
|
||
</div>
|
||
<div className="text-[16px] text-gray-500 dark:text-gray-400 leading-[24px]">
|
||
React 登录壳
|
||
</div>
|
||
</div>
|
||
|
||
<div className="w-[392px] ml-auto mr-auto flex flex-col gap-4">
|
||
<div>
|
||
<div className="text-[14px] text-gray-600 dark:text-gray-300 mb-2">用户名</div>
|
||
<div className="h-10 rounded-[10px] border border-black/10 dark:border-[#2a2a2d] bg-gray-50 dark:bg-[#222225] px-4 flex items-center text-[13px] text-gray-400">
|
||
username@example.com
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div className="text-[14px] text-gray-600 dark:text-gray-300 mb-2">密码</div>
|
||
<div className="h-10 rounded-[10px] border border-black/10 dark:border-[#2a2a2d] bg-gray-50 dark:bg-[#222225] px-4 flex items-center text-[13px] text-gray-400">
|
||
••••••••
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div className="text-[14px] text-gray-600 dark:text-gray-300 mb-2">验证码</div>
|
||
<div className="h-10 rounded-[10px] border border-black/10 dark:border-[#2a2a2d] bg-gray-50 dark:bg-[#222225] px-4 flex items-center justify-between text-[13px] text-gray-400">
|
||
<span>请输入验证码</span>
|
||
<span className="w-20 h-8 rounded-md bg-white dark:bg-[#1f1f22] border border-black/5 dark:border-[#2a2a2d] flex items-center justify-center text-[#99A0AE]">
|
||
1234
|
||
</span>
|
||
</div>
|
||
</div>
|
||
|
||
<button
|
||
type="button"
|
||
className="w-full py-2 bg-blue-600 cursor-pointer text-white rounded-lg hover:bg-blue-700 mt-4"
|
||
>
|
||
登录
|
||
</button>
|
||
|
||
<div className="text-[13px] text-gray-500 dark:text-gray-400 text-center">
|
||
迁移阶段先提供静态登录壳,后续再接入真实认证。
|
||
</div>
|
||
|
||
<Link
|
||
to="/home"
|
||
className="text-[13px] text-center text-[#2B7FFF] hover:underline mt-2"
|
||
>
|
||
进入应用
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
|
||
<div className="flex-1 ml-2 rounded-2xl bg-[radial-gradient(circle_at_top,rgba(43,127,255,0.25),transparent_35%),linear-gradient(180deg,#f8fafc_0%,#e2e8f0_100%)] dark:bg-[radial-gradient(circle_at_top,rgba(59,130,246,0.2),transparent_35%),linear-gradient(180deg,#111827_0%,#0f172a_100%)] border border-black/5 dark:border-[#2a2a2d] overflow-hidden relative">
|
||
<div className="absolute inset-0 opacity-60" />
|
||
<div className="relative h-full flex items-end p-10">
|
||
<div className="max-w-lg">
|
||
<div className="text-[42px] font-serif text-[#171717] dark:text-[#f3f4f6] font-normal tracking-tight leading-tight">
|
||
平移原有视觉壳,逐步接管 React 入口
|
||
</div>
|
||
<div className="mt-4 text-[15px] text-[#171717]/70 dark:text-gray-400 leading-7">
|
||
当前先保持当前 Vue 登录页的结构感和信息密度,后续认证、主题和窗口行为会按迁移计划逐步接入。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
);
|
||
}
|