76 lines
3.1 KiB
TypeScript
76 lines
3.1 KiB
TypeScript
"use client"
|
|
|
|
import { GalleryVerticalEnd } from "lucide-react"
|
|
import { LoginForm } from "./login-form"
|
|
import { ApolloClient, InMemoryCache, ApolloProvider } from "@apollo/client";
|
|
import { UserProvider, useUser } from "../user-context";
|
|
import { useEffect } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
|
|
export default function LoginPage() {
|
|
const { isAuthenticated, isLoading } = useUser();
|
|
const router = useRouter();
|
|
|
|
useEffect(() => {
|
|
if (!isLoading && isAuthenticated) {
|
|
router.push('/');
|
|
}
|
|
}, [isAuthenticated, isLoading, router]);
|
|
|
|
// 如果正在加载或已认证，显示加载状态
|
|
if (isLoading || isAuthenticated) {
|
|
return (
|
|
<div className="grid min-h-svh lg:grid-cols-2">
|
|
<div className="flex flex-col gap-4 p-6 md:p-10">
|
|
<div className="flex justify-center gap-2 md:justify-start">
|
|
<a href="#" className="flex items-center gap-2 font-medium">
|
|
<div className="bg-primary text-primary-foreground flex size-6 items-center justify-center rounded-md">
|
|
<GalleryVerticalEnd className="size-4" />
|
|
</div>
|
|
Acme Inc.
|
|
</a>
|
|
</div>
|
|
<div className="flex flex-1 items-center justify-center">
|
|
<div className="w-full max-w-xs text-center">
|
|
<p className="text-muted-foreground">正在跳转...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="bg-muted relative hidden lg:block">
|
|
<img
|
|
src="/placeholder.svg"
|
|
alt="Image"
|
|
className="absolute inset-0 h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="grid min-h-svh lg:grid-cols-2">
|
|
<div className="flex flex-col gap-4 p-6 md:p-10">
|
|
<div className="flex justify-center gap-2 md:justify-start">
|
|
<a href="#" className="flex items-center gap-2 font-medium">
|
|
<div className="bg-primary text-primary-foreground flex size-6 items-center justify-center rounded-md">
|
|
<GalleryVerticalEnd className="size-4" />
|
|
</div>
|
|
Acme Inc.
|
|
</a>
|
|
</div>
|
|
<div className="flex flex-1 items-center justify-center">
|
|
<div className="w-full max-w-xs">
|
|
<LoginForm />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="bg-muted relative hidden lg:block">
|
|
<img
|
|
src="/placeholder.svg"
|
|
alt="Image"
|
|
className="absolute inset-0 h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
} |