import { useAjax } from "@/Hook/useAjax"
import { adUserTagApi } from "@/services/launchAdq/adq"
import { Form, Input, Modal, Select, message } from "antd"
import React from "react"



interface Props {
    data: any,
    visible?: boolean
    onClose?: () => void
    onChange?: () => void
}
const PlanTag: React.FC<Props> = ({ data, visible, onClose, onChange }) => {

    /******************************/
    const [form] = Form.useForm();
    const adUserTag = useAjax((params) => adUserTagApi(params))
    /******************************/

    const handleOk = () => {
        form.validateFields().then(values => {
            adUserTag.run({ ...values, accountId: data.account_id, adgroupId: data.adgroup_id }).then(res => {
                if (res) {
                    onChange?.()
                    message.success('打标记成功')
                }
            })
        })
    }

    return <Modal
        title={`${data.adgroup_name} 打标记`}
        open={visible}
        onCancel={onClose}
        onOk={handleOk}
        confirmLoading={adUserTag.loading}
    >
        <Form
            form={form}
            labelCol={{ span: 4 }}
            className='ad_form_style'
            colon={false}
            name="DBJ"
            labelAlign="left"
            initialValues={{

            }}
        >
            <Form.Item label={<strong>类型</strong>} name='tagValue' rules={[{ required: true, message: '请选择打标签类型' }]}>
                <Select
                    placeholder={'请选择打标签类型'}
                >
                    <Select.Option value={90}>警告</Select.Option>
                    <Select.Option value={100}>异常</Select.Option>
                </Select>
            </Form.Item>
            <Form.Item label={<strong>备注</strong>} name='tagRemark' rules={[{ required: true, message: '请输入打标签备注' }]}>
                <Input placeholder="请输入打标签备注"/>
            </Form.Item>
        </Form>
    </Modal>
}

export default React.memo(PlanTag)