|
@@ -87,7 +87,7 @@
|
|
|
</view>
|
|
</view>
|
|
|
<view class="viewer-count ">{{formattedWatchCount || 0 }}</view>
|
|
<view class="viewer-count ">{{formattedWatchCount || 0 }}</view>
|
|
|
</view>
|
|
</view>
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
@@ -103,6 +103,7 @@
|
|
|
|
|
|
|
|
<view class="videolist" v-if="liveItem.status == 2" :class="isFullscreen ? 'screen' : ''">
|
|
<view class="videolist" v-if="liveItem.status == 2" :class="isFullscreen ? 'screen' : ''">
|
|
|
<view class="video-container"
|
|
<view class="video-container"
|
|
|
|
|
+ :style="{ paddingBottom: liveItem.showType==2||isFullscreen?'':videoRatio + '%',height:liveItem.showType==2?'100vh':'auto',width:isFullscreen?'0':'100%'}"
|
|
|
:class="{'horizontal-layout': liveItem.showType == 1,'fullscreen-mode': isFullscreen}">
|
|
:class="{'horizontal-layout': liveItem.showType == 1,'fullscreen-mode': isFullscreen}">
|
|
|
<!-- <video v-if="liveItem.videoUrl && liveItem.liveType == 2 && !generating"
|
|
<!-- <video v-if="liveItem.videoUrl && liveItem.liveType == 2 && !generating"
|
|
|
:id="`myVideo_${liveId}`" :autoplay="true" class="video-player" :src="liveItem.videoUrl"
|
|
:id="`myVideo_${liveId}`" :autoplay="true" class="video-player" :src="liveItem.videoUrl"
|
|
@@ -120,19 +121,21 @@
|
|
|
</video> -->
|
|
</video> -->
|
|
|
<video v-if="liveItem.videoUrl && liveItem.liveType == 2 && !generating"
|
|
<video v-if="liveItem.videoUrl && liveItem.liveType == 2 && !generating"
|
|
|
:id="`myVideo_${liveId}`" :autoplay="true" class="video-player" :src="liveItem.videoUrl"
|
|
:id="`myVideo_${liveId}`" :autoplay="true" class="video-player" :src="liveItem.videoUrl"
|
|
|
- :object-fit="isFullscreen?'contain':'cover'" :custom-cache="false" :enable-progress-gesture="false"
|
|
|
|
|
- vslide-gesture-in-fullscreen="false" :show-center-play-btn="false" :http-cache="false" loop
|
|
|
|
|
- @error="videoError" @timeupdate="onVideoTimeUpdate" @loadedmetadata="onVideoMetaLoaded"
|
|
|
|
|
- @pause="onVideoPause" @play="onVideoPlay" @waiting="onVideoWaiting"
|
|
|
|
|
- :enable-play-gesture="false" :play-strategy="1" @dblclick="preventDoubleClick"
|
|
|
|
|
- preload="auto" :enable-stash-buffer="false" :stash-initial-size="0" :stash-max-size="0"
|
|
|
|
|
- :stash-time="0" type="application/x-mpegURL" :controls="false" :show-fullscreen-btn="false"
|
|
|
|
|
- show-play-btn show-mute-btn enable-play-gesture="true"
|
|
|
|
|
- @fullscreenchange="onFullscreenChange" x5-video-player-fullscreen="false"
|
|
|
|
|
- x5-video-player-type="h5" x5-video-orientation="landscape" :webkit-playsinline="true"
|
|
|
|
|
- playsinline="true" :x5-playsinline="true">
|
|
|
|
|
|
|
+ :style="{transform: `scale(${scale})`, transformOrigin: 'center center', bottom:isFullscreen?'0':''}"
|
|
|
|
|
+ :object-fit="liveItem.showType==2?'contain':'fill'" :custom-cache="false"
|
|
|
|
|
+ :enable-progress-gesture="false" vslide-gesture-in-fullscreen="false"
|
|
|
|
|
+ :show-center-play-btn="false" :http-cache="false" loop @error="videoError"
|
|
|
|
|
+ @timeupdate="onVideoTimeUpdate" @loadedmetadata="onVideoMetaLoaded" @pause="onVideoPause"
|
|
|
|
|
+ @play="onVideoPlay" @waiting="onVideoWaiting" :enable-play-gesture="false"
|
|
|
|
|
+ :play-strategy="1" @dblclick="preventDoubleClick" preload="auto"
|
|
|
|
|
+ :enable-stash-buffer="false" :stash-initial-size="0" :stash-max-size="0" :stash-time="0"
|
|
|
|
|
+ type="application/x-mpegURL" :controls="false" :show-fullscreen-btn="false" show-play-btn
|
|
|
|
|
+ show-mute-btn enable-play-gesture="true" @fullscreenchange="onFullscreenChange"
|
|
|
|
|
+ x5-video-player-fullscreen="false" x5-video-player-type="h5"
|
|
|
|
|
+ x5-video-orientation="landscape" :webkit-playsinline="true" playsinline="true"
|
|
|
|
|
+ :x5-playsinline="true">
|
|
|
</video>
|
|
</video>
|
|
|
- <view v-else class="txt">回放生成中...</view>
|
|
|
|
|
|
|
+ <view v-else class="txt">回放生成中...</view>
|
|
|
<view v-if="showCustomControls && liveItem.showType==1 && !isFullscreen" class="custom-controls"
|
|
<view v-if="showCustomControls && liveItem.showType==1 && !isFullscreen" class="custom-controls"
|
|
|
@click.stop="toggleFullscreen">
|
|
@click.stop="toggleFullscreen">
|
|
|
<image src="/static/images/full_screen.png" class="control-icon" />
|
|
<image src="/static/images/full_screen.png" class="control-icon" />
|
|
@@ -147,22 +150,22 @@
|
|
|
<!-- 投诉按钮 -->
|
|
<!-- 投诉按钮 -->
|
|
|
<view v-if="liveItem.showType==2||isFullscreen" class="complaint-box"
|
|
<view v-if="liveItem.showType==2||isFullscreen" class="complaint-box"
|
|
|
:class="isFullscreen ? 'complaint-full' : ''"
|
|
:class="isFullscreen ? 'complaint-full' : ''"
|
|
|
|
|
+ :style="{top:isFullscreen?'':'15%',bottom:isFullscreen?'86vw':''}"
|
|
|
@click="navgetTo('/pages_shopping/live/complaintList') ">
|
|
@click="navgetTo('/pages_shopping/live/complaintList') ">
|
|
|
<image class="image w32 h32 mr10" src="/static/images/complaint.png" mode="widthFix" />
|
|
<image class="image w32 h32 mr10" src="/static/images/complaint.png" mode="widthFix" />
|
|
|
<view class="fs26">投诉</view>
|
|
<view class="fs26">投诉</view>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<!-- 回放标签 -->
|
|
<!-- 回放标签 -->
|
|
|
- <view v-if="isPlayback" class="replay-label"
|
|
|
|
|
- :style="{top:liveItem.showType === 2 ?'16%':'10%'}"
|
|
|
|
|
- :class="isFullscreen? 'replay-full' : ''">回放
|
|
|
|
|
|
|
+ <view v-if="isPlayback" class="replay-label" :style="{top:liveItem.showType === 2?'22%':isFullscreen?'':'10%',bottom:isFullscreen?'75vw':''}"
|
|
|
|
|
+ :class="isFullscreen? 'replay-full' : ''">回放
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
<!-- 直播结束状态 -->
|
|
<!-- 直播结束状态 -->
|
|
|
<!-- v-if="liveItem.status == 3" -->
|
|
<!-- v-if="liveItem.status == 3" -->
|
|
|
<view class="videolist" v-if="liveItem.status == 3">
|
|
<view class="videolist" v-if="liveItem.status == 3">
|
|
|
- <view class="video-container"
|
|
|
|
|
|
|
+ <view class="video-container" style="height: 500rpx;"
|
|
|
:class="{'horizontal-layout': liveItem.showType == 1, 'fullscreen-mode': isFullscreen}">
|
|
:class="{'horizontal-layout': liveItem.showType == 1, 'fullscreen-mode': isFullscreen}">
|
|
|
<view class="live-end-message">直播已结束</view>
|
|
<view class="live-end-message">直播已结束</view>
|
|
|
</view>
|
|
</view>
|
|
@@ -173,7 +176,7 @@
|
|
|
<view class="video-container" :class="liveItem.showType == 1 ? 'horizontal-layout' : ''">
|
|
<view class="video-container" :class="liveItem.showType == 1 ? 'horizontal-layout' : ''">
|
|
|
<video v-if="liveItem.videoUrl && liveItem.liveType == 3" :id="`myVideo_${liveId}`"
|
|
<video v-if="liveItem.videoUrl && liveItem.liveType == 3" :id="`myVideo_${liveId}`"
|
|
|
class="video-player" :src="liveItem.videoUrl" :autoplay="true" :controls="true"
|
|
class="video-player" :src="liveItem.videoUrl" :autoplay="true" :controls="true"
|
|
|
- :object-fit="isFullscreen?'contain':'cover'" :custom-cache="false"
|
|
|
|
|
|
|
+ :object-fit="isFullscreen?'contain':'contain'" :custom-cache="false"
|
|
|
:enable-progress-gesture="liveItem.isSpeedAllowed" vslide-gesture-in-fullscreen="true"
|
|
:enable-progress-gesture="liveItem.isSpeedAllowed" vslide-gesture-in-fullscreen="true"
|
|
|
:show-center-play-btn="true" :http-cache="false" loop @error="videoError"
|
|
:show-center-play-btn="true" :http-cache="false" loop @error="videoError"
|
|
|
@timeupdate="onVideoTimeUpdate" @loadedmetadata="onVideoMetaLoaded" @pause="onVideoPause"
|
|
@timeupdate="onVideoTimeUpdate" @loadedmetadata="onVideoMetaLoaded" @pause="onVideoPause"
|
|
@@ -207,7 +210,7 @@
|
|
|
'chat-area-container2': liveItem.showType == 1,
|
|
'chat-area-container2': liveItem.showType == 1,
|
|
|
'chat-area-container3': liveItem.status == 1,
|
|
'chat-area-container3': liveItem.status == 1,
|
|
|
'chat-area-focused': isFocus
|
|
'chat-area-focused': isFocus
|
|
|
- }" :style="{ '--keyboard-height': keyboardHeight + 'rpx' }">
|
|
|
|
|
|
|
+ }" :style="{ '--keyboard-height': keyboardHeight + 'rpx' ,'display':isFullscreen?'none':''}">
|
|
|
<view class="tabs_bg" v-if="liveItem.showType == 1">
|
|
<view class="tabs_bg" v-if="liveItem.showType == 1">
|
|
|
<u-tabs :list="listTabs" @click="clickTabs" lineColor="#02B176"
|
|
<u-tabs :list="listTabs" @click="clickTabs" lineColor="#02B176"
|
|
|
:activeStyle="{color: '#02B176',fontWeight: 'bold',transform: 'scale(1.05)'}">
|
|
:activeStyle="{color: '#02B176',fontWeight: 'bold',transform: 'scale(1.05)'}">
|
|
@@ -226,6 +229,7 @@
|
|
|
公告消息: {{notice.msg}}
|
|
公告消息: {{notice.msg}}
|
|
|
</view>
|
|
</view>
|
|
|
<scroll-view id="msgScroll" v-if="Array.isArray(talklist)" enable-flex scroll-y="true"
|
|
<scroll-view id="msgScroll" v-if="Array.isArray(talklist)" enable-flex scroll-y="true"
|
|
|
|
|
+ :style="{ height: `calc(100% - ${commonViewHeight}px)`,marginTop:commonViewHeight+'px' }"
|
|
|
:enhanced="true" :bounces="false" :show-scrollbar="false" :fast-deceleration="false"
|
|
:enhanced="true" :bounces="false" :show-scrollbar="false" :fast-deceleration="false"
|
|
|
:enable-back-to-top="false" class="message-scroll-view"
|
|
:enable-back-to-top="false" class="message-scroll-view"
|
|
|
:class="liveItem.status == 1 ? 'message-scroll2' : ''" :scroll-top="scrollTop"
|
|
:class="liveItem.status == 1 ? 'message-scroll2' : ''" :scroll-top="scrollTop"
|
|
@@ -463,16 +467,16 @@
|
|
|
</u-popup>
|
|
</u-popup>
|
|
|
|
|
|
|
|
<!-- 消息弹窗 -->
|
|
<!-- 消息弹窗 -->
|
|
|
- <u-popup :show="isShowPopMsg" round="20rpx" mode="center" zIndex="10076">
|
|
|
|
|
- <view class="message-popup">
|
|
|
|
|
- <image class="message-close-icon"
|
|
|
|
|
- src="/static/images/message_icon.png"/>
|
|
|
|
|
- <view class="message-title">消息通知</view>
|
|
|
|
|
- <view class="message-content">{{popMsg}}</view>
|
|
|
|
|
- <view class="message-confirm-button" @click="isShowPopMsg = false">确认</view>
|
|
|
|
|
- <image src="/static/images/close_white_icon.png" class="close" @click="isShowPopMsg = false"></image>
|
|
|
|
|
- </view>
|
|
|
|
|
- </u-popup>
|
|
|
|
|
|
|
+ <u-popup :show="isShowPopMsg" round="20rpx" mode="center" zIndex="10076">
|
|
|
|
|
+ <view class="message-popup">
|
|
|
|
|
+ <image class="message-close-icon" src="/static/images/message_icon.png" />
|
|
|
|
|
+ <view class="message-title">消息通知</view>
|
|
|
|
|
+ <view class="message-content">{{popMsg}}</view>
|
|
|
|
|
+ <view class="message-confirm-button" @click="isShowPopMsg = false">确认</view>
|
|
|
|
|
+ <image src="/static/images/close_white_icon.png" class="close" @click="isShowPopMsg = false">
|
|
|
|
|
+ </image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </u-popup>
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 中奖和未中奖 -->
|
|
<!-- 中奖和未中奖 -->
|
|
@@ -735,11 +739,13 @@
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- menuButtonInfo:{},// 胶囊按钮布局信息
|
|
|
|
|
|
|
+ menuButtonInfo: {}, // 胶囊按钮布局信息
|
|
|
|
|
+
|
|
|
isFullscreen: false,
|
|
isFullscreen: false,
|
|
|
isVideoRotated: false,
|
|
isVideoRotated: false,
|
|
|
showNonVideoElementsFlag: true,
|
|
showNonVideoElementsFlag: true,
|
|
|
-
|
|
|
|
|
|
|
+ videoRatio: 56.25, // 默认16:9比例
|
|
|
|
|
+ scale: 1,
|
|
|
isMuted: false,
|
|
isMuted: false,
|
|
|
showCustomControls: true,
|
|
showCustomControls: true,
|
|
|
videoContext: null,
|
|
videoContext: null,
|
|
@@ -875,7 +881,7 @@
|
|
|
isFocus: false,
|
|
isFocus: false,
|
|
|
shopping: false,
|
|
shopping: false,
|
|
|
systemInfo: null, // 缓存系统信息,避免重复调用同步API
|
|
systemInfo: null, // 缓存系统信息,避免重复调用同步API
|
|
|
-
|
|
|
|
|
|
|
+ generatingTimer: null, //回访生成中
|
|
|
inputInfo: '',
|
|
inputInfo: '',
|
|
|
showWelcomeMessage: false,
|
|
showWelcomeMessage: false,
|
|
|
isShowGoods: false,
|
|
isShowGoods: false,
|
|
@@ -908,11 +914,12 @@
|
|
|
userData: {},
|
|
userData: {},
|
|
|
diffTotalTime: '',
|
|
diffTotalTime: '',
|
|
|
address: '',
|
|
address: '',
|
|
|
|
|
+ commonViewHeight: '',
|
|
|
user: {}
|
|
user: {}
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
async onLoad(options) {
|
|
async onLoad(options) {
|
|
|
- this.getMenuButtonInfo(); // 初始化获取胶囊信息
|
|
|
|
|
|
|
+ this.getMenuButtonInfo(); // 初始化获取胶囊信息
|
|
|
this.initTime()
|
|
this.initTime()
|
|
|
this.getLocationByIP();
|
|
this.getLocationByIP();
|
|
|
if (options.liveId) {
|
|
if (options.liveId) {
|
|
@@ -1023,7 +1030,6 @@
|
|
|
// 监听视频全屏事件
|
|
// 监听视频全屏事件
|
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
|
this.videoContext = uni.createVideoContext(`myVideo_${this.liveId}`, this);
|
|
this.videoContext = uni.createVideoContext(`myVideo_${this.liveId}`, this);
|
|
|
-
|
|
|
|
|
// 添加全屏状态变化监听(更可靠的方式)
|
|
// 添加全屏状态变化监听(更可靠的方式)
|
|
|
if (this.videoContext) {
|
|
if (this.videoContext) {
|
|
|
// 使用 uni.onUserCaptureScreen 作为备选方案
|
|
// 使用 uni.onUserCaptureScreen 作为备选方案
|
|
@@ -1048,7 +1054,6 @@
|
|
|
console.error('初始化失败:', error);
|
|
console.error('初始化失败:', error);
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-
|
|
|
|
|
this.getLocationByIP();
|
|
this.getLocationByIP();
|
|
|
|
|
|
|
|
this.uuId = generateRandomString(16);
|
|
this.uuId = generateRandomString(16);
|
|
@@ -1110,7 +1115,7 @@
|
|
|
this.startTimer();
|
|
this.startTimer();
|
|
|
|
|
|
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
|
- console.log(444,this.userInfo);
|
|
|
|
|
|
|
+ console.log(444, this.userInfo);
|
|
|
if (!this.userInfo || !this.userInfo.nickname) {
|
|
if (!this.userInfo || !this.userInfo.nickname) {
|
|
|
console.log('用户信息不完整,显示授权弹窗');
|
|
console.log('用户信息不完整,显示授权弹窗');
|
|
|
this.userlogo = true;
|
|
this.userlogo = true;
|
|
@@ -1368,23 +1373,42 @@
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
immediate: true
|
|
immediate: true
|
|
|
- }
|
|
|
|
|
|
|
+ },
|
|
|
|
|
+ 'isShowNotice': {
|
|
|
|
|
+ handler(newVal, oldVal) {
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ this.noticeHeightFun()
|
|
|
|
|
+ }, 800)
|
|
|
|
|
+ },
|
|
|
|
|
+ immediate: true
|
|
|
|
|
+ }
|
|
|
},
|
|
},
|
|
|
- methods: {
|
|
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ noticeHeightFun() {
|
|
|
|
|
+ const query = uni.createSelectorQuery().in(this);
|
|
|
|
|
+ query.select('.notice-message').boundingClientRect(rect => {
|
|
|
|
|
+ if (rect) {
|
|
|
|
|
+ this.commonViewHeight = rect.height;
|
|
|
|
|
+ this.forceScrollToBottomOnSend();
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.commonViewHeight = ''
|
|
|
|
|
+ }
|
|
|
|
|
+ }).exec();
|
|
|
|
|
+ },
|
|
|
// 获取胶囊按钮布局参数
|
|
// 获取胶囊按钮布局参数
|
|
|
- getMenuButtonInfo() {
|
|
|
|
|
- // 微信小程序API(Uniapp可直接用uni.getMenuButtonBoundingClientRect)
|
|
|
|
|
- const menuBtn = uni.getMenuButtonBoundingClientRect();
|
|
|
|
|
- if (menuBtn) {
|
|
|
|
|
-
|
|
|
|
|
- this.menuButtonInfo = {
|
|
|
|
|
- top: menuBtn.top + 'px', // 胶囊顶部距离
|
|
|
|
|
- height: menuBtn.height + 'px', // 胶囊高度
|
|
|
|
|
- centerY: (menuBtn.top + menuBtn.height / 2) + 'px', // 胶囊垂直居中Y坐标
|
|
|
|
|
- right: menuBtn.right + 'px' // 胶囊右侧距离
|
|
|
|
|
- };
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
|
|
+ getMenuButtonInfo() {
|
|
|
|
|
+ // 微信小程序API(Uniapp可直接用uni.getMenuButtonBoundingClientRect)
|
|
|
|
|
+ const menuBtn = uni.getMenuButtonBoundingClientRect();
|
|
|
|
|
+ if (menuBtn) {
|
|
|
|
|
+
|
|
|
|
|
+ this.menuButtonInfo = {
|
|
|
|
|
+ top: menuBtn.top + 'px', // 胶囊顶部距离
|
|
|
|
|
+ height: menuBtn.height + 'px', // 胶囊高度
|
|
|
|
|
+ centerY: (menuBtn.top + menuBtn.height / 2) + 'px', // 胶囊垂直居中Y坐标
|
|
|
|
|
+ right: menuBtn.right + 'px' // 胶囊右侧距离
|
|
|
|
|
+ };
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
// 退出全屏
|
|
// 退出全屏
|
|
|
exitFullscreen() {
|
|
exitFullscreen() {
|
|
|
console.log('执行退出全屏');
|
|
console.log('执行退出全屏');
|
|
@@ -1502,7 +1526,6 @@
|
|
|
enterFullscreen() {
|
|
enterFullscreen() {
|
|
|
console.log('执行进入全屏');
|
|
console.log('执行进入全屏');
|
|
|
this.isFullscreen = true;
|
|
this.isFullscreen = true;
|
|
|
-
|
|
|
|
|
// 设置横屏样式
|
|
// 设置横屏样式
|
|
|
this.rotateVideoList();
|
|
this.rotateVideoList();
|
|
|
|
|
|
|
@@ -2275,7 +2298,7 @@
|
|
|
'trafficTimer', 'pingTimeoutTimer', 'heartBeatTimer', 'liveViewDataTimer',
|
|
'trafficTimer', 'pingTimeoutTimer', 'heartBeatTimer', 'liveViewDataTimer',
|
|
|
'reconnectTimer', 'scrollTimer', 'searchTimer', 'purchasePromptTimer',
|
|
'reconnectTimer', 'scrollTimer', 'searchTimer', 'purchasePromptTimer',
|
|
|
'welcomeTimer', 'redTimer', 'liveStartTimer', 'lotteryTimer',
|
|
'welcomeTimer', 'redTimer', 'liveStartTimer', 'lotteryTimer',
|
|
|
- 'memoryMonitorTimer', 'networkStatusTimer', 'networkRetryTimer'
|
|
|
|
|
|
|
+ 'memoryMonitorTimer', 'networkStatusTimer', 'networkRetryTimer', 'generatingTimer'
|
|
|
];
|
|
];
|
|
|
|
|
|
|
|
return timers.filter(timer => this[timer] !== null).length;
|
|
return timers.filter(timer => this[timer] !== null).length;
|
|
@@ -2288,7 +2311,7 @@
|
|
|
'trafficTimer', 'pingTimeoutTimer', 'heartBeatTimer', 'liveViewDataTimer',
|
|
'trafficTimer', 'pingTimeoutTimer', 'heartBeatTimer', 'liveViewDataTimer',
|
|
|
'reconnectTimer', 'scrollTimer', 'searchTimer', 'purchasePromptTimer',
|
|
'reconnectTimer', 'scrollTimer', 'searchTimer', 'purchasePromptTimer',
|
|
|
'welcomeTimer', 'redTimer', 'liveStartTimer', 'lotteryTimer', 'noticeTimer',
|
|
'welcomeTimer', 'redTimer', 'liveStartTimer', 'lotteryTimer', 'noticeTimer',
|
|
|
- 'networkStatusTimer', 'networkRetryTimer'
|
|
|
|
|
|
|
+ 'networkStatusTimer', 'networkRetryTimer', 'generatingTimer'
|
|
|
];
|
|
];
|
|
|
|
|
|
|
|
timers.forEach(timerName => {
|
|
timers.forEach(timerName => {
|
|
@@ -2374,7 +2397,8 @@
|
|
|
'searchTimer',
|
|
'searchTimer',
|
|
|
'purchasePromptTimer',
|
|
'purchasePromptTimer',
|
|
|
'heartBeatTimer',
|
|
'heartBeatTimer',
|
|
|
- 'pingTimeoutTimer'
|
|
|
|
|
|
|
+ 'pingTimeoutTimer',
|
|
|
|
|
+ 'generatingTimer'
|
|
|
];
|
|
];
|
|
|
|
|
|
|
|
timers.forEach((timer) => {
|
|
timers.forEach((timer) => {
|
|
@@ -3038,6 +3062,22 @@
|
|
|
// 录播时间点
|
|
// 录播时间点
|
|
|
onVideoMetaLoaded(e) {
|
|
onVideoMetaLoaded(e) {
|
|
|
console.log("录播时间点", e)
|
|
console.log("录播时间点", e)
|
|
|
|
|
+ const width = e.detail.width;
|
|
|
|
|
+ const height = e.detail.height;
|
|
|
|
|
+ const res = uni.getSystemInfoSync();
|
|
|
|
|
+ const winH = res.windowHeight;
|
|
|
|
|
+ const winW = res.windowWidth;
|
|
|
|
|
+ //横屏
|
|
|
|
|
+ const wW = (winW / winH) * 100;
|
|
|
|
|
+ //竖屏
|
|
|
|
|
+ const wH = (winH / winW) * 100;
|
|
|
|
|
+ if (this.liveItem.showType == 2) {
|
|
|
|
|
+ const videoRatio = (height / width) * 100;
|
|
|
|
|
+ this.scale = wH / videoRatio;
|
|
|
|
|
+ console.log("比例", this.videoRatio, width, height)
|
|
|
|
|
+ } else if (this.isFullscreen) {
|
|
|
|
|
+ this.scale = wW / this.videoRatio;
|
|
|
|
|
+ }
|
|
|
this.videoProgressKey = `videoProgress_${this.liveId}`;
|
|
this.videoProgressKey = `videoProgress_${this.liveId}`;
|
|
|
this.setVideoProgress();
|
|
this.setVideoProgress();
|
|
|
},
|
|
},
|
|
@@ -3782,7 +3822,39 @@
|
|
|
this.$set(this.liveItem, 'showType', res.data.showType);
|
|
this.$set(this.liveItem, 'showType', res.data.showType);
|
|
|
this.storeId = res.storeId;
|
|
this.storeId = res.storeId;
|
|
|
this.startLiveViewDataTimer();
|
|
this.startLiveViewDataTimer();
|
|
|
- this.playVideo();
|
|
|
|
|
|
|
+ const diff = this.getTimeDifferenceInSeconds(this.liveItem.startTime)
|
|
|
|
|
+ if (diff >= this.liveItem.duration) {
|
|
|
|
|
+ const diffTime = diff - this.liveItem.duration
|
|
|
|
|
+ if (diffTime < 180) {
|
|
|
|
|
+ this.generating = true;
|
|
|
|
|
+
|
|
|
|
|
+ // 计算剩余等待时间
|
|
|
|
|
+ const remainingTime = Math.max(0, 180 - diffTime) * 1000;
|
|
|
|
|
+
|
|
|
|
|
+ if (this.generatingTimer) {
|
|
|
|
|
+ clearTimeout(this.generatingTimer);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ this.generatingTimer = setTimeout(() => {
|
|
|
|
|
+ this.generating = false;
|
|
|
|
|
+ this.hasPlayback = true;
|
|
|
|
|
+ this.playVideo();
|
|
|
|
|
+ this.closeWebSocket(true);
|
|
|
|
|
+ this.isEnd = true;
|
|
|
|
|
+ }, remainingTime);
|
|
|
|
|
+
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 已经超过18秒,应该直接播放
|
|
|
|
|
+ this.generating = false;
|
|
|
|
|
+ this.hasPlayback = true;
|
|
|
|
|
+ this.playVideo();
|
|
|
|
|
+ this.closeWebSocket(true);
|
|
|
|
|
+ this.isEnd = true;
|
|
|
|
|
+ }
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 直播还未结束,正常播放
|
|
|
|
|
+ this.playVideo();
|
|
|
|
|
+ }
|
|
|
} catch (err) {
|
|
} catch (err) {
|
|
|
console.error('获取直播信息失败:', err);
|
|
console.error('获取直播信息失败:', err);
|
|
|
uni.showToast({
|
|
uni.showToast({
|
|
@@ -4655,13 +4727,15 @@
|
|
|
.video-container.fullscreen-mode .fullscreen-exit-btn {
|
|
.video-container.fullscreen-mode .fullscreen-exit-btn {
|
|
|
z-index: 999999 !important;
|
|
z-index: 999999 !important;
|
|
|
}
|
|
}
|
|
|
- .fullscreen-mode {
|
|
|
|
|
- background-color: #000 !important;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .fullscreen-mode {
|
|
|
|
|
+ background-color: #000 !important;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
/* 全屏模式样式 */
|
|
/* 全屏模式样式 */
|
|
|
.video-container.fullscreen-mode {
|
|
.video-container.fullscreen-mode {
|
|
|
- width: auto !important;
|
|
|
|
|
- height: auto !important;
|
|
|
|
|
|
|
+ // width: auto !important;
|
|
|
|
|
+ // height: auto !important;
|
|
|
z-index: 99999 !important;
|
|
z-index: 99999 !important;
|
|
|
background-color: #000 !important;
|
|
background-color: #000 !important;
|
|
|
transform: rotate(90deg) !important;
|
|
transform: rotate(90deg) !important;
|
|
@@ -4680,6 +4754,8 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.video-container {
|
|
.video-container {
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ bottom: -1px;
|
|
|
transition: all 0.3s ease;
|
|
transition: all 0.3s ease;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -4942,7 +5018,8 @@
|
|
|
// margin-top:calc(var(--status-bar-height) + 10rpx);
|
|
// margin-top:calc(var(--status-bar-height) + 10rpx);
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
- flex-direction: column;
|
|
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+
|
|
|
&.horizontal-top {
|
|
&.horizontal-top {
|
|
|
position: static;
|
|
position: static;
|
|
|
margin-bottom: 30rpx;
|
|
margin-bottom: 30rpx;
|
|
@@ -4974,7 +5051,7 @@
|
|
|
|
|
|
|
|
.viewers-section {
|
|
.viewers-section {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
- justify-content:flex-end;
|
|
|
|
|
|
|
+ justify-content: flex-end;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
margin-top: 30rpx;
|
|
margin-top: 30rpx;
|
|
|
|
|
|
|
@@ -5036,16 +5113,17 @@
|
|
|
// 视频区域
|
|
// 视频区域
|
|
|
.videolist {
|
|
.videolist {
|
|
|
position: relative;
|
|
position: relative;
|
|
|
- height: var(--video-height);
|
|
|
|
|
|
|
+ // height: var(--video-height);
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
|
|
|
|
|
&.screen {
|
|
&.screen {
|
|
|
- width: 100vw;
|
|
|
|
|
- height: 100vh;
|
|
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ //height: 100vh;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.video-container {
|
|
.video-container {
|
|
|
- height: var(--video-height);
|
|
|
|
|
|
|
+ //height: var(--video-height);
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
transform: translateZ(0);
|
|
transform: translateZ(0);
|
|
|
backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
@@ -5060,7 +5138,7 @@
|
|
|
|
|
|
|
|
.complaint-box {
|
|
.complaint-box {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- top: 20%;
|
|
|
|
|
|
|
+ // top: 20%;
|
|
|
right: 20rpx;
|
|
right: 20rpx;
|
|
|
width: 140rpx;
|
|
width: 140rpx;
|
|
|
margin-top: 20rpx;
|
|
margin-top: 20rpx;
|
|
@@ -5071,10 +5149,9 @@
|
|
|
padding: 16rpx 0;
|
|
padding: 16rpx 0;
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
border-radius: 28rpx;
|
|
border-radius: 28rpx;
|
|
|
- z-index: 999;
|
|
|
|
|
-
|
|
|
|
|
|
|
+ z-index: 999999 !important;
|
|
|
&.complaint-full {
|
|
&.complaint-full {
|
|
|
- top: 10rpx;
|
|
|
|
|
|
|
+ // top: 10rpx;
|
|
|
left: 82vh;
|
|
left: 82vh;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -5094,7 +5171,7 @@
|
|
|
.video-player {
|
|
.video-player {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: 100%;
|
|
height: 100%;
|
|
|
- position: relative;
|
|
|
|
|
|
|
+ position: absolute;
|
|
|
z-index: 1;
|
|
z-index: 1;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -5109,7 +5186,7 @@
|
|
|
|
|
|
|
|
.replay-label {
|
|
.replay-label {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- top: 10%;
|
|
|
|
|
|
|
+ // top: 10%;
|
|
|
right: 24rpx;
|
|
right: 24rpx;
|
|
|
background-color: rgba(57, 57, 57, 0.6);
|
|
background-color: rgba(57, 57, 57, 0.6);
|
|
|
width: 100rpx;
|
|
width: 100rpx;
|
|
@@ -5118,11 +5195,11 @@
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
color: #fff;
|
|
color: #fff;
|
|
|
border-radius: 15rpx;
|
|
border-radius: 15rpx;
|
|
|
- z-index: 1;
|
|
|
|
|
|
|
+ z-index: 999999 !important;
|
|
|
|
|
|
|
|
&.replay-full {
|
|
&.replay-full {
|
|
|
left: 82vh;
|
|
left: 82vh;
|
|
|
- top: 16%!important;
|
|
|
|
|
|
|
+ // top: 16% !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -5973,57 +6050,58 @@
|
|
|
|
|
|
|
|
// 消息弹窗
|
|
// 消息弹窗
|
|
|
.message-popup {
|
|
.message-popup {
|
|
|
- display: flex;
|
|
|
|
|
- flex-direction: column;
|
|
|
|
|
- position: relative;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- padding: 126rpx 48rpx 0;
|
|
|
|
|
- width: 554rpx;
|
|
|
|
|
- box-sizing: border-box;
|
|
|
|
|
- background: linear-gradient( 180deg, #E2FCEF 0%, rgba(226,252,239,0) 100%);
|
|
|
|
|
- border-radius: 62rpx 62rpx 0rpx 0rpx;
|
|
|
|
|
-
|
|
|
|
|
- .message-close-icon {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- z-index: 9;
|
|
|
|
|
- top: -74rpx;
|
|
|
|
|
- width: 176rpx;
|
|
|
|
|
- height: 176rpx;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .message-title {
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- font-size: 36rpx;
|
|
|
|
|
- color: #333333;
|
|
|
|
|
- margin: 24rpx 0 28rpx;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .message-content {
|
|
|
|
|
- margin-bottom: 52rpx;
|
|
|
|
|
- font-weight: 400;
|
|
|
|
|
- font-size: 28rpx;
|
|
|
|
|
- color: #333333;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .message-confirm-button {
|
|
|
|
|
- width: 358rpx;
|
|
|
|
|
- height: 88rpx;
|
|
|
|
|
- line-height: 88rpx;
|
|
|
|
|
- background: linear-gradient( 136deg, #38D97D 0%, #02B176 100%);
|
|
|
|
|
- border-radius: 44rpx 44rpx 44rpx 44rpx;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- font-size: 32rpx;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
- color: #FFFFFF;
|
|
|
|
|
- }
|
|
|
|
|
- .close{
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- z-index: 9;
|
|
|
|
|
- bottom: -168rpx;
|
|
|
|
|
- width: 64rpx;
|
|
|
|
|
- height: 64rpx;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+ padding: 126rpx 48rpx 0;
|
|
|
|
|
+ width: 554rpx;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
+ background: linear-gradient(180deg, #E2FCEF 0%, rgba(226, 252, 239, 0) 100%);
|
|
|
|
|
+ border-radius: 62rpx 62rpx 0rpx 0rpx;
|
|
|
|
|
+
|
|
|
|
|
+ .message-close-icon {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ z-index: 9;
|
|
|
|
|
+ top: -74rpx;
|
|
|
|
|
+ width: 176rpx;
|
|
|
|
|
+ height: 176rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .message-title {
|
|
|
|
|
+ font-weight: 600;
|
|
|
|
|
+ font-size: 36rpx;
|
|
|
|
|
+ color: #333333;
|
|
|
|
|
+ margin: 24rpx 0 28rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .message-content {
|
|
|
|
|
+ margin-bottom: 52rpx;
|
|
|
|
|
+ font-weight: 400;
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ color: #333333;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .message-confirm-button {
|
|
|
|
|
+ width: 358rpx;
|
|
|
|
|
+ height: 88rpx;
|
|
|
|
|
+ line-height: 88rpx;
|
|
|
|
|
+ background: linear-gradient(136deg, #38D97D 0%, #02B176 100%);
|
|
|
|
|
+ border-radius: 44rpx 44rpx 44rpx 44rpx;
|
|
|
|
|
+ font-weight: 600;
|
|
|
|
|
+ font-size: 32rpx;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ color: #FFFFFF;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .close {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ z-index: 9;
|
|
|
|
|
+ bottom: -168rpx;
|
|
|
|
|
+ width: 64rpx;
|
|
|
|
|
+ height: 64rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
// 中奖弹窗
|
|
// 中奖弹窗
|
|
|
.prize-popup {
|
|
.prize-popup {
|