57 lines
1.5 KiB
TypeScript
57 lines
1.5 KiB
TypeScript
import { useState } from 'react'
|
||
|
||
import { toast } from 'sonner'
|
||
|
||
import { deleteSysRole } from '@/api'
|
||
import {
|
||
AlertDialog,
|
||
AlertDialogCancel,
|
||
AlertDialogContent,
|
||
AlertDialogDescription,
|
||
AlertDialogFooter,
|
||
AlertDialogHeader,
|
||
AlertDialogTitle,
|
||
} from '@/components/ui/alert-dialog'
|
||
import { Button } from '@/components/ui/button.tsx'
|
||
import { Spinner } from '@/components/ui/spinner.tsx'
|
||
import { type SysRole } from '@/schemas'
|
||
|
||
interface Props {
|
||
currentRow: SysRole
|
||
onClose: () => void
|
||
onConfirm: () => void
|
||
open: boolean
|
||
}
|
||
|
||
export function DeleteDialog({ open, onClose, currentRow, onConfirm }: Props) {
|
||
const [loading, setLoading] = useState(false)
|
||
|
||
const onDelete = async () => {
|
||
try {
|
||
setLoading(true)
|
||
await deleteSysRole(currentRow.id)
|
||
toast('操作成功！')
|
||
onConfirm()
|
||
} finally {
|
||
setLoading(false)
|
||
}
|
||
}
|
||
|
||
return (
|
||
<AlertDialog open={open} onOpenChange={onClose}>
|
||
<AlertDialogContent>
|
||
<AlertDialogHeader>
|
||
<AlertDialogTitle>删除角色?</AlertDialogTitle>
|
||
<AlertDialogDescription>确认删除【{currentRow?.name}】吗？</AlertDialogDescription>
|
||
</AlertDialogHeader>
|
||
<AlertDialogFooter>
|
||
<AlertDialogCancel disabled={loading}>取消</AlertDialogCancel>
|
||
<Button disabled={loading} variant='destructive' onClick={onDelete}>
|
||
确定 {loading && <Spinner data-icon='inline-start' />}
|
||
</Button>
|
||
</AlertDialogFooter>
|
||
</AlertDialogContent>
|
||
</AlertDialog>
|
||
)
|
||
}
|