完成admin-user-update

tone-page-web/app/console/(with-menu)/user/components/user-info-editor.tsx

@@ -17,15 +17,34 @@ import { Label } from "@/components/ui/label"
 import { useUser } from "@/hooks/admin/user/use-user";
 import { User } from "@/lib/types/user";
 import { Skeleton } from "@/components/ui/skeleton";
+import { updateUser } from "@/lib/api/admin/user";
+import { AdminApi } from "@/lib/api";
+import { toast } from "sonner";
 
 export function UserInfoEditor({
     onClose,
+    onUserUpdate,
     userId,
 }: {
     onClose: () => void,
+    onUserUpdate: (user: User) => void,
     userId: string
 }) {
     const { user, isLoading, error } = userId ? useUser(userId) : {};
+    const handleSave = async (user: updateUser) => {
+        try {
+            const res = await AdminApi.user.update(userId, user);
+            if (res) {
+                toast.success("保存成功");
+                onUserUpdate(res);
+                onClose();
+            } else {
+                throw new Error();
+            }
+        } catch (error) {
+            toast.error((error as Error).message || "保存失败");
+        }
+    }
 
     return (
         <Drawer open={!!userId} onClose={onClose} >
@@ -36,7 +55,14 @@ export function UserInfoEditor({
                 </DrawerHeader>
 
                 {user && <ProfileForm className="px-4" user={user} onSubmit={(e) => {
-                    e.preventDefault();
+                    e.preventDefault()
+                    const formData = new FormData(e.currentTarget);
+                    handleSave({
+                        username: formData.get("username")?.toString()!,
+                        nickname: formData.get("nickname")?.toString()!,
+                        email: formData.get("email")?.toString() || null,
+                        phone: formData.get("phone")?.toString() || null,
+                    })
                 }} />}
 
                 {isLoading &&
@@ -44,7 +70,7 @@ export function UserInfoEditor({
                         <Skeleton className="h-20 mx-4 my-1" key={i} />
                     ))
                 }
-                
+
                 <DrawerFooter className="pt-2">
                     <DrawerClose asChild>
                         <Button variant="outline">关闭</Button>
@@ -59,24 +85,24 @@ function ProfileForm({ className, user, ...props }: React.ComponentProps<"form">
     return (
         <form className={cn("grid items-start gap-4", className)} {...props}>
             <div className="grid gap-2">
-                <Label htmlFor="email">UserId</Label>
-                <Input id="email" defaultValue={user.userId} disabled />
+                <Label htmlFor="userId">UserId</Label>
+                <Input id="userId" name="userId" defaultValue={user.userId} disabled />
             </div>
             <div className="grid gap-2">
                 <Label htmlFor="username">账户</Label>
-                <Input id="username" defaultValue={user.username} />
+                <Input id="username" name="username" defaultValue={user.username} />
             </div>
             <div className="grid gap-2">
                 <Label htmlFor="nickname">昵称</Label>
-                <Input id="nickname" defaultValue={user.nickname} />
+                <Input id="nickname" name="nickname" defaultValue={user.nickname} />
             </div>
             <div className="grid gap-2">
                 <Label htmlFor="email">电子邮箱</Label>
-                <Input id="email" defaultValue={user.email} />
+                <Input id="email" name="email" defaultValue={user.email} />
             </div>
             <div className="grid gap-2">
                 <Label htmlFor="phone">手机号</Label>
-                <Input id="phone" defaultValue={user.phone} />
+                <Input id="phone" name="phone" defaultValue={user.phone} />
             </div>
             <Button type="submit">保存</Button>
         </form>