Skip to content

M
mayi-mp-shop
Commit 905a5786 by 程智春
Options

直播2.0

parent b909156b
Showing with 315 additions and 10 deletions
src/api/liveing.js
......@@ -36,5 +36,17 @@ export default {
//获取服务器时间戳
queryServerTimeNow(){
return requestGET(`${process.env.OLSHOP_URL}/liveBroadcastInfo/getServerTimeNow`)
},
// 根据号码查询主播创建直播权限状态
queryLivePermissions(options){
return requestPOST(`${process.env.OLSHOP_URL}/liveAnchor/getAuthorityByPhone`,options)
},
//申请直播权限
applyAuthority(options){
return requestPOST(`${process.env.OLSHOP_URL}/liveAnchor/applyAuthority`,options)
},
// 添加申请主播结果通知订阅消息
addLiveResultMsg(options){
return requestPOST(`${process.env.OLSHOP_URL}/broadcastReminderRecord/addLiveAnchorByCustomer`,options)
}
}
\ No newline at end of file
src/components/livedModel/liveReplay.vue 0 → 100644
<template>
<div class="replay">
</div>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
src/components/livedModel/livedControls.vue
......@@ -447,6 +447,7 @@ export default {
overflow: hidden;
bottom: 0;
right: -30px;
pointer-events: none;
.img {
position: absolute;
bottom: 0;
......
src/components/livedModel/livedExplainingCommodities.vue
......@@ -51,6 +51,9 @@ export default {
watch: {
updateGoods() {
console.log(this.goodsList,'---------------------------------46goodsList')
this.goodsList.forEach((item,index) => {
this.$set(this.goodsList[index],'minPrice',Number(item.minPrice).toFixed(2))
})
console.log(this.firstCom,'this.firstCom----------')
if (this.firstCom == true) {
this.list = [];
......
src/components/livedModel/livedGoodsDia.vue
......@@ -83,7 +83,7 @@ export default {
updateGoods(){
this.list=this.goodsList;
this.list.forEach((item, index) => {
item.minPrice = Number(item.minPrice);
item.minPrice = Number(item.minPrice).toFixed(2);
});
},
},
......
src/pages/index/index.vue
......@@ -312,7 +312,7 @@ export default {
let params = ''
if(querys.length > midNum){
if(querys[midNum + 2]){
params += `&spokesmanGroupId=${querys[midNum - 1]}&spokesmanShopId=${midNum}&spokesmanRelId=${midNum+1}&userId=${querys[midNum+2]}`
params += `&spokesmanGroupId=${querys[midNum - 1]}&spokesmanShopId=${querys[midNum]}&spokesmanRelId=${query[midNum+1]}&userId=${querys[midNum+2]}`
}else{
params += `&spokesmanGroupId=${querys[midNum - 1]}&spokesmanShopId=${querys[midNum]}&spokesmanRelId=${querys[midNum+1]}`
}
......
src/pages/live/index.vue
......@@ -19,6 +19,7 @@
@statechange="statechange"
@error="binderror"
@netstatus="bindnetstatus"
v-if="refreshLive"
/>
<image class="bg-img" v-if="isBgImg" :src="liveInfo.coverUrl" mode="aspectFill" alt=""></image>
<div class="content" :style="{'padding-top':navHeight +'px'}">
......@@ -160,7 +161,7 @@ export default {
clear:'HD',
devicePosition : 'front', //前置或者后置 back => 后置
enableMic: true, //麦克风是否开启
remoteMirror:'disable', //镜像
remoteMirror:'enable', //镜像
userInfo : null,
......@@ -219,7 +220,11 @@ export default {
isDetailControlLock : true,
mirror : false,
mirror : true,
refreshLive : true
}
},
filter(){
......@@ -282,6 +287,7 @@ export default {
this.isTimeFirstReq = true;
this.overOrStop = 1;
this.isDetailLock = true;
this.refreshLive = true;
this.online = 0 //在线
this.look = 0 //观看
......@@ -350,7 +356,12 @@ export default {
if(type == 'record'){
if (!res.authSetting["scope.record"]) {
this.refreshLive = false;
this.openConfirm(type);
}else{
this.refreshLive = true;
this.pusher = wx.createLivePusherContext('pusher');
this.pusher.startPreview()
}
}else if(type == 'camera'){
if (!res.authSetting["scope.camera"]) {
......@@ -1076,13 +1087,13 @@ export default {
top: 0;
left: 0;
width: 39px;
height: 12px;
height: 16px;
color: white;
background-color: #FF4240;
border-bottom-right-radius: 2px;
font-size: 11px;
text-align: center;
line-height: 12px;
line-height: 16px;
}
.item-top{
height: 78px;
......
src/pages/liveList/index.vue
......@@ -48,6 +48,11 @@
</div>
<div class="live-time">开播时间： {{item.startTime}}</div>
</div>
<div class="create-live" v-if="liveList.length" @click="createLive">
<img src="../../../static/images/chuangjian.png" alt="">
<span>创建直播计划</span>
</div>
</div>
<!-- 未登陆 -->
......@@ -63,6 +68,10 @@
暂无直播
</div>
<div class="to-create-live" v-if="!liveList.length && isLogin" @click="createLive">
创建直播计划
</div>
<!-- 绑定手机号 -->
<div class="toCLogin1" v-if="isShowPhone">
<div class="btn_info1">
......@@ -80,8 +89,9 @@
import { getNavbarInfo,DFSImg } from '../../utils/common.js'
import { wx_decode } from "@/utils/wxIndex.js";
import login from "@/api/login";
import indexApi from '@/api/liveing'
import liveApi from '@/api/liveing'
import livedApi from '@/api/live'
import shop from "@/api/shop";
export default {
data(){
return{
......@@ -106,6 +116,8 @@ export default {
shopId: process.env.SHOP_MIXID,
baseUrl: process.env.BASE_URL,
}
},
created(){
......@@ -119,6 +131,9 @@ export default {
},
onShow(){
this.getMsgConfig();
wx.setKeepScreenOn({
keepScreenOn: false
})
......@@ -288,7 +303,9 @@ export default {
e.mp.detail.iv
);
this.userInfo = JSON.parse(e.target.rawData);
this.$store.commit('setUserInfo',this.userInfo)
this.savePhone();
console.log(this.userInfo)
//是会员 直接登录
......@@ -307,6 +324,7 @@ export default {
this.userInfo = JSON.parse(e.target.rawData);
this.$store.commit('setUserInfo',this.userInfo)
this.savePhone();
if (this.unionId) {
......@@ -413,6 +431,7 @@ export default {
this.$store.commit('setLoginStatus',1)
console.log('getOpenid2',getOpenid)
this.isLogin = true
this.savePhone();
this.getLiveList(); //获取直播计划列表
}
},
......@@ -421,7 +440,7 @@ export default {
wx.showLoading({
title : '加载中'
})
indexApi.queryLiveList().then(res => {
liveApi.queryLiveList().then(res => {
if(res.data.code == "200"){
wx.hideLoading()
......@@ -446,6 +465,212 @@ export default {
wx.hideLoading()
})
},
createLive(){
wx.showLoading({
title: '加载中',
mask : true
})
liveApi.queryLivePermissions({anchorPhone : wx.getStorageSync("phoneNumber")}).then(res => {
//0，null : 未提交申请 1.审核中 2.审核通过 3.审核失败
let result = res.data.data
wx.hideLoading()
if(res.data.code == '200'){
if(result == 0 || result == null){
wx.showModal({
title: '',
content: '您还没有直播权限',
confirmColor : '#07c160',
success : (res) => {
if (res.confirm) {
this.applyLive();
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}else if(result == 1){
wx.showModal({
title: '',
content: '权限审核中',
confirmColor : '#07c160',
success : (res) => {
if (res.confirm) {
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}else if(result == 2){
let backPath = `/createLive`;
let query = {
sessionid : wx.getStorageSync('sessionid') || '',
}
wx.reLaunch({
url: `../index/main?from=liveList&backpath=${
backPath
}&params=${JSON.stringify(query)}`
});
}else if(result == 3){
wx.showModal({
title: '',
content: '抱歉，您的审核没有通过',
confirmColor : '#07c160',
success (res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
}
}
})
},
savePhone(){
livedApi.getUserInfo().then(res => {
if(res.data.code == '200'){
wx.setStorage({
key: "phoneNumber",
data: res.data.data.mobilephone
});
}
})
},
applyLive(){
wx.showLoading({
title: '加载中',
mask : true
})
liveApi.applyAuthority({
anchorPhone : wx.getStorageSync("phoneNumber"),
anchorName : JSON.parse(wx.getStorageSync("userInfo")).nickName
}).then(res => {
console.log(res.data)
wx.hideLoading()
if(res.data.code == '200'){
if(res.data.data == 'true'){ //申请成功
this.subscribeMsg();
}else{//申请失败
wx.showToast({
title: '申请失败',
icon: "none"
});
}
}
}).catch(err => {
wx.showToast({
title: '申请失败',
icon: "none"
});
})
},
subscribeMsg(){
let _this = this;
console.log(_this.$store.state.subscribeMessageObj,'subscribeMessageObj')
wx.getSetting({
withSubscriptions: true,
success (res) {
if(!res.subscriptionsSetting.mainSwitch){
wx.showModal({
content: '检测到您没打开订阅消息的权限，是否去设置打开？',
confirmText : '确认',
confirmColor : '#07c160',
success : (res2) => {
if (res2.confirm) {
wx.openSetting({
withSubscriptions : true,
success (res1) {
console.log(res1.authSetting,'authSetting')
}
})
}
}
})
}else{
try {
const subscribeMessageObj = _this.$store.state.subscribeMessageObj;
console.log(subscribeMessageObj,'subscribeMessageObj')
if (
subscribeMessageObj &&
Object.keys(subscribeMessageObj).length > 0
) {
// TODO 开播订阅
const tmplIds = [];
for (var key in subscribeMessageObj) {
// 改成开播key
if (key == "anchor_result") {
tmplIds.push(subscribeMessageObj[key]);
}
}
console.log(tmplIds,'tmplIds')
if (tmplIds.length > 0) {
wx.requestSubscribeMessage({
tmplIds: tmplIds,
success:(res)=> {
if(res[tmplIds[0]]=="accept"){
wx.showToast({
title: "您已成功订阅~",
icon: "success"
});
let query = {
anchorPhone: wx.getStorageSync("phoneNumber"),
openId: wx.getStorageSync("openid"),
subMessageTemplateId:tmplIds[0],
};
liveApi.addLiveResultMsg(query).then(res => {});
}
},
fail(res) {
console.log('订阅失败3')
wx.showToast({
title: '订阅失败，是否授权或者网络错误',
icon: "none"
});
}
});
}
}else{
console.log('订阅失败1')
wx.showToast({
title: '订阅失败，是否授权或者网络错误',
icon: "none"
});
}
} catch (err) {
console.log('订阅失败2')
wx.showToast({
title: '订阅失败，是否授权或者网络错误',
icon: "none"
});
}
}
}
})
},
getMsgConfig() {
if (!this.$store.state.subscribeMessageObj) {
shop.getWxMiniSubscribeMessageConfig().then(res => {
if (res.data.code == 200) {
const data = res.data.data;
console.log("wx mini subscribe message data: ", data);
if (data != null) {
const subscribeMessageObj = {};
for (var key in data) {
if (data[key] && data[key].template_id) {
subscribeMessageObj[key] = data[key].template_id;
}
}
this.$store.commit("setSubscribeMessageObj", subscribeMessageObj);
}
}
});
}
},
},
onPullDownRefresh(){
// wx.showLoading({
......@@ -476,8 +701,9 @@ export default {
}
.container1{
min-height: 100vh;
height: 50vh;
padding-bottom: 12px;
// height: 50vh;
// margin-bottom: 60px;
padding-bottom: 60px;
background-color: #efefef;
}
.history-wrap{
......@@ -633,6 +859,28 @@ export default {
color: #999999;
}
}
.create-live{
img{
width: 20px;
height: 17px;
margin-right: 6px;
}
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 49px;
display: flex;
justify-content: center;
align-items: center;
font-size: 19px;
color: white;
background-image:-webkit-linear-gradient(to right,#FF877D, #FB566D);
background-image:-moz-linear-gradient(to right,#FF877D, #FB566D);
background-image:-o-linear-gradient(to right,#FF877D, #FB566D);
background-image: linear-gradient(to right,#FF877D, #FB566D);
z-index: 100;
}
}
.no-login-wrap{
text-align: center;
......@@ -660,6 +908,10 @@ export default {
font-size: 30px;
color: #999999;
}
.to-create-live{
@include btn;
margin: 45px auto 0;
}
.toCLogin1 {
position: absolute;
......
src/pages/lived/index.vue
......@@ -72,6 +72,15 @@
@error="error"
@statechange="changes"
/>
<!-- <video
style="width:100%;height:100vh;"
src="http://vjs.zencdn.net/v/oceans.mp4"
autoplay
:show-fullscreen-btn="false"
/> -->
<!-- object-fit="fillCrop" -->
<!-- orientation="horizontal" -->
</div>
......
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