75 lines
2.4 KiB
TypeScript
75 lines
2.4 KiB
TypeScript
import { useState } from "react";
|
|
import { Alert, Button, Card, Form, Input, Typography } from "antd";
|
|
import { Building2 } from "lucide-react";
|
|
import { useLocation, useNavigate } from "react-router";
|
|
import { authApi } from "../api";
|
|
import { useRuntime } from "../app/RuntimeProvider";
|
|
|
|
export default function TenantLoginPage() {
|
|
const { runtime } = useRuntime();
|
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
const [error, setError] = useState("");
|
|
const [loading, setLoading] = useState(false);
|
|
|
|
const submit = async (values: { identifier: string; password: string }) => {
|
|
setLoading(true);
|
|
setError("");
|
|
try {
|
|
await authApi.login(values);
|
|
const from = (location.state as { from?: string } | null)?.from;
|
|
navigate(from?.startsWith("/manage") ? from : "/manage", {
|
|
replace: true,
|
|
});
|
|
} catch {
|
|
setError("账号、密码错误，或该账号没有后台访问权限。");
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="min-h-screen grid place-items-center bg-slate-100 p-5">
|
|
<Card className="w-full max-w-md" styles={{ body: { padding: 34 } }}>
|
|
<div className="mb-7 flex items-center gap-4">
|
|
<div className="grid h-12 w-12 place-items-center rounded-2xl bg-slate-950 text-white">
|
|
<Building2 />
|
|
</div>
|
|
<div>
|
|
<Typography.Text type="secondary">
|
|
{runtime?.branding.brandName}
|
|
</Typography.Text>
|
|
<Typography.Title level={3} style={{ margin: 0 }}>
|
|
租户管理后台
|
|
</Typography.Title>
|
|
</div>
|
|
</div>
|
|
{error && (
|
|
<Alert className="mb-5" type="error" showIcon title={error} />
|
|
)}
|
|
<Form layout="vertical" requiredMark={false} onFinish={submit}>
|
|
<Form.Item
|
|
name="identifier"
|
|
label="管理员账号"
|
|
rules={[{ required: true }]}
|
|
>
|
|
<Input size="large" autoComplete="username" />
|
|
</Form.Item>
|
|
<Form.Item name="password" label="密码" rules={[{ required: true }]}>
|
|
<Input.Password size="large" autoComplete="current-password" />
|
|
</Form.Item>
|
|
<Button
|
|
block
|
|
type="primary"
|
|
size="large"
|
|
htmlType="submit"
|
|
loading={loading}
|
|
>
|
|
登录后台
|
|
</Button>
|
|
</Form>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|