refactor(auth): align auth UI and mock auth API

components/login-dialog.tsx

@@ -10,7 +10,9 @@ import {
 } from "@/components/ui/dialog"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
-import { getCurrentUserForLogin } from "@/lib/api"
+import { login as loginApi } from "@/lib/api"
+import { toApiError } from "@/lib/errors"
+import { notifyInfo } from "@/lib/toast"
 import { useAuthStore } from "@/store/auth"
 import { useLoginDialogStore } from "@/store/login-dialog"
 import { standardSchemaResolver } from "@hookform/resolvers/standard-schema"
@@ -19,7 +21,7 @@ import { useForm } from "react-hook-form"
 import { z } from "zod"
 
 const loginSchema = z.object({
-  phone: z.string().min(11, "请输入正确的手机号"),
+  username: z.string().min(1, "请输入用户名"),
   password: z.string().min(6, "密码至少6位"),
 })
 
@@ -30,7 +32,7 @@ interface LoginDialogProps {
 
 export function LoginDialog({ open, onOpenChange }: LoginDialogProps) {
   const router = useRouter()
-  const { login } = useAuthStore()
+  const { login: storeLogin } = useAuthStore()
   const consumePendingAction = useLoginDialogStore((state) => state.consumePendingAction)
   const {
     register,
@@ -40,11 +42,15 @@ export function LoginDialog({ open, onOpenChange }: LoginDialogProps) {
     resolver: standardSchemaResolver(loginSchema),
   })
 
-  const onSubmit = async (_data: z.infer<typeof loginSchema>) => {
-    await new Promise((r) => setTimeout(r, 500))
-    login(getCurrentUserForLogin(), ["consumer", "player", "owner"])
-    consumePendingAction()
-    onOpenChange(false)
+  const onSubmit = async (data: z.infer<typeof loginSchema>) => {
+    try {
+      const user = await loginApi({ username: data.username, password: data.password })
+      storeLogin(user, ["consumer", "player", "owner"])
+      consumePendingAction()
+      onOpenChange(false)
+    } catch (err) {
+      notifyInfo(toApiError(err).msg)
+    }
   }
 
   return (
@@ -56,9 +62,11 @@ export function LoginDialog({ open, onOpenChange }: LoginDialogProps) {
         </DialogHeader>
         <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
           <div className="space-y-2">
-            <Label htmlFor="dialog-phone">手机号</Label>
-            <Input id="dialog-phone" placeholder="请输入手机号" {...register("phone")} />
-            {errors.phone && <p className="text-xs text-destructive">{errors.phone.message}</p>}
+            <Label htmlFor="dialog-username">用户名</Label>
+            <Input id="dialog-username" placeholder="请输入用户名" {...register("username")} />
+            {errors.username && (
+              <p className="text-xs text-destructive">{errors.username.message}</p>
+            )}
           </div>
           <div className="space-y-2">
             <Label htmlFor="dialog-password">密码</Label>