fix

src/Hook/useAjax.tsx

@@ -28,7 +28,7 @@ interface Options {
  * @param  cacheKey?: string,//请求唯一标识。如果设置了 cacheKey启用缓存机制
  * @param  onSuccess?: (data: any, params: any[]) => void,//service resolve 时触发，参数为 data 和 params
  * @param  onError?: (error: Error, params: any[]) => void,//service 报错时触发，参数为 error 和 params。
- * @param  formatResult?: boolean,//格式化请求结果
+ * @param  formatResult?: boolean,// 开启返回原数据，不开启默认返回res.data
  * @param  initialData?: any,//默认的 data
  * @param  msgNmae?: string,//操作完成提示文字
  * 

src/components/FileBoxAD/index.tsx

@@ -101,7 +101,7 @@ function FlieBox(props: Props) {
                 (isAll !== false) && <li onClick={() => { set({ fileVisible: true }) }}>新建文件夹</li> //: <li>此处无法新建操作</li>
             }
             {
-                mediaType === 'PAGE' ? <li onClick={() => { setPage && setPage(0) }}>新建素材</li> : <li onClick={() => { set({ imgVisrible: true }) }}>新建素材</li>
+                mediaType === 'PAGE' ? isAll ? <li onClick={() => { setPage && setPage(0) }}>新建素材</li> : <li>此处无法新建操作</li> : <li onClick={() => { set({ imgVisrible: true }) }}>新建素材</li>
             }
             {
                 isAll && <li onClick={dels} style={{ color: 'red' }}>删除选中文件</li>

src/pages/launchSystemNew/components/addLandingPage/index.tsx

@@ -2232,7 +2232,7 @@ function AddLandingPage(props: Props) {
                         <div className={style.assembly}>
                             <div {...getDragPropsCon(`GH`)}> <FollowAcc /> <span className="my">关注公众号</span> </div>
                             {/* <div {...getDragPropsCon(`JumpLink`)}> <JumpLink /> <span className="my">跳转链接</span> </div> */}
-                            <div {...getDragPropsCon(`ENTERPRISE_WX`)}> <WxAutoSvg /> <span className="my">添加商家微信</span> </div>
+                            {/* <div {...getDragPropsCon(`ENTERPRISE_WX`)}> <WxAutoSvg /> <span className="my">添加商家微信</span> </div> */}
                         </div>
                         {/* <div className={style.title}>营销组件</div>
                     <div className={style.assembly}>

src/pages/launchSystemNew/components/setWxCustomerService/index.tsx

@@ -0,0 +1,42 @@
+import { Button, Modal, Space } from "antd"
+import React from "react"
+import style from '../goodsModal/index.less'
+
+/**
+ * 设置商家微信客服
+ * @returns 
+ */
+interface Props {
+    visible?: boolean,
+    onClose?: () => void,
+    onChange?: (data: any) => void,
+    data: any
+}
+const SetWxCustomerService: React.FC<Props> = (props) => {
+
+    /****************************/
+    const { visible, onClose, onChange } = props
+    /****************************/
+
+    const handleOk = () => {
+
+    }
+
+    return <Modal
+        title={<Space>
+            <span>商品库</span>
+            <Button size="small">同步商品库</Button>
+        </Space>}
+        visible={visible}
+        onCancel={() => { onClose && onClose() }}
+        onOk={handleOk}
+        width={1100}
+        className={style.SelectPackage}
+        bodyStyle={{ padding: '0 10px 0 10px' }}
+    >
+        
+    </Modal>
+}
+
+
+export default React.memo(SetWxCustomerService)

src/pages/launchSystemNew/launchManage/createAd/index.tsx

@@ -1,27 +1,32 @@
+import Tables from "@/components/Tables"
 import { useAjax } from "@/Hook/useAjax"
 import { CreateAdProps } from "@/services/launchAdq/createAd"
 import { BidModeEnum, BidStrategyEnum, OptimizationGoalEnum, PromotedObjectType, SiteSetEnum } from "@/services/launchAdq/enum"
 import { getSysAdgroupsInfo } from "@/services/launchAdq/localAd"
 import { getsysTargetingInfo } from "@/services/launchAdq/targeting"
-import { CloseOutlined } from "@ant-design/icons"
-import { Button, Card, Col, Empty, Row, Select, Space, Spin, Tooltip } from "antd"
+import { CloseOutlined, SearchOutlined } from "@ant-design/icons"
+import { Button, Card, Col, Empty, Row, Select, Space, Spin, Tooltip, Image, message } from "antd"
 import React, { useEffect, useState } from "react"
 import { useModel } from "umi"
 import AdModal from "../../components/adModal"
 import DataSourceModal from "../../components/dataSourceModal"
 import GoodsModal from "../../components/goodsModal"
 import IdModal from "../../components/idModal"
+import LookLanding from "../../components/lookLanding"
 import SelectCloud from "../../components/selectCloud"
 import TargetingModal from "../../components/targetingModal"
+import { WxAutoButton } from "../../req"
 import style from './index.less'
 import Selector from "./selector"
+import SubmitModal from "./submitModal"
+import columns from "./tableConfig"
 
 const CreateAd: React.FC = () => {
 
     /*************************/
     const { getAdAccount } = useModel('useLaunchAdq.useAdAuthorize')
     const [queryForm, setQueryForm] = useState<Partial<CreateAdProps>>({
-        campaignName: '',
+        campaignName: '',  // 计划名称
         campaignType: 'CAMPAIGN_TYPE_NORMAL', // 计划类型 CAMPAIGN_TYPE_NORMAL CAMPAIGN_TYPE_SEARCH 
         promotedObjectType: 'PROMOTED_OBJECT_TYPE_WECHAT_OFFICIAL_ACCOUNT', // 推广目标类型
         speedMode: 'SPEED_MODE_STANDARD', // 投放速度模式
@@ -40,9 +45,14 @@ const CreateAd: React.FC = () => {
     const [sourceVisible, setSourceVisible] = useState<boolean>(false) // 选择数据源弹窗控制
     const [idVisible, setIdVisible] = useState<boolean>(false) // 选择转化ID弹窗控制
     const [selectImgVisible, setSelectImgVisible] = useState<boolean>(false) // 选择转化ID弹窗控制
+    const [lookVisible, setLookVisible] = useState<boolean>(false) // 选择转化ID弹窗控制
+    const [subVisible, setSubVisible] = useState<boolean>(false) // 选择设置名称弹窗控制
     const getSysAdgroups = useAjax((params) => getSysAdgroupsInfo(params))
     const getsysTargeting = useAjax((params) => getsysTargetingInfo(params))
-    const { init } = useModel('useLaunchAdq.useBdMediaPup')
+    const [wxButtonList, setWxButtonList] = useState<WxAutoButton[]>([])
+    const [tableData, setTableData] = useState<any[]>([])   // 预览表格
+    const [tableSelect, setTableSelect] = useState<any[]>([])
+    const { init, get } = useModel('useLaunchAdq.useBdMediaPup')
     /*************************/
 
     // 获取账户列表
@@ -64,6 +74,17 @@ const CreateAd: React.FC = () => {
         }
     }, [queryForm?.sysTargetingId])
 
+    /** 获取落地页详情 */
+    useEffect(() => {
+        if (queryForm?.sysPageId) {
+            get.run({ mediaType: 'PAGE', sysMediaId: queryForm?.sysPageId }).then(res => {
+                let data = res
+                let pageElementsSpecList = data?.pageSpecsList[0]?.pageElementsSpecList
+                setWxButtonList(() => (pageElementsSpecList as any[])?.filter((item: { elementType: string }) => item?.elementType === 'ENTERPRISE_WX'))
+            })
+        }
+    }, [queryForm?.sysPageId])
+
     /** 删除商品内容 */
     const goodsDel = (index: number) => {
         let newArr = JSON.parse(JSON.stringify(accountCreateLogs))
@@ -81,191 +102,300 @@ const CreateAd: React.FC = () => {
 
     /** 设置落地页 */
     const setPage = (e: any) => {
-        console.log(22222, e)
+        setQueryForm({ ...queryForm, sysPageId: e[0]?.id || undefined })
+        setSelectImgVisible(false)
     }
 
-    return <Card title={<div className={style.cardTitle}>配置区</div>} className={style.createAd} hoverable>
-        <Space>
-            <Selector label="媒体账户">
-                <Select
-                    mode="multiple"
-                    style={{ minWidth: 200 }}
-                    placeholder="请选择媒体账户"
-                    maxTagCount={1}
-                    allowClear
-                    bordered={false}
-                    filterOption={(input: any, option: any) =>
-                        (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
-                    }
-                    onChange={(e, option) => {
-                        setAccountCreateLogs(option?.map((item: any) => ({ adAccountId: item?.children, id: item?.value })))
-                    }}
-                >
-                    {getAdAccount?.data?.data?.map((item: any) => <Select.Option value={item.id} key={item.id}>{item.accountId}</Select.Option>)}
-                    {/* <Select.OptGroup label="Engineer">
-                        <Select.Option value="20632113">20632113</Select.Option>
-                    </Select.OptGroup> */}
-                </Select>
-            </Selector>
+    /** 预览 */
+    const preview = () => {
+        if (accountCreateLogs?.length === 0) {
+            message.error('请选择媒体账户')
+            return
+        }
+        if (!queryForm.promotedObjectType) {
+            message.error('请选择推广目标')
+            return
+        }
+        if (!queryForm.sysAdgroupsId) {
+            message.error('请先设置广告基本信息')
+            return
+        }
+        if (!queryForm.sysTargetingId) {
+            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 }
+        })
+        console.log('data--->', data)
+        setTableData(data)
+    }
+
+    const submit = (data: { adName: string, campaignName: string }) => {
+        console.log(111111, tableSelect);
+        console.log(222222, data)
+    }
 
-            <Selector label="推广目标">
-                <Select style={{ width: 200 }} value={queryForm?.promotedObjectType} placeholder="请选择推广目标" bordered={false} showSearch filterOption={(input: any, option: any) =>
-                    (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
-                } onChange={(e) => { setQueryForm({ ...queryForm, promotedObjectType: e }) }}>
-                    {Object.keys(PromotedObjectType).map(key => {
-                        return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
-                    })}
-                </Select>
-            </Selector>
-        </Space>
+    return <Space direction="vertical" style={{ width: '100%' }}>
+        <Card title={<div className={style.cardTitle}>配置区</div>} className={style.createAd} hoverable>
+            <Space>
+                <Selector label="媒体账户">
+                    <Select
+                        mode="multiple"
+                        style={{ minWidth: 200 }}
+                        placeholder="请选择媒体账户"
+                        maxTagCount={1}
+                        allowClear
+                        bordered={false}
+                        filterOption={(input: any, option: any) =>
+                            (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
+                        }
+                        onChange={(e, option) => {
+                            setAccountCreateLogs(option?.map((item: any) => ({ adAccountId: item?.children, id: item?.value })))
+                        }}
+                    >
+                        {getAdAccount?.data?.data?.map((item: any) => <Select.Option value={item.id} key={item.id}>{item.accountId}</Select.Option>)}
+                        {/* <Select.OptGroup label="Engineer">
+                            <Select.Option value="20632113">20632113</Select.Option>
+                        </Select.OptGroup> */}
+                    </Select>
+                </Selector>
+
+                <Selector label="推广目标">
+                    <Select style={{ width: 200 }} value={queryForm?.promotedObjectType} placeholder="请选择推广目标" bordered={false} showSearch filterOption={(input: any, option: any) =>
+                        (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
+                    } onChange={(e) => { setQueryForm({ ...queryForm, promotedObjectType: e }) }}>
+                        {Object.keys(PromotedObjectType).map(key => {
+                            return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
+                        })}
+                    </Select>
+                </Selector>
+            </Space>
 
-        <div className={style.cardBody}>
-            <Row className={style.content}>
-                <Col span={16} className={style.conLeft}>
-                    <Row className={`${style.conTitle} ${style.conRightBorder}`}><Col span={24}>广告</Col></Row>
-                    <Row className={style.items}>
-                        {/* =============广告基本信息=========== */}
-                        <Col className={style.conRightBorder}>
-                            <div className={style.top}>广告基本信息</div>
-                            <div className={style.center}>
-                                <Spin spinning={getSysAdgroups.loading}>
+            <div className={style.cardBody}>
+                <Row className={style.content}>
+                    <Col span={16} className={style.conLeft}>
+                        <Row className={`${style.conTitle} ${style.conRightBorder}`}><Col span={24}>广告</Col></Row>
+                        <Row className={style.items}>
+                            {/* =============广告基本信息=========== */}
+                            <Col className={style.conRightBorder}>
+                                <div className={style.top}>广告基本信息</div>
+                                <div className={style.center}>
+                                    <Spin spinning={getSysAdgroups.loading}>
+                                        <div className={style.centerContent}>
+                                            {getSysAdgroups?.data ? <>
+                                                <div>广告名称: {getSysAdgroups?.data?.adgroupName}</div>
+                                                <div>推广目标: {PromotedObjectType[getSysAdgroups?.data?.promotedObjectType]}</div>
+                                                <div>广告版位: {getSysAdgroups?.data?.siteSet?.map((item: string) => SiteSetEnum[item]).toString()}</div>
+                                                <div>投放日期: {getSysAdgroups?.data?.endDate ? getSysAdgroups?.data?.beginDate + '~' + getSysAdgroups?.data?.endDate : getSysAdgroups?.data?.beginDate + '~' + '长期投放'}</div>
+                                                <div>出价方式: {BidModeEnum[getSysAdgroups?.data?.bidMode]}</div>
+                                                <div>优化目标: {OptimizationGoalEnum[getSysAdgroups?.data?.optimizationGoal]}</div>
+                                                <div>出价类型: {getSysAdgroups?.data?.smartBidType === 'SMART_BID_TYPE_CUSTOM' ? '手动出价' : '自动出价'}</div>
+                                                <div>出价策略: {BidStrategyEnum[getSysAdgroups?.data?.bidStrategy]}</div>
+                                                <div>广告出价: {getSysAdgroups?.data?.bidAmount}</div>
+                                                <div>广告日预算: {getSysAdgroups?.data?.dailyBudget || '不限'}</div>
+                                            </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
+                                        </div>
+                                    </Spin>
+                                </div>
+                                <div className={style.bottom}>
+                                    {queryForm?.promotedObjectType ? <span onClick={() => { setAdVisible(true) }}>{getSysAdgroups?.data ? '修改' : '添加'}</span> : <Tooltip title="请先选择推广目标">
+                                        <span>添加</span>
+                                    </Tooltip>}
+                                </div>
+                            </Col>
+                            {/* =============定向包=========== */}
+                            <Col className={style.conRightBorder}>
+                                <div className={style.top}>
+                                    定向{/* <span>已选：{1}</span> */}
+                                </div>
+                                <div className={style.center}>
+                                    <Spin spinning={getsysTargeting.loading}>
+                                        <div className={style.centerContent}>
+                                            {getsysTargeting?.data ? <>
+                                                <div>定向名称: {getsysTargeting?.data?.targetingName}</div>
+                                                <div>定向描述: {getsysTargeting?.data?.description}</div>
+                                            </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
+                                        </div>
+                                    </Spin>
+                                </div>
+                                <div className={style.bottom}><span onClick={() => { setDxVisible(true) }}>{getsysTargeting?.data ? '修改' : '添加'}</span></div>
+                            </Col>
+                            {/* =============商品=========== */}
+                            <Col className={style.conRightBorder}>
+                                <div className={style.top}>
+                                    商品{/* <span>已选：{1}</span> */}
+                                </div>
+                                <div className={style.center}>
                                     <div className={style.centerContent}>
-                                        {getSysAdgroups?.data ? <>
-                                            <div>广告名称: {getSysAdgroups?.data?.adgroupName}</div>
-                                            <div>推广目标: {PromotedObjectType[getSysAdgroups?.data?.promotedObjectType]}</div>
-                                            <div>广告版位: {getSysAdgroups?.data?.siteSet?.map((item: string) => SiteSetEnum[item]).toString()}</div>
-                                            <div>投放日期: {getSysAdgroups?.data?.endDate ? getSysAdgroups?.data?.beginDate + '~' + getSysAdgroups?.data?.endDate : getSysAdgroups?.data?.beginDate + '~' + '长期投放'}</div>
-                                            <div>出价方式: {BidModeEnum[getSysAdgroups?.data?.bidMode]}</div>
-                                            <div>优化目标: {OptimizationGoalEnum[getSysAdgroups?.data?.optimizationGoal]}</div>
-                                            <div>出价类型: {getSysAdgroups?.data?.smartBidType === 'SMART_BID_TYPE_CUSTOM' ? '手动出价' : '自动出价'}</div>
-                                            <div>出价策略: {BidStrategyEnum[getSysAdgroups?.data?.bidStrategy]}</div>
-                                            <div>广告出价: {getSysAdgroups?.data?.bidAmount}</div>
-                                            <div>广告日预算: {getSysAdgroups?.data?.dailyBudget || '不限'}</div>
-                                        </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
+                                        {accountCreateLogs?.map((item: any, index: number) => {
+                                            if (item?.productList) {
+                                                return <div className={style.acc} key={index}>
+                                                    <div className={style.accName}>{item.adAccountId}</div>
+                                                    {
+                                                        item?.productList?.map((pack: { productName: string, author: string, id: number }, index: number) => {
+                                                            return <div className={style.accCon} key={pack.id}>{pack.productName}<CloseOutlined className={style.close} onClick={() => {
+                                                                goodsDel(index)
+                                                            }} /></div>
+                                                        })
+                                                    }
+                                                </div>
+                                            } else {
+                                                return null
+                                            }
+                                        })}
                                     </div>
-                                </Spin>
-                            </div>
-                            <div className={style.bottom}>
-                                {queryForm?.promotedObjectType ? <span onClick={() => { setAdVisible(true) }}>{getSysAdgroups?.data ? '修改' : '添加'}</span> : <Tooltip title="请先选择推广目标">
-                                    <span>添加</span>
-                                </Tooltip>}
-                            </div>
-                        </Col>
-                        {/* =============定向包=========== */}
-                        <Col className={style.conRightBorder}>
-                            <div className={style.top}>
-                                定向{/* <span>已选：{1}</span> */}
-                            </div>
-                            <div className={style.center}>
-                                <Spin spinning={getsysTargeting.loading}>
+                                </div>
+                                <div className={style.bottom}>
+                                    {accountCreateLogs?.length > 0 ? <span onClick={() => { setGoodsVisible(true) }}>编辑</span> : <Tooltip title="请先选择媒体账户">
+                                        <span>编辑</span>
+                                    </Tooltip>}
+                                </div>
+                            </Col>
+                            {/* 数据源 */}
+                            <Col className={style.conRightBorder}>
+                                <div className={style.top}>
+                                    数据源 {/* <span>已选：{1}</span> */}
+                                </div>
+                                <div className={style.center}>
+                                    {/* userActionSetsList */}
                                     <div className={style.centerContent}>
-                                        {getsysTargeting?.data ? <>
-                                            <div>定向名称: {getsysTargeting?.data?.targetingName}</div>
-                                            <div>定向描述: {getsysTargeting?.data?.description}</div>
-                                        </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
+                                        {accountCreateLogs?.map((item: any, index: number) => {
+                                            if (item?.userActionSetsList && item?.userActionSetsList?.length > 0) {
+                                                return <div className={style.acc} key={index}>
+                                                    <div className={style.accName}>{item.adAccountId}</div>
+                                                    {
+                                                        item?.userActionSetsList?.map((pack: { name: string, type: string, id: number }, index1: number) => {
+                                                            return <div className={style.accCon} key={pack.id}> <span className={style.title}>{pack.name}{' > '}{pack.type}</span> <CloseOutlined className={style.close} onClick={() => {
+                                                                sourceDel(index, index1)
+                                                            }} /></div>
+                                                        })
+                                                    }
+                                                </div>
+                                            } else {
+                                                return null
+                                            }
+                                        })}
                                     </div>
-                                </Spin>
-                            </div>
-                            <div className={style.bottom}><span onClick={() => { setDxVisible(true) }}>{getsysTargeting?.data ? '修改' : '添加'}</span></div>
-                        </Col>
-                        {/* =============商品=========== */}
-                        <Col className={style.conRightBorder}>
-                            <div className={style.top}>
-                                商品{/* <span>已选：{1}</span> */}
-                            </div>
-                            <div className={style.center}>
-                                <div className={style.centerContent}>
-                                    {accountCreateLogs?.map((item: any, index: number) => {
-                                        if (item?.productList) {
-                                            return <div className={style.acc} key={index}>
-                                                <div className={style.accName}>{item.adAccountId}</div>
-                                                {
-                                                    item?.productList?.map((pack: { productName: string, author: string, id: number }, index: number) => {
-                                                        return <div className={style.accCon} key={pack.id}>{pack.productName}<CloseOutlined className={style.close} onClick={() => {
-                                                            goodsDel(index)
-                                                        }} /></div>
-                                                    })
-                                                }
-                                            </div>
-                                        } else {
-                                            return null
-                                        }
-                                    })}
                                 </div>
-                            </div>
-                            <div className={style.bottom}>
-                                {accountCreateLogs?.length > 0 ? <span onClick={() => { setGoodsVisible(true) }}>编辑</span> : <Tooltip title="请先选择媒体账户">
-                                    <span>编辑</span>
-                                </Tooltip>}
-                            </div>
-                        </Col>
-                        {/* 数据源 */}
-                        <Col className={style.conRightBorder}>
-                            <div className={style.top}>
-                                数据源 {/* <span>已选：{1}</span> */}
-                            </div>
-                            <div className={style.center}>
-                                {/* userActionSetsList */}
-                                <div className={style.centerContent}>
-                                    {accountCreateLogs?.map((item: any, index: number) => {
-                                        if (item?.userActionSetsList && item?.userActionSetsList?.length > 0) {
-                                            return <div className={style.acc} key={index}>
-                                                <div className={style.accName}>{item.adAccountId}</div>
-                                                {
-                                                    item?.userActionSetsList?.map((pack: { name: string, type: string, id: number }, index1: number) => {
-                                                        return <div className={style.accCon} key={pack.id}> <span className={style.title}>{pack.name}{' > '}{pack.type}</span> <CloseOutlined className={style.close} onClick={() => {
-                                                            sourceDel(index, index1)
-                                                        }} /></div>
-                                                    })
-                                                }
-                                            </div>
-                                        } else {
-                                            return null
-                                        }
-                                    })}
+                                <div className={style.bottom}>
+                                    {accountCreateLogs?.length > 0 ? <span onClick={() => { setSourceVisible(true) }}>编辑</span> : <Tooltip title="请先选择媒体账户">
+                                        <span>编辑</span>
+                                    </Tooltip>}
                                 </div>
-                            </div>
-                            <div className={style.bottom}>
-                                {accountCreateLogs?.length > 0 ? <span onClick={() => { setSourceVisible(true) }}>编辑</span> : <Tooltip title="请先选择媒体账户">
-                                    <span>编辑</span>
-                                </Tooltip>}
-                            </div>
-                        </Col>
-                    </Row>
-                </Col>
-                {/* =============广告创意=========== */}
-                <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}>
+                            </Col>
+                        </Row>
+                    </Col>
+                    {/* =============广告创意=========== */}
+                    <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}>
 
-                            </div>
-                            <div className={style.bottom}><span onClick={() => { }}>编辑</span></div>
-                        </Col>
-                        <Col span={12} >
-                            <div className={style.top}>落地页</div>
-                            <div className={style.center}>
-                                <div className={style.centerContent}>
-                                    <div>落地页：{queryForm?.sysAdgroupsId ? <Button type="link" onClick={() => { setSelectImgVisible(true) }}>选择落地页</Button> : <Tooltip title="请先设置广告基本信息">
-                                        <Button type="link">选择落地页</Button>
-                                    </Tooltip>}
-                                    </div>
                                 </div>
-                            </div>
-                            {/* <div className={style.bottom}><span>添加</span></div> */}
-                        </Col>
-                    </Row>
-                </Col>
-            </Row>
-            {/* =============广告底部按钮=========== */}
-            {/* <Space className={style.bts}>
-                <Button type='primary' onClick={severBd}>暂存到本地</Button>
-                <Button type='primary' onClick={preview}><SearchOutlined /> 批量预览广告</Button>
-                <Button onClick={delBdPlan}>清空本地配置</Button>
-            </Space> */}
-        </div>
+                                <div className={style.bottom}><span onClick={() => { }}>编辑</span></div>
+                            </Col>
+                            <Col span={12} >
+                                <div className={style.top}>
+                                    落地页
+                                    {wxButtonList?.length > 0 && <Button type="link" size="small">配置客服</Button>}
+                                </div>
+                                <div className={style.center}>
+                                    <Spin spinning={get.loading}>
+                                        <div className={style.centerContent}>
+                                            {queryForm?.sysPageId ? <>
+                                                <div>落地页名称：{get?.data?.pageName || ''}</div>
+                                                <div>分享名称：{get?.data?.shareContentSpec?.shareTitle || ''}</div>
+                                                <div>分享描述：{get?.data?.shareContentSpec?.shareDescription || ''}</div>
+                                                <div>原生推广页顶部素材预览：
+                                                    <div>{get?.data?.pageSpecsList[0]?.pageElementsSpecList?.filter((item: any, index: number) => index === 0)?.map((item: { elementType: 'TOP_IMAGE' | 'TOP_VIDEO' | 'TOP_SLIDER', topImageSpec: any, topSliderSpec: any, topVideoSpec: any }, index: number) => {
+                                                        switch (item?.elementType) {
+                                                            case 'TOP_IMAGE':
+                                                                return <Image width={80} src={item.topImageSpec.imageUrl} style={{ borderRadius: 8, overflow: 'hidden' }} key={index} />
+                                                            case 'TOP_SLIDER':
+                                                                return <Space>
+                                                                    {item?.topSliderSpec?.imageUrlList?.map((url: string, index: number) => <Image width={80} src={url} style={{ borderRadius: 8 }} key={index} />)}
+                                                                </Space>
+                                                            case 'TOP_VIDEO':
+                                                                return <video src={item.topVideoSpec.videoUrl} width={150} controls key={index}></video>
+                                                        }
+                                                    })}</div>
+                                                </div>
+                                            </> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
+                                        </div>
+                                    </Spin>
+                                </div>
+                                <div className={style.bottom}>{queryForm?.sysAdgroupsId ? <>
+                                    {queryForm?.sysPageId && <Button type="link" onClick={() => { setLookVisible(true) }}>查看</Button>}
+                                    <Button type="link" onClick={() => { setSelectImgVisible(true) }}>{queryForm?.sysPageId ? '修改' : '选择落地页'}</Button>
+                                </> : <Tooltip title="请先设置广告基本信息和创意">
+                                    <Button type="link"><span>选择落地页</span></Button>
+                                </Tooltip>}
+                                </div>
+                            </Col>
+                        </Row>
+                    </Col>
+                </Row>
+                {/* =============广告底部按钮=========== */}
+                <Space className={style.bts}>
+                    {/* <Button type='primary' onClick={severBd}>暂存到本地</Button> */}
+                    <Button type='primary' onClick={preview}><SearchOutlined /> 批量预览广告</Button>
+                    {/* <Button onClick={delBdPlan}>清空本地配置</Button> */}
+                </Space>
+            </div>
+        </Card>
+
+        <Card
+            className={style.createAd}
+            hoverable
+            extra={tableData?.length > 0 ? <Space>
+                <span>推广计划总数：{accountCreateLogs?.length}</span>
+                    <span>广告总数：{accountCreateLogs?.length}</span>
+                    {tableSelect?.length > 0 && <span> 已选：<span style={{ color: '#1890FF' }}>{tableSelect?.length}</span> 条</span>}
+                    {
+                        <Button type='primary' onClick={() => {
+                            if (tableSelect.length === 0) {
+                                message.error('请选择要提交的计划！')
+                                return
+                            };
+                            setSubVisible(true)
+                        }}>批量提交审核</Button>
+                    }
+            </Space> : false
+            }
+        >
+            {tableData?.length > 0 ? <div className={style.cardBody}>
+                <div className={style.content} style={{ marginTop: 20 }}>
+                    <Tables
+                        columns={columns()}
+                        dataSource={tableData}
+                        total={0}
+                        size="small"
+                        bordered
+                        scroll={{ x: 1800 }}
+                        rowSelection={{
+                            selectedRowKeys: tableSelect?.map((item: any) => item?.id.toString()),
+                            onChange: (selectedRowKeys: React.Key[], selectedRows: any) => {
+                                setTableSelect(selectedRows)
+                            }
+                        }}
+                    />
+                </div>
+            </div> : <div style={{ minHeight: 400, display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+                <Empty description="请先完成模块配置后，再预览广告计划" />
+            </div>}
+        </Card>
+
 
         {/* 选择广告 */}
         {adVisible && <AdModal visible={adVisible} onClose={() => setAdVisible(false)} promotedObjectType={queryForm.promotedObjectType as string} onChange={(e) => { setQueryForm({ ...queryForm, sysAdgroupsId: e }); setAdVisible(false) }} />}
@@ -279,7 +409,11 @@ const CreateAd: React.FC = () => {
         {idVisible && <IdModal visible={idVisible} data={accountCreateLogs} onClose={() => setIdVisible(false)} onChange={(e) => { setAccountCreateLogs(e); setSourceVisible(false) }} />}
         {/* 选择素材 */}
         {selectImgVisible && <SelectCloud visible={selectImgVisible} onClose={() => setSelectImgVisible(false)} onChange={setPage} isBack={false} />}
-    </Card>
+        {/* 查看落地页 */}
+        {lookVisible && <LookLanding visible={lookVisible} onClose={() => setLookVisible(false)} id={queryForm?.sysPageId as any} />}
+        {/* 设置名称 */}
+        {subVisible && <SubmitModal visible={subVisible} onClose={() => setSubVisible(false)} onChange={submit}/>}
+    </Space>
 }
 
 

src/pages/launchSystemNew/launchManage/createAd/submitModal.tsx

@@ -0,0 +1,47 @@
+import { Form, Input, message, Modal, Space } from "antd"
+import React, { useState } from "react"
+
+
+
+/**
+ * 设置名称
+ * @returns 
+ */
+ interface Props {
+    visible?: boolean,
+    onClose?: () => void,
+    onChange?: (data: any) => void
+}
+const SubmitModal: React.FC<Props> = (props) => {
+
+    /********************/
+    const { visible, onClose, onChange } = props
+    const [form] = Form.useForm()
+    /********************/
+
+
+    const handleOk = async () => {
+        form.submit()
+        let data = await form.validateFields()
+        onChange && onChange(data)
+    }
+
+    return <Modal title="设置名称" visible={visible} onOk={handleOk} onCancel={() => { onClose && onClose() }}>
+        <Form
+            name="basic"
+            form={form}
+            labelCol={{ span: 4 }}
+            wrapperCol={{ span: 20 }}
+            autoComplete="off"
+        >
+            <Form.Item label="广告名称" name="adName">
+                <Input placeholder="请输入广告名称" />
+            </Form.Item>
+            <Form.Item label="计划名称" name="campaignName">
+                <Input placeholder="请输入计划名称" />
+            </Form.Item>
+        </Form>
+    </Modal>
+}
+
+export default React.memo(SubmitModal)

src/pages/launchSystemNew/launchManage/createAd/tableConfig.tsx

@@ -0,0 +1,172 @@
+import { Tooltip } from "antd"
+import React from "react"
+import style from './index.less'
+import { BidModeEnum, OptimizationGoalEnum, PromotedObjectType, SiteSetEnum } from "@/services/launchAdq/enum";
+let columns = () => {
+
+    return [
+        {
+            title: '媒体账户',
+            dataIndex: 'adAccountId',
+            key: 'adAccountId',
+            align: 'center',
+            width: 100,
+            fixed: 'left'
+        },
+        {
+            title: '广告名称',
+            dataIndex: 'adgroupName',
+            key: 'adgroupName',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.adgroupName}</span>
+            }
+        },
+        {
+            title: '推广目标',
+            dataIndex: 'promotedObjectType',
+            key: 'promotedObjectType',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{PromotedObjectType[a]}</span>
+            }
+        },
+        {
+            title: '推广版位',
+            dataIndex: 'sysAdGroupData',
+            key: 'sysAdGroupData',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{a?.siteSet?.map((item: string) => SiteSetEnum[item]).toString()}</span>
+            }
+        },
+        {
+            title: '投放日期',
+            dataIndex: 'beginDate',
+            key: 'beginDate',
+            align: 'center',
+            width: 200,
+            render: (a: any, b: any) => {
+                return <span>{b?.sysAdGroupData?.endDate ? b?.sysAdGroupData?.beginDate + '~' + b?.sysAdGroupData?.endDate : b?.sysAdGroupData?.beginDate + '~ 长期投放'}</span> 
+            }
+        },
+        {
+            title: '投放时段',
+            dataIndex: 'date_set1',
+            key: 'date_set1',
+            align: 'center',
+            width: 100,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>全天投放</span>
+            }
+        },
+        {
+            title: '每日预算',
+            dataIndex: 'dailyBudget',
+            key: 'dailyBudget',
+            align: 'center',
+            width: 100,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.dailyBudget || '不限'}</span>
+            }
+        },
+        {
+            title: '出价方式',
+            dataIndex: 'bidMode',
+            key: 'bidMode',
+            align: 'center',
+            width: 90,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{BidModeEnum[b?.sysAdGroupData?.bidMode]}</span>
+            }
+        },
+        {
+            title: '出价',
+            dataIndex: 'bidAmount',
+            key: 'bidAmount',
+            align: 'center',
+            width: 100,
+            render: (a: any, b: any) => {
+                return <span style={{ fontSize: "12px" }}>{b?.sysAdGroupData?.bidAmount}</span>
+            }
+        },
+        {
+            title: '优化目标',
+            dataIndex: 'optimizationGoal',
+            key: 'optimizationGoal',
+            align: 'center',
+            width: 100,
+            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: 'pageData',
+            key: 'pageData',
+            align: 'center',
+            width: 120,
+            render: (a: any, b: any) => {
+                return <div className={style.twoText}>
+                    <Tooltip title={a?.pageName}>
+                        <span style={{ fontSize: "12px" }}>{a?.pageName}</span>
+                    </Tooltip>
+                </div>
+            }
+        },
+        {
+            title: '定向名称',
+            dataIndex: 'targetingData',
+            key: 'targetingData',
+            align: 'center',
+            width: 200,
+            render: (a: any, b: any) => {
+                return <div className={style.twoText}>
+                    {
+                        a?.targetingName ? <Tooltip title={a?.targetingName}>
+                            <span style={{ fontSize: "12px" }}>{a?.targetingName}</span>
+                        </Tooltip> : '<空>'
+                    }
+                </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 '--'
+        //         }
+
+        //     }
+        // }
+    ]
+}
+
+export default columns

src/pages/launchSystemNew/launchManage/localAd/ad/index.tsx

@@ -1,5 +1,5 @@
 import { FnAjax, useAjax } from '@/Hook/useAjax'
-import { ListData, SysAdgroupsDTO } from '@/services/launchAdq'
+import { Data, ListData, SysAdgroupsDTO } from '@/services/launchAdq'
 import { PromotedObjectType } from '@/services/launchAdq/enum'
 import { createSysAdgroups, getSysAdgroupsList } from '@/services/launchAdq/localAd'
 import { Col, Row, Input, Select, Button } from 'antd'
@@ -21,7 +21,7 @@ function Ad() {
     })
     const [oldsearchData, setOldsearchData] = useState<any>(null)
     // api方法
-    const sysAdgroupsList: FnAjax<ListData<SysAdgroupsDTO>> = useAjax((params) => getSysAdgroupsList(params))
+    const sysAdgroupsList: FnAjax<ListData<SysAdgroupsDTO> | any>  = useAjax((params) => getSysAdgroupsList(params),{formatResult:true})
     const createSysAdgroup = useAjax((params) => createSysAdgroups(params))
     // 初始获取列表
     useEffect(() => {
@@ -52,17 +52,17 @@ function Ad() {
             }
         })
     }, [sysAdgroupsList])
-    console.log(PromotedObjectType)
+    console.log('sysAdgroupsList',sysAdgroupsList)
     return <div>
         <TableData
             columns={tableConfig}
             ajax={sysAdgroupsList}
-            dataSource={sysAdgroupsList?.data?.records}
+            dataSource={sysAdgroupsList?.data?.data?.records}
             loading={sysAdgroupsList?.loading}
             scroll={{ y: 600 }}
-            total={sysAdgroupsList?.data?.total}
-            page={sysAdgroupsList?.data?.current}
-            pageSize={sysAdgroupsList?.data?.size}
+            total={sysAdgroupsList?.data?.data?.total}
+            page={sysAdgroupsList?.data?.data?.current}
+            pageSize={sysAdgroupsList?.data?.data?.size}
             leftChild={<>
                 <Row gutter={[10, 10]}>
                     <Col span={24}><Button type='primary' onClick={() => {

src/pages/launchSystemNew/launchManage/localAd/creative/index.tsx

@@ -22,7 +22,7 @@ function Creative() {
     })
     const [oldsearchData, setOldsearchData] = useState<any>(null)
     // api方法
-    const sysAdcreativeList: FnAjax<ListData<any>> = useAjax((params) => getSysAdcreativeList(params))
+    const sysAdcreativeList: FnAjax<ListData<any>|any> = useAjax((params) => getSysAdcreativeList(params),{formatResult:true})
     const createSysAdgroup = useAjax((params) => createSysAdcreative(params))
     // 初始获取列表
     useEffect(() => {
@@ -58,12 +58,12 @@ function Creative() {
         <TableData
             columns={tableConfig}
             ajax={sysAdcreativeList}
-            dataSource={sysAdcreativeList?.data?.records}
+            dataSource={sysAdcreativeList?.data?.data?.records}
             loading={sysAdcreativeList?.loading}
             scroll={{ y: 600 }}
-            total={sysAdcreativeList?.data?.total}
-            page={sysAdcreativeList?.data?.current}
-            pageSize={sysAdcreativeList?.data?.size}
+            total={sysAdcreativeList?.data?.data?.total}
+            page={sysAdcreativeList?.data?.data?.current}
+            pageSize={sysAdcreativeList?.data?.data?.size}
             leftChild={<>
                 <Row gutter={[10, 10]}>
                     <Col span={24}><Button type='primary' onClick={() => {

src/services/launchAdq/global.ts

@@ -22,6 +22,11 @@ export async function getTagsList(params:any){
 }
 /**
  * 创意形式详细信息
+ * @param promotedObjectType 推广目标
+ * @param adcreativeTemplateId 创意形式ID
+ * @param siteSet 数组版位 
+ * https://developers.e.qq.com/docs/api/tools/adcreative_template/adcreative_template_get?version=1.3&_preview=1
+ * https://developers.e.qq.com/docs/tools/adcreative_template
  * */ 
 
  export async function get_adcreative_template(params:any){
@@ -32,6 +37,10 @@ export async function getTagsList(params:any){
 }
 /**
  * 创意形式列表信息
+ * @param promotedObjectType 推广目标
+ * @param siteSet 数组版位 
+ * @param campaignType 投放位置
+ * https://developers.e.qq.com/docs/api/tools/adcreative_template/adcreative_template_list_get?version=1.3&_preview=1
  * */ 
 
  export async function get_adcreative_template_list(params:any){