80 lines
2.3 KiB
TypeScript
80 lines
2.3 KiB
TypeScript
'use client'
|
||
|
||
import type { User } from '../types'
|
||
import { useThemeStyles, cn } from '@/lib/ui-styles'
|
||
import Modal from '@/components/ui/Modal'
|
||
|
||
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) {
|
||
const styles = useThemeStyles()
|
||
if (!isOpen || !targetUser) return null
|
||
|
||
return (
|
||
<Modal
|
||
isOpen={isOpen}
|
||
onClose={onClose}
|
||
title="转移最高权限"
|
||
size="small"
|
||
footer={
|
||
<div className="flex justify-end gap-3">
|
||
<button
|
||
type="button"
|
||
onClick={onClose}
|
||
className={cn(
|
||
styles.buttonStyles.secondary,
|
||
'bg-white dark:bg-slate-800 border-slate-300 dark:border-slate-600 text-slate-700 dark:text-slate-200'
|
||
)}
|
||
>
|
||
取消
|
||
</button>
|
||
<button
|
||
type="button"
|
||
onClick={onConfirm}
|
||
className={cn(styles.buttonStyles.primary)}
|
||
>
|
||
确认转移
|
||
</button>
|
||
</div>
|
||
}
|
||
>
|
||
<div className="space-y-4">
|
||
<p className="text-sm text-slate-500 dark:text-slate-400">请输入您的密码以确认此操作</p>
|
||
<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={styles.inputStyles.base}
|
||
placeholder="请输入您的密码"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</Modal>
|
||
)
|
||
}
|
||
|