|
@@ -1,5 +1,5 @@
|
|
|
import { useAjax } from "@/Hook/useAjax"
|
|
|
-import { PromotionDataDay, getPromotionDataDatListApi, getPromotionDataDatTotalApi } from "@/services/gameData/adlist"
|
|
|
+import { PromotionDataDay, getPromotionDataDatListApi, getPromotionDataDatTotalApi, newEditTTAdgroupsDataApi } from "@/services/gameData/adlist"
|
|
|
import React, { useEffect, useState } from "react"
|
|
|
import columns12 from "./tableConfig"
|
|
|
import QueryForm from "@/components/QueryForm"
|
|
@@ -7,6 +7,8 @@ import TableData from "../../components/TableData"
|
|
|
import moment from "moment"
|
|
|
import { getPresets } from "@/components/QueryForm/const"
|
|
|
import DayAd from "./dayAd"
|
|
|
+import { Button, message, Modal, notification, Space, Table } from "antd"
|
|
|
+import { PauseCircleOutlined, PlayCircleOutlined } from "@ant-design/icons"
|
|
|
|
|
|
|
|
|
const Monitor = () => {
|
|
@@ -17,14 +19,18 @@ const Monitor = () => {
|
|
|
const [visible, setVisible] = useState<boolean>(false)
|
|
|
const [promotionId, setPromotionId] = useState<number>()
|
|
|
const [adName, setAdName] = useState<string>('')
|
|
|
+ const [selectedRows, setSelectedRows] = useState<any[]>([])
|
|
|
+ const [failIdList, setFailIdList] = useState<{ adgroupId: number, code: number, message: string, messageCn: string }[]>([])
|
|
|
+ const [failVisible, setFailVisible] = useState<boolean>(false)
|
|
|
|
|
|
const getPromotionDataDatList = useAjax((params) => getPromotionDataDatListApi(params))
|
|
|
const getPromotionDataDatTotal = useAjax((params) => getPromotionDataDatTotalApi(params))
|
|
|
+ const newEditTTAdgroupsData = useAjax((params) => newEditTTAdgroupsDataApi(params))
|
|
|
/***************************************/
|
|
|
|
|
|
useEffect(() => {
|
|
|
getPromotionDataDatList.run(queryForm)
|
|
|
- getPromotionDataDatTotal.run(queryForm).then(res => {
|
|
|
+ getPromotionDataDatTotal.run(queryForm).then((res: { id: number; accountName: string }) => {
|
|
|
res.id = 1
|
|
|
res.accountName = '总计'
|
|
|
setTotalData([res])
|
|
@@ -37,8 +43,41 @@ const Monitor = () => {
|
|
|
setPromotionId(data.promotionId)
|
|
|
}
|
|
|
|
|
|
+ // 批量启停
|
|
|
+ const adStatus = (type: 'play' | 'suspend') => {
|
|
|
+ let params: any = {}
|
|
|
+ params.suspend = type === 'play' ? false : true
|
|
|
+ params.adgroupIds = selectedRows.map(item => item.accountId + ',' + item.promotionId)
|
|
|
+ if (params.adgroupIds.length === 0) {
|
|
|
+ message.warn(`所以账号都是${type === 'play' ? '启动' : '暂停'}状态,无需${type === 'play' ? '启动' : '暂停'}操作`)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let hide = message.loading(`正在设置...`, 0, () => {
|
|
|
+ message.success('设置成功');
|
|
|
+ });
|
|
|
+ newEditTTAdgroupsData.run(params).then((res: any) => {
|
|
|
+ if (res?.failIdList?.length === 0) {
|
|
|
+ message.success(`操作完成!`)
|
|
|
+ getPromotionDataDatList.refresh()
|
|
|
+ setSelectedRows([])
|
|
|
+ } else {
|
|
|
+ setFailIdList(res?.list || [])
|
|
|
+ setFailVisible(true)
|
|
|
+ }
|
|
|
+ hide()
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
return <div>
|
|
|
+
|
|
|
<TableData
|
|
|
+ czChild={<Space>
|
|
|
+ {/* <Switch checkedChildren="开启全选" unCheckedChildren="关闭全选" checked={!isZj} onChange={(e) => { setIsZj(!e); }} /> */}
|
|
|
+ <Button type='primary' size="small" style={{ background: '#67c23a', borderColor: '#67c23a' }} loading={newEditTTAdgroupsData.loading} icon={<PlayCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus('play')}>启动</Button>
|
|
|
+ <Button type='primary' size="small" style={{ background: '#e6a23c', borderColor: '#e6a23c' }} loading={newEditTTAdgroupsData.loading} icon={<PauseCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus('suspend')}>暂停</Button>
|
|
|
+ {selectedRows.length > 0 && <Button type="link" danger onClick={() => setSelectedRows([])}>清空</Button>}
|
|
|
+ <span style={{ color: 'red' }}>操作完数据结果延时5分钟之内,即时结果去腾讯后台查看</span>
|
|
|
+ </Space>}
|
|
|
leftChild={<QueryForm
|
|
|
initialValues={{ sourceSystem: 'ZX_ONE', consumeDay: [moment(), moment()] }}
|
|
|
onChange={(data: any) => {
|
|
@@ -109,8 +148,80 @@ const Monitor = () => {
|
|
|
}}
|
|
|
config={columns12(dayHandle)}
|
|
|
configName={'头条广告监控'}
|
|
|
+ rowSelection={{
|
|
|
+ selectedRowKeys: selectedRows.map(item => item.id + ''),
|
|
|
+ getCheckboxProps: (record: any) => ({
|
|
|
+ disabled: record.status === 'STATUS_DELETED' || record?.accountName === '总计'
|
|
|
+ }),
|
|
|
+ onSelect: (record: { promotionId: number }, selected: boolean) => {
|
|
|
+ if (selected) {
|
|
|
+ selectedRows.push({ ...record })
|
|
|
+ setSelectedRows([...selectedRows])
|
|
|
+ } else {
|
|
|
+ let newSelectAccData = selectedRows.filter((item: { promotionId: number }) => item.promotionId !== record.promotionId)
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSelectAll: (selected: boolean, selectedRowss: { promotionId: number }[], changeRows: { promotionId: number }[]) => {
|
|
|
+ if (selected) {
|
|
|
+ let newSelectAccData = [...selectedRows]
|
|
|
+ changeRows.forEach((item: { promotionId: number }) => {
|
|
|
+ let index = newSelectAccData.findIndex((ite: { promotionId: number }) => ite.promotionId === item.promotionId)
|
|
|
+ if (index === -1) {
|
|
|
+ newSelectAccData.push({ ...item })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ } else {
|
|
|
+ let newSelectAccData = selectedRows.filter((item: { promotionId: number }) => {
|
|
|
+ let index = changeRows.findIndex((ite: { promotionId: number }) => ite.promotionId === item.promotionId)
|
|
|
+ if (index !== -1) {
|
|
|
+ return false
|
|
|
+ } else {
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ setSelectedRows([...newSelectAccData])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }}
|
|
|
/>
|
|
|
|
|
|
+ {failVisible && <Modal
|
|
|
+ title={<strong>报错信息</strong>}
|
|
|
+ visible={failVisible}
|
|
|
+ className='modalResetCss'
|
|
|
+ width={650}
|
|
|
+ onCancel={() => { setFailVisible(false); setFailIdList([]) }}
|
|
|
+ footer={null}
|
|
|
+ >
|
|
|
+ <Table
|
|
|
+ size="small"
|
|
|
+ bordered
|
|
|
+ rowKey={'creativeId'}
|
|
|
+ columns={[{
|
|
|
+ title: '创意ID',
|
|
|
+ dataIndex: 'creativeId',
|
|
|
+ key: 'creativeId',
|
|
|
+ width: 110,
|
|
|
+ render: (value) => <span style={{ fontSize: 12 }}>{value}</span>,
|
|
|
+ }, {
|
|
|
+ title: 'code',
|
|
|
+ dataIndex: 'code',
|
|
|
+ key: 'code',
|
|
|
+ width: 70,
|
|
|
+ align: 'center',
|
|
|
+ render: (value) => <span style={{ fontSize: 12 }}>{value}</span>,
|
|
|
+ }, {
|
|
|
+ title: '错误信息',
|
|
|
+ dataIndex: 'messageCn',
|
|
|
+ key: 'messageCn',
|
|
|
+ render: (value) => <span style={{ fontSize: 12 }}>{value}</span>,
|
|
|
+ }]}
|
|
|
+ dataSource={failIdList}
|
|
|
+ />
|
|
|
+ </Modal>}
|
|
|
+
|
|
|
{visible && <DayAd adName={adName} visible={visible} onClose={() => { setVisible(false); setPromotionId(undefined) }} queryForm={queryForm} promotionId={promotionId} />}
|
|
|
</div>
|
|
|
}
|