wjx 7 miesięcy temu
rodzic
commit
6d01c96f70

+ 5 - 0
config/routerConfig.ts

@@ -172,6 +172,11 @@ const iaaData = {
                     path: '/iaaData/ocenaengineIaa/adList',
                     name: '广告列表',
                     component: './iaaData/ocenaengineIaa/adList',
+                },
+                {
+                    path: '/iaaData/ocenaengineIaa/appEveryDayData',
+                    name: '应用每日数据',
+                    component: './iaaData/ocenaengineIaa/appEveryDayData',
                 }
             ]
         }

+ 99 - 0
src/pages/iaaData/ocenaengineIaa/appEveryDayData/index.tsx

@@ -0,0 +1,99 @@
+
+import React, { useEffect, useState } from "react"
+import columns12 from "./tableConfig";
+import TablePro from "@/components/TablePro";
+import QueryForm from "@/components/QueryForm";
+import moment from "moment";
+import { useModel } from "umi";
+import { useAjax } from "@/Hook/useAjax";
+import { getByteAppListApi, GetByteAppListProps, getByteAppTotalApi } from "@/services/iaaData";
+
+/**
+ * 应用每日数据
+ * @returns 
+ */
+const AppEveryDayData: React.FC = () => {
+    /****************************************/
+    const { initialState } = useModel('@@initialState');
+    const [queryForm, setQueryForm] = useState<GetByteAppListProps>({
+        pageNum: 1,
+        pageSize: 30,
+        costDayBegin: moment().format('YYYY-MM-DD'),
+        costDayEnd: moment().format('YYYY-MM-DD'),
+    })
+    const [totalData, setTotalData] = useState<any[]>([])
+
+    const getByteAppList = useAjax((params) => getByteAppListApi(params))
+    const getByteAppTotal = useAjax((params) => getByteAppTotalApi(params))
+    /****************************************/
+
+    useEffect(() => {
+        if (initialState?.iaaApp) {
+            const [appId, productType] = initialState.iaaApp.split('||')
+            getByteAppList.run({ ...queryForm, appId, productType })
+            getByteAppTotal.run({ ...queryForm, appId, productType }).then((res: { data: { id: number; appName: string } }) => {
+                if (res?.data) {
+                    let data = res?.data
+                    data.id = 1
+                    data.appName = '总计'
+                    setTotalData([data])
+                } else {
+                    setTotalData([{ id: 1, appName: '总计' }])
+                }
+            })
+        }
+
+    }, [queryForm, initialState?.iaaApp])
+
+    return <div>
+        <TablePro
+            leftChild={<QueryForm
+                initialValues={{ day1: [moment(), moment()] }}
+                day1={{ placeholder: ['消耗日期开始', '消耗日期结束'] }}
+                onChange={(data: any) => {
+                    console.log(data)
+                    const { day1, ...params } = data
+                    let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                    newQueryForm.pageNum = 1
+                    if (day1 && day1?.length === 2) {
+                        newQueryForm['costDayBegin'] = moment(day1[0]).format('YYYY-MM-DD')
+                        newQueryForm['costDayEnd'] = moment(day1[1]).format('YYYY-MM-DD')
+                    } else {
+                        delete newQueryForm['costDayBegin']
+                        delete newQueryForm['costDayEnd']
+                    }
+                    setQueryForm({ ...newQueryForm, ...params })
+                }}
+            />}
+            isZj
+            totalData={totalData}
+            config={columns12()}
+            configName={'头条应用每日数据'}
+            fixed={{ left: 4, right: 0 }}
+            scroll={{ x: 1000, y: 620 }}
+            title='头条应用每日数据'
+            loading={getByteAppList.loading}
+            ajax={getByteAppList}
+            page={getByteAppList?.data?.data?.current || 1}
+            pageSize={getByteAppList?.data?.data?.size || 20}
+            total={getByteAppList?.data?.data?.total || 0}
+            dataSource={getByteAppList?.data?.data?.records?.map((item: any, index: number) => ({ ...item, id: Number(queryForm.pageNum.toString() + (index + '')) }))}
+            onChange={(pagination: any, _: any, sortData: any) => {
+                let { current, pageSize } = pagination
+                let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                if (sortData && sortData?.order) {
+                    newQueryForm['sortAsc'] = sortData?.order === 'ascend' ? true : false
+                    newQueryForm['sortFiled'] = sortData?.field
+                } else {
+                    delete newQueryForm['sortAsc']
+                    delete newQueryForm['sortFiled']
+                }
+                newQueryForm.pageNum = current || newQueryForm.pageNum
+                newQueryForm.pageSize = pageSize || newQueryForm.pageSize
+                setQueryForm({ ...newQueryForm })
+            }}
+        />
+    </div>
+}
+
+export default AppEveryDayData

+ 700 - 0
src/pages/iaaData/ocenaengineIaa/appEveryDayData/tableConfig.tsx

@@ -0,0 +1,700 @@
+import WidthEllipsis from "@/components/widthEllipsis"
+import { Progress, Statistic } from "antd"
+import React from "react"
+import { PRODUCT_TYPE_ENUM } from "../../const"
+import { formatSecondsToTime } from "@/utils/utils"
+
+function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
+
+
+    return [
+        {
+            label: '基本信息',
+            data: [
+                {
+                    title: '应用', dataIndex: 'appName', label: '基本信息', align: 'center', width: 120, default: 1,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '应用ID', dataIndex: 'appId', label: '基本信息', align: 'center', width: 80,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '小程序名称', dataIndex: 'mpName', label: '基本信息', align: 'center', width: 85, default: 2,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '小程序ID', dataIndex: 'mpId', label: '基本信息', align: 'center', width: 80,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '业务类型', dataIndex: 'productType', label: '基本信息', align: 'center', width: 80, default: 3,
+                    render: (a: string) => (<WidthEllipsis value={PRODUCT_TYPE_ENUM[a as keyof typeof PRODUCT_TYPE_ENUM]} />)
+                },
+                {
+                    title: '消耗时间', dataIndex: 'dt', label: '基本信息', align: 'center', width: 80, default: 4,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '累计消耗', dataIndex: 'costTotal', label: '基本信息', align: 'center', width: 95, default: 5, sorter: true,
+                    className: 'padding_0 redColorClass',
+                    render: (a: number) => <div style={{ height: 26, position: 'relative' }}>
+                        <Progress
+                            strokeColor={{
+                                from: '#10c1e9',
+                                to: '#6892d0',
+                            }}
+                            status="active"
+                            showInfo={false}
+                            percent={a ? a / 20000 * 100 : 0}
+                        />
+                        <span style={{ position: 'absolute', left: '50%', top: '50%', width: '100%', padding: '0 5px', transform: 'translate(-50%, -50%)' }}><Statistic style={{ fontWeight: 'bold' }} value={a || 0} precision={2} valueStyle={a >= 20000 ? { color: '#000', fontWeight: 'bold' } : { fontWeight: 'bold' }} /></span>
+                    </div>
+                },
+                {
+                    title: '每日真实消耗', dataIndex: 'costDruth', label: '基本信息', align: 'center', width: 90, default: 6, sorter: true, className: 'redColorClass',
+                    render: (a: string) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '每日消耗', dataIndex: 'cost', label: '基本信息', align: 'center', width: 85, default: 7, sorter: true,
+                    className: 'padding_0 redColorClass',
+                    render: (a: number) => <div style={{ height: 26, position: 'relative' }}>
+                        <Progress
+                            strokeColor={{
+                                from: '#ff5900',
+                                to: '#ffd380',
+                            }}
+                            status="active"
+                            showInfo={false}
+                            percent={a ? a / 20000 * 100 : 0}
+                        />
+                        <span style={{ position: 'absolute', left: '50%', top: '50%', width: '100%', padding: '0 5px', transform: 'translate(-50%, -50%)' }}><Statistic value={a || 0} precision={2} valueStyle={a >= 20000 ? { color: '#000', fontWeight: 'bold' } : { fontWeight: 'bold' }} /></span>
+                    </div>
+                },
+                {
+                    title: '每日赔付金', dataIndex: 'payout', label: '基本信息', align: 'right', width: 80, default: 8, sorter: true, className: 'redColorClass',
+                    render: (a: string) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '推广广告账号数量', tips: '消耗大于0', dataIndex: 'accountCount', label: '基本信息', align: 'center', width: 80, default: 9, sorter: true, className: 'redColorClass',
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '推广广告数量', tips: '消耗大于0', dataIndex: 'adCount', label: '基本信息', align: 'center', width: 80, default: 10, sorter: true, className: 'redColorClass',
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+            ]
+        },
+        {
+            label: '广告媒体端指标',
+            data: [
+                {
+                    title: '点击量(广告)', dataIndex: 'click', label: '广告媒体端指标', align: 'center', width: 65, default: 11, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '曝光量(广告)', dataIndex: 'showCount', label: '广告媒体端指标', align: 'center', width: 65, default: 12, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '千次曝光成本(广告)', dataIndex: 'avgShowCost', label: '广告媒体端指标', align: 'right', width: 80, default: 13, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '点击均价(广告)', dataIndex: 'avgClickCost', label: '广告媒体端指标', align: 'right', width: 65, default: 14, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '点击率(广告)', dataIndex: 'ctr', label: '广告媒体端指标', align: 'center', width: 80, default: 15, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '转化目标量', dataIndex: 'convertCount', label: '广告媒体端指标', align: 'center', width: 65, default: 16, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '转化目标成本', dataIndex: 'convertCost', label: '广告媒体端指标', align: 'right', width: 65, default: 17, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '转化目标率', dataIndex: 'convertRate', label: '广告媒体端指标', align: 'center', width: 80, default: 18, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活数(广告)', dataIndex: 'active', label: '广告媒体端指标', align: 'center', width: 65, default: 19, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活成本(广告)', dataIndex: 'activeCost', label: '广告媒体端指标', align: 'right', width: 65, default: 20, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活率(广告)', dataIndex: 'activeRate', label: '广告媒体端指标', align: 'center', width: 80, default: 21, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册数(广告)', dataIndex: 'register', label: '广告媒体端指标', align: 'center', width: 65, default: 22, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册成本(广告)', dataIndex: 'activeRegisterCost', label: '广告媒体端指标', align: 'right', width: 65, default: 23, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册率(广告)', dataIndex: 'activeRegisterRate', label: '广告媒体端指标', align: 'center', width: 80, default: 24, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '当日LTV(首日)', dataIndex: 'attributionMicroGame0dLtv', label: '广告媒体端指标', align: 'center', width: 75, default: 25, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活后三日LTV', dataIndex: 'attributionMicroGame3dLtv', label: '广告媒体端指标', align: 'center', width: 65, default: 26, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活后七日LTV', dataIndex: 'attributionMicroGame7dLtv', label: '广告媒体端指标', align: 'center', width: 65, default: 27, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '当日(首日)广告变现ROI', dataIndex: 'attributionMicroGame0dRoi', label: '广告媒体端指标', align: 'center', width: 80, default: 28, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活后三日广告变现ROI', dataIndex: 'attributionMicroGame3dRoi', label: '广告媒体端指标', align: 'center', width: 80, default: 29, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活后七日广告变现ROI', dataIndex: 'attributionMicroGame7dRoi', label: '广告媒体端指标', align: 'center', width: 80, default: 30, sorter: true, className: 'purple1ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                }
+            ]
+        },
+        {
+            label: '应用系统数据',
+            data: [
+                {
+                    title: '今日新增注册人数(系统)', dataIndex: 'todayRegUserSys', label: '应用系统数据', align: 'center', width: 80, default: 31, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计注册人数(系统)', dataIndex: 'totalRegUserSys', label: '应用系统数据', align: 'center', width: 80, default: 32, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: 'DAU(系统)', dataIndex: 'dau', label: '应用系统数据', align: 'center', width: 80, default: 33, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '新增占比(系统)', dataIndex: 'newPro', label: '应用系统数据', align: 'center', width: 90, default: 34, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '今日新增注册成本(系统)', dataIndex: 'newRegCost', label: '应用系统数据', align: 'right', width: 80, default: 35, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={(a || 0) / 100} precision={2} />
+                },
+                {
+                    title: '人均新增成本(系统)', dataIndex: 'avgNewRegCost', label: '应用系统数据', align: 'right', width: 80, default: 36, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={(a || 0) / 100} precision={2} />
+                },
+                {
+                    title: '人均活跃成本(系统)', dataIndex: 'avgActiveCost', label: '应用系统数据', align: 'right', width: 80, default: 37, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={(a || 0) / 100} precision={2} />
+                },
+                {
+                    title: '注册首日广告变现人数', dataIndex: 'regFirstUser', label: '应用系统数据', align: 'center', width: 80, default: 38, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册首日广告变现次数', dataIndex: 'regFirstCnt', label: '应用系统数据', align: 'center', width: 80, default: 39, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册首日广告变现金额', dataIndex: 'regFirstAmount', label: '应用系统数据', align: 'right', width: 100, default: 40, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '注册首日变现ROI', dataIndex: 'regFirstRoi', label: '应用系统数据', align: 'center', width: 80, default: 41, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册24小时广告变现人数', dataIndex: 'regTwentyFourUser', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册24小时广告变现次数', dataIndex: 'regTwentyFourCnt', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册24小时广告变现金额', dataIndex: 'regTwentyFourAmount', label: '应用系统数据', align: 'right', width: 100, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '注册24小时变现ROI', dataIndex: 'regTwentyFourRoi', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册3日广告变现人数', dataIndex: 'regThreeUser', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册3日广告变现次数', dataIndex: 'regThreeCnt', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册3日广告变现金额', dataIndex: 'regThreeAmount', label: '应用系统数据', align: 'right', width: 100, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '注册3日变现ROI', dataIndex: 'regThreeRoi', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册7日广告变现人数', dataIndex: 'regSevenUser', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册7日广告变现次数', dataIndex: 'regSevenCnt', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册7日广告变现金额', dataIndex: 'regSevenAmount', label: '应用系统数据', align: 'right', width: 100, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '注册7日变现ROI', dataIndex: 'regSevenRoi', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册累计广告变现人数(系统)', dataIndex: 'regTotalUser', label: '应用系统数据', align: 'center', width: 90, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册累计广告变现次数(系统)', dataIndex: 'regTotalCnt', label: '应用系统数据', align: 'center', width: 90, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册累计广告变现金额(系统)', dataIndex: 'regTotalAmount', label: '应用系统数据', align: 'right', width: 100, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '注册累计广告变现ROI(系统)', dataIndex: 'regTotalRoi', label: '应用系统数据', align: 'center', width: 90, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '首日新增ARPU(系统)', dataIndex: 'firstNewArpu', label: '应用系统数据', align: 'center', width: 90, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '广告总ARPU(系统)', dataIndex: 'adTotalArpu', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '首日ecpm(系统)', dataIndex: 'firstEcpm', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '总ecpm(系统)', dataIndex: 'totalEcpm', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '人均广告有效观看次数', dataIndex: 'userAvgLookCnt', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '次日留存人数(系统)', dataIndex: 'active2User', label: '应用系统数据', align: 'center', width: 70, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '次日留存率(系统)', dataIndex: 'active2Rate', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '用户广告转化率(系统)', dataIndex: 'userAdConvertRate', label: '应用系统数据', align: 'center', width: 80, sorter: true, className: 'green2ColorClass',
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+            ]
+        },
+        {
+            label: '应用媒体数据',
+            data: [
+                {
+                    title: '今日新增用户人数(应用)', dataIndex: 'newUser1', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计新增用户人数(应用)', dataIndex: 'totalNewUser1', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: 'DAU(应用活跃用户人数)', dataIndex: 'dau1', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '今日新增占比(应用)', dataIndex: 'newPro1', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '今日新增用户成本(应用)', dataIndex: 'newUserCost', label: '应用媒体数据', align: 'right', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '人均新增成本(应用)', dataIndex: 'avgNewCost', label: '应用媒体数据', align: 'right', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '人均活跃成本(应用)', dataIndex: 'avgActiveCost1', label: '应用媒体数据', align: 'right', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '分享次数', dataIndex: 'shareTime', label: '应用媒体数据', align: 'center', width: 70, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '打开次数', dataIndex: 'openTime', label: '应用媒体数据', align: 'center', width: 70, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '人均打开次数', dataIndex: 'perUserOpenTime', label: '应用媒体数据', align: 'center', width: 70, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '用户总停留时长', dataIndex: 'totalUserStayTimeStr', label: '应用媒体数据', align: 'center', width: 120, sorter: true,
+                    render: (a: number) => {
+                        return formatSecondsToTime(a ? Math.round(a) : 0)
+                    }
+                },
+                {
+                    title: '人均停留时长', dataIndex: 'perUserStayTimeStr', label: '应用媒体数据', align: 'center', width: 120, sorter: true,
+                    render: (a: number) => {
+                        return formatSecondsToTime(a ? Math.round(a) : 0)
+                    }
+                },
+                {
+                    title: '次均停留时长', dataIndex: 'avgStaytimeStr', label: '应用媒体数据', align: 'center', width: 120, sorter: true,
+                    render: (a: number) => {
+                        return formatSecondsToTime(a ? Math.round(a) : 0)
+                    }
+                },
+                {
+                    title: '新增用户次日留存人数(应用)', dataIndex: 'newUserD2', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '新增用户次日留存率(应用)', dataIndex: 'newUserD2Rate', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '活跃用户次日留存人数(应用)', dataIndex: 'actUserD2', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '活跃用户次日留存率(应用)', dataIndex: 'actUserD2Rate', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '首日激活用户人数(应用)', dataIndex: 'firstUser', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日激活用户成本(应用)', dataIndex: 'costPerAction', label: '应用媒体数据', align: 'right', width: 85, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册用户首日激活率(应用)', dataIndex: 'firstUserRate', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活首日新增广告收入(应用)', dataIndex: 'newAdIncome', label: '应用媒体数据', align: 'right', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活首日新增广告ROI(应用)', dataIndex: 'newAdRoi', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '首日激活用户变现人数(应用)', dataIndex: 'newAdUser', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日激活变现率(应用)', dataIndex: 'newAdRate', label: '应用媒体数据', align: 'center', width: 85, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '注册首日变现率(应用)', dataIndex: 'regAdFirstRate', label: '应用媒体数据', align: 'center', width: 85, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活用户首日新增ecpm', dataIndex: 'newEcpm', label: '应用媒体数据', align: 'center', width: 85, sorter: true,
+                    render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '激活用户首日新增ARPU', dataIndex: 'newPayArpu', label: '应用媒体数据', align: 'center', width: 85, sorter: true,
+                    render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                },
+                {
+                    title: '激活用户首日曝光pv(应用)', dataIndex: 'adShowPv', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活用户首日点击数pv(应用)', dataIndex: 'adClickPv', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活用户首日cpc', dataIndex: 'costPerClick', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活用户首日ctr', dataIndex: 'clickRate', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活用户次日留存人数(应用)', dataIndex: 'motivateUserD2', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '激活用户次日留存率(应用)', dataIndex: 'motivateUserD2Rate', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '激活用户首日LTV(应用)', dataIndex: 'motivateUserFirstLtv', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计广告变现收入(应用)', dataIndex: 'totalAdIncome', label: '应用媒体数据', align: 'right', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '广告变现累计利润(应用)', dataIndex: 'totalAdProfit', label: '应用媒体数据', align: 'right', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '广告变现成本利润率(应用)', dataIndex: 'totalAdProfitRate', label: '应用媒体数据', align: 'center', width: 90, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '毛利率(应用)', dataIndex: 'grossMargin', label: '应用媒体数据', align: 'center', width: 80, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '累计广告变现ROI(应用)', dataIndex: 'totalAdRoi', label: '应用媒体数据', align: 'center', width: 85, sorter: true,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '广告位总数据(账面)', dataIndex: 'adZMTotal', label: '应用媒体数据', align: 'center',
+                    children: [
+                        {
+                            title: '广告请求PV',
+                            dataIndex: 'totalRequest',
+                            key: 'totalRequest',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '曝光PV',
+                            dataIndex: 'totalShow',
+                            key: 'totalShow',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击PV',
+                            dataIndex: 'totalClick',
+                            key: 'totalClick',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击率',
+                            dataIndex: 'totalClickRate',
+                            key: 'totalClickRate',
+                            width: 80,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                        },
+                        {
+                            title: 'ecpm',
+                            dataIndex: 'totalEcpm1',
+                            key: 'totalEcpm1',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                        {
+                            title: '广告收入',
+                            dataIndex: 'totalRealCost',
+                            key: 'totalRealCost',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                    ]
+                },
+                {
+                    title: '激励式视频(账面)', dataIndex: 'jlZMTotal', label: '应用媒体数据', align: 'center',
+                    children: [
+                        {
+                            title: '广告请求PV',
+                            dataIndex: 'videoRequest',
+                            key: 'videoRequest',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '曝光PV',
+                            dataIndex: 'videoShow',
+                            key: 'videoShow',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击PV',
+                            dataIndex: 'videoClick',
+                            key: 'videoClick',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击率',
+                            dataIndex: 'videoClickRate',
+                            key: 'videoClickRate',
+                            width: 80,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                        },
+                        {
+                            title: 'ecpm',
+                            dataIndex: 'videoEcpm',
+                            key: 'videoEcpm',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                        {
+                            title: '广告收入',
+                            dataIndex: 'videoRealCost',
+                            key: 'videoRealCost',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                    ]
+                },
+                {
+                    title: 'Banner广告(账面)', dataIndex: 'bannerZMTotal', label: '应用媒体数据', align: 'center',
+                    children: [
+                        {
+                            title: '广告请求PV',
+                            dataIndex: 'bannerRequest',
+                            key: 'bannerRequest',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '曝光PV',
+                            dataIndex: 'bannerShow',
+                            key: 'bannerShow',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击PV',
+                            dataIndex: 'bannerClick',
+                            key: 'bannerClick',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击率',
+                            dataIndex: 'bannerClickRate',
+                            key: 'bannerClickRate',
+                            width: 80,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                        },
+                        {
+                            title: 'ecpm',
+                            dataIndex: 'bannerEcpm',
+                            key: 'bannerEcpm',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                        {
+                            title: '广告收入',
+                            dataIndex: 'bannerRealCost',
+                            key: 'bannerRealCost',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                    ]
+                },
+                {
+                    title: '插屏广告(账面)', dataIndex: 'cpZMTotal', label: '应用媒体数据', align: 'center',
+                    children: [
+                        {
+                            title: '广告请求PV',
+                            dataIndex: 'plaqueRequest',
+                            key: 'plaqueRequest',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '曝光PV',
+                            dataIndex: 'plaqueShow',
+                            key: 'plaqueShow',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击PV',
+                            dataIndex: 'plaqueClick',
+                            key: 'plaqueClick',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a || 0} />
+                        },
+                        {
+                            title: '点击率',
+                            dataIndex: 'plaqueClickRate',
+                            key: 'plaqueClickRate',
+                            width: 80,
+                            align: 'center',
+                            render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 0.5 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                        },
+                        {
+                            title: 'ecpm',
+                            dataIndex: 'plaqueEcpm',
+                            key: 'plaqueEcpm',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                        {
+                            title: '广告收入',
+                            dataIndex: 'plaqueRealCost',
+                            key: 'plaqueRealCost',
+                            width: 70,
+                            align: 'center',
+                            render: (a: number, b: any) => <Statistic value={a || 0} precision={2} />
+                        },
+                    ]
+                },
+            ]
+        }
+    ]
+}
+
+export default columns12

+ 30 - 0
src/services/iaaData/index.ts

@@ -355,4 +355,34 @@ export async function getByteAdEveryListApi(data: GetByteAdEveryListProps) {
         method: 'POST',
         data
     });
+}
+
+
+
+export interface GetByteAppListProps extends Paging, SortProps {
+    costDayBegin?: string      // 消耗时间
+    costDayEnd?: string
+}
+/**
+ * 头条每日数据
+ * @param data 
+ * @returns 
+ */
+export async function getByteAppListApi(data: GetByteAppListProps) {
+    return request(wapi + `/monitor/byte/app/listOfPage`, {
+        method: 'POST',
+        data
+    });
+}
+
+/**
+ * 总计
+ * @param data 
+ * @returns 
+ */
+export async function getByteAppTotalApi(data: GetByteAppListProps) {
+    return request(wapi + `/monitor/byte/app/total`, {
+        method: 'POST',
+        data
+    });
 }