import { Form, Input, Modal } from "antd"
import React, { useState } from "react"
import moment from "moment"
import { randomString } from "@/utils/utils"

/**
 * 设置名称
 * @returns 
 */
interface Props {
    visible?: boolean,
    onClose?: () => void,
    onChange?: (data: any) => void
    ajax?: any
}
const SubmitModal: React.FC<Props> = (props) => {

    /********************/
    const { visible, onClose, onChange, ajax } = props
    const [form] = Form.useForm()
    const [initialValues] = useState<{ taskName: string }>({ taskName: '任务' + moment().format('MM_DD_HH_mm_ss') + '_' + randomString(true, 3, 5) })

    const handleOk = async () => {
        form.submit()
        let data = await form.validateFields()
        onChange && onChange(data)
    }

    return <Modal
        title="提交任务"
        className="modalResetCss"
        open={visible}
        confirmLoading={ajax?.loading}
        onOk={handleOk}
        onCancel={() => { onClose && onClose() }}
    >
        <Form
            name="basicSubmit"
            form={form}
            labelCol={{ span: 4 }}
            wrapperCol={{ span: 20 }}
            autoComplete="off"
            initialValues={{ ...initialValues }}

        >
            <Form.Item label={<strong>任务名称</strong>} name="taskName">
                <Input placeholder="请输入任务名称" />
            </Form.Item>
        </Form>
    </Modal>
}

export default React.memo(SubmitModal)