Selaa lähdekoodia

冲突样式修改

zhuxinbo 5 vuotta sitten
vanhempi
commit
7aa5688609

+ 4 - 4
src/views/modules/Statistics/Statistics.vue

@@ -16,10 +16,10 @@
   color: red;
   margin: 0;
 }
-.search .ant-card-body {
+.search-box .ant-card-body {
   padding: 5px 15px;
 }
-.search p {
+.search-box  p {
   display: inline-block;
   border: 1px solid #f2f2f2;
   border-radius: 5px;
@@ -56,7 +56,7 @@
     </a-row>
     <a-row>
       <a-col :span="24">
-        <a-card :bordered="false" class="search">
+        <a-card :bordered="false" class="search-box">
           <p :style="active==1?'color:cornflowerblue;background:#f2f2f2':''" @click="getAdd(1)">今天</p>
           <p :style="active==2?'color:cornflowerblue;background:#f2f2f2':''" @click="getAdd(2)">昨天</p>
           <p :style="active==3?'color:cornflowerblue;background:#f2f2f2':''" @click="getAdd(3)">近一周</p>
@@ -78,7 +78,7 @@
         </a-card>
       </a-col>
       <a-col :span="24">
-        <a-card :bordered="false" class="search">
+        <a-card :bordered="false" class="search-box">
           <p @click="visible = true">对比</p>
         </a-card>
       </a-col>

+ 423 - 423
src/views/modules/appad/modules/AppAdModal.vue

@@ -1,424 +1,424 @@
-<template>
-  <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">
-          <a-tabs :defaultActiveKey="defaultActiveKey">
-            <a-tab-pane tab="视频" key="1">
-              <div class="item">
-                <div class="player">
-                  <video-player
-                    class="vjs-custom-skin"
-                    ref="videoPlayer"
-                    :options="playerOptions"
-                    :playsinline="true"
-                    @play="onPlayerPlay($event)"
-                    @pause="onPlayerPause($event)"
-                    @ended="onPlayerEnded($event)"
-                    @loadeddata="onPlayerLoadeddata($event)"
-                    @waiting="onPlayerWaiting($event)"
-                    @playing="onPlayerPlaying($event)"
-                    @timeupdate="onPlayerTimeupdate($event)"
-                    @canplay="onPlayerCanplay($event)"
-                    @canplaythrough="onPlayerCanplaythrough($event)"
-                    @ready="playerReadied"
-                    @statechanged="playerStateChanged($event)"
-                  ></video-player>
-                </div>
-              </div>
-            </a-tab-pane>
-            <a-tab-pane tab="视频封面" key="2">
-              <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" 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>
-                <div
-                  slot="prevArrow"
-                  slot-scope
-                  class="custom-slick-arrow slick_arrow_left"
-                  style="left: 10px;zIndex: 1"
-                ></div>
-                <div
-                  slot="nextArrow"
-                  slot-scope
-                  class="custom-slick-arrow slick_arrow_right"
-                  style="right: 10px;zIndex: 9"
-                ></div>
-              </a-carousel>
-            </a-tab-pane>
-          </a-tabs>
-        </a-col>
-        <a-col :span="16" class="addetail_right">
-          <div v-if="videoModel != null">
-            <detail-list :col="1">
-              <detail-list-item term="标题">{{videoModel.caption}}</detail-list-item>
-            </detail-list>
-            <detail-list :col="3">
-              <detail-list-item term="快手视频ID">
-                <a :href="[videoModel.share_info]" target="_blank">{{videoModel.photo_id}}</a>
-              </detail-list-item>
-              <detail-list-item term="发布时间">{{videoModel.time}}</detail-list-item>
-              <detail-list-item term="抓取时间">{{videoModel.createTime}}</detail-list-item>
-            </detail-list>
-            <detail-list :col="3">
-              <detail-list-item term="展示数">{{videoModel.view_count}}</detail-list-item>
-              <detail-list-item term="喜欢数">{{videoModel.like_count}}</detail-list-item>
-              <detail-list-item term="评论数">{{videoModel.comment_count}}</detail-list-item>
-            </detail-list>
-          </div>
-          <div v-if="userModel != null">
-            <detail-list :col="3">
-              <detail-list-item term="发布人">
-                <a :href="[userModel.url]" target="_blank">{{userModel.name}}</a>
-              </detail-list-item>
-              <detail-list-item term="广告主">{{userModel.company}}</detail-list-item>
-              <detail-list-item term="推广产品">{{userModel.product}}</detail-list-item>
-            </detail-list>
-            <detail-list :col="3">
-              <detail-list-item term="行业分类">{{userModel.industryCategory}}</detail-list-item>
-              <detail-list-item term="一级行业">{{userModel.firstIndustry}}</detail-list-item>
-              <detail-list-item term="二级行业">{{userModel.secondIndustry}}</detail-list-item>
-            </detail-list>
-          </div>
-          <a-table :columns="goodsColumns" :dataSource="model" :pagination="{ pageSize: 5 }" :scroll="{ y: 300 }">
-            <!-- 图片预览 -->
-            <div slot="ADcoverImagePreview" slot-scope="text, record">
-              <div style="max-width:100px">
-                  <img
-                    style="width:100%;"
-                    :src="record.coverUrl"
-                    @click="coverPreviewShowModal(record,'preview')"
-                  />
-              </div>
-              <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>
-  </a-modal>
-</template>
-<script>
-// custom skin css
-// import '../src/custom-theme.css'
-import 'video.js/dist/video-js.css'
-import { videoPlayer } from 'vue-video-player'
-import DetailList from '@/components/tools/DetailList'
-import PageLayout from '@/components/page/PageLayout'
-import STable from '@/components/table/'
-import { getAction, deleteAction, putAction, postAction } from '@/api/manage'
-
-const DetailListItem = DetailList.Item
-export default {
-  components: {
-    videoPlayer,
-    PageLayout,
-    DetailList,
-    DetailListItem,
-    STable
-  },
-  data() {
-    return {
-      goodsColumns: [
-        {
-          title: '封面ID',
-          dataIndex: 'coverId',
-          key: 'coverId'
-        },
-        {
-          title: '封面预览',
-          //   dataIndex: 'coverUrl',
-          //   key: 'coverUrl',
-          dataIndex: 'ADcoverImagePreview',
-          scopedSlots: { customRender: 'ADcoverImagePreview' }
-        },
-        {
-          title: '创意ID',
-          dataIndex: 'creativeId',
-          key: 'creativeId'
-        },
-        {
-          title: '展示数',
-          dataIndex: 'viewCount',
-          key: 'viewCount'
-        },
-        {
-          title: '喜欢数',
-          dataIndex: 'likeCount',
-          key: 'likeCount'
-        },
-        {
-          title: '评论数',
-          dataIndex: 'commentCount',
-          key: 'commentCount'
-        },
-        {
-          title: '质量分',
-          dataIndex: 'score',
-          key: 'score'
-        },
-        {
-          title: 'App名称',
-          dataIndex: 'appName',
-          key: 'appName'
-        },
-        {
-          title: '发布时间',
-          dataIndex: 'time',
-          key: 'time'
-        }
-      ],
-      userId: 0,
-      photoId: 0,
-      title: '操作',
-      visible: false,
-      model: [],
-      userModel: {},
-      videoModel: {},
-      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 5 }
-      },
-      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
-      },
-      // videojs options
-      playerOptions: {
-        height: '640',
-        width: '360',
-        autoplay: false,
-        muted: true,
-        language: 'en',
-        playbackRates: [0.7, 1.0, 1.5, 2.0],
-        sources: [
-          {
-            type: 'video/mp4',
-            // mp4
-            src: ''
-            // webm
-            // src: "https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm"
-          }
-        ],
-        poster: ''
-      },
-      loadGoodsData: () => {
-        var params = {
-          photoId: this.photoId,
-          userId: this.userId
-        }
-        return getAction('/ctop/adcover/adlist', params).then(res => {
-          this.model = res.result
-          console.log(res.result)
-          return res.result
-        })
-      },
-      defaultActiveKey: '1',
-
-      //   封面预览弹窗
-      coverPreviewVisible: false,
-      coverPreviewMaskStyle: {
-        background: 'rgba(0,0,0,.08)'
-      },
-      coverPreviewUrl: ''
-    }
-  },
-  mounted() {
-    // console.log('this is current player instance object', this.player)
-    setTimeout(() => {
-      console.log('dynamic change options', this.player)
-      // change src
-      // this.playerOptions.sources[0].src = 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm';
-      // change item
-      // this.$set(this.playerOptions.sources, 0, {
-      //   type: "video/mp4",
-      //   src: 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm',
-      // })
-      // change array
-      // this.playerOptions.sources = [{
-      //   type: "video/mp4",
-      //   src: 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm',
-      // }]
-      this.player.muted(false)
-    }, 5000)
-  },
-  computed: {
-    // player() {
-    //   return this.$refs.videoPlayer.player
-    // }
-  },
-  methods: {
-    // listen event
-    onPlayerPlay(player) {
-      // console.log('player play!', player)
-    },
-    onPlayerPause(player) {
-      // console.log('player pause!', player)
-    },
-    onPlayerEnded(player) {
-      // console.log('player ended!', player)
-    },
-    onPlayerLoadeddata(player) {
-      // console.log('player Loadeddata!', player)
-    },
-    onPlayerWaiting(player) {
-      // console.log('player Waiting!', player)
-    },
-    onPlayerPlaying(player) {
-      // console.log('player Playing!', player)
-    },
-    onPlayerTimeupdate(player) {
-      // console.log('player Timeupdate!', player.currentTime())
-    },
-    onPlayerCanplay(player) {
-      // console.log('player Canplay!', player)
-    },
-    onPlayerCanplaythrough(player) {
-      // console.log('player Canplaythrough!', player)
-    },
-    // or listen state event
-    playerStateChanged(playerCurrentState) {
-      // console.log('player current update state', playerCurrentState)
-    },
-    // player is ready
-    playerReadied(player) {
-      // seek to 10s
-      console.log('example player 1 readied', player)
-      // player.currentTime(10)
-      // console.log('example 01: the player is readied', player)
-    },
-    show(photoId, userId) {
-      this.model = []
-      this.userModel = {}
-      this.videoModel = {}
-      this.playerOptions.sources[0].src = ''
-      this.photoId = photoId
-      this.userId = userId
-      this.loadDetail(photoId, userId)
-      this.visible = true
-      this.defaultActiveKey = '1'
-    },
-    loadDetail(photoId, userId) {
-      var params = {
-        photoId: photoId,
-        userId: userId
-      }
-      console.log(params)
-      getAction('/ctop/adcover/detail', params).then(res => {
-        if (res.success) {
-          console.log(res.result)
-          this.userModel = res.result.user
-          this.videoModel = res.result.video
-          this.model = res.result.adlist
-          if (res.result.video != null) {
-            this.playerOptions.sources[0].src = res.result.video.mvUrl
-          }
-
-          // this.dataSource = res.result.records;
-        }
-      })
-    },
-    close() {
-      this.$emit('close')
-      this.visible = false
-      this.defaultActiveKey = '1'
-    },
-    handleCancel() {
-      this.close()
-      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 = 'rgba(0,0,0,0)'
-    },
-    coverPreviewHandleCancel() {
-      this.coverPreviewVisible = false
-      this.coverPreviewUrl = ''
-      this.coverPreviewMaskStyle.background = 'rgba(0,0,0,0)'
-    }
-  }
-}
-</script>
-<style lang="scss">
-.ant-carousel >>> .slick-slide {
-  text-align: center;
-  //   height: 160px;
-  //   line-height: 160px;
-  background: #364d79;
-  overflow: hidden;
-}
-
-.ant-card-body {
-  padding: 0;
-}
-
-.ant-carousel >>> .slick-slide h3 {
-  color: #fff;
-}
-.ant-carousel >>> .custom-slick-arrow {
-  width: 25px;
-  height: 25px;
-  font-size: 25px;
-  color: #fff;
-  background-color: rgba(31, 45, 61, 0.11);
-  opacity: 0.3;
-}
-.ant-carousel >>> .custom-slick-arrow:before {
-  display: none;
-}
-.ant-carousel >>> .custom-slick-arrow:hover {
-  opacity: 0.5;
-}
-.addetail_left {
-  padding-right: 56px;
-  .custom-slick-arrow {
-    width: 40px;
-    height: 40px;
-  }
-  .slick_arrow_left {
-    background: url(../images/arrow_left.png);
-  }
-  .slick_arrow_right {
-    background: url(../images/arrow_right.png);
-  }
-    .slick_arrow_left:hover {
-    background: url(../images/arrow_left.png)!important;
-  }
-  .slick_arrow_right:hover {
-    background: url(../images/arrow_right.png)!important;
-  }
-}
+<template>
+  <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">
+          <a-tabs :defaultActiveKey="defaultActiveKey">
+            <a-tab-pane tab="视频" key="1">
+              <div class="item">
+                <div class="player">
+                  <video-player
+                    class="vjs-custom-skin"
+                    ref="videoPlayer"
+                    :options="playerOptions"
+                    :playsinline="true"
+                    @play="onPlayerPlay($event)"
+                    @pause="onPlayerPause($event)"
+                    @ended="onPlayerEnded($event)"
+                    @loadeddata="onPlayerLoadeddata($event)"
+                    @waiting="onPlayerWaiting($event)"
+                    @playing="onPlayerPlaying($event)"
+                    @timeupdate="onPlayerTimeupdate($event)"
+                    @canplay="onPlayerCanplay($event)"
+                    @canplaythrough="onPlayerCanplaythrough($event)"
+                    @ready="playerReadied"
+                    @statechanged="playerStateChanged($event)"
+                  ></video-player>
+                </div>
+              </div>
+            </a-tab-pane>
+            <a-tab-pane tab="视频封面" key="2">
+              <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" 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>
+                <div
+                  slot="prevArrow"
+                  slot-scope
+                  class="custom-slick-arrow slick_arrow_left"
+                  style="left: 10px;zIndex: 1"
+                ></div>
+                <div
+                  slot="nextArrow"
+                  slot-scope
+                  class="custom-slick-arrow slick_arrow_right"
+                  style="right: 10px;zIndex: 9"
+                ></div>
+              </a-carousel>
+            </a-tab-pane>
+          </a-tabs>
+        </a-col>
+        <a-col :span="16" class="addetail_right">
+          <div v-if="videoModel != null">
+            <detail-list :col="1">
+              <detail-list-item term="标题">{{videoModel.caption}}</detail-list-item>
+            </detail-list>
+            <detail-list :col="3">
+              <detail-list-item term="快手视频ID">
+                <a :href="[videoModel.share_info]" target="_blank">{{videoModel.photo_id}}</a>
+              </detail-list-item>
+              <detail-list-item term="发布时间">{{videoModel.time}}</detail-list-item>
+              <detail-list-item term="抓取时间">{{videoModel.createTime}}</detail-list-item>
+            </detail-list>
+            <detail-list :col="3">
+              <detail-list-item term="展示数">{{videoModel.view_count}}</detail-list-item>
+              <detail-list-item term="喜欢数">{{videoModel.like_count}}</detail-list-item>
+              <detail-list-item term="评论数">{{videoModel.comment_count}}</detail-list-item>
+            </detail-list>
+          </div>
+          <div v-if="userModel != null">
+            <detail-list :col="3">
+              <detail-list-item term="发布人">
+                <a :href="[userModel.url]" target="_blank">{{userModel.name}}</a>
+              </detail-list-item>
+              <detail-list-item term="广告主">{{userModel.company}}</detail-list-item>
+              <detail-list-item term="推广产品">{{userModel.product}}</detail-list-item>
+            </detail-list>
+            <detail-list :col="3">
+              <detail-list-item term="行业分类">{{userModel.industryCategory}}</detail-list-item>
+              <detail-list-item term="一级行业">{{userModel.firstIndustry}}</detail-list-item>
+              <detail-list-item term="二级行业">{{userModel.secondIndustry}}</detail-list-item>
+            </detail-list>
+          </div>
+          <a-table :columns="goodsColumns" :dataSource="model" :pagination="{ pageSize: 5 }" :scroll="{ y: 300 }">
+            <!-- 图片预览 -->
+            <div slot="ADcoverImagePreview" slot-scope="text, record">
+              <div style="max-width:100px">
+                  <img
+                    style="width:100%;"
+                    :src="record.coverUrl"
+                    @click="coverPreviewShowModal(record,'preview')"
+                  />
+              </div>
+              <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>
+  </a-modal>
+</template>
+<script>
+// custom skin css
+// import '../src/custom-theme.css'
+import 'video.js/dist/video-js.css'
+import { videoPlayer } from 'vue-video-player'
+import DetailList from '@/components/tools/DetailList'
+import PageLayout from '@/components/page/PageLayout'
+import STable from '@/components/table/'
+import { getAction, deleteAction, putAction, postAction } from '@/api/manage'
+
+const DetailListItem = DetailList.Item
+export default {
+  components: {
+    videoPlayer,
+    PageLayout,
+    DetailList,
+    DetailListItem,
+    STable
+  },
+  data() {
+    return {
+      goodsColumns: [
+        {
+          title: '封面ID',
+          dataIndex: 'coverId',
+          key: 'coverId'
+        },
+        {
+          title: '封面预览',
+          //   dataIndex: 'coverUrl',
+          //   key: 'coverUrl',
+          dataIndex: 'ADcoverImagePreview',
+          scopedSlots: { customRender: 'ADcoverImagePreview' }
+        },
+        {
+          title: '创意ID',
+          dataIndex: 'creativeId',
+          key: 'creativeId'
+        },
+        {
+          title: '展示数',
+          dataIndex: 'viewCount',
+          key: 'viewCount'
+        },
+        {
+          title: '喜欢数',
+          dataIndex: 'likeCount',
+          key: 'likeCount'
+        },
+        {
+          title: '评论数',
+          dataIndex: 'commentCount',
+          key: 'commentCount'
+        },
+        {
+          title: '质量分',
+          dataIndex: 'score',
+          key: 'score'
+        },
+        {
+          title: 'App名称',
+          dataIndex: 'appName',
+          key: 'appName'
+        },
+        {
+          title: '发布时间',
+          dataIndex: 'time',
+          key: 'time'
+        }
+      ],
+      userId: 0,
+      photoId: 0,
+      title: '操作',
+      visible: false,
+      model: [],
+      userModel: {},
+      videoModel: {},
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      // videojs options
+      playerOptions: {
+        height: '640',
+        width: '360',
+        autoplay: false,
+        muted: true,
+        language: 'en',
+        playbackRates: [0.7, 1.0, 1.5, 2.0],
+        sources: [
+          {
+            type: 'video/mp4',
+            // mp4
+            src: ''
+            // webm
+            // src: "https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm"
+          }
+        ],
+        poster: ''
+      },
+      loadGoodsData: () => {
+        var params = {
+          photoId: this.photoId,
+          userId: this.userId
+        }
+        return getAction('/ctop/adcover/adlist', params).then(res => {
+          this.model = res.result
+          console.log(res.result)
+          return res.result
+        })
+      },
+      defaultActiveKey: '1',
+
+      //   封面预览弹窗
+      coverPreviewVisible: false,
+      coverPreviewMaskStyle: {
+        background: 'rgba(0,0,0,.08)'
+      },
+      coverPreviewUrl: ''
+    }
+  },
+  mounted() {
+    // console.log('this is current player instance object', this.player)
+    setTimeout(() => {
+      console.log('dynamic change options', this.player)
+      // change src
+      // this.playerOptions.sources[0].src = 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm';
+      // change item
+      // this.$set(this.playerOptions.sources, 0, {
+      //   type: "video/mp4",
+      //   src: 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm',
+      // })
+      // change array
+      // this.playerOptions.sources = [{
+      //   type: "video/mp4",
+      //   src: 'https://cdn.theguardian.tv/webM/2015/07/20/150716YesMen_synd_768k_vp8.webm',
+      // }]
+      this.player.muted(false)
+    }, 5000)
+  },
+  computed: {
+    // player() {
+    //   return this.$refs.videoPlayer.player
+    // }
+  },
+  methods: {
+    // listen event
+    onPlayerPlay(player) {
+      // console.log('player play!', player)
+    },
+    onPlayerPause(player) {
+      // console.log('player pause!', player)
+    },
+    onPlayerEnded(player) {
+      // console.log('player ended!', player)
+    },
+    onPlayerLoadeddata(player) {
+      // console.log('player Loadeddata!', player)
+    },
+    onPlayerWaiting(player) {
+      // console.log('player Waiting!', player)
+    },
+    onPlayerPlaying(player) {
+      // console.log('player Playing!', player)
+    },
+    onPlayerTimeupdate(player) {
+      // console.log('player Timeupdate!', player.currentTime())
+    },
+    onPlayerCanplay(player) {
+      // console.log('player Canplay!', player)
+    },
+    onPlayerCanplaythrough(player) {
+      // console.log('player Canplaythrough!', player)
+    },
+    // or listen state event
+    playerStateChanged(playerCurrentState) {
+      // console.log('player current update state', playerCurrentState)
+    },
+    // player is ready
+    playerReadied(player) {
+      // seek to 10s
+      console.log('example player 1 readied', player)
+      // player.currentTime(10)
+      // console.log('example 01: the player is readied', player)
+    },
+    show(photoId, userId) {
+      this.model = []
+      this.userModel = {}
+      this.videoModel = {}
+      this.playerOptions.sources[0].src = ''
+      this.photoId = photoId
+      this.userId = userId
+      this.loadDetail(photoId, userId)
+      this.visible = true
+      this.defaultActiveKey = '1'
+    },
+    loadDetail(photoId, userId) {
+      var params = {
+        photoId: photoId,
+        userId: userId
+      }
+      console.log(params)
+      getAction('/ctop/adcover/detail', params).then(res => {
+        if (res.success) {
+          console.log(res.result)
+          this.userModel = res.result.user
+          this.videoModel = res.result.video
+          this.model = res.result.adlist
+          if (res.result.video != null) {
+            this.playerOptions.sources[0].src = res.result.video.mvUrl
+          }
+
+          // this.dataSource = res.result.records;
+        }
+      })
+    },
+    close() {
+      this.$emit('close')
+      this.visible = false
+      this.defaultActiveKey = '1'
+    },
+    handleCancel() {
+      this.close()
+      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 = 'rgba(0,0,0,0)'
+    },
+    coverPreviewHandleCancel() {
+      this.coverPreviewVisible = false
+      this.coverPreviewUrl = ''
+      this.coverPreviewMaskStyle.background = 'rgba(0,0,0,0)'
+    }
+  }
+}
+</script>
+<style lang="scss">
+.ant-carousel >>> .slick-slide {
+  text-align: center;
+  //   height: 160px;
+  //   line-height: 160px;
+  background: #364d79;
+  overflow: hidden;
+}
+
+.ad_cover_container .ant-card-body {
+  padding: 0;
+}
+
+.ant-carousel >>> .slick-slide h3 {
+  color: #fff;
+}
+.ant-carousel >>> .custom-slick-arrow {
+  width: 25px;
+  height: 25px;
+  font-size: 25px;
+  color: #fff;
+  background-color: rgba(31, 45, 61, 0.11);
+  opacity: 0.3;
+}
+.ant-carousel >>> .custom-slick-arrow:before {
+  display: none;
+}
+.ant-carousel >>> .custom-slick-arrow:hover {
+  opacity: 0.5;
+}
+.addetail_left {
+  padding-right: 56px;
+  .custom-slick-arrow {
+    width: 40px;
+    height: 40px;
+  }
+  .slick_arrow_left {
+    background: url(../images/arrow_left.png);
+  }
+  .slick_arrow_right {
+    background: url(../images/arrow_right.png);
+  }
+    .slick_arrow_left:hover {
+    background: url(../images/arrow_left.png)!important;
+  }
+  .slick_arrow_right:hover {
+    background: url(../images/arrow_right.png)!important;
+  }
+}
 </style>