wjx 2 роки тому
батько
коміт
b438b73fe9

+ 2 - 2
src/pages/launchSystemNew/components/TableData/index.tsx

@@ -41,7 +41,7 @@ interface Prosp {
 }
 
 function TableData(props: Prosp) {
-    const { isZj, scroll, columns, title, dataSource, expandedRowRender, className, leftChild, page = undefined, rowSelection, pageSize = undefined, size = 'small', total = 0, loading = false, onChange, config, configName, ajax, hoverable = true } = props
+    const { isZj, scroll, columns, title, dataSource, expandedRowRender, className, leftChild, page = undefined, rowSelection = false, pageSize = undefined, size = 'small', total = 0, loading = false, onChange, config, configName, ajax, hoverable = true } = props
     const { state: userState } = useModel('useOperating.useUser')
     const { isFell } = userState
     const [visible, setVisible] = useState<boolean>(false)
@@ -207,7 +207,7 @@ const Tab = React.memo((props: any) => {
                 total={total}
                 loading={loading}
                 defaultPageSize={20}
-                rowSelection={rowSelection || {}}
+                rowSelection={rowSelection}
                 handelResize={((columns: any) => handelResize(columns))}
             /> : <div className={style.example}>
                 <Spin />

+ 14 - 2
src/pages/launchSystemNew/components/adModal/index.tsx

@@ -1,7 +1,7 @@
 import { FnAjax, useAjax } from "@/Hook/useAjax"
 import { ListData, SysAdgroupsDTO } from "@/services/launchAdq"
 import { getSysAdgroupsList } from "@/services/launchAdq/localAd"
-import { Col, Input, Modal, Row } from "antd"
+import { Col, Input, message, Modal, Row } from "antd"
 import React, { useCallback, useEffect, useState } from "react"
 import TableData from "../TableData"
 import tableConfig from "./tableConfig"
@@ -49,7 +49,19 @@ const AdModal: React.FC<Props> = (props) => {
 
     // 确定
     const handleOk = () => {
-        onChange && onChange(selectedRowKeys.toString())
+        if (selectedRowKeys?.length) {
+            if (sysAdgroupsId) {
+                if (selectedRowKeys?.indexOf(sysAdgroupsId) === -1) {
+                    onChange && onChange(selectedRowKeys.toString())
+                } else {
+                    onClose && onClose()
+                }
+            } else {
+                onChange && onChange(selectedRowKeys.toString())
+            }
+        } else {
+            message.error('请选择广告')
+        }
     }
 
     return <Modal title={`选择广告`} bodyStyle={{ padding: 0 }} width={1000} visible={visible} onOk={handleOk} onCancel={() => { onClose && onClose() }}>

+ 111 - 0
src/pages/launchSystemNew/components/creativeModal/index.tsx

@@ -0,0 +1,111 @@
+import { FnAjax, useAjax } from "@/Hook/useAjax"
+import { ListData } from "@/services/launchAdq"
+import { getSysAdcreativeList } from "@/services/launchAdq/creative"
+import { PromotedObjectType } from "@/services/launchAdq/enum"
+import { Col, Input, Modal, Row, Select } from "antd"
+import React, { useCallback, useEffect, useState } from "react"
+import TableData from "../TableData"
+import tableConfig from "./tableConfig"
+
+
+interface Props {
+    promotedObjectType: string,
+    visible?: boolean,
+    onClose?: () => void,
+    onChange?: (data: any) => void,
+    sysAdcreativeId?: number
+}
+/**
+ * 选择创意
+ * @returns 
+ */
+const CreativeModal: React.FC<Props> = (props) => {
+
+    /****************************/
+    const { visible, onClose, onChange, sysAdcreativeId, promotedObjectType } = props
+    const sysAdcreativeList: FnAjax<ListData<any>|any> = useAjax((params) => getSysAdcreativeList(params),{formatResult:true})
+    const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([])
+    const [oldsearchData, setOldsearchData] = useState<any>(null)
+    /****************************/
+
+    // 回填
+    useEffect(() => {
+        if (sysAdcreativeId) {
+            setSelectedRowKeys([sysAdcreativeId])
+        }
+    }, [sysAdcreativeId])
+
+    // 初始获取列表
+    useEffect(() => {
+        getList({ pageSize: 20, pageNum: 1, promotedObjectType })
+    }, [])
+    // 获取列表
+    const getList = useCallback((arg: { pageSize: number, pageNum: number, adcreativeName?: string, promotedObjectType?: string }) => {
+        Object.keys(arg).forEach(key => {
+            !arg[key] && delete arg[key]
+        })
+        if (JSON.stringify(arg) !== JSON.stringify(oldsearchData)) {
+            setOldsearchData(arg)
+            sysAdcreativeList.run(arg)
+        }
+    }, [oldsearchData])
+
+    const handleOk = () => {
+        onChange && onChange(selectedRowKeys.toString())
+    }
+    
+    return <Modal title={`选择创意`} bodyStyle={{ padding: 0 }} width={1000} visible={visible} onOk={handleOk} onCancel={() => { onClose && onClose() }}>
+        <TableData
+            hoverable={false}
+            columns={tableConfig}
+            ajax={sysAdcreativeList}
+            dataSource={sysAdcreativeList?.data?.data?.records}
+            loading={sysAdcreativeList?.loading}
+            scroll={{ y: 600 }}
+            total={sysAdcreativeList?.data?.data?.total}
+            page={sysAdcreativeList?.data?.data?.current}
+            pageSize={sysAdcreativeList?.data?.data?.size}
+            rowSelection={{
+                type: 'radio',
+                selectedRowKeys: selectedRowKeys,
+                onChange: (selectedRowKeys: React.Key[]) => {
+                    setSelectedRowKeys(selectedRowKeys)
+                }
+            }}
+            leftChild={<>
+                <Row gutter={[10, 10]}>
+                    <Col>
+                        <Input
+                            placeholder='创意名称'
+                            allowClear
+                            onBlur={(e) => {
+                                let value = e.target.value
+                                getList({ pageNum: 1, pageSize: 20, adcreativeName: value })
+                            }}
+                            onKeyDownCapture={(e: any) => {
+                                let key = e.key
+                                if (key === 'Enter') {
+                                    let value = e.target.value
+                                    getList({ pageNum: 1, pageSize: 20, adcreativeName: value })
+                                }
+                            }}
+                            onChange={(e) => {
+                                let value = e.target.value
+                                if (!value) {
+                                    getList({ pageNum: 1, pageSize: 20, adcreativeName: value })
+                                }
+                            }}
+                        />
+                    </Col>
+                </Row>
+            </>}
+            onChange={(props: any) => {
+                let { sortData, pagination } = props
+                let { current, pageSize } = pagination
+                getList({ pageNum: current, pageSize })
+            }}
+        />
+    </Modal>
+}
+
+export default React.memo(CreativeModal)

+ 62 - 0
src/pages/launchSystemNew/components/creativeModal/tableConfig.tsx

@@ -0,0 +1,62 @@
+import { PromotedObjectType } from '@/services/launchAdq/enum'
+import React from 'react'
+import { Space } from 'antd'
+function tableConfig():any{
+    return [
+        {
+            title: 'ID',
+            dataIndex: 'id',
+            key: 'id',
+            align: 'center',
+            width:70
+        },
+        {
+            title: '广告名称',
+            dataIndex: 'adgroupName',
+            key: 'adgroupName',
+            align: 'center',
+        },
+        {
+            title: '广告推广目标类型',
+            dataIndex: 'promotedObjectType',
+            key: 'promotedObjectType',
+            align: 'center',
+           render:(a: string | number)=>{
+            return PromotedObjectType[a]
+           } 
+        },
+        {
+            title: '投放日期',
+            dataIndex: 'beginDate',
+            key: 'beginDate',
+            align: 'center',
+            render:(a: string,b: { endDate: string })=>{
+                return b?.endDate ? a+'~'+b.endDate : a+'~'+'长期投放'
+            }
+        },
+        {
+            title: '广告出价',
+            dataIndex: 'bidAmount',
+            key: 'bidAmount',
+            align: 'center',  
+        },
+        {
+            title: '创建时间',
+            dataIndex: 'createTime',
+            key: 'createTime',
+            align: 'center',
+        },
+        {
+            title:'操作',
+            dataIndex:'cz',
+            key: 'cz',
+            align: 'center',  
+            render:()=>{
+               return <Space>
+                    <a>详情</a>
+                </Space>
+            }
+        }
+    ]
+}
+export default tableConfig

+ 4 - 2
src/pages/launchSystemNew/components/targetingTooltip/index.tsx

@@ -67,7 +67,9 @@ const TargetingTooltip: React.FC<Props> = (props) => {
             Object.keys(data?.targeting)?.forEach((item: any) => {
                 switch (item) {
                     case 'geoLocation': // 地域
-                        newConten.geoLocation = data?.targeting[item]?.regions?.map((item: any) => geoLocationList[item]?.name)
+                        if (data?.targeting[item]?.regions && data?.targeting[item]?.regions?.length > 0) {
+                            newConten.geoLocation = data?.targeting[item]?.regions?.map((item: any) => geoLocationList[item]?.name)
+                        }
                         break
                     case 'age':
                         let newAge = data?.targeting[item][0]
@@ -173,7 +175,7 @@ const TargetingTooltip: React.FC<Props> = (props) => {
             排除已转化用户:<span>{ExcludedDimensionEnum[content?.excludedConvertedAudience?.excludedDimension]}{`(自定义转化行为:${OptimizationGoalEnum[content?.excludedConvertedAudience?.conversionBehaviorList[0]]})`}</span>
         </div>}
         {content?.unlimited && <div>
-            不限:<span>{content?.unlimited}</span>
+            不限:<span>{!content?.geoLocation && '地域,'}{content?.unlimited}</span>
         </div>}
     </div>
 }

+ 85 - 0
src/pages/launchSystemNew/launchManage/createAd/adcreativeCol.tsx

@@ -0,0 +1,85 @@
+import { useAjax } from "@/Hook/useAjax"
+import { PromotedObjectType, SiteSetEnum } from "@/services/launchAdq/enum"
+import { get_adcreative_template_list } from "@/services/launchAdq/global"
+import React, { useEffect, useState } from "react"
+import { outAdcreativeTemplateIdFun } from "../localAd/adenum"
+import { Image, Space, Spin } from "antd"
+
+/**
+ * 创意详情
+ */
+interface Props {
+    data: any,
+    onChange?: (value: string) => void
+}
+const AdcreativeCol: React.FC<Props> = (props) => {
+
+    /***************************/
+    const { data, onChange } = props
+    const { adcreativeName, promotedObjectType, siteSet, adcreativeTemplateId, adcreativeElements } = data
+    const [adcreative_template_list, set_adcreative_template_list] = useState<any[]>([])
+
+    const getAdcreativeTemplateList = useAjax((params) => get_adcreative_template_list(params))
+    /***************************/
+
+    /** 获取创意形式 */
+    useEffect(() => {
+        if (siteSet?.length > 0 && promotedObjectType && !(adcreative_template_list.length > 0)) {
+            getAdcreativeTemplateList.run({
+                siteSet,
+                promotedObjectType,
+                campaignType: 'CAMPAIGN_TYPE_NORMAL',
+            }).then(res => {
+                let newArr: any = []
+                // 过滤掉相同的和即将下线的
+                Object.values(res)?.forEach((arr: any) => {
+                    Array.isArray(arr) && arr?.forEach((item: any) => {
+                        if (newArr.length > 0) {
+                            if (outAdcreativeTemplateIdFun(item.adcreativeTemplateId) && newArr.every((i: { adcreativeTemplateId: any }) => i.adcreativeTemplateId !== item.adcreativeTemplateId)) {
+                                newArr.push(item)
+                            } else {
+                                // 找出通用创意
+                                newArr = newArr?.map((arr: { adcreativeTemplateId: any }) => {
+                                    if (arr.adcreativeTemplateId === item.adcreativeTemplateId) {
+                                        return { ...arr, isGeneral: true }
+                                    }
+                                    return arr
+                                })
+                            }
+                        } else {
+                            if (outAdcreativeTemplateIdFun(item.adcreativeTemplateId)) {
+                                newArr.push(item)
+                            }
+                        }
+                    })
+                })
+                set_adcreative_template_list(newArr)
+            })
+        }
+    }, [siteSet, promotedObjectType])
+
+    useEffect(() => {
+        if (adcreative_template_list?.length > 0 && adcreativeTemplateId) {
+            onChange && onChange(adcreative_template_list?.find((item: any) => item?.adcreativeTemplateId === adcreativeTemplateId)?.adcreativeTemplateAppellation || '')
+        }
+    }, [adcreative_template_list, adcreativeTemplateId])
+
+    return <Spin size="small" spinning={getAdcreativeTemplateList?.loading}>
+        <div>创意名称: <span>{adcreativeName}</span></div>
+        <div>推广目标: <span>{PromotedObjectType[promotedObjectType]}</span></div>
+        <div>广告版位: <span>{siteSet?.map((item: string) => SiteSetEnum[item]).toString()}</span></div>
+        <div>创意形式: <span>{adcreative_template_list?.find((item: any) => item?.adcreativeTemplateId === adcreativeTemplateId)?.adcreativeTemplateAppellation || ''}</span></div>
+        {adcreativeElements?.description && <div>创意文案: <span>{adcreativeElements?.description}</span></div>}
+        {adcreativeElements?.title && <div>文案: <span>{adcreativeElements?.title}</span></div>}
+        {adcreativeElements?.imageUrl && <div style={{ display: 'flex', alignItems: 'flex-start' }}>创意素材: <Image width={80} src={adcreativeElements?.imageUrl} style={{ borderRadius: 8, overflow: 'hidden', marginLeft: 5 }} /></div>}
+        {adcreativeElements?.imageUrlList && <div style={{ display: 'flex', alignItems: 'flex-start', flexWrap: 'wrap' }}><span style={{ marginRight: 4 }}>创意素材:</span> <Image.PreviewGroup>
+            <Space wrap>
+                {adcreativeElements?.imageUrlList?.map((url: string, index: number) => <Image width={50} src={url} style={{ borderRadius: 4 }} key={'TOP_SLIDER' + index} />)}
+            </Space>
+        </Image.PreviewGroup></div>}
+        {adcreativeElements?.shortVideoStruct?.shortVideo1Url && <div style={{ display: 'flex', alignItems: 'flex-start' }}><span style={{ marginRight: 4 }}>创意素材:</span> <video src={adcreativeElements?.shortVideoStruct?.shortVideo1Url} width={130} controls></video></div>}
+        {adcreativeElements?.videoUrl && <div style={{ display: 'flex', alignItems: 'flex-start' }}><span style={{ marginRight: 4 }}>创意素材:</span> <video src={adcreativeElements?.videoUrl} width={130} controls></video></div>}
+    </Spin>
+}
+
+export default React.memo(AdcreativeCol)

+ 69 - 20
src/pages/launchSystemNew/launchManage/createAd/index.tsx

@@ -1,6 +1,7 @@
 import Tables from "@/components/Tables"
 import { useAjax } from "@/Hook/useAjax"
-import { CreateAdProps } from "@/services/launchAdq/createAd"
+import { createAdBatchApi, CreateAdProps } from "@/services/launchAdq/createAd"
+import { getSysAdcreativeInfo } from "@/services/launchAdq/creative"
 import { BidModeEnum, BidStrategyEnum, OptimizationGoalEnum, PromotedObjectType, SiteSetEnum } from "@/services/launchAdq/enum"
 import { getTagsList } from "@/services/launchAdq/global"
 import { getSysAdgroupsInfo } from "@/services/launchAdq/localAd"
@@ -10,6 +11,7 @@ import { Button, Card, Col, Empty, Row, Select, Space, Spin, Tooltip, Image, mes
 import React, { useEffect, useState } from "react"
 import { useModel } from "umi"
 import AdModal from "../../components/adModal"
+import CreativeModal from "../../components/creativeModal"
 import DataSourceModal from "../../components/dataSourceModal"
 import GoodsModal from "../../components/goodsModal"
 import IdModal from "../../components/idModal"
@@ -18,6 +20,7 @@ import SelectCloud from "../../components/selectCloud"
 import TargetingModal from "../../components/targetingModal"
 import TargetingTooltip from "../../components/targetingTooltip"
 import { WxAutoButton } from "../../req"
+import AdcreativeCol from "./adcreativeCol"
 import style from './index.less'
 import Selector from "./selector"
 import SubmitModal from "./submitModal"
@@ -43,6 +46,7 @@ const CreateAd: React.FC = () => {
 
     const [adVisible, setAdVisible] = useState<boolean>(false) // 选择广告弹窗控制
     const [dxVisible, setDxVisible] = useState<boolean>(false) // 选择定向弹窗控制
+    const [creativeVisible, setCreativeVisible] = useState<boolean>(false) // 选择创意弹窗控制
     const [goodsVisible, setGoodsVisible] = useState<boolean>(false) // 选择商品弹窗控制
     const [sourceVisible, setSourceVisible] = useState<boolean>(false) // 选择数据源弹窗控制
     const [idVisible, setIdVisible] = useState<boolean>(false) // 选择转化ID弹窗控制
@@ -54,6 +58,7 @@ const CreateAd: React.FC = () => {
     const [tableSelect, setTableSelect] = useState<any[]>([])
     const [geoLocationList, setGeoLocationList] = useState<any>({}) // 所有地域列表
     const [modelList, setModelList] = useState<any>({})  // 所有品牌手机
+    const [adcreativeTemplateAppellation, setAdcreativeTemplateAppellation] = useState<string>('')  // 创意形式
     const { init, get } = useModel('useLaunchAdq.useBdMediaPup')
 
 
@@ -61,6 +66,8 @@ const CreateAd: React.FC = () => {
     const tagsList_MODEL = useAjax((params) => getTagsList(params))
     const getSysAdgroups = useAjax((params) => getSysAdgroupsInfo(params))
     const getsysTargeting = useAjax((params) => getsysTargetingInfo(params))
+    const getSysAdcreative = useAjax((params) => getSysAdcreativeInfo(params))
+    const createAdBatch = useAjax((params) => createAdBatchApi(params))
     /*************************/
 
     // 设置地域
@@ -95,6 +102,14 @@ const CreateAd: React.FC = () => {
             getSysAdgroups.run(queryForm?.sysAdgroupsId)
         }
     }, [queryForm?.sysAdgroupsId])
+
+    /** 获取创意详情 */
+    useEffect(() => {
+        if (queryForm?.sysAdcreativeId) {
+            getSysAdcreative.run(queryForm?.sysAdcreativeId)
+        }
+    }, [queryForm?.sysAdcreativeId])
+
     /** 获取定向详情 */
     useEffect(() => {
         if (queryForm?.sysTargetingId) {
@@ -152,16 +167,16 @@ const CreateAd: React.FC = () => {
             message.error('请选择定向')
             return
         }
-        // if (!queryForm.sysAdcreativeId) {
-        //     message.error('请设置创意的基本信息')
-        //     return
-        // }
+        if (!queryForm.sysAdcreativeId) {
+            message.error('请设置创意的基本信息')
+            return
+        }
         if (!queryForm.sysPageId) {
             message.error('请选择落地页')
             return
         }
         let data = accountCreateLogs.map((item: any, index) => {
-            return { ...item, id: index + 1, ...queryForm, sysAdGroupData: getSysAdgroups?.data, targetingData: getsysTargeting?.data, pageData: get?.data }
+            return { ...item, ...queryForm, sysAdGroupData: getSysAdgroups?.data, targetingData: getsysTargeting?.data, sysAdcreativeData: { ...getSysAdcreative?.data, adcreativeTemplateAppellation }, pageData: get?.data }
         })
         console.log('data--->', data)
         setTableData(data)
@@ -169,7 +184,28 @@ const CreateAd: React.FC = () => {
 
     const submit = (data: { adName: string, campaignName: string }) => {
         console.log(111111, tableSelect);
-        console.log(222222, data)
+        let params = { ...queryForm, ...data }
+        let accountLogs = tableSelect.map((item: any) => {
+            // userActionSetsList 数据源  productList 商品
+            let data: any = { adAccountId: item.id }
+            if (item?.userActionSetsList?.length > 0) {
+                data.userActionSets = item?.userActionSetsList?.map((item:any) => ({ id: item?.id, type: item?.type }))
+            }
+            if (item?.productList?.length) {
+                data.productId = item?.productList[0].productOuterId
+            }
+            return data
+        })
+        params.accountCreateLogs = accountLogs
+        console.log(222222, params)
+        createAdBatch.run(params).then(res => {
+
+        })
+    }
+
+    const clearData = () => {
+        setTableData([])
+        setTableSelect([])
     }
 
     return <Space direction="vertical" style={{ width: '100%' }}>
@@ -251,7 +287,7 @@ const CreateAd: React.FC = () => {
                                             {getsysTargeting?.data ? <>
                                                 <div>定向名称: <span>{getsysTargeting?.data?.targetingName}</span></div>
                                                 <div>定向描述: <span>{getsysTargeting?.data?.description}</span></div>
-                                                <TargetingTooltip data={getsysTargeting?.data} geoLocationList={geoLocationList} modelList={modelList}/>
+                                                <TargetingTooltip data={getsysTargeting?.data} geoLocationList={geoLocationList} modelList={modelList} />
                                             </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
                                         </div>
                                     </Spin>
@@ -327,13 +363,24 @@ const CreateAd: React.FC = () => {
                     <Col span={8} className={style.conRight}>
                         <Row className={style.conTitle}><Col span={24}>广告创意</Col></Row>
                         <Row className={style.items}>
+                            {/* 创意 */}
                             <Col span={12} className={style.conRightBorder}>
                                 <div className={style.top}>创意基本信息</div>
                                 <div className={style.center}>
-
+                                    <Spin spinning={getSysAdcreative.loading}>
+                                        <div className={style.centerContent}>
+                                            {(getSysAdcreative?.data && queryForm?.sysAdcreativeId) && <AdcreativeCol data={getSysAdcreative?.data} onChange={(e) => { setAdcreativeTemplateAppellation(e) }} />}
+                                        </div>
+                                    </Spin>
+                                </div>
+                                <div className={style.bottom}>{queryForm?.sysAdgroupsId ? <>
+                                    <Button type="link" onClick={() => { setCreativeVisible(true) }}>{queryForm?.sysAdcreativeId ? '修改' : '添加'}</Button>
+                                </> : <Tooltip title="请先设置广告">
+                                    <Button type="link"><span>添加</span></Button>
+                                </Tooltip>}
                                 </div>
-                                <div className={style.bottom}><span onClick={() => { }}>编辑</span></div>
                             </Col>
+                            {/* 落地页 */}
                             <Col span={12} >
                                 <div className={style.top}>
                                     落地页
@@ -352,8 +399,8 @@ const CreateAd: React.FC = () => {
                                                             case 'TOP_IMAGE':
                                                                 return <Image width={80} src={item.topImageSpec.imageUrl} style={{ borderRadius: 8, overflow: 'hidden' }} key={index} />
                                                             case 'TOP_SLIDER':
-                                                                return <Space wrap>
-                                                                    {item?.topSliderSpec?.imageUrlList?.map((url: string, index: number) => <Image width={70} src={url} style={{ borderRadius: 8 }} key={index} />)}
+                                                                return <Space wrap key={index}>
+                                                                    {item?.topSliderSpec?.imageUrlList?.map((url: string, index: number) => <Image width={70} src={url} style={{ borderRadius: 8 }} key={'TOP_SLIDER' + index} />)}
                                                                 </Space>
                                                             case 'TOP_VIDEO':
                                                                 return <video src={item.topVideoSpec.videoUrl} width={150} controls key={index}></video>
@@ -364,10 +411,10 @@ const CreateAd: React.FC = () => {
                                         </div>
                                     </Spin>
                                 </div>
-                                <div className={style.bottom}>{queryForm?.sysAdgroupsId ? <>
+                                <div className={style.bottom}>{queryForm?.sysAdcreativeId ? <>
                                     {queryForm?.sysPageId && <Button type="link" onClick={() => { setLookVisible(true) }}>查看</Button>}
                                     <Button type="link" onClick={() => { setSelectImgVisible(true) }}>{queryForm?.sysPageId ? '修改' : '选择落地页'}</Button>
-                                </> : <Tooltip title="请先设置广告基本信息和创意">
+                                </> : <Tooltip title="请先设置创意">
                                     <Button type="link"><span>选择落地页</span></Button>
                                 </Tooltip>}
                                 </div>
@@ -427,21 +474,23 @@ const CreateAd: React.FC = () => {
 
 
         {/* 选择广告 */}
-        {adVisible && <AdModal visible={adVisible} onClose={() => setAdVisible(false)} promotedObjectType={queryForm.promotedObjectType as string} onChange={(e) => { setQueryForm({ ...queryForm, sysAdgroupsId: e }); setAdVisible(false) }} sysAdgroupsId={queryForm?.sysAdgroupsId}/>}
+        {adVisible && <AdModal visible={adVisible} onClose={() => setAdVisible(false)} promotedObjectType={queryForm.promotedObjectType as string} onChange={(e) => { setQueryForm({ ...queryForm, sysAdgroupsId: e, sysAdcreativeId: undefined }); setAdVisible(false); clearData() }} sysAdgroupsId={queryForm?.sysAdgroupsId} />}
         {/* 选择定向 */}
-        {dxVisible && <TargetingModal visible={dxVisible} onClose={() => setDxVisible(false)} onChange={(e) => { setQueryForm({ ...queryForm, sysTargetingId: e }); setDxVisible(false) }} sysTargetingId={queryForm?.sysTargetingId}/>}
+        {dxVisible && <TargetingModal visible={dxVisible} onClose={() => setDxVisible(false)} onChange={(e) => { setQueryForm({ ...queryForm, sysTargetingId: e }); setDxVisible(false); clearData() }} sysTargetingId={queryForm?.sysTargetingId} />}
+        {/* 选择创意 */}
+        {creativeVisible && <CreativeModal visible={creativeVisible} onClose={() => setCreativeVisible(false)} onChange={(e) => { setQueryForm({ ...queryForm, sysAdcreativeId: e }); setCreativeVisible(false); clearData() }} sysAdcreativeId={queryForm?.sysAdcreativeId} promotedObjectType={queryForm.promotedObjectType as string} />}
         {/* 选择商品 */}
-        {goodsVisible && <GoodsModal visible={goodsVisible} data={accountCreateLogs} onClose={() => setGoodsVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setGoodsVisible(false) }} />}
+        {goodsVisible && <GoodsModal visible={goodsVisible} data={accountCreateLogs} onClose={() => setGoodsVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setGoodsVisible(false); clearData() }} />}
         {/* 选择数据源 */}
-        {sourceVisible && <DataSourceModal visible={sourceVisible} data={accountCreateLogs} onClose={() => setSourceVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false) }} />}
+        {sourceVisible && <DataSourceModal visible={sourceVisible} data={accountCreateLogs} onClose={() => setSourceVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false); clearData() }} />}
         {/* 选择转化ID */}
-        {idVisible && <IdModal visible={idVisible} data={accountCreateLogs} onClose={() => setIdVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false) }} />}
+        {idVisible && <IdModal visible={idVisible} data={accountCreateLogs} onClose={() => setIdVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false); clearData() }} />}
         {/* 选择素材 */}
         {selectImgVisible && <SelectCloud visible={selectImgVisible} onClose={() => setSelectImgVisible(false)} onChange={setPage} isBack={false} />}
         {/* 查看落地页 */}
         {lookVisible && <LookLanding visible={lookVisible} onClose={() => setLookVisible(false)} id={queryForm?.sysPageId as any} />}
         {/* 设置名称 */}
-        {subVisible && <SubmitModal visible={subVisible} onClose={() => setSubVisible(false)} onChange={submit} />}
+        {subVisible && <SubmitModal visible={subVisible} onClose={() => setSubVisible(false)} onChange={submit} ajax={createAdBatch}/>}
     </Space>
 }
 

+ 3 - 2
src/pages/launchSystemNew/launchManage/createAd/submitModal.tsx

@@ -11,11 +11,12 @@ import React, { useState } from "react"
     visible?: boolean,
     onClose?: () => void,
     onChange?: (data: any) => void
+    ajax?: any
 }
 const SubmitModal: React.FC<Props> = (props) => {
 
     /********************/
-    const { visible, onClose, onChange } = props
+    const { visible, onClose, onChange, ajax } = props
     const [form] = Form.useForm()
     /********************/
 
@@ -26,7 +27,7 @@ const SubmitModal: React.FC<Props> = (props) => {
         onChange && onChange(data)
     }
 
-    return <Modal title="设置名称" visible={visible} onOk={handleOk} onCancel={() => { onClose && onClose() }}>
+    return <Modal title="设置名称" visible={visible} confirmLoading={ajax?.loading} onOk={handleOk} onCancel={() => { onClose && onClose() }}>
         <Form
             name="basic"
             form={form}

+ 92 - 43
src/pages/launchSystemNew/launchManage/createAd/tableConfig.tsx

@@ -10,7 +10,7 @@ let columns = () => {
             dataIndex: 'adAccountId',
             key: 'adAccountId',
             align: 'center',
-            width: 100,
+            width: 85,
             fixed: 'left'
         },
         {
@@ -28,7 +28,7 @@ let columns = () => {
             dataIndex: 'promotedObjectType',
             key: 'promotedObjectType',
             align: 'center',
-            width: 120,
+            width: 100,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>{PromotedObjectType[a]}</span>
             }
@@ -48,9 +48,9 @@ let columns = () => {
             dataIndex: 'beginDate',
             key: 'beginDate',
             align: 'center',
-            width: 200,
+            width: 110,
             render: (a: any, b: any) => {
-                return <span>{b?.sysAdGroupData?.endDate ? b?.sysAdGroupData?.beginDate + '~' + b?.sysAdGroupData?.endDate : b?.sysAdGroupData?.beginDate + '~ 长期投放'}</span> 
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.endDate ? b?.sysAdGroupData?.beginDate + '~' + b?.sysAdGroupData?.endDate : b?.sysAdGroupData?.beginDate + '~ 长期投放'}</span> 
             }
         },
         {
@@ -58,7 +58,7 @@ let columns = () => {
             dataIndex: 'date_set1',
             key: 'date_set1',
             align: 'center',
-            width: 100,
+            width: 80,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>全天投放</span>
             }
@@ -68,7 +68,7 @@ let columns = () => {
             dataIndex: 'dailyBudget',
             key: 'dailyBudget',
             align: 'center',
-            width: 100,
+            width: 80,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.dailyBudget || '不限'}</span>
             }
@@ -78,7 +78,7 @@ let columns = () => {
             dataIndex: 'bidMode',
             key: 'bidMode',
             align: 'center',
-            width: 90,
+            width: 80,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>{BidModeEnum[b?.sysAdGroupData?.bidMode]}</span>
             }
@@ -88,7 +88,7 @@ let columns = () => {
             dataIndex: 'bidAmount',
             key: 'bidAmount',
             align: 'center',
-            width: 100,
+            width: 80,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.bidAmount}</span>
             }
@@ -98,25 +98,63 @@ let columns = () => {
             dataIndex: 'optimizationGoal',
             key: 'optimizationGoal',
             align: 'center',
-            width: 100,
+            width: 80,
             render: (a: any, b: any) => {
                 return <span style={{ fontSize: "12px" }}>{OptimizationGoalEnum[b?.sysAdGroupData?.optimizationGoal]}</span>
             }
         },
-        // {
-        //     title: '创意名称',
-        //     dataIndex: 'remark',
-        //     key: 'remark',
-        //     align: 'center',
-        //     width: 120,
-        //     render: (a: any, b: any) => {
-        //         return <div className={style.twoText}>
-        //             <Tooltip title={b?.idea?.name}>
-        //                 <span style={{ fontSize: "12px" }}>{b?.idea?.name}</span>
-        //             </Tooltip>
-        //         </div>
-        //     }
-        // },
+        {
+            title: '出价类型',
+            dataIndex: 'smartBidType',
+            key: 'smartBidType',
+            align: 'center',
+            width: 80,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.smartBidType === 'SMART_BID_TYPE_CUSTOM' ? '手动出价' : '自动出价'}</span>
+            }
+        },
+        {
+            title: '创意名称',
+            dataIndex: 'adcreativeName',
+            key: 'adcreativeName',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <div className={style.twoText}>
+                    <Tooltip title={b?.sysAdcreativeData?.adcreativeName}>
+                        <span style={{ fontSize: "12px" }}>{b?.sysAdcreativeData?.adcreativeName}</span>
+                    </Tooltip>
+                </div>
+            }
+        },
+        {
+            title: '创意形式',
+            dataIndex: 'adcreativeTemplateAppellation',
+            key: 'adcreativeTemplateAppellation',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdcreativeData?.adcreativeTemplateAppellation}</span>
+            }
+        },
+        {
+            title: '创意文案',
+            dataIndex: 'description',
+            key: 'description',
+            width: 200,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdcreativeData?.adcreativeElements?.description}</span>
+            }
+        },
+        {
+            title: '文案',
+            dataIndex: 'title',
+            key: 'title',
+            width: 150,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdcreativeData?.adcreativeElements?.title}</span>
+            }
+        },
         {
             title: '落地页名称',
             dataIndex: 'pageData',
@@ -136,7 +174,7 @@ let columns = () => {
             dataIndex: 'targetingData',
             key: 'targetingData',
             align: 'center',
-            width: 200,
+            width: 120,
             render: (a: any, b: any) => {
                 return <div className={style.twoText}>
                     {
@@ -147,25 +185,36 @@ let columns = () => {
                 </div>
             }
         },
-        // {
-        //     title: '商品',
-        //     dataIndex: 'human_info_goods',
-        //     key: 'human_info_goods',
-        //     align: 'center',
-        //     width: 200,
-        //     render: (a: any, b: any) => {
-        //         if (a) {
-        //             let data = a?.data
-        //             if (data && data?.length > 0) {
-        //                 return <span style={{ fontSize: "12px" }}>{data[0]?.productName + '-' + data[0]?.author}</span>
-        //             }
-        //             return '--'
-        //         } else {
-        //             return '--'
-        //         }
-
-        //     }
-        // }
+        {
+            title: '商品',
+            dataIndex: 'productList',
+            key: 'productList',
+            width: 200,
+            render: (a: any, b: any) => {
+                if (a && a?.length > 0) {
+                    let data = a[0]
+                    if (data) {
+                        return <span style={{ fontSize: "12px" }}>{data?.productName + '-' + data?.firstCatalogName + '-' + data?.secondCatalogName}</span>
+                    }
+                    return '--'
+                } else {
+                    return '--'
+                }
+            }
+        },
+        {
+            title: '数据源',
+            dataIndex: 'userActionSetsList',
+            key: 'userActionSetsList',
+            width: 350,
+            render: (a: any, b: any) => {
+                if (a && a?.length > 0) {
+                    return <span style={{ fontSize: "12px" }}>{a?.map((item: any) => item?.name + '>' + item?.type)?.toString() || '--'}</span>
+                } else {
+                    return '--'
+                }
+            }
+        }
     ]
 }
 

+ 6 - 3
src/services/launchAdq/createAd.ts

@@ -20,14 +20,17 @@ import { api } from '../api';
     sysPageId: number, // 落地页Id
     accountCreateLogs: {
         adAccountId: number, // 媒体账户ID
-        userActionSets?: number,  // 数据源
+        userActionSets?: {
+            id: number,
+            type: string
+        }[],  // 数据源
         conversionId?: number, // 广告组 转化Id
         productId?: number,
         enterpriseWx?: any[]  // 企业微信客服组
     }[]
 }
-export async function getSysProductCatalogApi(data: CreateAdProps) {
-    return request(api + `/adq/sysProductCatalog/list`, {
+export async function createAdBatchApi(data: CreateAdProps) {
+    return request(api + `/adq//adCreateTask/createAdBatch`, {
         method: 'POST',
         data
     })