admin/liche
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
7db088250d52bed29cf4e9f2f6db21e3d2b05fbb
liche/home/views/h5/syt/live_statistics.php
T
dengbw 7db088250d stylive_519 
stylive_519_2
2022-05-19 16:21:19 +08:00

187 lines
12 KiB
PHP
Raw Blame History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title><?= $_title ?></title>
<link rel="stylesheet" href="/css/h5/syt/live.css?v=2022513">
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/jquery.3.4.1.min.js"></script>
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/vue.2.6.10.min.js"></script>
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript/mDialog.js"></script>
<script type="text/javascript" src="https://qs.haodian.cn/web/javascript//vue-mugen-scroll.js"></script>
</head>
<body class="bg-fff">
<div id="app">
<div class="container"
style="background-image:url(https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/bd-bg.png)">
<div class="pl25 pr25">
<div class="fn-flex pt50 pb50 pl100 pr100 text-center">
<div class="fn-flex-item" v-for="item in info.tab"><a
:class="'relative inline-block color-fff tab-menu '+ [info.tabid == item.id?'font-36 active':'font-32']"
@click="changeTab(item.id)" href="javascript:">{{item.title}}</a></div>
</div>
<div v-if="info.tabid==info.tab[0].id">
<div class="bg-fff mb30 pt40 pb40 pl30 pr30 box-shadow-lightGray ulib-r10">
<div class="fn-flex text-center">
<a class="fn-flex-item" v-for="item in info.survey"
:href="item.url ? item.url : 'javascript:void(0);'">
<div class="font-40 color-ff7200">{{item.num}}</div>
<div class="mt10 font-22 color-666">{{item.title}}
<i v-if="item.url" class="inline-block imgsize-20X20 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-right2.png');"></i>
</div>
</a>
</div>
</div>
<!--实时动态-->
<div class="bg-fff mb30 inner40 box-shadow-lightGray ulib-r10">
<div class="pb20 fn-clear">
<img class="fn-fl" style="width:21.5vw;"
src="https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/tt-dynamic.png"
alt="#"/>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750"
@click="isShowDynamicMore=!isShowDynamicMore" v-if="isShowDynamicMore">
<span class="text-middle font-28">展开收起</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-up.png');"></i>
</div>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750"
@click="isShowDynamicMore=!isShowDynamicMore" v-else>
<span class="text-middle font-28">展开更多</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-down.png');"></i>
</div>
</div>
<div class="font-32 color-666" v-for="(item,index) in info.dynamic" v-if="info.dynamic.length>0">
<div class="pt15 pb15 fn-clear" v-if="isShowDynamicMore">
<div class="fn-fl">{{item.title}}</div>
<div class="fn-fr">{{item.time}}</div>
</div>
<div class="pt15 pb15 fn-clear" v-else-if="index<12">
<div class="fn-fl">{{item.title}}</div>
<div class="fn-fr">{{item.time}}</div>
</div>
</div>
<div class="pt20 pb20 text-center font-32 color-666" v-else>暂时无数据</div>
</div>
<!--end 实时动态-->
</div>
<div v-else-if="info.tabid==info.tab[1].id">
<!--观看排行-->
<div class="bg-fff mb30 inner40 box-shadow-lightGray ulib-r10">
<div class="pb20 fn-clear">
<img class="fn-fl" style="width:26.7vw;"
src="https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/tt-view.png" alt="#"/>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750"
@click="isShowViewMore=!isShowViewMore" v-if="isShowViewMore">
<span class="text-middle font-28">展开收起</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-up.png');"></i>
</div>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750"
@click="isShowViewMore=!isShowViewMore" v-else>
<span class="text-middle font-28">展开更多</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-down.png');"></i>
</div>
</div>
<div class="font-32 color-666" v-for="(item,index) in info.watchsList" v-if="info.watchsList.length>0">
<div class="pt20 pb20 fn-clear" v-if="isShowViewMore">
<div class="fn-fl">
<img class="imgsize-50X50 text-middle" v-if="item.ranking<4"
:src="'https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-num-'+item.ranking+'.png'"
alt="#"/>
<span class="inline-block w-50 text-center text-middle" v-else>{{item.ranking}}</span>
<span class="text-middle">{{item.name}}</span>
</div>
<div class="fn-fr">{{item.num}}</div>
</div>
<div class="pt20 pb20 fn-clear" v-else-if="index<5">
<div class="fn-fl">
<img class="imgsize-50X50 text-middle" v-if="item.ranking<4"
:src="'https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-num-'+item.ranking+'.png'"
alt="#"/>
<span class="inline-block w-50 text-center text-middle" v-else>{{item.ranking}}</span>
<span class="text-middle">{{item.name}}</span>
</div>
<div class="fn-fr">{{item.num}}</div>
</div>
</div>
<div class="pt20 pb20 text-center font-32 color-666" v-else>暂时无数据</div>
</div>
<!--end 观看排行-->
<!--报名排行-->
<div class="bg-fff mb30 inner40 box-shadow-lightGray ulib-r10">
<div class="pb20 fn-clear">
<img class="fn-fl" style="width:26.7vw;"
src="https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/tt-reg.png" alt="#"/>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750" @click="isShowRegMore=!isShowRegMore"
v-if="isShowRegMore">
<span class="text-middle font-28">展开收起</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-up.png');"></i>
</div>
<div class="fn-fr pt5 pb10 pl20 pr15 bds-1-666 ulib-r750" @click="isShowRegMore=!isShowRegMore"
v-else>
<span class="text-middle font-28">展开更多</span><i
class="inline-block text-middle imgsize-25X25 bg-no-repeat bg-size-cover"
style="background-image:url('https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-arrow-down.png');"></i>
</div>
</div>
<div class="font-32 color-666" v-for="(item,index) in info.enrollsList" v-if="info.enrollsList.length>0">
<div class="pt20 pb20 fn-clear" v-if="isShowRegMore">
<div class="fn-fl">
<img class="imgsize-50X50 text-middle" v-if="item.ranking<4"
:src="'https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-num-'+item.ranking+'.png'"
alt="#"/>
<span class="inline-block w-50 text-center text-middle" v-else>{{item.ranking}}</span>
<span class="text-middle">{{item.name}}</span>
</div>
<div class="fn-fr">{{item.num}}</div>
</div>
<div class="pt20 pb20 fn-clear" v-else-if="index<5">
<div class="fn-fl">
<img class="imgsize-50X50 text-middle" v-if="item.ranking<4"
:src="'https://qs.haodian.cn/web/images/special/liche/20220329-zhibo/icon-num-'+item.ranking+'.png'"
alt="#"/>
<span class="inline-block w-50 text-center text-middle" v-else>{{item.ranking}}</span>
<span class="text-middle">{{item.name}}</span>
</div>
<div class="fn-fr">{{item.num}}</div>
</div>
</div>
<div class="pt20 pb20 text-center font-32 color-666" v-else>暂时无数据</div>
</div>
<!--end 报名排行-->
</div>
</div>
</div>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
info: <?=json_encode($info)?>,
isShowDynamicMore: false,
isShowViewMore: false,
isShowRegMore: false,
},
created() {
},
computed: {},
mounted() {
},
beforeDestroy() {
},
methods: {
//tab切换
changeTab(id) {
this.info.tabid = id
},
},
})
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink