Przeglądaj źródła

快手创建创意联动修改

刘政和 5 lat temu
rodzic
commit
c93c9a8abc
1 zmienionych plików z 139 dodań i 92 usunięć
  1. 139 92
      src/views/modules/kuaishouapp/creativeCreate.vue

+ 139 - 92
src/views/modules/kuaishouapp/creativeCreate.vue

@@ -67,7 +67,7 @@
 
       <!-- 有单张图,图片上传,图片上传方式 -->
       <a-form-item
-        label="上传封面"
+        label="上传封面(贴片)"
         v-if="showUploadSinglePicType"
         :labelCol="labelCol"
         :wrapperCol="wrapperCol"
@@ -131,7 +131,7 @@
         </div>
       </a-form-item>
 
-      <!-- 有单张图,视频上传 -->
+      <!-- 贴片,上传作品 -->
       <a-form-item
         label="选择作品进行上传(贴片)"
         v-if="hasSinglePicVideoUpload"
@@ -171,7 +171,29 @@
         </div>
       </a-form-item>
 
-      <!-- 有单张图,图片上传 -->
+      <!-- 贴片,本地上传视频,可上传多个视频 -->
+      <a-form-item
+        label="选择本地视频文件进行上传(贴片)"
+        v-if="tiepianVideoLocalUpload"
+        :labelCol="labelCol"
+        :wrapperCol="wrapperCol"
+      >
+        <upload-to-ali
+          v-model="tiepianVideoLocalUploadList"
+          :customDomain="customDomain"
+          preview
+          multiple
+          :region="region"
+          :bucket="bucket"
+          :accept="acceptVideo"
+          :max="10"
+          :size="1024000"
+          :accessKeyId="accessKeyId"
+          :accessKeySecret="accessKeySecret"
+        ></upload-to-ali>
+      </a-form-item>
+
+      <!-- 贴片,上传封面图片 -->
       <a-form-item
         v-if="hasSinglePicCoverUpload"
         label="选择封面(贴片)"
@@ -220,6 +242,28 @@
         </div>
       </a-form-item>
 
+      <!-- 贴片,本地上传图片,可上传多个图片 -->
+      <a-form-item
+        label="选择本地图片进行上传(贴片)"
+        v-if="tiepianImageLocalUpload"
+        :labelCol="labelCol"
+        :wrapperCol="wrapperCol"
+      >
+        <upload-to-ali
+          v-model="tiepianImageLocalUploadList"
+          :customDomain="customDomain"
+          preview
+          multiple
+          :region="region"
+          :bucket="bucket"
+          :accept="acceptImage"
+          :max="10"
+          :size="1024000"
+          :accessKeyId="accessKeyId"
+          :accessKeySecret="accessKeySecret"
+        ></upload-to-ali>
+      </a-form-item>
+
       <a-form-item
         v-if="showImageUpload"
         label="图片上传"
@@ -404,6 +448,10 @@ export default {
       videoUrl: '', // 视频id
       haveSinglePicVideoUrl: [], // 有单张图片的视频id集合
       haveSinglePicimagesList: [], // // 有单张图片的图片集合
+      tiepianVideoLocalUpload: false, // 贴片视频本地上传
+      tiepianVideoLocalUploadList: [], // 贴片视频本地上传id集合
+      tiepianImageLocalUpload: false, // 贴片视频本地上传
+      tiepianImageLocalUploadList: [], // 贴片视频本地上传id集合
       videoList: [],
       radioStyle: {
         // 视频单选样式
@@ -491,7 +539,6 @@ export default {
             let imageVo = this.imageList[j]
             if (imageId == imageVo.id) {
               this.imageUrl.push(imageVo.src)
-              console.log(this.imageUrl)
             }
           }
         }
@@ -503,8 +550,6 @@ export default {
 
     // 上传视频弹窗
     handleOkVideo(e) {
-      console.log(e)
-      console.log(this.videoUrl)
       this.visibleVideo = false
       this.closeAllVideoFun()
     },
@@ -524,8 +569,6 @@ export default {
     },
     showSinglePicModalVideo() {
       this.visibleSinglePicVideo = true
-      console.log('***有单张图片的视频上传***')
-      console.log(this.videoList)
       this.stopOtherVideo()
     },
     handleCancelSinglePicVideo() {
@@ -577,8 +620,6 @@ export default {
     //   有单张图片的上传封面
     showSinglePicCoverModal() {
       this.visibleSinglePicCover = true
-      console.log('***有单张图片的封面上传***')
-      console.log(this.imageList)
     },
     handleOkSinglePicCover() {
       this.haveSinglePicimagesList = []
@@ -593,7 +634,6 @@ export default {
           }
         }
       }
-      console.log(this.haveSinglePicimagesList)
       this.visibleSinglePicCover = false
     },
     handleCancelSinglePicCover() {
@@ -668,7 +708,13 @@ export default {
         this.hasSinglePicCoverUpload = false
         this.showSinglePicType = false
         this.showSinglePicTiepianType = false
-
+        if (this.videoUploadType == '1') {
+          // 选择作品
+          this.localUpload = false
+        } else if (this.videoUploadType == '2') {
+          // 本地上传
+          this.localUpload = true
+        }
         let params = {}
         params.pageSize = '1000'
         params.loginId = this.userInfo().id
@@ -707,17 +753,26 @@ export default {
           this.showImageUpload = false
           this.showUploadImageRadio = false
           this.showUploadSinglePicType = false
-          this.hasSinglePicVideoUpload = true
+          this.tiepianImageLocalUpload = false
           let params = {}
           params.pageSize = '1000'
           params.loginId = this.userInfo().id
           params.positionType = '2'
           if (this.creativeMaterialType == '2') {
             params.materialType = '2'
-          }
-          if (this.creativeMaterialType == '1') {
+          } else if (this.creativeMaterialType == '1') {
             params.materialType = '1'
           }
+          if (this.videoUploadType == '1') {
+            // 选择作品
+            this.tiepianVideoLocalUpload = false
+            this.hasSinglePicVideoUpload = true
+          } else if (this.videoUploadType == '2') {
+            // 本地上传
+            this.tiepianVideoLocalUpload = true
+            this.hasSinglePicVideoUpload = false
+            this.tiepianImageLocalUpload = false
+          }
           getAction(this.url.videoListUrl, params).then(res => {
             if (res.success) {
               this.videoList = res.result.records
@@ -729,16 +784,24 @@ export default {
           })
         } else if (this.creativeMaterialType == '3') {
           // 切换单张图片
-
           this.positionType = '1'
           this.singlePicTiepianType = '1'
           this.showImageUpload = true
           this.showUploadType = false
-          this.localUpload = false
           this.selectVideoUpload = false
           this.showSinglePicType = false
           this.showSinglePicTiepianType = false
           this.hasSinglePicVideoUpload = false
+          this.tiepianVideoLocalUpload = false
+          this.hasSinglePicCoverUpload = false
+          if (this.changeSinglePicType == '1') {
+            // 选择封面
+            this.tiepianImageLocalUpload = false
+          } else if (this.changeSinglePicType == '2') {
+            // 本地上传
+            this.tiepianImageLocalUpload = true
+            this.hasSinglePicCoverUpload = false
+          }
         }
       }
       if (this.creativeMaterialType == '1' || this.creativeMaterialType == '2') {
@@ -748,47 +811,52 @@ export default {
       if (this.creativeMaterialType == '3') {
         // 单张图片时
         this.hasSinglePicVideoUpload = false
-        this.hasSinglePicCoverUpload = true
-        this.localUpload = false
         this.showSinglePicType = true
         this.showUploadSinglePicType = true
         this.showImageUpload = false
         this.showSinglePicTiepianType = true
+        if (this.changeSinglePicType == '1') {
+          this.hasSinglePicCoverUpload = true
+        } else if (this.changeSinglePicType == '2') {
+          this.hasSinglePicCoverUpload = false
+        }
       }
     },
 
     // 视频上传方式
     changeUploadVideo() {
-      if (this.sceneId == '2' && this.videoUploadType == '2') {
+      if (this.sceneId == '2') {
         // 无单张图片时
         this.hasSinglePicVideoUpload = false
         this.hasSinglePicCoverUpload = false
-        this.localUpload = true
-      }
-      if (this.sceneId == '3') {
-        // 有单张图片时
-
-        this.showUploadImageRadio = false
-        // 如果有单张图片,上传作品方式为多选
-        if (this.videoUploadType == 2) {
+        this.tiepianVideoLocalUpload = false
+        this.tiepianImageLocalUpload = false
+        if (this.videoUploadType == '2') {
           this.localUpload = true
-          this.showUploadImageRadio = false
-          this.hasSinglePicVideoUpload = false
-          this.hasSinglePicCoverUpload = false
+          this.selectVideoUpload = false
         } else {
+          this.selectVideoUpload = true
           this.localUpload = false
-          this.hasSinglePicVideoUpload = true
-          this.hasSinglePicCoverUpload = false
         }
-      } else {
-        this.hasSinglePicVideoUpload = false
-        this.hasSinglePicCoverUpload = false
-        if (this.videoUploadType == 2) {
-          this.hasSinglePicCoverUpload = false
-          this.selectVideoUpload = false
+      } else if (this.sceneId == '3') {
+        if (this.materialType == '3') {
+          if (this.changeSinglePicType == '2') {
+            this.hasSinglePicCoverUpload = false
+            this.tiepianImageLocalUpload = true
+          } else if (this.changeSinglePicType == '1') {
+            this.hasSinglePicCoverUpload = true
+            this.tiepianImageLocalUpload = false
+          }
         } else {
-          this.localUpload = false
-          this.selectVideoUpload = true
+          this.showUploadImageRadio = false
+          this.tiepianVideoLocalUpload = false
+          if (this.videoUploadType == '1') {
+            this.hasSinglePicVideoUpload = true
+            this.tiepianVideoLocalUpload = false
+          } else if (this.videoUploadType == '2') {
+            this.hasSinglePicVideoUpload = false
+            this.tiepianVideoLocalUpload = true
+          }
         }
       }
     },
@@ -797,7 +865,6 @@ export default {
       params.localUrl = this.videoUrl
       params.loginId = this.userInfo().id
       postAction(this.url.getDescriptionUrl, params).then(res => {
-        console.log(res)
         if (res.success) {
           this.description = res.result.videoDesc
           this.creativeName = res.result.videoName + '_' + moment().format('YYYY-MM-DD_HH:mm')
@@ -832,12 +899,14 @@ export default {
     // 有单张图片的图片上传方式
     changeSinglePicTypeFun() {
       if (this.changeSinglePicType == '1') {
+        // 选择封面
         this.hasSinglePicCoverUpload = true
-        this.localUpload = false
+        this.tiepianImageLocalUpload = false
       }
       if (this.changeSinglePicType == '2') {
+        // 本地上传
         this.hasSinglePicCoverUpload = false
-        this.localUpload = true
+        this.tiepianImageLocalUpload = true
       }
     },
 
@@ -873,6 +942,8 @@ export default {
             this.showSinglePicTiepianType = false
             this.showUploadSinglePicType = false
             this.positionType = '1'
+            this.tiepianVideoLocalUpload = false
+            this.tiepianImageLocalUpload = false
             let params2 = {}
             params2.pageSize = '1000'
             params2.materialType = '1'
@@ -886,9 +957,6 @@ export default {
                   this.videoUrl = this.videoList[0].localUrl
                   this.description = this.videoList[0].videoDesc
                 }
-
-                console.log('......')
-                console.log(this.videoList)
               }
             })
 
@@ -907,7 +975,6 @@ export default {
             this.selectVideoUpload = false
             this.showLocalImageUpload = false
             this.positionType = '2'
-
             // 如果有单张图片,上传作品方式为多选
             this.hasSinglePicVideoUpload = true
 
@@ -923,16 +990,12 @@ export default {
                 if (this.videoList.length > 0) {
                   this.videoUrl = this.videoList[0].localUrl
                 }
-
-                console.log('......')
-                console.log(this.videoList)
               }
             })
 
             // 图片列表
             getAction(this.url.imageListUrl, params2).then(res => {
               this.imageList = res
-              console.log(res)
             })
           }
         })
@@ -963,12 +1026,10 @@ export default {
       params.accountId = this.accountId
       postAction(this.url.getOptionsUrl, params).then(res => {
         this.options = res
-        console.log(res)
       })
     },
 
     handleSubmit(e) {
-      console.log(this.imageUrl)
       e.preventDefault()
       this.form.validateFields((err, values) => {
         if (!err) {
@@ -978,28 +1039,40 @@ export default {
             params.unitId = this.ids[1]
           }
           params.videoUploadType = this.videoUploadType
-          if (this.videoUploadType == '1') {
-            params.videoUrl = this.videoUrl
-          } else if (this.videoUploadType == '2') {
-            params.videoUrl = this.localUrl
-          }
-          console.log(params.videoUrl)
           params.imageUrl = this.imageUrl
-          console.log(this.imageUrl)
           params.actionBarText = this.actionBarTextDesc
           params.description = this.description
           params.clickTrackUrl = this.clickTrackUrl
           params.creativeName = this.creativeName
-          params.imageType = this.imageType
           params.creativeMaterialType = this.creativeMaterialType
-          params.localImageUrl = this.localImageUrl
           params.impressionUrl = this.impressionUrl
           params.sceneId = this.sceneId
           params.loginId = this.userInfo().id
-          params.haveSinglePicVideoUrl = this.haveSinglePicVideoUrl
-          params.haveSinglePicimagesList = this.haveSinglePicimagesList
           params.positionType = this.positionType
-          console.log(params.haveSinglePicimagesList)
+          if (this.sceneId == '2') {
+            params.imageType = this.imageType
+            params.localImageUrl = this.localImageUrl
+            if (this.videoUploadType == '1') {
+              params.videoUrl = this.videoUrl
+            } else if (this.videoUploadType == '2') {
+              params.videoUrl = this.localUrl
+            }
+          } else if (this.sceneId == '3') {
+            if (this.creativeMaterialType != '3') {
+              if (this.videoUploadType == '1') {
+                params.haveSinglePicVideoUrl = this.haveSinglePicVideoUrl
+              } else if (this.videoUploadType == '2') {
+                params.haveSinglePicVideoUrl = this.tiepianVideoLocalUploadList
+              }
+            } else if (this.creativeMaterialType == '3') {
+              if (this.changeSinglePicType == '1') {
+                params.haveSinglePicimagesList = this.haveSinglePicimagesList
+              } else if (this.changeSinglePicType == '2') {
+                alert(234)
+                params.haveSinglePicimagesList = this.tiepianImageLocalUploadList
+              }
+            }
+          }
           postAction(this.url.creativeUrl, params).then(res => {
             console.log(res)
             if (res.success) {
@@ -1021,32 +1094,6 @@ export default {
         this.accountList = res.result.records
       }
     })
-
-    // 页面初始化 查询竖版视频
-    //   params = {};
-    //   params.pageSize = '1000';
-    //   params.materialType = '1';
-    //   params.loginId = this.userInfo().id;
-    //   getAction(this.url.videoListUrl, params).then((res) => {
-    //     if (res.success) {
-    //       this.videoList = res.result.records
-    //       // 设置默认选中的视频
-    //       if (this.videoList.length > 0) {
-    //         this.videoUrl = this.videoList[0].localUrl;
-    //       }
-
-    //       console.log("......")
-    //       console.log(this.videoList)
-    //     }
-    //   });
-
-    //   // 图片列表
-    //   getAction(this.url.imageListUrl, params).then((res) => {
-
-    //     this.imageList = res
-    //     console.log(res)
-
-    //   });
   }
 }
 </script>