|  |  | @@ -13,9 +13,10 @@ | 
		
	
		
			
			|  |  |  | <div class="top"> | 
		
	
		
			
			|  |  |  | <div id="videocar" class="lr"> | 
		
	
		
			
			|  |  |  | <el-carousel :interval="5000" arrow="always" height="470px"> | 
		
	
		
			
			|  |  |  | <template v-for="item in hotList.left" > | 
		
	
		
			
			|  |  |  | <template v-for="(item, index) in hotList.left" > | 
		
	
		
			
			|  |  |  | <el-carousel-item :key="item" v-if="item.split('.')[item.split('.').length - 1] === 'mp4'"> | 
		
	
		
			
			|  |  |  | <video :src="item" /> | 
		
	
		
			
			|  |  |  | <video :id="'video'+index" :src="item" @click="videoPlayer(`video${index}`, `play${index}`)"/> | 
		
	
		
			
			|  |  |  | <img class="play" src="@/assets/play.png" @click="videoPlayer(`video${index}`, `play${index}`)" :id="'play'+index"> | 
		
	
		
			
			|  |  |  | </el-carousel-item> | 
		
	
		
			
			|  |  |  | </template> | 
		
	
		
			
			|  |  |  | </el-carousel> | 
		
	
	
		
			
				|  |  | @@ -157,6 +158,17 @@ export default { | 
		
	
		
			
			|  |  |  | if (message === 'success') { | 
		
	
		
			
			|  |  |  | this.display = display | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | videoPlayer (value, play) { | 
		
	
		
			
			|  |  |  | const id = document.getElementById(value) | 
		
	
		
			
			|  |  |  | const playid = document.getElementById(play) | 
		
	
		
			
			|  |  |  | if (id.paused) { | 
		
	
		
			
			|  |  |  | id.play() | 
		
	
		
			
			|  |  |  | playid.style.display = 'none' | 
		
	
		
			
			|  |  |  | } else { | 
		
	
		
			
			|  |  |  | id.pause() | 
		
	
		
			
			|  |  |  | playid.style.display = 'block' | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
	
		
			
				|  |  | @@ -216,7 +228,19 @@ export default { | 
		
	
		
			
			|  |  |  | .lr { | 
		
	
		
			
			|  |  |  | width: 50%; | 
		
	
		
			
			|  |  |  | height: 100%; | 
		
	
		
			
			|  |  |  | position: relative; | 
		
	
		
			
			|  |  |  | video { | 
		
	
		
			
			|  |  |  | width: 100%; | 
		
	
		
			
			|  |  |  | height: 100%; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .play { | 
		
	
		
			
			|  |  |  | position: absolute; | 
		
	
		
			
			|  |  |  | margin: 0 auto; | 
		
	
		
			
			|  |  |  | top: 50%; | 
		
	
		
			
			|  |  |  | margin-top: -50px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  |  | 
		
	
		
			
			|  |  |  | .el-carousel { | 
		
	
		
			
			|  |  |  | width: 100% !important; | 
		
	
		
			
			|  |  |  | } | 
		
	
	
		
			
				|  |  | @@ -341,11 +365,9 @@ export default { | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | .yyzrbimg { | 
		
	
		
			
			|  |  |  | //   background-image: url('../../assets/yyzrb.png'); | 
		
	
		
			
			|  |  |  | //   background-size: 100% 100%; | 
		
	
		
			
			|  |  |  | width: 50% !important; | 
		
	
		
			
			|  |  |  | img{ | 
		
	
		
			
			|  |  |  | width: 600px; | 
		
	
		
			
			|  |  |  | width: 580px; | 
		
	
		
			
			|  |  |  | height: 438px; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | } | 
		
	
	
		
			
				|  |  | 
 |