import { useAjax } from "@/Hook/useAjax"
import { retrialBatchApi } from "@/services/launchAdq/adqv3"
import { BlockOutlined } from "@ant-design/icons"
import { Button, Card, Form, message, Modal, Radio, Space } from "antd"
import React, { useState } from "react"
import '../../tencentAdPutIn/index.less'


interface Props {
    selectedRows: any[]
    onChange?: () => void
}

/**
 * 批量复审
 * @param param0 
 * @returns 
 */
const RetriaModal: React.FC<Props> = ({ selectedRows, onChange }) => {

    /**************************************/
    const [visible, setVisible] = useState<boolean>(false)
    const [form] = Form.useForm();

    const retrialBatch = useAjax((params) => retrialBatchApi(params))
    /**************************************/

    const handleOk = (values: any) => {
        const creativeReviewDTOs = selectedRows.map(item => ({ accountId: item.accountId, dynamicCreativeId: item.dynamicCreativeId }))
        retrialBatch.run({ creativeReviewDTOs, ...values }).then(res => {
            if (res) {
                message.success('复审任务提交成功，结果请到操作记录中擦查看')
                onChange?.()
                setVisible(false)
            }
        })
    }

    return <>
        <Button type='primary' icon={<BlockOutlined />} disabled={selectedRows.length === 0} onClick={() => setVisible(true)}>批量复审</Button>
        <Modal
            title={<strong>批量复审</strong>}
            open={visible}
            className='modalResetCss'
            onCancel={() => setVisible(false)}
            bodyStyle={{ padding: '0 0 40px', position: 'relative', borderRadius: '0 0 8px 8px' }}
            footer={null}
        >
            <Form
                form={form}
                name="retria"
                colon={false}
                layout="vertical"
                style={{ backgroundColor: '#f1f4fc', maxHeight: 600, overflow: 'hidden', overflowY: 'auto', padding: '10px 10px 10px', borderRadius: '0 0 8px 8px' }}
                scrollToFirstError
                onFinishFailed={({ errorFields }) => {
                    message.error(errorFields?.[0]?.errors?.[0])
                }}
                onFinish={handleOk}
                initialValues={{ skipExisting: true }}
            >
                <Card
                    title={<strong style={{ fontSize: 14 }}>复审配置</strong>}
                    className="cardResetCss"
                >
                    <Form.Item
                        label={<strong>是否跳过已提交复审的创意</strong>}
                        name='skipExisting'
                        rules={[
                            { required: true, message: '请选择是否跳过已提交复审的创意' }
                        ]}
                    >
                        <Radio.Group buttonStyle="solid">
                            <Radio.Button value={true}>跳过</Radio.Button>
                            <Radio.Button value={false}>不跳过</Radio.Button>
                        </Radio.Group>
                    </Form.Item>
                </Card>
                <Form.Item className="submit_pull">
                    <Space>
                        <Button onClick={() => setVisible(false)}>取消</Button>
                        <Button type="primary" htmlType="submit" className="modalResetCss" loading={retrialBatch.loading}>
                            确定
                        </Button>
                    </Space>
                </Form.Item>
            </Form>
        </Modal>
    </>
}

export default React.memo(RetriaModal)