fix

src/pages/gameDataStatistics/components/TablePro/index.tsx

@@ -36,8 +36,8 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
     dataSource,
     isZj,
     totalData = [],
-    rowSelection,
-    summary
+    summary,
+    ...props
 }) => {
 
     /*********************************************/
@@ -79,7 +79,7 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
                 }
             })
         })
-        setState({ defaultColumns: newColumns, configObj: newConfigObj })
+        setState({ defaultColumns: newColumns, configObj: JSON.parse(JSON.stringify(newConfigObj)) })
         handleColumns(newColumns, newConfigObj, lsDataSource, lsFixed)
     }
 
@@ -97,7 +97,7 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
         }
         if (lsDataSource) { // 找到了设置的配置
             newColumns = lsDataSource
-                .filter((item: { dataIndex: string | number;  }) => !!item && configObj[item.dataIndex])
+                .filter((item: { dataIndex: string | number; }) => !!item && configObj[item.dataIndex])
                 .map((item: { dataIndex: string | number; width: number }) => {
                     let column = configObj[item.dataIndex]
                     column['width'] = item.width
@@ -105,7 +105,18 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
                 })
         }
         log(newFixed, 'newFixed')
-        newColumns = newColumns.map(item => ({ ...item, key: item.dataIndex }))
+        newColumns = newColumns.map(item => {
+            if (item?.tips && typeof item.title === 'string') {
+                let column: any = configObj[item.dataIndex]
+                item.title = <Space size={2}>
+                    {column.title}
+                    <Tooltip title={column?.tips} placement='bottom'>
+                        <QuestionCircleOutlined />
+                    </Tooltip>
+                </Space>
+            }
+            return { ...item, key: item.dataIndex }
+        })
         if (newFixed.left || newFixed.right) {
             for (let i = 0; i < Math.min(newFixed.left, newColumns.length); i++) {
                 newColumns[i] = { ...newColumns[i], fixed: 'left' };
@@ -203,11 +214,9 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
                                             scroll={scroll ? isFull ? { ...scroll, y: document.body.clientHeight - 300 } : scroll : {}}
                                             size={size}
                                             pagination={false}
-                                            loading={ajax?.loading}
-                                            rowSelection={rowSelection}
                                             className={`all_table header_table_body header_table_body_${ran} ${className ? className : ''}`}
                                             sortDirections={['ascend', 'descend', null]}
-                                        // onChange={(pagination: any, filters: any, sorter: any) => onChange && onChange({ pagination, filters, sortData: sorter })}
+                                            {...props}
                                         />
                                     }
                                     <NewTable
@@ -218,9 +227,9 @@ const TablePro: React.FC<PROAPI.TableProProps> = ({
                                         scroll={scroll ? isFull ? { ...scroll, y: document.body.clientHeight - 300 } : scroll : {}}
                                         columns={state.columns}
                                         dataSource={dataSource}
-                                        loading={ajax?.loading}
-                                        rowSelection={rowSelection}
                                         summary={summary}
+                                        pagination={{}}
+                                        {...props}
                                     />
                                 </div>
                             </Col>

src/pages/gameDataStatistics/components/TablePro/newTable.tsx

@@ -14,7 +14,7 @@ const ResizableHeader = (props: { [x: string]: any; onResize: any; width: any })
     </Resizable>
 }
 
-const NewTable: React.FC<TableProps<any>> = ({ columns, ...props }) => {
+const NewTable: React.FC<TableProps<any>> = ({ columns, pagination, ...props }) => {
 
     /************************************/
     const { total, page: current, pageSize, onPaginationChange, handelResize } = useContext(DispatchContext)!;
@@ -53,23 +53,20 @@ const NewTable: React.FC<TableProps<any>> = ({ columns, ...props }) => {
     return <div className='components-table-resizable-column'>
         <Table
             rowKey={(a: any) => (JSON.stringify(a?.id) || JSON.stringify(a?.key))}
-            pagination={
-                {
-                    size: 'small',
-                    total,//总共多少条数据,服务器给,设置后分页自动计算页数
-                    current,//当前页数,需state控制配合翻页
-                    pageSize,
-                    defaultCurrent: 1,//默认初始的当前页数
-                    defaultPageSize: 20,//默认初始的每页条数
-                    pageSizeOptions: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100'],
-                    showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
-                    showSizeChanger: true, //手动开启条数筛选器，默认超过50条开启
-                    onChange: onPaginationChange, //点击页码或条数筛选时触发获取当前页数和每页条数
-                    simple: ww ? true : false,//开启简单分页
-                    hideOnSinglePage: true,//只有一页数据隐藏分页
-                    showLessItems: true
-                }
-            }
+            pagination={pagination ? {
+                size: 'small',
+                total,//总共多少条数据,服务器给,设置后分页自动计算页数
+                current,//当前页数,需state控制配合翻页
+                pageSize,
+                defaultCurrent: 1,//默认初始的当前页数
+                defaultPageSize: 20,//默认初始的每页条数
+                pageSizeOptions: ['10', '20', '30', '40', '50', '60', '70', '80', '90', '100'],
+                showTotal: (total) => <Tag color="cyan">总共{total}数据</Tag>,
+                showSizeChanger: true, //手动开启条数筛选器，默认超过50条开启
+                onChange: onPaginationChange, //点击页码或条数筛选时触发获取当前页数和每页条数
+                simple: ww ? true : false,//开启简单分页
+                showLessItems: true
+            } : false}
             components={components}
             columns={colsRef?.current}
             {...props}

src/pages/gameDataStatistics/components/TablePro/typings.d.ts

@@ -1,5 +1,5 @@
 declare namespace PROAPI {
-    type TableProProps = {
+    type TableProProps = TableProps<any> & {
         configName: string;
         config: any;
         fixed?: {
@@ -16,12 +16,15 @@ declare namespace PROAPI {
         total?: number;
         page?: number,
         pageSize?: number,
-        scroll?: { x?: number, y?: number },
+        scroll?: ({
+            x?: string | number | true | undefined;
+            y?: string | number | undefined;
+        } & {
+            scrollToFirstRowOnChange?: boolean | undefined;
+        }),
         dataSource?: readonly any[]
         isZj?: boolean,//是否查总计
         totalData?: any[]
-        rowSelection?: TableRowSelection<any>
-        summary?: ((data: readonly any[]) => React.ReactNode)
     };
     type State = {
         columns: any[];

src/pages/gameDataStatistics/gameServer/serverData/tableConfig.tsx

@@ -4,31 +4,9 @@ import { Statistic, Tooltip } from "antd"
 import React from "react"
 import moment from "moment"
 import style from './index.less'
-import { version } from "../../components/TableData"
 
 function columns12(): { label: string, fieldSHow?: { label: string, saveField: string, defaultValue: any[], data: any[] }, data: any[] }[] {
 
-    const getFieldDta = () => {
-        let defaultValue = [  // 默认展示字段
-            { label: '新用户人数', key: 'regNum', type: 'D1~Dn' },
-            { label: '创角人数', key: 'roleNum', type: 'D1~Dn' },
-            { label: '活跃人数', key: 'activeNum', type: 'D1~Dn' },
-            { label: '付费人数', key: 'amountNum', type: 'D1~Dn' },
-            { label: '付费金额', key: 'amount', type: 'D1~Dn' },
-            { label: '滚服人数', key: 'rollServerNum', type: 'D1~Dn' },
-            { label: '滚服付费人数', key: 'rollServerAmountNum', type: 'D1~Dn' },
-            { label: '滚服付费金额', key: 'rollServerAmount', type: 'D1~Dn' },
-            { label: '滚服（付费金额）占比', key: 'rollServerAmountRate', type: 'D1~Dn' },
-        ]
-        let mySelectFieldData = localStorage.getItem(`myAdFieldConfig${version}_区服数据`)
-        let newSelectFieldData: any = {}
-        if (mySelectFieldData) {
-            newSelectFieldData = JSON.parse(mySelectFieldData).date_field
-        } else {
-            newSelectFieldData = defaultValue
-        }
-        return newSelectFieldData
-    }
 
     let defaultStart = 13
     const day = Array(90).fill('').map((_item: string, index: number) => {
@@ -58,24 +36,19 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     }
                     let dt = moment()
                     let day = dt.diff(date1, 'day');
-                    let fieldData = getFieldDta()
-                    if (fieldData?.length > 0 && index <= day) {
+                    if (index <= day) {
                         let data: any = {}
-                        let keyS: string[] = fieldData?.map((item: any) => item.key)
-                        switch (fieldData[0].type) {
-                            case 'D1~Dn':
-                                if (b?.[field]) {
-                                    data = b?.[field]
-                                    return <div className={style.dbox}>
-                                        {keyS?.includes('regNum') && <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>}
-                                        {keyS?.includes('roleNum') && <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>}
-                                        {keyS?.includes('activeNum') && <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>}
-                                        {keyS?.includes('amountNum') && <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>}
-                                        {keyS?.includes('amount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                    </div>
-                                }
-                                return '--'
+                        if (b?.[field]) {
+                            data = b?.[field]
+                            return <div className={style.dbox}>
+                                <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>
+                                <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>
+                                <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>
+                                <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>
+                                <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                            </div>
                         }
+                        return '--'
                     }
                     return '--'
                 },
@@ -98,23 +71,18 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     }
                     let dt = moment()
                     let day = dt.diff(date1, 'day');
-                    let fieldData = getFieldDta()
-                    if (fieldData?.length > 0 && index <= day) {
+                    if (index <= day) {
                         let data: any = {}
-                        let keyS: string[] = fieldData?.map((item: any) => item.key)
-                        switch (fieldData[0].type) {
-                            case 'D1~Dn':
-                                if (b?.[field]) {
-                                    data = b?.[field]
-                                    return <div className={style.dbox}>
-                                        {keyS?.includes('rollServerNum') && <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>}
-                                        {keyS?.includes('rollServerAmountNum') && <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>}
-                                        {keyS?.includes('rollServerAmount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                        {keyS?.includes('rollServerAmountRate') && <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>}
-                                    </div>
-                                }
-                                return '--'
+                        if (b?.[field]) {
+                            data = b?.[field]
+                            return <div className={style.dbox}>
+                                <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>
+                                <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>
+                                <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                                <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>
+                            </div>
                         }
+                        return '--'
                     }
                     return '--'
                 },
@@ -137,9 +105,6 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     }
                     let dt = moment()
                     let day = dt.diff(date1, 'day');
-                    if (index < 1 && b?.gameName === '暗影防线H5') {
-                        console.log('========', index, day)
-                    }
                     if (index <= day) {
                         let data: any = {}
                         switch (b?.activeTypes) {
@@ -272,24 +237,19 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     }
                     let dt = moment()
                     let day = dt.diff(date1, 'day');
-                    let fieldData = getFieldDta()
-                    if (fieldData?.length > 0 && item * 30 <= day) {
+                    if (item * 30 <= day) {
                         let data: any = {}
-                        let keyS: string[] = fieldData?.map((item: any) => item.key)
-                        switch (fieldData[0].type) {
-                            case 'D1~Dn':
-                                if (b?.[field]) {
-                                    data = b?.[field]
-                                    return <div className={style.dbox}>
-                                        {keyS?.includes('regNum') && <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>}
-                                        {keyS?.includes('roleNum') && <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>}
-                                        {keyS?.includes('activeNum') && <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>}
-                                        {keyS?.includes('amountNum') && <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>}
-                                        {keyS?.includes('amount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                    </div>
-                                }
-                                return '--'
+                        if (b?.[field]) {
+                            data = b?.[field]
+                            return <div className={style.dbox}>
+                                <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>
+                                <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>
+                                <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>
+                                <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>
+                                <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                            </div>
                         }
+                        return '--'
                     }
                     return '--'
                 },
@@ -312,27 +272,22 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
                     }
                     let dt = moment()
                     let day = dt.diff(date1, 'day');
-                    let fieldData = getFieldDta()
-                    if (fieldData?.length > 0 && item * 30 <= day) {
+                    if (item * 30 <= day) {
                         let data: any = {}
-                        let keyS: string[] = fieldData?.map((item: any) => item.key)
-                        switch (fieldData[0].type) {
-                            case 'D1~Dn':
-                                if (b?.[field]) {
-                                    data = b?.[field]
-                                    return <div className={style.dbox}>
-                                        {keyS?.includes('rollServerNum') && <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>}
-                                        {keyS?.includes('rollServerAmountNum') && <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>}
-                                        {keyS?.includes('rollServerAmount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                        {keyS?.includes('rollServerAmountRate') && <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>}
-                                    </div>
-                                }
-                                return '--'
+                        if (b?.[field]) {
+                            data = b?.[field]
+                            return <div className={style.dbox}>
+                                <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>
+                                <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>
+                                <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                                <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>
+                            </div>
                         }
+                        return '--'
                     }
                     return '--'
                 },
-            },{
+            }, {
                 title: `留存`,
                 dataIndex: field,
                 key: 'retained',
@@ -470,24 +425,16 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
             align: "center",
             width: 140,
             render: (a: any, b: any) => {
-                let fieldData = getFieldDta()
-                if (fieldData?.length > 0) {
-                    let data: any = {}
-                    let keyS: string[] = fieldData?.map((item: any) => item.key)
-                    switch (fieldData[0].type) {
-                        case 'D1~Dn':
-                            if (b?.['totalTrend']) {
-                                data = b?.['totalTrend']
-                                return <div className={style.dbox}>
-                                    {keyS?.includes('regNum') && <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>}
-                                    {keyS?.includes('roleNum') && <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>}
-                                    {keyS?.includes('activeNum') && <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>}
-                                    {keyS?.includes('amountNum') && <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>}
-                                    {keyS?.includes('amount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                </div>
-                            }
-                            return '--'
-                    }
+                let data: any = {}
+                if (b?.['totalTrend']) {
+                    data = b?.['totalTrend']
+                    return <div className={style.dbox}>
+                        <span style={{ color: '#2f54eb', fontWeight: 600 }}>新用户人数：<span>{data?.regNum}</span></span>
+                        <span style={{ color: '#722ed1', fontWeight: 600 }}>创角人数：<span>{data?.roleNum}</span></span>
+                        <span style={{ color: '#eb2f96', fontWeight: 600 }}>活跃人数：<span>{data?.activeNum}</span></span>
+                        <span style={{ color: '#d81b60', fontWeight: 600 }}>付费人数：<span>{data?.amountNum}</span></span>
+                        <span style={{ color: '#0f538a', fontWeight: 600 }}>付费金额：<span><Statistic value={data?.amount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                    </div>
                 }
                 return '--'
             },
@@ -498,23 +445,15 @@ function columns12(): { label: string, fieldSHow?: { label: string, saveField: s
             align: "center",
             width: 150,
             render: (a: any, b: any) => {
-                let fieldData = getFieldDta()
-                if (fieldData?.length > 0) {
-                    let data: any = {}
-                    let keyS: string[] = fieldData?.map((item: any) => item.key)
-                    switch (fieldData[0].type) {
-                        case 'D1~Dn':
-                            if (b?.['totalTrend']) {
-                                data = b?.['totalTrend']
-                                return <div className={style.dbox}>
-                                    {keyS?.includes('rollServerNum') && <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>}
-                                    {keyS?.includes('rollServerAmountNum') && <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>}
-                                    {keyS?.includes('rollServerAmount') && <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>}
-                                    {keyS?.includes('rollServerAmountRate') && <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>}
-                                </div>
-                            }
-                            return '--'
-                    }
+                let data: any = {}
+                if (b?.['totalTrend']) {
+                    data = b?.['totalTrend']
+                    return <div className={style.dbox}>
+                        <span style={{ color: '#13c2c2', fontWeight: 600 }}>滚服人数：<span>{data?.rollServerNum}</span></span>
+                        <span style={{ color: '#faad14', fontWeight: 600 }}>滚服付费人数：<span>{data?.rollServerAmountNum}</span></span>
+                        <span style={{ color: '#0f538a', fontWeight: 600 }}>滚服付费金额：<span><Statistic value={data?.rollServerAmount || 0} valueStyle={{ color: '#0f538a', fontWeight: 600 }} /></span></span>
+                        <span style={{ color: 'rgb(12,130,16)', fontWeight: 600 }}>滚服占比：<span>{(data?.rollServerAmountRate * 100)?.toFixed(2)}%</span></span>
+                    </div>
                 }
                 return '--'
             },