import { Statistic } from 'antd'
import { ColumnsType } from 'antd/lib/table'
import { SortOrder } from 'antd/lib/table/interface'
import React from 'react'
function columns(props?: { sortOrder?: { columnKey: string, order: SortOrder | undefined } }) {
    let newArr: ColumnsType<any> = [
        {
            title: '投手',
            dataIndex: 'pitcher',
            key: 'pitcher',
            align: 'center',
            width: 60,
            fixed: 'left',
        },
        {
            title: '最早消耗时间',
            dataIndex: 'start_date',
            key: 'start_date',
            align: 'center',
            width: 90,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'start_date' && props?.sortOrder?.order) || undefined,
        },
        {
            title: '最晚消耗时间',
            dataIndex: 'end_date',
            key: 'end_date',
            align: 'center',
            width: 90,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'end_date' && props?.sortOrder?.order) || undefined,
        },
        {
            title: '消耗',
            dataIndex: 'cost',
            key: 'cost',
            width: 110,
            align: 'center',
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'cost' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '注册用户充值',
            dataIndex: 'amount',
            key: 'amount',
            width: 110,
            align: 'center',
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '首日充值',
            dataIndex: 'first_amount',
            key: 'first_amount',
            width: 110,
            align: 'center',
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'first_amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '回收率',
            dataIndex: 'roi',
            key: 'roi',
            align: 'center',
            width: 85,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'roi' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '首日回收率',
            dataIndex: 'first_roi',
            key: 'first_roi',
            width: 70,
            align: 'center',
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'first_roi' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '七日回收率',
            dataIndex: 'roi7',
            key: 'roi7',
            align: 'center',
            width: 95,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'roi7' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '30日回收率',
            dataIndex: 'roi30',
            key: 'roi30',
            align: 'center',
            width: 100,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'roi30' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '毛利额',
            dataIndex: 'profit',
            key: 'profit',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'profit' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '点击率',
            dataIndex: 'click_rate',
            key: 'click_rate',
            align: 'center',
            width: 60,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'click_rate' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '关注率',
            dataIndex: 'follow_rate',
            key: 'follow_rate',
            align: 'center',
            width: 60,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'follow_rate' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '下单率',
            dataIndex: 'order_rate',
            key: 'order_rate',
            align: 'center',
            width: 60,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'order_rate' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '首日下单率',
            dataIndex: 'first_order_rate',
            key: 'first_order_rate',
            align: 'center',
            width: 75,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'first_order_rate' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                a = a ? parseFloat((a * 100).toFixed(2)) : 0
                return <span style={a <= 8 ? { color: '#0f990f', fontWeight: 600 } : a >= 100 ? { color: 'red', fontWeight: 600 } : {}}> {a + '%'}</span >
            },
        },
        {
            title: '曝光量',
            dataIndex: 'view_count',
            key: 'view_count',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'view_count' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                return <Statistic value={a || 0} />
            },
        },
        {
            title: '点击量',
            dataIndex: 'click_count',
            key: 'click_count',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'click_count' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                return <Statistic value={a || 0} />
            },
        },
        {
            title: '关注人数',
            dataIndex: 'follow_user',
            key: 'follow_user',
            align: 'center',
            width: 85,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'follow_user' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                return <Statistic value={a || 0} />
            },
        },
        {
            title: '充值人数',
            dataIndex: 'order_user',
            key: 'order_user',
            align: 'center',
            width: 85,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'order_user' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                return <Statistic value={a || 0} />
            },
        },
        {
            title: '首日充值人数',
            dataIndex: 'first_order_user',
            key: 'first_order_user',
            align: 'center',
            width: 80,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'first_order_user' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '关注成本',
            dataIndex: 'follow_cost',
            key: 'follow_cost',
            align: 'center',
            width: 70,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'follow_cost' && props?.sortOrder?.order) || undefined,
            render: (a: number) => {
                return <Statistic value={a || 0} />
            },
        },
        {
            title: '充值成本',
            dataIndex: 'order_cost',
            key: 'order_cost',
            align: 'center',
            width: 70,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'order_cost' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '首日充值成本',
            dataIndex: 'first_order_cost',
            key: 'first_order_cost',
            align: 'center',
            width: 80,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'first_order_cost' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '客单价',
            dataIndex: 'avg_amount',
            key: 'avg_amount',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'avg_amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '今日充值',
            dataIndex: 'td_amount',
            key: 'td_amount',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'td_amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '昨日充值',
            dataIndex: 'yd_amount',
            key: 'yd_amount',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'yd_amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
        {
            title: '前日充值',
            dataIndex: 'byd_amount',
            key: 'byd_amount',
            align: 'center',
            width: 110,
            sorter: true,
            //sortOrder: (props?.sortOrder?.columnKey === 'byd_amount' && props?.sortOrder?.order) || undefined,
            render: (a: any) => {
                return <Statistic value={a || 0} />
            }
        },
    ]
    return newArr
}
export { columns }