|
@@ -0,0 +1,147 @@
|
|
|
+import WidthEllipsis from "@/components/widthEllipsis"
|
|
|
+import { Statistic } from "antd"
|
|
|
+import React from "react"
|
|
|
+import moment from "moment"
|
|
|
+import style from '../../gameDataStatistics/extensionData/everyday/index.less'
|
|
|
+
|
|
|
+
|
|
|
+function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
|
|
|
+
|
|
|
+
|
|
|
+ let defaultStart = 11
|
|
|
+ const Dn = Array(90).fill('').map((_item: string, index: number) => {
|
|
|
+ let field = `da${index + 1}`
|
|
|
+ let data: any = {
|
|
|
+ title: `D${index + 1}`,
|
|
|
+ dataIndex: `D${index + 1}`,
|
|
|
+ label: "游戏区服数据",
|
|
|
+ width: 140,
|
|
|
+ render: (a: any, b: any) => {
|
|
|
+ let date1 = moment()
|
|
|
+ if (b?.gsName === '总计') {
|
|
|
+ if (b?.beginDay) {
|
|
|
+ date1 = moment(b.beginDay)
|
|
|
+ } else {
|
|
|
+ date1 = moment()
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ date1 = moment(b.dt)
|
|
|
+ }
|
|
|
+ let dt = moment()
|
|
|
+ let day = dt.diff(date1, 'day');
|
|
|
+ if (index <= day) {
|
|
|
+ let [count1, count2, count3, count4, count5, count6, count7] = b?.[field]?.split('/')
|
|
|
+ return <div className={style.dbox}>
|
|
|
+ <span style={{ color: '#52c41a', fontWeight: 600 }}>活跃人数:<span>{count1}</span></span>
|
|
|
+ <span style={{ color: '#a0d911', fontWeight: 600 }}>付费人数:<span>{count2}</span></span>
|
|
|
+ <span style={{ color: '#1677ff', fontWeight: 600 }}>付费累计人数:<span>{count3}</span></span>
|
|
|
+ <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额:<span><Statistic value={count4 || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
|
|
|
+ <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>付费率:<span>{(count5 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ <span style={{ color: '#ff5722', fontWeight: 600 }}>活跃留存率:<span>{(count6 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ <span style={{ color: '#d81b60', fontWeight: 600 }}>付费留存率:<span>{(count7 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+ return '--'
|
|
|
+ },
|
|
|
+ }
|
|
|
+ data['default'] = defaultStart + index
|
|
|
+ return data
|
|
|
+ })
|
|
|
+
|
|
|
+ let defaultStartM = 101
|
|
|
+ const Mn = Array(9).fill('').map((_item: string, index: number) => {
|
|
|
+ let field = `m${index + 4}`
|
|
|
+ let data: any = {
|
|
|
+ title: `M${index + 4}`,
|
|
|
+ dataIndex: `M${index + 4}`,
|
|
|
+ label: "游戏区服数据",
|
|
|
+ width: 140,
|
|
|
+ render: (a: any, b: any) => {
|
|
|
+ let date1 = moment()
|
|
|
+ if (b?.gsName === '总计') {
|
|
|
+ if (b?.beginDay) {
|
|
|
+ date1 = moment(b.beginDay)
|
|
|
+ } else {
|
|
|
+ date1 = moment()
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ date1 = moment(b.dt)
|
|
|
+ }
|
|
|
+ let dt = moment()
|
|
|
+ let day = dt.diff(date1, 'day');
|
|
|
+ if (index <= day) {
|
|
|
+ let [count1, count2, count3, count4, count5, count6, count7] = b?.[field]?.split('/')
|
|
|
+ return <div className={style.dbox}>
|
|
|
+ <span style={{ color: '#52c41a', fontWeight: 600 }}>活跃人数:<span>{count1}</span></span>
|
|
|
+ <span style={{ color: '#a0d911', fontWeight: 600 }}>付费人数:<span>{count2}</span></span>
|
|
|
+ <span style={{ color: '#1677ff', fontWeight: 600 }}>付费累计人数:<span>{count3}</span></span>
|
|
|
+ <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额:<span><Statistic value={count4 || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
|
|
|
+ <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>付费率:<span>{(count5 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ <span style={{ color: '#ff5722', fontWeight: 600 }}>活跃留存率:<span>{(count6 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ <span style={{ color: '#d81b60', fontWeight: 600 }}>付费留存率:<span>{(count7 * 100)?.toFixed(2)}%</span></span>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+ return '--'
|
|
|
+ },
|
|
|
+ }
|
|
|
+ data['default'] = defaultStartM + index
|
|
|
+ return data
|
|
|
+ })
|
|
|
+
|
|
|
+ return [
|
|
|
+ {
|
|
|
+ label: '基本信息',
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ title: 'GS名称', dataIndex: 'gsName', label: '基本信息', align: 'center', width: 75, default: 1,
|
|
|
+ render: (a: string) => (<WidthEllipsis value={a} />)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '服务开始时间', dataIndex: 'dt', label: '基本信息', align: 'center', width: 90, default: 2,
|
|
|
+ render: (a: string) => (<WidthEllipsis value={`${a}`} />)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '至今服务天数', dataIndex: 'dtDiff', label: '基本信息', align: 'center', width: 45, default: 3,
|
|
|
+ render: (a: string) => (<WidthEllipsis value={a} />)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '指派角色数量', dataIndex: 'roleNum', label: '基本信息', align: 'center', width: 45, default: 4,
|
|
|
+ render: (a: string) => (<WidthEllipsis value={a} />)
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '游戏区服数据',
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ title: '付费角色数量', dataIndex: 'roleAmountNum', label: '游戏区服数据', align: 'center', width: 60, sorter: true, default: 5,
|
|
|
+ render: (a: string) => <Statistic value={a || 0} />
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '付费次数', dataIndex: 'orderCount', label: '游戏区服数据', align: 'center', width: 60, sorter: true, default: 6,
|
|
|
+ render: (a: string) => <Statistic value={a || 0} />
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '付费金额', dataIndex: 'totalAmount', label: '游戏区服数据', align: 'right', width: 65, sorter: true, default: 7,
|
|
|
+ render: (a: string) => <Statistic value={a || 0} />
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'ARPPU(人均付费金额)', tips: 'ARPPU(人均付费金额)=付费金额/付费角色数量', dataIndex: 'gsArppu', label: '游戏区服数据', align: 'right', width: 95, sorter: true, default: 8,
|
|
|
+ render: (a: string) => <Statistic value={a || 0} precision={2} />
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '客单价', tips: '客单价(平均每次付费金额)=付费金额/付费次数', dataIndex: 'gsAvg', label: '游戏区服数据', align: 'right', width: 75, sorter: true, default: 9,
|
|
|
+ render: (a: string) => <Statistic value={a || 0} precision={2} />
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '付费率', tips: '付费率=付费角色数量/指派角色数量', dataIndex: 'gsRate', label: '游戏区服数据', align: 'center', width: 80, sorter: true, default: 10,
|
|
|
+ render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
|
+ },
|
|
|
+ ...Dn,
|
|
|
+ ...Mn
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ ]
|
|
|
+}
|
|
|
+
|
|
|
+export default columns12
|