wjx hace 1 año
padre
commit
cd520091a1

+ 57 - 30
src/components/VirtualTable/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from "react";
 import "antd/dist/antd.css";
 import "./index.less";
-import { Pagination, Space, Table } from "antd";
+import { Pagination, Space, Spin, Table, Tag } from "antd";
 import type { TableProps } from "antd";
 import classNames from "classnames";
 import ResizeObserver from "rc-resize-observer";
@@ -10,11 +10,18 @@ import { VariableSizeGrid as Grid } from "react-window";
 
 interface Props<RecordType extends object> extends TableProps<RecordType> {
     rowHeight: number
+    loading?: boolean,
+    total?: number,
+    current?: number,
+    pageSize?: number,
+    defaultPageSize?: number
+    pageChange?: (page: number, pageSize?: number) => void,
+    sizeChange?: (current: number, size?: number) => void,
 }
 
-const VirtualTable = <RecordType extends object>(props: Props<RecordType>) => {
+const VTable = <RecordType extends object>(props: Props<RecordType>) => {
 
-    const { columns, scroll, className, rowHeight } = props;
+    const { columns, scroll, className, rowHeight, loading = false, total = 0, current, pageSize, defaultPageSize, pageChange, sizeChange } = props;
     const [tableWidth, setTableWidth] = useState(0);
 
     //   const widthColumnCount = columns!.filter(({ width }) => !width).length;
@@ -115,22 +122,41 @@ const VirtualTable = <RecordType extends object>(props: Props<RecordType>) => {
         );
     };
 
-    return <ResizeObserver
-        onResize={({ width }) => {
-            setTableWidth(width);
-        }}
-    >
-        <Table
-            {...props}
-            bordered
-            className={`virtual-table ${className ? className : ''}`}
-            columns={mergedColumns}
-            pagination={false}
-            components={{
-                body: renderVirtualList as any
-            }}
-        />
-    </ResizeObserver>
+    return <Spin style={{ width: '100%' }} spinning={loading}>
+        <div>
+            <ResizeObserver
+                onResize={({ width }) => {
+                    setTableWidth(width);
+                }}
+            >
+                <Table
+                    {...props}
+                    bordered
+                    className={`virtual-table all_table ${className ? className : ''}`}
+                    columns={mergedColumns}
+                    pagination={false}
+                    components={{
+                        body: renderVirtualList as any
+                    }}
+                />
+            </ResizeObserver>
+            <div style={{ textAlign: 'end', padding: '16px 0', background: '#FFF' }}>
+                <Pagination
+                    defaultCurrent={1}
+                    total={total || 0}
+                    current={current || 1}
+                    pageSize={pageSize || 20}
+                    defaultPageSize={defaultPageSize || 20}
+                    pageSizeOptions={['10', '20', '30', '40', '50', '60', '70', '80', '90', '100']}
+                    size="small"
+                    showTotal={(total) => <Tag color="cyan">总共{total}数据</Tag>}
+                    showSizeChanger={true}
+                    onChange={pageChange}
+                    onShowSizeChange={sizeChange}
+                />
+            </div>
+        </div>
+    </Spin>
 };
 
 // Usage
@@ -194,17 +220,18 @@ const data = Array.from({ length: 100 }, (_, key) => ({
     dd: "啊大大撒旦啊实打实大苏打阿斯顿撒打算阿三打撒"
 }));
 
-const App1: React.FC = () => {
 
-
-    return <Space >
-        <VirtualTable
-            rowHeight={26}
-            columns={columns}
-            dataSource={data}
-            scroll={{ y: 600, x: "100vw" }}
-        />
-    </Space>
+interface VirtualTableProps {
+    loading?: boolean,
+}
+const VirtualTable: React.FC<VirtualTableProps> = ({ loading }) => {
+
+    return <VTable
+        rowHeight={26}
+        columns={columns}
+        dataSource={data}
+        scroll={{ y: 600, x: "100vw" }}
+    />
 };
 
-export default App1;
+export default VirtualTable;

+ 3 - 3
src/pages/gameDataStatistics/adlist/monitor/tableConfig.tsx

@@ -127,7 +127,7 @@ function columns12(dayHandle: (data: any) => void): { label: string, fieldSHow?:
                 },
                 {
                     title: '广告ID', dataIndex: 'promotionId', label: '广告信息', align: 'center', width: 90, default: 5,
-                    render: (a: string, b: any) => (<a onClick={() => { dayHandle(b) }}><WidthEllipsis value={a} /></a>)
+                    render: (a: string, b: any) => (<a><WidthEllipsis value={a} /></a>)
                 },
                 {
                     title: '项目名称', dataIndex: 'projectName', label: '广告信息', align: 'center', width: 130,
@@ -534,9 +534,9 @@ function columns12(dayHandle: (data: any) => void): { label: string, fieldSHow?:
                             <a onClick={() => dayHandle(b)}>广告每日监控</a>
                             {
                                 b?.accountType === 'BYTE' ? <a onClick={() => {
-                                    window.open(`https://ad.oceanengine.com/pages/promotion.html?aadvid=${b?.accountId}#/campaign`)
+                                    window.open(`https://ad.oceanengine.com/superior/promote-manage/ad?aadvid=${b?.accountId}&searchInput=%2522${b?.promotionId}%2522&searchType=%25229%2522`)
                                 }}>头条广告</a> : <a onClick={() => {
-                                    window.open(`https://ad.qq.com/atlas/${b?.accountId}/admanage/adgroup?query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[]}`)
+                                    window.open(`https://ad.qq.com/atlas/${b?.accountId}/admanage/adgroup?query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[],%22search_name%22:%22${b.adgroupId}%22}`)
                                 }}>腾讯广告</a>
                             }
                         </Space>

+ 2 - 2
src/pages/gameDataStatistics/adlist/tencentMonitor/tableConfig.tsx

@@ -594,9 +594,9 @@ function columns12(dayHandle: (data: any) => void): { label: string, fieldSHow?:
                             <a onClick={() => dayHandle(b)}>广告每日监控</a>
                             {
                                 b?.accountType === 'BYTE' ? <a onClick={() => {
-                                    window.open(`https://ad.oceanengine.com/pages/promotion.html?aadvid=${b?.accountId}#/campaign`)
+                                    window.open(`https://ad.oceanengine.com/superior/promote-manage/ad?aadvid=${b?.accountId}&searchInput=%2522${b?.promotionId}%2522&searchType=%25229%2522`)
                                 }}>头条广告</a> : <a onClick={() => {
-                                    window.open(`https://ad.qq.com/atlas/${b?.accountId}/admanage/adgroup?query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[]}`)
+                                    window.open(`https://ad.qq.com/atlas/${b?.accountId}/admanage/adgroup?query={%22operation_status%22:[%22CALCULATE_STATUS_EXCLUDE_DEL%22],%22system_status%22:[],%22search_name%22:%22${b.promotionId}%22}`)
                                 }}>腾讯广告</a>
                             }
                         </Space>

+ 2 - 2
src/pages/gameDataStatistics/rankingList/gamer/index.tsx

@@ -6,7 +6,7 @@ import columns12 from "./tableConfig"
 import QueryForm from "@/components/QueryForm"
 import moment from "moment"
 import { getPresetsRanking } from "@/components/QueryForm/const"
-import App1 from "@/components/VirtualTable"
+import VirtualTable from "@/components/VirtualTable"
 
 const Gamer: React.FC = () => {
 
@@ -20,7 +20,7 @@ const Gamer: React.FC = () => {
     }, [queryForm])
 
     return <div>
-        {/* <App1 /> */}
+        {/* <VirtualTable /> */}
         <TableData
             leftChild={<QueryForm
                 initialValues={{ sourceSystem: 'ZX_ONE', rechargeDay: [moment(), moment()] }}