xiaoyu
690 lines
40 KiB
PHP
690 lines
40 KiB
PHP
<body class="bg-fff">
|
|
<div id="app" ref="app">
|
|
<div class="container bg-size-fullwidth bg-no-repeat bg-pos-top pb130" :style="'background-image:url('+info.theme+')'">
|
|
<div class="h-290"></div>
|
|
<div id="main" class="bg-fff mb30 ml30 mr30 inner30 box-shadow-lightGray ulib-r20" style="min-height:72vh;">
|
|
<div class="mt10 pb30 text-center">
|
|
<div class="inline-block relative pl10 pr10 tx-shadow-e5 font-36">
|
|
<span class="relative z-index-1"><?=$h_title?></span>
|
|
</div>
|
|
</div>
|
|
<div v-if="tabFixed">
|
|
<div class="height-60"></div>
|
|
<div class="fixed top-0 left-0 right-0 z-index-10 bg-fff pl30 pr30 pt20 pb20">
|
|
<div class="relative height-60 ml50 mr50 fn-flex text-center">
|
|
<div class="fn-flex-item" v-for="(item,index) in info.tab"><a :class="'relative inline-block tab-menu '+ [tabid == item.id?'font-36 active':'font-32']" @click="changeTab(item.id,index)" href="javascript:">{{item.title}}</a></div>
|
|
<div :class="'glider glider-'+tabIndex"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-else class="relative height-60 ml50 mr50 fn-flex text-center">
|
|
<div class="fn-flex-item" v-for="(item,index) in info.tab"><a :class="'relative inline-block tab-menu '+ [tabid == item.id?'font-36 active':'font-32']" @click="changeTab(item.id,index)" href="javascript:">{{item.title}}</a></div>
|
|
<div :class="'glider glider-'+tabIndex"></div>
|
|
</div>
|
|
<!--预热阶段-->
|
|
<div v-if="tabid==1">
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="begin.mine && begin.mine.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">我的</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in begin.mine" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="begin.biz && begin.biz.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">本店</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in begin.biz" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="begin.area && begin.area.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">本域</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in begin.area" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="begin.all && begin.all.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">全域</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in begin.all" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 overflowhidden ulib-r20">
|
|
<div class="bg-fff5ec fn-flex text-center" v-if="begin.join && begin.join.length>0">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in begin.join" :href="item.url">
|
|
<div class="font-32">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="begin.area_browse && begin.area_browse.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.area_browse.title"></b>
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'browse','area')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.browse && begin.browse.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.area_browse.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="begin.area_book && begin.area_book.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.area_book.title"></b>
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'subscribe','area')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.browse && begin.browse.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.area_book.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.browse.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" :href="begin.browse.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'browse','biz')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.browse && begin.browse.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.browse.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="begin.browse.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.book.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" :href="begin.book.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'subscribe','biz')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.book && begin.book.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.book.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="begin.book.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="begin.gw_browse && begin.gw_browse.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.gw_browse.title"></b>
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'browse','gw')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.book && begin.book.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.gw_browse.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center" v-if="begin.gw_browse.url">
|
|
<a class="mt5 font-28" :href="begin.gw_browse.url">查看更多<i class="iconfont icon-gengduo"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="begin.gw_book && begin.gw_book.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="begin.gw_book.title"></b>
|
|
<select class="fn-fr select-more ulib-r10 font-28" @change="changebeginbook($event,'subscribe','gw')">
|
|
<option :value="item" v-for="item in day_list">{{item}}</option>
|
|
</select>
|
|
</div>
|
|
<div v-if="begin.book && begin.book.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in begin.gw_book.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center" v-if="begin.gw_book.url">
|
|
<a class="mt5 font-28" :href="begin.gw_book.url">查看更多<i class="iconfont icon-gengduo"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- end 预热阶段-->
|
|
<!--直播阶段-->
|
|
<div v-if="tabid==2">
|
|
<div class="mt30 bg-f9 inner20 overflowhidden text-center font-24 color-666 ulib-r20">直播结束后6小时同步完整数据</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="live.mine && live.mine.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">我的</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.mine" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="live.biz && live.biz.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">本店</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.biz" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="live.area && live.area.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">本域</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.area" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="relative mt30 bg-fff5ec overflowhidden ulib-r20" v-if="live.all && live.all.length>0">
|
|
<div class="orderTip text-center font-24 color-fff bg-ff5a5a">全域</div>
|
|
<div class="fn-flex pl20 pr20 text-center">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.all" :href="item.url">
|
|
<div class="font-32 color-fe9538">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}<i v-if="item.url" class="iconfont icon-gengduo"></i></div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="mt30 overflowhidden ulib-r20">
|
|
<div class="bg-f6 fn-flex text-center" v-if="live.l_time && live.l_time.length>0">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.l_time" :href="item.url">
|
|
<div class="font-32">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}</div>
|
|
</a>
|
|
</div>
|
|
<div class="bg-fff5ec fn-flex text-center" v-if="live.join && live.join.length>0">
|
|
<a class="fn-flex-item pt40 pb40" v-for="item in live.join" :href="item.url">
|
|
<div class="font-32">{{item.num}}</div>
|
|
<div class="mt10 font-22 color-666">{{item.title}}</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.area_view && live.area_view.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.area_view.title"></b>
|
|
</div>
|
|
<div v-if="begin.browse && begin.browse.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.area_view.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.area_order && live.area_order.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.area_order.title"></b>
|
|
</div>
|
|
<div v-if="begin.browse && begin.browse.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.area_order.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.view.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" :href="live.view.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
</div>
|
|
<div v-if="live.view.list.length>0">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.view.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="live.view.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.order.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" :href="live.order.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
</div>
|
|
<div v-if="live.order.list.length>0">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.order.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="live.order.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.view_num && live.view_num.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.view_num.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" v-if="live.view_num.url" :href="live.view_num.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
</div>
|
|
<div>
|
|
<div class="font-32 color-666" v-for="(item,index) in live.view_num.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="live.view_num.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.view_time && live.view_time.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.view_time.title"></b>
|
|
<!-- <a class="mt5 fn-fr font-28" v-if="live.view_time.url" :href="live.view_time.url">查看更多<i class="iconfont icon-gengduo"></i></a>-->
|
|
</div>
|
|
<div>
|
|
<div class="font-32 color-666" v-for="(item,index) in live.view_time.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="index<3" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+(index+1)+'.png'" alt="#" />
|
|
<span class="inline-block w-50 text-center text-middle" v-else>{{index+1}}</span>
|
|
<span class="text-middle">{{item.name}}</span>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center"><a class="mt5 font-28" :href="live.view_time.url">查看更多<i class="iconfont icon-gengduo"></i></a></div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.gw_view && live.gw_view.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.gw_view.title"></b>
|
|
</div>
|
|
<div v-if="begin.book && begin.book.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.gw_view.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center" v-if="live.gw_view.url">
|
|
<a class="mt5 font-28" :href="live.gw_view.url">查看更多<i class="iconfont icon-gengduo"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
<div class="mt30 bg-f9 inner40 overflowhidden ulib-r20" v-if="live.gw_order && live.gw_order.list">
|
|
<div class="pb20 fn-clear">
|
|
<b class="fn-fl font-40 text-italic" v-html="live.gw_order.title"></b>
|
|
</div>
|
|
<div v-if="begin.book && begin.book.list">
|
|
<div class="font-32 color-666" v-for="(item,index) in live.gw_order.list">
|
|
<div class="pt20 pb20 fn-clear">
|
|
<div class="fn-fl wp70 text-nowrap">
|
|
<img class="imgsize-42X42 text-middle" v-if="item.ranking<4" :src="'https://qs.liche.cn/web/images/project/H5-ShiYu/icon-ranking-'+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>
|
|
<span class="inline-block pl10 pr10 line-height-15 text-middle bg-fe9538 font-22 color-fff ulib-r750" v-if="item.tip">{{item.tip}}</span>
|
|
</div>
|
|
<div class="fn-fr">{{item.num}}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt10 text-center" v-if="live.gw_order.url">
|
|
<a class="mt5 font-28" :href="live.gw_order.url">查看更多<i class="iconfont icon-gengduo"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="pt100 pb100 text-center font-32 color-666" v-else>暂时无数据</div>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- end 直播阶段-->
|
|
</div>
|
|
|
|
<div class="fixed left-0 bottom-0 right-0 inner30 bg-fff" ><a class="block bg-1a1a1a pt20 pb20 text-center font-36 color-fff ulib-r10" :href="info.url">进入活动</a></div>
|
|
|
|
</div>
|
|
<?$this->load->view('h5/market/sylive/nav');?>
|
|
</div>
|
|
|
|
<script>
|
|
let hostUrl = ''
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
tabFixed:false,
|
|
tabIndex:0,
|
|
tabid:'<?=$info['tab']?>',//1预热阶段 /2直播阶段
|
|
info:'',
|
|
loading: false,
|
|
day_list : <?=json_encode($day_list,JSON_UNESCAPED_UNICODE)?>,
|
|
begin:{
|
|
mine:[],
|
|
biz:[],
|
|
area:[],
|
|
all:[],
|
|
join:[],
|
|
browse:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
book:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
area_browse:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
area_book:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
}
|
|
},
|
|
live:{
|
|
mine:[],
|
|
biz:[],
|
|
area:[],
|
|
all:[],
|
|
l_time:[],
|
|
join:[],
|
|
view:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
order:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
view_num:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
},
|
|
view_time:{
|
|
title:'',
|
|
url:'',
|
|
list:[],
|
|
}
|
|
},
|
|
ph_type:'',
|
|
gtype:'',
|
|
},
|
|
created(){
|
|
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
mounted() {
|
|
window.addEventListener('scroll', this.handleScroll, true)
|
|
this.getInfo()
|
|
if(this.tabid == 1){
|
|
this.getBegin()
|
|
}else if(this.tabid == 2){
|
|
this.tabIndex = 1
|
|
this.getLive()
|
|
}
|
|
},
|
|
beforeDestroy() {
|
|
|
|
},
|
|
//离开页面时
|
|
destroyed () {
|
|
window.removeEventListener('scroll', this.handleScroll)
|
|
},
|
|
methods: {
|
|
|
|
//判断导航是否需要吸顶
|
|
handleScroll () {
|
|
let scrollTop = document.querySelector('#app').scrollTop
|
|
let mainoffsetTop = document.querySelector('#main').offsetTop
|
|
if (scrollTop > mainoffsetTop) {
|
|
this.tabFixed = true
|
|
} else {
|
|
this.tabFixed = false
|
|
}
|
|
},
|
|
|
|
//获取基础信息
|
|
getInfo(){
|
|
this.info = {
|
|
theme:'<?=$info['banner']?>',
|
|
tab:[
|
|
{
|
|
id:'1',
|
|
title:'预热阶段',
|
|
},
|
|
{
|
|
id:'2',
|
|
title:'直播阶段',
|
|
},
|
|
],
|
|
url:'/h5/market/sylive/act?skey=<?=$skey?>',
|
|
}
|
|
},
|
|
|
|
//tab切换
|
|
changeTab(id,index){
|
|
if(id != this.tabid&&!this.loading){
|
|
if(this.tabFixed){
|
|
let mainoffsetTop = document.querySelector('#main').offsetTop
|
|
$('html,body').animate({scrollTop: mainoffsetTop+5},500);
|
|
}
|
|
this.tabid = id
|
|
this.tabIndex = index
|
|
if(this.tabid == 1){
|
|
this.getBegin()
|
|
}else if(this.tabid == 2){
|
|
this.getLive()
|
|
}
|
|
}
|
|
},
|
|
|
|
//预热阶段数据
|
|
getBegin(){
|
|
let that=this;
|
|
if (!that.loading) {
|
|
that.loading = true;
|
|
//请求接口
|
|
$.get('/h5/market/sylive/stic/lists_ready',{'skey':'<?=$skey?>','biz_id':'<?=$info['biz_id']?>','area_id':'<?=$info['area_id']?>'},function (result){
|
|
that.loading = false;
|
|
if(result.data){
|
|
that.begin = result.data
|
|
}
|
|
console.dir(that.begin)
|
|
},'json');
|
|
}
|
|
},
|
|
|
|
//直播阶段数据
|
|
getLive(){
|
|
let that=this;
|
|
if (!that.loading) {
|
|
that.loading = true;
|
|
//请求接口
|
|
$.get('/h5/market/sylive/stic/lists_live',{'skey':'<?=$skey?>','biz_id':'<?=$info['biz_id']?>','area_id':'<?=$info['area_id']?>'},function (result){
|
|
that.loading = false;
|
|
if(result.data){
|
|
that.live = result.data
|
|
}
|
|
},'json');
|
|
}
|
|
},
|
|
|
|
//选择浏览时间
|
|
changebeginbook(e,type,gtype){
|
|
// console.log(e.target.value)
|
|
// console.log(type)
|
|
this.ph_type = type;
|
|
this.gtype = gtype;
|
|
// if(this.beginbookDate != e.target.value){
|
|
this.beginbookDate = e.target.value
|
|
let that=this;
|
|
var params = {
|
|
'skey':'<?=$skey?>',
|
|
'biz_id':'<?=$info['biz_id']?>',
|
|
'area_id':'<?=$info['area_id']?>',
|
|
'day' : this.beginbookDate,
|
|
'type':type,
|
|
'gtype':gtype,
|
|
'size':10
|
|
}
|
|
//请求接口
|
|
$.get('/h5/market/sylive/stic/ajax_rank',params,function (result){
|
|
if(result.data){
|
|
if(that.gtype=='area'){
|
|
if(that.ph_type=='subscribe'){
|
|
that.begin.area_book.list = result.data.lists
|
|
}else{
|
|
that.begin.area_browse.list = result.data.lists
|
|
}
|
|
}else if(that.gtype=='gw'){
|
|
if(that.ph_type=='subscribe'){
|
|
that.begin.gw_book.list = result.data.lists
|
|
that.begin.gw_book.url = result.data.url
|
|
}else{
|
|
that.begin.gw_browse.list = result.data.lists
|
|
that.begin.gw_browse.url = result.data.url
|
|
}
|
|
}else{
|
|
if(that.ph_type=='subscribe'){
|
|
that.begin.book.list = result.data.lists
|
|
that.begin.book.url = result.data.url
|
|
}else{
|
|
that.begin.browse.list = result.data.lists
|
|
that.begin.browse.url = result.data.url
|
|
}
|
|
}
|
|
}
|
|
},'json');
|
|
// }
|
|
},
|
|
},
|
|
})
|
|
</script>
|
|
<?=$this->load->view('h5/market/sylive/share_script')?>
|
|
</body>
|