h5视频处理及客服聊天界面优化
This commit is contained in:
parent
635a166bf5
commit
11c8d1fdd1
@ -143,7 +143,7 @@
|
|||||||
<!--拼团商品链接-->
|
<!--拼团商品链接-->
|
||||||
<div class="conter acea-row row-middle"
|
<div class="conter acea-row row-middle"
|
||||||
v-if="item.msn_type === 8 && item.productGroup && item.productGroup.product">
|
v-if="item.msn_type === 8 && item.productGroup && item.productGroup.product">
|
||||||
<div class=" noPad">
|
<div class="noPad">
|
||||||
<navigator class="acea-row row-column-around noPad"
|
<navigator class="acea-row row-column-around noPad"
|
||||||
v-if="item.productGroup.product_group_id"
|
v-if="item.productGroup.product_group_id"
|
||||||
:url="`/pages/activity/combination_details/index?id=${item.productGroup.product_group_id}`"
|
:url="`/pages/activity/combination_details/index?id=${item.productGroup.product_group_id}`"
|
||||||
@ -216,6 +216,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</navigator>
|
</navigator>
|
||||||
|
|
||||||
<!--订单链接-->
|
<!--订单链接-->
|
||||||
<div v-if="item.msn_type === 5 && item.orderInfo.order_id">
|
<div v-if="item.msn_type === 5 && item.orderInfo.order_id">
|
||||||
<div class="broadcast-details_num acea-row row-middle">
|
<div class="broadcast-details_num acea-row row-middle">
|
||||||
@ -358,6 +359,7 @@
|
|||||||
<block v-for="(items,index) in history" v-if="userId == 0" :key="items.time">
|
<block v-for="(items,index) in history" v-if="userId == 0" :key="items.time">
|
||||||
<div class="create_time">{{items.time}}</div>
|
<div class="create_time">{{items.time}}</div>
|
||||||
<block v-for="(item,j) in items.children" :key="item.service_log_id">
|
<block v-for="(item,j) in items.children" :key="item.service_log_id">
|
||||||
|
|
||||||
<!-- 左边 -->
|
<!-- 左边 -->
|
||||||
<div class="item acea-row row-top" v-if="item.send_type == 1">
|
<div class="item acea-row row-top" v-if="item.send_type == 1">
|
||||||
<div v-if="item.msn_type !== 100" class="pictrue">
|
<div v-if="item.msn_type !== 100" class="pictrue">
|
||||||
@ -684,7 +686,7 @@
|
|||||||
</block>
|
</block>
|
||||||
</block>
|
</block>
|
||||||
<view class="footer_box" v-if="productId || orderId || refund_order_id"></view>
|
<view class="footer_box" v-if="productId || orderId || refund_order_id"></view>
|
||||||
<div class="broadcast-details_order footer_count">
|
<div class="broadcast-details_order footer_count" >
|
||||||
<!-- 商品信息 -->
|
<!-- 商品信息 -->
|
||||||
<div class="broadcast-details_box" v-if="productId && productInfo.product_id">
|
<div class="broadcast-details_box" v-if="productId && productInfo.product_id">
|
||||||
<text class="iconfont icon-guanbi" @click.stop="productId = ''"></text>
|
<text class="iconfont icon-guanbi" @click.stop="productId = ''"></text>
|
||||||
@ -778,7 +780,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
<div class="banner slider-banner">
|
<div class="banner slider-banner" >
|
||||||
<swiper class="swiper-wrapper" :autoplay="autoplay" :circular="circular" :interval="interval"
|
<swiper class="swiper-wrapper" :autoplay="autoplay" :circular="circular" :interval="interval"
|
||||||
:duration="duration" v-if="emojiGroup.length > 0">
|
:duration="duration" v-if="emojiGroup.length > 0">
|
||||||
<block v-for="(emojiList, index) in emojiGroup" :key="index">
|
<block v-for="(emojiList, index) in emojiGroup" :key="index">
|
||||||
@ -1603,7 +1605,7 @@
|
|||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
width: 710rpx;
|
width: 710rpx;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 120rpx;
|
bottom: 160rpx;
|
||||||
left: 20rpx;
|
left: 20rpx;
|
||||||
|
|
||||||
.broadcast-details_box,
|
.broadcast-details_box,
|
||||||
@ -1790,6 +1792,7 @@
|
|||||||
|
|
||||||
.broadcast-details .chat .item .text {
|
.broadcast-details .chat .item .text {
|
||||||
margin-left: 20rpx;
|
margin-left: 20rpx;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.broadcast-details .chat .item .text.textR {
|
.broadcast-details .chat .item .text.textR {
|
||||||
@ -1945,12 +1948,12 @@
|
|||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
margin-bottom: var(--status-bar-height);;
|
padding-bottom: var(--status-bar-height);
|
||||||
}
|
}
|
||||||
|
|
||||||
.broadcast-details .footerCon.on {
|
.broadcast-details .footerCon.on {
|
||||||
position: relative;
|
position: relative;
|
||||||
top: -300rpx;
|
top: -250rpx;
|
||||||
transform: translate3d(0, 0, 0) !important;
|
transform: translate3d(0, 0, 0) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1980,6 +1983,8 @@
|
|||||||
|
|
||||||
.broadcast-details .footerCon .slider-banner .swiper-pagination-bullet-active {
|
.broadcast-details .footerCon .slider-banner .swiper-pagination-bullet-active {
|
||||||
background-color: #999;
|
background-color: #999;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.broadcast-details .recording {
|
.broadcast-details .recording {
|
||||||
@ -2064,7 +2069,7 @@
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 50rpx;
|
width: 50rpx;
|
||||||
height: 50rpx;
|
height: 50rpx;
|
||||||
margin: 40rpx 0 0 50rpx;
|
margin: 20rpx 0 0 40rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.emoji-outer {
|
.emoji-outer {
|
||||||
|
@ -226,7 +226,8 @@
|
|||||||
<text class="count">{{item.relevance.length}}</text>
|
<text class="count">{{item.relevance.length}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="showManage == item.author.uid || showManage " class="manage" :style="{'margin-top':item.relevance.length>0?'-115rpx':'0px'}">
|
<view v-if="showManage == item.author.uid || showManage " class="manage"
|
||||||
|
:style="{'margin-top':item.relevance.length>0?'-115rpx':'0px'}">
|
||||||
<view class="manage-gou"></view>
|
<view class="manage-gou"></view>
|
||||||
<navigator hover-class="none"
|
<navigator hover-class="none"
|
||||||
:url="'/pages/plantGrass/plant_release/index?id='+item.community_id+'&type=2'"
|
:url="'/pages/plantGrass/plant_release/index?id='+item.community_id+'&type=2'"
|
||||||
@ -304,16 +305,16 @@
|
|||||||
deleteAndroidHeight
|
deleteAndroidHeight
|
||||||
这两个参数用于控制评论等的高度
|
这两个参数用于控制评论等的高度
|
||||||
-->
|
-->
|
||||||
<douyin-scrollview ref="comments" :deleteIOSHeight="36" :deleteAndroidHeight="15" :userInfo="userInfo"
|
<douyin-scrollview ref="comments" :deleteIOSHeight="36" :deleteAndroidHeight="15" :userInfo="userInfo"
|
||||||
@closeScrollview="closeScrollview" @successFul="pinlunFun"></douyin-scrollview>
|
@closeScrollview="closeScrollview" @successFul="pinlunFun"></douyin-scrollview>
|
||||||
</view>
|
</view>
|
||||||
</uni-popup>
|
</uni-popup>
|
||||||
<!-- 他提到的宝贝弹窗 -->
|
<!-- 他提到的宝贝弹窗 -->
|
||||||
<uni-popup type="bottom" ref="pinglunMentioned" >
|
<uni-popup type="bottom" ref="pinglunMentioned">
|
||||||
|
|
||||||
|
|
||||||
<mentioned ref="mentioned" @close="closePopup" :list="moreList" :uid="authorUid" ></mentioned>
|
<mentioned ref="mentioned" @close="closePopup" :list="moreList" :uid="authorUid"></mentioned>
|
||||||
|
|
||||||
</uni-popup>
|
</uni-popup>
|
||||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||||
<view class="fixed-head">
|
<view class="fixed-head">
|
||||||
@ -361,6 +362,7 @@
|
|||||||
import {
|
import {
|
||||||
navigateBack
|
navigateBack
|
||||||
} from '../../../libs/uniApi';
|
} from '../../../libs/uniApi';
|
||||||
|
import list from '../../../uni_modules/uview-ui/libs/config/props/list';
|
||||||
export default {
|
export default {
|
||||||
computed: configMap({
|
computed: configMap({
|
||||||
statusBarHeight: 0,
|
statusBarHeight: 0,
|
||||||
@ -718,14 +720,13 @@
|
|||||||
// });
|
// });
|
||||||
// })'
|
// })'
|
||||||
// that.isUser ?
|
// that.isUser ?
|
||||||
|
|
||||||
videoList({
|
videoList({
|
||||||
page: that.page,
|
page: that.page,
|
||||||
limit: that.limit,
|
limit: that.limit,
|
||||||
id: this.videoID
|
id: this.videoID
|
||||||
|
|
||||||
}).then(res => {
|
}).then(res => {
|
||||||
console.log(res.data,'1')
|
|
||||||
that.getVideoData(res.data.list);
|
that.getVideoData(res.data.list);
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -898,11 +899,43 @@
|
|||||||
// if(!this.loadVideo) return
|
// if(!this.loadVideo) return
|
||||||
this.loadVideo = true
|
this.loadVideo = true
|
||||||
// 这个方法主要就是用来第一次进入视频播放时用来处理
|
// 这个方法主要就是用来第一次进入视频播放时用来处理
|
||||||
deoList(this.videoID).then(async (res) => {
|
// deoList(this.videoID).then(async (res) => {
|
||||||
|
// this.loadVideo = false
|
||||||
|
// this.userUid = res.data.uid
|
||||||
|
// this.page = 1;
|
||||||
|
// var msg = [res.data];
|
||||||
|
// for (let i = 0; i < msg.length; i++) {
|
||||||
|
// msg[i]['isMore'] = false
|
||||||
|
// msg[i]['playIng'] = false
|
||||||
|
// msg[i]['state'] = false
|
||||||
|
// msg[i]['isplay'] = false
|
||||||
|
// msg[i]['loading'] = false
|
||||||
|
// msg[i]['community_id'] = msg[i]['community_id'].toString()
|
||||||
|
// }
|
||||||
|
// this.dataList = msg;
|
||||||
|
|
||||||
|
// if (this.dataList.length !== 0) {
|
||||||
|
// this.dataList[this.k].state = 'play';
|
||||||
|
// uni.createVideoContext(this.dataList[this.k].community_id, this).play()
|
||||||
|
// }
|
||||||
|
// }).catch(err => {
|
||||||
|
// return uni.showToast({
|
||||||
|
// title: err,
|
||||||
|
// icon: 'none',
|
||||||
|
// duration: 2000
|
||||||
|
// });
|
||||||
|
// })
|
||||||
|
|
||||||
|
videoList({
|
||||||
|
page: this.page,
|
||||||
|
limit: this.limit,
|
||||||
|
id: this.videoID
|
||||||
|
}).then(async (res) => {
|
||||||
|
this.page = that.page + 1
|
||||||
this.loadVideo = false
|
this.loadVideo = false
|
||||||
this.userUid = res.data.uid
|
this.userUid = res.data.uid
|
||||||
this.page = 1;
|
|
||||||
var msg = [res.data];
|
var msg =res.data.list;
|
||||||
for (let i = 0; i < msg.length; i++) {
|
for (let i = 0; i < msg.length; i++) {
|
||||||
msg[i]['isMore'] = false
|
msg[i]['isMore'] = false
|
||||||
msg[i]['playIng'] = false
|
msg[i]['playIng'] = false
|
||||||
@ -926,7 +959,6 @@
|
|||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// this.isUser ?
|
// this.isUser ?
|
||||||
// myVideoList(this.userUid, {
|
// myVideoList(this.userUid, {
|
||||||
// page: this.page,
|
// page: this.page,
|
||||||
@ -1115,7 +1147,6 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
// .video-list{
|
// .video-list{
|
||||||
// padding: 200rpx 28.07rpx 0 28.07rpx;
|
// padding: 200rpx 28.07rpx 0 28.07rpx;
|
||||||
// display: flex;
|
// display: flex;
|
||||||
@ -1135,7 +1166,7 @@
|
|||||||
/* #ifdef MP */
|
/* #ifdef MP */
|
||||||
padding-top: 200rpx;
|
padding-top: 200rpx;
|
||||||
/* #endif */
|
/* #endif */
|
||||||
|
|
||||||
// background-color: #000000;
|
// background-color: #000000;
|
||||||
background-color: #F5F5F5;
|
background-color: #F5F5F5;
|
||||||
|
|
||||||
@ -1258,18 +1289,19 @@
|
|||||||
left: 0;
|
left: 0;
|
||||||
top: 70rpx;
|
top: 70rpx;
|
||||||
height: 86rpx;
|
height: 86rpx;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.icon-xiangzuo {
|
.icon-xiangzuo {
|
||||||
|
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
padding-right: 30rpx;
|
padding-right: 30rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -435,7 +435,9 @@
|
|||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
k(new_k, old_k) {
|
k(new_k, old_k) {
|
||||||
|
|
||||||
const max = new_k + 2;
|
const max = new_k + 2;
|
||||||
|
|
||||||
if (this.max < max) {
|
if (this.max < max) {
|
||||||
this.max = max;
|
this.max = max;
|
||||||
}
|
}
|
||||||
@ -451,7 +453,7 @@
|
|||||||
uni.createVideoContext(this.dataList[old_k].community_id + '' + old_k, this)
|
uni.createVideoContext(this.dataList[old_k].community_id + '' + old_k, this)
|
||||||
.pause() //如果视频暂停,那么旧视频停止,这里的this.dataList[old_k].id + '' + old_k,后面加 old_k 是为了每一个视频的 id 值不同,这样就可以大程度的避免串音问题
|
.pause() //如果视频暂停,那么旧视频停止,这里的this.dataList[old_k].id + '' + old_k,后面加 old_k 是为了每一个视频的 id 值不同,这样就可以大程度的避免串音问题
|
||||||
// console.log('已经暂停 --> 第' + (old_k + 1) + '个视频~') //提示
|
// console.log('已经暂停 --> 第' + (old_k + 1) + '个视频~') //提示
|
||||||
// #ifdef MP
|
|
||||||
this.dataList[new_k].state = 'play'
|
this.dataList[new_k].state = 'play'
|
||||||
this.dataList[new_k].isplay = false
|
this.dataList[new_k].isplay = false
|
||||||
this.dataList[new_k].playIng = true
|
this.dataList[new_k].playIng = true
|
||||||
@ -461,7 +463,7 @@
|
|||||||
}, 250)
|
}, 250)
|
||||||
}
|
}
|
||||||
this.videoShare(this.dataList[new_k])
|
this.videoShare(this.dataList[new_k])
|
||||||
// #endif
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(options) {
|
onLoad(options) {
|
||||||
@ -504,7 +506,7 @@
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
//#ifdef MP
|
|
||||||
videoShare(item) {
|
videoShare(item) {
|
||||||
if (item && item.status == 1) {
|
if (item && item.status == 1) {
|
||||||
let uid = this.uid ? this.uid : 0;
|
let uid = this.uid ? this.uid : 0;
|
||||||
@ -520,7 +522,7 @@
|
|||||||
uni.hideShareMenu()
|
uni.hideShareMenu()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// #endif
|
|
||||||
goBack: function() {
|
goBack: function() {
|
||||||
uni.navigateBack();
|
uni.navigateBack();
|
||||||
},
|
},
|
||||||
@ -752,43 +754,43 @@
|
|||||||
let that = this
|
let that = this
|
||||||
|
|
||||||
// 1.这里引入后端请求数据
|
// 1.这里引入后端请求数据
|
||||||
if (that.videoshow) {
|
// if (that.videoshow) {
|
||||||
deoList(this.videoID).then(res => {
|
// deoList(this.videoID).then(res => {
|
||||||
that.videoData([res.data])
|
// that.videoData([res.data])
|
||||||
if (res.data.list.length < that.limit) {
|
// if (res.data.list.length < that.limit) {
|
||||||
this.loadMore = false;
|
// this.loadMore = false;
|
||||||
}
|
// }
|
||||||
}).catch(err => {
|
// }).catch(err => {
|
||||||
return uni.showToast({
|
// return uni.showToast({
|
||||||
title: err,
|
// title: err,
|
||||||
icon: 'none',
|
// icon: 'none',
|
||||||
duration: 2000
|
// duration: 2000
|
||||||
});
|
// });
|
||||||
})
|
// })
|
||||||
this.videoshow = false
|
// this.videoshow = false
|
||||||
} else {
|
// } else {
|
||||||
// videoList().then(res=>{
|
// videoList().then(res=>{
|
||||||
// that.videoData(res.data.list);
|
// that.videoData(res.data.list);
|
||||||
// })
|
// })
|
||||||
// console.log(that.userUid,that.videoID)
|
// console.log(that.userUid,that.videoID)
|
||||||
videoList({
|
videoList({
|
||||||
page: that.page,
|
page: that.page,
|
||||||
limit: that.limit,
|
limit: that.limit,
|
||||||
id: this.videoID
|
id: this.videoID
|
||||||
|
|
||||||
}).then(res => {
|
}).then(res => {
|
||||||
that.videoData(res.data.list)
|
that.videoData(res.data.list)
|
||||||
if (res.data.list.length < that.limit) {
|
if (res.data.list.length < that.limit) {
|
||||||
this.loadMore = false;
|
this.loadMore = false;
|
||||||
}
|
}
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
return uni.showToast({
|
return uni.showToast({
|
||||||
title: err,
|
title: err,
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
duration: 2000
|
duration: 2000
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
}
|
// }
|
||||||
|
|
||||||
// that.isUser ?
|
// that.isUser ?
|
||||||
// myVideoList(that.userUid, {
|
// myVideoList(that.userUid, {
|
||||||
@ -851,7 +853,9 @@
|
|||||||
this.communityId = list[0]['community_id']
|
this.communityId = list[0]['community_id']
|
||||||
if (list.length == 0) return
|
if (list.length == 0) return
|
||||||
let that = this;
|
let that = this;
|
||||||
|
|
||||||
that.page = that.page + 1;
|
that.page = that.page + 1;
|
||||||
|
|
||||||
var msg = list
|
var msg = list
|
||||||
// 2.这里把视频添加到视频列表
|
// 2.这里把视频添加到视频列表
|
||||||
for (let i = 0; i < msg.length; i++) {
|
for (let i = 0; i < msg.length; i++) {
|
||||||
@ -861,15 +865,21 @@
|
|||||||
msg[i]['isplay'] = true
|
msg[i]['isplay'] = true
|
||||||
msg[i]['loading'] = false
|
msg[i]['loading'] = false
|
||||||
that.dataList.push(msg[i])
|
that.dataList.push(msg[i])
|
||||||
//#ifndef H5
|
|
||||||
|
|
||||||
|
console.log(i, that.k)
|
||||||
if (i == 0 && that.k == 0) {
|
if (i == 0 && that.k == 0) {
|
||||||
this.dataList[0].isplay = false
|
this.dataList[0].isplay = false
|
||||||
this.dataList[0].playIng = true
|
this.dataList[0].playIng = true
|
||||||
this.dataList[0].state = 'play'
|
this.dataList[0].state = 'play'
|
||||||
this.dataList[0].loading = false
|
this.dataList[0].loading = false
|
||||||
uni.createVideoContext(that.dataList[0].community_id + '' + 0, that).play()
|
setTimeout(() => {
|
||||||
|
uni.createVideoContext(that.dataList[0].community_id + '' + 0, that).play()
|
||||||
|
// uni.createVideoContext(this.dataList[new_k].community_id + '' + new_k, this).play()
|
||||||
|
}, 250)
|
||||||
|
|
||||||
}
|
}
|
||||||
//#endif
|
|
||||||
}
|
}
|
||||||
//#ifdef MP
|
//#ifdef MP
|
||||||
if (this.k == 0) {
|
if (this.k == 0) {
|
||||||
@ -1767,7 +1777,7 @@
|
|||||||
margin-top: 27rpx;
|
margin-top: 27rpx;
|
||||||
|
|
||||||
.product-item {
|
.product-item {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 444rpx;
|
width: 444rpx;
|
||||||
height: 136rpx;
|
height: 136rpx;
|
||||||
background: rgba(0, 0, 0, .55);
|
background: rgba(0, 0, 0, .55);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user