修改选择视频

src/components/commonPage/DMCchooseImg.vue

@@ -136,7 +136,7 @@
 </style>
 <template>
     <div class="DMCchooseImg">
-      <div style="width:98px;margin:0 25px;display:none;">
+      <div style="width:98px;margin:0 25px;">
         <el-tabs v-model="activeName" @tab-click="handleClick">
           <el-tab-pane label="图片" name="first"></el-tab-pane>
           <el-tab-pane label="视频" name="second"></el-tab-pane>
@@ -182,35 +182,27 @@
             <input type="text" class="resource-name resAddImg" v-model="queVideoMsg.Name" @keyup.enter="getVideoList" placeholder="请输入关键字"/>
             <span class="search-imgicon"><i class="iconfont icon-img_cz searchImgIcon" @click="getVideoList"></i></span>
           </span>
-          <!-- <div class="addimgContent test-1">
-              <div class="addimgDiv" v-for="(item,index) in videoListArray" :key="item.subCode" v-if="item.isShowImgDiv&&item.Path!=null">
-                  <div class="itemImgdiv" @click="selectImg(index)">
-                      <img :src='compressImg(item.Path, "filt", 160, "")' @error="imgError(item)"/>
+          <div class="addimgContent test-1">
+              <div class="addimgDiv" v-for="(item,index) in videoListArray" :key="item.subCode" v-if="item.isShowImgDiv&&item.Cover!=null">
+                  <div class="itemImgdiv" @click="selectVideo(index)">
+                      <img :src='item.Cover' @error="imgError(item)"/>
                       <div class="imgseclet" v-show="item.isShow"><i class="iconfont icon-dagouyouquan"></i></div>
                   </div>
                   <div class="imgDescription">{{item.Name}}</div>
               </div>  
-              <div class="addimgDiv" v-if="IsShowAdd" >
-                  <div class="DMC_addContent">
-                      <el-upload class="upload-demo" :http-request="UploadImage" :multiple="false" accept="image/jpeg,image/gif,image/png,image/bmp"
-                        :show-file-list="false" action="">
-                        <i class="iconfont icon-img_haha"></i>
-                      </el-upload>
-                  </div>
-              </div>    
           </div>
           <div class="addimg-btnlist">
-              <input type="button" class="save-Btn" @click="dmccheckImgList()" value="确定" />
+              <input type="button" class="save-Btn" @click="chkedVideoList()" value="确定" />
               <input type="button" class="cancel-Btn" @click="closeDialog()" value="取消" />
           </div>
-          <span class="addimg-select">已选择<span style="color:#E95252;"><span>{{selectImgArr.length}}</span></span>张图片</span>
+          <span class="addimg-select">已选择<span style="color:#E95252;"><span>{{selectVideoArr.length}}</span></span>个视频</span>
           <el-pagination 
               background
-              @current-change="handleCurrentChange"
-              :current-page.sync="queryMsg.currentPage" 
-              :page-size="queryMsg.pageSize" 
-              layout="total,prev, pager, next, jumper" :total="queryMsg.total">
-          </el-pagination> -->
+              @current-change="videoCurrentChange"
+              :current-page.sync="queVideoMsg.currentPage" 
+              :page-size="queVideoMsg.pageSize" 
+              layout="total,prev, pager, next, jumper" :total="queVideoMsg.total">
+          </el-pagination>
       </div>
     </div>
 </template>
@@ -236,11 +228,15 @@ export default {
       activeName:'first',
 
       queVideoMsg:{
-        pageSize: 50,
+        pageSize: 10,
         pageIndex: 1,
-        Name:'巴厘岛'
+        Name:'',
+        currentPage:1,
+        total: 0
       },
       videoListArray:[],
+      //选中视频数组
+      selectVideoArr:[],
     };
   },
   methods: {
@@ -270,12 +266,23 @@ export default {
       this.queryMsg.Name='';
       this.queryMsg.SourceId=0;
       this.$emit("closeImg");
+
+      //关闭清除选中视频
+      this.videoListArray.forEach(selvideo => {
+        selvideo.isShow = false;
+      });
+      this.selectVideoArr = [];
+      this.queVideoMsg.Name='';
     },
     sendMsg() {},
     handleCurrentChange(val) {
       this.queryMsg.pageIndex = val;
       this.getList();
     },
+    videoCurrentChange(val){
+      this.queVideoMsg.pageIndex = val;
+      this.getVideoList();
+    },
     resetPageIndex() {
       this.queryMsg.pageIndex = 1;
       this.queryMsg.currentPage = 1;
@@ -298,6 +305,16 @@ export default {
         }
       }
     },
+    //选中视频方法
+    selectVideo(index){
+        this.videoListArray.forEach(item => {
+          item.isShow = false;
+        });
+        this.videoListArray[index].isShow = true;
+        this.selectVideoArr = [];
+        this.selectVideoArr.push(this.videoListArray[index]);
+        console.log(this.selectVideoArr,'this.selectVideoArr');
+    },
     //删除选中图片
     removeImg() {
       var newArr = [];
@@ -308,6 +325,7 @@ export default {
       });
       this.selectImgArr = newArr;
     },
+    
     //点击确定
     dmccheckImgList() {
       this.$emit("headCallBack", this.selectImgArr);
@@ -382,13 +400,22 @@ export default {
         this.queVideoMsg,
         res => {
           if (res.data.resultCode == 1) {
-            console.log(res,'resss');
+            this.videoListArray=res.data.data.pageData;
+            this.queVideoMsg.total = res.data.data.count;
+
+            this.videoListArray.forEach(x=>{
+              x.isShowImgDiv = true;
+              x.isShow=false;
+            })
           }else{
             this.Error(res.data.message);
           }
         },
         null
       );
+    },
+    //点击确定选择
+    chkedVideoList(){
 
     }
   },