优化目标

src/api/api.ts

@@ -86,7 +86,7 @@ export enum Api{
     directPacket_add = '/api/ad/targetingsAdd',
     directPacket_list = '/api/ad/targetingGet',
     directPacket_edit = '/api/ad/targetingsUp',
-    directPacket_get_behavior_list = '/api/ad/getOptimizationGoal',
+    directPacket_get_behavior_list = 'api/ad/moreOptimizationGoal',
     directPacket_get_customer_base_list = '/api/ad/customAudiencesGet',
     directPacket_user_os_list = '/api/ad/userOsList',
     directPacket_location_list = '/api/ad/targetingTagsGet',

src/assets/style/element/index.scss

@@ -59,4 +59,9 @@
   .el-drawer__body{
     padding-top: 0;
   }
+}
+.select-self {
+  .el-select-dropdown__list{
+    padding-bottom: 40px !important;
+  }
 }

src/components/businessMoudle/batchGdt/configArea/basicInfo/components/select.vue

@@ -1,27 +1,59 @@
 <template>
   <div class="flex-baseline marB15">
-    <div class="form-block-item-title" v-if="title&&title!=''">{{ title }}</div>
+    <div class="form-block-item-title" v-if="title && title != ''">{{ title }}</div>
     <div class="flex-center" style="flex:1;flex-wrap: wrap;">
-      <el-select v-model="selectValue" filterable clearable :placeholder="placeholder" @change="onChange">
-        <el-option
-          v-for="item in list"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
-        />
+      <el-select v-model="selectValue" popper-class="select-self" style="width:300px" filterable clearable
+        :placeholder="placeholder" @change="onChange">
+        <el-option v-for="item in selectList" :key="item.value" :label="item.label" :value="item.value" />
+        <template v-slot:empty v-if="isMoreTarget">
+          <div class="dropdown_footer" style="position: relative;">若找不到所需目标？请点这里：<span class="c-theme pointer"
+              @click="OnClickMore">更多目标</span></div>
+        </template>
+        <div class="dropdown_footer" v-if="isMoreTarget">若找不到所需目标？请点这里：<span class="c-theme pointer"
+            @click="OnClickMore">更多目标</span></div>
       </el-select>
       <slot name="content_item"></slot>
     </div>
   </div>
-  
+
+  <el-dialog class="gdt-dialog" append-to-body v-model="moreVisible" :title="title" width="480px" align-center>
+    <div class="deepexternalaction-tip">
+      <el-icon color="#ff9b48"><WarningFilled /></el-icon>请确保账户在广点通下可以使用该深度优化目标投放广告 </div>
+    <div class="flex" style="margin-bottom: 30px;">
+      <div class="form-block-item-title" v-if="title && title != ''">{{ title }}</div>
+      <div class="flex-center" style="flex:1;flex-wrap: wrap;">
+        <el-select v-model="moreValue" style="width:300px" filterable clearable
+          placeholder="请选择">
+          <el-option v-for="item in moreList" :key="item.value" :label="item.label" :value="item.value" />
+        </el-select>
+      </div>
+    </div>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="moreVisible = false" size="default">取 消</el-button>
+        <el-button type="primary" @click="dialogSubmit" size="default">确 定</el-button>
+      </span>
+    </template>
+  </el-dialog>
 </template>
 <script setup lang="ts">
 import { onBeforeMount, ref } from 'vue'
+import { moreOptimizationGoal } from '../ts/basicApi'
+import { ElMessage } from 'element-plus'
+import _ from 'lodash'
 interface IList {
   value: string,
   label: string
 }
 const props = defineProps({
+  GoalType: {
+    type: Number,
+    default: 1,
+  },
+  isMoreTarget: {
+    type: Boolean,
+    default: false
+  },
   title: {
     type: String,
     default: ''
@@ -32,22 +64,71 @@ const props = defineProps({
   },
   list: {
     type: Array<IList>,
-    default: ()=>{[]}
+    default: () => { [] }
   },
   fillBack: {
-    type:String
+    type: String
   }
 })
 const emit = defineEmits<{
   (event: "change", val: any): void;
 }>();
+const moreVisible = ref(false)
 const selectValue = ref('')
-onBeforeMount(()=>{
+const moreValue = ref('')
+const moreList = ref<any[]>([])
+const selectList = ref(_.cloneDeep(props.list))
+onBeforeMount(() => {
   selectValue.value = props.fillBack || '';
   emit('change', selectValue.value)
 })
 const onChange = () => {
   emit('change', selectValue.value)
 }
+const OnClickMore = () => {
+  moreOptimizationGoal({ type: props.GoalType }).then((res: any) => {
+    moreVisible.value = true
+    moreList.value = res
+  }).catch(() => {
+    ElMessage.warning('暂无更多数据！')
+  })
+}
+const dialogSubmit = () => {
+  if(!moreValue.value || moreValue.value == ''){
+    ElMessage.warning('请选择目标！')
+    return;
+  }
+  if(selectList.value.filter((v)=>v.value == moreValue.value).length == 0){
+    moreList.value.forEach((item)=>{
+      if(item.value == moreValue.value) {
+        selectList.value.push(item)
+      }
+    })
+  }
+  selectValue.value = moreValue.value
+  moreVisible.value = false
+}
 </script>
-<style lang="scss" scoped>@import "@/assets/style/batchDialogGdt.scss";</style>
+<style lang="scss" scoped>
+@import "@/assets/style/batchDialogGdt.scss";
+
+.dropdown_footer {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  font-size: 14px;
+  background-color: #e6ecf5;
+  line-height: 40px;
+  text-align: center;
+}
+.deepexternalaction-tip{
+  color: #606266;
+  font-size: 14px;
+  line-height: 30px;
+  word-break: break-all;
+  display: flex;
+  align-items: center;
+  margin: 20px 0 15px;
+}
+</style>

src/components/businessMoudle/batchGdt/configArea/basicInfo/index.vue

@@ -141,7 +141,7 @@
             @change="radioChange" :fillBack="props.dataFillBack['conversion_tracking_scene']"></MyRadio>
         </template>
         <!-- 优化目标 -->
-        <MySelect v-if="form.bid_mode == 'BID_MODE_OCPM' || form.bid_mode == 'BID_MODE_OCPC'" :list="optimizationGoal_1"
+        <MySelect v-if="form.bid_mode == 'BID_MODE_OCPM' || form.bid_mode == 'BID_MODE_OCPC'" :GoalType="1" :isMoreTarget="true" :list="optimizationGoal_1"
           title="优化目标" placeholder="请选择优化目标" :fillBack="props.dataFillBack['optimization_goal']"
           @change="(val) => { onChangeKey({ val, key: 'optimization_goal' }) }">
         </MySelect>
@@ -150,7 +150,8 @@
           :info="scheduleBidInfo.forward_link_assist_enabled"
           :fillBack="props.dataFillBack['forward_link_assist_enabled']" @change="radioChange">
           <template v-slot:content_item v-if="form.forward_link_assist_enabled == '1'">
-            <MySelect class="block marT15" :list="optimizationGoal_1" title="" placeholder="请选择助攻行为"
+            <div style="height: 15px;width:1px;"></div>
+            <MySelect class="block marT15" :list="moreOptimizationGoalList" title="" placeholder="请选择助攻行为"
               :fillBack="props.dataFillBack['forward_link_assist']"
               @change="(val) => { onChangeKey({ val, key: 'forward_link_assist' }) }"></MySelect>
           </template>
@@ -210,7 +211,7 @@
             :info="scheduleBidInfo.deep_optimize_type" @change="radioChange">
             <template v-slot:default v-if="form.deep_optimize_type != 0">
               <MyRadio :info="scheduleBidInfo.deep_conversion_type" :fillBack="props.dataFillBack['deep_conversion_type']" @change="radioChange"></MyRadio>
-              <MySelect class="marT15" :list="optimizationGoal_2" title="深度优化目标" placeholder="请选择深度优化目标" :fillBack="deep_conversion_behavior_spec.target" 
+              <MySelect class="marT15" :GoalType="form.deep_conversion_type == 'DEEP_CONVERSION_BEHAVIOR' ? 2 : 3" :isMoreTarget="true" :list="optimizationGoal_2" title="深度优化目标" placeholder="请选择深度优化目标" :fillBack="deep_conversion_behavior_spec.target" 
                 @change="(val) => { deep_conversion_behavior_spec.target = val; }">
               </MySelect>
               <!-- 优化转化行为 -->
@@ -303,11 +304,11 @@
 </template>
 <script setup lang="ts">
 import { ref, reactive, watch, onBeforeMount, computed, nextTick } from 'vue'
-import { basicInfoJson, scheduleBid, conversion_tracking_way, optimizationGoal_1, optimizationGoal_2 } from './ts/information'
+import { basicInfoJson, scheduleBid, conversion_tracking_way } from './ts/information'
 import { specificPositionAll, expand_targeting, unbreakable_targeting } from './ts/other'
 import { scene, wechatScene, positionMapping, search_expand_targeting_switch } from './ts/scene'
 import { FillBackData } from './ts/fillBack'
-import { adPresetsSet } from './ts/basicApi'
+import { adPresetsSet,getOptimizationGoal, moreOptimizationGoal } from './ts/basicApi'
 import { getDay, deepCopy } from "@/common/common";
 import MyRadio from './components/radio.vue'
 import AdPosition from './components/adPosition.vue'
@@ -321,6 +322,7 @@ import wildcard from './components/wildcard.vue'
 import WeekTime from './components/weekTime.vue'
 import { ElMessage } from "element-plus";
 import _ from 'lodash'
+
 const props = defineProps({
   visible: {
     type: Boolean,
@@ -329,6 +331,10 @@ const props = defineProps({
   dataFillBack: {
     type: Object,
     default: () => { }
+  },
+  promoted_object_type: {
+    type: String,
+    default: ''
   }
 })
 const emit = defineEmits<{
@@ -343,6 +349,9 @@ const site_ids_arr_1: any = ref([])
 const site_ids_arr_2: any = ref([])
 const scheduleBidInfo = reactive(scheduleBid)
 const specificPositionInfo2 = specificPositionAll()
+const optimizationGoal_1 = ref<any[]>([])
+const optimizationGoal_2 = ref<any[]>([])
+const moreOptimizationGoalList = ref<any[]>([])
 const defaultAdPositionList = ['SITE_SET_KANDIAN', 'SITE_SET_QQ_MUSIC_GAME', 'SITE_SET_TENCENT_NEWS', 'SITE_SET_TENCENT_VIDEO', 'SITE_SET_MOBILE_UNION']
 let adPositionList: any = ref([]);// 广告版位默认列表
 const deep_conversion_behavior_spec: any = reactive({ // 深度目标优化 - 优化转化行为
@@ -408,7 +417,9 @@ const computed_deep_conversion_behavior_spec_fillBack2 = () => {
 const form: any = reactive(props.dataFillBack || {})
 const basicInfoJsonInfo: any = reactive(basicInfoJson)
 onBeforeMount(() => {
-  
+  moreOptimizationGoal({type: 1}).then((res:any)=>{//助攻行为
+    moreOptimizationGoalList.value = res
+  })
 })
 /**提交保存 */
 const submitEvent = () => {
@@ -461,7 +472,12 @@ const submitEvent = () => {
   if (flag) return
 
   FillBackData({
-    data: form, type: 'me', 'updateScene': basicInfoJsonInfo['场景'], cb: (data: { params: any, copywriting: [] }) => {
+    data: form, 
+    type: 'me', 
+    updateScene: basicInfoJsonInfo['场景'], 
+    optimizationGoal_1: optimizationGoal_1.value,
+    optimizationGoal_2: optimizationGoal_2.value,
+    cb: (data: { params: any, copywriting: [] }) => {
       if (adSet.value) {
         loading.value = true;
         // let setParams = _.cloneDeep(data.params)
@@ -487,6 +503,20 @@ const handleClose = () => {
 /**特定版位回调 */
 const onChangeAdPosition = (val: string) => {
   form['site_ids'] = val;
+  getOptimizationGoal({
+    site_set: val.split(','),
+    promoted_object_type: props.promoted_object_type
+  }).then((res:any)=>{
+    res.forEach((item)=>{
+      item.label = item.name;
+      item.value = item.goal;
+    })
+    optimizationGoal_1.value = res.filter((v)=>{return v.name && v.name != '' && v.goal && v.goal != ''});
+    console.log('optimizationGoal_1',optimizationGoal_1.value)
+  }).catch((res)=>{
+    optimizationGoal_1.value = [];
+    optimizationGoal_2.value = [];
+  })
   watchSiteIds()// 版位变化
 }
 const change_site_table = () => {
@@ -567,6 +597,9 @@ const radioChange = (obj: object) => {
     if(keys_arr.includes('bid_way')){//优化目标出价方式变化
       watch_deep_conversion()
     }
+    if(keys_arr.includes('deep_conversion_type')){//深度转化类型
+      changeOptimizationGoal()
+    }
   }
 }
 
@@ -633,10 +666,34 @@ const onChangeKey = ({ val, key }) => {
   }else if(key == 'bid_amount'){
     form[key] = val;
     computed_deep_conversion_behavior_spec_fillBack2()
+  }else if(key == 'optimization_goal'){// 优化目标
+    form[key] = val;
+    changeOptimizationGoal()
   }else{
     form[key] = val;
   }
 }
+/**优化目标 及 深度转化类型 变化 ==> 导致 深度优化目标 发生变化 */
+const changeOptimizationGoal = () => {
+  optimizationGoal_1.value.forEach((item)=>{
+    if(item.goal == form.optimization_goal){
+      let deep_info:any[] = []
+      if(form.deep_conversion_type == 'DEEP_CONVERSION_BEHAVIOR'){//优化转化行为
+        deep_info = _.cloneDeep(item.deep_behaviors) || []
+      }else if (form.deep_conversion_type == 'DEEP_CONVERSION_WORTH') {//优化ROI
+        deep_info = _.cloneDeep(item.deep_worths) || []
+      }
+      deep_info = deep_info.filter((v)=>{
+        return v.name && v.name != '' && v.goal && v.goal != ''
+      })
+      deep_info.forEach((v)=>{
+        v.label = v.name;
+        v.value = v.goal;
+      })
+      optimizationGoal_2.value = deep_info
+    }
+  })
+}
 const onChangeWechat = (flag) => {
   if (flag) {
     adPositionList.value = ['SITE_SET_MOMENTS', 'SITE_SET_WECHAT', 'SITE_SET_WECHAT_PLUGIN'].concat(defaultAdPositionList)
@@ -701,29 +758,6 @@ const watch_deep_conversion = (type?) => {
     });
   }
 }
-/**自动扩量监听 */
-// watch([
-//   () => form.expand_enabled
-// ], (newValue, oldValue) => {
-//   let obj = basicInfoJsonInfo['定向扩展']['smart_targeting_switch']
-//   if (newValue[0] == '1') {
-//     obj.data.list[1].disabled = true;
-//   } else {
-//     obj.data.list[1].disabled = false;
-//   }
-// }, { immediate: true})
-
-/**智能定向监听 */
-// watch([
-//   () => form.smart_targeting_switch
-// ], (newValue, oldValue) => {
-//   let obj = basicInfoJsonInfo['定向扩展']['expand_enabled']
-//   if (newValue[0] == '1') {
-//     obj.data.list[1].disabled = true;
-//   } else {
-//     obj.data.list[1].disabled = false;
-//   }
-// }, { immediate: true})
 /**监听出价 - 更改 -》 分版位出价 */
 watch([
   () => form.bid_way,
@@ -822,65 +856,8 @@ watch(
     checkedWechat.value = props.dataFillBack.bid_site_wechat_enabled == '1' ? true : false; // 支持微信朋友圈&微信公众号与小程序版位
     watch_deep_conversion()
   }, { immediate: true})
-/**监听数据回显 */
-// watch(
-//   () => props.dataFillBack,
-//   (newValue, oldValue) => {
-//     if (!newValue.id) return;
-//      form.daily_budget_radio = newValue?.daily_budget ? '2' : '1';
-//      for(let i in newValue){
-//       form[i] = newValue[i]
-//      }
-//     form.bid_scene_radio = newValue?.bid_scene == 'BID_SCENE_NORMAL_AVERAGE' || newValue?.bid_scene == 'BID_SCENE_NORMAL_TARGET' ? '' : newValue?.bid_scene;
-//     if(form.bid_way == '2'){
-//       let arr = form.bid_range?.split('-') || [];
-//       form.bid_range_1 = {
-//         con: form.bid_range,
-//         min: arr.length > 0 ? arr[0] : '',
-//         max: arr.length > 1 ? arr[1] : '',
-//       }
-//     }
-//     watchSiteIds()
-//     if (form.bid_site == '1') { // 分版位出价
-//       if (newValue.bid_site_details){
-//         let bid_site_details = JSON.parse(newValue.bid_site_details)
-//         site_ids_arr_1.value.forEach((item) => {
-//           item.coefficient = bid_site_details[item.value] || 1;
-//           item.offer = getOffer(bid_site_details[item.value], 'site')
-//         });
-//       }
-//     }
-//     if (newValue.deep_conversion_behavior_spec || newValue.deep_conversion_worth_spec) {
-//       let deep_spec = JSON.parse(newValue.deep_conversion_behavior_spec)
-//       if(newValue.deep_conversion_type == 'DEEP_CONVERSION_WORTH') { // 优化ROI
-//         deep_spec = JSON.parse(newValue.deep_conversion_worth_spec)
-//       }
-//       deep_conversion_behavior_spec.target = deep_spec.target;
-//       deep_conversion_behavior_spec.rate = deep_spec.rate || '';
-//       deep_conversion_behavior_spec.price = newValue.deep_conversion_type == 'DEEP_CONVERSION_WORTH' ? deep_spec.roi : deep_spec.price;
-//       deep_conversion_behavior_spec.min = deep_spec.min;
-//       deep_conversion_behavior_spec.max = deep_spec.max;
-//       deep_conversion_behavior_spec_fillBack.min = deep_spec.min;
-//       deep_conversion_behavior_spec_fillBack.max = deep_spec.max;
-//       deep_conversion_behavior_spec_fillBack2.value = newValue.deep_conversion_type == 'DEEP_CONVERSION_WORTH' ? deep_spec.roi : deep_spec.price;
-//     }
-//     if (form.deep_bid_site == '1') { // 分版位深度出价
-//       if (newValue.deep_bid_site_details){
-//         let deep_bid_site_details = JSON.parse(newValue.deep_bid_site_details)
-//         site_ids_arr_2.value.forEach((item) => {
-//           item.coefficient = deep_bid_site_details[item.value] || 1;
-//           item.offer = getOffer(deep_bid_site_details[item.value], 'deep_bit_site')
-//         });
-//       }
-//     }
-//     first_day_begin_time.flag = newValue.first_day_begin_time && newValue.first_day_begin_time != '' ? true : false;
-//     first_day_begin_time.value = newValue.first_day_begin_time.slice(0,5)
-//     checkedWechat.value = newValue.bid_site_wechat_enabled == '1' ? true : false; // 支持微信朋友圈&微信公众号与小程序版位
-//     watch_deep_conversion()
-//   }, { immediate: true})
 </script>
 <style lang="scss" scoped>@import "@/assets/style/batchDialogGdt.scss";
-
 .flex-1 {
   flex: 1;
 }</style>

src/components/businessMoudle/batchGdt/configArea/basicInfo/ts/basicApi.ts

@@ -27,21 +27,47 @@ export async function getSceneSpecTags(params: ISceneSpecTags) {
     return []
   }
 }
-/**1优化目标/助攻行为   2深度优化目标 */
+/** 优化目标下拉列表 */
 interface IOptimizationGoal {
-  type: '1' | '2'
+  site_set: string[],
+  promoted_object_type: string
 }
-export async function getOptimizationGoal(params: IOptimizationGoal) {
-  const res: any = await http.get('/api/ad/getOptimizationGoal', params)
-  if (res.errNo == 0) {
-    let arr:Array<{label:string, value: string}> = [];
-    for(let i in res.rst){
-      arr.push({label: res.rst[i], value: i})
+export function getOptimizationGoal(params: IOptimizationGoal) {
+  return new Promise( async (resolve, reject)=>{
+    const res: any = await http.get('/api/ad/getOptimizationGoal', params)
+    if (res.errNo == 0 && Array.isArray(res.rst)) {
+      // let arr:Array<{label:string, value: string}> = [];
+      // res.rst.forEach((item)=>{
+      //   arr.push({label: item.name, value: item.goal})
+      // })
+      resolve(res.rst)
+    } else {
+      reject()
     }
-    return arr
-  } else {
-    return []
-  }
+  })
+}
+
+/** 优化目标-更多  
+ * 1优化目标/助攻行为   
+ * 2深度优化转化目标 
+ * 3深度优化roi目标
+*/
+interface IMoreOptimizationGoal {
+  type: number,
+}
+export function moreOptimizationGoal(params: IMoreOptimizationGoal) {
+  return new Promise( async (resolve, reject)=>{
+    const res: any = await http.get('api/ad/moreOptimizationGoal', params)
+    if (res.errNo == 0 && res.rst) {
+      let arr:Array<{label:string, value: string}> = [];
+      for(let key in res.rst){
+        arr.push({label: res.rst[key], value: key})
+      }
+      resolve(arr)
+    } else {
+      reject()
+    }
+  })
 }
 
 /**通配符 */

src/components/businessMoudle/batchGdt/configArea/basicInfo/ts/fillBack.ts

@@ -1,5 +1,5 @@
 import { ElMessage } from "element-plus";
-import { basicInfoJson, scheduleBid, optimizationGoal_1, optimizationGoal_2 } from './information'
+import { basicInfoJson, scheduleBid } from './information'
 import { specificPositionAll } from './other'
 import { scene } from './scene'
 import { number, time } from "echarts";
@@ -106,9 +106,11 @@ interface IFillBackData {
   data: any,
   type: 'me' | 'api',
   cb?: Function,
-  updateScene?: any
+  updateScene?: any,
+  optimizationGoal_1: any[],
+  optimizationGoal_2: any[]
 }
-export const FillBackData = ({ data, type, updateScene = {}, cb }: IFillBackData) => {
+export const FillBackData = ({ data, type, updateScene = {}, cb, optimizationGoal_1, optimizationGoal_2 }: IFillBackData) => {
   let copywriting: string[] = [];
   let site_ids: string[] = [];//广告版位
   let params: any = {}

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

@@ -1,7 +1,3 @@
-import { getOptimizationGoal } from './basicApi'
-export const optimizationGoal_1 = await getOptimizationGoal({ type: '1' })
-export const optimizationGoal_2 = await getOptimizationGoal({ type: '2' })
-
 export const conversion_tracking_way = [
   { label: '点击归因', value: '1' },
   { label: '曝光归因', value: '2'},

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

@@ -124,7 +124,7 @@
                     @submitIsOver="switch_complate_flag_creaBasicInfo"
   ></OriginalityBasic>
   <!-- 广告基本信息 -->
-  <BasicInfo :visible="basicInfoData.visible" :dataFillBack="basicInfoData.fillBack" @close="basicInfoClose"></BasicInfo>
+  <BasicInfo :visible="basicInfoData.visible" :dataFillBack="basicInfoData.fillBack" :promoted_object_type="pageInfo.targetValue" @close="basicInfoClose"></BasicInfo>
   <!-- 扩量种子人群 -->
   <ExpandPopulation :visible="basicInfoData.outerConfig.expandPopulation.visible" :accIdsList="pageInfo.accIdsList" :fillback="basicInfoData.outerConfig['expandPopulation'].value" @close="(obj)=>{basicOuterClose({val: obj?.val || null, type: obj?.type || null, key:'expandPopulation'})}" title="扩量种子人群"></ExpandPopulation>
   <!-- 一方数据助攻 - 智能定向 -->

src/components/businessMoudle/gdtList/account.vue

@@ -0,0 +1,417 @@
+<template>
+  <div>
+    <div class="screenBox_mini">
+      <Input ref="InputRef_text" title="关键词" placeholderTxt="关键词" @changeEvent="()=>init()" @clearEvent="()=>init()"/>
+      <Select ref="acRef"
+              title="账号"
+              selectWidth="160px"
+              @changeEvent="()=>init()" @clearEvent="()=>init()"
+              :isMultiple="true"
+              :optObj="{k:'account_id',la:'account_id',val:'account_id'}"
+              :options="pageInfo.acList"/>
+      <Select ref="statusRef"
+              title="状态"
+              selectWidth="160px"
+              @changeEvent="()=>init()" @clearEvent="()=>init()"
+              :options="pageInfo.statusList"/>
+      <TimeScreen title="时间" selectWidth="260px" :haveQuick="false" :clearFlag="true" :valueIsKong="true"
+                  ref="timeRef"
+                  @init="()=>init()"></TimeScreen>
+      <span class="pointer c-theme lMar10" @click="clearEvent">清空</span>
+      <el-button class="lMarauto" type="primary" @click="goNewPlanEvent">新建计划</el-button>
+    </div>
+    <div>
+      <div class="bMar10 flex">
+        <Dropdown title="批量操作" :list="tableInfo.moreList" @close="dropdownEvent" class="rMar10"
+                  :disabledFlag="tableInfo.multipleSelection&&tableInfo.multipleSelection.length == 0"></Dropdown>
+        <div>已选 : <span>{{tableInfo.multipleSelection&&tableInfo.multipleSelection.length}}</span></div>
+<!--        <el-button class="lMarauto" type="primary" @click="customIndEvent">自定义指标</el-button>-->
+
+        <div  class="lMarauto">
+          <Indicators type="media_base" @refresh="IndicatorsRefreshList"></Indicators>
+        </div>
+      </div>
+我是账户列表
+      <el-table v-loading="loading" ref="tableRef" :data="tableInfo.tableList"
+                :header-cell-style="tableHeaderStyle"
+                :key="tableInfo.updateKey" style="width: 100%"
+                border empty-text="暂无数据"
+                row-key="campaign_id"
+                max-height="calc(100vh - 294px)">
+        <el-table-column fixed width="80" >
+          <template #header>
+            <div class="flex">
+              <el-checkbox v-model="tableInfo.chooseAll" @change="allChooseCheckboxEvent"></el-checkbox>
+              <el-dropdown class="lMar10" @command="handleCommandChoosePage">
+                <el-icon color="#3173FF"><i-ep-ArrowDownBold /></el-icon>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item command="1">当前页</el-dropdown-item>
+                    <el-dropdown-item command="2">全部</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+          <template #default="scope">
+            <div class="checkBoxSelf flex"
+                 @click="singleChooseCheckboxEvent(tableInfo.multipleSelection.findIndex(n=>n.campaign_id == scope.row.campaign_id),scope.row)"
+                 :class="tableInfo.multipleSelection.findIndex(n=>n.campaign_id == scope.row.campaign_id)>=0 ? 'active' : ''">
+              <el-icon color="#fff" v-if="tableInfo.multipleSelection.findIndex(n=>n.campaign_id == scope.row.campaign_id)>=0"><i-ep-Check /></el-icon>
+            </div>
+          </template>
+        </el-table-column>
+        <template v-for="item in tableInfo.descol">
+          <el-table-column :fixed="item.isfixed" :min-width="item.minWidth ? item.minWidth : '80px'">
+            <template #header>
+              <div class="flex"
+                   :style="{ justifyContent: item.alignSelf ? item.alignSelf : 'center' }"
+                   :class="[tableInfo.sortKey == item.column ? 'active_css' : '',item.isSort ? 'pointer' : '']"
+                   @click="item.isSort&&sortEvent(item.column)">
+                {{ item.name }}
+                <el-tooltip v-if="item.notes" effect="dark" :content="item.notes"><i-ep-QuestionFilled class="lMar5 c-999 f14 pointer" /></el-tooltip>
+                <div v-if="item.isSort">
+                  <div class="sortItem"><el-icon :color="tableInfo.sortKey == item.column ? '#3173FF' : ''"><i-ep-CaretBottom /></el-icon></div>
+                </div>
+              </div>
+            </template>
+            <template #default="scope">
+              <div class="flex" :style="{ justifyContent: item.alignSelf ? item.alignSelf : 'center' }">
+
+              <div v-if="item.column == 'campaign_name'">
+                <span class="c-theme flex campaignName">
+                  <span class="pointer" @click="goAdvertEvent(scope.row.campaign_id)">{{scope.row[item.column]}}</span>
+                  <el-icon color="#3173FF" class="pointer lMarauto f16 icon" @click="edit_campaign_name_event(scope.row)"><i-ep-Edit /></el-icon>
+                </span>
+              </div>
+              <div v-else-if="item.column == 'configured_status'">
+                <span class="c-green" v-if="scope.row[item.column] == 'AD_STATUS_NORMAL'">正常</span>
+                <span class="c-red" v-else-if="scope.row[item.column] == 'AD_STATUS_SUSPEND'">暂停</span>
+                <span v-else>-</span>
+              </div>
+              <div v-else-if="item.column == 'speed_mode'">
+                <span v-if="scope.row[item.column] == 'SPEED_MODE_STANDARD'">标准投</span>
+                <span v-else-if="scope.row[item.column] == 'SPEED_MODE_FAST'">加速投放</span>
+                <span v-else>-</span>
+              </div>
+              <div v-else-if="item.column == 'operate'">
+                <div class="flex">
+                  <span class="c-theme pointer" @click="editPlanEvent(scope.row)">修改</span>
+                  <span class="lMar10"
+                        :class="scope.row.configured_status == 'AD_STATUS_NORMAL' ? 'pointer-drop c-green-opa' : 'pointer c-green'"
+                        @click="scope.row.configured_status == 'AD_STATUS_SUSPEND'&&batchPlanEvent(scope.row,1)">启用</span>
+                </div>
+                <div>
+                    <span :class="scope.row.configured_status == 'AD_STATUS_SUSPEND' ? 'pointer-drop c-red-opa' : 'pointer c-red'"
+                          @click="scope.row.configured_status == 'AD_STATUS_NORMAL'&&batchPlanEvent(scope.row,2)">暂停</span>
+                  <Popconfirm key="dele" @confirm="batchPlanEvent(scope.row,3)" :slotFlag="true">
+                    <template #con>
+                      <span class="pointer lMar10">删除</span>
+                    </template>
+                  </Popconfirm>
+
+                </div>
+
+
+              </div>
+              <div class="flex c-theme pointer" v-else-if="item.column == 'daily_budget'" @click="editPlanEvent(scope.row)">
+                {{scope.row[item.column] ? NumberHandle(scope.row[item.column]) : '不限'}}
+              </div>
+
+
+              <div class="cellDiv" :class="tableInfo.sortKey == item.column ? 'active_css' : ''" v-else>
+                <el-tooltip :disabled="!(scope.row[item.column] && scope.row[item.column].length >30)" effect="dark" :content="scope.row[item.column]+''">
+                  <div class="clampTwo line21" style="flex: 1">
+                    {{ scope.row[item.column] || scope.row[item.column]==0 ?
+                      (item.cancleForMat ? (scope.row[item.column] ? scope.row[item.column] : '-') : NumberHandle(scope.row[item.column])) : '-'}}
+                    <span v-if="item.hasPercent&&(scope.row[item.column] || scope.row[item.column] ==0)">%</span>
+                  </div>
+                </el-tooltip>
+              </div>
+              </div>
+            </template>
+          </el-table-column>
+        </template>
+      </el-table>
+
+      <div class="paginationBox flex" style="justify-content: center" v-if="Number(tableInfo.total) > 0">
+        <el-pagination
+            v-model:currentPage="tableInfo.currentPage"
+            v-model:page-size="tableInfo.pageSize"
+            background
+            :total="tableInfo.total"
+            @current-change="handleCurrentChange" />
+      </div>
+    </div>
+
+    <EditIpt ref="planEditIptRef" title="推广计划" @confirm="planEditConfirm"></EditIpt>
+    <TargetEdit ref="TargetEditRef" title="计划设置" @confirm="init"></TargetEdit>
+  </div>
+</template>
+<script setup lang="ts">
+import {getCurrentInstance, nextTick, onMounted, reactive, ref} from "vue";
+import Select from '@/components/capsulationMoudle/_select.vue'
+import TimeScreen from '@/components/capsulationMoudle/timeScreen.vue'
+import Input from '@/components/capsulationMoudle/_input.vue'
+import EditIpt from '@/components/businessMoudle/gdtList/dialog/editIpt.vue'
+import TargetEdit from '@/components/businessMoudle/gdtList/dialog/target.vue'
+import Dropdown from '@/components/capsulationMoudle/_dropdown.vue'
+import Popconfirm from '@/components/capsulationMoudle/_popconfirm.vue'
+import noData from '@/components/capsulationMoudle/noData.vue'
+import {listTs} from "@/components/businessMoudle/gdtList/ts/list";
+import {Api} from "@/api/api";
+import {ElMessage} from "element-plus";
+import {batchGdt_edit, batchGdt_list, reactiveTableAndAny} from "@/api/ApiModel";
+import Indicators from './indicators/index.vue'
+
+const { proxy } = getCurrentInstance() as any;
+// 全局方法定义
+const NumberHandle = proxy.$NumberHandle
+
+const emit = defineEmits<{
+  (event: "goNewPlan"): void;
+  (event: "goAdvert",campaign_id:any): void;
+}>();
+const goNewPlanEvent = () => {
+  emit('goNewPlan')
+}
+const goAdvertEvent = (campaign_id:any) => {
+  emit('goAdvert',campaign_id)
+}
+
+const loading = ref<boolean>(false)
+const tableInfo = reactive<reactiveTableAndAny>({
+  tableList:[],
+  tableList_all:[],
+  descol:[
+    { name:'计划名称',column:'campaign_name',slotFlag: true,isfixed:true,alignSelf:'left'},
+    { name:'操作',column:'operate',slotFlag: true,isfixed:true},
+    { name:'账号ID',column:'account_id',cancleForMat:true},
+    { name:'计划ID',column:'campaign_id',cancleForMat:true},
+    { name:'计划类型',column:'campaign_type'},
+    { name:'推广目标类型',column:'promoted_object_type'},
+    { name:'日预算(元)',column:'daily_budget',slotFlag: true},
+    // { name:'总预算',column:'total_budget'},
+    { name:'投放日期',column:'created_time'},
+    { name:'客户状态',column:'configured_status',slotFlag: true},
+    { name:'投放速度',column:'speed_mode',slotFlag: true},
+  ],
+  multipleSelection:[],
+  updateKey:1,
+  chooseAll:false,
+  sortKey:'',
+  moreList:[
+    {value:'1',label:'启用'},
+    {value:'2',label:'暂停'},
+    {value:'3',label:'删除'},
+  ],
+  currentPage:1,
+  pageSize:20,
+  total:0,
+  totalPages:0,//共多少页
+})
+
+
+
+//批量操作
+const batchEvent = () => {
+
+}
+
+// 启用 暂停 删除
+const batchPlanApi = async (arr?:any,val?:any) => {
+  const paramsModel = reactive<batchGdt_edit>({
+    campaign_infos:JSON.stringify(arr),
+    flag:val?val:0
+  })
+  let res:any = await proxy.$http.post(Api.batchGdt_plan_batch_edit,paramsModel)
+  ElMessage.info(res.errMsg)
+  if(res&&res.errNo=='0'){
+    init()
+    tableInfo.multipleSelection = []
+  }else{
+    loading.value = false
+  }
+}
+const batchPlanEvent = async (row?:any,val?:any) => {
+  loading.value = true
+  let arr:any = []
+  arr.push({
+    account_id:row.account_id,
+    campaign_id:row.campaign_id
+  })
+  batchPlanApi(arr,val)
+
+}
+const dropdownEvent = (val: string | number | object) => {
+  loading.value = true
+  let arr:any = []
+  tableInfo.multipleSelection.forEach(item=>{
+    arr.push({
+      account_id:item.account_id,
+      campaign_id:item.campaign_id
+    })
+  })
+  batchPlanApi(arr,val)
+}
+
+//修改计划
+const editPlanEvent = (row:any) => {
+  nextTick(()=>{
+    TargetEditRef.value!.switchShow(true,row)
+  })
+}
+//修改计划名称
+const edit_campaign_name_event = (row:any) => {
+  nextTick(()=>{
+    planEditIptRef.value!.switchShow(true,row.campaign_name)
+  })
+}
+//推广计划 - 确定
+const planEditConfirm = () => {
+
+}
+
+
+//排序
+const sortEvent = (row:any) => {
+
+}
+
+//列表
+const init = async (page?:any,totalPages?:any) => {
+  loading.value = true
+  const paramsModel = reactive<batchGdt_list>({
+    account_ids:acRef.value!.value,
+    keyword:InputRef_text.value!.value,
+    status:statusRef.value!.value,
+    start:timeRef.value!.dateVal&&timeRef.value!.dateVal[0],
+    end:timeRef.value!.dateVal&&timeRef.value!.dateVal[1],
+    page:page?page:1,
+    pageSize:totalPages ? totalPages : tableInfo.pageSize
+  })
+  let res:any = await proxy.$http.get(Api.batchGdt_plan_list,paramsModel)
+  loading.value = false
+  if(res&&res.errNo=='0'){
+    if(totalPages){
+      tableInfo.tableList_all = res.rst.data
+    }else{
+      tableInfo.tableList = res.rst.data
+      tableInfo.total = res.rst.pageInfo.total
+      tableInfo.totalPages = res.rst.pageInfo.total
+    }
+  }else{
+    ElMessage.error(res.errMsg)
+  }
+}
+
+//分页
+const handleCurrentChange = (val) => {
+  tableInfo.currentPage = val
+  init(val)
+}
+
+
+//清空值
+const clearChooseVal = ()=>{
+  tableInfo.chooseAll = false
+  tableInfo.multipleSelection = []
+}
+//添加值
+const multipleSelection_add = (item?:any) => {
+  let idx:number = tableInfo.multipleSelection.findIndex(n=>n.campaign_id == item.campaign_id)
+  if(idx<0){
+    tableInfo.multipleSelection.push(item)
+  }
+}
+//删除值
+const multipleSelection_splice = (item?:any) => {
+  let idx:number = tableInfo.multipleSelection.findIndex(n=>n.campaign_id == item.campaign_id)
+  if(idx>=0){
+    tableInfo.multipleSelection.splice(idx,1)
+  }
+}
+const handleCommandChoosePage = async (command: string | number | object)=>{
+  let arr:any = tableInfo.tableList
+  clearChooseVal()
+  tableInfo.chooseAll = true
+  if(command == 2){ // 全部
+    await init(1,tableInfo.totalPages)
+    arr = tableInfo.tableList_all
+  }
+  arr.forEach(item=>{
+    multipleSelection_add(item)
+  })
+}
+//全选
+const allChooseCheckboxEvent = (val:string | number | boolean)=>{
+  tableInfo.tableList.forEach(item=>{
+    if(val){
+      multipleSelection_add(item)
+    }else{
+      tableInfo.multipleSelection = []
+    }
+  })
+}
+//单选
+const singleChooseCheckboxEvent = (idx:number,row:any)=>{
+  if(idx==-1){
+    tableInfo.multipleSelection.push(row)
+  }else{
+    tableInfo.multipleSelection.splice(idx,1)
+    tableInfo.chooseAll = false
+  }
+}
+
+const IndicatorsRefreshList = () => {
+  //这里刷新列表
+}
+
+const {
+  init_acList,
+  pageInfo,
+  timeRef,
+  acRef,
+  statusRef,
+  InputRef_text,
+  clearEvent,
+  tableHeaderStyle,
+  planEditIptRef,
+  TargetEditRef,
+  customIndEvent
+} = listTs()
+
+onMounted(()=>{
+  nextTick(async ()=>{
+    await init_acList()
+    await init()
+  })
+})
+</script>
+<style lang="scss" scoped>
+.campaignName{
+  .icon{
+    color: #3173FF;
+    opacity: 0;
+  }
+  &:hover{
+    .icon{
+      opacity: 1;
+    }
+  }
+}
+.checkBoxSelf{
+  width: 13px;
+  height: 13px;
+  border: 1px solid #d9d9d9;
+  border-radius: 2px;
+  &:hover{
+    cursor: pointer;
+    border: 1px solid #3173FF;
+  }
+  &.active{
+    border: 1px solid #3173FF;
+    background-color: #3173FF;
+  }
+}
+</style>

src/components/businessMoudle/gdtList/index.vue

@@ -9,6 +9,7 @@
   <!-- 表格组件 -->
   <keep-alive>
     <div>
+      <account v-show="typeAc == 'account'"  @goAdvert="goAdvert"  @goNewPlan="goNewPlan"></account>
       <plan v-show="typeAc == 'plan'"  @goAdvert="goAdvert"  @goNewPlan="goNewPlan"></plan>
       <advert v-show="typeAc == 'advert'" ref="advertRef"
               @goNewPlan="goNewPlan"
@@ -21,6 +22,7 @@ import {getCurrentInstance, markRaw, nextTick, onBeforeMount, onMounted, reactiv
 import { useRouter } from "vue-router";
 import advert from "@/components/businessMoudle/gdtList/advert.vue";
 import plan from "@/components/businessMoudle/gdtList/plan.vue";
+import account from "@/components/businessMoudle/gdtList/account.vue";
 import {publicSwitchType} from "@/components/businessMoudle/switchType";
 import {reactiveTableAndAny} from "@/api/ApiModel";
 
@@ -32,6 +34,7 @@ const acIdx = shallowRef(plan)
 
 // 类型切换公共ts
 const typeListParams = reactive([
+  {name:'媒体账户',key:'account',compName:markRaw(account)},
   {name:'推广计划',key:'plan',compName:markRaw(plan)},
   {name:'广告',key:'advert',compName:markRaw(advert)},
 ])