70 lines
1.6 KiB
TypeScript
70 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import CustomModal from "./CustomModal"
|
|
import { Select } from "@mantine/core"
|
|
import { useForm } from "@mantine/form"
|
|
import { useSearchParams } from "next/navigation"
|
|
import { useEffect, useState } from "react"
|
|
import { storage } from "../store"
|
|
|
|
interface ComponentProps {
|
|
open: boolean
|
|
handleCancel: () => void
|
|
handleOk: (name: string) => void
|
|
}
|
|
|
|
const RecoverModal = ({ open, handleCancel, handleOk }: ComponentProps) => {
|
|
const searchParams = useSearchParams()
|
|
const taskId = searchParams.get("task_id")
|
|
const form = useForm({
|
|
initialValues: {
|
|
name: "",
|
|
},
|
|
})
|
|
|
|
const [options, setOptions] = useState<any[]>([])
|
|
|
|
useEffect(() => {
|
|
const getOpts = async () => {
|
|
const taskLabelData = await storage.getItem(taskId!)
|
|
if (taskLabelData) {
|
|
setOptions(
|
|
Object.keys(taskLabelData.state)
|
|
.filter((item) => !item.includes("-text"))
|
|
.map((key) => ({
|
|
label: key,
|
|
value: key,
|
|
}))
|
|
)
|
|
} else {
|
|
setOptions([])
|
|
}
|
|
}
|
|
getOpts()
|
|
}, [taskId])
|
|
|
|
return (
|
|
<CustomModal
|
|
title="应用备份"
|
|
open={open}
|
|
onCancel={handleCancel}
|
|
onOk={async () => {
|
|
await form.validateField("name")
|
|
handleOk(form.values.name)
|
|
}}
|
|
centered
|
|
closeOnClickOutside={false}>
|
|
<Select
|
|
placeholder="选择要应用的备份"
|
|
data={options}
|
|
searchable
|
|
label="备份名称"
|
|
key="backup_name"
|
|
{...form.getInputProps("backup_name")}
|
|
/>
|
|
</CustomModal>
|
|
)
|
|
}
|
|
|
|
export default RecoverModal
|