fix: sync verification state with auth guards

app/(account)/verify/page.tsx

@@ -16,9 +16,14 @@ import {
 } from "@/components/ui/select"
 import { Separator } from "@/components/ui/separator"
 import { Textarea } from "@/components/ui/textarea"
+import type { UserRole } from "@/lib/types"
+import { useAuthStore } from "@/store/auth"
 
 export default function VerifyPage() {
-  const [submitted, setSubmitted] = useState(false)
+  const [verifyRole, setVerifyRole] = useState<UserRole | "">("")
+  const verificationStatus = useAuthStore((state) => state.verificationStatus)
+  const submitVerification = useAuthStore((state) => state.submitVerification)
+  const submitted = Object.values(verificationStatus).includes("pending")
 
   if (submitted) {
     return (
@@ -68,7 +73,7 @@ export default function VerifyPage() {
         <CardContent className="space-y-6">
           <div className="space-y-2">
             <Label>认证类型</Label>
-            <Select>
+            <Select value={verifyRole} onValueChange={(value) => setVerifyRole(value as UserRole)}>
               <SelectTrigger>
                 <SelectValue placeholder="选择认证类型" />
               </SelectTrigger>
@@ -115,7 +120,14 @@ export default function VerifyPage() {
             <p className="text-xs text-muted-foreground">支持 JPG、PNG 格式，单张不超过 5MB</p>
           </div>
 
-          <Button className="w-full" onClick={() => setSubmitted(true)}>
+          <Button
+            className="w-full"
+            disabled={!verifyRole}
+            onClick={() => {
+              if (!verifyRole) return
+              submitVerification(verifyRole)
+            }}
+          >
             提交认证申请
           </Button>
         </CardContent>

app/(dashboard)/layout.tsx

@@ -1,8 +1,16 @@
+"use client"
+
+import Link from "next/link"
 import { AuthGuard } from "@/components/auth-guard"
 import { DashboardSidebar } from "@/components/dashboard-sidebar"
 import { Header } from "@/components/header"
+import { Button } from "@/components/ui/button"
+import { useAuthStore } from "@/store/auth"
 
 export default function DashboardLayout({ children }: { children: React.ReactNode }) {
+  const isAuthenticated = useAuthStore((state) => state.isAuthenticated)
+  const currentRole = useAuthStore((state) => state.currentRole)
+
   return (
     <div className="flex min-h-screen flex-col">
       <Header />
@@ -11,7 +19,17 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
           <DashboardSidebar />
         </div>
         <main className="flex-1 p-6">
-          <AuthGuard>{children}</AuthGuard>
+          <AuthGuard>
+            {isAuthenticated && currentRole === "consumer" ? (
+              <div className="flex min-h-[50vh] items-center justify-center">
+                <Button asChild>
+                  <Link href="/">首页</Link>
+                </Button>
+              </div>
+            ) : (
+              children
+            )}
+          </AuthGuard>
         </main>
       </div>
     </div>

components/auth-guard.tsx

@@ -1,6 +1,6 @@
 "use client"
 
-import { useEffect } from "react"
+import { useEffect, useRef } from "react"
 import { Button } from "@/components/ui/button"
 import { useAuthStore } from "@/store/auth"
 import { useLoginDialogStore } from "@/store/login-dialog"
@@ -12,9 +12,15 @@ interface AuthGuardProps {
 export function AuthGuard({ children }: AuthGuardProps) {
   const isAuthenticated = useAuthStore((s) => s.isAuthenticated)
   const openLoginDialog = useLoginDialogStore((s) => s.openLoginDialog)
+  const hasTriggered = useRef(false)
 
   useEffect(() => {
-    if (!isAuthenticated) {
+    if (isAuthenticated) {
+      hasTriggered.current = false
+      return
+    }
+    if (!hasTriggered.current) {
+      hasTriggered.current = true
       openLoginDialog()
     }
   }, [isAuthenticated, openLoginDialog])

lib/types.ts

@@ -1,4 +1,5 @@
 export type UserRole = "consumer" | "player" | "owner"
+export type VerificationStatus = "pending" | "approved" | "rejected"
 
 export interface User {
   id: string
@@ -6,6 +7,8 @@ export interface User {
   nickname: string
   avatar: string
   role: UserRole
+  verifiedRoles?: UserRole[]
+  verificationStatus?: Partial<Record<UserRole, VerificationStatus>>
   phone?: string
   bio?: string
   createdAt: string

store/auth.ts

@@ -1,12 +1,14 @@
 import { create } from "zustand"
-import type { User, UserRole } from "@/lib/types"
+import type { User, UserRole, VerificationStatus } from "@/lib/types"
 
 interface AuthState {
   isAuthenticated: boolean
   currentRole: UserRole
   verifiedRoles: UserRole[]
+  verificationStatus: Partial<Record<UserRole, VerificationStatus>>
   user: User | null
   switchRole: (role: UserRole) => void
+  submitVerification: (role: UserRole) => void
   login: (user: User, verifiedRoles?: UserRole[]) => void
   logout: () => void
 }
@@ -15,6 +17,7 @@ export const useAuthStore = create<AuthState>((set, get) => ({
   isAuthenticated: false,
   currentRole: "consumer",
   verifiedRoles: ["consumer"],
+  verificationStatus: { consumer: "approved" },
   user: null,
   switchRole: (role) => {
     const { verifiedRoles } = get()
@@ -22,18 +25,39 @@ export const useAuthStore = create<AuthState>((set, get) => ({
       set({ currentRole: role })
     }
   },
+  submitVerification: (role) =>
+    set((state) => {
+      if (state.verifiedRoles.includes(role)) {
+        return state
+      }
+
+      return {
+        verificationStatus: {
+          ...state.verificationStatus,
+          [role]: "pending",
+        },
+      }
+    }),
   login: (user, verifiedRoles = ["consumer"]) =>
     set({
       isAuthenticated: true,
       user,
       currentRole: user.role,
       verifiedRoles,
+      verificationStatus: verifiedRoles.reduce<Partial<Record<UserRole, VerificationStatus>>>(
+        (acc, role) => {
+          acc[role] = "approved"
+          return acc
+        },
+        {},
+      ),
     }),
   logout: () =>
     set({
       isAuthenticated: false,
       currentRole: "consumer",
       verifiedRoles: ["consumer"],
+      verificationStatus: { consumer: "approved" },
       user: null,
     }),
 }))