fix

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

@@ -1,9 +1,10 @@
 import React from "react"
 import style from './index.less'
-import { Statistic } from "antd"
+import { Space, Statistic } from "antd"
 import { gameClassifyEnum } from "@/components/QueryForm/const"
 import { version } from "../../components/TableData"
 import moment from "moment"
+import UserInfo from "./userInfo"
 
 function columnsNature12(rechargeTrendHandle: (data: any) => void): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
 
@@ -365,9 +366,13 @@ function columnsNature12(rechargeTrendHandle: (data: any) => void): { label: str
                     width: 75,
                     render: (a: number, b: any) => {
                         if (b?.costDate === '总计') {
-                            return '--'
+                            return <UserInfo data={b.userDetails} sourceSystem={b.sourceSystem} />
                         }
-                        return b?.gameId ? <a onClick={() => rechargeTrendHandle(b)}>复充趋势</a> : '--'
+                        
+                        return <Space wrap size={2}>
+                            {b?.gameId ? <a style={{ fontSize: 12 }} onClick={() => rechargeTrendHandle(b)}>复充趋势</a> : '--'}
+                            <UserInfo data={b.userDetails} sourceSystem={b.sourceSystem} />
+                        </Space>
                     },
                 }
             ]

src/pages/gameDataStatistics/gameData/everyday/userInfo.tsx

@@ -0,0 +1,166 @@
+import { useAjax } from "@/Hook/useAjax"
+import WidthEllipsis from "@/components/widthEllipsis"
+import { getDetailsApi } from "@/services/gameData/game"
+import { Popover, Statistic, Table, Tag } from "antd"
+import { ColumnsType } from "antd/lib/table"
+import React, { useEffect, useState } from "react"
+import './index.less'
+
+
+interface Props {
+    sourceSystem?: string
+    data: any
+}
+
+/**
+ * 用户详情
+ * @param param0 
+ * @returns 
+ */
+const UserInfo: React.FC<Props> = ({ data, sourceSystem }) => {
+
+    /******************************/
+    const [queryForm, setQueryForm] = useState<{ pageNum: number, pageSize: number, sortType?: string, sortFiled?: string }>({ pageNum: 1, pageSize: 20 })
+    const [visible, setVisible] = useState<boolean>(false)
+    const getDetails = useAjax((params) => getDetailsApi(params))
+    /******************************/
+
+    useEffect(() => {
+        if (visible) {
+            getDetails.run({ againTrendVO: { ...data }, ...queryForm, sourceSystem })
+        }
+    }, [queryForm, visible, sourceSystem])
+
+    const visibleChange = (visible: boolean) => {
+        setVisible(visible)
+    }
+
+    return <>
+
+        <Popover
+            overlayInnerStyle={{ width: 700, padding: 0, backgroundColor: '#f1e0e0' }}
+            overlayClassName="userPopover"
+            content={<Table
+                size="small"
+                className="all_table content_table_body"
+                loading={getDetails.loading}
+                scroll={{ y: 280 }}
+                dataSource={getDetails?.data?.records?.map((item: any, index: number) => ({ ...item, id: Number(queryForm.pageNum.toString() + index.toString()) }))}
+                columns={columns}
+                rowKey={'id'}
+                pagination={{
+                    current: queryForm.pageNum,//当前页数,需state控制配合翻页
+                    pageSize: queryForm.pageSize,
+                    total: getDetails?.data?.total || 0,
+                    defaultCurrent: 1,//默认初始的当前页数
+                    defaultPageSize: 20,//默认初始的每页条数
+                    pageSizeOptions: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100'],
+                    showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
+                    hideOnSinglePage: false,//只有一页数据隐藏分页
+                    showLessItems: true,
+                }}
+                onChange={(props: any, _filters, sorter: any) => {
+                    let { current, pageSize } = props
+                    let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                    newQueryForm.pageNum = current
+                    newQueryForm.pageSize = pageSize
+                    if (sorter && sorter?.order) {
+                        newQueryForm['sortType'] = sorter?.order === 'ascend' ? 'asc' : 'desc'
+                        newQueryForm['sortFiled'] = sorter?.field
+                    } else {
+                        delete newQueryForm['sortType']
+                        delete newQueryForm['sortFiled']
+                    }
+                    setQueryForm({ ...newQueryForm })
+                }}
+            />}
+            trigger="click"
+            title={<strong>用户详情</strong>}
+            placement="left"
+            destroyTooltipOnHide={true}
+            onVisibleChange={visibleChange}
+        >
+            <span style={{ fontSize: 12 }}><a>D1用户详情</a></span>
+        </Popover>
+    </>
+}
+
+export default React.memo(UserInfo)
+
+
+const columns: ColumnsType<any> = [
+    {
+        title: '累充排名',
+        dataIndex: 'num',
+        key: 'num',
+        width: 60,
+        fixed: 'left',
+        align: 'center'
+    },
+    {
+        title: '累计充值次数',
+        dataIndex: 'totalAmountCount',
+        key: 'totalAmountCount',
+        width: 60,
+        fixed: 'left',
+        align: 'center'
+    },
+    {
+        title: '玩家ID',
+        dataIndex: 'playerId',
+        key: 'playerId',
+        width: 80,
+        fixed: 'left',
+        align: 'center'
+    },
+    {
+        title: '角色名称',
+        dataIndex: 'roleName',
+        key: 'roleName',
+        width: 90,
+        align: 'center',
+        render: (a: string) => (<WidthEllipsis value={a} />)
+    },
+    {
+        title: '游戏服',
+        dataIndex: 'serverName',
+        key: 'serverName',
+        width: 90,
+        align: 'center',
+        render: (a: string) => (<WidthEllipsis value={a} />)
+    },
+    {
+        title: '玩家操作系统',
+        dataIndex: 'playerOs',
+        key: 'playerOs',
+        width: 70,
+        align: 'center',
+        render: (a: string) => (<WidthEllipsis value={a} />)
+    },
+    {
+        title: '注册渠道名称',
+        dataIndex: 'regAgentName',
+        key: 'regAgentName',
+        width: 120,
+        align: 'center',
+        render: (a: string) => (<WidthEllipsis value={a} />)
+    },
+    {
+        title: '注册渠道ID',
+        dataIndex: 'regAgentId',
+        key: 'regAgentId',
+        width: 90,
+        align: 'center',
+        render: (a: string) => (<WidthEllipsis value={a} />)
+    },
+    {
+        title: '充值金额',
+        dataIndex: 'todayTotalAmount',
+        key: 'todayTotalAmount',
+        width: 70,
+        align: 'center',
+        fixed: 'right',
+        sorter: true,
+        render: (a: string) => <Statistic value={a || 0} />
+    },
+];