完成了一些接口

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

@@ -20,6 +20,12 @@ import { Skeleton } from "@/components/ui/skeleton";
 import { updateUser } from "@/lib/api/admin/user";
 import { AdminApi } from "@/lib/api";
 import { toast } from "sonner";
+import {
+    Alert,
+    AlertDescription,
+    AlertTitle,
+} from "@/components/ui/alert"
+import { AlertCircle } from "lucide-react";
 
 export function UserInfoEditor({
     onClose,
@@ -46,6 +52,14 @@ export function UserInfoEditor({
         }
     }
 
+    const handleRemove = async () => {
+
+    }
+
+    const handleSetPassword = async () => {
+
+    }
+
     return (
         <Drawer open={!!userId} onClose={onClose} >
             <DrawerContent>
@@ -54,16 +68,20 @@ export function UserInfoEditor({
                     <DrawerDescription>确保你在保存之前检查所有更改</DrawerDescription>
                 </DrawerHeader>
 
-                {user && <ProfileForm className="px-4" user={user} onSubmit={(e) => {
-                    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,
-                    })
-                }} />}
+                {user && <ProfileForm className="px-4"
+                    user={user}
+                    onSetPassword={handleSetPassword}
+                    onRemove={handleRemove}
+                    onSubmit={(e) => {
+                        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 &&
                     [...Array(5)].map((_, i) => (
@@ -71,6 +89,16 @@ export function UserInfoEditor({
                     ))
                 }
 
+                {
+                    error && (
+                        <Alert variant="destructive" className="mx-4">
+                            <AlertCircle className="h-6 w-6" />
+                            <AlertTitle>出错啦!</AlertTitle>
+                            <AlertDescription>{error.message}</AlertDescription>
+                        </Alert>
+                    )
+                }
+
                 <DrawerFooter className="pt-2">
                     <DrawerClose asChild>
                         <Button variant="outline">关闭</Button>
@@ -81,7 +109,12 @@ export function UserInfoEditor({
     )
 }
 
-function ProfileForm({ className, user, ...props }: React.ComponentProps<"form"> & { user: User }) {
+function ProfileForm({ className, user, onSetPassword, onRemove, ...props }:
+    React.ComponentProps<"form"> & {
+        user: User,
+        onSetPassword: () => Promise<void>,
+        onRemove: () => Promise<void>,
+    }) {
     return (
         <form className={cn("grid items-start gap-4", className)} {...props}>
             <div className="grid gap-2">
@@ -104,6 +137,10 @@ function ProfileForm({ className, user, ...props }: React.ComponentProps<"form">
                 <Label htmlFor="phone">手机号</Label>
                 <Input id="phone" name="phone" defaultValue={user.phone} />
             </div>
+            <div className="w-full flex gap-5">
+                <Button type="button" variant="secondary" className="flex-1" onClick={onSetPassword}>修改密码</Button>
+                <Button type="button" variant="destructive" className="flex-1" onClick={onRemove}>删除用户</Button>
+            </div>
             <Button type="submit">保存</Button>
         </form>
     )