import ProgressTable from "@/components/ProgressTable"
import WidthEllipsis from "@/components/widthEllipsis"
import { Statistic } from "antd"
import React from "react"

function columns12() {

    let newArr: { label: string, data: any[] }[] = [
        {
            label: '玩家充值排行榜',
            data: [
                { title: '玩家ID', dataIndex: 'playerId', label: '玩家充值排行榜', align: 'center', width: 70 },
                { title: '玩家账号', dataIndex: 'playerAccountId', label: '玩家充值排行榜', align: 'center', width: 120, default: 1, render: (a: string, b: any) => (<WidthEllipsis isCopy value={a} />) },
                { title: '角色名称', dataIndex: 'roleName', label: '玩家充值排行榜', align: 'center', width: 90, default: 2, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                { title: '游戏服', dataIndex: 'serverName', label: '玩家充值排行榜', align: 'center', width: 90, default: 3, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                { title: '注册渠道', dataIndex: 'regAgentName', label: '玩家充值排行榜', align: 'center', width: 80, default: 4, render: (a: string, b: any) => (<WidthEllipsis isCopy value={a} />) },
                { title: '注册渠道ID', dataIndex: 'regAgentId', label: '玩家充值排行榜', align: 'center', width: 80 },
                { title: '注册时间', dataIndex: 'regUserTime', label: '玩家充值排行榜', align: 'center', width: 140, default: 5, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                { title: '注册游戏', dataIndex: 'regGameName', label: '玩家充值排行榜', align: 'center', width: 70, default: 6, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                { title: '玩家操作系统', dataIndex: 'playerOs', label: '玩家充值排行榜', align: 'center', width: 70, default: 7 },
                {
                    title: '当天充值金额', dataIndex: 'todayTotalAmount', label: '玩家充值排行榜', align: 'center', width: 70, default: 8, sorter: true,
                    className: 'progress',
                    render: (a: number) => {
                        return <ProgressTable
                            strokeColor={{
                                from: '#108ee9',
                                to: '#87d068',
                            }}
                            percent={a ? a / 2000 * 100 : 0}
                            value={a || 0}
                            valueStyle={a >= 1000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }}
                        />
                    },
                },
                { title: '首充金额', dataIndex: 'firstAmount', label: '玩家充值排行榜', align: 'center', width: 70, default: 9, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                { title: '最近充值金额', dataIndex: 'lastAmount', label: '玩家充值排行榜', align: 'center', width: 70, default: 10, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                {
                    title: '累计充值金额', dataIndex: 'totalAmount', label: '玩家充值排行榜', align: 'center', width: 100, default: 11, sorter: true, className: 'progress',
                    render: (a: number) => {
                        return <ProgressTable
                            strokeColor={{
                                from: '#ff5900',
                                to: '#ffd380',
                            }}
                            percent={a ? a / 10000 * 100 : 0}
                            value={a || 0}
                            valueStyle={a >= 5000 ? { color: '#000', fontWeight: 500 } : { fontWeight: 500 }}
                        />
                    },
                },
                { title: '平均单价', dataIndex: 'avgAmount', label: '玩家充值排行榜', align: 'center', width: 70, default: 12, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                { title: '累计充值次数', dataIndex: 'totalAmountCount', label: '玩家充值排行榜', align: 'center', width: 70, default: 13, sorter: true },
                // { title: '玩家等级标签', dataIndex: '13', label: '玩家充值排行榜', align: 'center', width: 70, default: 14 },
                { title: '最近充值游戏', dataIndex: 'lastAmountGameName', label: '玩家充值排行榜', align: 'center', width: 70, default: 14, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                { title: '最近充值时间', dataIndex: 'lastAmountTime', label: '玩家充值排行榜', align: 'center', width: 140, default: 15, render: (a: string, b: any) => (<WidthEllipsis value={a} />) },
                {
                    title: '注册充值时间差',
                    dataIndex: 'regPayTimeDiff',
                    align: 'center',
                    width: 140,
                    default: 16,
                    render: (a: string, b: any) => {
                        let diff = new Date(b.lastAmountTime).getTime() - new Date(b.regUserTime).getTime()
                        function secondsToDhms(seconds: any) {
                            const days = Math.floor(seconds / (3600 * 24));
                            const hours = Math.floor((seconds % (3600 * 24)) / 3600);
                            const minutes = Math.floor((seconds % 3600) / 60);
                            const remainingSeconds = seconds % 60;
                            return `${days ? days + "天" : ''}${hours ? hours + "小时" : ''}${minutes ? minutes + "分" : ''}${remainingSeconds ? remainingSeconds + "秒" : ''}`
                        }
                        return diff ? <WidthEllipsis value={secondsToDhms(diff / 1000)} /> : '--'
                    }
                },
                {
                    title: '最近充值时间距今',
                    dataIndex: 'nowPayTimeDiff',
                    align: 'center',
                    width: 130,
                    default: 17,
                    render: (a: string, b: any) => {
                        let diff = new Date().getTime() - new Date(b.lastAmountTime).getTime()
                        function secondsToDhms(seconds: any) {
                            const days = Math.floor(seconds / (3600 * 24));
                            const hours = Math.floor((seconds % (3600 * 24)) / 3600);
                            const minutes = Math.floor((seconds % 3600) / 60);
                            const remainingSeconds = seconds % 60;
                            return `${days ? days + "天" : ''}${hours ? hours + "小时" : ''}${minutes ? minutes + "分" : ''}${remainingSeconds ? remainingSeconds.toFixed(0) + "秒" : ''}`
                        }
                        return diff ? <span style={Math.floor((diff / 1000) / (3600 * 24)) > 1 ? { color: 'red' } : {}}><WidthEllipsis value={secondsToDhms(diff / 1000)} /></span> : '--'
                    }
                },
            ]
        },
    ]

    return newArr
}

export default columns12