feat: 转化归因新链路

src/components/businessMoudle/batchGdt3/configArea/basicInfo/conversionTrack.vue

@@ -0,0 +1,255 @@
+<template>
+  <el-dialog class="gdt-dialog" v-model="dialogVisible" :destroy-on-close="true" key="conversionTrackDialog"
+    title="配置转化归因新链路" width="600px" :before-close="handleClose">
+
+    <div class="content-wrap" v-loading="loading">
+      <div class="form-item">
+        <div class="item-lable">监控链接</div>
+        <el-input class="input-wrap" v-model="form.feedback_url" placeholder="请输入监控链接" clearable />
+      </div>
+      <div class="form-item">
+        <div class="item-lable">小程序app_id</div>
+        <el-input class="input-wrap" v-model="form.wechat_app_id" placeholder="请输入小程序app_id" clearable />
+      </div>
+    </div>
+
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="handleClose"> 取 消 </el-button>
+        <el-button type="primary" @click="submitEvent"> 确 定 </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts">
+import { nextTick, reactive, ref, watch } from 'vue';
+import { ElMessage } from "element-plus";
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  accIdsList: {
+    type: Array<{ id: string, name: string }>,
+    default: () => []
+  },
+  fillback: {
+    type: Object,
+  },
+  acc_plan_ad_count: {
+    type: Object,
+    default: () => { }
+  }
+})
+const emit = defineEmits<{
+  (event: "close", val?: any): void;
+}>();
+
+const loading = ref(false)
+const dialogVisible = ref(props.visible)
+
+const form = reactive({
+  feedback_url: '',
+  wechat_app_id: '',
+})
+
+/**关闭弹框 */
+const handleClose = () => {
+  emit('close')
+}
+
+/**确定提交 */
+const submitEvent = () => {
+
+  if (!form.feedback_url) {
+    ElMessage.warning('请输入监控链接')
+    return false
+  }
+
+  if (!form.wechat_app_id) {
+    ElMessage.warning('请输入小程序app_id')
+    return false
+  }
+
+  let obj = {};
+  emit('close', {
+    type: 'submit',
+    val: Object.keys(obj)?.length == 0 ? null : obj,
+    other: {
+      feedback_url: form.feedback_url,
+      wechat_app_id: form.wechat_app_id,
+    }
+  })
+}
+
+const handleClear = () => {
+  console.log('handleClear => ',)
+  form.feedback_url = ''
+  form.wechat_app_id = ''
+
+  emit('close', {
+    type: 'submit',
+    val: null,
+    other: {}
+  })
+}
+
+// 父组件共享值
+defineExpose({
+  handleClear,
+});
+
+/**弹框显隐监听 */
+watch(
+  () => props.visible,
+  async (newValue, oldValue) => {
+    dialogVisible.value = newValue
+    console.log('fillback => ', props.fillback)
+
+  }, { immediate: true })
+
+</script>
+<style lang="scss" scoped>
+@import "@/assets/style/batchDialogGdt.scss";
+@import './outer.scss';
+
+.tabelListBox {
+  margin-top: 15px;
+  height: 62vh !important;
+  padding-left: 0 !important;
+}
+
+.tabelCon {
+  padding: 10px;
+}
+
+.selectedList,
+.listCon {
+  box-sizing: border-box;
+  border: 1px solid #e8eaec;
+  border-radius: 4px;
+}
+
+.selectedList {
+  width: 200px;
+}
+
+.listCon {
+  flex: 1;
+}
+
+.operate {
+  height: 48px;
+  padding: 0 8px;
+  border-bottom: 1px solid #dcdfe6;
+}
+
+.infoTitle {
+  box-sizing: border-box;
+  display: flex;
+  padding-right: 10px;
+  padding-left: 10px;
+  line-height: 30px;
+  background-color: #f8f9fd;
+  border-bottom: 1px solid #dcdfe6;
+  font-size: 14px;
+  color: #333;
+}
+
+.infoBlock {
+  height: 45vh;
+  overflow: auto;
+  padding: 10px;
+
+  .okInfo {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    line-height: 32px;
+    color: #444;
+  }
+}
+
+.empty-block {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding-top: 70px;
+
+  .empty-description {
+    margin-top: 25px;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 20px;
+    color: #808695;
+  }
+}
+
+.self_checkbox {
+  width: 14px;
+  height: 14px;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  position: relative;
+  cursor: pointer;
+}
+
+.self_checkbox_active {
+  background-color: #3173FF;
+  border-color: #3173FF;
+
+  &::after {
+    box-sizing: content-box;
+    content: "";
+    border: 1px solid #ffffff;
+    border-left: 0;
+    border-top: 0;
+    height: 7px;
+    left: 4px;
+    position: absolute;
+    top: 1px;
+    transform: rotate(45deg) scaleY(1);
+    width: 3px;
+    transition: transform .15s ease-in 50ms;
+    transform-origin: center;
+  }
+}
+
+.self_checkbox_disabled {
+  background-color: #edf2fc;
+  border-color: #dcdfe6;
+  cursor: not-allowed;
+
+  &::after {
+    border: none;
+  }
+}
+
+.content-wrap {
+  padding: 40px 30px 0;
+  .form-item {
+    margin-bottom: 30px;
+    display: flex;
+    align-items: center;
+    .item-lable {
+      width: 90px;
+      margin-right: 20px;
+      font-size: 14px;
+      margin-bottom: 6px;
+    }
+
+    .input-wrap {
+      width: 300px;
+    }
+
+    .form-tips {
+      font-size: 12px;
+      color: #666;
+      margin-top: 6px;
+    }
+  }
+}
+
+</style>

src/components/businessMoudle/batchGdt3/configArea/basicInfo/ts/information.ts

@@ -367,11 +367,11 @@ export const scheduleBid:any = {
     name: '转化场景',
     type: 'radio',
     data: {
-      defaultValue: 'CONVERSION_SCENE_WEB',
+      defaultValue: 'CONVERSION_SCENE_WECHAT_MINI_PROGRAM',
       list:[
-        { label: '网页', value: 'CONVERSION_SCENE_WEB' },
+        // { label: '网页', value: 'CONVERSION_SCENE_WEB' },
         { label: '微信小程序', value: 'CONVERSION_SCENE_WECHAT_MINI_PROGRAM'},
-        { label: '企业微信', value: 'CONVERSION_SCENE_WE_COM'},
+        // { label: '企业微信', value: 'CONVERSION_SCENE_WE_COM'},
       ],
     }
   },

src/components/businessMoudle/batchGdt3/configArea/index.vue

@@ -207,6 +207,17 @@
   />
   <!-- E 推广产品 -->
 
+  <!-- S 转化归因新链路 -->
+  <conversionTrack
+    ref="conversionTrackRef"
+    :visible="basicInfoData.outerConfig.conversionTrack.visible"
+    :accIdsList="pageInfo.accIdsList"
+    :fillback="basicInfoData.outerConfig['conversionTrack']"
+    :acc_plan_ad_count="pageInfo.acc_plan_ad_count"
+    @close="(obj: IOuterConfigRule) => { basicOuterClose({ ...obj, key: 'conversionTrack' }) }"
+  />
+  <!-- E 转化归因新链路 -->
+
   <!-- 优量汇流量包 -->
   <UnionPosition :visible="basicInfoData.outerConfig.unionPosition.visible" :accIdsList="pageInfo.accIdsList"
     :infoSelect="basicInfoData.outerConfig.unionPosition.infoSelect"
@@ -237,6 +248,7 @@ import AttributionOuter from './basicInfo/attributionOuter.vue'
 import WeChatVideoAccount from './basicInfo/weChatVideoAccount.vue'
 import sellStrategy from './basicInfo/sellStrategy.vue'
 import marketingAsset from './basicInfo/marketingAsset.vue'
+import conversionTrack from './basicInfo/conversionTrack.vue'
 import UnionPosition from './basicInfo/unionPosition.vue'
 import OriginalityBasic from './originalityBasic/index.vue'
 import Copywriter from './copywriter/index.vue'
@@ -265,6 +277,7 @@ const NumberHandle = proxy.$NumberHandle
 
 const sellStrategyRef = ref()
 const marketingAssetRef = ref()
+const conversionTrackRef = ref()
 
 // S 参数声明
 const {
@@ -522,6 +535,8 @@ const updateHaveContent = ({ id, chooseNum, minusFlag, clearFlag, type }: IUpdat
         sellStrategyRef?.value?.handleClear()
         // 定向包变化 => 清空推广产品配置
         marketingAssetRef?.value?.handleClear()
+        // 定向包变化 => 清空转化归因新链路配置
+        conversionTrackRef?.value?.handleClear()
 
         pageInfo.directPacketChooseNum = chooseNum
         console.log('pageInfo.directPacketChooseNum => ', pageInfo.directPacketChooseNum)

src/components/businessMoudle/batchGdt3/configArea/ts/adBasic.ts

@@ -43,6 +43,15 @@ export function basicInfoDeclare() {
         value: {},
         other: {}
       },
+      conversionTrack: {
+        enabled: false, //是否需要配置
+        visible: false, //对应弹框显隐
+        optional: false, //选填
+        isComplete: false, // 是否完成填写
+        name: '转化归因新链路',
+        value: {},
+        other: {}
+      },
       unionPosition: {
         enabled: false,
         visible: false,
@@ -214,7 +223,13 @@ export function handleAdBasic({
       res?.union_position_enabled == 1 && basicInfoData.outerConfig.unionPosition.infoSelect.push({ name: '定投流量包', id: 1 })
       res?.exclude_union_position_enabled == 1 && basicInfoData.outerConfig.unionPosition.infoSelect.push({ name: '屏蔽流量包', id: 2 })
     }
+
     basicInfoData.outerConfig.marketingAsset.enabled = true; // 推广产品
+
+    if (res?.conversion_tracking_enabled == 1) { // 转化归因新链路
+      basicInfoData.outerConfig.conversionTrack.enabled = true;
+    }
+
   }
   /**点击基础信息外层配置 */
   const basicOuterClick = (key) => {
@@ -232,6 +247,10 @@ export function handleAdBasic({
     if (key == 'marketingAsset') { // 推广产品 - 需要定向包完成填写
       if (!judgeEvent(7)) return
     }
+
+    if (key == 'conversionTrack') { // 转化归因新链路 - 需要定向包完成填写
+      if (!judgeEvent(7)) return
+    }
     basicInfoData.outerConfig[key].visible = true;
   }
   /** 外部配置回调 */
@@ -250,8 +269,13 @@ export function handleAdBasic({
         basicInfoData.outerConfig[key].other = other
       }
 
-      console.log('basicOuterClose() basicInfoData.outerConfig => ', basicInfoData.outerConfig)
+
+      if (key == 'conversionTrack') { // 转化归因新链路
+        basicInfoData.outerConfig[key].isComplete = isCompleteEventCT(basicInfoData.outerConfig[key]);
+      }
     }
+
+    console.log('basicOuterClose() basicInfoData.outerConfig => ', basicInfoData.outerConfig)
   }
 
   const isCompleteEvent = (data) => {
@@ -267,6 +291,15 @@ export function handleAdBasic({
     }
     return true
   }
+  const isCompleteEventCT = (data) => { // 转化归因新链路
+    const { other = {} } = data
+    if (!other.feedback_url || !other.wechat_app_id) {
+      return false
+    } else {
+      return true
+    }
+  }
+
   /**基础外部配置 - 获取对象公共数据 */
   const getCommonValue = (data) => {
     let obj = {}

src/components/businessMoudle/batchGdt3/previewArea/api.ts

@@ -75,6 +75,7 @@ interface IAddTasksStrategy {
   union_position: string,
   sell_strategy: string,
   marketing_asset: string,
+  conversionTrack: string,
 }
 export function addTasksStrategy(params: IAddTasksStrategy) {
   return new Promise(async (resolve,reject)=>{

src/components/businessMoudle/batchGdt3/previewArea/index.vue

@@ -441,6 +441,19 @@ const auditSubmitEvent = (dialogInfo) => {
   }
   // E 推广产品参数
 
+  // S 转化归因新链路
+  if (ad_common.conversion_tracking_enabled == 1) {
+    const { other = {} } = pageInfo.basicInfoData.outerConfig.conversionTrack
+    campaign_list.forEach((c: any) => {
+      c.ad_list.forEach(ad => {
+        ad['feedback_url'] = other['feedback_url']
+        ad['wechat_app_id'] = other['wechat_app_id']
+      })
+    })
+  }
+  // E 转化归因新链路
+
+
   let ad_outer = {
     user_action_sets: {},//数据源
     cold_start_audience: {},//扩量种子
@@ -661,6 +674,7 @@ const addTasksStrategyEvent = (task_id) => {
     'union_position': JSON.stringify(groupsInfo?.basicInfoData?.outerConfig?.unionPosition),
     'sell_strategy': JSON.stringify(groupsInfo?.basicInfoData?.outerConfig?.sellStrategy),
     'marketing_asset': JSON.stringify(groupsInfo?.basicInfoData?.outerConfig?.marketingAsset),
+    'conversionTrack': JSON.stringify(groupsInfo?.basicInfoData?.outerConfig?.conversionTrack),
   }).then((res)=>{
     console.log('添加广告任务策略',res)
   }).catch(()=>{})