From 20b2bdc43ec73019fe841230e41cd5f629c5af90 Mon Sep 17 00:00:00 2001
From: tone <3341154833@qq.com>
Date: Thu, 19 Jun 2025 09:30:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=9B=E5=BB=BA=E8=B4=A6=E6=88=B7=E4=BF=A1?=
 =?UTF-8?q?=E6=81=AF=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 tone-page-web/components/nav-user.tsx         |  7 +++-
 .../components/nav-user/UserProfile.tsx       | 38 +++++++++++++++++++
 2 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 tone-page-web/components/nav-user/UserProfile.tsx

diff --git a/tone-page-web/components/nav-user.tsx b/tone-page-web/components/nav-user.tsx
index d70af70..ceab4e7 100644
--- a/tone-page-web/components/nav-user.tsx
+++ b/tone-page-web/components/nav-user.tsx
@@ -33,6 +33,7 @@ import { useRouter } from "next/navigation"
 import SetPassword from "./nav-user/SetPassword"
 import { useState } from "react"
 import { User } from "@/lib/types/user"
+import UserProfile from "./nav-user/UserProfile"
 
 export function NavUser({ user, isUserLoading }: { user: User | undefined, isUserLoading: boolean }) {
   const { isMobile } = useSidebar();
@@ -50,6 +51,7 @@ export function NavUser({ user, isUserLoading }: { user: User | undefined, isUse
     }
   }
 
+  const [userProfileOpen, setUserProfileOpen] = useState(false);
   const [passwordOpen, setPasswordOpen] = useState(false);
 
   return (
@@ -117,11 +119,11 @@ export function NavUser({ user, isUserLoading }: { user: User | undefined, isUse
                 }
               </DropdownMenuLabel>
               <DropdownMenuSeparator />
-              <DropdownMenuItem>
+              <DropdownMenuItem onClick={() => setTimeout(() => setUserProfileOpen(true), 0)}>
                 <UserRoundCog />
                 账户信息
               </DropdownMenuItem>
-              <DropdownMenuItem onClick={() => setTimeout(() => { setPasswordOpen(true) }, 0)}>
+              <DropdownMenuItem onClick={() => setTimeout(() => setPasswordOpen(true), 0)}>
                 <KeyRound />
                 修改密码
               </DropdownMenuItem>
@@ -135,6 +137,7 @@ export function NavUser({ user, isUserLoading }: { user: User | undefined, isUse
         </SidebarMenuItem>
       </SidebarMenu >
 
+      <UserProfile open={userProfileOpen} onOpenChange={setUserProfileOpen} />
       <SetPassword open={passwordOpen} onOpenChange={setPasswordOpen} />
     </>
   )
diff --git a/tone-page-web/components/nav-user/UserProfile.tsx b/tone-page-web/components/nav-user/UserProfile.tsx
new file mode 100644
index 0000000..084a9d2
--- /dev/null
+++ b/tone-page-web/components/nav-user/UserProfile.tsx
@@ -0,0 +1,38 @@
+import { DialogProps } from "@radix-ui/react-dialog";
+import React, { FC } from "react";
+import {
+    Dialog,
+    DialogContent,
+    DialogDescription,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from "@/components/ui/dialog"
+import { Button } from "../ui/button";
+
+interface UserProfileProps {
+
+}
+
+export default function ({ onOpenChange, ...props }: UserProfileProps & React.ComponentProps<FC<DialogProps>>) {
+    return (
+        <Dialog onOpenChange={onOpenChange} {...props}>
+            <DialogContent className="sm:max-w-[425px]">
+                <DialogHeader>
+                    <DialogTitle>账户信息</DialogTitle>
+                    <DialogDescription>
+                        新密码长度在6-32位之间，且至少包含一个字母和一个数字，可以包含特殊字符
+                    </DialogDescription>
+                </DialogHeader>
+
+                <div>
+                    开发中...
+                </div>
+
+                <DialogFooter>
+                    <Button type="button" variant='secondary' onClick={() => onOpenChange?.(false)}>返回</Button>
+                </DialogFooter>
+            </DialogContent>
+        </Dialog >
+    )
+}
\ No newline at end of file