Skip to content

N
newLive
Commit b13cd205 authored by jiaoyahui's avatar jiaoyahui
Browse files
Options

解决main.js的冲突

parents 13b2788b f6e87e3d
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1075 additions and 12547 deletions
package-lock.json
View file @ b13cd205
This diff is collapsed.
package.json
View file @ b13cd205
...@@ -19,7 +19,9 @@ ...@@ -19,7 +19,9 @@
"pdfh5": "^1.4.2", "pdfh5": "^1.4.2",
"qs": "^6.11.0", "qs": "^6.11.0",
"vue": "^2.6.14", "vue": "^2.6.14",
"vue-clipboard2": "^0.3.3",
"vue-pdf": "^4.3.0", "vue-pdf": "^4.3.0",
"vue-qr": "^4.0.9",
"vue-router": "^3.5.2", "vue-router": "^3.5.2",
"vue-video-player": "^5.0.2", "vue-video-player": "^5.0.2",
"vuex": "^4.1.0" "vuex": "^4.1.0"
......
src/axios/api.js
View file @ b13cd205
...@@ -41,9 +41,14 @@ live: { ...@@ -41,9 +41,14 @@ live: {
liveDetail:function(data){ liveDetail:function(data){
return service.post('/app/live/liveDetail', data) return service.post('/app/live/liveDetail', data)
}, },
//游客登录
tourist:function(data){ tourist:function(data){
return service.post('/auth/tourist', data) return service.post('/auth/tourist', data)
}, },
//更新试看时间
updataTime:function(data){
return service.post('/oapi/v1/H5/live/update/duration', data)
},
videoList:function(data){ videoList:function(data){
return service.post('/app/live/getLiveRepeatList', data) return service.post('/app/live/getLiveRepeatList', data)
}, },
......
src/components/plugin/shareCard.vue 0 → 100644
View file @ b13cd205
<template>
<div class="body">
<img class="share-img" @click="clickShare()" src="../../common/img/share.png" alt="">
<div v-if="ifShow">
<img v-if="checkType==0" class="style-one" src="../../common/img/card-style-One.png" alt="">
<img v-if="checkType==1" class="style-one" src="../../common/img/card-style-Two.png" alt="">
<img v-if="checkType==2" class="style-one" src="../../common/img/card-style-Three.png" alt="">
<img class="pressShare" src="../../common/img/pressShare.png" alt="">
<!-- 信息样式 -->
<div v-if="checkType==0">
<img class="headImg" :src="headPro" alt="">
<span class="udStyle">{{udName}}</span>
<img class="lvrImg" :src="lvrImg" alt="">
<span class="lvrName">{{liveName}}</span>
<vue-qr
class="qrCode"
:text="imgUrl"
:size="250"
:logoScale="0.2">
</vue-qr>
</div>
<div v-if="checkType==1">
<img class="headImgTwo" :src="headPro" alt="">
<span class="udStyle">{{udName}}</span>
<img class="lvrImgTwo" :src="lvrImg" alt="">
<span class="lvrNameTwo">{{liveName}}</span>
<vue-qr
class="qrCodeTwo"
:text="imgUrl"
:size="250"
:logoScale="0.2">
</vue-qr>
</div>
<div v-if="checkType==2">
<img class="headImgThree" :src="headPro" alt="">
<!-- <span class="udStyle">{{udName}}</span> -->
<img class="lvrImgThree" :src="lvrImg" alt="">
<span class="lvrNameThree">{{liveName}}</span>
<vue-qr
class="qrCodeThree"
:text="imgUrl"
:size="250"
:logoScale="0.2">
</vue-qr>
</div>
<div class="bottom-countent">
<div @click="checkImg(0)" :class="{smallOneRed:checkType==0,smallOne:checkType!=0}">
<img class="small-img" src="../../common/img/thumbnail-One.png" alt="">
</div>
<div @click="checkImg(1)" class="smallTwo" :class="{smallTwoRed:checkType==1,smallTwo:checkType!=1}">
<img class="small-img" src="../../common/img/thumbnail-Two.png" alt="">
</div>
<div @click="checkImg(2)" class="smallThree" :class="{smallThreeRed:checkType==2,smallThree:checkType!=2}">
<img class="small-img" src="../../common/img/thumbnail-Three.png" alt="">
</div>
<div class="clickWechat">
<img class="wechactImg" src="../../common/img/wechact-share.png" alt="">
<span class="wechactText">微信</span>
</div>
<div class="clickCopy copy"
v-clipboard:copy="copyContent"
v-clipboard:success="onCopy"
v-clipboard:error="onError"
>
<img class="linkImg" src="../../common/img/copy-link.png" alt="">
<span class="linkText">复制链接</span>
</div>
<!-- 提示框 -->
<div class="tips" style="display: none;">
<span>复制成功</span>
</div>
</div>
</div>
</div>
</template>
<script>
import VueQr from 'vue-qr'
export default {
name: 'shareCard',
components:{
      VueQr,
   },
props:{
headPortrait:String,//头像
udNickname:String,//主播名称
lvrName:String,//直播间名称
lvrImgLargeUrl:String,//占位图
},
data() {
return {
checkType:0,
copyContent:window.location.href,//需要复制的内容
ifShow:false,
imgUrl: 'https://baidu.com',//二维码地址
headPro:'',//头像图片
udName:'',//主播名称
lvrImg:'',//占位图
liveName:'',//房间名称
};
},
created() {
// this.getMessage()
},
methods: {
checkImg(e){
this.checkType=e
},
onCopy({value}){
// console.log('success',value);
// console.log(this.copyContent)
$('.tips').show().delay(3000).hide(300)
console.log('复制成功')
},
onError({value}){
// console.log('error',value)
// console.log('复制成功')
},
//获取信息
// getMessage(){
// setTimeout(() => {
// }, 1000)
// },
//点击分享按钮
clickShare(){
if(this.ifShow==false){
this.ifShow=true
}else{
this.ifShow=false
}
console.log("头像信息",this.headPortrait)
console.log("主播名称",this.udNickname)
console.log("直播名称",this.lvrName)
console.log("占位图",this.lvrImgLargeUrl)
// headPro:'',//头像图片
// udName:'',//主播名称
// lvrImg:'',//占位图
// liveName:'',//房间名称
this.headPro=this.headPortrait//头像图片
this.udName=this.udNickname//主播名称
this.lvrImg=this.lvrImgLargeUrl//占位图
this.liveName=this.lvrName//房间名称
this.imgUrl=window.location.href//二维码地址
}
},
};
</script>
<style scoped>
.body{
position: relative;
}
.style-one{
height: 145vw;
position: absolute;
top: 10vw;
z-index: 99;
left: 7.5vw;
width: 85vw;
}
.bottom-countent{
position: absolute;
top: 167vw;
left: 0;
width: 100vw;
height: 50vw;
border-radius: 4vw;
background: white;
}
.smallOne{
position: absolute;
top: 6vw;
left: 10vw;
height: 25vw;
width: 15vw;
/* border: 1vw solid red; */
}
.smallOneRed{
position: absolute;
top: 6vw;
left: 10vw;
height: 25vw;
width: 15vw;
border: 1vw solid red;
}
.smallTwoRed{
position: absolute;
top: 6vw;
left: 43vw;
height: 25vw;
width: 15vw;
border: 1vw solid red;
}
.smallThreeRed{
position: absolute;
top: 6vw;
left: 75vw;
height: 25vw;
width: 15vw;
border: 1vw solid red;
}
.small-img{
height: 25vw;
width: 15vw;
}
.smallTwo{
position: absolute;
top: 6vw;
left: 43vw;
}
.smallThree{
position: absolute;
top: 6vw;
left: 75vw;
}
.wechactImg{
height: 10vw;
width: 10vw;
position: absolute;
top: 1vw;
left: 2vw;
}
.wechactText{
font-size: 4vw;
position: absolute;
top: 3vw;
left: 14vw;
color: #656565;
}
.clickWechat{
height: 12vw;
width: 30vw;
/* background: yellow; */
position: absolute;
top: 34vw;
left: 10vw;
}
.clickCopy{
height: 12vw;
width: 30vw;
/* background: yellow; */
position: absolute;
top: 34vw;
right: 10vw;
}
.linkImg{
height: 10vw;
width: 10vw;
position: absolute;
top: 1vw;
left: 2vw;
}
.linkText{
font-size: 4vw;
position: absolute;
top: 3vw;
left: 14vw;
color: #656565;
}
.tips {
width: 40vw;
text-align: center;
height: 10vw;
background: black;
color: white;
position: fixed;
top: 80vw;
left: 30vw;
border-radius: 4vw;
opacity: 0.6;
line-height: 10vw;
}
.share-img{
position: absolute;
top: 2vw;
right: 3vw;
height: 8vw;
width: 8vw;
}
.headImg{
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
z-index: 100;
left: 22vw;
border-radius: 50%;
}
.headImgTwo{
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
z-index: 100;
left: 22vw;
border-radius: 50%;
}
.headImgThree{
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
z-index: 100;
left: 40.5vw;
border-radius: 50%;
}
.udStyle{
font-size: 5vw;
color: white;
position: absolute;
top: 41vw;
z-index: 100;
left: 22vw;
}
.lvrImg{
height: 39vw;
width: 73vw;
position: absolute;
top: 62vw;
border-radius: 1vw;
left: 13.5vw;
z-index: 100;
}
.lvrImgTwo{
height: 39vw;
width: 71vw;
position: absolute;
top: 62vw;
border-radius: 1vw;
left: 14.5vw;
z-index: 100;
}
.lvrImgThree{
height: 32vw;
width: 58vw;
position: absolute;
top: 68vw;
border-radius: 1vw;
left: 20.5vw;
z-index: 100;
}
.lvrName{
font-size: 5vw;
position: absolute;
top: 104vw;
z-index: 100;
left: 18vw;
}
.lvrNameTwo{
font-size: 5vw;
position: absolute;
top: 104vw;
color: white;
z-index: 100;
left: 18vw;
}
.lvrNameThree{
font-size: 5vw;
position: absolute;
top: 103vw;
color: white;
z-index: 100;
left: 23vw;
}
.pressShare{
height: 5vw;
width: 40vw;
position: absolute;
top: 158vw;
left: 28vw;
}
.qrCode{
position: absolute;
top: 120vw;
left: 58vw;
height: 22vw;
width: 22vw;
z-index: 100;
}
.qrCodeTwo{
position: absolute;
top: 124vw;
left: 60.5vw;
height: 22vw;
width: 22vw;
z-index: 100;
}
.qrCodeThree{
position: absolute;
top: 124vw;
left: 17vw;
height: 22vw;
width: 22vw;
z-index: 100;
}
</style>
\ No newline at end of file
src/main.js
View file @ b13cd205
...@@ -17,12 +17,14 @@ import 'video.js/dist/video-js.css' ...@@ -17,12 +17,14 @@ import 'video.js/dist/video-js.css'
import VueClipboard from "vue-clipboard2";
//引入 hls,视频直播(m3u8)必须引入的 //引入 hls,视频直播(m3u8)必须引入的
import 'videojs-contrib-hls' import 'videojs-contrib-hls'
//播放rtmp视频 //播放rtmp视频
// import 'videojs-flash' // import 'videojs-flash'
import Qs from 'qs' import Qs from 'qs'
Vue.use(Mint); Vue.use(Mint);
Vue.use(VueClipboard);
Vue.use(VideoPlayer); Vue.use(VideoPlayer);
Vue.prototype.server = server; Vue.prototype.server = server;
Vue.prototype.store = store; Vue.prototype.store = store;
......
src/views/fullScreen.vue
View file @ b13cd205
This diff is collapsed.
src/views/live.vue
View file @ b13cd205
...@@ -40,8 +40,9 @@ ...@@ -40,8 +40,9 @@
</div> </div>
<div class="sendMessage"> <div class="sendMessage">
<input type="text" v-model="messages" placeholder="吐个槽吧~" class="wbk2"> <img src="../common/img/voice.png" class="voiceImg" alt="">
<img class="send-message" src="../common/img/send-message.png" @click="clickmessage()" alt=""> <input type="text" v-model="messages" placeholder="有问题发个弹幕问一下" class="wbk2">
<img class="send-message" src="../common/img/sendButton.png" @click="clickmessage()" alt="">
</div> </div>
<div class="tips" style="display: none;"> <div class="tips" style="display: none;">
<span>发送成功</span> <span>发送成功</span>
...@@ -315,11 +316,11 @@ export default { ...@@ -315,11 +316,11 @@ export default {
//屏幕可视区域的高度 //屏幕可视区域的高度
let clientHeight let clientHeight
if(document.documentElement.clientHeight<=750){ if(document.documentElement.clientHeight<=750){
clientHeight=90+'vw' clientHeight=120+'vw'
}else if(document.documentElement.clientHeight<1024){ }else if(document.documentElement.clientHeight<1024){
clientHeight=125+'vw' clientHeight=155+'vw'
}else{ }else{
clientHeight=55+'vw' clientHeight=85+'vw'
} }
console.log("clientHeight 1=="+clientHeight) console.log("clientHeight 1=="+clientHeight)
...@@ -375,7 +376,7 @@ export default { ...@@ -375,7 +376,7 @@ export default {
pmIp:1, pmIp:1,
pmMac:1, pmMac:1,
info:this.messages, info:this.messages,
lvrId:115, lvrId:this.$route.query.lvrId,
pmOperator:'无运营商' pmOperator:'无运营商'
}) })
this.server.live.setMessage(temp).then(res=>{ this.server.live.setMessage(temp).then(res=>{
...@@ -437,7 +438,7 @@ export default { ...@@ -437,7 +438,7 @@ export default {
pmModel:'iPhone 12/13 (Pro)', pmModel:'iPhone 12/13 (Pro)',
pmSystem:'iOS 10.0.1', pmSystem:'iOS 10.0.1',
timestamp:this.timestamp, timestamp:this.timestamp,
lvrId:115, lvrId:this.$route.query.lvrId,
pmOperator:'无运营商' pmOperator:'无运营商'
}) })
this.server.live.liveDetail(temp).then(res=>{ this.server.live.liveDetail(temp).then(res=>{
...@@ -465,7 +466,7 @@ export default { ...@@ -465,7 +466,7 @@ export default {
pmModel:'iPhone 12/13 (Pro)', pmModel:'iPhone 12/13 (Pro)',
pmSystem:'iOS 10.0.1', pmSystem:'iOS 10.0.1',
timestamp:this.timestamp, timestamp:this.timestamp,
lvrId:115, lvrId:this.$route.query.lvrId,
pmOperator:'无运营商' pmOperator:'无运营商'
}) })
this.server.live.videoList(temp).then(res=>{ this.server.live.videoList(temp).then(res=>{
...@@ -981,7 +982,7 @@ display: block; ...@@ -981,7 +982,7 @@ display: block;
width: 98%; width: 98%;
height: 16vw; height: 16vw;
/* border: 0.5vw solid red; */ /* border: 0.5vw solid red; */
background: white; /* background: white; */
position: fixed; position: fixed;
box-shadow: #797979 0 -0.5vw 1vw; box-shadow: #797979 0 -0.5vw 1vw;
bottom: 1%; bottom: 1%;
...@@ -991,30 +992,36 @@ display: block; ...@@ -991,30 +992,36 @@ display: block;
justify-content: space-around; justify-content: space-around;
} }
.wbk2 { .wbk2 {
font-size: 3.7vw; font-size: 3.7vw;
color: #797979; color: #797979;
border-radius: 5vw; border-radius: 5vw;
width: 65vw; width: 45vw;
height: 13vw; height: 10vw;
/* line-height: 10vw; */ /* line-height: 10vw; */
margin-top: 1.5vw; margin-top: 3.5vw;
padding: 0 3vw; padding: 0 3vw;
background: none; background: none;
box-shadow: none; box-shadow: none;
outline: none; outline: none;
background: rgb(243, 243, 243); background: rgb(243, 243, 243);
margin-left: 4vw; opacity: 0.4;
/* border-color: rgb(213, 225, 245); */ /* margin-left: 13vw; */
border-left: 0px; /* border-color: rgb(213, 225, 245); */
border-top: 0px; border-left: 0px;
border-bottom: 0px; border-top: 0px;
border-right: 0px; border-bottom: 0px;
padding-left: 9vw; border-right: 0px;
} }
.send-message{ .send-message{
height: 10vw; height: 10vw;
width: 10vw; width: 22vw;
margin-top: 3vw; margin-top: 3.5vw;
}
.voiceImg{
height: 10vw;
width: 10vw;
margin-top: 3vw;
} }
.get-message{ .get-message{
/* height: 48vw; */ /* height: 48vw; */
...@@ -1028,10 +1035,13 @@ display: block; ...@@ -1028,10 +1035,13 @@ display: block;
.firstBody1{ .firstBody1{
overflow-x: auto; overflow-x: auto;
overflow-y:auto; overflow-y:auto;
margin-top: 2vw; /* margin-top: 2vw; */
height: 125vw; height: 125vw;
/* background: #0C0A16; */ /* background: #0C0A16; */
background: url('../assets/b.png'); background: url('../assets/b.png');
background-size:145vw;
background-repeat: no-repeat;
} }
.mq-message1{ .mq-message1{
/* height: 10vw; */ /* height: 10vw; */
......
src/views/liveList.vue
View file @ b13cd205
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<span :class="{member:!ifFree,nonemember:ifFree}" @click="clickVIP()">VIP</span> <span :class="{member:!ifFree,nonemember:ifFree}" @click="clickVIP()">VIP</span>
</div> </div>
<div class="content"> <div class="content">
<div v-if="ifFree" v-for="i in freeList" :key="i.lvrId" class="moudle" > <div v-if="ifFree" @click="liveDetail(i)" v-for="i in freeList" :key="i.lvrId" class="moudle" >
<img class="recommed-img" v-if="i.ifrecom" src="../common/img/recommend.png" alt=""> <img class="recommed-img" v-if="i.ifrecom" src="../common/img/recommend.png" alt="">
<img class="head-img" src="../common/img/wechact.png" alt=""> <img class="head-img" src="../common/img/wechact.png" alt="">
<span class="head-name">{{i.udNickname}}</span> <span class="head-name">{{i.udNickname}}</span>
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<span class="people-num">{{i.hotNum}}</span> <span class="people-num">{{i.hotNum}}</span>
</div> </div>
<div v-if="!ifFree" v-for="i in vipList" :key="i.lvrId" class="moudle"> <div v-if="!ifFree" @click="liveDetail(i)" v-for="i in vipList" :key="i.lvrId" class="moudle">
<img class="recommed-img" v-if="i.ifrecom" src="../common/img/recommend.png" alt=""> <img class="recommed-img" v-if="i.ifrecom" src="../common/img/recommend.png" alt="">
<img class="head-img" src="../common/img/wechact.png" alt=""> <img class="head-img" src="../common/img/wechact.png" alt="">
<span class="head-name">{{i.udNickname}}</span> <span class="head-name">{{i.udNickname}}</span>
...@@ -133,6 +133,7 @@ export default { ...@@ -133,6 +133,7 @@ export default {
getState(){ getState(){
let token=sessionStorage.getItem("token") let token=sessionStorage.getItem("token")
let img=sessionStorage.getItem("udPhotoFileid") let img=sessionStorage.getItem("udPhotoFileid")
console.log("就阿婆啊v发",token)
if(token){ if(token){
if(img){ if(img){
this.ifLog=2 this.ifLog=2
...@@ -141,7 +142,7 @@ export default { ...@@ -141,7 +142,7 @@ export default {
this.ifLog=1 this.ifLog=1
} }
}else{ }else{
console.log("就阿婆啊v发")
this.ifLog=0 this.ifLog=0
this.visitorLog() this.visitorLog()
} }
...@@ -160,12 +161,42 @@ export default { ...@@ -160,12 +161,42 @@ export default {
this.server.live.tourist(temp).then(res=>{ this.server.live.tourist(temp).then(res=>{
let thisToken= res.data.data.token let thisToken= res.data.data.token
window.sessionStorage.setItem('token', thisToken);//token window.sessionStorage.setItem('token', thisToken);//token
this.$router.go(0)
}) })
}, },
mine(){ mine(){
this.$router.push('/mine') this.$router.push('/mine')
},
liveDetail(i){
let ifrecom
if(i.ifrecom){
ifrecom=true
}else{
ifrecom=false
}
if(i.lvrLiveType==0){
this.$router.push(
{
path:'/fullScreen',
query:{
lvrId:i.lvrId,
ifrecom:ifrecom
}
});
}else{
this.$router.push(
{
path:'/live',
query:{
lvrId:i.lvrId,
ifrecom:ifrecom
}
});
}
} }
}, },
}; };
......
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