
import { useAjax } from '@/Hook/useAjax'
import { CampaignTypeEnum, ConfiguredStatusEnum, PromotedObjectType } from '@/services/launchAdq/enum'
import { Col, Row, Input, Select, message } from 'antd'
import React, { useEffect, useCallback } from 'react'
import TableData from '../../components/TableData'
import tableConfig from './tableConfig'
import { getAdqCampaignList, putAdqCampaignPage, putAdqCampaignConfigStatus } from '@/services/launchAdq/adq'
type Props = {
    accountId: string,
    adAccountId: string,
    userId: string,
    queryParmas: {
        accountId?: string,//账户ID
        campaignId?: string,//计划ID
        adgroupId?: string,//广告ID
        adcreativeId?: string,//创意ID
        pageId?: string,//落地页ID
        targetingId?: string,//定向ID}
    },
    tableIdClick: (props: {
        activeKey: string, parma: {
            accountId?: string,//账户ID
            campaignId?: string,//计划ID
            adgroupId?: string,//广告ID
            adcreativeId?: string,//创意ID
            pageId?: string,//落地页ID
            targetingId?: string,//定向ID
        }
    }) => void
}

function Campaign(props: Props) {
    let { accountId, adAccountId, userId,queryParmas, tableIdClick } = props
    // api方法
    const listAjax = useAjax((params) => getAdqCampaignList(params), { formatResult: true })
    const syncAjax = useAjax((adAccountId) => putAdqCampaignPage(adAccountId))
    const switchAjax = useAjax((params) => putAdqCampaignConfigStatus(params))
    console.log('创意=====》')
    useEffect(() => {
        getList({ pageNum: 1, pageSize: 20,...queryParmas })
    }, [accountId, userId,queryParmas])
    // 获取列表
    const getList = useCallback((params: {
        pageNum: number;
        pageSize: number;
        userId?: string;//用户ID
        accountId?: string;//账号本地ID
        campaignName?: string;//计划名称
        campaignId?: string;//计划ID
        configuredStatus?: string;//计划状态
        campaignType?: string;//计划类型
        promotedObjectType?: string;//推广目标类型
    }) => {
        if (!params.campaignName || params.campaignName !== listAjax?.params[0]?.adcreativeName) {
            !params.campaignName && delete params.campaignName
            listAjax.run({ ...params, userId, accountId })
        }
    }, [accountId, userId, listAjax])
    // 同步 
    const sync = useCallback(() => {
        if (!adAccountId) {
            message.error('请先选择要同步的广点通账号!')
            return
        }
        syncAjax.run(adAccountId).then(res => {
            console.log(res)
            res && listAjax.refresh()
            res ? message.success('同步成功！') : message.error('同步失败！')

        })
    }, [adAccountId, listAjax])
    // 启停
    const switchHandle = useCallback((data, checked) => {
        let { accountId, campaignId } = data
        let configuredStatus = checked ? 'AD_STATUS_NORMAL' : 'AD_STATUS_SUSPEND'
        switchAjax.run({ accountId, campaignId, configuredStatus }).then(res => {
            res && listAjax.refresh()
            res ? message.success(checked ? '开启计划成功！' : '关闭计划成功！') : message.error(checked ? '开启计划失败' : '关闭计划失败！')
        })
    }, [])
    return <div>
        <TableData
            columns={() => tableConfig(switchHandle, tableIdClick)}
            ajax={listAjax}
            syncAjax={sync}
            dataSource={listAjax?.data?.data?.records}
            loading={listAjax?.loading || syncAjax?.loading}
            scroll={{ x: 2000, y: 550 }}
            total={listAjax?.data?.data?.total}
            page={listAjax?.data?.data?.current}
            pageSize={listAjax?.data?.data?.size}
            myKey={'campaignId'}
            leftChild={<>
                <Row gutter={[10, 10]}>
                    <Col>
                        <Input
                            placeholder='计划名称'
                            allowClear
                            onBlur={(e) => {
                                let value = e.target.value
                                getList({ pageNum: 1, pageSize: 20, campaignName: value })
                            }}
                            onKeyDownCapture={(e: any) => {
                                let key = e.key
                                if (key === 'Enter') {
                                    let value = e.target.value
                                    getList({ pageNum: 1, pageSize: 20, campaignName: value })
                                }
                            }}
                            onChange={(e) => {
                                let value = e.target.value
                                if (!value) {
                                    getList({ pageNum: 1, pageSize: 20, campaignName: value })
                                }
                            }}
                        />
                    </Col>
                    <Col>
                        <Input
                            placeholder='计划ID'
                            allowClear
                            onBlur={(e) => {
                                let value = e.target.value
                                getList({ pageNum: 1, pageSize: 20, campaignId: value })
                            }}
                            onKeyDownCapture={(e: any) => {
                                let key = e.key
                                if (key === 'Enter') {
                                    let value = e.target.value
                                    getList({ pageNum: 1, pageSize: 20, campaignId: value })
                                }
                            }}
                            onChange={(e) => {
                                let value = e.target.value
                                if (!value) {
                                    getList({ pageNum: 1, pageSize: 20, campaignId: value })
                                }
                            }}
                        />
                    </Col>
                    <Col>
                        <Select placeholder='推广目标选择' style={{ minWidth: 200 }} showSearch filterOption={(input: any, option: any) =>
                            (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
                        } allowClear onChange={(value: any) => {
                            getList({ pageNum: 1, pageSize: 20, promotedObjectType: value })
                        }}>
                            {
                                Object.keys(PromotedObjectType).map(key => {
                                    // let obj = JSON.parse(PromotedObjectType[key])
                                    return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
                                })
                            }
                        </Select>
                    </Col>
                    <Col>
                        <Select placeholder='计划状态' style={{ minWidth: 200 }} showSearch filterOption={(input: any, option: any) =>
                            (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
                        } allowClear onChange={(value: any) => {
                            getList({ pageNum: 1, pageSize: 20, configuredStatus: value })
                        }}>
                            {
                                Object.keys(ConfiguredStatusEnum).map(key => {
                                    // let obj = JSON.parse(PromotedObjectType[key])
                                    return <Select.Option value={key} key={key}>{ConfiguredStatusEnum[key]}</Select.Option>
                                })
                            }
                        </Select>
                    </Col>
                    <Col>
                        <Select placeholder='计划类型' style={{ minWidth: 200 }} showSearch filterOption={(input: any, option: any) =>
                            (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
                        } allowClear onChange={(value: any) => {
                            getList({ pageNum: 1, pageSize: 20, campaignType: value })
                        }}>
                            {
                                Object.keys(CampaignTypeEnum).map(key => {
                                    // let obj = JSON.parse(PromotedObjectType[key])
                                    console.log(key)
                                    return <Select.Option value={key} key={key}>{CampaignTypeEnum[key]}</Select.Option>
                                })
                            }
                        </Select>
                    </Col>
                </Row>
            </>}
            onChange={(props: any) => {
                let { sortData, pagination } = props
                let { current, pageSize } = pagination
                getList({ pageNum: current, pageSize })
            }}
        />
    </div>
}
export default Campaign