Переглянути джерело

Merge branch 'master' of http://git.tjyourong.com.cn/ctop/adsp-vue

zhuxinbo 5 роки тому
батько
коміт
12b781572c
1 змінених файлів з 120 додано та 95 видалено
  1. 120 95
      src/views/modules/BatchCreate/TouTiaoBatch.vue

+ 120 - 95
src/views/modules/BatchCreate/TouTiaoBatch.vue

@@ -1,13 +1,13 @@
 <template>
     <div class="toutiaoBatch">
-        <keep-alive>  
+        <keep-alive>
         <div class="tabs">
             <a-tabs v-model="tabkey" @change="callback">
-                <a-tab-pane key="group" tab="广告组">                
+                <a-tab-pane key="group" tab="广告组">
                 </a-tab-pane>
-                <a-tab-pane key="plan" tab="广告计划">              
+                <a-tab-pane key="plan" tab="广告计划">
                 </a-tab-pane>
-                <a-tab-pane key="idea" tab="广告创意">               
+                <a-tab-pane key="idea" tab="广告创意">
                 </a-tab-pane>
                 <a-button type='primary' slot="tabBarExtraContent" @click="goBatch">
                    + 头条批量创建
@@ -17,7 +17,7 @@
         </keep-alive>
         <div class="topOptions">
             <span class="OptinItem">
-                <a-select  style="width: 120px" @change="statusChange" placeholder="请选择状态">    
+                <a-select  style="width: 120px" @change="statusChange" placeholder="请选择状态">
                     <a-select-option value="open" >
                     </a-select-option>
@@ -26,7 +26,7 @@
                     </a-select-option>
                 </a-select>
             </span>
-            <span class="OptinItem">           
+            <span class="OptinItem">
                 <a-input-search  placeholder="请选择媒体账户" style="width: 200px" v-model="account" />
             </span>
             <span class="OptinItem">
@@ -42,7 +42,7 @@
         </div>
         <div class="tableArea">
             <div class="tableOption">
-                <span class="OptinItem">                    
+                <span class="OptinItem">
                     <a-tooltip>
                         <template slot="title" :getPopupContainer='getPopupContainer'>
                         点我就可以批量启动、暂停、删除你的选择哦~
@@ -51,7 +51,7 @@
                     </a-tooltip>
                 </span>
                 <span class="OptinItem">
-                    <a-select  style="width: 120px" @change="optChange" placeholder="" :disabled='selectDisable'>    
+                    <a-select  style="width: 120px" @change="optChange" placeholder="" :disabled='selectDisable'>
                         <a-select-option value="open" >
                             启动
                         </a-select-option>
@@ -81,36 +81,36 @@
                         <div slot="content">
                             <span style='font-weight:700;margin-right:15px;font-size:15px'>预算</span>
                             <a-radio-group v-model="radioValue" @change="radioChange">
-                                <a-radio value="unlimit">不限</a-radio>
-                                <a-radio value="dayBudget">日预算</a-radio>                                
+                                <a-radio value="BUDGET_MODE_INFINITE">不限</a-radio>
+                                <a-radio value="BUDGET_MODE_DAY">日预算</a-radio>
                             </a-radio-group>
                             <span v-show="radioValue=='dayBudget'">预计金额: <a-input-number :min="0" v-model="dayBudgetValue" :step="0.1" @change="budgetChange" size="small" style='margin-right:20px' /></span>
                             <a-button type='default' @click="showPricecancel"  style='margin-right:10px'>取消</a-button>
                             <a-button type='primary' @click="showPriceOk"  class="ok">保存</a-button>
                         </div>
-                        
+
                         <a-button type='default'  v-if="tabkey=='group'" class="ok">更改预算</a-button>
                     </a-popover>
                     <a-button type='default' @click="changebudget" v-if="tabkey=='plan'" class="ok">更改预算</a-button>
                     <a-button type='default' @click="changeofferPrice" v-show="tabkey=='plan'">更改出价</a-button>
-                    
+
                  </span>
-                <span class="optionBtn">                    
+                <span class="optionBtn">
                     <a-button type='primary' @click="reset">自定义列</a-button>
                 </span>
             </div>
             <div class="table">
-                <a-table 
-                :columns="columns" 
-                :data-source="data" 
-                :row-selection="rowSelection" 
+                <a-table
+                :columns="columns"
+                :data-source="data"
+                :row-selection="rowSelection"
                 bordered
                 >
-                    <template slot="campaignName" slot-scope="text,record">                                       
-                        <editableCell :text="text" slotName='campaignName' @change="onCellChange(record.key, 'campaignName', $event)" />                       
+                    <template slot="name" slot-scope="text,record">
+                        <editableCell :text="text" slotName='campaignName' @change="onCellChange(record.key, 'campaignName', $event)" />
                     </template>
-                    <span slot="groupBudget" slot-scope="text,record">
-                       <editableCell :text="text" slotName='groupBudget' @change="onCellChange(record.key, 'groupBudget', $event)" /> 
+                    <span slot="budget" slot-scope="text,record">
+                       <editableCell :text="text" slotName='groupBudget' @change="onCellChange(record.key, 'groupBudget', $event)" />
                     </span>
                     <span slot="status" slot-scope="text,record">
                         <a-switch size="default" :checked=text  @change="switchChange(text,record)"/>
@@ -130,10 +130,8 @@
             </div>
         </div>
         <!-- 出价的模态框 -->
-        <div class="batchModal">        
-            <a-modal v-model="offerPriceVisiable" :title="'批量修改'+ModalTitle" @ok="handleOk" width='55%'  >
-                <div id="batchModal">
-
+        <div class="batchModal">
+            <a-modal v-model="offerPriceVisiable" :title="'批量修改'+ModalTitle" @ok="handleOk" width='55%' id="batchModal" >
                 <div class="selectePlan">已选{{}}个广告计划</div>
                 <div class="modifyRules">
                     <span class="rules">修改规则:</span>
@@ -166,34 +164,32 @@
                             :<a-input-number :min="0" v-model="inputValue" :step="0.1" @change="budgetChange"  size="small" :disabled="modifyRulesValue=='total'" /> 元
                         </span>
                         <span slot="currentCost" slot-scope="currentCost">{{ currentCost | decimalsHandle }}</span>
-                        <span slot="currentBudget" slot-scope="text"> 
+                        <span slot="currentBudget" slot-scope="text">
                             <span v-if="ModalTitle=='出价'">oCPM: {{text | decimalsHandle}}</span>
                             <span v-else>日预算:{{  text | decimalsHandle }}</span>
                         </span>
                     </a-table>
                 </div>
-            
-                </div>
+
             </a-modal>
         </div>
 
         <!-- 复制计划的弹出框 -->
-        <a-modal v-model="copyPlanVisiable" title="复制计划" @ok="copyPlanOk"  :maskClosable='false'>
-            <div id="copyModal">
+        <a-modal v-model="copyPlanVisiable" title="复制计划" @ok="copyPlanOk" id="copyModal" :maskClosable='false'>
+
             <p class="copyTip">复制说明:适用于批量复制多个广告计划,默认同事复制所属创意。此类型不直接跨广告投放账号复制,且只能复制完成后逐一修改</p>
             <p style="font-weight:700;font-size:15px">被复制广告计划:<span>{{}}</span></p>
-            <p><span class="copyName"><b class="copyKeyStart">*</b> 复制个数:</span> 
+            <p><span class="copyName"><b class="copyKeyStart">*</b> 复制个数:</span>
                 <a-input-number :min="1" :max="10" v-model="copyNum" style="width:250px" />
-                
+
             </p>
-            <p><span class="copyName"><b class="copyKeyStart">*</b>复制到广告组:</span> 
+            <p><span class="copyName"><b class="copyKeyStart">*</b>复制到广告组:</span>
                 <a-select size="default" default-value="a1" style="width: 250px" v-model="copyGroup" >
                 <a-select-option v-for="i in 25" :key="(i + 9).toString(36) + i">
                     {{ (i + 9).toString(36) + i }}
                 </a-select-option>
                 </a-select>
-            </p>           
-            </div>
+            </p>
         </a-modal>
     </div>
 </template>
@@ -226,7 +222,7 @@ let modifyTableCol=[
         dataIndex: 'changeBudget',
         align: 'center',
         scopedSlots: { customRender: 'changeBudget' },
-        
+
     },
 ]
 
@@ -240,38 +236,46 @@ const columns = [
   },
   {
     title: '广告组名称',
-    dataIndex: 'campaignName',
-    key: 'campaignName',
+    dataIndex: 'name',
+    key: 'name',
     align: 'center',
     width:450,
-    scopedSlots: { customRender: 'campaignName' }
+    scopedSlots: { customRender: 'name' }
   },
   {
     title: '广告组ID',
-    dataIndex: 'advantageID',    
-    key: 'advantageID',
+    dataIndex: 'id',
+    key: 'id',
     align: 'center',
   },
   {
     title: '推广目的',
-    dataIndex: 'promotionPurpose',    
-    key: 'promotionPurpose',
+    dataIndex: 'landingType_dictText',
+    key: 'landingType_text',
+    align: 'center',
+  },
+  {
+    title: '预算类型',
+    dataIndex: 'budgetMode_dictText',
+    key: 'budgetMode_text',
     align: 'center',
+    width:250,
+    scopedSlots: { customRender: 'budgetMode' }
   },
   {
     title: '组预算(元)',
-    dataIndex: 'groupBudget',    
-    key: 'groupBudget',
+    dataIndex: 'budget',
+    key: 'budget',
     align: 'center',
     width:250,
-    scopedSlots: { customRender: 'groupBudget' }
+    scopedSlots: { customRender: 'budget' }
   },
   {
     title: '创建时间',
-    dataIndex: 'creatTime',    
-    key: 'creatTime',
+    dataIndex: 'campaignCreateTime',
+    key: 'campaignCreateTime',
     align: 'center',
-    scopedSlots: { customRender: 'creatTime' }
+    scopedSlots: { customRender: 'campaignCreateTime' }
   },
 ];
 const planColumns = [
@@ -299,19 +303,19 @@ const planColumns = [
   },
   {
     title: '计划ID',
-    dataIndex: 'planID',    
+    dataIndex: 'planID',
     key: 'planID',
     align: 'center',
   },
   {
     title: '账户',
-    dataIndex: 'accountName',    
+    dataIndex: 'accountName',
     key: 'promotionPurpose',
     align: 'center',
   },
   {
     title: '计划预算(元)',
-    dataIndex: 'planBudget',    
+    dataIndex: 'planBudget',
     key: 'planBudget',
     align: 'center',
     width:150,
@@ -319,7 +323,7 @@ const planColumns = [
   },
   {
     title: '出价(元)',
-    dataIndex: 'planoffer',    
+    dataIndex: 'planoffer',
     key: 'planoffer',
     align: 'center',
     width:150,
@@ -327,21 +331,21 @@ const planColumns = [
   },
   {
     title: '投放方式',
-    dataIndex: 'Launchmode',    
+    dataIndex: 'Launchmode',
     key: 'Launchmode',
     align: 'center',
     scopedSlots: { customRender: 'Launchmode' }
   },
   {
     title: '投放时间',
-    dataIndex: 'LaunchTime',    
+    dataIndex: 'LaunchTime',
     key: 'LaunchTime',
     align: 'center',
     scopedSlots: { customRender: 'LaunchTime' }
   },
   {
     title: '所属广告组',
-    dataIndex: 'parentGroup',    
+    dataIndex: 'parentGroup',
     key: 'parentGroup',
     align: 'center',
     scopedSlots: { customRender: 'parentGroup' }
@@ -361,57 +365,57 @@ const ideaColumns = [
     key: 'options',
     align: 'center',
     scopedSlots: { customRender: 'options' }
-  }, 
+  },
   {
     title: '创意ID',
-    dataIndex: 'ideaID',    
+    dataIndex: 'ideaID',
     key: 'ideID',
     align: 'center',
   },
   {
     title: '广告创意',
-    dataIndex: 'ideID',    
+    dataIndex: 'ideID',
     key: 'ideaID',
     align: 'center',
   },
   {
     title: '创意方式',
-    dataIndex: 'iaID',    
+    dataIndex: 'iaID',
     key: 'idaID',
     align: 'center',
   },
   {
     title: '账户',
-    dataIndex: 'accountName',    
+    dataIndex: 'accountName',
     key: 'promotionPurpose',
     align: 'center',
   },
- 
-  
+
+
   {
     title: '投放时间',
-    dataIndex: 'LaunchTime',    
+    dataIndex: 'LaunchTime',
     key: 'LaunchTime',
     align: 'center',
     scopedSlots: { customRender: 'LaunchTime' }
   },
   {
     title: '投放位置',
-    dataIndex: 'LaunchPosition',    
+    dataIndex: 'LaunchPosition',
     key: 'LaunchPosition',
     align: 'center',
     scopedSlots: { customRender: 'LaunchPosition' }
   },
   {
     title: '所属计划',
-    dataIndex: 'parentPlan',    
+    dataIndex: 'parentPlan',
     key: 'parentPlan',
     align: 'center',
     scopedSlots: { customRender: 'parentPlan' }
   },
   {
     title: '所属广告组',
-    dataIndex: 'parentGroup',    
+    dataIndex: 'parentGroup',
     key: 'parentGroup',
     align: 'center',
     scopedSlots: { customRender: 'parentGroup' }
@@ -482,11 +486,11 @@ export default {
                 },
                 onSelect: (record, selected, selectedRows) => {
                     console.log(record, selected, selectedRows);
-                    
+
                 },
                 onSelectAll: (selected, selectedRows, changeRows) => {
                     console.log(selected, selectedRows, changeRows);
-                    
+
                 },
             },
             editID:0,
@@ -502,26 +506,33 @@ export default {
             ],
             modifyTableCol,
             modifyTableloading:false,
-            
-            
+
+
             //复制计划
             copyPlanVisiable:false,
             copyRecord:null,
             copyNum:1,//复制个数
             copyGroup:'',
+            url: {
+              campaignList: "/ctop/byteDanceCampaign/list",
+              planList: "/ctop/byteDanceAdvertisePlan/list",
+              creativeList: "/ctop/byteDanceCreative/list",
+            },
         }
     },
-    
+
     methods: {
         //tab切换页的函数
         callback(key) {
             console.log(key);
             if(key=='plan'){
-                this.columns=planColumns
+                this.columns=planColumns;
+                let params = {};
+                this.refreshCampaignList();
             }else if(key=='group'){
-                this.columns=columns
+                this.columns=columns;
             }else if(key=='idea'){
-                this.columns=ideaColumns
+                this.columns=ideaColumns;
             }
         },
         //跳转到批量页面
@@ -529,7 +540,7 @@ export default {
 
         },
         //状态改变
-        statusChange(value){          
+        statusChange(value){
             console.log(value);
 
         },
@@ -579,7 +590,7 @@ export default {
                                     ele.status=false;
                                 }
                             })
-                            
+
                         })
                     }
                 }else if(this.optValue=='open'){
@@ -595,7 +606,7 @@ export default {
                 }
                 console.log(this.data)
             }
-            
+
         },
         //确定删除
         confirm(e) {
@@ -645,9 +656,9 @@ export default {
             this.ModalTitle='出价'
             typeValue='出价';
             this.modifyTableCol[2].title='出价';
-            
+
             this.modifyTableCol[3].title='统一修改出价';
-            
+
         },
         handleOk(e) {
             console.log(e);
@@ -671,14 +682,14 @@ export default {
         // changecampaignName(text,record){
         //     console.log(text,record)
         // },
-        
+
         onCellChange(key, dataIndex, value) {
             console.log(key, dataIndex, value)
             const dataSource = [...this.data];
             const target = dataSource.find(item => item.key === key);
-            if (target) {                              
+            if (target) {
                 target[dataIndex] = value;
-                    this.data = dataSource;       
+                    this.data = dataSource;
             }
             console.log(this.data)
         },
@@ -694,10 +705,24 @@ export default {
             this.copyPlanVisiable = false;
             console.log(this.copyNum,'---',this.copyGroup)
         },
+        refreshCampaignList(params){
+          getAction(this.url.campaignList, params).then(res => {
+            console.log(res);
+            if (res.success) {
+              this.data = res.result.records;
+
+            } else {
+              console.log(res.message);
+            }
+          })
+        }
     },
     mounted() {
         console.log(this);
         this.data=data;
+        let params = {}
+        //初始
+        this.refreshCampaignList(params);
     },
     filters: {
         toPercentage(val) {
@@ -712,17 +737,17 @@ export default {
                 }
             else{
                 return 0
-            }    
+            }
         },
         //保留两位小数并且变成货币格式
         decimalsHandle(val){
-            
+
             if(val && typeof val !='string'){
                 if(val>=0){
                     val=parseFloat(val).toFixed(2);
                     let numberStr = val.toString()
                     let str = numberStr.split('.')
-                    
+
                     let str0=str[0].split('').reverse();
                     for (let i = 0; i < str0.length; i++) {
                         if ((i + 1) % 4 === 0) {
@@ -734,13 +759,13 @@ export default {
                     for (let j = 0; j < str0.length; j++) {
                         handleResult += str0[j]
                     }
-                    
+
                     return handleResult+'.'+str[1]
                 }else{
                     val=parseFloat(val).toFixed(2);
                     let numberStr = val.toString()
                     let str = numberStr.split('.')
-                    
+
                     let str0=str[0].substr(1).split('').reverse();
                     for (let i = 0; i < str0.length; i++) {
                         if ((i + 1) % 4 === 0) {
@@ -752,16 +777,16 @@ export default {
                     for (let j = 0; j < str0.length; j++) {
                         handleResult += str0[j]
                     }
-                    
+
                     return '-'+handleResult+'.'+str[1]
                 }
-                
+
             }else if(typeof val =='string'){
                 return val
             }
             else{
                 return 0
-            }           
+            }
         },
         //变成货币格式
         formatCurrency(val){
@@ -785,7 +810,7 @@ export default {
             else{
                 return '-'
             }
-            
+
         }
     }
 }
@@ -800,7 +825,7 @@ export default {
             font-weight: 600;
         }
 
-        .selectePlan{        
+        .selectePlan{
             font-size: 14px;
             font-weight: 700;
             color: #333;
@@ -864,8 +889,8 @@ export default {
             padding: 20px 0;
         }
     }
-    
-    
+
+
 }
 
 </style>