Commit 79902e53 authored by spc's avatar spc

fixed videos

parent 57069e65
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
pageName: '品牌故事-首屏页面', pageName: '品牌故事-首屏页面',
buttonName: '腰部品牌Video' buttonName: '腰部品牌Video'
}" :poster="video1Channel.posterUrl?.indexOf('http') === 0 ? video1Channel.posterUrl : $baseUrl + video1Channel.posterUrl" }" :poster="video1Channel.posterUrl?.indexOf('http') === 0 ? video1Channel.posterUrl : $baseUrl + video1Channel.posterUrl"
object-fit="cover" @loadedmetadata="onVideoLoadedMeta" @play="onVideo1Play"></video> object-fit="cover" @loadedmetadata="onVideoLoadedMeta" @play="onVideo1Play" @ended="onVideo1Ended"></video>
<image v-else :data-log="{ <image v-else :data-log="{
xcxClick: '品牌故事-次屏页面点击', xcxClick: '品牌故事-次屏页面点击',
pageName: '品牌故事-首屏页面', pageName: '品牌故事-首屏页面',
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
:src="video1Channel.posterUrl?.indexOf('http') === 0 ? video1Channel.posterUrl : $baseUrl + video1Channel.posterUrl"> :src="video1Channel.posterUrl?.indexOf('http') === 0 ? video1Channel.posterUrl : $baseUrl + video1Channel.posterUrl">
</image> </image>
<view class="videoposterboxtitle">{{ video1Channel.title || "" }}</view> <view class="videoposterboxtitle" v-if="showVideo1Title">{{ video1Channel.title || "" }}</view>
</view> </view>
<view id="secondScreen" class="productcontai" <view id="secondScreen" class="productcontai"
...@@ -161,7 +161,7 @@ ...@@ -161,7 +161,7 @@
:src="video2Channel.videoUrl?.indexOf('http') === 0 ? video2Channel.videoUrl : $baseUrl + video2Channel.videoUrl" :src="video2Channel.videoUrl?.indexOf('http') === 0 ? video2Channel.videoUrl : $baseUrl + video2Channel.videoUrl"
:autoplay="false" :autoplay="false"
:poster="video2Channel.posterUrl?.indexOf('http') === 0 ? video2Channel.posterUrl : $baseUrl + video2Channel.posterUrl" :poster="video2Channel.posterUrl?.indexOf('http') === 0 ? video2Channel.posterUrl : $baseUrl + video2Channel.posterUrl"
object-fit="cover" @loadedmetadata="onVideoLoadedMeta" @play="onVideo2Play"></video> object-fit="cover" @loadedmetadata="onVideoLoadedMeta" @play="onVideo2Play" @ended="onVideo2Ended"></video>
<image v-else class="videoposter" :data-comlog="{ <image v-else class="videoposter" :data-comlog="{
xcxComponentClick: 'true', xcxComponentClick: 'true',
pageName: '品牌故事页', pageName: '品牌故事页',
...@@ -170,7 +170,7 @@ ...@@ -170,7 +170,7 @@
}" @tap="openChannel(video2Channel, $event)" }" @tap="openChannel(video2Channel, $event)"
:src="video2Channel.posterUrl?.indexOf('http') === 0 ? video2Channel.posterUrl : $baseUrl + video2Channel.posterUrl"> :src="video2Channel.posterUrl?.indexOf('http') === 0 ? video2Channel.posterUrl : $baseUrl + video2Channel.posterUrl">
</image> </image>
<view class="videoposterboxtitle">{{ video2Channel.title || "" }}</view> <view class="videoposterboxtitle" v-if="showVideo2Title">{{ video2Channel.title || "" }}</view>
</view> </view>
<view id="thirdScreen" class="ipbox" v-if="erqiPeizhi.appId1 && erqiPeizhi.appId2" <view id="thirdScreen" class="ipbox" v-if="erqiPeizhi.appId1 && erqiPeizhi.appId2"
:style="{ background: `url(${$baseUrl}brandpage/hexiaofeiBg.png) no-repeat center/contain` }"> :style="{ background: `url(${$baseUrl}brandpage/hexiaofeiBg.png) no-repeat center/contain` }">
...@@ -401,6 +401,8 @@ export default { ...@@ -401,6 +401,8 @@ export default {
currentPlayingVideo: null, // 当前正在播放的视频标识 currentPlayingVideo: null, // 当前正在播放的视频标识
videoContexts: {}, // 存储视频上下文,使用id作为key videoContexts: {}, // 存储视频上下文,使用id作为key
ipExStr: ['鹤小飞商品', '鹤小飞商品', '鹤小飞', '鹤小飞'], ipExStr: ['鹤小飞商品', '鹤小飞商品', '鹤小飞', '鹤小飞'],
showVideo1Title: true, // 控制视频1标题显示
showVideo2Title: true, // 控制视频2标题显示
} }
}, },
mounted() { mounted() {
...@@ -777,6 +779,7 @@ export default { ...@@ -777,6 +779,7 @@ export default {
componentContent: this.video1Channel.title || '' componentContent: this.video1Channel.title || ''
}); });
console.log('视频1开始播放'); console.log('视频1开始播放');
this.showVideo1Title = false; // 隐藏标题
this.handleVideoPlay('brandVideo1'); this.handleVideoPlay('brandVideo1');
}, },
// 视频2播放事件 // 视频2播放事件
...@@ -800,8 +803,29 @@ export default { ...@@ -800,8 +803,29 @@ export default {
componentContent: this.video2Channel.title || '' componentContent: this.video2Channel.title || ''
}); });
console.log('视频2开始播放'); console.log('视频2开始播放');
this.showVideo2Title = false; // 隐藏标题
this.handleVideoPlay('brandVideo2'); this.handleVideoPlay('brandVideo2');
}, },
// 视频1播放结束事件
onVideo1Ended() {
console.log('视频1播放结束');
this.showVideo1Title = true; // 显示标题
// 恢复展示海报(自动生效,因为video组件播放结束后会显示poster)
if (this.currentPlayingVideo === 'brandVideo1') {
this.currentPlayingVideo = null;
}
},
// 视频2播放结束事件
onVideo2Ended() {
console.log('视频2播放结束');
this.showVideo2Title = true; // 显示标题
// 恢复展示海报(自动生效,因为video组件播放结束后会显示poster)
if (this.currentPlayingVideo === 'brandVideo2') {
this.currentPlayingVideo = null;
}
},
// 处理视频播放(互斥逻辑) // 处理视频播放(互斥逻辑)
handleVideoPlay(videoId) { handleVideoPlay(videoId) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment