ad-manage/src/pages/adMonitor/adMonitorList/tableMonitorConfig1.tsx

import useCopy from '@/Hook/useCopy'
import { RiseOutlined } from '@ant-design/icons'
import {  Progress, Space, Statistic } from 'antd'
import { ColumnsType } from 'antd/lib/table'
import React from 'react'
import { ReactComponent as RocketSvg } from '@/assets/rocket.svg'
import './index.less'
import { CHUJIAFANGSHI, TUIGUANGMUBIAO, YOUHUAMUBIAO } from './enum'
import Box from './components/box'
import { GGStateData } from './data'
import { copy } from '@/utils/utils'
function columnsMonitor(planDetail: (id: number) => void, details: (id: number) => void, onChange: (value: any) => void, log: (value: any) => void) {
    const { copy } = useCopy()
    return function columns() {
        let newArr: ColumnsType<any> = [
            {
                title: '时间',
                dataIndex: 'day',
                key: 'day',
                align: 'center',
                width: 120,
                ellipsis: true
            },
            {
                title: '广告名称',
                dataIndex: 'adgroup_name',
                key: 'adgroup_name',
                align: 'center',
                width: 170,
                ellipsis: true,
                render: (str, b) => {
                    return <a style={{ color: '#1890ff', fontSize: 12 }} onClick={() => { onChange(b.adgroup_id) }}>{str}</a>
                }
            },
            {
                title: '广告ID',
                dataIndex: 'adgroup_id',
                key: 'adgroup_id',
                align: 'center',
                width: 100,
                ellipsis: true,
                render: (a: any) => {
                    return <a onClick={() => { copy(a) }} style={{ color: '#3946c3' }}>{a}</a>
                }
            },
            {
                title: '计划ID',
                dataIndex: 'campaign_id',
                key: 'campaign_id',
                align: 'center',
                width: 100,
                ellipsis: true,
                render: (a: any) => {
                    return <a onClick={() => { copy(a) }} style={{ color: '#3946c3' }}>{a}</a>
                }
            },
            {
                title: '广告账户',
                dataIndex: 'account_id',
                key: 'account_id',
                width: 70,
                ellipsis: true,
                align: 'center'
            },
            {
                title: '投手',
                dataIndex: 'put_user_name',
                key: 'put_user_name',
                align: 'center',
                ellipsis: true,
                width: 65
            },
            {
                title: '创意预览',
                dataIndex: 'creative_preivew',
                key: 'creative_preivew',
                width: 110,
                align: 'center',
                render: (a: any, b: any) => {
                    return <Box b={a} />
                }
            },
            {
                title: '投放时间',
                dataIndex: 'begin_date',
                key: 'begin_date',
                width: 110,
                align: 'center',
                ellipsis: true,
                render(value, record) {
                    return value + '~' + (record?.end_date === '1970-01-01' ? '长期投放' : record?.end_date)
                },
            },
            {
                title: '广告状态',
                dataIndex: 'status',
                key: 'status',
                align: 'center',
                width: 105,
                ellipsis: true,
                render: (a: any) => {
                    return GGStateData[a] || '--'
                }
            },
            {
                title: '推广目标',
                dataIndex: 'promoted_object_type',
                key: 'promoted_object_type',
                align: 'center',
                width: 80,
                ellipsis: true,
                render: (a: any) => {
                    return TUIGUANGMUBIAO[a]
                }
            },
            {
                title: '广告预算',
                dataIndex: 'daily_budget',
                key: 'daily_budget',
                width: 110,
                align: 'center',
                ellipsis: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '出价方式',
                dataIndex: 'bid_mode',
                key: 'bid_mode',
                align: 'center',
                width: 80,
                render: (a: any) => {
                    return CHUJIAFANGSHI[a] || '--'
                }
            },
            {
                title: '当前出价',
                dataIndex: 'bid_amount',
                key: 'bid_amount',
                width: 110,
                align: 'center',
                ellipsis: true,
                render: (a: any) => {
                    return <div style={a >= 500 ? { backgroundColor: 'rgba(255, 80, 82, .72)', height: 26, color: '#fff', display: 'flex', justifyContent: 'center', alignItems: 'center', fontWeight: 600 } : {}}><Statistic value={a || 0} valueStyle={a >= 500 ? { fontSize: 14 } : {}} /></div>
                }
            },
            {
                title: '广告总消耗',
                dataIndex: 'cost_total',
                key: 'cost_total',
                align: 'center',
                width: 100,
                ellipsis: true,
                sorter: true,
                render: (a: any) => {
                    return <div style={{ height: 26, position: 'relative' }}>
                        <Progress
                            strokeColor={{
                                from: '#10c1e9',
                                to: '#6892d0',
                            }}
                            status="active"
                            showInfo={false}
                            percent={a ? a / 30000 * 100 : 0}
                        />
                        <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 30000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
                    </div>
                }
            },
            {
                title: '今日消耗',
                dataIndex: 'cost_day',
                key: 'cost_day',
                align: 'center',
                width: 105,
                sorter: true,
                render: (a: any) => {
                    return <div style={{ height: 26, position: 'relative' }}>
                        <Progress
                            strokeColor={{
                                from: '#ff5900',
                                to: '#ffd380',
                            }}
                            status="active"
                            showInfo={false}
                            percent={a ? a / 2000 * 100 : 0}
                        />
                        <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 2000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
                    </div>
                }
            },
            {
                title: '当前小时消耗',
                dataIndex: 'cost_hour',
                key: 'cost_hour',
                align: 'center',
                width: 110,
                sorter: true,
                render: (a: any) => {
                    return <div style={{ height: 26, position: 'relative' }}>
                        <Progress
                            strokeColor={{
                                from: '#e7a0f5',
                                to: '#d161f7',
                            }}
                            status="active"
                            showInfo={false}
                            percent={a ? a / 300 * 100 : 0}
                        />
                        <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 300 ? { color: '#000', fontWeight: 500, fontSize: 15 } : { fontWeight: 500, fontSize: 15 }} /></span>
                    </div>
                }
            },
            {
                title: '前第1小时消耗',
                dataIndex: 'cost_last_hour',
                key: 'cost_last_hour',
                align: 'center',
                width: 110,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '前第2小时消耗',
                dataIndex: 'cost_last_two_hour',
                key: 'cost_last_two_hour',
                align: 'center',
                width: 80,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '前第3小时消耗',
                dataIndex: 'cost_last_three_hour',
                key: 'cost_last_three_hour',
                align: 'center',
                width: 110,
                sorter: true,
                render: (a: number) => {
                    return <Statistic value={a || 0} />
                },
            },
            {
                title: '当前小时消耗差额',
                dataIndex: 'cost_diff_before_hour',
                key: 'cost_diff_before_hour',
                align: 'center',
                width: 125,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
                }
            },
            {
                title: '前第1小时消耗差额',
                dataIndex: 'cost_diff_before_two_hour',
                key: 'cost_diff_before_two_hour',
                align: 'center',
                width: 125,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
                }
            },
            {
                title: "前第2小时消耗差额",
                dataIndex: 'cost_diff_before_three_hour',
                key: 'cost_diff_before_three_hour',
                align: 'center',
                width: 125,
                sorter: true,
                render: (a: number) => {
                    return <Statistic value={a || 0} valueStyle={a > 0 ? { color: 'red' } : { color: 'green' }} />
                },
            },
            {
                title: "前三小时消耗趋势",
                dataIndex: 'cost_trend_last_three_hour',
                key: 'cost_trend_last_three_hour',
                align: 'center',
                width: 75,
                render: (a: number) => {
                    return a > 0 ? <RiseOutlined style={{ color: 'red', fontWeight: 900, fontSize: 22 }} /> : '--'
                },
            },
            {
                title: '当前5min消耗流速',
                dataIndex: 'cost_speed',
                key: 'cost_speed',
                align: 'center',
                width: 115,
                render: (a: any) => {
                    a = a ? parseFloat(a.toFixed(2)) : 0
                    return <div style={{ height: 26, position: 'relative' }}>
                        <Progress
                            strokeColor={{
                                from: '#00DDFF',
                                to: '#37A2FF',
                            }}
                            status="active"
                            showInfo={false}
                            percent={a ? a / 100 * 100 : 0}
                        />
                        <span style={{ position: 'absolute', left: 0, top: 2, bottom: 0, right: 0 }}><Statistic value={a || 0} valueStyle={a >= 100 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }} /></span>
                    </div>
                }
            },
            {
                title: '曝光量',
                dataIndex: 'view_day',
                key: 'view_day',
                align: 'center',
                width: 70,
                sorter: true,
                render: (a: number) => {
                    return <Statistic value={a || 0} />
                },
            },
            {
                title: '千次曝光成本',
                dataIndex: 'thousand_display_price_day',
                key: 'thousand_display_price_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '点击量',
                dataIndex: 'click_day',
                key: 'click_day',
                align: 'center',
                width: 70,
                sorter: true,
                render: (a: number) => {
                    return <Statistic value={a || 0} />
                },
            },
            {
                title: '点击均价',
                dataIndex: 'cpc_day',
                key: 'cpc_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '点击率',
                dataIndex: 'ctr_day',
                key: 'ctr_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            {
                title: '优化目标',
                dataIndex: 'optimization_goal',
                key: 'optimization_goal',
                align: 'center',
                width: 115,
                render: (a: any) => {
                    return YOUHUAMUBIAO[a] || '--'
                }
            },
            {
                title: '转化目标量',
                dataIndex: 'conversions_count_day',
                key: 'conversions_count_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '转化目标成本',
                dataIndex: 'conversions_cost_day',
                key: 'conversions_cost_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <div style={a > 500 ? { backgroundColor: '#efea5b', height: 26, color: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'center', fontWeight: 600 } : {}}><Statistic value={a || 0} /></div>
                }
            },
            {
                title: '目标转化率',
                dataIndex: 'conversions_rate_day',
                key: 'conversions_rate_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            {
                title: '下单量',
                dataIndex: 'order_count_day',
                key: 'order_count_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            // {
            //     title: '首日新增下单量',
            //     dataIndex: 'first_dayOrder_count_day',
            //     key: 'first_dayOrder_count_day',
            //     align: 'center',
            //     width: 115,
            //     sorter: true,
            //     render: (a: any) => {
            //         return <Statistic value={a || 0} />
            //     }
            // },
            {
                title: '下单成本',
                dataIndex: 'order_cost_day',
                key: 'order_cost_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '下单率',
                dataIndex: 'order_rate_day',
                key: 'order_rate_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            {
                title: '下单金额',
                dataIndex: 'order_amount_day',
                key: 'order_amount_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            // {
            //     title: '首日新增下单金额',
            //     dataIndex: 'first_day_order_amount_day',
            //     key: 'first_day_order_amount_day',
            //     align: 'center',
            //     width: 115,
            //     sorter: true,
            //     render: (a: any) => {
            //         return <Statistic value={a || 0} />
            //     }
            // },
            {
                title: '下单客单价',
                dataIndex: 'atv_day',
                key: 'atv_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '下单ROI',
                dataIndex: 'order_roi_day',
                key: 'order_roi_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            // {
            //     title: '首日新增下单ROI',
            //     dataIndex: 'first_day_order_roi_day',
            //     key: 'first_day_order_roi_day',
            //     align: 'center',
            //     width: 115,
            //     sorter: true,
            //     render: (a: any) => {
            //         a = a ? parseFloat((a * 100).toFixed(2)) : 0
            //         return a + '%'
            //     }
            // },
            {
                title: '公众号关注人数',
                dataIndex: 'mp_follow_uv_day',
                key: 'mp_follow_uv_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return a
                }
            },
            {
                title: '公众号关注率',
                dataIndex: 'mp_follow_rate_day',
                key: 'mp_follow_rate_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            {
                title: '公众号关注成本',
                dataIndex: 'mp_follow_cost_day',
                key: 'mp_follow_cost_day',
                align: 'center',
                width: 115,
                sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加粉成本',
                dataIndex: 'add_fans_cost_day',
                key: 'add_fans_cost_day',
                align: 'center',
                width: 75,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注次数成本',
                dataIndex: 'mp_follow_pv_cost_day',
                key: 'mp_follow_pv_cost_day',
                align: 'center',
                width: 80,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加粉数',
                dataIndex: 'add_fans_count_day',
                key: 'add_fans_count_day',
                align: 'center',
                width: 75,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注次数',
                dataIndex: 'mp_follow_pv_day',
                key: 'mp_follow_pv_day',
                align: 'center',
                width: 75,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加企业微信客服人数',
                dataIndex: 'scan_follow_uv_day',
                key: 'scan_follow_uv_day',
                align: 'center',
                width: 80,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加企业微信客服成本',
                dataIndex: 'scan_follow_cost_day',
                key: 'scan_follow_cost_day',
                align: 'center',
                width: 80,
                // sorter: true,
                render: (a: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加企业微信客服率',
                dataIndex: 'scan_follow_rate_day',
                key: 'scan_follow_rate_day',
                align: 'center',
                width: 80,
                // sorter: true,
                render: (a: any) => {
                    a = a ? parseFloat((a * 100).toFixed(2)) : 0
                    return a + '%'
                }
            },
            {
                title: '操作',
                dataIndex: 'event',
                key: 'event',
                align: 'center',
                width: 180,
                render: (a: string, b: any) => (<Space>
                    <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', fontSize: 14 }} onClick={() => details(b)}>
                        <span role="img" aria-label="fund-view" className="anticon anticon-fund-view"><RocketSvg /></span><a style={{ marginLeft: 4, color: '#1890ff', fontSize: 12 }}>详情</a>
                    </div>
                    <a onClick={() => log(b)}>告警日志</a>
                    <a style={{ color: '#1890ff', fontSize: 12 }} onClick={() => window.open(`https://ad.qq.com/atlas/${b?.account_id}/admanage/adgroup?tab=adgroup&query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[],%22search_name%22:%22${b.adgroup_id}%22}`)} target="_blank">腾讯广告</a>
                </Space>
                )
            }
        ]
        return newArr
    }
}

let columnsList = () => {

    return function columns() {
        let newArr: ColumnsType<any> = [
            {
                title: '时间',
                dataIndex: 'time',
                key: 'time',
                align: 'center',
                width: 120,
                sorter: true,
                ellipsis: true
            },
            {
                title: '数据更新时间',
                dataIndex: 'create_time',
                key: 'create_time',
                align: 'center',
                width: 120,
                ellipsis: true
            },
            {
                title: '广告ID',
                dataIndex: 'adgroup_id',
                key: 'adgroup_id',
                align: 'center',
                width: 100,
                ellipsis: true,
                render: (a: any) => {
                    return <a onClick={() => { copy(a) }} style={{ color: '#3946c3' }}>{a}</a>
                }
            },
            {
                title: '广告账户',
                dataIndex: 'account_id',
                key: 'account_id',
                width: 70,
                ellipsis: true,
                align: 'center'
            },
            {
                title: '消耗',
                dataIndex: 'cost',
                key: 'cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '曝光量',
                dataIndex: 'view',
                key: 'view',
                align: 'center',
                width: 80
            },
            {
                title: '千次曝光成本',
                dataIndex: 'thousand_display_price',
                key: 'thousand_display_price',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '点击量',
                dataIndex: 'click',
                key: 'click',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '点击率',
                dataIndex: 'ctr',
                key: 'ctr',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '点击均价',
                dataIndex: 'cpc',
                key: 'cpc',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '不感兴趣点击次数',
                dataIndex: 'no_interest_count',
                key: 'no_interest_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '朋友圈视频播放次数',
                dataIndex: 'video_play_count',
                key: 'video_play_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },


            {
                title: '下载次数',
                dataIndex: 'download_count',
                key: 'download_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '安装次数',
                dataIndex: 'install_count',
                key: 'install_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '激活次数',
                dataIndex: 'activated_count',
                key: 'activated_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注人数',
                dataIndex: 'mp_follow_uv',
                key: 'mp_follow_uv',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注成本',
                dataIndex: 'mp_follow_cost',
                key: 'mp_follow_cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注率',
                dataIndex: 'mp_follow_rate',
                key: 'mp_follow_rate',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '公众号关注次数',
                dataIndex: 'mp_follow_pv',
                key: 'mp_follow_pv',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '公众号关注次数成本',
                dataIndex: 'mp_follow_pv_cost',
                key: 'mp_follow_pv_cost',
                align: 'center',
                width: 100,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },

            {
                title: '快应用添加次数',
                dataIndex: 'add_quick_app_pv',
                key: 'add_quick_app_pv',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '快应用添加成本',
                dataIndex: 'add_quick_app_cost',
                key: 'add_quick_app_cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '快应用添加率',
                dataIndex: 'add_quick_app_rate',
                key: 'add_quick_app_rate',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '加企业微信客服人数',
                dataIndex: 'scan_follow_uv',
                key: 'scan_follow_uv',
                align: 'center',
                width: 100,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加企业微信客服成本',
                dataIndex: 'scan_follow_cost',
                key: 'scan_follow_cost',
                align: 'center',
                width: 100,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加企业微信客服率',
                dataIndex: 'scan_follow_rate',
                key: 'scan_follow_rate',
                align: 'center',
                width: 100,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },


            {
                title: '首日新增下单量',
                dataIndex: 'first_day_order_count',
                key: 'first_day_order_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '首日新增下单金额',
                dataIndex: 'first_day_order_amount',
                key: 'first_day_order_amount',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '首日新增下单ROI',
                dataIndex: 'first_day_order_roi',
                key: 'first_day_order_roi',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '订单量',
                dataIndex: 'order_count',
                key: 'order_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '订单金额',
                dataIndex: 'order_amount',
                key: 'order_amount',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '下单成本',
                dataIndex: 'order_cost',
                key: 'order_cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '下单率',
                dataIndex: 'order_rate',
                key: 'order_rate',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '下单ROI',
                dataIndex: 'order_roi',
                key: 'order_roi',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '客单价',
                dataIndex: 'atv',
                key: 'atv',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '转化量',
                dataIndex: 'conversions_count',
                key: 'conversions_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '转化成本',
                dataIndex: 'conversions_cost',
                key: 'conversions_cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '深度转化',
                dataIndex: 'deep_conversions_count',
                key: 'deep_conversions_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '转化率',
                dataIndex: 'conversions_rate',
                key: 'conversions_rate',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a ? (a * 100).toFixed(2) : 0} precision={2} valueStyle={{ color: '#3f8600' }} suffix="%" />
                }
            },
            {
                title: '加粉数',
                dataIndex: 'add_fans_count',
                key: 'add_fans_count',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
            {
                title: '加粉成本',
                dataIndex: 'add_fans_cost',
                key: 'add_fans_cost',
                align: 'center',
                width: 90,
                render: (a: any, b: any) => {
                    return <Statistic value={a || 0} />
                }
            },
        ]
        return newArr
    }

}
export {
    columnsMonitor,
    columnsList
}