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

app/(auth)/register/page.tsx

@@ -4,10 +4,12 @@ import { Button } from "@/components/ui/button"
 import { Checkbox } from "@/components/ui/checkbox"
 import { IconInput } from "@/components/ui/icon-input"
 import { Label } from "@/components/ui/label"
-import { getCurrentUserForLogin } from "@/lib/api"
+import { register as registerApi } from "@/lib/api"
+import { toApiError } from "@/lib/errors"
+import { notifyInfo } from "@/lib/toast"
 import { useAuthStore } from "@/store/auth"
 import { standardSchemaResolver } from "@hookform/resolvers/standard-schema"
-import { Eye, EyeOff, Lock, Phone, User } from "lucide-react"
+import { Eye, EyeOff, Lock, Mail, Shield, User } from "lucide-react"
 import Link from "next/link"
 import { useRouter } from "next/navigation"
 import { useState } from "react"
@@ -16,8 +18,9 @@ import { z } from "zod"
 
 const registerSchema = z
   .object({
-    nickname: z.string().min(2, "昵称至少2个字符"),
-    phone: z.string().min(11, "请输入正确的手机号"),
+    username: z.string().min(1, "请输入用户名"),
+    email: z.string().email("请输入正确的邮箱地址"),
+    vcode: z.string().optional(),
     password: z.string().min(6, "密码至少6位"),
     confirmPassword: z.string(),
     agreeTerms: z.boolean(),
@@ -33,7 +36,7 @@ const registerSchema = z
 
 export default function RegisterPage() {
   const router = useRouter()
-  const { login } = useAuthStore()
+  const { login: storeLogin } = useAuthStore()
   const [showPassword, setShowPassword] = useState(false)
   const [showConfirmPassword, setShowConfirmPassword] = useState(false)
   const {
@@ -46,10 +49,19 @@ export default function RegisterPage() {
     defaultValues: { agreeTerms: false },
   })
 
-  const onSubmit = async (_data: z.infer<typeof registerSchema>) => {
-    await new Promise((r) => setTimeout(r, 500))
-    login(getCurrentUserForLogin(), ["consumer"])
-    router.push("/")
+  const onSubmit = async (data: z.infer<typeof registerSchema>) => {
+    try {
+      const user = await registerApi({
+        username: data.username,
+        email: data.email,
+        password: data.password,
+        vcode: data.vcode,
+      })
+      storeLogin(user, ["consumer"])
+      router.push("/")
+    } catch (err) {
+      notifyInfo(toApiError(err).msg)
+    }
   }
 
   return (
@@ -61,20 +73,38 @@ export default function RegisterPage() {
 
       <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
         <div className="space-y-1.5">
-          <Label htmlFor="nickname">昵称</Label>
+          <Label htmlFor="username">用户名</Label>
           <IconInput
-            id="nickname"
+            id="username"
             icon={<User />}
-            placeholder="输入你的昵称"
-            {...register("nickname")}
+            placeholder="输入用户名"
+            {...register("username")}
           />
-          {errors.nickname && <p className="text-xs text-destructive">{errors.nickname.message}</p>}
+          {errors.username && <p className="text-xs text-destructive">{errors.username.message}</p>}
         </div>
 
         <div className="space-y-1.5">
-          <Label htmlFor="phone">手机号</Label>
-          <IconInput id="phone" icon={<Phone />} placeholder="输入手机号" {...register("phone")} />
-          {errors.phone && <p className="text-xs text-destructive">{errors.phone.message}</p>}
+          <Label htmlFor="email">邮箱</Label>
+          <IconInput id="email" icon={<Mail />} placeholder="输入邮箱地址" {...register("email")} />
+          {errors.email && <p className="text-xs text-destructive">{errors.email.message}</p>}
+        </div>
+
+        <div className="space-y-1.5">
+          <Label htmlFor="vcode">验证码</Label>
+          <div className="flex gap-2">
+            <div className="flex-1">
+              <IconInput
+                id="vcode"
+                icon={<Shield />}
+                placeholder="输入验证码（可选）"
+                {...register("vcode")}
+              />
+            </div>
+            <Button type="button" variant="outline" onClick={() => {}}>
+              发送验证码
+            </Button>
+          </div>
+          {errors.vcode && <p className="text-xs text-destructive">{errors.vcode.message}</p>}
         </div>
 
         <div className="space-y-1.5">