|
@@ -1,6 +1,6 @@
|
|
|
import { useAjax } from "@/Hook/useAjax";
|
|
|
import { PauseCircleOutlined, PlayCircleOutlined, PlusOutlined, QuestionCircleOutlined, TransactionOutlined } from "@ant-design/icons";
|
|
|
-import { Button, Checkbox, Col, Input, Row, Select, Space, Tooltip, message } from "antd"
|
|
|
+import { Button, Checkbox, Col, Input, Row, Select, Space, Tooltip, Typography, message } from "antd"
|
|
|
import React, { useCallback, useEffect, useState } from "react"
|
|
|
import { ADGROUP_STATUS } from "../const";
|
|
|
import { getAdqV3AdListApi, modifyStatusBatchApi, syncBatchApi } from "@/services/launchAdq/adqv3";
|
|
@@ -9,7 +9,9 @@ import { txAdConfig } from "../config";
|
|
|
import UpdateAd from "./updateAd";
|
|
|
import TableData from "@/pages/launchSystemNew/components/TableData";
|
|
|
import AddDynamic from "../../tencentAdPutIn/create/addDynamic";
|
|
|
-
|
|
|
+import { arraysHaveSameValues } from "@/utils/utils";
|
|
|
+import { MARKETING_GOAL_ENUM } from "../../tencentAdPutIn/const";
|
|
|
+const { Text } = Typography;
|
|
|
|
|
|
const Ad: React.FC<ADQV3.AdProps> = ({ userId, creativeHandle }) => {
|
|
|
|
|
@@ -19,6 +21,7 @@ const Ad: React.FC<ADQV3.AdProps> = ({ userId, creativeHandle }) => {
|
|
|
const [selectedRows, setSelectedRows] = useState<any[]>([])
|
|
|
const [update, setUpdate] = useState<{ visible: boolean }>({ visible: false })
|
|
|
const [addDynamicVisible, setAddDynamicVisible] = useState<boolean>(false)
|
|
|
+ const [handleType, setHandleType] = useState<number>(1)
|
|
|
|
|
|
const syncBatch = useAjax((params) => syncBatchApi(params))
|
|
|
const modifyStatusBatch = useAjax((params) => modifyStatusBatchApi(params))
|
|
@@ -230,17 +233,54 @@ const Ad: React.FC<ADQV3.AdProps> = ({ userId, creativeHandle }) => {
|
|
|
configName="腾讯广告3.0"
|
|
|
leftChild={<Space direction='vertical'>
|
|
|
<Row gutter={[10, 10]} align='middle'>
|
|
|
- <Col><Button type='primary' style={{ background: '#67c23a', borderColor: '#67c23a' }} loading={modifyStatusBatch.loading} icon={<PlayCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus(true)}>启动</Button></Col>
|
|
|
- <Col><Button type='primary' style={{ background: '#e6a23c', borderColor: '#e6a23c' }} loading={modifyStatusBatch.loading} icon={<PauseCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus(false)}>暂停</Button></Col>
|
|
|
- <Col><Button type='primary' icon={<TransactionOutlined />} disabled={selectedRows.length === 0} onClick={() => setUpdate({ visible: true })}>修改出价</Button></Col>
|
|
|
- {/* <Col><Button type='primary' icon={<PlusOutlined />} disabled={selectedRows.length === 0} onClick={addDynamic}>添加创意</Button></Col> */}
|
|
|
+ <Col><Select
|
|
|
+ style={{ width: 120 }}
|
|
|
+ onChange={(e) => {
|
|
|
+ setHandleType(e)
|
|
|
+ setSelectedRows([])
|
|
|
+ }}
|
|
|
+ value={handleType}
|
|
|
+ options={[{ label: '广告操作', value: 1 }]}
|
|
|
+ /></Col>
|
|
|
+ {handleType === 1 ? <>
|
|
|
+ <Col><Button type='primary' style={{ background: '#67c23a', borderColor: '#67c23a' }} loading={modifyStatusBatch.loading} icon={<PlayCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus(true)}>启动</Button></Col>
|
|
|
+ <Col><Button type='primary' style={{ background: '#e6a23c', borderColor: '#e6a23c' }} loading={modifyStatusBatch.loading} icon={<PauseCircleOutlined />} disabled={selectedRows.length === 0} onClick={() => adStatus(false)}>暂停</Button></Col>
|
|
|
+ <Col><Button type='primary' icon={<TransactionOutlined />} disabled={selectedRows.length === 0} onClick={() => setUpdate({ visible: true })}>修改出价</Button></Col>
|
|
|
+ </> : handleType === 2 ? <>
|
|
|
+ <Col><Button type='primary' icon={<PlusOutlined />} disabled={selectedRows.length === 0} onClick={addDynamic}>添加创意</Button></Col>
|
|
|
+ <Col>
|
|
|
+ {selectedRows?.length > 0 && <Text type="danger" strong style={{ fontSize: 12, marginRight: 6 }}>
|
|
|
+ {`当前选择:营销目的:${MARKETING_GOAL_ENUM[selectedRows?.[0]?.marketingGoal]}`}
|
|
|
+ </Text>}
|
|
|
+ <Tooltip title="选择的广告必须与已选广告的营销目的、营销载体、推广内容、广告版位一致">
|
|
|
+ <QuestionCircleOutlined style={{ color: 'red' }} />
|
|
|
+ </Tooltip>
|
|
|
+ </Col>
|
|
|
+ </> : null}
|
|
|
</Row>
|
|
|
</Space>}
|
|
|
rowSelection={{
|
|
|
selectedRowKeys: selectedRows.map(item => item.adgroupId.toString()),
|
|
|
- getCheckboxProps: (record: any) => ({
|
|
|
- disabled: record.isDeleted
|
|
|
- }),
|
|
|
+ getCheckboxProps: (record: any) => {
|
|
|
+ if (handleType === 2 && selectedRows?.length > 0) {
|
|
|
+ const { siteSet, marketingCarrierType, marketingGoal, marketingTargetType, sceneSpec, automaticSiteEnabled } = selectedRows[0]
|
|
|
+ return {
|
|
|
+ disabled: record.isDeleted || !(
|
|
|
+ record?.marketingGoal === marketingGoal && // 营销内容
|
|
|
+ record?.marketingCarrierType === marketingCarrierType && // 营销载体
|
|
|
+ record?.marketingTargetType === marketingTargetType && // 推广产品
|
|
|
+ record?.automaticSiteEnabled === automaticSiteEnabled && // 自动版位
|
|
|
+ arraysHaveSameValues(siteSet || [], record?.siteSet || []) && // 版位选择
|
|
|
+ arraysHaveSameValues(record?.sceneSpec?.wechatPosition || [], sceneSpec?.wechatPosition || []) // 微信公众号与小程序定投
|
|
|
+ )
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return {
|
|
|
+ disabled: record.isDeleted
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
onSelect: (record: { adgroupId: number, mpName: string }, selected: boolean) => {
|
|
|
if (selected) {
|
|
|
selectedRows.push({ ...record })
|
|
@@ -253,10 +293,26 @@ const Ad: React.FC<ADQV3.AdProps> = ({ userId, creativeHandle }) => {
|
|
|
onSelectAll: (selected: boolean, selectedRowss: { adgroupId: number }[], changeRows: { adgroupId: number }[]) => {
|
|
|
if (selected) {
|
|
|
let newSelectAccData = [...selectedRows]
|
|
|
+ let firstRow = newSelectAccData?.[0] || changeRows?.[0] || {}
|
|
|
changeRows.forEach((item: { adgroupId: number }) => {
|
|
|
let index = newSelectAccData.findIndex((ite: { adgroupId: number }) => ite.adgroupId === item.adgroupId)
|
|
|
if (index === -1) {
|
|
|
- newSelectAccData.push({ ...item })
|
|
|
+ let data: any = { ...item }
|
|
|
+ if (handleType === 2) {
|
|
|
+ const { siteSet, marketingCarrierType, marketingGoal, marketingTargetType, sceneSpec, automaticSiteEnabled } = firstRow
|
|
|
+ if (
|
|
|
+ data?.marketingGoal === marketingGoal && // 营销内容
|
|
|
+ data?.marketingCarrierType === marketingCarrierType && // 营销载体
|
|
|
+ data?.marketingTargetType === marketingTargetType && // 推广产品
|
|
|
+ data?.automaticSiteEnabled === automaticSiteEnabled && // 自动版位
|
|
|
+ arraysHaveSameValues(siteSet || [], data?.siteSet || []) && // 版位选择
|
|
|
+ arraysHaveSameValues(data?.sceneSpec?.wechatPosition || [], sceneSpec?.wechatPosition || []) // 微信公众号与小程序定投
|
|
|
+ ) {
|
|
|
+ newSelectAccData.push(data)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ newSelectAccData.push(data)
|
|
|
+ }
|
|
|
}
|
|
|
})
|
|
|
setSelectedRows([...newSelectAccData])
|