87 lines
2.4 KiB
TypeScript
87 lines
2.4 KiB
TypeScript
|
import { Button } from "@/components/ui/button";
|
|||
|
|
import {
|
|||
|
|
Dialog,
|
|||
|
|
DialogClose,
|
|||
|
|
DialogContent,
|
|||
|
|
DialogDescription,
|
|||
|
|
DialogFooter,
|
|||
|
|
DialogHeader,
|
|||
|
|
DialogTitle,
|
|||
|
|
} from "@/components/ui/dialog";
|
|||
|
|
import { Spinner } from "@/components/ui/spinner";
|
|||
|
|
import { Folder, File } from "lucide-react";
|
|||
|
|
import { useRemoveFile } from "@/hooks/use-remove-file";
|
|||
|
|
import { FileStatus, FileType } from "@/apis/file";
|
|||
|
|
|
|||
|
|
type RemoveFileDialogProps = {
|
|||
|
|
open: boolean;
|
|||
|
|
setOpen: (open: boolean) => void;
|
|||
|
|
data?: any;
|
|||
|
|
refetch?: () => void;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
export function RemoveFileDialog({
|
|||
|
|
open,
|
|||
|
|
setOpen,
|
|||
|
|
data,
|
|||
|
|
refetch,
|
|||
|
|
}: RemoveFileDialogProps) {
|
|||
|
|
const { remove, removeIsPending } = useRemoveFile({
|
|||
|
|
onSuccess() {
|
|||
|
|
refetch?.();
|
|||
|
|
setOpen(false);
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const onSubmit = () => {
|
|||
|
|
remove({
|
|||
|
|
id: data?.id,
|
|||
|
|
oldStatus: data?.fileStatus,
|
|||
|
|
newStatus: FileStatus.INVALID,
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<Dialog open={open} onOpenChange={setOpen}>
|
|||
|
|
<DialogContent className="w-[400px]">
|
|||
|
|
<DialogHeader>
|
|||
|
|
<DialogTitle>
|
|||
|
|
您确定要删除该{data?.fileType === FileType.FILE ? "文件" : "目录"}？
|
|||
|
|
</DialogTitle>
|
|||
|
|
{data?.fileType === FileType.FILE ? (
|
|||
|
|
<DialogDescription>
|
|||
|
|
删除后文件将被放入到回收站中，可从回收站中恢复
|
|||
|
|
</DialogDescription>
|
|||
|
|
) : (
|
|||
|
|
<DialogDescription>
|
|||
|
|
目录下的文件也会一并被删除，删除的目录将会放入到回收站中，可从回收站中恢复
|
|||
|
|
</DialogDescription>
|
|||
|
|
)}
|
|||
|
|
<div className="mt-1 flex items-center gap-1 text-sm p-2 rounded-md bg-gray-50">
|
|||
|
|
{data?.fileType === FileType.FILE ? (
|
|||
|
|
<File size={16} className="text-primary flex-none" />
|
|||
|
|
) : (
|
|||
|
|
<Folder size={16} className="text-amber-500 flex-none" />
|
|||
|
|
)}
|
|||
|
|
<span className="break-all">{data?.fileName}</span>
|
|||
|
|
</div>
|
|||
|
|
</DialogHeader>
|
|||
|
|
|
|||
|
|
<DialogFooter>
|
|||
|
|
<DialogClose asChild>
|
|||
|
|
<Button variant="outline">取消</Button>
|
|||
|
|
</DialogClose>
|
|||
|
|
<Button
|
|||
|
|
type="submit"
|
|||
|
|
variant="destructive"
|
|||
|
|
disabled={removeIsPending}
|
|||
|
|
onClick={onSubmit}
|
|||
|
|
>
|
|||
|
|
{removeIsPending && <Spinner />}确定
|
|||
|
|
</Button>
|
|||
|
|
</DialogFooter>
|
|||
|
|
</DialogContent>
|
|||
|
|
</Dialog>
|
|||
|
|
);
|
|||
|
|
}
|