import { useAjax } from "@/Hook/useAjax"
import { delAdSysWarningRuleApi, DelAdSysWarningRuleProps, getSysWarningRuleApi } from "@/services/adMonitor/earlyWarning"
import { SyncOutlined } from "@ant-design/icons"
import { message, Table } from "antd"
import React, { useEffect } from "react"
import columns from "./expandedColumns"


const ExpandedRowTable: React.FC<{ data: any }> = ({ data }) => {

    /*****************************/
    const getSysWarningRule = useAjax((params) => getSysWarningRuleApi(params), { formatResult: true })
    const delAdSysWarningRule = useAjax((params) => delAdSysWarningRuleApi(params))
    /*****************************/

    useEffect(() => {
        console.log(data);
        if (data?.id) {
            getSysWarningRule.run(data.id)
        }
    }, [])


    const del = (data: DelAdSysWarningRuleProps) => {
        let { accountId, adgroupId, campaignId } = data
        delAdSysWarningRule.run([{ accountId, adgroupId, campaignId }]).then(res => {
            message.success('删除成功')
            getSysWarningRule.refresh()
        })
    }

    return <Table
        size="small"
        bordered
        columns={columns(del)}
        loading={getSysWarningRule.loading}
        dataSource={getSysWarningRule?.data?.data}
        title={() => <div style={{ textAlign: 'center', color: '#1890ff', fontWeight: 700, position: 'relative' }}>
            <span>当前规则配置下的广告</span>
            <a style={{ position: 'absolute', left: 0 }} onClick={() => getSysWarningRule.refresh()}><SyncOutlined /></a>
        </div>}
        pagination={false}
    />;
}

export default React.memo(ExpandedRowTable)