fix

README.md

@@ -1,5 +1,8 @@
 ## 趣程运营后台
 
+## Bucket
+game-data-web-online
+
 ## Environment Prepare
 
 Install `node_modules`:

src/components/QueryForm/const.tsx

@@ -12,4 +12,11 @@ export const czPresets: any = {
     '昨天': [moment().subtract(1, 'd'), moment().subtract(1, 'd')],
     '7日': [moment().subtract(7, 'd'), moment()],
     '30日': [moment().subtract(30, 'd'), moment()]
-};
+};
+
+// 推广媒体
+export enum TYPE {
+    'MP' = '腾讯MP',
+    'GDT' = '腾讯GDT',
+    'BYTE' = '头条'
+}

src/components/QueryForm/index.tsx

@@ -3,6 +3,7 @@ import React, { useEffect, useState } from "react"
 import moment from "moment"
 import { useAjax } from "@/Hook/useAjax"
 import { getAllOfOwnerUserApi, getChannelChoiceListApi, getGameChoiceListApi, getGameChoiceParentListType1Api, getPayListApi, getSubUserWithSelfListApi, getTtAllUserListApi, getUserSystemTypeChoiceListApi } from "@/services/gameData"
+import { TYPE } from "./const"
 
 
 interface Props {
@@ -93,6 +94,8 @@ interface Props {
     isGameUserId?: boolean
     /** 是否开启 操作系统 选择 */
     isOs?: boolean
+    /** 是否开启 推广媒体 选择 */
+    isType?: boolean
 }
 /**
  * 游戏数据系统 请求参数
@@ -104,7 +107,7 @@ const QueryForm: React.FC<Props> = (props) => {
     const {
         onChange, initialValues, isAccount, isAccountId, isCompanyId, isCpId, isCpName, isCpOrderId, isCpStatus, isCreateDay, isDevice, isGameName, isRechargeGameName, isGameId, isOrderGameId, isGameRoleId,
         isGameRoleName, isFirstRecharge, isSwitch, isMerchantNo, isOrderId, isMerchantOrderNo, isPayStatus, isPayWay, isProductName, isRegAgent, isAgentId, isPutAgent, isRegDay, isOs, isParentId,
-        isSysUserName, isRechargeDate, isBGGameClassify, isGameUserId, isSysUserId, isUserName, isUserId, isSelectRanking, isGameType, isConsumeDay, rechargeDay, isBeginDay
+        isSysUserName, isRechargeDate, isBGGameClassify, isGameUserId, isSysUserId, isUserName, isUserId, isSelectRanking, isGameType, isConsumeDay, rechargeDay, isBeginDay, isType
     } = props
     const [form] = Form.useForm()
     const [accountList, setAccountList] = useState<any[]>([])
@@ -508,6 +511,22 @@ const QueryForm: React.FC<Props> = (props) => {
                     {getPayList?.data?.map((item: any) => <Select.Option value={item.id} key={item.id}>{item.payName}</Select.Option>)}
                 </Select>
             </Form.Item></Col>}
+
+            {/* 推广媒体 */}
+            {isType && <Col><Form.Item name='type'>
+                <Select
+                    showSearch
+                    style={{ width: 100 }}
+                    allowClear
+                    placeholder={'推广媒体'}
+                    filterOption={(input, option) =>
+                        (option?.children as any)?.toLowerCase().indexOf(input.toLowerCase()) >= 0
+                    }
+                >
+                    {Object.keys(TYPE).map(key => <Select.Option value={key} key={key}>{TYPE[key]}</Select.Option>)}
+                </Select>
+            </Form.Item></Col>}
+
             {/* 产品名称 */}
             {isProductName && <Col><Form.Item name='productName'>
                 <Input placeholder="请输入产品名称" allowClear style={{ width: 140 }} />
@@ -517,6 +536,7 @@ const QueryForm: React.FC<Props> = (props) => {
             {isRegAgent && <Col><Form.Item name='regAgent'>
                 <Input placeholder="请输入注册渠道名" allowClear style={{ width: 140 }} />
             </Form.Item></Col>}
+            
             {/* 推广渠道id */}
             {isAgentId && <Col><Form.Item name='agentId'>
                 <Select

src/pages/gameDataStatistics/allSurvey/index.tsx

@@ -102,7 +102,7 @@ const AllSurvey: React.FC = () => {
                         isGameId
                         isSysUserId
                         isAgentId
-                        isBeginDay
+                        // isBeginDay
                     />
                 </Card>
             </div>

src/pages/gameDataStatistics/allSurvey/lineC.tsx

@@ -1,10 +1,11 @@
 import useEcharts from "@/Hook/useEcharts"
-import { Card, Radio, Spin } from "antd"
+import { Card, DatePicker, Radio, Space, Spin } from "antd"
 import React, { useEffect, useRef, useState } from "react"
 import style from './index.less'
 import './index1.less'
 import { AllSurveyTotalDataProps, getAllSurveyLineDataApi } from "@/services/gameData/allSurvey"
 import { useAjax } from "@/Hook/useAjax"
+import moment from "moment"
 
 interface Props {
     height: number
@@ -22,12 +23,14 @@ const LineC: React.FC<Props> = (props) => {
     const ref = useRef(null);
     const [type, setType] = useState<string>('a')
     const [data, setData] = useState<any>({})
+    const [beginDate, setBeginDate] = useState<string>()
+    const [endDate, setEndDate] = useState<string>()
     /******************/
 
     const getAllSurveyLineData = useAjax((params) => getAllSurveyLineDataApi(params))
 
     useEffect(() => {
-        getAllSurveyLineData.run(queryForm).then(res => {
+        getAllSurveyLineData.run({ ...queryForm, beginDate, endDate }).then(res => {
             let a1Data: any = { legendName: '消耗' }
             let a2Data: any = { legendName: '充值' }
             let b1Data: any = { legendName: '买量充值' }
@@ -49,18 +52,33 @@ const LineC: React.FC<Props> = (props) => {
                 d: [d1Data]
             })
         })
-    }, [queryForm])
+    }, [queryForm, beginDate, endDate])
 
     return <div className={style.lineCont} ref={ref} style={{ height: `calc(100% - ${145.43 + height}px)` }}>
         <Spin wrapperClassName={'spin_100'} spinning={getAllSurveyLineData.loading}>
             <Card
                 style={{ width: '100%', height: '100%', borderRadius: 8 }}
-                title={<Radio.Group value={type} buttonStyle="solid" onChange={(e) => setType(e.target.value)}>
-                    <Radio.Button value="a">消耗&充值</Radio.Button>
-                    <Radio.Button value="b">买量充值&自然量充值</Radio.Button>
-                    <Radio.Button value="c">首日ROI</Radio.Button>
-                    <Radio.Button value="d">新增用户&创角人数</Radio.Button>
-                </Radio.Group>}
+                title={<Space>
+                    <Radio.Group value={type} buttonStyle="solid" onChange={(e) => setType(e.target.value)}>
+                        <Radio.Button value="a">消耗&充值</Radio.Button>
+                        <Radio.Button value="b">买量充值&自然量充值</Radio.Button>
+                        <Radio.Button value="c">首日ROI</Radio.Button>
+                        <Radio.Button value="d">新增用户&创角人数</Radio.Button>
+                    </Radio.Group>
+                    <DatePicker.RangePicker
+                        placeholder={['开始日期', '结束日期']}
+                        value={(beginDate && endDate) ? ([moment(beginDate), moment(endDate)] as any) : undefined}
+                        onChange={(e) => {
+                            if (e && e.length === 2) {
+                                setBeginDate(moment(e[0]).format('YYYY-MM-DD'))
+                                setEndDate(moment(e[1]).format('YYYY-MM-DD'))
+                            } else {
+                                setBeginDate(undefined)
+                                setEndDate(undefined)
+                            }
+                        }}
+                    />
+                </Space>}
                 bodyStyle={{ padding: '0 0 24px', height: 'calc(100% - 68px)' }}
             >
                 <LineMonitor style={{ width: '100%', height: '100%' }} series smooth data={data[type]} />

src/pages/gameDataStatistics/extensionData/total/tableConfig.tsx

@@ -107,18 +107,18 @@ function columns12(gameType: any) {
         {
             label: '付费数据',
             data: [
-                { title: '新用户充值次数', dataIndex: 'userRechargeCount', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '新用户充值人数', dataIndex: 'userRechargeUser', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '新用户充值金额', dataIndex: 'userRechargeMoney', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户充值次数', dataIndex: 'userRechargeCount', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户充值人数', dataIndex: 'userRechargeUser', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户充值金额', dataIndex: 'userRechargeMoney', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日新用户充值次数', dataIndex: 'firstUserRechargeCount', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日新用户充值人数', dataIndex: 'firstUserRechargeUser', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日新用户充值金额', dataIndex: 'firstUserRechargeMoney', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '老用户充值次数', dataIndex: 'oldUserRechargeCount', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '老用户充值人数', dataIndex: 'oldUserRechargeUser', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '老用户充值金额', dataIndex: 'oldUserRechargeMoney', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '账面充值次数', dataIndex: 'showRechargeCount', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '账面充值人数', dataIndex: 'showRechargeUser', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '账面充值金额', dataIndex: 'showRechargeMoney', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '老用户充值次数', dataIndex: 'oldUserRechargeCount', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '老用户充值人数', dataIndex: 'oldUserRechargeUser', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '老用户充值金额', dataIndex: 'oldUserRechargeMoney', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '账面充值次数', dataIndex: 'showRechargeCount', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '账面充值人数', dataIndex: 'showRechargeUser', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '账面充值金额', dataIndex: 'showRechargeMoney', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '新用户累计充值次数', dataIndex: 'newUserRechargeCount', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '新用户累计充值人数', dataIndex: 'newUserRechargeUser', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '新用户累计充值金额', dataIndex: 'newUserRechargeMoney', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
@@ -127,7 +127,7 @@ function columns12(gameType: any) {
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '回收率', dataIndex: 'recoveryRate', label: '付费数据', align: 'center', width: 70, default: 16, sorter: true,
+                    title: '回收率', dataIndex: 'recoveryRate', label: '付费数据', align: 'center', width: 70, default: 16,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -171,27 +171,27 @@ function columns12(gameType: any) {
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '新用户付费率', dataIndex: 'userRechargeRate', label: '付费数据', align: 'center', width: 70, sorter: true,
+                    title: '新用户付费率', dataIndex: 'userRechargeRate', label: '付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
                     title: '当天付费率', dataIndex: 'todayRechargeRate', label: '付费数据', align: 'center', width: 70, sorter: true,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
-                { title: '新用户付费比', dataIndex: 'newUserRechargeRatio', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户付费比', dataIndex: 'newUserRechargeRatio', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日客单价', dataIndex: 'avgFirstUserRecharge', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '新用户客单价', dataIndex: 'avgUserRecharge', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户客单价', dataIndex: 'avgUserRecharge', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '当天客单价', dataIndex: 'avgTodayRecharge', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '账面客单价', dataIndex: 'avgShowUserRecharge', label: '付费数据', align: 'center', width: 70, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '账面客单价', dataIndex: 'avgShowUserRecharge', label: '付费数据', align: 'center', width: 70, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日充值成本', dataIndex: 'firstRechargeCost', label: '付费数据', align: 'center', width: 90, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '新用户充值成本', dataIndex: 'userRechargeCost', label: '付费数据', align: 'center', width: 90, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户充值成本', dataIndex: 'userRechargeCost', label: '付费数据', align: 'center', width: 90, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '当天充值成本', dataIndex: 'todayRechargeCost', label: '付费数据', align: 'center', width: 90, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 {
-                    title: '复充率', dataIndex: 'repeatRechargeRate', label: '付费数据', align: 'center', width: 70, sorter: true,
+                    title: '复充率', dataIndex: 'repeatRechargeRate', label: '付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '新用户复充率', dataIndex: 'userRepeatRechargeRate', label: '付费数据', align: 'center', width: 70, sorter: true,
+                    title: '新用户复充率', dataIndex: 'userRepeatRechargeRate', label: '付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -200,9 +200,9 @@ function columns12(gameType: any) {
                 },
                 { title: '新增注册ARPU', dataIndex: 'newRegArpu', label: '付费数据', align: 'center', width: 80, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '首日付费ARPU', dataIndex: 'firstRechargeArpu', label: '付费数据', align: 'center', width: 80, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '新用户付费ARPU', dataIndex: 'userRechargeArpu', label: '付费数据', align: 'center', width: 80, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
+                { title: '新用户付费ARPU', dataIndex: 'userRechargeArpu', label: '付费数据', align: 'center', width: 80, render: (a: string) => <Statistic value={a || 0} /> },
                 { title: '当天付费ARPU', dataIndex: 'todayRechargeArpu', label: '付费数据', align: 'center', width: 80, sorter: true, render: (a: string) => <Statistic value={a || 0} /> },
-                { title: '账面ARPU', dataIndex: 'showRechargeArpu', label: '付费数据', align: 'center', width: 80, sorter: true, render: (a: string) => <Statistic value={a || 0} /> }
+                { title: '账面ARPU', dataIndex: 'showRechargeArpu', label: '付费数据', align: 'center', width: 80, render: (a: string) => <Statistic value={a || 0} /> }
             ]
         },
         // {

src/pages/gameDataStatistics/gameData/total/tableConfig.tsx

@@ -54,10 +54,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
         {
             label: '买量付费数据',
             data: [
-                { title: '买量新用户充值次数', dataIndex: 'buyNewUserAmountCount', label: '买量付费数据', align: 'center', width: 70, default: 6, sorter: true },
-                { title: '买量新用户充值人数', dataIndex: 'buyNewUserAmountNum', label: '买量付费数据', align: 'center', width: 70, default: 7, sorter: true },
+                { title: '买量新用户充值次数', dataIndex: 'buyNewUserAmountCount', label: '买量付费数据', align: 'center', width: 70, default: 6 },
+                { title: '买量新用户充值人数', dataIndex: 'buyNewUserAmountNum', label: '买量付费数据', align: 'center', width: 70, default: 7 },
                 {
-                    title: '买量新用户充值金额', dataIndex: 'buyNewUserAmount', label: '买量付费数据', align: 'center', width: 70, default: 8, sorter: true,
+                    title: '买量新用户充值金额', dataIndex: 'buyNewUserAmount', label: '买量付费数据', align: 'center', width: 70, default: 8,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '买量首日新用户充值次数', dataIndex: 'buyFirstNewUserAmountCount', label: '买量付费数据', align: 'center', width: 70, default: 9, sorter: true },
@@ -66,10 +66,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     title: '买量首日新用户充值金额', dataIndex: 'buyFirstNewUserAmount', label: '买量付费数据', align: 'center', width: 70, default: 11, sorter: true,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
-                { title: '买量老用户充值次数', dataIndex: 'buyOldUserCount', label: '买量付费数据', align: 'center', width: 70, default: 12, sorter: true },
-                { title: '买量老用户充值人数', dataIndex: 'buyOldUserNum', label: '买量付费数据', align: 'center', width: 70, default: 13, sorter: true },
+                { title: '买量老用户充值次数', dataIndex: 'buyOldUserCount', label: '买量付费数据', align: 'center', width: 70, default: 12 },
+                { title: '买量老用户充值人数', dataIndex: 'buyOldUserNum', label: '买量付费数据', align: 'center', width: 70, default: 13 },
                 {
-                    title: '买量老用户充值金额', dataIndex: 'buyOldUserAmount', label: '买量付费数据', align: 'center', width: 80, default: 14, sorter: true,
+                    title: '买量老用户充值金额', dataIndex: 'buyOldUserAmount', label: '买量付费数据', align: 'center', width: 80, default: 14,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '买量账面充值次数', dataIndex: 'buyAmountCount', label: '买量付费数据', align: 'center', width: 70, sorter: true },
@@ -89,7 +89,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '买量新用户付费率', dataIndex: 'buyNewUserRoi', label: '买量付费数据', align: 'center', width: 70, default: 16, sorter: true,
+                    title: '买量新用户付费率', dataIndex: 'buyNewUserRoi', label: '买量付费数据', align: 'center', width: 70, default: 16,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -97,7 +97,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '买量新用户付费比', dataIndex: 'buyNewUserRate', label: '买量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '买量新用户付费比', dataIndex: 'buyNewUserRate', label: '买量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -105,7 +105,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '买量新用户客单价', dataIndex: 'buyNewUserAvgAmount', label: '买量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '买量新用户客单价', dataIndex: 'buyNewUserAvgAmount', label: '买量付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
@@ -117,11 +117,11 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '买量复充率', dataIndex: 'buyUserAgainRate', label: '买量付费数据', align: 'center', width: 70, default: 18, sorter: true,
+                    title: '买量复充率', dataIndex: 'buyUserAgainRate', label: '买量付费数据', align: 'center', width: 70, default: 18,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '买量新用户复充率', dataIndex: 'buyNewUserAgainRate', label: '买量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '买量新用户复充率', dataIndex: 'buyNewUserAgainRate', label: '买量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -137,7 +137,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '买量新用户付费ARPU', dataIndex: 'buyNewUserAmountArpu', label: '买量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '买量新用户付费ARPU', dataIndex: 'buyNewUserAmountArpu', label: '买量付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
@@ -153,10 +153,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
         {
             label: '自然量付费数据',
             data: [
-                { title: '自然量新用户充值次数', dataIndex: 'natureNewUserAmountCount', label: '自然量付费数据', align: 'center', width: 70, default: 19, sorter: true },
-                { title: '自然量新用户充值人数', dataIndex: 'natureNewUserAmountNum', label: '自然量付费数据', align: 'center', width: 70, default: 20, sorter: true },
+                { title: '自然量新用户充值次数', dataIndex: 'natureNewUserAmountCount', label: '自然量付费数据', align: 'center', width: 70, default: 19 },
+                { title: '自然量新用户充值人数', dataIndex: 'natureNewUserAmountNum', label: '自然量付费数据', align: 'center', width: 70, default: 20 },
                 {
-                    title: '自然量新用户充值金额', dataIndex: 'natureNewUserAmount', label: '自然量付费数据', align: 'center', width: 70, default: 21, sorter: true,
+                    title: '自然量新用户充值金额', dataIndex: 'natureNewUserAmount', label: '自然量付费数据', align: 'center', width: 70, default: 21,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '自然量首日新用户充值次数', dataIndex: 'natureFirstNewUserAmountCount', label: '自然量付费数据', align: 'center', width: 70, sorter: true },
@@ -165,10 +165,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     title: '自然量首日新用户充值金额', dataIndex: 'natureFirstNewUserAmount', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
-                { title: '自然量老用户充值次数', dataIndex: 'natureOldUserCount', label: '自然量付费数据', align: 'center', width: 70, default: 22, sorter: true },
-                { title: '自然量老用户充值人数', dataIndex: 'natureOldUserNum', label: '自然量付费数据', align: 'center', width: 70, default: 23, sorter: true },
+                { title: '自然量老用户充值次数', dataIndex: 'natureOldUserCount', label: '自然量付费数据', align: 'center', width: 70, default: 22 },
+                { title: '自然量老用户充值人数', dataIndex: 'natureOldUserNum', label: '自然量付费数据', align: 'center', width: 70, default: 23 },
                 {
-                    title: '自然量老用户充值金额', dataIndex: 'natureOldUserAmount', label: '自然量付费数据', align: 'center', width: 70, default: 24, sorter: true,
+                    title: '自然量老用户充值金额', dataIndex: 'natureOldUserAmount', label: '自然量付费数据', align: 'center', width: 70, default: 24,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '自然量账面充值次数', dataIndex: 'natureAmountCount', label: '自然量付费数据', align: 'center', width: 70, sorter: true },
@@ -188,7 +188,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '自然量新用户付费率', dataIndex: 'natureNewUserRoi', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量新用户付费率', dataIndex: 'natureNewUserRoi', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -196,7 +196,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '自然量新用户付费比', dataIndex: 'natureNewUserRate', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量新用户付费比', dataIndex: 'natureNewUserRate', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -204,7 +204,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '自然量新用户客单价', dataIndex: 'natureNewUserAvgAmount', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量新用户客单价', dataIndex: 'natureNewUserAvgAmount', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
@@ -216,11 +216,11 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '自然量复充率', dataIndex: 'natureUserAgainRate', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量复充率', dataIndex: 'natureUserAgainRate', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '自然量新用户复充率', dataIndex: 'natureNewUserAgainRate', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量新用户复充率', dataIndex: 'natureNewUserAgainRate', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -236,7 +236,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '自然量新用户付费ARPU', dataIndex: 'natureNewUserAmountArpu', label: '自然量付费数据', align: 'center', width: 70, sorter: true,
+                    title: '自然量新用户付费ARPU', dataIndex: 'natureNewUserAmountArpu', label: '自然量付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
@@ -252,10 +252,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
         {
             label: '总付费数据',
             data: [
-                { title: '总新用户充值次数', dataIndex: 'newUserAmountCount', label: '总付费数据', align: 'center', width: 70, default: 25, sorter: true },
-                { title: '总新用户充值人数', dataIndex: 'newUserAmountNum', label: '总付费数据', align: 'center', width: 70, default: 26, sorter: true },
+                { title: '总新用户充值次数', dataIndex: 'newUserAmountCount', label: '总付费数据', align: 'center', width: 70, default: 25 },
+                { title: '总新用户充值人数', dataIndex: 'newUserAmountNum', label: '总付费数据', align: 'center', width: 70, default: 26 },
                 {
-                    title: '总新用户充值金额', dataIndex: 'newUserAmount', label: '总付费数据', align: 'center', width: 70, default: 27, sorter: true,
+                    title: '总新用户充值金额', dataIndex: 'newUserAmount', label: '总付费数据', align: 'center', width: 70, default: 27,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '总首日新用户充值次数', dataIndex: 'firstNewUserAmountCount', label: '总付费数据', align: 'center', width: 70, default: 28, sorter: true },
@@ -264,10 +264,10 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     title: '总首日新用户充值金额', dataIndex: 'firstNewUserAmount', label: '总付费数据', align: 'center', width: 70, default: 30, sorter: true,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
-                { title: '总老用户充值次数', dataIndex: 'oldUserCount', label: '总付费数据', align: 'center', width: 70, default: 31, sorter: true },
-                { title: '总老用户充值人数', dataIndex: 'oldUserNum', label: '总付费数据', align: 'center', width: 70, default: 32, sorter: true },
+                { title: '总老用户充值次数', dataIndex: 'oldUserCount', label: '总付费数据', align: 'center', width: 70, default: 31 },
+                { title: '总老用户充值人数', dataIndex: 'oldUserNum', label: '总付费数据', align: 'center', width: 70, default: 32 },
                 {
-                    title: '总老用户充值金额', dataIndex: 'oldUserAmount', label: '总付费数据', align: 'center', width: 80, default: 33, sorter: true,
+                    title: '总老用户充值金额', dataIndex: 'oldUserAmount', label: '总付费数据', align: 'center', width: 80, default: 33,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 { title: '总账面充值次数', dataIndex: 'amountCount', label: '总付费数据', align: 'center', width: 70, sorter: true },
@@ -287,7 +287,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '总新用户付费率', dataIndex: 'newUserRoi', label: '总付费数据', align: 'center', width: 70, sorter: true,
+                    title: '总新用户付费率', dataIndex: 'newUserRoi', label: '总付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -295,7 +295,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '总新用户付费比', dataIndex: 'newUserRate', label: '总付费数据', align: 'center', width: 70, sorter: true,
+                    title: '总新用户付费比', dataIndex: 'newUserRate', label: '总付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -303,7 +303,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '总新用户客单价', dataIndex: 'newUserAvgAmount', label: '总付费数据', align: 'center', width: 70, sorter: true,
+                    title: '总新用户客单价', dataIndex: 'newUserAvgAmount', label: '总付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
@@ -315,11 +315,11 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '总复充率', dataIndex: 'userAgainRate', label: '总付费数据', align: 'center', width: 70, default: 34, sorter: true,
+                    title: '总复充率', dataIndex: 'userAgainRate', label: '总付费数据', align: 'center', width: 70, default: 34,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
-                    title: '总新用户复充率', dataIndex: 'newUserAgainRate', label: '总付费数据', align: 'center', width: 70, sorter: true,
+                    title: '总新用户复充率', dataIndex: 'newUserAgainRate', label: '总付费数据', align: 'center', width: 70,
                     render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
                 },
                 {
@@ -335,7 +335,7 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {
-                    title: '总新用户付费ARPU', dataIndex: 'newUserAmountArpu', label: '总付费数据', align: 'center', width: 70, sorter: true,
+                    title: '总新用户付费ARPU', dataIndex: 'newUserAmountArpu', label: '总付费数据', align: 'center', width: 70,
                     render: (a: string) => <Statistic value={a || 0} />
                 },
                 {

src/pages/gameDataStatistics/order/index.tsx

@@ -24,19 +24,26 @@ const Order: React.FC = () => {
         <TableData
             leftChild={<QueryForm
                 onChange={(data: any) => {
-                    const { pitcherId, regStartDay, regEndDay, ...params } = data
+                    const { pitcherId, regStartDay, regEndDay, beginOrderTime, endOrderTime, ...params } = data
                     console.log(params, pitcherId)
                     let newQueryForm = JSON.parse(JSON.stringify(queryForm))
                     newQueryForm.pageNum = 1
                     newQueryForm.zxPitcherId = pitcherId
                     if (regStartDay && regEndDay) {
-                        newQueryForm.beginRegTime = regStartDay
-                        newQueryForm.endRegTime = regEndDay
+                        newQueryForm.beginRegTime = regStartDay + ' 00:00:00'
+                        newQueryForm.endRegTime = regEndDay + ' 00:00:00'
                     } else {
                         delete newQueryForm.beginRegTime
                         delete newQueryForm.endRegTime
                     }
-                    
+                    if (beginOrderTime && endOrderTime) {
+                        newQueryForm.beginOrderTime = beginOrderTime + ' 00:00:00'
+                        newQueryForm.endOrderTime = endOrderTime + ' 00:00:00'
+                    } else {
+                        delete newQueryForm.beginOrderTime
+                        delete newQueryForm.endOrderTime
+                    }
+
                     setQueryForm({ ...newQueryForm, ...params })
                 }}
                 isAccountId
@@ -84,29 +91,29 @@ const Order: React.FC = () => {
             }}
             config={columns12()}
             configName={'订单明细'}
-            // summary={() => {
-            //     let defSelectData = localStorage.getItem(`myAdMonitorConfig1.0.0_订单明细`)
-            //     let newDefSelectData: any[] = []
-            //     if (defSelectData) {
-            //         newDefSelectData = JSON.parse(defSelectData)
-            //     } else {
-            //         newDefSelectData = columns12()[0]?.data
-            //     }
-            //     return <Table.Summary fixed={'top'}>
-            //         <Table.Summary.Row>
-            //             {newDefSelectData?.map((item: { dataIndex: string }, index: number) => {
-            //                 if (item.dataIndex === 'amount') {
-            //                     return <Table.Summary.Cell index={index} align='center' key={index}><Statistic valueStyle={{ color: 'red', fontWeight: 600 }} value={getOrderList?.data?.totalData?.totalAmount || 0} precision={2}/></Table.Summary.Cell>
-            //                 } else if (item.dataIndex === 'realAmount') {
-            //                     return <Table.Summary.Cell index={index} align='center' key={index}><Statistic valueStyle={{ color: 'red', fontWeight: 600 }} value={getOrderList?.data?.totalData?.totalRealAmount || 0} precision={2}/></Table.Summary.Cell>
-            //                 } else if (index === 0) {
-            //                     return <Table.Summary.Cell index={index} align='center' key={index}><span style={{ fontSize: 16, fontWeight: 'bold' }}>汇总</span></Table.Summary.Cell>
-            //                 }
-            //                 return <Table.Summary.Cell index={index} align='center' key={index}><span>--</span></Table.Summary.Cell>
-            //             })}
-            //         </Table.Summary.Row>
-            //     </Table.Summary>
-            // }}
+        // summary={() => {
+        //     let defSelectData = localStorage.getItem(`myAdMonitorConfig1.0.0_订单明细`)
+        //     let newDefSelectData: any[] = []
+        //     if (defSelectData) {
+        //         newDefSelectData = JSON.parse(defSelectData)
+        //     } else {
+        //         newDefSelectData = columns12()[0]?.data
+        //     }
+        //     return <Table.Summary fixed={'top'}>
+        //         <Table.Summary.Row>
+        //             {newDefSelectData?.map((item: { dataIndex: string }, index: number) => {
+        //                 if (item.dataIndex === 'amount') {
+        //                     return <Table.Summary.Cell index={index} align='center' key={index}><Statistic valueStyle={{ color: 'red', fontWeight: 600 }} value={getOrderList?.data?.totalData?.totalAmount || 0} precision={2}/></Table.Summary.Cell>
+        //                 } else if (item.dataIndex === 'realAmount') {
+        //                     return <Table.Summary.Cell index={index} align='center' key={index}><Statistic valueStyle={{ color: 'red', fontWeight: 600 }} value={getOrderList?.data?.totalData?.totalRealAmount || 0} precision={2}/></Table.Summary.Cell>
+        //                 } else if (index === 0) {
+        //                     return <Table.Summary.Cell index={index} align='center' key={index}><span style={{ fontSize: 16, fontWeight: 'bold' }}>汇总</span></Table.Summary.Cell>
+        //                 }
+        //                 return <Table.Summary.Cell index={index} align='center' key={index}><span>--</span></Table.Summary.Cell>
+        //             })}
+        //         </Table.Summary.Row>
+        //     </Table.Summary>
+        // }}
         />
     </div>
 }

src/pages/gameDataStatistics/rankingList/account/index.tsx

@@ -1,33 +1,71 @@
-import { DatePicker, Radio, Space } from "antd"
-import React from "react"
+import React, { useEffect, useState } from "react"
 import TableData from "../../components/TableData"
 import columns12 from "./tableConfig"
-
+import { useAjax } from "@/Hook/useAjax"
+import { AccountProps, getAccountRechargeRankingListApi } from "@/services/gameData/rankingList"
+import QueryForm from "@/components/QueryForm"
+import moment from "moment"
+import { rangePresets } from "@/components/QueryForm/const"
 
 
 const Account: React.FC = () => {
 
+    /********************************/
+    const [queryForm, setQueryForm] = useState<AccountProps>({ pageNum: 1, pageSize: 20 })
+
+    const getAccountRechargeRankingList = useAjax((params) => getAccountRechargeRankingListApi(params))
+    /********************************/
+
+    useEffect(() => {
+        getAccountRechargeRankingList.run(queryForm)
+    }, [queryForm])
 
     return <div>
 
         <TableData
-            leftChild={<Space>
-                <Radio.Group defaultValue="a" buttonStyle="solid">
-                    <Radio.Button value="a">总排行</Radio.Button>
-                    <Radio.Button value="b">今日排行</Radio.Button>
-                    <Radio.Button value="c">昨日排行</Radio.Button>
-                    <Radio.Button value="d">7日排行</Radio.Button>
-                    <Radio.Button value="f">30日排行</Radio.Button>
-                </Radio.Group>
-                <DatePicker.RangePicker />
-            </Space>}
+            leftChild={<QueryForm
+                onChange={(data: any) => {
+                    console.log(data)
+                    const { rechargeDay, ...params } = data
+                    let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                    newQueryForm.pageNum = 1
+                    if (rechargeDay && rechargeDay?.length === 2) {
+                        newQueryForm.beginDay = moment(rechargeDay[0]).format('YYYY-MM-DD')
+                        newQueryForm.endDay = moment(rechargeDay[1]).format('YYYY-MM-DD')
+                    } else {
+                        delete newQueryForm.beginDay
+                        delete newQueryForm.endDay
+                    }
+                    setQueryForm({ ...newQueryForm, ...params })
+                }}
+                rechargeDay={{ ranges: rangePresets }}
+                isSysUserId
+                isType
+                isAccountId
+                isGameId
+            />}
             scroll={{ x: 1000, y: 600 }}
-            ajax={null}
-            fixed={{ left: 1, right: 0 }}
-            dataSource={[]}
+            ajax={getAccountRechargeRankingList}
+            fixed={{ left: 3, right: 3 }}
+            dataSource={getAccountRechargeRankingList?.data?.records?.map((item: any, index: number) => ({ ...item, id: Number(queryForm.pageNum.toString() + index.toString()) }))}
+            total={getAccountRechargeRankingList?.data?.total}
+            page={queryForm.pageNum}
+            pageSize={queryForm.pageSize}
             title='推广账号消耗排行榜'
             onChange={(props: any) => {
-                console.log('props--->', props)
+                let { pagination, sortData } = props
+                let { current, pageSize } = pagination
+                let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                if (sortData && sortData?.order) {
+                    newQueryForm['sortType'] = sortData?.order === 'ascend' ? 'asc' : 'desc'
+                    newQueryForm['sortFiled'] = sortData?.field
+                } else {
+                    delete newQueryForm['sortType']
+                    delete newQueryForm['sortFiled']
+                }
+                newQueryForm.pageNum = current
+                newQueryForm.pageSize = pageSize
+                setQueryForm({ ...newQueryForm })
             }}
             config={columns12()}
             configName={'推广账号消耗排行榜'}

src/pages/gameDataStatistics/rankingList/account/tableConfig.tsx

@@ -1,39 +1,114 @@
+import WidthEllipsis from "@/components/widthEllipsis"
+import { Statistic } from "antd"
+import React from "react"
+
 function columns12() {
 
     let newArr: { label: string, data: any[] }[] = [
         {
             label: '推广账号消耗排行榜',
             data: [
-                { title: 'ID', dataIndex: '0', label: '推广账号消耗排行榜', align: 'center', width: 95, default: 1 },
-                { title: '推广账号', dataIndex: '1', label: '推广账号消耗排行榜', align: 'center', width: 95, default: 2 },
-                { title: '推广账号ID', dataIndex: '2', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 3 },
-                { title: '推广账号类型', dataIndex: '3', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 4 },
-                { title: '推广媒体', dataIndex: '4', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 5 },
-                { title: '投手', dataIndex: '5', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 6 },
-                { title: '项目组', dataIndex: '6', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 7 },
-                { title: '期数', dataIndex: '7', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 8 },
-                { title: '推广游戏名称', dataIndex: '8', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 9 },
-                { title: '推广游戏类型', dataIndex: '9', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 10 },
-                { title: '推广游戏CP名称', dataIndex: '10', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 11 },
-                { title: '消耗', dataIndex: '11', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 12 },
-                { title: '推广计划数量', dataIndex: '12', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 13 },
-                { title: '曝光量', dataIndex: '13', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 14 },
-                { title: '点击量', dataIndex: '14', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 15 },
-                { title: '点击率', dataIndex: '15', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 16 },
-                { title: '千次曝光成本', dataIndex: '16', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 17 },
-                { title: '注册人数', dataIndex: '17', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 18 },
-                { title: '注册成本', dataIndex: '18', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 19 },
-                { title: '首日创角人数', dataIndex: '19', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 20 },
-                { title: '累计创角人数', dataIndex: '20', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 21 },
-                { title: '首日充值金额', dataIndex: '21', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 22 },
-                { title: '首日充值人数', dataIndex: '22', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 23 },
-                { title: '首日充值次数', dataIndex: '23', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 24 },
-                { title: '累计充值金额', dataIndex: '24', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 25 },
-                { title: '累计充值人数', dataIndex: '25', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 26 },
-                { title: '累计充值次数', dataIndex: '26', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 27 },
-                { title: '首日ROI', dataIndex: '27', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 28 },
-                { title: '平均客单价', dataIndex: '28', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 29 },
-                { title: '回本率', dataIndex: '29', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 30 },
+                { title: 'ID', dataIndex: 'id', label: '推广账号消耗排行榜', align: 'center', width: 60, default: 1 },
+                {
+                    title: '推广账号', dataIndex: 'accountId', label: '推广账号消耗排行榜', align: 'center', width: 95, default: 2,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广媒体', dataIndex: 'type', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 3,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '投手', dataIndex: 'pitcher', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 4,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广游戏名称', dataIndex: 'gameName', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 5,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广游戏类型', dataIndex: 'gameClassify', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 6,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广游戏CP名称', dataIndex: 'gameCp', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 7,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '消耗', dataIndex: 'cost', label: '推广账号消耗排行榜', align: 'center', width: 90, default: 8, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '推广广告数量', dataIndex: 'adCount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 9, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '曝光量', dataIndex: 'viewCount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 10, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '点击量', dataIndex: 'clickCount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 11, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '点击率', dataIndex: 'clickRate', label: '推广账号消耗排行榜', align: 'center', width: 80, default: 12, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} precision={5} valueStyle={a >= 1 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '千次曝光成本', dataIndex: 'thousandDisplayPrice', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 13, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} precision={2}/>
+                },
+                {
+                    title: '注册人数', dataIndex: 'regUserCnt', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 14, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '注册成本', dataIndex: 'regCost', label: '推广账号消耗排行榜', align: 'center', width: 100, default: 15, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} precision={2}/>
+                },
+                {
+                    title: '首日创角人数', dataIndex: 'firstRole', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 16, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计创角人数', dataIndex: 'totalRole', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 17, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日充值金额', dataIndex: 'firstAmount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 18, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日充值人数', dataIndex: 'firstAmountUser', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 19, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日充值次数', dataIndex: 'firstAmountCount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 20, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计充值金额', dataIndex: 'totalAmount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 21, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计充值人数', dataIndex: 'totalAmountUser', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 22, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计充值次数', dataIndex: 'totalAmountCount', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 23, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '首日ROI', dataIndex: 'firstRoi', label: '推广账号消耗排行榜', align: 'center', width: 90, default: 24, sorter: true,
+                    render: (a: number) => <Statistic value={a} precision={2} valueStyle={a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '平均客单价', dataIndex: 'avgAmount', label: '推广账号消耗排行榜', align: 'center', width: 100, default: 25, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '回本率', dataIndex: 'roi', label: '推广账号消耗排行榜', align: 'center', width: 70, default: 26, sorter: true,
+                    render: (a: number) => <Statistic value={a} precision={2} valueStyle={a >= 100 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
             ]
         },
     ]

src/pages/gameDataStatistics/rankingList/channel/index.tsx

@@ -1,32 +1,71 @@
 import { Radio, Space } from "antd"
-import React from "react"
+import React, { useEffect, useState } from "react"
 import TableData from "../../components/TableData"
 import columns12 from "./tableConfig"
-
+import moment from "moment"
+import { useAjax } from "@/Hook/useAjax"
+import { ChannelProps, getAgentRechargeRankingListApi } from "@/services/gameData/rankingList"
+import QueryForm from "@/components/QueryForm"
+import { rangePresets } from "@/components/QueryForm/const"
 
 
 const Channel: React.FC = () => {
 
+    /********************************/
+    const [queryForm, setQueryForm] = useState<ChannelProps>({ pageNum: 1, pageSize: 20 })
+
+    const getAgentRechargeRankingList = useAjax((params) => getAgentRechargeRankingListApi(params))
+    /********************************/
+
+    useEffect(() => {
+        getAgentRechargeRankingList.run(queryForm)
+    }, [queryForm])
 
     return <div>
 
         <TableData
-            leftChild={<Space>
-                <Radio.Group defaultValue="a" buttonStyle="solid">
-                    <Radio.Button value="a">总排行</Radio.Button>
-                    <Radio.Button value="b">今日排行</Radio.Button>
-                    <Radio.Button value="c">昨日排行</Radio.Button>
-                    <Radio.Button value="d">7日排行</Radio.Button>
-                    <Radio.Button value="f">30日排行</Radio.Button>
-                </Radio.Group>
-            </Space>}
+            leftChild={<QueryForm
+                onChange={(data: any) => {
+                    console.log(data)
+                    const { rechargeDay, ...params } = data
+                    let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                    newQueryForm.pageNum = 1
+                    if (rechargeDay && rechargeDay?.length === 2) {
+                        newQueryForm.beginDay = moment(rechargeDay[0]).format('YYYY-MM-DD')
+                        newQueryForm.endDay = moment(rechargeDay[1]).format('YYYY-MM-DD')
+                    } else {
+                        delete newQueryForm.beginDay
+                        delete newQueryForm.endDay
+                    }
+                    setQueryForm({ ...newQueryForm, ...params })
+                }}
+                rechargeDay={{ ranges: rangePresets }}
+                isSysUserId
+                isAgentId
+                isType
+            />}
             scroll={{ x: 1000, y: 600 }}
-            ajax={null}
+            ajax={getAgentRechargeRankingList}
             fixed={{ left: 1, right: 0 }}
-            dataSource={[]}
+            dataSource={getAgentRechargeRankingList?.data?.records?.map((item: any) => ({ ...item, id: item.index + 1 }))}
+            total={getAgentRechargeRankingList?.data?.total}
+            page={queryForm.pageNum}
+            pageSize={queryForm.pageSize}
             title='推广渠道充值排行榜'
             onChange={(props: any) => {
-                console.log('props--->', props)
+                let { pagination, sortData } = props
+                let { current, pageSize } = pagination
+                let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                if (sortData && sortData?.order) {
+                    newQueryForm['sortType'] = sortData?.order === 'ascend' ? 'asc' : 'desc'
+                    newQueryForm['sortFiled'] = sortData?.field
+                } else {
+                    delete newQueryForm['sortType']
+                    delete newQueryForm['sortFiled']
+                }
+                newQueryForm.pageNum = current
+                newQueryForm.pageSize = pageSize
+                setQueryForm({ ...newQueryForm })
             }}
             config={columns12()}
             configName={'推广渠道充值排行榜'}

src/pages/gameDataStatistics/rankingList/channel/tableConfig.tsx

@@ -1,23 +1,58 @@
+import WidthEllipsis from "@/components/widthEllipsis"
+import { Statistic } from "antd"
+import React from "react"
+
 function columns12() {
 
     let newArr: { label: string, data: any[] }[] = [
         {
             label: '推广渠道充值排行榜',
             data: [
-                { title: 'ID', dataIndex: '0', label: '推广渠道充值排行榜', align: 'center', width: 95, default: 1 },
-                { title: '推广渠道账号', dataIndex: '1', label: '推广渠道充值排行榜', align: 'center', width: 95, default: 2 },
-                { title: '推广渠道名称', dataIndex: '2', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 3 },
-                { title: '投手', dataIndex: '3', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 4 },
-                { title: '项目组', dataIndex: '4', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 5 },
-                { title: '推广媒体', dataIndex: '5', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 6 },
-                { title: '当天充值金额', dataIndex: '6', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 7 },
-                { title: '累计充值金额', dataIndex: '7', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 8 },
-                { title: '累计充值人数', dataIndex: '8', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 9 },
-                { title: '累计充值次数', dataIndex: '9', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 10 },
-                { title: '平均客单价', dataIndex: '10', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 11 },
-                { title: '注册人数', dataIndex: '11', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 12 },
-                { title: '累计消耗', dataIndex: '12', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 13 },
-                { title: '回本率', dataIndex: '13', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 14 }
+                { title: 'ID', dataIndex: 'id', label: '推广渠道充值排行榜', align: 'center', width: 60, default: 1 },
+                {
+                    title: '推广渠道账号', dataIndex: 'agentId', label: '推广渠道充值排行榜', align: 'center', width: 80, default: 2,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广渠道名称', dataIndex: 'agentName', label: '推广渠道充值排行榜', align: 'center', width: 150, default: 3,
+                    render: (a: string, b: any) => (<WidthEllipsis isCopy value={a} />)
+                },
+                {
+                    title: '投手', dataIndex: 'pitcher', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 4,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '推广媒体', dataIndex: 'type', label: '推广渠道充值排行榜', align: 'center', width: 70, default: 5,
+                    render: (a: string, b: any) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '当天充值金额', dataIndex: 'todayAmount', label: '推广渠道充值排行榜', align: 'center', width: 100, default: 6, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '新用户累计充值金额', dataIndex: 'newUserTotalRechargeAmount', label: '推广渠道充值排行榜', align: 'center', width: 100, default: 7, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '新用户累计充值人数', dataIndex: 'newUserTotalRechargeNum', label: '推广渠道充值排行榜', align: 'center', width: 80, default: 8, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '新用户累计充值次数', dataIndex: 'newUserTotalRechargeCount', label: '推广渠道充值排行榜', align: 'center', width: 80, default: 9, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '平均客单价', dataIndex: 'avgAmount', label: '推广渠道充值排行榜', align: 'center', width: 100, default: 10, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '累计消耗', dataIndex: 'totalCost', label: '推广渠道充值排行榜', align: 'center', width: 100, default: 11, sorter: true,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '回本率', dataIndex: 'roi', label: '推广渠道充值排行榜', align: 'center', width: 100, default: 12, sorter: true,
+                    render: (a: number) => <Statistic value={a || 0} precision={2} valueStyle={a >= 100 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                }
             ]
         },
     ]

src/services/gameData/rankingList.ts

@@ -56,4 +56,43 @@ export async function getRechargeUserListApi(data: UserRechargeListType) {
         method: 'POST',
         data
     });
+}
+
+export interface ChannelProps extends Paging, SortProps {
+    agentId?: number,
+    beginDay?: string,
+    endDay?: string,
+    pitcherId?: number
+    type?: string
+}
+/**
+ * 推广渠道充值排行帮
+ * @param data 
+ * @returns 
+ */
+export async function getAgentRechargeRankingListApi(data: ChannelProps) {
+    return request(wapi + `/ranking/agent`, {
+        method: 'POST',
+        data
+    });
+}
+
+export interface AccountProps extends Paging, SortProps {
+    accountId?: number
+    beginDay?: string,
+    endDay?: string,
+    gameId?: number,
+    pitcherId?: number,
+    type?: string
+}
+/**
+ * 推广账号充值排行榜
+ * @param data 
+ * @returns 
+ */
+export async function getAccountRechargeRankingListApi(data: AccountProps) {
+    return request(wapi + `/ranking/account`, {
+        method: 'POST',
+        data
+    });
 }