Some checks failed
CI Check / check (push) Has been cancelled
- 创建统一UI三层架构系统(基础层、颜色层、组合层) - 拆分Admin页面为独立Tab组件(MonitorTab、UsersTab、DepartmentsTab等) - 提取公共逻辑到Hooks(useToast、useDataFetch、useUserOperations等) - 提取工具函数(validators、formatters、api等) - 创建统一弹窗组件(Modal)和useModal Hook - 添加错误边界和统一状态组件 - 完善类型定义和可访问性支持 - 更新文档(优化记录、优化计划、更新日志)
65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
'use client'
|
||
|
||
import type { User } from '../types'
|
||
import { buttonStyles, cn, inputStyles } from '@/lib/ui-styles'
|
||
|
||
interface TransferSuperAdminModalProps {
|
||
isOpen: boolean
|
||
targetUser: User | null
|
||
password: string
|
||
onClose: () => void
|
||
onChangePassword: (value: string) => void
|
||
onConfirm: () => void
|
||
}
|
||
|
||
export default function TransferSuperAdminModal({
|
||
isOpen,
|
||
targetUser,
|
||
password,
|
||
onClose,
|
||
onChangePassword,
|
||
onConfirm,
|
||
}: TransferSuperAdminModalProps) {
|
||
if (!isOpen || !targetUser) return null
|
||
|
||
return (
|
||
<div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
|
||
<div className="bg-white dark:bg-slate-800 rounded-2xl shadow-2xl max-w-md w-full border border-slate-200/70 dark:border-slate-700/80">
|
||
<div className="px-6 py-4 border-b border-slate-200 dark:border-slate-700">
|
||
<h3 className="text-lg font-semibold text-slate-900 dark:text-white">转移最高权限</h3>
|
||
<p className="text-sm text-slate-500 dark:text-slate-400 mt-1">请输入您的密码以确认此操作</p>
|
||
</div>
|
||
<div className="p-6 space-y-4">
|
||
<div className="bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg p-3 text-sm text-amber-800 dark:text-amber-100">
|
||
<strong>警告:</strong>转移给 <strong>{targetUser.username}</strong>({targetUser.email})后,当前账号将失去最高权限。
|
||
</div>
|
||
<div className="space-y-2">
|
||
<label className="text-sm font-medium text-slate-700 dark:text-slate-300">密码</label>
|
||
<input
|
||
type="password"
|
||
value={password}
|
||
onChange={(e) => onChangePassword(e.target.value)}
|
||
onKeyDown={(e) => {
|
||
if (e.key === 'Enter') {
|
||
onConfirm()
|
||
}
|
||
}}
|
||
className={inputStyles.base}
|
||
placeholder="请输入您的密码"
|
||
/>
|
||
</div>
|
||
</div>
|
||
<div className="px-6 py-4 border-t border-slate-200 dark:border-slate-700 flex justify-end gap-3">
|
||
<button type="button" onClick={onClose} className={cn(buttonStyles.ghost)}>
|
||
取消
|
||
</button>
|
||
<button type="button" onClick={onConfirm} className={cn(buttonStyles.primary)}>
|
||
确认转移
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|