fix

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

@@ -16,7 +16,7 @@ export interface ModalConfig {
 function Ad() {
     // 变量
     const [modalConfig, setModalConfig] = useState<ModalConfig>({
-        visible: false,
+        visible: true,
         title: '新建'
     })
     const [oldsearchData, setOldsearchData] = useState<any>(null)

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

@@ -1,8 +1,10 @@
-import React, { useCallback } from 'react'
-import { Modal, Form, Input, Divider, Select, Radio, DatePicker, Switch } from 'antd'
-import { SiteSetEnum, BidModeEnum, OptimizationGoalEnum, BidStrategyEnum, PromotedObjectType } from '@/services/launchAdq/enum'
+import React, { useCallback, useEffect } from 'react'
+import { Modal, Form, Input, Divider, Select, Radio, DatePicker, Switch, Checkbox } from 'antd'
+import { SiteSetEnum, BidModeEnum, OptimizationGoalEnum, BidStrategyEnum, PromotedObjectType, EducationEnum } from '@/services/launchAdq/enum'
 import { ModalConfig } from '.'
 import moment from 'moment';
+import { useAjax } from '@/Hook/useAjax';
+import { getSceneTagsList } from '@/services/launchAdq/global';
 const { RangePicker }: { RangePicker: any } = DatePicker;
 let DatePickers: any = DatePicker
 interface Props {
@@ -15,23 +17,49 @@ interface Props {
 /**广告模板*/
 function AdModal(props: Props) {
     let { visible, title, confirmLoading, PupFn, callback } = props
+    const sceneTagsList = useAjax((params) => getSceneTagsList(params))
     const [form] = Form.useForm();
     let dateType = Form.useWatch('dateType', form)
     let bidMode = Form.useWatch('bidMode', form)
     let smartBidType = Form.useWatch('smartBidType', form)
     let autoAcquisitionEnabled = Form.useWatch('autoAcquisitionEnabled', form)
-    // let siteSet = Form.useWatch('siteSet', form)
-
+    let siteSet = Form.useWatch('siteSet', form)
+    let wechatPositionType = Form.useWatch('wechatPositionType', form)
+    let wechatSceneType = Form.useWatch('wechatSceneType', form)
     // 确定事件
     const handleOk = useCallback(() => {
         form.validateFields().then(values => {
             let newValues = JSON.parse(JSON.stringify(values))
+            newValues.sceneSpec = {}
             if (newValues.dateType === '2') {
                 newValues['beginDate'] = moment(newValues.date).format('YYYY-MM-DD')
             } else {
                 newValues['beginDate'] = moment(newValues.date[0]).format('YYYY-MM-DD')
                 newValues['endDate'] = moment(newValues.date[1]).format('YYYY-MM-DD')
             }
+            if (newValues.wechatPositionType === '1') {
+                newValues.sceneSpec = { ...newValues.sceneSpec, wechatPosition: newValues.wechatPosition }
+            }
+            if (newValues.wechatSceneType === '1') {
+                newValues.sceneSpec = { ...newValues.sceneSpec, wechatScene: {
+                    officialAccountMediaCategory:newValues.officialAccountMediaCategory,
+                    miniProgramAndMiniGame:newValues.miniProgramAndMiniGame,
+                    payScene:newValues.payScene
+                } }
+            }
+            if (newValues.sceneSpec.wechatPosition?.length === 0) {
+                delete newValues.sceneSpec.wechatPosition
+            }
+            // if(newValues.sceneSpec.wechatScene)
+            if (!newValues.sceneSpec.wechatPosition && !newValues.sceneSpec.wechatScene) {
+                delete newValues.sceneSpec
+            }
+            delete newValues.officialAccountMediaCategory
+            delete newValues.miniProgramAndMiniGame
+            delete newValues.payScene
+            delete newValues.wechatPositionType
+            delete newValues.wechatPosition
+            delete newValues.wechatScene
             delete newValues['dateType']
             delete newValues['date']
             newValues['timeSeries'] = Array(336).fill(1).join('')
@@ -39,6 +67,11 @@ function AdModal(props: Props) {
         })
         // PupFn({ visible: false })
     }, [form])
+    // 场景定向
+    useEffect(() => {
+        sceneTagsList.run({ typeList: ['WECHAT_POSITION', 'OFFICIAL_ACCOUNT_MEDIA_CATEGORY', 'MINI_PROGRAM_AND_MINI_GAME', 'PAY_SCENE'] })
+    }, [])
+    console.log()
     return <Modal
         visible={visible}
         title={title + '广告'}
@@ -49,7 +82,7 @@ function AdModal(props: Props) {
     >
         <Form
             form={form}
-            labelCol={{ span: 3 }}
+            labelCol={{ span: 5 }}
             initialValues={
                 {
                     bidMode: 'BID_MODE_OCPM',
@@ -58,26 +91,27 @@ function AdModal(props: Props) {
                     timeSeries: '1',
                     smartBidType: 'SMART_BID_TYPE_CUSTOM',
                     autoAcquisitionEnabled: false,
+                    wechatSceneType: '0',
+                    wechatPositionType: '0'
                 }
             }
         >
             {/* ============================================================基本信息============================================================= */}
             <Divider orientation='center'>基本信息</Divider>
+            <Form.Item label={<strong>广告名称</strong>} name='adgroupName' rules={[{ required: true, message: '请输入广告名称!' }]}>
+                <Input placeholder='广告名称' style={{ width: 300 }} />
+            </Form.Item>
             <Form.Item label={<strong>推广目标类型</strong>} name='promotedObjectType' rules={[{ required: true, message: '请选择推广告推广目标类型!' }]}>
                 <Select style={{ width: 300 }} showSearch filterOption={(input, option) =>
                     (option!.children as unknown as string).toLowerCase().includes(input.toLowerCase())
                 } allowClear>
                     {
                         Object.keys(PromotedObjectType).map(key => {
-                            // let obj = JSON.parse(PromotedObjectType[key])
                             return <Select.Option value={key} key={key}>{PromotedObjectType[key]}</Select.Option>
                         })
                     }
                 </Select>
             </Form.Item>
-            <Form.Item label={<strong>广告名称</strong>} name='adgroupName' rules={[{ required: true, message: '请输入广告名称!' }]}>
-                <Input placeholder='广告名称' style={{ width: 300 }} />
-            </Form.Item>
             <Form.Item label={<strong>广告版位</strong>} name='siteSet' rules={[{ required: true, message: '请输入选择广告版位！' }]}>
                 <Select mode='multiple' style={{ width: 300 }} allowClear>
                     {
@@ -87,6 +121,39 @@ function AdModal(props: Props) {
                     }
                 </Select>
             </Form.Item>
+            {
+                siteSet?.some((s: string) => s === 'SITE_SET_WECHAT') && <>
+                    <Form.Item label={<strong>微信公众号与小程序定投</strong>} name='wechatPositionType' style={wechatPositionType === '1' ? { marginBottom: 5 } : {}}>
+                        <Radio.Group >
+                            <Radio.Button value="0">不限</Radio.Button>
+                            <Radio.Button value="1">自定义</Radio.Button>
+                        </Radio.Group>
+                    </Form.Item>
+                    {wechatPositionType === '1' && <Form.Item style={{ marginLeft: 177 }} name='wechatPosition'>
+                        <Checkbox.Group options={sceneTagsList?.data?.WECHAT_POSITION?.map((item: { description: any; id: any; }) => ({ label: item.description, value: item.id }))} />
+                    </Form.Item>}
+                    <Form.Item label={<strong>微信公众号与小程序场景</strong>} name='wechatSceneType' style={wechatSceneType === '1' ? { marginBottom: 5 } : {}} >
+                        <Radio.Group >
+                            <Radio.Button value="0">不限</Radio.Button>
+                            <Radio.Button value="1">自定义</Radio.Button>
+                        </Radio.Group>
+                    </Form.Item>
+                    {wechatSceneType === '1' && <>
+                        <p style={{ marginBottom: 5, marginLeft: 177 }}><strong style={{ marginRight: 20 }}>公众号媒体类型</strong></p>
+                        <Form.Item style={{ marginLeft: 177 }} name='officialAccountMediaCategory'>
+                            <Checkbox.Group options={sceneTagsList?.data?.OFFICIAL_ACCOUNT_MEDIA_CATEGORY?.filter((i: { description: string; }) => i.description !== '不限')?.map((item: { description: any; id: any; }) => ({ label: item.description, value: item.id }))} />
+                        </Form.Item>
+                        <p style={{ marginBottom: 5, marginLeft: 177 }}><strong style={{ marginRight: 20 }}>小程序小游戏流量类型</strong></p>
+                        <Form.Item style={{ marginLeft: 177 }} name='miniProgramAndMiniGame'>
+                            <Checkbox.Group options={sceneTagsList?.data?.MINI_PROGRAM_AND_MINI_GAME?.filter((i: { description: string; }) => i.description !== '不限')?.map((item: { description: any; id: any; }) => ({ label: item.description, value: item.id }))} />
+                        </Form.Item>
+                        <p style={{ marginBottom: 5, marginLeft: 177 }}><strong style={{ marginRight: 20 }}>订单详情页消费场景</strong></p>
+                        <Form.Item style={{ marginLeft: 177 }} name='payScene'>
+                            <Checkbox.Group options={sceneTagsList?.data?.PAY_SCENE?.filter((i: { description: string; }) => i.description !== '不限')?.map((item: { description: any; id: any; }) => ({ label: item.description, value: item.id }))} />
+                        </Form.Item>
+                    </>}
+                </>
+            }
             {/* ============================================================排期与出价============================================================= */}
             <Divider orientation='center'>排期与出价</Divider>
             <Form.Item label={<strong>投放日期</strong>} name='dateType'>
@@ -98,8 +165,8 @@ function AdModal(props: Props) {
             {/* 投放日期的不同展示不同的日期选择 */}
             {
                 dateType === '1' ? <Form.Item name='date' rules={[{ required: true, message: '请选择日期' }]}>
-                    <RangePicker style={{ marginLeft: 107 }}></RangePicker>
-                </Form.Item> : <Form.Item name='date' style={{ marginLeft: 107 }} rules={[{ required: true, message: '请选择日期' }]}>
+                    <RangePicker style={{ marginLeft: 177 }}></RangePicker>
+                </Form.Item> : <Form.Item name='date' style={{ marginLeft: 177 }} rules={[{ required: true, message: '请选择日期' }]}>
                     <DatePickers />
                 </Form.Item>
             }

src/services/launchAdq/global.ts

@@ -9,4 +9,14 @@ export async function getTagsList(params:any){
         method:'POST',
         data:params
     })
+}
+/**
+ * 场景定向标签获取
+ * */ 
+
+ export async function getSceneTagsList(params:any){
+    return request(api+`/adq/launch/tools/scene/spec/tags/list`,{
+        method:'POST',
+        data:params
+    })
 }