|  |  | @@ -12,14 +12,23 @@ | 
		
	
		
			
			|  |  |  | <img class="userImg" src="../../assets/img/user center.png" alt="" /> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  |  | 
		
	
		
			
			|  |  |  | <!-- isVX && videoPlayBtn --> | 
		
	
		
			
			|  |  |  | <div class="module_1"> | 
		
	
		
			
			|  |  |  | <!-- <video id="video" ref="vidoe" src="../../assets/video/1.mp4" width="100%" height="100%" autoplay muted="muted" loop="loop" /> --> | 
		
	
		
			
			|  |  |  | <!-- <video ref="vidoe" src="https://video.metavatar.cc/sv/d51a6f6-187fa2dff79/d51a6f6-187fa2dff79.mp4" width="100%" height="100%" autoplay muted="muted" loop="loop" /> --> | 
		
	
		
			
			|  |  |  | <div class="vantLoadingBox" style="height: 550px" v-show="!loading"> | 
		
	
		
			
			|  |  |  | <van-loading type="spinner" color="#52d4e5" class="vantLoading" /> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <video id="video" v-if="loading" ref="vidoe" :src="videoUrl" width="100%" height="100%" autoplay muted="muted" loop="loop" /> | 
		
	
		
			
			|  |  |  | <div | 
		
	
		
			
			|  |  |  | v-if="isVX && videoPlayBtn" | 
		
	
		
			
			|  |  |  | class="title_item3" | 
		
	
		
			
			|  |  |  | @click="playVideo" | 
		
	
		
			
			|  |  |  | style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 999; width: 100px; height: 100px"> | 
		
	
		
			
			|  |  |  | <img src="../../assets/icon/icon-play.png" alt="" style="width: 100px; height: 100px" /> | 
		
	
		
			
			|  |  |  | </div> | 
		
	
		
			
			|  |  |  | <video @play="videoPlayBtn = false" id="video" v-if="loading" :src="videoUrl" ref="vidoe" width="100%" height="100%" autoplay muted="muted" loop="loop"> | 
		
	
		
			
			|  |  |  | <!-- <source type="audio/ogg" /> --> | 
		
	
		
			
			|  |  |  | </video> | 
		
	
		
			
			|  |  |  | <div class="titleBox" @click="goLogin"> | 
		
	
		
			
			|  |  |  | <div class="title_item1" v-if="characters == 1">打造自主数字人IP</div> | 
		
	
		
			
			|  |  |  | <div class="title_item2" v-if="characters == 1">沉淀数字资产</div> | 
		
	
	
		
			
				|  |  | @@ -308,6 +317,7 @@ Vue.use(Toast); | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | import { oneList, twoList, threeList } from './load.js'; | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | import { getDeviceType } from '../../utils/index'; | 
		
	
		
			
			|  |  |  | export default { | 
		
	
		
			
			|  |  |  | components: { | 
		
	
		
			
			|  |  |  | top | 
		
	
	
		
			
				|  |  | @@ -315,8 +325,10 @@ export default { | 
		
	
		
			
			|  |  |  | data() { | 
		
	
		
			
			|  |  |  | return { | 
		
	
		
			
			|  |  |  | inPage: false, | 
		
	
		
			
			|  |  |  | loading: false, | 
		
	
		
			
			|  |  |  | videoUrl: '', | 
		
	
		
			
			|  |  |  | loading: false, // 加载状态 | 
		
	
		
			
			|  |  |  | videoUrl: '', // 视频路径 | 
		
	
		
			
			|  |  |  | isVX: null, //判断是不是微信浏览器 | 
		
	
		
			
			|  |  |  | videoPlayBtn: true, // 播放按钮显示隐藏 | 
		
	
		
			
			|  |  |  | userName: '', | 
		
	
		
			
			|  |  |  | phone: '', | 
		
	
		
			
			|  |  |  | email: '', | 
		
	
	
		
			
				|  |  | @@ -507,6 +519,11 @@ export default { | 
		
	
		
			
			|  |  |  | methods: { | 
		
	
		
			
			|  |  |  | ...mapActions(['setCharacters']), | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | // 播放视频 | 
		
	
		
			
			|  |  |  | playVideo() { | 
		
	
		
			
			|  |  |  | this.videoPlayBtn = false; | 
		
	
		
			
			|  |  |  | document.getElementById('video').play(); | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | goLogin() { | 
		
	
		
			
			|  |  |  | this.$router.push('/myPage'); | 
		
	
		
			
			|  |  |  | return; | 
		
	
	
		
			
				|  |  | @@ -599,25 +616,37 @@ export default { | 
		
	
		
			
			|  |  |  | characters: state => state.publicObj.characters | 
		
	
		
			
			|  |  |  | }) | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | created() { | 
		
	
		
			
			|  |  |  | // console.log(!getDeviceType()); | 
		
	
		
			
			|  |  |  | // 判断是不是微信浏览器,配合做视频的自动播放 | 
		
	
		
			
			|  |  |  | var ua = window.navigator.userAgent.toLowerCase(); | 
		
	
		
			
			|  |  |  | if (ua.match(/MicroMessenger/i) == 'micromessenger') { | 
		
	
		
			
			|  |  |  | this.isVX = true; | 
		
	
		
			
			|  |  |  | return true; | 
		
	
		
			
			|  |  |  | } else { | 
		
	
		
			
			|  |  |  | this.isVX = false; | 
		
	
		
			
			|  |  |  | return false; | 
		
	
		
			
			|  |  |  | } | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | mounted() { | 
		
	
		
			
			|  |  |  | this.goView('top'); | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | this.$nextTick(() => { | 
		
	
		
			
			|  |  |  | this.module_6_data = oneList; | 
		
	
		
			
			|  |  |  | this.carouselLsit = twoList; | 
		
	
		
			
			|  |  |  | this.partnerLsit = threeList; | 
		
	
		
			
			|  |  |  | this.videoUrl = 'https://video.metavatar.cc/sv/d51a6f6-187fa2dff79/d51a6f6-187fa2dff79.mp4'; | 
		
	
		
			
			|  |  |  | // 监听点击来播放视频,微信浏览器禁用自动播放 | 
		
	
		
			
			|  |  |  | document.addEventListener( | 
		
	
		
			
			|  |  |  | 'touchstart', | 
		
	
		
			
			|  |  |  | function () { | 
		
	
		
			
			|  |  |  | var video = document.getElementById('video'); | 
		
	
		
			
			|  |  |  | video.play(); | 
		
	
		
			
			|  |  |  | }, | 
		
	
		
			
			|  |  |  | false | 
		
	
		
			
			|  |  |  | ); | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | this.loading = true; | 
		
	
		
			
			|  |  |  | // document.getElementById('video').play(); | 
		
	
		
			
			|  |  |  | // document.addEventListener( | 
		
	
		
			
			|  |  |  | //   'touchstart', | 
		
	
		
			
			|  |  |  | //   // 'WeixinJSBridgeReady', | 
		
	
		
			
			|  |  |  | //   function () { | 
		
	
		
			
			|  |  |  | //     document.getElementById('video').play(); | 
		
	
		
			
			|  |  |  | //   }, | 
		
	
		
			
			|  |  |  | //   false | 
		
	
		
			
			|  |  |  | // ); | 
		
	
		
			
			|  |  |  | }); | 
		
	
		
			
			|  |  |  | 
 | 
		
	
		
			
			|  |  |  | new Swiper('.swiper-container', { | 
		
	
	
		
			
				|  |  | 
 |