zhuxinbo há 5 anos atrás
pai
commit
7a041e85a3

+ 175 - 125
src/views/modules/Statistics/allDetail.vue

@@ -1,18 +1,25 @@
-<style>
-</style>
+<style></style>
 <template>
   <div class="admin-detail">
     <a-row :gutter="10" style="margin-top:10px">
       <a-col :span="24">
         <a-card style="width:100%;">
-          <a-table :columns="columns" :dataSource="dataList" bordered :loading="loading" size="middle"
-            :pagination="false">
+          <a-table
+            :columns="columns"
+            :dataSource="dataList"
+            bordered
+            :loading="loading"
+            size="middle"
+            :pagination="false"
+          >
             <span slot-scope="text" slot="url">
               <video class="video" :src="text" controls="controls" style="height:200px">
                 您的浏览器不支持 video 标签。
               </video>
             </span>
-
+            <span slot="videoRoleCode" slot-scope="text">
+              {{ text | roleName }}
+            </span>
           </a-table>
         </a-card>
       </a-col>
@@ -21,145 +28,189 @@
 </template>
 
 <script>
-  import ChartCard from '@/components/ChartCard'
-  import ACol from 'ant-design-vue/es/grid/Col'
-  import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
-  import MiniArea from '@/components/chart/MiniArea'
-  import MiniBar from '@/components/chart/MiniBar'
-  import MiniProgress from '@/components/chart/MiniProgress'
-  import RankList from '@/components/chart/RankList'
-  import Bar from '@/components/chart/Bar'
-  import LineChartMultid from '@/components/chart/LineChartMultid'
-  import HeadInfo from '@/components/tools/HeadInfo.vue'
+import ChartCard from '@/components/ChartCard'
+import ACol from 'ant-design-vue/es/grid/Col'
+import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
+import MiniArea from '@/components/chart/MiniArea'
+import MiniBar from '@/components/chart/MiniBar'
+import MiniProgress from '@/components/chart/MiniProgress'
+import RankList from '@/components/chart/RankList'
+import Bar from '@/components/chart/Bar'
+import LineChartMultid from '@/components/chart/LineChartMultid'
+import HeadInfo from '@/components/tools/HeadInfo.vue'
 
-  import Trend from '@/components/Trend'
+import Trend from '@/components/Trend'
 
-  import {
-    getAction,
-    postAction
-  } from '@/api/manage'
-  import {
-    mapGetters
-  } from 'vuex'
+import { getAction, postAction } from '@/api/manage'
+import { mapGetters } from 'vuex'
 
-  import qs from 'qs'
+import qs from 'qs'
 
-  const barData = []
-  for (let i = 0; i < 12; i += 1) {
-    barData.push({
-      x: `${i + 1}月`,
-      y: Math.floor(Math.random() * 1000) + 200
-    })
-  }
+const barData = []
+for (let i = 0; i < 12; i += 1) {
+  barData.push({
+    x: `${i + 1}月`,
+    y: Math.floor(Math.random() * 1000) + 200
+  })
+}
 
-  const columns = [{
-      title: '视频',
-      dataIndex: 'url',
-      key: 'url',
-      align: 'center',
-      scopedSlots: {
-        customRender: 'url'
-      },
-      width: 200
-    },
-    {
-      title: '素材名称',
-      dataIndex: 'materialName',
-      key: 'materialName',
-      align: 'center'
-    },
-    {
-      title: '水印素材名称',
-      dataIndex: 'watermarkMaterialName',
-      key: 'watermarkMaterialName',
-      align: 'center'
+const columns = [
+  {
+    title: '视频',
+    dataIndex: 'url',
+    key: 'url',
+    align: 'center',
+    scopedSlots: {
+      customRender: 'url'
     },
-    {
-      title: 'md5',
-      dataIndex: 'code',
-      key: 'code',
-      align: 'center'
+    width: 200
+  },
+  {
+    title: '素材名称',
+    dataIndex: 'materialName',
+    key: 'materialName',
+    align: 'center'
+  },
+  {
+    title: '本职角色',
+    dataIndex: 'originRoleName',
+    key: 'originRoleName',
+    align: 'center'
+  },
+  {
+    title: '担任角色',
+    dataIndex: 'videoRoleCode',
+    key: 'videoRoleCode',
+    scopedSlots: {
+      customRender: 'videoRoleCode'
     },
-  ]
-  // 账户名、项目名、优化师姓名、当季消耗、授权名称
-  const columnsYou = [{
+    align: 'center'
+  },
+  {
+    title: '设计师',
+    dataIndex: 'realname',
+    key: 'realname',
+    align: 'center'
+  }
+]
+// 账户名、项目名、优化师姓名、当季消耗、授权名称
+const columnsYou = [
+  {
     title: '账户',
     dataIndex: 'advertiserName',
     key: 'advertiserName',
-    align: 'center',
-  }, {
+    align: 'center'
+  },
+  {
     title: '项目',
     dataIndex: 'projectName',
     key: 'projectName',
-    align: 'center',
-  }, {
+    align: 'center'
+  },
+  {
     title: '优化师',
     dataIndex: 'userName',
     key: 'userName',
-    align: 'center',
-  }, {
+    align: 'center'
+  },
+  {
     title: '当季消耗',
     dataIndex: 'totalCost',
     key: 'totalCost',
-    align: 'center',
-  }, {
+    align: 'center'
+  },
+  {
     title: '授权名称',
     dataIndex: 'authName',
     key: 'authName',
-    align: 'center',
-  }]
-  export default {
-    name: 'admin-info',
-    components: {
-      ATooltip,
-      ACol,
-    },
+    align: 'center'
+  }
+]
+export default {
+  name: 'admin-info',
+  components: {
+    ATooltip,
+    ACol
+  },
 
-    data: function () {
-      return {
-        title: '工作台',
-        loginfo: {},
-        barData,
-        visitInfo: [],
-        visitFields: ['ip', 'visit'],
-        loading: false,
-        rankList: [],
-        tabListNoTitle: [{
-            key: 'kuaishou',
-            tab: '快手'
-          },
-          {
-            key: 'toutiao',
-            tab: '头条'
-          }
-        ],
-        noTitleKey: 'kuaishou',
-        a: '',
-        columns: columns,
-        dataList: [],
+  data: function() {
+    return {
+      title: '工作台',
+      loginfo: {},
+      barData,
+      visitInfo: [],
+      visitFields: ['ip', 'visit'],
+      loading: false,
+      rankList: [],
+      tabListNoTitle: [
+        {
+          key: 'kuaishou',
+          tab: '快手'
+        },
+        {
+          key: 'toutiao',
+          tab: '头条'
+        }
+      ],
+      noTitleKey: 'kuaishou',
+      a: '',
+      columns: columns,
+      dataList: []
+    }
+  },
+  methods: {
+    ...mapGetters(['nickname', 'avatar', 'userInfo'])
+  },
+  filters: {
+    roleName: function(value) {
+      var status = {
+        clip: '剪辑',
+        shot: '拍摄',
+        plan: '策划',
+        plane: '平面'
       }
-    },
-    methods: {
-      ...mapGetters(['nickname', 'avatar', 'userInfo']),
-    },
-    created() {
-      var userId = localStorage.getItem('detailUserId')
-      var appType = localStorage.getItem('appType') == 'kuaishou' ? 2 : 1
-      var type = localStorage.getItem('roleData')
-      var weekDate = localStorage.getItem('weekDate').split('~')
+      return status[value]
+    }
+  },
+  created() {
+    var userId = localStorage.getItem('detailUserId')
+    var appType = localStorage.getItem('appType') == 'kuaishou' ? 2 : 1
+    var type = localStorage.getItem('roleData')
+    var weekDate = localStorage.getItem('weekDate').split('~')
+    var typeAll = localStorage.getItem('typeAll')
+    if (typeAll == 'all') {
+      this.columns = columns
+      postAction('/ctop/performance2/getVideoList', {
+        startDate: weekDate[0],
+        endDate: weekDate[1],
+        userId: userId,
+        appType: appType
+      }).then(res => {
+        if (res.success) {
+          this.dataList = res.result.map((item, index) => {
+            return {
+              ...item,
+              key: index
+            }
+          })
+        } else {
+          this.$message.error(res.message)
+        }
+      })
+    } else {
       if (type == 1) {
         this.columns = columns
         postAction('/ctop/performance2/getWeekEffiVideoList', {
-          "startDate": weekDate[0],
-          "endDate": weekDate[1],
-          "userId": userId,
-          "appType": appType
+          startDate: weekDate[0],
+          endDate: weekDate[1],
+          userId: userId,
+          appType: appType
         }).then(res => {
           if (res.success) {
             this.dataList = res.result.map((item, index) => {
               return {
                 ...item,
-                key: index,
+                key: index
               }
             })
           } else {
@@ -170,16 +221,16 @@
         this.columns = columnsYou
         if (appType == 2) {
           postAction('/ctop/performance2/getKuaiShouYouhuaAccountsList', {
-            "startDate": weekDate[0],
-            "endDate": weekDate[1],
-            "userId": userId,
-            "appType": appType
+            startDate: weekDate[0],
+            endDate: weekDate[1],
+            userId: userId,
+            appType: appType
           }).then(res => {
             if (res.success) {
               this.dataList = res.result.map((item, index) => {
                 return {
                   ...item,
-                  key: index,
+                  key: index
                 }
               })
             } else {
@@ -188,16 +239,16 @@
           })
         } else {
           postAction('/ctop/performance2/getToutiaoYouhuaAccountsList', {
-            "startDate": weekDate[0],
-            "endDate": weekDate[1],
-            "userId": userId,
-            "appType": appType
+            startDate: weekDate[0],
+            endDate: weekDate[1],
+            userId: userId,
+            appType: appType
           }).then(res => {
             if (res.success) {
               this.dataList = res.result.map((item, index) => {
                 return {
                   ...item,
-                  key: index,
+                  key: index
                 }
               })
             } else {
@@ -205,9 +256,8 @@
             }
           })
         }
-
       }
-
     }
   }
-</script>
+}
+</script>

+ 581 - 183
src/views/modules/material/videoMaterial.vue

@@ -1,4 +1,7 @@
-<style>
+<style lang="scss">
+.downLoad .ant-form-item-control-wrapper {
+  width: 70%;
+}
 #material-card .ant-tabs-tab {
   border: 1px solid gainsboro !important;
 }
@@ -15,8 +18,69 @@
 .detail .ant-form-item {
   margin-bottom: 10px !important;
 }
+.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;
+}
+.content {
+  display: flex !important;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  .slick-dots {
+    bottom: 55px;
+  }
+}
+.video-content {
+  width: 50%;
+  padding: 10px;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  border-right: 1px solid #f2f2f2;
+}
+.cover_carousel_con .slick-dots {
+  bottom: 55px;
+}
 </style>
 <style lang="scss" scoped>
+.tag-video {
+  position: absolute;
+  right: 0px;
+  top: 8px;
+  padding: 4px;
+  border-radius: 2px;
+  line-height: 16px;
+  font-size: 12px;
+  color: #fff;
+  background-color: rgba(0, 0, 0, 0.3);
+}
 .home-item {
   overflow: hidden;
 }
@@ -45,7 +109,7 @@
 //         width:70%
 //     }
 // } /*>=1100的设备*/
-@media (min-width: 1280px) {
+@media (min-width: 1600px) {
   .home-item {
     border-style: solid;
     border-width: 1px;
@@ -170,6 +234,28 @@
 a {
   font-size: 14px;
 }
+.actor-photo-list {
+  display: flex;
+  padding-left: 0;
+  li {
+    width: 25%;
+    margin: 10px;
+    position: relative;
+    height: 250px;
+    border: 1px solid #f2f2f2;
+    list-style: none;
+    img,
+    video {
+      width: 100%;
+      margin-top: auto;
+      margin-bottom: auto;
+      top: 0;
+      bottom: 0;
+      position: absolute;
+      max-height: 250px;
+    }
+  }
+}
 </style>
 <template>
   <a-card :bordered="false">
@@ -180,21 +266,6 @@ a {
           <a-col :md="8" :sm="8">
             <!-- <a-form-item label="项目名称"> -->
             <selectTable :projectId.sync="queryParam.projectId"></selectTable>
-            <!-- <a-select
-                placeholder="请输入项目名称"
-                showSearch
-                optionFilterProp="children"
-                :filterOption="filterOption"
-                v-model="queryParam.projectId"
-                @change="getList"
-              >
-                <a-select-option :value="item.projectId" v-for="item of dataElse" :key="item.id">
-                  {{ item.projectName }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{
-                    item.mediaId == '1' ? '头条' : '快手'
-                  }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ item.advertiserName }}
-                </a-select-option>
-              </a-select> -->
-            <!-- </a-form-item> -->
           </a-col>
           <a-col :md="8" :sm="8">
             <a-form-item label="时间选择">
@@ -467,6 +538,12 @@ a {
                       通过审核</a
                     >
                   </a-popconfirm>
+                  <a
+                    v-if="role.roleCode == 'plane' || role.roleCode == 'admin'"
+                    style="margin-left:20px"
+                    @click="addImage(items)"
+                    >添加封面</a
+                  >
                   <a-checkbox :value="items.id" style="float:right" v-show="active == '1'"></a-checkbox>
                 </span>
               </div>
@@ -489,7 +566,43 @@ a {
         </div>
       </a-tab-pane>
     </a-tabs>
-
+    <a-modal title="封面上传" v-model="addImageVisible">
+      <template slot="footer">
+        <a-button key="back" @click="closeImage">取消</a-button>
+        <a-button key="submit" type="primary" @click="handleOkImage">
+          确定
+        </a-button>
+      </template>
+      <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="" class="add-image-material">
+        <upload-to-ali
+          style="width:100%"
+          v-model="urlListImage.url"
+          :customDomain="customDomain"
+          :multiple="true"
+          preview
+          :region="region"
+          :bucket="bucket"
+          :accept="acceptImage"
+          :max="10"
+          :size="1024000"
+          :accessKeyId="accessKeyId"
+          :accessKeySecret="accessKeySecret"
+          :before-upload="fileWater"
+          :dir="dirImg"
+          @loaded="overUploadImage"
+        ></upload-to-ali>
+        <span v-if="material.filter(item => item == false).length > 0 && urlListImage.url.length > 0" style="color:red"
+          >上传素材的尺寸不符,请修改(<span v-for="(item, index) of material" :key="index" v-show="!item"
+            >第{{ index + 1 }}张</span
+          >出错)</span
+        >
+        <span
+          v-else-if="urlListImage.url.length > 0 && material.filter(item => item == false).length == 0"
+          style="color:green"
+          >上传成功</span
+        >
+      </a-form-item>
+    </a-modal>
     <a-modal title="数据详情" v-model="showDataBool" :footer="null">
       <div class="bhShow" style="display:flex;justify-content:space-between;height:400px">
         <div v-if="douyinData" class="show-data">
@@ -568,6 +681,43 @@ a {
             上传成功
           </span>
         </a-form-item>
+        <a-form-item
+          :label-col="labelCol"
+          :wrapper-col="wrapperCol"
+          label="封面上传"
+          class="add-image-material"
+          v-if="getData('projectId')"
+        >
+          <upload-to-ali
+            style="width:160%"
+            v-model="urlListImage.url"
+            :customDomain="customDomain"
+            :multiple="true"
+            preview
+            :region="region"
+            :bucket="bucket"
+            :accept="acceptImage"
+            :max="10"
+            :size="1024000"
+            :accessKeyId="accessKeyId"
+            :accessKeySecret="accessKeySecret"
+            :before-upload="fileWater"
+            :dir="dirImg"
+            @loaded="overUploadImage"
+          ></upload-to-ali>
+          <span
+            v-if="material.filter(item => item == false).length > 0 && urlListImage.url.length > 0"
+            style="color:red"
+            >上传素材的尺寸不符,请修改(<span v-for="(item, index) of material" :key="index" v-show="!item"
+              >第{{ index + 1 }}张</span
+            >出错)</span
+          >
+          <span
+            v-else-if="urlListImage.url.length > 0 && material.filter(item => item == false).length == 0"
+            style="color:green"
+            >上传成功</span
+          >
+        </a-form-item>
         <div>
           <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="策划" v-if="activeKey == 'video'">
             <a-select
@@ -658,182 +808,270 @@ a {
     </a-modal>
 
     <a-modal title="素材详情" v-model="visibleDetail" width="70%" :footer="null">
-      <div style="width:100%">
+      <div style="width:100%;height:35px">
         <a-button type="primary" @click="setSuccess" style="float:right">
           {{ excellent == 0 ? '标记为优秀素材' : '取消标记' }}
         </a-button>
       </div>
       <div style="display:flex;height:700px">
         <div
+          class="video-content"
           style="width:50%;padding:10px;box-sizing:border-box;display:flex;justify-content:center;border-right:1px solid #f2f2f2"
         >
-          <video class="video" :src="showUrl" controls="controls" style="width:100%" controlsList="nodownload">
+          <video class="video" :src="showUrl" controls="controls" style="height:50%" controlsList="nodownload">
             您的浏览器不支持 video 标签。
           </video>
+          <div class="downLoad" style="height:50%;overflow:auto">
+            <ul class="actor-photo-list" :style="{ width: 25 * model.length + '%' }" v-if="model.length > 0">
+              <a-checkbox-group
+                v-model="checkArrImage"
+                style="width:100%;  display: flex;padding-left: 0;"
+                @change="onChangeCheck"
+              >
+                <li v-for="(item, index) of model" :key="index">
+                  <a-checkbox :value="item" style="position:absolute;z-index: 100"></a-checkbox
+                  ><img class="video" :src="item.url" @click="coverPreviewShowModal(item, index)" />
+                  <span class="tag-video">{{
+                    item.status == 0 ? '未审核' : item.status == 1 ? '已批准' : '已驳回'
+                  }}</span>
+                </li>
+              </a-checkbox-group>
+            </ul>
+            <div v-else style="height:100%;display:flex;justify-content: center;align-items: center;">
+              <a-empty />
+            </div>
+          </div>
         </div>
+        <a-modal title="图片预览" v-model="coverPreviewVisible" :footer="null">
+          <a-carousel arrows class="cover_carousel_con">
+            <div v-for="(item, index) in model" :key="index" class="content">
+              <img :src="item.url" :width="300" />
+              <div style="margin-top:10px">
+                <a-button type="primary">
+                  通过审核
+                </a-button>
+                <a-divider type="vertical" />
+                <a-button type="primary">驳回</a-button>
+              </div>
+            </div>
+            <a-icon
+              type="left-circle"
+              slot="prevArrow"
+              slot-scope
+              style="left: 10px;zIndex: 9;font-size:30px;color:black"
+            />
+            <a-icon
+              type="right-circle"
+              slot="nextArrow"
+              slot-scope
+              style="right: 10px;zIndex: 9;font-size:30px;color:black"
+            />
+          </a-carousel>
+        </a-modal>
         <div style="flex:3;padding:10px;box-sizing:border-box;">
-          <a-form v-if="detail" class="detail">
-            <div v-if="detail.parameter">
-              <a-form-item
-                label="视频时长"
-                :label-col="{ span: 6 }"
-                :wrapper-col="{ span: 18 }"
-                v-if="detail.parameter.second"
-              >
+          <a-form v-if="detail" class="detail ant-advanced-search-form" layout="inline">
+            <div v-if="detail.parameter" style="display:flex;">
+              <a-form-item label="视频时长" v-if="detail.parameter.second" style="flex:1">
                 {{ detail.parameter.second }}秒
               </a-form-item>
-              <a-form-item
-                label="尺寸"
-                :label-col="{ span: 6 }"
-                :wrapper-col="{ span: 18 }"
-                v-if="detail.parameter.width"
-              >
+              <a-form-item label="尺寸" style="flex:1" v-if="detail.parameter.width">
                 {{ detail.parameter.width }}*{{ detail.parameter.height }}
               </a-form-item>
-              <a-form-item
-                label="大小"
-                :label-col="{ span: 6 }"
-                :wrapper-col="{ span: 18 }"
-                v-if="detail.parameter.size"
-              >
+              <a-form-item label="大小" style="flex:1" v-if="detail.parameter.size">
                 {{ detail.parameter.size }}
               </a-form-item>
             </div>
-            <div v-if="detail.ascription">
-              <a-form-item label="策划" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
+            <div v-if="detail.ascription" style="display:flex;">
+              <a-form-item label="策划" style="flex:1">
                 {{ detail.ascription.planName }}
               </a-form-item>
-              <a-form-item label="拍摄" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
+              <a-form-item label="拍摄" style="flex:1">
                 {{ detail.ascription.shotName }}
               </a-form-item>
-              <a-form-item
-                label="剪辑"
-                :label-col="{ span: 6 }"
-                :wrapper-col="{ span: 18 }"
-                v-if="detail.ascription.clipName"
-              >
+              <a-form-item label="剪辑" v-if="detail.ascription.clipName" style="flex:1">
                 {{ detail.ascription.clipName }}
               </a-form-item>
             </div>
-
-            <a-form-item label="标签" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="detail.tag">
-              <a-tag v-for="(item, index) of detail.tag" :key="index">{{ item }}</a-tag>
-            </a-form-item>
-            <a-form-item label="无水印素材下载" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="name">
-              <a-button type="primary" @click="downloadByBlobShowUrl">下载</a-button>
-            </a-form-item>
-            <a-form-item label="水印素材下载" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="name">
-              <a-button type="primary" @click="downloadByBlob" v-if="showUrlWater">下载</a-button>
-              <span v-else>水印素材生成中,请一分钟后刷新</span>
-            </a-form-item>
-            <a-form-item label="水印素材链接" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="showUrlWater">
-              <a-input v-model="showUrlWater" type="text" readonly />
-            </a-form-item>
-            <a-form-item label="生成水印素材" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
-              <a-select :defaultValue="4" style="width:50%" v-model="size">
-                <a-select-option :value="item.id" :key="item.id" v-for="item of sizeType">{{
-                  item.name
-                }}</a-select-option>
-              </a-select>
-              <a-button type="primary" @click="getWater">生成</a-button>
-            </a-form-item>
-            <a-form-item
-              label="审核人"
-              :label-col="{ span: 6 }"
-              :wrapper-col="{ span: 18 }"
-              v-if="active == '2' && detail.auditorName"
-            >
-              {{ detail.auditorName }}
-            </a-form-item>
-            <a-form-item label="广告语" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="active == '1'">
-              {{ creativeCopywriter ? creativeCopywriter : '无广告语' }}
-            </a-form-item>
-            <a-form-item label="驳回原因" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="active == '2'">
-              {{ refuseReason ? refuseReason : '无原因' }}
-            </a-form-item>
-            <a-form-item label="截图" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" v-if="active == '2'">
-              <upload-to-ali
-                v-if="refuseFile"
-                disabled
-                v-model="refuseFile"
-                :customDomain="customDomain"
-                multiple
-                preview
-                :region="region"
-                :bucket="bucket"
-                :accept="acceptImage"
-                :max="10"
-                :size="1024000"
-                :accessKeyId="accessKeyId"
-                :accessKeySecret="accessKeySecret"
-                :dir="dirImg"
-              ></upload-to-ali>
-              <div v-else>无截图</div>
-            </a-form-item>
-            <a-form-item
-              label="审核"
-              :label-col="{ span: 6 }"
-              :wrapper-col="{ span: 18 }"
-              v-if="
-                active != '2' &&
-                  (role.roleCode == 'operator' ||
-                    role.roleCode == 'kuaishouOperationManager' ||
-                    role.roleCode == 'admin' ||
-                    role.roleCode == 'operationAssistant' ||
-                    role.roleCode == 'touTiaoOperationManager')
-              "
-            >
-              <a-popconfirm
-                @confirm="edit(null, '0', '1')"
-                v-show="active != '1'"
+            <div>
+              <a-form-item label="标签" v-if="detail.tag">
+                <a-tag v-for="(item, index) of detail.tag" :key="index">{{ item }}</a-tag>
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="无水印素材下载" v-if="name">
+                <a-button type="primary" @click="downloadByBlobShowUrl">下载</a-button>
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="水印素材下载" v-if="name">
+                <a-button type="primary" @click="downloadByBlob" v-if="showUrlWater">下载</a-button>
+                <span v-else>水印素材生成中,请一分钟后刷新</span>
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="水印素材链接" v-if="showUrlWater">
+                <a-input v-model="showUrlWater" type="text" readonly />
+              </a-form-item>
+            </div>
+            <div style="width:100%" class="downLoad">
+              <a-form-item label="生成水印素材" style="width:100%">
+                <a-select :defaultValue="4" v-model="size" style="width:80%">
+                  <a-select-option :value="item.id" :key="item.id" v-for="item of sizeType">{{
+                    item.name
+                  }}</a-select-option>
+                </a-select>
+                <a-button type="primary" @click="getWater">生成</a-button>
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="审核人" v-if="active == '2' && detail.auditorName">
+                {{ detail.auditorName }}
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="广告语" v-if="active == '1'">
+                {{ creativeCopywriter ? creativeCopywriter : '无广告语' }}
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="驳回原因" v-if="active == '2'">
+                {{ refuseReason ? refuseReason : '无原因' }}
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item label="截图" v-if="active == '2'">
+                <upload-to-ali
+                  v-if="refuseFile"
+                  disabled
+                  v-model="refuseFile"
+                  :customDomain="customDomain"
+                  multiple
+                  preview
+                  :region="region"
+                  :bucket="bucket"
+                  :accept="acceptImage"
+                  :max="10"
+                  :size="1024000"
+                  :accessKeyId="accessKeyId"
+                  :accessKeySecret="accessKeySecret"
+                  :dir="dirImg"
+                ></upload-to-ali>
+                <div v-else>无截图</div>
+              </a-form-item>
+            </div>
+            <div>
+              <a-form-item
+                label="审核"
                 v-if="
-                  role.roleCode == 'operator' ||
-                    role.roleCode == 'kuaishouOperationManager' ||
-                    role.roleCode == 'admin' ||
-                    role.roleCode == 'operationAssistant' ||
-                    role.roleCode == 'touTiaoOperationManager'
+                  active != '2' &&
+                    (role.roleCode == 'operator' ||
+                      role.roleCode == 'kuaishouOperationManager' ||
+                      role.roleCode == 'admin' ||
+                      role.roleCode == 'operationAssistant' ||
+                      role.roleCode == 'touTiaoOperationManager')
                 "
               >
-                <div slot="title">
-                  <div>
-                    广告语:
-                    <a-textarea placeholder="请输入" v-model="refuseReason" :autosize="{ minRows: 3, maxRows: 10 }" />
+                <a-popconfirm
+                  @confirm="edit(null, '0', '1')"
+                  v-show="active != '1'"
+                  v-if="
+                    role.roleCode == 'operator' ||
+                      role.roleCode == 'kuaishouOperationManager' ||
+                      role.roleCode == 'admin' ||
+                      role.roleCode == 'operationAssistant' ||
+                      role.roleCode == 'touTiaoOperationManager'
+                  "
+                >
+                  <div slot="title">
+                    <div>
+                      广告语:
+                      <a-textarea placeholder="请输入" v-model="refuseReason" :autosize="{ minRows: 3, maxRows: 10 }" />
+                    </div>
                   </div>
-                </div>
-                <a-button type="primary" v-if="active == '0'" style="margin-right:10px">通过审核</a-button>
-              </a-popconfirm>
-              <a-popconfirm @confirm="okEdit" v-show="active != '2'">
-                <div slot="title">
-                  <div>
-                    驳回原因:
-                    <a-textarea
-                      placeholder="请输入原因"
-                      v-model="refuseReason"
-                      :autosize="{ minRows: 3, maxRows: 10 }"
-                    />
+                  <a-button type="primary" v-if="active == '0'" style="margin-right:10px">通过审核</a-button>
+                </a-popconfirm>
+                <a-popconfirm @confirm="okEdit" v-show="active != '2'">
+                  <div slot="title">
+                    <div>
+                      驳回原因:
+                      <a-textarea
+                        placeholder="请输入原因"
+                        v-model="refuseReason"
+                        :autosize="{ minRows: 3, maxRows: 10 }"
+                      />
+                    </div>
+                    <div>
+                      截图:
+                      <upload-to-ali
+                        v-model="refuseFile"
+                        :customDomain="customDomain"
+                        multiple
+                        preview
+                        :region="region"
+                        :bucket="bucket"
+                        :accept="acceptImage"
+                        :max="10"
+                        :size="1024000"
+                        :accessKeyId="accessKeyId"
+                        :accessKeySecret="accessKeySecret"
+                        :dir="dirImg"
+                      ></upload-to-ali>
+                    </div>
+                  </div>
+                  <a-button type="primary" v-show="active != '2'">驳回</a-button>
+                  <!-- @click="edit(null, '0', '2')" -->
+                </a-popconfirm>
+              </a-form-item>
+            </div>
+            <!-- <div class="downLoad">
+              <a-form-item label="封面" style="width:120%">
+                <a-table
+                  bordered
+                  size="middle"
+                  :columns="goodsColumns"
+                  :dataSource="model"
+                  :pagination="{ pageSize: 4 }"
+                  :scroll="{ y: 200 }"
+                >
+                  <div slot="url" slot-scope="text, record, index">
+                    <div>
+                      <img style="max-width:100px" :src="text" @click="coverPreviewShowModal(record, index)" />
+                    </div>
+                    <a-modal title="图片预览" v-model="coverPreviewVisible" :footer="null">
+                      <a-carousel arrows class="cover_carousel_con">
+                        <div v-for="(item, index) in model" :key="index" class="content">
+                          <img :src="item.url" :width="300" />
+                          <div style="margin-top:10px">
+                            <a-button type="primary" @click="handleOk">
+                              通过审核
+                            </a-button>
+                            <a-divider type="vertical" />
+                            <a-button type="primary" @click="close">驳回</a-button>
+                          </div>
+                        </div>
+                        <a-icon
+                          type="left-circle"
+                          slot="prevArrow"
+                          slot-scope
+                          style="left: 10px;zIndex: 9;font-size:30px;color:black"
+                        />
+                        <a-icon
+                          type="right-circle"
+                          slot="nextArrow"
+                          slot-scope
+                          style="right: 10px;zIndex: 9;font-size:30px;color:black"
+                        />
+                      </a-carousel>
+                    </a-modal>
                   </div>
-                  <div>
-                    截图:
-                    <upload-to-ali
-                      v-model="refuseFile"
-                      :customDomain="customDomain"
-                      multiple
-                      preview
-                      :region="region"
-                      :bucket="bucket"
-                      :accept="acceptImage"
-                      :max="10"
-                      :size="1024000"
-                      :accessKeyId="accessKeyId"
-                      :accessKeySecret="accessKeySecret"
-                      :dir="dirImg"
-                    ></upload-to-ali>
+                  <div slot="action" slot-scope="text, record">
+                    <a>通过{{ record.key }}</a>
+                    <a-divider type="vertical" />
+                    <a>驳回</a>
                   </div>
-                </div>
-                <a-button type="primary" v-show="active != '2'">驳回</a-button>
-                <!-- @click="edit(null, '0', '2')" -->
-              </a-popconfirm>
-            </a-form-item>
+                </a-table>
+              </a-form-item>
+            </div> -->
           </a-form>
         </div>
       </div>
@@ -847,7 +1085,7 @@ a {
 import { JeecgListMixin } from '@/mixins/JeecgListMixin'
 import JEllipsis from '@/components/jeecg/JEllipsis'
 import UploadToAli from '@femessage/upload-to-ali'
-import { fileCheck, fileInsert, fileEdit } from '@/api/actor'
+import { fileCheck, fileInsertV2, fileEdit, fileCheckImage } from '@/api/actor'
 import { getAction, postAction, postFile, deleteAction } from '@/api/manage'
 import qs from 'qs'
 import { mapGetters } from 'vuex'
@@ -870,6 +1108,28 @@ export default {
 
   data() {
     return {
+      coverPreviewVisible: false,
+      model: [],
+      goodsColumns: [
+        {
+          title: '封面预览',
+          //   dataIndex: 'coverUrl',
+          //   key: 'coverUrl',
+          dataIndex: 'url',
+          align: 'center',
+          scopedSlots: { customRender: 'url' }
+        },
+        {
+          title: '审核',
+          align: 'center',
+          dataIndex: 'action',
+          width: 100,
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+
+      addImageVisible: false,
+      addImageData: null,
       projectId: '',
       inputVisible: false,
       inputValue: '',
@@ -924,6 +1184,12 @@ export default {
         md5: '',
         name: ''
       },
+      urlListImage: {
+        url: [],
+        md5: [],
+        name: [],
+        size: []
+      },
       watermarkUrl: {
         url: '',
         md5: '',
@@ -947,6 +1213,7 @@ export default {
       accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
       checkArr: [],
       checkAll: false,
+      checkArrImage: [],
       showUrl: '',
       showUrlWater: '',
       materialName: '',
@@ -966,6 +1233,8 @@ export default {
       repeat: false,
       excellent: 0,
       code: '',
+      material: [],
+      imageArrList: [],
       showDataBool: false,
       kuaishouData: null,
       douyinData: null
@@ -1019,7 +1288,6 @@ export default {
       this.role = res
     })
     getAction('/ctop/videoWatermarkTemplate/list').then(res => {
-      console.log(res)
       if (res.success) {
         this.sizeType = res.result.records
       }
@@ -1108,7 +1376,6 @@ export default {
     },
 
     downloadByBlobShowUrl() {
-      console.log(this.showUrl)
       fetch(this.showUrl)
         .then(res => res.blob())
         .then(blob => {
@@ -1265,6 +1532,22 @@ export default {
           this.name = null
         }
       })
+      getAction('/ctop/MaterialImageInfo/list', {
+        videoId: item.code
+      }).then(res => {
+        console.log(res)
+        if (res.success) {
+          this.model = res.result.map((item, index) => {
+            return {
+              ...item,
+              key: index
+            }
+          })
+        }
+      })
+    },
+    coverPreviewShowModal(item, index) {
+      this.coverPreviewVisible = true
     },
     okEditShow(item, editStatus) {
       if (editStatus == '2') {
@@ -1364,6 +1647,25 @@ export default {
         })
       }
     },
+    handleOkImage() {
+      var params = {}
+      params.projectId = this.addImageData.projectId
+      params.videoId = this.addImageData.code
+      params.imageArr = this.imageArrList
+      postAction('/insertImage', params).then(res => {
+        console.log(res)
+        if (res.code == 0) {
+          this.urlListImage = {
+            url: [],
+            md5: [],
+            name: [],
+            size: []
+          }
+          this.imageArrList = []
+          this.addImageVisible = false
+        }
+      })
+    },
     handleOk() {
       this.form.validateFieldsAndScroll((err, values) => {
         if (err) {
@@ -1397,8 +1699,9 @@ export default {
                   clipId: values.clipId
                 }
           params.tag = this.tags
+          params.imageArr = this.imageArrList
           if (this.add) {
-            fileInsert(params).then(res => {
+            fileInsertV2(params).then(res => {
               if (res.success) {
                 this.form.resetFields()
                 this.urlList = {
@@ -1411,6 +1714,13 @@ export default {
                   md5: '',
                   name: ''
                 }
+                this.urlListImage = {
+                  url: [],
+                  md5: [],
+                  name: [],
+                  size: []
+                }
+                this.imageArrList = []
                 this.tags = []
                 this.loadData()
                 this.visible = false
@@ -1456,10 +1766,31 @@ export default {
       })
     },
     close() {
-      //   this.form.resetFields()
-      //   this.urlList = { url: '', md5: '', name: '' }
-      //   this.watermarkUrl = { url: '', md5: '', name: '' }
-      //   this.tags = []
+      this.visible = false
+      this.form.resetFields()
+      this.urlList = { url: '', md5: '', name: '' }
+      this.tags = []
+      this.urlListImage = {
+        url: [],
+        md5: [],
+        name: [],
+        size: []
+      }
+      this.imageArrList = []
+    },
+    addImage(item) {
+      this.addImageVisible = true
+      this.addImageData = item
+    },
+    closeImage() {
+      this.addImageVisible = false
+      this.urlListImage = {
+        url: [],
+        md5: [],
+        name: [],
+        size: []
+      }
+      this.imageArrList = []
     },
     onChange(date, dateString) {},
     callbackTwo(key) {
@@ -1478,6 +1809,68 @@ export default {
       this.repeat = false
       this.$message.success('上传成功')
     },
+    overUploadImage(urlAll) {
+      //   var index = this.urlList.url.findIndex(item => item === urlAll[0])
+      //   var data = { url: urlAll[0], code: this.urlList.md5[index], name: this.urlList.name[index] }
+      //   this.imageArr.push(data)
+      var that = this
+      that.material = []
+      that.imageArrList = []
+      var img
+      img = new Image()
+      for (var i = 0; i < this.urlListImage.url.length; i++) {
+        img.src = this.urlListImage.url[i]
+        if (img.complete) {
+          // 打印
+          if (img.width == 720) {
+            if (img.height == 1280) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1080) {
+            if (img.height == 1920) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1280) {
+            if (img.height == 720) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else if (img.width == 1920) {
+            if (img.height == 1080) {
+              that.material.push(true)
+            } else {
+              that.material.push(false)
+            }
+          } else {
+            that.material.push(false)
+          }
+          that.imageArrList.push({
+            width: img.width,
+            height: img.height,
+            size: this.urlListImage.size[i],
+            code: this.urlListImage.md5[i],
+            url: this.urlListImage.url[i],
+            materialName: this.urlListImage.name[i]
+          })
+        } else {
+          img.onload = () => {
+            that.imageArrList.push({
+              width: img.width,
+              height: img.height,
+              size: that.urlListImage.size[that.urlListImage.url.length - 1],
+              code: that.urlListImage.md5[that.urlListImage.url.length - 1],
+              url: that.urlListImage.url[that.urlListImage.url.length - 1],
+              materialName: that.urlListImage.name[that.urlListImage.url.length - 1]
+            })
+          }
+        }
+      }
+    },
     file(file) {
       var bmf = new BMF()
       var that = this
@@ -1506,20 +1899,25 @@ export default {
       var bmf = new BMF()
       var that = this
       return new Promise(function(resolve, reject) {
-        bmf.md5(file[0], (err, md5) => {
-          that.watermarkUrl.name = file[0].name
-          that.watermarkUrl.md5 = md5
-          fileCheck({
-            code: md5
-          }).then(res => {
-            if (res.code == 0) {
-              that.$message.error('此素材已经上传')
-              reject()
-            } else {
-              resolve()
-            }
+        for (let i = 0; i < file.length; i++) {
+          bmf.md5(file[i], (err, md5) => {
+            fileCheckImage({
+              code: md5,
+              projectId: that.getData('projectId')
+            }).then(res => {
+              if (res.code == 0) {
+                that.$message.error('此素材已经上传')
+                reject()
+              } else {
+                that.urlListImage.name.push(file[i].name)
+                that.urlListImage.md5.push(md5)
+                that.urlListImage.size.push(file[i].size)
+                resolve()
+                //   reject()
+              }
+            })
           })
-        })
+        }
       })
     },
     getParticipateList() {