|
@@ -2,13 +2,13 @@ import WidthEllipsis from "@/components/widthEllipsis"
|
|
import { Progress, Statistic } from "antd"
|
|
import { Progress, Statistic } from "antd"
|
|
import React from "react"
|
|
import React from "react"
|
|
import { PRODUCT_TYPE_ENUM } from "../../const"
|
|
import { PRODUCT_TYPE_ENUM } from "../../const"
|
|
-import { formatSecondsToTime } from "@/utils/utils"
|
|
|
|
import style from './index.less'
|
|
import style from './index.less'
|
|
import moment from "moment"
|
|
import moment from "moment"
|
|
|
|
+import { ACCOUNTTYPE, APPTYPE } from "@/pages/iaaSystem/manage/const"
|
|
|
|
|
|
function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
|
|
function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
|
|
|
|
|
|
- const defaultIndex = 26
|
|
|
|
|
|
+ const defaultIndex = 23
|
|
const trend = [1, 2, 3, 4, 5, 6, 7, 14, 30, 45, 60, 75, 90].map((index, count) => {
|
|
const trend = [1, 2, 3, 4, 5, 6, 7, 14, 30, 45, 60, 75, 90].map((index, count) => {
|
|
|
|
|
|
const dataIndex = `d${index}`
|
|
const dataIndex = `d${index}`
|
|
@@ -27,54 +27,6 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
|
|
}
|
|
}
|
|
return <div style={{ height: 102, width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>--</div>
|
|
return <div style={{ height: 102, width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>--</div>
|
|
}
|
|
}
|
|
- // children: [
|
|
|
|
- // {
|
|
|
|
- // title: '留存',
|
|
|
|
- // dataIndex: `trend${index}`,
|
|
|
|
- // key: `trend${index}`,
|
|
|
|
- // width: 100,
|
|
|
|
- // align: 'center',
|
|
|
|
- // className: count % 2 ? "redColorClass" : undefined,
|
|
|
|
- // render: (_: any, b: any) => {
|
|
|
|
- // const data = b?.[dataIndex]?.split('/')
|
|
|
|
- // return <div className={style.dbox}>
|
|
|
|
- // <span style={{ color: '#d81b60', fontWeight: 600 }}>人数:<span><Statistic value={data?.[0] || 0} /></span></span>
|
|
|
|
- // <span style={{ color: '#0f538a', fontWeight: 600 }}>率:<span><Statistic value={data?.[1] ? data?.[1] * 100 : 0} precision={2} valueStyle={!data?.[1] ? {} : data?.[1] >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" /></span></span>
|
|
|
|
- // </div>
|
|
|
|
- // },
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // title: '收入',
|
|
|
|
- // dataIndex: `income${index}`,
|
|
|
|
- // key: `income${index}`,
|
|
|
|
- // width: 110,
|
|
|
|
- // align: 'center',
|
|
|
|
- // className: count % 2 ? "redColorClass" : undefined,
|
|
|
|
- // render: (_: any, b: any) => {
|
|
|
|
- // const data = b?.[dataIndex]?.split('/')
|
|
|
|
- // return <div className={style.dbox}>
|
|
|
|
- // <span style={{ color: '#d81b60', fontWeight: 600 }}>新增:<span><Statistic value={data?.[2] || 0} precision={2} /></span></span>
|
|
|
|
- // <span style={{ color: '#0f538a', fontWeight: 600 }}>累计:<span><Statistic value={data?.[3] || 0} precision={2} /></span></span>
|
|
|
|
- // </div>
|
|
|
|
- // }
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // title: 'ROI',
|
|
|
|
- // dataIndex: `roi${index}`,
|
|
|
|
- // key: `roi${index}`,
|
|
|
|
- // width: 100,
|
|
|
|
- // align: 'center',
|
|
|
|
- // className: count % 2 ? "redColorClass" : undefined,
|
|
|
|
- // render: (_: any, b: any) => {
|
|
|
|
- // const data = b?.[dataIndex]?.split('/')
|
|
|
|
- // return <div className={style.dbox}>
|
|
|
|
- // <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>增:<span><Statistic value={data?.[5] ? data?.[5] * 100 : 0} precision={2} valueStyle={!data?.[5] ? {} : data?.[5] >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" /></span></span>
|
|
|
|
- // <span style={{ color: '#ff5722', fontWeight: 600 }}>回:<span><Statistic value={data?.[6] ? data?.[6] * 100 : 0} precision={2} valueStyle={!data?.[6] ? {} : data?.[6] >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" /></span></span>
|
|
|
|
- // <span style={{ color: '#d81b60', fontWeight: 600 }}>倍:<span><Statistic value={data?.[7] || 0} precision={2} /></span></span>
|
|
|
|
- // </div>
|
|
|
|
- // }
|
|
|
|
- // },
|
|
|
|
- // ]
|
|
|
|
}
|
|
}
|
|
|
|
|
|
})
|
|
})
|
|
@@ -107,12 +59,20 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
|
|
title: '业务类型', dataIndex: 'productType', label: '基本信息', align: 'center', width: 80, default: 4,
|
|
title: '业务类型', dataIndex: 'productType', label: '基本信息', align: 'center', width: 80, default: 4,
|
|
render: (a: string) => (<WidthEllipsis value={PRODUCT_TYPE_ENUM[a as keyof typeof PRODUCT_TYPE_ENUM]} />)
|
|
render: (a: string) => (<WidthEllipsis value={PRODUCT_TYPE_ENUM[a as keyof typeof PRODUCT_TYPE_ENUM]} />)
|
|
},
|
|
},
|
|
- // {
|
|
|
|
- // title: '变现广告位', dataIndex: 'realizationAdUnit', label: '基本信息', align: 'center', width: 90, default: 5,
|
|
|
|
- // render: (a: string) => <WidthEllipsis value={a} />
|
|
|
|
- // },
|
|
|
|
{
|
|
{
|
|
- title: '总消耗', dataIndex: 'totalCost', label: '基本信息', align: 'right', width: 95, default: 6, sorter: true,
|
|
|
|
|
|
+ title: '应用类型', dataIndex: 'appType', label: '基本信息', align: 'center', width: 80, default: 5,
|
|
|
|
+ render: (a: string) => (<WidthEllipsis value={APPTYPE[a as keyof typeof APPTYPE]?.text} />)
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '推广媒体', dataIndex: 'accountType', label: '基本信息', align: 'center', width: 80, default: 6,
|
|
|
|
+ render: (a: string) => (<WidthEllipsis value={ACCOUNTTYPE[a as keyof typeof ACCOUNTTYPE]?.text} />)
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '变现广告位', dataIndex: 'realizationAdUnit', label: '基本信息', align: 'center', width: 80, default: 7,
|
|
|
|
+ render: (a: string) => (<WidthEllipsis value={a} />)
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '总消耗', dataIndex: 'totalCost', label: '基本信息', align: 'right', width: 95, default: 8, sorter: true,
|
|
className: 'padding_0',
|
|
className: 'padding_0',
|
|
render: (a: number) => <div style={{ height: 107, position: 'relative' }}>
|
|
render: (a: number) => <div style={{ height: 107, position: 'relative' }}>
|
|
<Progress
|
|
<Progress
|
|
@@ -128,7 +88,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
|
|
</div>
|
|
</div>
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '消耗', dataIndex: 'cost', label: '基本信息', align: 'right', width: 85, default: 7, sorter: true,
|
|
|
|
|
|
+ title: '消耗', dataIndex: 'cost', label: '基本信息', align: 'right', width: 85, default: 9, sorter: true,
|
|
className: 'padding_0',
|
|
className: 'padding_0',
|
|
render: (a: number) => <div style={{ height: 107, position: 'relative' }}>
|
|
render: (a: number) => <div style={{ height: 107, position: 'relative' }}>
|
|
<Progress
|
|
<Progress
|
|
@@ -144,81 +104,56 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
|
|
</div>
|
|
</div>
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '赔付金', dataIndex: 'payout', label: '基本信息', align: 'right', width: 80, default: 8, sorter: true,
|
|
|
|
|
|
+ title: '赔付金', dataIndex: 'payout', label: '基本信息', align: 'right', width: 80, default: 10, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '注册人数', dataIndex: 'userRegCnt', label: '基本信息', align: 'center', width: 80, default: 9, sorter: true,
|
|
|
|
|
|
+ title: '注册人数', dataIndex: 'userRegCnt', label: '基本信息', align: 'center', width: 80, default: 11, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '注册成本', dataIndex: 'regPaid', label: '基本信息', align: 'center', width: 80, default: 10, sorter: true,
|
|
|
|
|
|
+ title: '注册成本', dataIndex: 'regPaid', label: '基本信息', align: 'center', width: 80, default: 12, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '注册用户留存人数', dataIndex: 'userRetentionCnt', label: '基本信息', align: 'center', width: 80, default: 11, sorter: true,
|
|
|
|
|
|
+ title: '今日留存人数', dataIndex: 'userRetentionCnt', label: '基本信息', align: 'center', width: 80, default: 13, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '注册用户留存率', dataIndex: 'userRetentionRatio', label: '基本信息', align: 'center', width: 80, default: 12, sorter: true,
|
|
|
|
|
|
+ title: '今日留存率', dataIndex: 'userRetentionCntRatio', label: '基本信息', align: 'center', width: 80, default: 14, sorter: true,
|
|
render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '广告变现人数', dataIndex: 'appAdPayingUsers', label: '基本信息', align: 'center', width: 75, default: 13, sorter: true,
|
|
|
|
|
|
+ title: '首日广告变现人数', dataIndex: 'appAdPayingUsers', label: '基本信息', align: 'center', width: 75, default: 15, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
|
|
+
|
|
{
|
|
{
|
|
- title: '人均在线时长', dataIndex: 'avgDuration', label: '基本信息', align: 'center', width: 110, default: 14, sorter: true,
|
|
|
|
- render: (a: number, b: any) => {
|
|
|
|
- return b.dt === '总计' ? '--' : formatSecondsToTime(a ? Math.round(a) : 0)
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: '人均启动次数', dataIndex: 'avgStartTimes', label: '基本信息', align: 'center', width: 70, default: 15, sorter: true,
|
|
|
|
- render: (a: number, b: any) => b.dt === '总计' ? '--' : <Statistic value={a || 0} />
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: '人均观看广告次数', dataIndex: 'avgAdViewTimes', label: '基本信息', align: 'center', width: 80, default: 16, sorter: true,
|
|
|
|
- render: (a: number, b: any) => b.dt === '总计' ? '--' : <Statistic value={a || 0} />
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: '广告变现UV', dataIndex: 'adMonetizeUv', label: '基本信息', align: 'center', width: 75, default: 17, sorter: true,
|
|
|
|
- render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: 'ecpm', dataIndex: 'ecpm', label: '基本信息', align: 'center', width: 80, default: 18, sorter: true,
|
|
|
|
- render: (a: number, b: any) => b.dt === '总计' ? '--' : <Statistic value={a || 0} precision={2} />
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: '广告渗透率', dataIndex: 'adPermeability', label: '基本信息', align: 'center', width: 75, default: 19, sorter: true,
|
|
|
|
- render: (a: number, b: any) => b.dt === '总计' ? '--' : <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
|
|
|
|
+ title: '总ecpm', dataIndex: 'totalEcpm', label: '基本信息', align: 'center', width: 80, default: 16, sorter: true,
|
|
|
|
+ render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '广告ARPU', dataIndex: 'adArpu', label: '基本信息', align: 'center', width: 80, default: 20, sorter: true,
|
|
|
|
|
|
+ title: '总arpu', dataIndex: 'totalArpu', label: '基本信息', align: 'center', width: 80, default: 17, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '广告曝光量', tips: '总收入/ecpm*1000', dataIndex: 'adViewCount', label: '基本信息', align: 'center', width: 80, default: 21, sorter: true,
|
|
|
|
- render: (a: number, b: any) => b.dt === '总计' ? '--' : <Statistic value={a || 0} />
|
|
|
|
|
|
+ title: '广告总曝光量', dataIndex: 'viewTotal', label: '基本信息', align: 'center', width: 80, default: 18, sorter: true,
|
|
|
|
+ render: (a: number, b: any) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '总收入', dataIndex: 'income', label: '基本信息', align: 'right', width: 80, default: 22, sorter: true,
|
|
|
|
|
|
+ title: '累计总收入', dataIndex: 'totalIncome', label: '基本信息', align: 'right', width: 80, default: 19, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '总回收', dataIndex: 'incomeRoi', label: '基本信息', align: 'right', width: 80, default: 23, sorter: true,
|
|
|
|
|
|
+ title: '累计总回收', dataIndex: 'totalIncomRoi', label: '基本信息', align: 'right', width: 80, default: 20, sorter: true,
|
|
render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '广告变现收入', dataIndex: 'adIncome', label: '基本信息', align: 'center', width: 75, default: 24, sorter: true,
|
|
|
|
- render: (a: number) => <Statistic value={a || 0} precision={2} />
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- title: '分享成功人数', dataIndex: 'shareUv', label: '基本信息', align: 'center', width: 75, default: 25, sorter: true,
|
|
|
|
|
|
+ title: '分享成功人数', dataIndex: 'shareUv', label: '基本信息', align: 'center', width: 75, default: 21, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
{
|
|
{
|
|
- title: '分享后活跃人数', dataIndex: 'shareClkUv', label: '基本信息', align: 'center', width: 80, default: 26, sorter: true,
|
|
|
|
|
|
+ title: '分享后活跃人数', dataIndex: 'shareClkUv', label: '基本信息', align: 'center', width: 80, default: 22, sorter: true,
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
render: (a: number) => <Statistic value={a || 0} />
|
|
},
|
|
},
|
|
...trend
|
|
...trend
|