feat: enhance role management dialogs with i18n support

- Added translation support for RoleCopyDialog, RoleDialog, RoleMembersDialog, and RolePermissionDialog components.
- Updated validation messages and success/error notifications to use translated strings.
- Improved user interface text for better clarity and localization.
- Refactored role service methods to streamline API calls for batch updates.
- Ensured consistent use of translation hooks across all relevant components.

Author: 239573049

web-site/bun.lock

@@ -46,6 +46,7 @@
     "md-editor-rt": "^6.0.1",
     "mermaid": "^11.11.0",
     "mind-elixir": "^5.1.1",
+    "next-themes": "^0.4.6",
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
     "react-hook-form": "^7.62.0",

web-site/package.json

@@ -204,10 +204,10 @@ const UserDialog: React.FC<UserDialogProps> = ({
       <DialogContent className="sm:max-w-[500px]">
         <DialogHeader>
           <DialogTitle>
-            {isEdit ? t('admin.users.dialogs.edit_title') : t('admin.users.dialogs.create_title')}
+            {isEdit ? t('users.dialogs.edit_title') : t('users.dialogs.create_title')}
           </DialogTitle>
           <DialogDescription>
-            {isEdit ? t('admin.users.dialogs.edit_description') : t('admin.users.dialogs.create_description')}
+            {isEdit ? t('users.dialogs.edit_description') : t('users.dialogs.create_description')}
           </DialogDescription>
         </DialogHeader>
 
@@ -259,7 +259,7 @@ const UserDialog: React.FC<UserDialogProps> = ({
 
           {/* 用户名 */}
           <div className="space-y-2">
-            <Label htmlFor="name">{t('admin.users.form.username')}</Label>
+            <Label htmlFor="name">{t('users.form.username')}</Label>
             <Input
               id="name"
               value={form.name}
@@ -274,7 +274,7 @@ const UserDialog: React.FC<UserDialogProps> = ({
 
           {/* 邮箱 */}
           <div className="space-y-2">
-            <Label htmlFor="email">{t('admin.users.form.email')}</Label>
+            <Label htmlFor="email">{t('users.form.email')}</Label>
             <Input
               id="email"
               type="email"
@@ -291,7 +291,7 @@ const UserDialog: React.FC<UserDialogProps> = ({
           {/* 密码 */}
           <div className="space-y-2">
             <Label htmlFor="password">
-              {t('admin.users.form.password')}
+              {t('users.form.password')}
               {isEdit && <span className="text-sm text-gray-500 ml-1">(留空表示不修改)</span>}
             </Label>
             <Input
@@ -311,7 +311,7 @@ const UserDialog: React.FC<UserDialogProps> = ({
           {(!isEdit || form.password) && (
             <div className="space-y-2">
               <Label htmlFor="confirmPassword">
-                {t('admin.users.form.confirm_password')}
+                {t('users.form.confirm_password')}
               </Label>
               <Input
                 id="confirmPassword"

web-site/src/components/admin/UserDialog/index.tsx

@@ -0,0 +1,38 @@
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  Loader2Icon,
+  OctagonXIcon,
+  TriangleAlertIcon,
+} from "lucide-react"
+import { useTheme } from "next-themes"
+import { Toaster as Sonner, type ToasterProps } from "sonner"
+
+const Toaster = ({ ...props }: ToasterProps) => {
+  const { theme = "system" } = useTheme()
+
+  return (
+    <Sonner
+      theme={theme as ToasterProps["theme"]}
+      className="toaster group"
+      icons={{
+        success: <CircleCheckIcon className="size-4" />,
+        info: <InfoIcon className="size-4" />,
+        warning: <TriangleAlertIcon className="size-4" />,
+        error: <OctagonXIcon className="size-4" />,
+        loading: <Loader2Icon className="size-4 animate-spin" />,
+      }}
+      style={
+        {
+          "--normal-bg": "var(--popover)",
+          "--normal-text": "var(--popover-foreground)",
+          "--normal-border": "var(--border)",
+          "--border-radius": "var(--radius)",
+        } as React.CSSProperties
+      }
+      {...props}
+    />
+  )
+}
+
+export { Toaster }