fix

config/routerConfig.ts

@@ -455,6 +455,12 @@ const gsData = {
             name: '游戏角色管理',
             access: 'roleManage',
             component: './gsData/roleManage',
+        },
+        {
+            path: '/gsData/serverManage',
+            name: '游戏区服管理',
+            access: 'serverManage',
+            component: './gsData/serverManage',
         }
     ]
 }

src/pages/gsData/serverManage/index.tsx

@@ -0,0 +1,97 @@
+import { useAjax } from "@/Hook/useAjax"
+import React, { useEffect, useState } from "react"
+import columns12 from "./tableConfig"
+import TablePro from "@/pages/gameDataStatistics/components/TablePro"
+import QueryFormGS from "@/components/QueryForm/indexGs"
+import moment from "moment"
+import { getServerManageListApi, GetServerManageProps } from "@/services/gsData"
+
+/**
+ * 游戏区服管理
+ * @returns 
+ */
+const ServerManage: React.FC = () => {
+
+    /***************************************/
+    const [queryForm, setQueryForm] = useState<GetServerManageProps>({
+        pageNum: 1,
+        pageSize: 30,
+        sourceSystem: 'ZX_ONE'
+    })
+
+    const getServerManageList = useAjax((params) => getServerManageListApi(params))
+    /***************************************/
+
+    useEffect(() => {
+        getServerManageList.run(queryForm)
+    }, [queryForm])
+
+    return <div>
+        <TablePro
+            leftChild={<QueryFormGS
+                initialValues={{ sourceSystem: 'ZX_ONE' }}
+                isSource
+                isGsId
+                isServeDay={{}}
+                rechargeDay={{ placeholder: ['开服日期开始', '开服日期结束'] }}
+                isSuperParentGameId
+                isParentId
+                isServerIds
+                isServeStatus
+                isGsStatus
+                onChange={(data: any) => {
+                    console.log(data)
+                    const { rechargeDay, gsId, parentId, superParentGameId, serverIds, serveDay, ...params } = data
+                    let newQueryForm = JSON.parse(JSON.stringify(queryForm))
+                    newQueryForm.pageNum = 1
+                    newQueryForm.gsIdList = gsId
+                    newQueryForm.parentGameId = parentId
+                    newQueryForm.superGameId = superParentGameId
+                    newQueryForm.serverIdList = serverIds
+                    if (serveDay && serveDay?.length === 2) {
+                        newQueryForm['serveDayBegin'] = moment(serveDay[0]).format('YYYY-MM-DD')
+                        newQueryForm['serveDayEnd'] = moment(serveDay[1]).format('YYYY-MM-DD')
+                    } else {
+                        delete newQueryForm['serveDayBegin']
+                        delete newQueryForm['serveDayEnd']
+                    }
+                    if (rechargeDay && rechargeDay?.length === 2) {
+                        newQueryForm['serverStartBegin'] = moment(rechargeDay[0]).format('YYYY-MM-DD')
+                        newQueryForm['serverStartEnd'] = moment(rechargeDay[1]).format('YYYY-MM-DD')
+                    } else {
+                        delete newQueryForm['serverStartBegin']
+                        delete newQueryForm['serverStartEnd']
+                    }
+                    setQueryForm({ ...newQueryForm, ...params })
+                }}
+            />}
+            config={columns12()}
+            configName={'游戏区服管理'}
+            fixed={{ left: 4, right: 0 }}
+            scroll={{ x: 1000, y: 620 }}
+            title='游戏区服管理'
+            loading={getServerManageList.loading}
+            ajax={getServerManageList}
+            page={getServerManageList?.data?.current || 1}
+            pageSize={getServerManageList?.data?.size || 20}
+            total={getServerManageList?.data?.total || 0}
+            dataSource={getServerManageList?.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 ServerManage

src/pages/gsData/serverManage/tableConfig.tsx

@@ -0,0 +1,397 @@
+import WidthEllipsis from "@/components/widthEllipsis"
+import { Statistic, Tag } from "antd"
+import React from "react"
+import '../../gameDataStatistics/gameData/flowingWater/index.less'
+
+// 充值排行填充
+let aFill = { amountNum: '--', amountRoleId: '--', amountRoleName: '--', amountRoleLevel: '--', amountCountry: '--', amountTotalRoleCombatNum: '--', amountRoleTotalAmount: '--' }
+function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
+
+
+    return [
+        {
+            label: '基本信息',
+            data: [
+                {
+                    title: '父游戏名称', dataIndex: 'parentGameName', label: '基本信息', align: 'center', width: 85, default: 1,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: 'GS名称', dataIndex: 'gsName', label: '基本信息', align: 'center', width: 75, default: 2,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: 'GS运营状态', dataIndex: 'gsStatus', label: '基本信息', align: 'center', width: 60, default: 3,
+                    render: (a: 1 | 2, b: any) => {
+                        return a === 1 ? <Tag color="#f50" style={{ marginRight: 0 }}>独立运营</Tag> : a === 2 ? <Tag color="#2db7f5" style={{ marginRight: 0 }}>联合运营</Tag> : <Tag style={{ marginRight: 0 }}>无GS</Tag>
+                    }
+                },
+                {
+                    title: '服务区服名称', dataIndex: 'serverName', label: '基本信息', align: 'center', width: 80, default: 4,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '是否原始区服', dataIndex: 'originServer', label: '基本信息', align: 'center', width: 60, default: 5,
+                    render: (a: boolean, b: any) => {
+                        return a ? <Tag color="success" style={{ marginRight: 0 }}>是</Tag> : <Tag color="error" style={{ marginRight: 0 }}>否</Tag>
+                    }
+                },
+                {
+                    title: '开服时间', dataIndex: 'startTime', label: '基本信息', align: 'center', width: 90, default: 6,
+                    render: (a: string) => (<WidthEllipsis value={`${a || '--'}`} />)
+                },
+                {
+                    title: '开服天数', dataIndex: 'startDiff', label: '基本信息', align: 'center', width: 45, default: 7,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '服务时间', dataIndex: 'gsStartTime', label: '基本信息', align: 'center', width: 160, default: 8,
+                    render: (a: string, b: any) => (<WidthEllipsis value={`${b?.startTime}-${b?.endTime}`} />)
+                },
+                {
+                    title: '服务天数', dataIndex: 'serveDiff', label: '基本信息', align: 'center', width: 45, default: 9,
+                    render: (a: string) => (<WidthEllipsis value={a} />)
+                },
+                {
+                    title: '服务状态', dataIndex: 'serveStatus', label: '基本信息', align: 'center', width: 75, default: 10,
+                    render: (a: boolean) => {
+                        return a ? <Tag color="success" style={{ marginRight: 0 }}>服务完成</Tag> : <Tag color="processing" style={{ marginRight: 0 }}>服务中</Tag>
+                    }
+                }
+            ]
+        },
+        {
+            label: '区服数据信息',
+            data: [
+                {
+                    title: '创角人数', dataIndex: 'sonRoleNum', label: '区服数据信息', align: 'center', width: 55, sorter: true, default: 11,
+                },
+                {
+                    title: '付费人数', dataIndex: 'sonServerAmountNum', label: '区服数据信息', align: 'center', width: 60, sorter: true, default: 12,
+                    render: (a: number) => a || 0
+                },
+                {
+                    title: '付费率', dataIndex: 'sonAmountRate', label: '区服数据信息', align: 'center', width: 60, sorter: true, default: 13,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '指派期间付费次数', dataIndex: 'totalAmountCount', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 14,
+                },
+                {
+                    title: '指派期间创角人数', dataIndex: 'totalRoleNum', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 15,
+                },
+                {
+                    title: '指派期间付费人数', dataIndex: 'totalAmountNum', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 16,
+                },
+                {
+                    title: '指派期间付费金额', dataIndex: 'totalAmount', label: '区服数据信息', align: 'right', width: 75, sorter: true, default: 17,
+                    render: (a: string) => <Statistic value={a || 0} />
+                },
+                {
+                    title: '指派期间付费率', dataIndex: 'amountRate', label: '区服数据信息', align: 'center', width: 75, sorter: true, default: 18,
+                    render: (a: number) => <Statistic value={a ? a * 100 : 0} precision={2} valueStyle={!a ? {} : a >= 50 ? { color: 'red' } : { color: '#0f990f' }} suffix="%" />
+                },
+                {
+                    title: '区服付费排名前十角色',
+                    dataIndex: 'amountRankList',
+                    label: '区服数据信息',
+                    align: 'center',
+                    default: 19,
+                    children: [
+                        {
+                            title: '排名',
+                            dataIndex: 'amountNum',
+                            key: 'amountNum',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item?.amountNum}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色ID',
+                            dataIndex: 'amountRoleId',
+                            key: 'amountRoleId',
+                            width: 100,
+                            align: 'center',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><WidthEllipsis value={item.amountRoleId} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色名称',
+                            dataIndex: 'amountRoleName',
+                            key: 'amountRoleName',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><WidthEllipsis value={item.amountRoleName} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色等级',
+                            dataIndex: 'amountRoleLevel',
+                            key: 'amountRoleLevel',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item.amountRoleLevel}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '国家',
+                            dataIndex: 'amountCountry',
+                            key: 'amountCountry',
+                            width: 70,
+                            align: 'center',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><WidthEllipsis value={item.amountCountry} /></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色战力',
+                            dataIndex: 'amountTotalRoleCombatNum',
+                            key: 'amountTotalRoleCombatNum',
+                            width: 90,
+                            align: 'right',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><Statistic value={item.amountTotalRoleCombatNum || 0} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色累计充值金额',
+                            dataIndex: 'amountRoleTotalAmount',
+                            key: 'amountRoleTotalAmount',
+                            width: 70,
+                            align: 'right',
+                            className: "h5BiomassClass green2ColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = cLength > aLength ? [...b?.amountRankList, ...Array(cLength - aLength).fill(aFill)] : b?.amountRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item.amountRoleTotalAmount === '--' ? '--' : <Statistic value={item.amountRoleTotalAmount || 0} />}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                    ]
+                },
+                {
+                    title: '区服战力排名前十角色',
+                    dataIndex: 'combatRankList',
+                    label: '区服数据信息',
+                    align: 'center',
+                    default: 20,
+                    children: [
+                        {
+                            title: '排名',
+                            dataIndex: 'amountNum',
+                            key: 'amountNum',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item?.amountNum}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色ID',
+                            dataIndex: 'amountRoleId',
+                            key: 'amountRoleId',
+                            width: 100,
+                            align: 'center',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><WidthEllipsis value={item.amountRoleId} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色名称',
+                            dataIndex: 'amountRoleName',
+                            key: 'amountRoleName',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><WidthEllipsis value={item.amountRoleName} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色等级',
+                            dataIndex: 'amountRoleLevel',
+                            key: 'amountRoleLevel',
+                            width: 65,
+                            align: 'center',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item.amountRoleLevel}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '国家',
+                            dataIndex: 'amountCountry',
+                            key: 'amountCountry',
+                            width: 70,
+                            align: 'center',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><WidthEllipsis value={item.amountCountry} /></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色战力',
+                            dataIndex: 'amountTotalRoleCombatNum',
+                            key: 'amountTotalRoleCombatNum',
+                            width: 90,
+                            align: 'right',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span><Statistic value={item.amountTotalRoleCombatNum || 0} /></span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                        {
+                            title: '角色累计充值金额',
+                            dataIndex: 'amountRoleTotalAmount',
+                            key: 'amountRoleTotalAmount',
+                            width: 70,
+                            align: 'right',
+                            className: "h5BiomassClass volcanoColorClass",
+                            render: (a: any, b: any) => {
+                                let cLength = b?.combatRankList?.length || 0
+                                let aLength = b?.amountRankList?.length || 0
+                                let data = aLength > cLength ? [...b?.combatRankList, ...Array(aLength - cLength).fill(aFill)] : b?.combatRankList
+                                return <div className='h5BiomassTable'>
+                                    {(aLength === 0 && cLength === 0) ? '--' : data?.map((item: any, index: number) => {
+                                        return <div key={'cc' + index}>
+                                            <div><span>{item.amountRoleTotalAmount === '--' ? '--' : <Statistic value={item.amountRoleTotalAmount || 0} />}</span></div>
+                                        </div>
+                                    })}
+                                </div>
+                            }
+                        },
+                    ]
+                }
+            ]
+        }
+    ]
+}
+
+export default columns12

src/services/gsData/index.ts

@@ -154,4 +154,29 @@ export async function getRoleManageListApi(data: getRoleManageProps) {
         method: 'POST',
         data
     });
+}
+
+
+export interface GetServerManageProps extends Paging, SortProps{
+    gsIdList?: number[],
+    gsStatus?: 1 | 2,        // GS运营状态：1：独立运营；2：联合运营
+    parentGameId?: number,
+    superGameId?: number,
+    serveDayBegin?: string,  // 服务开始日期
+    serveDayEnd?: string,    // 服务结束日期
+    serveStatus?: 1 | 2,     // 服务状态：1：服务中；2：服务完成
+    serverIdList?: number[]  // 角色当前所在区服id列表
+    serverStartBegin?: string, // 开服日期
+    serverStartEnd?: string, 
+}
+/**
+ * 游戏区服管理
+ * @param data 
+ * @returns 
+ */
+export async function getServerManageListApi(data: GetServerManageProps) {
+    return request(wapi + `/game/parent/serve/manage`, {
+        method: 'POST',
+        data
+    });
 }