Przeglądaj źródła

头条 自动投放配置项 页面开发

jiayufei 4 lat temu
rodzic
commit
13196a4c0a

+ 47 - 25
src/views/modules/account-config/components/configuration-modal.vue

@@ -335,21 +335,26 @@
                         </div>
                     </a-upload>
                 </a-form-model-item>
-                <a-form-model-item label="卡片标题" prop="shopDesc">
+                <a-form-model-item label="卡片标题" prop="creativeProductDescription">
                     <a-input class="common-input-long" placeholder="请输入卡片标题" v-model="configForm.creativeProductDescription"/>
                 </a-form-model-item>
                 <a-form-model-item label="推广卖点">
                     <a-button type="primary" @click="handleAddOrigin"><a-icon type="plus" />推广卖点</a-button>
                 </a-form-model-item>
                 <div class="adver-position-radio">
-                    <!-- <a-form-model-item
-                        v-for="item in defaultFormList"
+                    <a-form-model-item
+                        v-for="(item, index) in configForm.defaultFormList"
                         :key="item.id"
                         class="examin-form-model"
+                        :prop="'defaultFormList.' + index + '.value'"
+                        :rules="[
+                            {required: true, message: '请输入', trigger: 'blur'},
+                            {min: 1, max: 10, message: '长度位6-9字符', trigger: 'blur'}
+                        ]"
                     >
                         <a-input class="common-input-long" v-model="item.value" placeholder="请输入"/>
                         <a-icon class="examin-form-icon" type="delete" @click="handleDelOrigin(item)"/>
-                    </a-form-model-item> -->
+                    </a-form-model-item>
                 </div>
                 <a-form-model-item label="行动号召">
                     <a-radio-group v-model="configForm.creativeEnablePersonalAction" button-style="solid">
@@ -449,7 +454,6 @@ export default {
                 children: 'child'
             },
             fileList: [],
-            defaultFormList: [],
             isCoverImgDiv: false,
             imageUrl: '',
             creativeTag: [],
@@ -463,23 +467,24 @@ export default {
             wrapperCol: {span: 14},
             rules: {
                 name: [
-                    {required: true, message: 'Please input Activity name', trigger: 'blur'},
-                    {min: 3, max: 5, message: 'Length should be 3 to 5', trigger: 'blur'}
+                    {required: true, message: '请输入', trigger: 'blur'},
+                    {min: 1, max: 10, message: '长度位1-10字符', trigger: 'blur'}
                 ],
                 campaignName: [
                     {required: true, message: '请输入广告组名称', trigger: 'blur'},
-                    {min: 1, max: 100, message: '长度位1-100字符', trigger: 'blur'}
+                    {min: 1, max: 5, message: '长度位1-100字符', trigger: 'blur'}
                 ],
                 adName: [
                     {required: true, message: '请输入广告计划名称', trigger: 'blur'},
                     {min: 1, max: 100, message: '长度位1-100字符', trigger: 'blur'}
                 ],
-                shopDesc: [
+                creativeProductDescription: [
                     {required: true, message: '请输入', trigger: 'blur'},
                     {min: 1, max: 7, message: '长度位1-7字符', trigger: 'blur'}
                 ]
             },
             configForm: {
+                defaultFormList: [],
                 creativeProductSellingPoints: [], // 商品买点
                 adBudgetMode: 'BUDGET_MODE_DAY', // 预算类型
                 adDownloadUrl: '', // 下载链接
@@ -537,27 +542,50 @@ export default {
             }
         };
     },
+    monted() {
+        this.handleInitTable();
+    },
     methods: {
         moment,
+        handleInitTable() {
+            const paramsData = {
+                accountId: this.configForm.acountId
+            };
+            getAction('/ctop/aiBytedanceAdvertiserStrategy/list', paramsData).then(result => {
+                if (result.code === 200) {
+                   console.log(result, 'result--result');
+                }
+                else {
+                    this.$message.error(result.message);
+                }
+            }).catch(error => {
+                console.log(error, 'eeee');
+            });
+        },
         handleLaunchData(date, dateString) {
             this.configForm.launchDateRange = dateString;
         },
         handleBudgetMode(e) {
-            console.log(e, 'eee--ee');
             if (e === 'BUDGET_MODE_TOTAL') {
                 this.configForm.adScheduleType = 'SCHEDULE_START_END';
                 this.$message.warning('请设置投放时间');
             }
         },
         handleDelOrigin(list) {
-            let formData = this.defaultFormList;
-            this.defaultFormList = formData.filter(item => list.id !== item.id);
+            let formData = this.configForm.defaultFormList;
+            this.configForm.defaultFormList = formData.filter(item => list.id !== item.id);
         },
         handleAddOrigin() {
+            if (this.configForm.defaultFormList.length > 10) {
+                this.$message.error('最多可以添加10个卖点');
+                return;
+            }
             const randomNum = new Date().getTime() + Math.ceil(Math.random() * 1000);
-            this.defaultFormList.push({
-                id: randomNum,
-                value: ''
+            this.$nextTick(() => {
+                this.configForm.defaultFormList.push({
+                    id: randomNum,
+                    value: ''
+                });
             });
         },
         handleDownloadLink(e) {
@@ -568,16 +596,10 @@ export default {
             this.isCoverImgDiv = false;
         },
         handleChangeActive() {
-            console.log('划入111');
-            setTimeout(() => {
-                this.isCoverImgDiv = true;
-            }, 100);
+            this.isCoverImgDiv = true;
         },
         handleRemoveActive() {
-            console.log('划出222');
-            setTimeout(() => {
-                this.isCoverImgDiv = false;
-            }, 100);
+            this.isCoverImgDiv = false;
         },
         getBase64(img, callback) {
             const reader = new FileReader();
@@ -670,7 +692,7 @@ export default {
         // },
         handleRelaxSure() {
             let paramsFormData = this.configForm;
-            console.log(this.defaultFormList, 'defaultFormList-defaultFormList-defaultFormList');
+            console.log(this.configForm.defaultFormList, 'defaultFormList-defaultFormList-defaultFormList');
             if (paramsFormData.adverPosition === 'a') {
                 paramsFormData.creativeSmartInventory = 0;
             }
@@ -701,7 +723,7 @@ export default {
                 paramsFormData.adScheduleTime = paramsFormData.scheduleTimeData;
             }
             paramsFormData.creativeProductImageId = '图片ID';
-            paramsFormData.creativeProductSellingPoints = this.defaultFormList;
+            paramsFormData.creativeProductSellingPoints = this.configForm.defaultFormList;
             console.log(paramsFormData, 'paramsFormData-paramsFormData');
             console.log(paramsFormData.launchDateRange, 'paramsFormData.launchDateRange');
             this.$refs.ruleForm.validate(valid => {