import WidthEllipsis from "@/components/widthEllipsis"
import { Statistic, Tag } from "antd"
import React from "react"
import '../../gameDataStatistics/gameData/flowingWater/index.less'

// 充值排行填充
let aFill = { amountNum: '--', amountRoleId: '--', amountRoleName: '--', amountRoleLevel: '--', amountCountry: '--', amountTotalRoleCombatNum: '--', amountRoleTotalAmount: '--' }
function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {


    return [
        {
            label: '基本信息',
            data: [
                {
                    title: '父游戏名称', dataIndex: 'parentGameName', label: '基本信息', align: 'center', width: 85, default: 1,
                    render: (a: string) => (<WidthEllipsis value={a} />)
                },
                {
                    title: 'GS名称', dataIndex: 'gsName', label: '基本信息', align: 'center', width: 75, default: 2,
                    render: (a: string) => (<WidthEllipsis value={a} />)
                },
                {
                    title: 'GS运营状态', dataIndex: 'gsStatus', label: '基本信息', align: 'center', width: 75, default: 3,
                    render: (a: 1 | 2, b: any) => {
                        return a === 1 ? <Tag color="#f50" style={{ marginRight: 0 }}>独立运营</Tag> : a === 2 ? <Tag color="#2db7f5" style={{ marginRight: 0 }}>联合运营</Tag> : <Tag style={{ marginRight: 0 }}>无GS</Tag>
                    }
                },
                {
                    title: '服务区服名称', dataIndex: 'serverName', label: '基本信息', align: 'center', width: 80, default: 4,
                    render: (a: string) => (<WidthEllipsis value={a} />)
                },
                {
                    title: '是否原始区服', dataIndex: 'originServer', label: '基本信息', align: 'center', width: 60, default: 5,
                    render: (a: boolean, b: any) => {
                        return a ? <Tag color="success" style={{ marginRight: 0 }}>是</Tag> : <Tag color="error" style={{ marginRight: 0 }}>否</Tag>
                    }
                },
                {
                    title: '开服时间', dataIndex: 'startTime', label: '基本信息', align: 'center', width: 90, default: 6,
                    render: (a: string) => (<WidthEllipsis value={`${a || '--'}`} />)
                },
                {
                    title: '开服天数', dataIndex: 'startDiff', label: '基本信息', align: 'center', width: 45, default: 7,
                    render: (a: string) => (<WidthEllipsis value={a} />)
                },
                {
                    title: '服务时间', dataIndex: 'gsStartTime', label: '基本信息', align: 'center', width: 160, default: 8,
                    render: (a: string, b: any) => (<WidthEllipsis value={`${b?.startTime}-${b?.endTime}`} />)
                },
                {
                    title: '服务天数', dataIndex: 'serveDiff', label: '基本信息', align: 'center', width: 45, default: 9,
                    render: (a: string) => (<WidthEllipsis value={a} />)
                },
                {
                    title: '服务状态', dataIndex: 'serveStatus', label: '基本信息', align: 'center', width: 75, default: 10,
                    render: (a: boolean) => {
                        return a ? <Tag color="success" style={{ marginRight: 0 }}>服务完成</Tag> : <Tag color="processing" style={{ marginRight: 0 }}>服务中</Tag>
                    }
                }
            ]
        },
        {
            label: '区服数据信息',
            data: [
                {
                    title: '创角人数', dataIndex: 'sonRoleNum', label: '区服数据信息', align: 'center', width: 55, sorter: true, default: 11,
                },
                {
                    title: '付费人数', dataIndex: 'sonServerAmountNum', label: '区服数据信息', align: 'center', width: 60, sorter: true, default: 12,
                    render: (a: number) => a || 0
                },
                {
                    title: '付费率', dataIndex: 'sonAmountRate', label: '区服数据信息', align: 'center', width: 60, sorter: true, default: 13,
                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                },
                {
                    title: '指派期间付费次数', dataIndex: 'totalAmountCount', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 14,
                },
                {
                    title: '指派期间创角人数', dataIndex: 'totalRoleNum', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 15,
                },
                {
                    title: '指派期间付费人数', dataIndex: 'totalAmountNum', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 16,
                },
                {
                    title: '指派期间付费金额', dataIndex: 'totalAmount', label: '区服数据信息', align: 'right', width: 75, sorter: true, default: 17,
                    render: (a: string) => <Statistic value={a || 0} />
                },
                {
                    title: '指派期间付费率', dataIndex: 'amountRate', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 18,
                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                },
                {
                    title: '区服付费排名前十角色',
                    dataIndex: 'amountRankList',
                    label: '区服数据信息',
                    align: 'center',
                    default: 19,
                    children: [
                        {
                            title: '排名',
                            dataIndex: 'amountNum',
                            key: 'amountNum',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item?.amountNum}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色ID',
                            dataIndex: 'amountRoleId',
                            key: 'amountRoleId',
                            width: 100,
                            align: 'center',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><WidthEllipsis value={item.amountRoleId} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色名称',
                            dataIndex: 'amountRoleName',
                            key: 'amountRoleName',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><WidthEllipsis value={item.amountRoleName} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色等级',
                            dataIndex: 'amountRoleLevel',
                            key: 'amountRoleLevel',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item.amountRoleLevel}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '国家',
                            dataIndex: 'amountCountry',
                            key: 'amountCountry',
                            width: 70,
                            align: 'center',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><WidthEllipsis value={item.amountCountry} /></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色战力',
                            dataIndex: 'amountTotalRoleCombatNum',
                            key: 'amountTotalRoleCombatNum',
                            width: 90,
                            align: 'right',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><Statistic value={item.amountTotalRoleCombatNum || 0} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色累计充值金额',
                            dataIndex: 'amountRoleTotalAmount',
                            key: 'amountRoleTotalAmount',
                            width: 70,
                            align: 'right',
                            className: "h5BiomassClass green2ColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item.amountRoleTotalAmount === '--' ? '--' : <Statistic value={item.amountRoleTotalAmount || 0} />}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                    ]
                },
                {
                    title: '区服战力排名前十角色',
                    dataIndex: 'combatRankList',
                    label: '区服数据信息',
                    align: 'center',
                    default: 20,
                    children: [
                        {
                            title: '排名',
                            dataIndex: 'combatNum',
                            key: 'combatNum',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item?.combatNum}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色ID',
                            dataIndex: 'combatRoleId',
                            key: 'combatRoleId',
                            width: 100,
                            align: 'center',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><WidthEllipsis value={item.combatRoleId} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色名称',
                            dataIndex: 'combatRoleName',
                            key: 'combatRoleName',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><WidthEllipsis value={item.combatRoleName} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色等级',
                            dataIndex: 'combatRoleLevel',
                            key: 'combatRoleLevel',
                            width: 65,
                            align: 'center',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item.combatRoleLevel}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '国家',
                            dataIndex: 'combatCountry',
                            key: 'combatCountry',
                            width: 70,
                            align: 'center',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><WidthEllipsis value={item.combatCountry} /></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色战力',
                            dataIndex: 'combatTotalRoleCombatNum',
                            key: 'combatTotalRoleCombatNum',
                            width: 90,
                            align: 'right',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span><Statistic value={item.combatTotalRoleCombatNum || 0} /></span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                        {
                            title: '角色付费金额',
                            dataIndex: 'combatAmount',
                            key: 'combatAmount',
                            width: 70,
                            align: 'right',
                            className: "h5BiomassClass volcanoColorClass",
                            render: (a: any, b: any) => {
                                let cLength = b?.combatRankList?.length || 0
                                let aLength = b?.amountRankList?.length || 0
                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
                                return <div className='h5BiomassTable'>
                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
                                        return <div key={'cc' + index}>
                                            <div><span>{item.combatAmount === '--' ? '--' : <Statistic value={item.combatAmount || 0} />}</span></div>
                                        </div>
                                    })}
                                </div>
                            }
                        },
                    ]
                }
            ]
        }
    ]
}

export default columns12