|
@@ -79,37 +79,21 @@
|
|
|
|
|
|
|
|
<!-- 观众头像列表 -->
|
|
<!-- 观众头像列表 -->
|
|
|
<!-- @click="toggleViewerList" -->
|
|
<!-- @click="toggleViewerList" -->
|
|
|
- <view v-if="Array.isArray(filteredViewers)" class="viewers-section">
|
|
|
|
|
|
|
+ <!-- <view v-if="Array.isArray(filteredViewers)" class="viewers-section">
|
|
|
<view style="display: flex;align-items: center;">
|
|
<view style="display: flex;align-items: center;">
|
|
|
<view v-for="(item, index) in (filteredViewers ||[])" :key="index">
|
|
<view v-for="(item, index) in (filteredViewers ||[])" :key="index">
|
|
|
<image v-if="item" class="viewer-avatar mr4" :src="item" />
|
|
<image v-if="item" class="viewer-avatar mr4" :src="item" />
|
|
|
</view>
|
|
</view>
|
|
|
<view class="viewer-count ">{{formattedWatchCount || 0 }}</view>
|
|
<view class="viewer-count ">{{formattedWatchCount || 0 }}</view>
|
|
|
</view>
|
|
</view>
|
|
|
- </view>
|
|
|
|
|
|
|
+ </view> -->
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
<!-- 视频区域 -->
|
|
<!-- 视频区域 -->
|
|
|
<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':isFullscreen?'auto':'400rpx',width:isFullscreen?'0':'100%'}"
|
|
:style="{ paddingBottom: liveItem.showType==2||isFullscreen?'':videoRatio + '%',height:liveItem.showType==2?'100vh':isFullscreen?'auto':'400rpx',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"
|
|
|
|
|
- :id="`myVideo_${liveId}`" :autoplay="true" class="video-player" :src="liveItem.videoUrl"
|
|
|
|
|
- object-fit="contain" :custom-cache="false" :enable-progress-gesture="false"
|
|
|
|
|
- vslide-gesture-in-fullscreen="true" :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="true"
|
|
|
|
|
- show-play-btn show-mute-btn enable-play-gesture="true"
|
|
|
|
|
- @fullscreenchange="onFullscreenChange" x5-video-player-fullscreen="true"
|
|
|
|
|
- x5-video-player-type="h5" x5-video-orientation="landscape" :webkit-playsinline="false"
|
|
|
|
|
- playsinline="false" :x5-playsinline="false">
|
|
|
|
|
- </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"
|
|
|
:style="{transform:liveItem.showType!==2?`scale(${scale})`:'', transformOrigin: 'center center', bottom:isFullscreen?'0':''}"
|
|
:style="{transform:liveItem.showType!==2?`scale(${scale})`:'', transformOrigin: 'center center', bottom:isFullscreen?'0':''}"
|
|
@@ -138,6 +122,7 @@
|
|
|
<text class="exit-text">退出全屏</text>
|
|
<text class="exit-text">退出全屏</text>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
+
|
|
|
<!-- 投诉按钮 -->
|
|
<!-- 投诉按钮 -->
|
|
|
<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' : ''"
|
|
@@ -152,6 +137,9 @@
|
|
|
:style="{top:liveItem.showType === 2?'22%':isFullscreen?'':'10%',bottom:isFullscreen?'75vw':''}"
|
|
:style="{top:liveItem.showType === 2?'22%':isFullscreen?'':'10%',bottom:isFullscreen?'75vw':''}"
|
|
|
:class="isFullscreen? 'replay-full' : ''">回放
|
|
:class="isFullscreen? 'replay-full' : ''">回放
|
|
|
</view>
|
|
</view>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 观看时间 -->
|
|
|
|
|
+ <view class="look-time" v-if="isPlayback&&liveItem.showType==1" :class="isFullscreen ? 'look-full' : '' ">{{playbackTime}}</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
<!-- 直播结束状态 -->
|
|
<!-- 直播结束状态 -->
|
|
@@ -238,7 +226,7 @@
|
|
|
:class="liveItem.showType == 1 ? 'horizontal-notice' : 'horizontal-notice2'">
|
|
:class="liveItem.showType == 1 ? 'horizontal-notice' : 'horizontal-notice2'">
|
|
|
公告消息: {{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: liveItem.showType === 1 || liveItem.showType == 2 && !isFocus?`calc(100% - ${commonViewHeight}px)`:'',
|
|
:style="{ height: liveItem.showType === 1 || liveItem.showType == 2 && !isFocus?`calc(100% - ${commonViewHeight}px)`:'',
|
|
|
marginTop:liveItem.showType === 1?commonViewHeight+'px':liveItem.showType == 2 && !isFocus?`calc(${commonViewHeight}px + 20rpx)`:'' }" :enhanced="true" :bounces="false"
|
|
marginTop:liveItem.showType === 1?commonViewHeight+'px':liveItem.showType == 2 && !isFocus?`calc(${commonViewHeight}px + 20rpx)`:'' }" :enhanced="true" :bounces="false"
|
|
|
:show-scrollbar="false" :fast-deceleration="false" :enable-back-to-top="false"
|
|
:show-scrollbar="false" :fast-deceleration="false" :enable-back-to-top="false"
|
|
@@ -256,12 +244,12 @@
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
- </scroll-view>
|
|
|
|
|
|
|
+ </scroll-view> -->
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<!-- 底部输入和操作区域 -->
|
|
<!-- 底部输入和操作区域 -->
|
|
|
<view class="input-actions-container" :class="{ 'input-actions-focused': isFocus }">
|
|
<view class="input-actions-container" :class="{ 'input-actions-focused': isFocus }">
|
|
|
- <view v-if="liveItem.status!=3&&!isPlayback" class="input-container" :class="{
|
|
|
|
|
|
|
+ <!-- <view v-if="liveItem.status!=3&&!isPlayback" class="input-container" :class="{
|
|
|
'input-container-focused': isFocus,
|
|
'input-container-focused': isFocus,
|
|
|
'input-container-normal': !isFocus
|
|
'input-container-normal': !isFocus
|
|
|
}">
|
|
}">
|
|
@@ -278,11 +266,10 @@
|
|
|
:class="{ 'input-focused': isFocus }" @focus="inputFocus" @blur="inputBlur"
|
|
:class="{ 'input-focused': isFocus }" @focus="inputFocus" @blur="inputBlur"
|
|
|
cursor-spacing="100" :adjust-position="false" :disabled="isEnd" @confirm="sendMsg"
|
|
cursor-spacing="100" :adjust-position="false" :disabled="isEnd" @confirm="sendMsg"
|
|
|
:confirm-type="value?'send':'done'" />
|
|
:confirm-type="value?'send':'done'" />
|
|
|
- <!-- v-if="isFocus&&!isIOS" -->
|
|
|
|
|
<view class="send-button" v-if="!isIOS" :class="liveItem.showType == 1 ? 'send2' : ''"
|
|
<view class="send-button" v-if="!isIOS" :class="liveItem.showType == 1 ? 'send2' : ''"
|
|
|
@click="sendMsg()">
|
|
@click="sendMsg()">
|
|
|
发送</view>
|
|
发送</view>
|
|
|
- </view>
|
|
|
|
|
|
|
+ </view> -->
|
|
|
<!-- :class="{ 'action-buttons-hidden': isFocus }" -->
|
|
<!-- :class="{ 'action-buttons-hidden': isFocus }" -->
|
|
|
<view class="action-buttons" v-if="!isFocus">
|
|
<view class="action-buttons" v-if="!isFocus">
|
|
|
<view class="action-button-group" v-if="!isFocus">
|
|
<view class="action-button-group" v-if="!isFocus">
|
|
@@ -755,7 +742,7 @@
|
|
|
return {
|
|
return {
|
|
|
receiveStatus: false,
|
|
receiveStatus: false,
|
|
|
completionRate: 0,
|
|
completionRate: 0,
|
|
|
- playbackTime: null, //用户观看回放时间
|
|
|
|
|
|
|
+ playbackTime: '00:00:00', //用户观看回放时间
|
|
|
// 观看时长统计变量
|
|
// 观看时长统计变量
|
|
|
watchStartTime: 0, // 开始观看时间戳
|
|
watchStartTime: 0, // 开始观看时间戳
|
|
|
accumulatedWatchDuration: 0, // 累计观看时长(秒)
|
|
accumulatedWatchDuration: 0, // 累计观看时长(秒)
|
|
@@ -797,9 +784,7 @@
|
|
|
`https://bjzmky-1323137866.cos.ap-chongqing.myqcloud.com/userapp/images/avatar${i + 1}.jpg`),
|
|
`https://bjzmky-1323137866.cos.ap-chongqing.myqcloud.com/userapp/images/avatar${i + 1}.jpg`),
|
|
|
virtualHuman: null,
|
|
virtualHuman: null,
|
|
|
userlogo: false,
|
|
userlogo: false,
|
|
|
- listTabs: [{
|
|
|
|
|
- name: '讨论',
|
|
|
|
|
- }],
|
|
|
|
|
|
|
+ listTabs: [],
|
|
|
generating: false,
|
|
generating: false,
|
|
|
hasPlayback: false,
|
|
hasPlayback: false,
|
|
|
isPlayback: false, //是否是回放
|
|
isPlayback: false, //是否是回放
|
|
@@ -1548,8 +1533,10 @@
|
|
|
},
|
|
},
|
|
|
'notice.msg': {
|
|
'notice.msg': {
|
|
|
handler(newVal, oldVal) {
|
|
handler(newVal, oldVal) {
|
|
|
- const newLength = newVal.length;
|
|
|
|
|
- const oldLength = oldVal.length;
|
|
|
|
|
|
|
+ // 添加空值检查
|
|
|
|
|
+ const newLength = newVal ? newVal.length : 0;
|
|
|
|
|
+ const oldLength = oldVal ? oldVal.length : 0;
|
|
|
|
|
+
|
|
|
if (newLength !== oldLength) {
|
|
if (newLength !== oldLength) {
|
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
|
this.noticeHeightFun()
|
|
this.noticeHeightFun()
|
|
@@ -3746,9 +3733,20 @@
|
|
|
//横屏
|
|
//横屏
|
|
|
const wW = (winW / winH) * 100;
|
|
const wW = (winW / winH) * 100;
|
|
|
//竖屏
|
|
//竖屏
|
|
|
|
|
+ if (height > width) {
|
|
|
|
|
+ this.isHeight = true
|
|
|
|
|
+ }
|
|
|
const wH = (winH / winW) * 100;
|
|
const wH = (winH / winW) * 100;
|
|
|
|
|
+ // this.scale = wW / this.videoRatio;
|
|
|
|
|
+ // 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.videoProgressKey = `videoProgress_${this.liveId}`;
|
|
this.videoProgressKey = `videoProgress_${this.liveId}`;
|
|
|
this.setVideoProgress();
|
|
this.setVideoProgress();
|
|
|
|
|
+
|
|
|
// 视频加载成功后,启动流量计算
|
|
// 视频加载成功后,启动流量计算
|
|
|
if (!this.videoLoaded) {
|
|
if (!this.videoLoaded) {
|
|
|
this.videoLoaded = true;
|
|
this.videoLoaded = true;
|
|
@@ -3825,8 +3823,9 @@
|
|
|
onVideoTimeUpdate(e) {
|
|
onVideoTimeUpdate(e) {
|
|
|
// 获取当前播放时间
|
|
// 获取当前播放时间
|
|
|
this.videoCurrentTime = e.detail.currentTime;
|
|
this.videoCurrentTime = e.detail.currentTime;
|
|
|
- // 每隔10秒保存一次进度(避免频繁存储)
|
|
|
|
|
- if (Math.floor(this.videoCurrentTime) % 10 === 0) {
|
|
|
|
|
|
|
+ // 每隔1秒保存一次进度(避免频繁存储)
|
|
|
|
|
+ //
|
|
|
|
|
+ if (Math.floor(this.videoCurrentTime) % 1 === 0) {
|
|
|
this.saveVideoProgress();
|
|
this.saveVideoProgress();
|
|
|
}
|
|
}
|
|
|
const diff = this.getTimeDifferenceInSeconds(this.liveItem.startTime)
|
|
const diff = this.getTimeDifferenceInSeconds(this.liveItem.startTime)
|
|
@@ -3844,17 +3843,19 @@
|
|
|
this.isEnd = true;
|
|
this.isEnd = true;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
- // LJX
|
|
|
|
|
- // this.$nextTick(() => {
|
|
|
|
|
- // const difPlayback = currentTime
|
|
|
|
|
- // const totalSeconds = Math.floor(difPlayback / 1000);
|
|
|
|
|
- // const hours = this.padZero(Math.floor(totalSeconds / 3600));
|
|
|
|
|
- // const minutes = this.padZero(Math.floor((totalSeconds % 3600) / 60));
|
|
|
|
|
- // const seconds = this.padZero(totalSeconds % 60);
|
|
|
|
|
- // this.playbackTime = `${hours}:${minutes}:${seconds}`;
|
|
|
|
|
- // console.log("这个时间", difPlayback)
|
|
|
|
|
- // });
|
|
|
|
|
|
|
+
|
|
|
|
|
+ // 观看时间 ljx
|
|
|
|
|
+ let currentTime=''
|
|
|
|
|
+ const storedProgress = uni.getStorageSync(this.videoProgressKey) || 0;
|
|
|
|
|
+ currentTime = storedProgress >= this.liveItem.duration ? 0 : storedProgress || 0;
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ const difPlayback = currentTime
|
|
|
|
|
+ const totalSeconds = Math.floor(difPlayback );
|
|
|
|
|
+ const hours = this.padZero(Math.floor(totalSeconds / 3600));
|
|
|
|
|
+ const minutes = this.padZero(Math.floor((totalSeconds % 3600) / 60));
|
|
|
|
|
+ const seconds = this.padZero(totalSeconds % 60);
|
|
|
|
|
+ this.playbackTime = `${hours}:${minutes}:${seconds}`;
|
|
|
|
|
+ });
|
|
|
|
|
|
|
|
},
|
|
},
|
|
|
|
|
|
|
@@ -5597,7 +5598,7 @@
|
|
|
/* 全屏按钮样式优化 */
|
|
/* 全屏按钮样式优化 */
|
|
|
.custom-controls {
|
|
.custom-controls {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- bottom: 10%;
|
|
|
|
|
|
|
+ bottom: 24rpx;
|
|
|
right: 40rpx;
|
|
right: 40rpx;
|
|
|
z-index: 9999;
|
|
z-index: 9999;
|
|
|
background: rgba(0, 0, 0, 0.6);
|
|
background: rgba(0, 0, 0, 0.6);
|
|
@@ -5967,7 +5968,7 @@
|
|
|
|
|
|
|
|
&.horizontal-top {
|
|
&.horizontal-top {
|
|
|
position: static;
|
|
position: static;
|
|
|
- margin-bottom: 30rpx;
|
|
|
|
|
|
|
+ margin-bottom: 100rpx;
|
|
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -6148,6 +6149,20 @@
|
|
|
// top: 16% !important;
|
|
// top: 16% !important;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+ .look-time{
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ left: 24rpx;
|
|
|
|
|
+ bottom: 24rpx;
|
|
|
|
|
+ font-size: 20rpx;
|
|
|
|
|
+ background-color: rgba(57, 57, 57, 0.6);
|
|
|
|
|
+ border-radius: 15rpx;
|
|
|
|
|
+ z-index: 999999 !important;
|
|
|
|
|
+ padding: 10rpx 16rpx;
|
|
|
|
|
+ color: #fff;
|
|
|
|
|
+ &.look-full {
|
|
|
|
|
+ left: 10vh;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -6280,10 +6295,11 @@
|
|
|
|
|
|
|
|
.tabs_bg {
|
|
.tabs_bg {
|
|
|
background-color: #fff;
|
|
background-color: #fff;
|
|
|
- padding: 20rpx 40rpx 0;
|
|
|
|
|
|
|
+ padding: 0 40rpx;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
|
|
+ height: 96rpx;
|
|
|
|
|
|
|
|
.complaint-box {
|
|
.complaint-box {
|
|
|
width: 120rpx;
|
|
width: 120rpx;
|