<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta content="telephone=no" name="format-detection">
<meta name="wap-font-scale" content="no">
<title>心動主播</title>
<script src="lib/fsize.js"></script>
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/layer.css">
<link rel="stylesheet" href="css/daily.css">
<link rel="stylesheet" href="css/index.css?v=2024051701">
<link rel="stylesheet" href="css/liMarquee.css">
<style>
.layui-layer-shade {
opacity: 0.7 !important;
}
.yourclass5 {
border-radius: 0rem !important;
background: rgba(0, 0, 0, 0) !important;
}
.yourclass5 .layui-layer-content {
border-radius: 0rem !important;
}
</style>
</head>
<script src="lib/lottie-player.js"></script>
<body>
<div style="display: none;" class="layer-list1"></div>
<div style="display: none;" class="layer-list2"></div>
<div class="bg">
<img class="ref" src="images/ref.png" alt="">
<a href="rule.html"><img class="rule-btn" src="images/rule-btn.png" alt=""></a>
<div class="banner"></div>
<div class="tips-box"></div>
<div style="display: none;" class="mc-task">
<div class="mc-task-btn"></div>
<div class="mc-task-bottom">
<p class="mc-task-p1">主播開播過程中，（直播時長≥10分鐘）簽到即可獲得10點心動積分心動積分可兌換羽毛。</p>
<p class="mc-task-p2">直播時長--/10分</p>
</div>
</div>
<div style="display: none;" class="exc-box">
<div class="exc-btn1"></div>
<div class="exc-btn2"></div>
<p class="exc-box-p">我的心動積分: --</p>
</div>
<div class="love-box">
<div class="king1"></div>
<img class="king1-face" src="images/face.png" alt="">
<div class="king1-like-btn like1"></div>
<p class="king1-p1">昨日心動主播</p>
<p class="king1-p2">虛位以待</p>
<div class="king2"></div>
<img class="king2-face" src="images/face.png" alt="">
<div class="king2-like-btn like1"></div>
<p class="king2-p1">昨日人氣主播</p>
<p class="king2-p2">虛位以待</p>
</div>
<div class="list-box list-box1">
<img class="question1" src="images/question.png" alt="">
<div class="list-title">心動主播榜單</div>
<div class="list-tips">根據不同的用戶<span>喜歡</span>or<span>討厭</span>增加或減少積分<br>每日前三名主播獲得1000/500/300心動積分獎勵</div>
<div class="list-btn1">
<div data-type="0" class="list-btn-click">今日心動榜</div>
<div data-type="1">昨日心動榜</div>
</div>
<div class="list-top-box list-top-box1">
<!-- <div class="list-top1">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">心動值</p>
<p class="list-top-p3">513214</p>
</div>
<div class="list-top2">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">心動值</p>
<p class="list-top-p3">513214</p>
</div>
<div class="list-top3">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">心動值</p>
<p class="list-top-p3">513214</p>
</div> -->
</div>
<div class="list-ul list-ul1">
<!-- <li>
<div class="list-box1">1</div>
<div class="list-box2">
<img class="list-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_110" alt="">
喊我一聲小志
</div>
<div class="list-box3">心動值：123545</div>
</li>
<li>
<div class="list-box1">1</div>
<div class="list-box2">
<img class="list-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_110" alt="">
喊我一聲小志
</div>
<div class="list-box3">心動值：123545</div>
</li> -->
</div>
</div>
<div style="margin-top: 0.7rem;" class="list-box list-box2">
<img class="question2" src="images/question.png" alt="">
<div class="list-title">人氣主播榜單</div>
<div class="list-tips">根據用戶在直播間的聊天條數統計積分<br>每日第1名主播獲得500心動分獎勵</div>
<div class="list-btn1">
<div data-type="0" class="list-btn-click">今日人氣榜</div>
<div data-type="1">昨日人氣榜</div>
</div>
<div class="list-top-box list-top-box2">
<!-- <div class="list-top1">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">人氣值</p>
<p class="list-top-p3">513214</p>
</div>
<div class="list-top2">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">人氣值</p>
<p class="list-top-p3">513214</p>
</div>
<div class="list-top3">
<div class="list-king"></div>
<img class="list-king-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_80" alt="">
<p class="list-top-p1">主播暱稱預留</p>
<p class="list-top-p2">人氣值</p>
<p class="list-top-p3">513214</p>
</div> -->
</div>
<div class="list-ul list-ul2">
<!-- <li>
<div class="list-box1">1</div>
<div class="list-box2">
<img class="list-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_110" alt="">
喊我一聲小志
</div>
<div class="list-box3">人氣值：123545</div>
</li>
<li>
<div class="list-box1">1</div>
<div class="list-box2">
<img class="list-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_110" alt="">
喊我一聲小志
</div>
<div class="list-box3">人氣值：123545</div>
</li> -->
</div>
</div>
<div style="height: 3.5rem;"></div>
<div style="display: none;" class="bottom-nav">
<img class="bottom-nav-face" src="https://big.bgp.ourpow.com/comm/user/boy.png?x-oss-process=image/resize,w_110" alt="">
<p class="bottom-nav-p1">今日心動分 : <span></span></p>
<p class="bottom-nav-p2">今日人氣分 : <span></span></p>
<p class="bottom-nav-p3">今日差評人數 : <span></span></p>
</div>
</div>
</body>
<script src="lib/jquery-3.1.1.min.js"></script>
<script src="layer-v3.1.0/layer/layer.js"></script>
<script src="lib/default.js?v='2023120901'"></script>
<script>
$(function(){
if(sessionStorage.roomId==sessionStorage.uid){
//是主播且開播中
view()
$(".mc-task").show()
$(".exc-box").show()
}
topMc()
rank(0)
rank2(0)
$(".list-box1 .list-btn1 div").on("click",function(){
var _self=$(this)
console.log(_self.attr("data-type"))
if(_self.attr("data-type")==0){
$(".list-box1 .list-btn1").removeClass("list-btn2")
rank(0)
$(".list-box1 .list-btn1 div").removeClass("list-btn-click")
_self.addClass("list-btn-click")
}else{
$(".list-box1 .list-btn1").addClass("list-btn2")
rank(1)
$(".list-box1 .list-btn1 div").removeClass("list-btn-click")
_self.addClass("list-btn-click")
}
})
$(".list-box2 .list-btn1 div").on("click",function(){
var _self=$(this)
if(_self.attr("data-type")==0){
$(".list-box2 .list-btn1").removeClass("list-btn2")
rank2(0)
$(".list-box2 .list-btn1 div").removeClass("list-btn-click")
_self.addClass("list-btn-click")
}else{
$(".list-box2 .list-btn1").addClass("list-btn2")
rank2(1)
$(".list-box2 .list-btn1 div").removeClass("list-btn-click")
_self.addClass("list-btn-click")
}
})
$(".exc-btn1").on("click",function(){
exc(1)
})
$(".exc-btn2").on("click",function(){
exc(2)
})
$(".question1").on("click",function(){
layer.open({
type: 1,
title: false,
shadeClose: true,
skin: "yourclass5",
area: ["9.6rem", "7.266rem"],
content: $(".layer-list1"),
end: function () {
$(".layui-layer-shade").hide()
}
})
})
$(".question2").on("click",function(){
layer.open({
type: 1,
title: false,
shadeClose: true,
skin: "yourclass5",
area: ["9.6rem", "7.266rem"],
content: $(".layer-list2"),
end: function () {
$(".layui-layer-shade").hide()
}
})
})
function view(){
$.ajax({
url:$ip+'/actHeartbeatAnchor/getViewData.html',
success:function(data){
console.log('獲取主播信息',data)
$(".exc-box-p").text("我的心動積分: "+data.result.roomData.heartbeatScore+"")
if(data.result.roomData.heartbeatScore>0)$(".exc-box").show()
if(data.result.roomData.todayCheckIn==0){
$(".mc-task-p2").text('直播時長'+Math.floor(data.result.roomData.liveTime/1000/60)+'/10分')
}else{
$(".mc-task-btn").addClass("mc-task-btn-end").unbind("click")
$(".mc-task-p1").text('積極與用戶互動，對新進直播的用戶表示歡迎，更容易獲得心動值噢。')
$(".mc-task-p2").text('')
}
}
})
}
function topMc(){
$.ajax({
url:$ip+'/actHeartbeatAnchor/getViewLikeData.html',
success:function(data){
console.log("昨日top主播",data)
if(sessionStorage.uid!=sessionStorage.roomId&&data.result.heartbeatScore>0){
$(".exc-box").show()
$(".exc-box-p").text("我的心動積分: "+data.result.heartbeatScore+"")
}
if(data.result.heartbeatData.roomId!=0){
$(".king1-face").attr("src","https://big.bgp.ourpow.com/comm"+data.result.heartbeatData.roomFace+"?x-oss-process=image/resize,w_110")
$(".king1-p2").text(data.result.heartbeatData.roomName)
if(data.result.heartbeatData.isLikeRoom==1){
$(".king1-like-btn").addClass("like2")
}else{
$(".king1-like-btn").removeClass("like2").unbind("click").on("click",function(){
likeMc(data.result.heartbeatData.roomId)
})
}
}else{
$(".king1-p2").text("虛位以待")
$(".king1-like-btn").hide()
}
if(data.result.popData.roomId!=0){
$(".king2-face").attr("src","https://big.bgp.ourpow.com/comm"+data.result.popData.roomFace+"?x-oss-process=image/resize,w_110")
$(".king2-p2").text(data.result.popData.roomName)
if(data.result.popData.isLikeRoom==1){
$(".king2-like-btn").addClass("like2")
}else{
$(".king2-like-btn").removeClass("like2").unbind("click").on("click",function(){
likeMc(data.result.popData.roomId)
})
}
}else{
$(".king2-p2").text("虛位以待")
$(".king2-like-btn").hide()
}
}
})
}
if(sessionStorage.roomId!=0){
nav()
}
function nav(){
$.ajax({
url:$ip+'/actHeartbeatAnchor/getViewBottomData.html',
success:function(data){
console.log('獲取底部',data)
$(".bottom-nav").show()
$(".bottom-nav-face").attr("src","https://big.bgp.ourpow.com/comm"+data.result.roomData.roomFace+"?x-oss-process=image/resize,w_110")
if(data.result.roomData.heartbeatIndex!=-1)$(".bottom-nav-p1 span").text(''+data.result.roomData.heartbeatValue+'分/第'+data.result.roomData.heartbeatIndex+'名')
else $(".bottom-nav-p1 span").text(''+data.result.roomData.heartbeatValue+'分')
if(data.result.roomData.popIndex!=-1)$(".bottom-nav-p2 span").text(''+data.result.roomData.popScore+'分/第'+data.result.roomData.popIndex+'名')
else $(".bottom-nav-p2 span").text(''+data.result.roomData.popScore+'分')
$(".bottom-nav-p3 span").text(' '+data.result.roomData.badUsers+'人')
}
})
}
function likeMc(e){
$.ajax({
url:$ip+'/room/like',
data:{
roomId:e
},
success:function(data){
if(data.code==1){
layer.msg("關注成功")
topMc()
}
}
})
}
function rank(e){
$.ajax({
url:$ip+'/actHeartbeatAnchor/getRankData.html',
data:{
dateRange:e,
rankType:1
},
success:function(data){
console.log("獲取心動榜單",data)
//心動榜
if(data.result.rankList[0]==undefined){
$(".list-top-box1").html('<h2>暫無數據~</h2>')
$(".list-ul1").html('')
return;
}
var html=[];
for(var i=0;i<3;i++){
if(data.result.rankList[i]==undefined)break;
var list=data.result.rankList[i]
html+='<div class="list-top'+(i+1)+'">';
html+='<div class="list-king"></div>';
html+='<a href="yazhai://_' + list.uid + '_zone"><img class="list-king-face" src="https://big.bgp.ourpow.com/comm'+list.face+'?x-oss-process=image/resize,w_80" alt=""></a>';
html+='<p class="list-top-p1">'+list.name+'</p>';
html+='<p class="list-top-p2">心動值</p>';
html+='<p class="list-top-p3">'+list.score+'</p>';
html+='</div>';
}
$(".list-top-box1").html(html);
var html=[];
for(var i=3;i<data.result.rankList.length;i++){
var list=data.result.rankList[i]
html+='<li>';
html+='<div class="list-box1">'+(i+1)+'</div>';
html+='<div class="list-box2">';
html+='<a href="yazhai://_' + list.uid + '_zone"><img class="list-face" src="https://big.bgp.ourpow.com/comm'+list.face+'?x-oss-process=image/resize,w_110" alt=""></a>';
html+=''+list.name+'';
html+='</div>';
html+='<div class="list-box3">心動值：'+list.score+'</div>';
html+='</li>';
}
$(".list-ul1").html(html)
}
})
}
function rank2(e){
$.ajax({
url:$ip+'/actHeartbeatAnchor/getRankData.html',
data:{
dateRange:e,
rankType:2
},
success:function(data){
console.log("獲取人氣榜單",data)
//心動榜
if(data.result.rankList[0]==undefined){
$(".list-top-box2").html('<h2>暫無數據~</h2>')
$(".list-ul2").html('')
return;
}
var html=[];
for(var i=0;i<3;i++){
if(data.result.rankList[i]==undefined)break;
var list=data.result.rankList[i]
html+='<div class="list-top'+(i+1)+'">';
html+='<div class="list-king"></div>';
html+='<a href="yazhai://_' + list.uid + '_zone"><img class="list-king-face" src="https://big.bgp.ourpow.com/comm'+list.face+'?x-oss-process=image/resize,w_80" alt=""></a>';
html+='<p class="list-top-p1">'+list.name+'</p>';
html+='<p class="list-top-p2">人氣值</p>';
html+='<p class="list-top-p3">'+list.score+'</p>';
html+='</div>';
}
$(".list-top-box2").html(html);
var html=[];
for(var i=3;i<data.result.rankList.length;i++){
var list=data.result.rankList[i]
html+='<li>';
html+='<div class="list-box1">'+(i+1)+'</div>';
html+='<div class="list-box2">';
html+='<a href="yazhai://_' + list.uid + '_zone"><img class="list-face" src="https://big.bgp.ourpow.com/comm'+list.face+'?x-oss-process=image/resize,w_110" alt=""></a>';
html+=''+list.name+'';
html+='</div>';
html+='<div class="list-box3">人氣值：'+list.score+'</div>';
html+='</li>';
}
$(".list-ul2").html(html)
}
})
}
$(".mc-task-btn").on("click",function(){
task()
})
function task(){
$.ajax({
url:$ip+'/actHeartbeatAnchor/liveCheckIn.html',
success:function(data){
console.log('开播签到',data)
if(data.code!=1){
layer.msg(data.msg)
return;
}{
layer.msg("簽到成功")
view()
// $(".mc-task-btn").addClass("mc-task-btn-end")
// $(".mc-task-p1").text('積極與用戶互動，對新進直播的用戶表示歡迎，更容易獲得心動值噢。')
// $(".mc-task-p2").text('')
}
}
})
}
function exc(e){
$.ajax({
url:$ip+'/actHeartbeatAnchor/exchangeBonds.html',
data:{
exchangeItem:e
},
success:function(data){
console.log("積分兌換羽毛",data)
if(data.code==1){
layer.msg("兌換成功")
if(sessionStorage.uid==sessionStorage.roomId)view()
else topMc()
}else{
layer.msg(data.msg)
}
}
})
}
})
</script>
</html>