import { useAjax } from "@/Hook/useAjax"
import { addCorpWechatApi } from "@/services/adqV3/global"
import { Form, Input, message, Modal } from "antd"
import React from "react"
import '../../tencentAdPutIn/index.less'


interface Props {
    visible?: boolean
    onChange?: () => void
    onClose?: () => void
}

/**
 * 新增企业微信
 * @returns 
 */
const Modify: React.FC<Props> = ({ visible, onChange, onClose }) => {

    /********************************/
    const [form] = Form.useForm()
    const addCorpWechat = useAjax((params) => addCorpWechatApi(params))
    /********************************/

    const handleOk = () => {
        form.validateFields().then(valid => {
            console.log(valid)
            addCorpWechat.run(valid).then(res => {
                if (res) {
                    message.success('新增成功')
                    onChange?.()
                }
            })
        })
    }

    return <Modal
        title={<strong>{`新增企业微信`}</strong>}
        open={visible}
        onCancel={onClose}
        onOk={handleOk}
        className="modalResetCss"
        confirmLoading={addCorpWechat.loading}
    >
        <Form
            name="basicMiniProgramWechat"
            form={form}
            layout='vertical'
            autoComplete="off"
        >
            <Form.Item label={<strong>企业微信名称</strong>} name="wechatName" rules={[{ required: true, message: '请输入企业微信名称!' }]}>
                <Input placeholder="请输入企业微信名称" allowClear/>
            </Form.Item>
            <Form.Item
                label={<strong>企业微信ID</strong>}
                name="wechatId"
                rules={[
                    { required: true, message: '请输入企业微信ID!' }
                ]}
            >
                <Input placeholder="请输入企业微信ID" allowClear/>
            </Form.Item>
        </Form>
    </Modal>
}

export default React.memo(Modify)