23.4.12

src/views/orderform/components/index.vue

@@ -3,7 +3,7 @@
     <el-dialog :title='title' :visible.sync="dialogVisibl" width="30%" :before-close="dialog" center>
       <div v-if="control != 4">
         <!-- 图片说明 -->
-        <el-image v-if="control == '1'" style="width:100%; " :src="idt" >
+        <el-image v-if="control == '1'" style="width:100%;height: 300px; " :src="idt" >
         </el-image>
         <!-- 视频说明 -->
         <comvideo  v-if="control == '2'" :videoUrl="idt"></comvideo>
@@ -68,7 +68,8 @@ export default {
         name: '',
         money:''
       },
-      title: ''
+      title: '',
+      id:''
     };
   },
   watch: {
@@ -101,6 +102,11 @@ export default {
       }
       }
     },
+    idt(val,old){
+         this.$nextTick(() => {
+          this.$refs.audio.src = val;
+        });
+    },
     bindex(st, old) {
       console.log(st, old,this.idt, '000000000000')
 

src/views/orderform/components/modify.vue

@@ -26,7 +26,7 @@
           <span>图片说明</span>
           <div style="display: flex;">
             <div class="imgdiv" v-for="v in particulars.pictureList">
-              <el-image class="imgdiv-img" :src="v.url">
+              <el-image class="imgdiv-img" style="margin: 5px;" :src="v.url" :preview-src-list="srcList">
               </el-image>
             </div>
           </div>
@@ -35,7 +35,7 @@
         <div class="description">
           <span>视频说明</span>
           <div class="imgdiv">
-            <comvideo :width="width" :videoUrl="particulars.video"></comvideo>
+            <comvideo :width="width" :videoUrl="video"></comvideo>
           </div>
         </div>
         <div class="description">
@@ -85,12 +85,9 @@ export default {
   },
   data() {
     return {
-      width: '30%',
+      width: '200',
       url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
-      // srcList: [
-      //   'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
-      //   'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
-      // ],
+      srcList: [],
       value1: '',
       form: {
         name: '',
@@ -102,6 +99,7 @@ export default {
         resource: '',
         desc: ''
       },
+      video:'',
       particulars: {
         video: '',
         voice: ''
@@ -117,7 +115,8 @@ export default {
         if (res.code == 200) {
           this.$nextTick(() => {
             if (res.data.videoList != null) {
-              self.particulars.video = res.data.videoList[0].url
+              self.video = res.data.videoList[0].url
+              console.log(self.particulars.video,'self.particulars.video')
             } else {
               self.particulars.video = ''
             }
@@ -132,6 +131,9 @@ export default {
               res.data.repairTime = res.data.repairTime.slice(0, 10)
             }
             self.particulars = res.data
+            self.particulars.pictureList.forEach((item)=>{
+                 self.srcList.push(item.url)
+            })
           })
           console.log(this.idt,'itd===========')
         }

src/views/orderform/components/video.vue

@@ -6,6 +6,7 @@
         :src="videoUrl"
         :poster="videoCover"
         :width="width"
+        :height="height"
         :autoplay="autoplay"
         :controls="!originPlay&&controls"
         :loop="loop"
@@ -32,10 +33,10 @@
         type: String,
         default: '100%'
       },
-    //   height: { // 视频播放器高度
-    //     type: Number,
-    //     default: 150
-    //   },
+      height: { // 视频播放器高度
+        type: Number,
+        default: 300
+      },
       /*
         由于目前在最新版的Chrome浏览器（以及所有以Chromium为内核的浏览器）中，
         已不再允许自动播放音频和视频。就算你为video或audio标签设置了autoplay