Kaynağa Gözat

Merge remote-tracking branch 'origin/master'

xuzuoyun 5 yıl önce
ebeveyn
işleme
deb4e15a08

+ 79 - 18
src/views/modules/appad/modules/AppAdModal.vue

@@ -1,5 +1,12 @@
 <template>
-  <a-modal :title="title" :width="1300" :visible="visible" @cancel="handleCancel" cancelText="关闭">
+  <a-modal
+    :title="title"
+    :width="1300"
+    :visible="visible"
+    @cancel="handleCancel"
+    cancelText="关闭"
+    class="ad_cover_container"
+  >
     <div>
       <a-row>
         <a-col :span="8" class="addetail_left">
@@ -28,14 +35,14 @@
               </div>
             </a-tab-pane>
             <a-tab-pane tab="视频封面" key="2">
-              <a-carousel>
+              <a-carousel class="cover_carousel_con">
                 <div v-if="videoModel != null">
                   <img :src="videoModel.coverUrl" :width="360" />
                 </div>
               </a-carousel>
             </a-tab-pane>
-            <a-tab-pane tab="广告封面" key="3">
-              <a-carousel arrows>
+            <a-tab-pane tab="广告封面" key="3" class="cover_container">
+              <a-carousel arrows class="cover_carousel_con">
                 <div v-for="(item,index) in model" :key="index">
                   <img :src="item.coverUrl" :width="360" />
                 </div>
@@ -44,17 +51,13 @@
                   slot-scope
                   class="custom-slick-arrow slick_arrow_left"
                   style="left: 10px;zIndex: 1"
-                >
-                  <a-icon type="left-circle" />
-                </div>
+                ></div>
                 <div
                   slot="nextArrow"
                   slot-scope
                   class="custom-slick-arrow slick_arrow_right"
                   style="right: 10px;zIndex: 9"
-                >
-                  <a-icon type="right-circle" />
-                </div>
+                ></div>
               </a-carousel>
             </a-tab-pane>
           </a-tabs>
@@ -91,7 +94,29 @@
               <detail-list-item term="二级行业">{{userModel.secondIndustry}}</detail-list-item>
             </detail-list>
           </div>
-          <a-table :columns="goodsColumns" :dataSource="model" :pagination="false"></a-table>
+          <a-table :columns="goodsColumns" :dataSource="model" :pagination="false">
+            <!-- 图片预览 -->
+            <div slot="ADcoverImagePreview" slot-scope="text, record">
+              <img
+                style="width:100px;"
+                :src="record.coverUrl"
+                @click="coverPreviewShowModal(record,'preview')"
+              />
+              <a-modal
+                title="图片预览"
+                v-model="coverPreviewVisible"
+                @ok="coverPreviewHandleOk"
+                @cancel="coverPreviewHandleCancel"
+                :footer="null"
+                :maskStyle="coverPreviewMaskStyle"
+              >
+                <div style="text-align:center;">
+                  <img style="width:350px;" :src="coverPreviewUrl" />
+                </div>
+              </a-modal>
+            </div>
+            <!-- 图片预览 E -->
+          </a-table>
         </a-col>
       </a-row>
     </div>
@@ -125,6 +150,13 @@ export default {
           key: 'coverId'
         },
         {
+          title: '封面预览',
+          //   dataIndex: 'coverUrl',
+          //   key: 'coverUrl',
+          dataIndex: 'ADcoverImagePreview',
+          scopedSlots: { customRender: 'ADcoverImagePreview' }
+        },
+        {
           title: '创意ID',
           dataIndex: 'creativeId',
           key: 'creativeId'
@@ -205,7 +237,14 @@ export default {
           return res.result
         })
       },
-      defaultActiveKey:"1"
+      defaultActiveKey: '1',
+
+      //   封面预览弹窗
+      coverPreviewVisible: false,
+      coverPreviewMaskStyle: {
+        background: 'rgba(0,0,0,.08)'
+      },
+      coverPreviewUrl: ''
     }
   },
   mounted() {
@@ -281,7 +320,7 @@ export default {
       this.userId = userId
       this.loadDetail(photoId, userId)
       this.visible = true
-      this.defaultActiveKey = "1"
+      this.defaultActiveKey = '1'
     },
     loadDetail(photoId, userId) {
       var params = {
@@ -306,20 +345,42 @@ export default {
     close() {
       this.$emit('close')
       this.visible = false
-      this.defaultActiveKey = "1";
+      this.defaultActiveKey = '1'
     },
     handleCancel() {
       this.close()
-      this.defaultActiveKey = "1";
+      this.defaultActiveKey = '1'
+    },
+
+    // 封面预览弹窗
+    coverPreviewShowModal(record) {
+      this.coverPreviewVisible = true
+      this.coverPreviewUrl = record.coverUrl
+      this.coverPreviewMaskStyle.background = 'rgba(0,0,0,.08)'
+    },
+    coverPreviewHandleOk() {
+      this.coverPreviewVisible = false
+      this.coverPreviewMaskStyle.background = 0
+    },
+    coverPreviewHandleCancel() {
+      this.coverPreviewVisible = false
+      this.coverPreviewUrl = ''
+      this.coverPreviewMaskStyle.background = 0
     }
   }
 }
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
+.ad_cover_container {
+  .ant-modal-body {
+    max-height: 650px;
+    overflow-y: scroll;
+  }
+}
 .ant-carousel >>> .slick-slide {
   text-align: center;
-  height: 160px;
-  line-height: 160px;
+  //   height: 160px;
+  //   line-height: 160px;
   background: #364d79;
   overflow: hidden;
 }

+ 1 - 1
src/views/modules/kuaishouapp/KuaiShouImageList.vue

@@ -183,7 +183,7 @@ export default {
           }
         },
         {
-          title: '图片保存地址',
+          title: '图片预览',
           align: 'center',
           // dataIndex: 'localUrl',
           dataIndex: 'coverImagePreview',