You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

530 lines
20 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<extend name="Public/base"/>
<block name="sidebar"></block>
<block name="style">
<style>
body{padding: 0}
</style>
</block>
<block name="body">
<link rel="stylesheet" href="__CSS__/kendo.dataviz.min.css" />
<link rel="stylesheet" href="__CSS__/kendo.default.min.css" />
<link rel="stylesheet" href="__CSS__/kendo.rtl.min.css" />
<script src="__JS__/kendo.dataviz.min.js"></script>
<script src="__JS__/kendo.timezones.min.js"></script>
<script src="__STATIC__/layer/layer.js" type="text/javascript"></script>
<!-- 主体 -->
<div id="indexMain" class="index-main">
<!-- 插件块 -->
<div class="container-span aiwrap">
<div class="xg_patone">
<div class="xg_hello">
<span class="xg_spanmar"><span class="col_333">您好,</span><span class="xg_colb"><notempty name="data.nickname">{$data.nickname}<else />{$data.username}</notempty></span>({$data.group})</span>
<span>上次登录时间:</span><span class="xg_spanmar">{$data.last_login_time|date='Y-m-d H:i:s',###}</span>
<span>上次登录IP</span><span class="xg_spanmar">{:long2ip($data['last_login_ip'])}</span>
<span>累计登录次数:</span><span>{$data.login}</span>
</div>
<div class="xg_zhchart">
<div class="timeandtab">
<div class="time_fl jsctitle">
<div class="pt-datepicker__date js-pt-calendar">
<i class="icon_date"></i>
<time class="pt-datepicker__date-from pt-fl js-pt-calendar-from jsctitle1">{:str_replace('-','/',substr(I('start',date('Y/m/d',strtotime('-1 day'))),5))}</time>
<time class="pt-datepicker__date-to js-pt-calendar-to jsctitle2">{:str_replace('-','/',substr(I('end',date('Y/m/d',strtotime('-1 day'))),5))}</time>
<i class="xg_dropi js-pt-datepicker__date-i"></i>
</div>
<div class="xg_daterangepicker js-show-calendar">
<div class="ranges">
<ul>
<li class="<eq name='num' value='1'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d'),'end'=>date('Y-m-d'),'num'=>1))}">今天</a></li>
<li class="<eq name='num' value='2'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',strtotime('-1 day')),'end'=>date('Y-m-d',strtotime('-1 day')),'num'=>2))}">昨天</a></li>
<li class="<eq name='num' value='3'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',mktime(0,0,0,date('m'),date('d')-6-date('w'),date('Y'))),'end'=>date('Y-m-d',mktime(0,0,0,date('m'),date('d')-date('w'),date('Y'))),'num'=>3))}">过去整周</a></li>
<li class="<eq name='num' value='4'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',mktime(0,0,0,date('m')-1,1,date('Y'))),'end'=>date('Y-m-d',mktime(0,0,0,date('m'),1,date('Y'))-1),'num'=>4))}">过去整月</a></li>
<li class="<eq name='num' value='5'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',strtotime('-7 day')),'end'=>date('Y-m-d',strtotime('-1 day')),'num'=>5))}">过去7天</a></li>
<li class="<eq name='num' value='6'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',strtotime('-30 day')),'end'=>date('Y-m-d',strtotime('-1 day')),'num'=>6))}">过去30天</a></li>
<li class="<eq name='num' value='7'>datapick_active</eq>"><a href="{:U('index',array('start'=>date('Y-m-d',strtotime('-365 day')),'end'=>date('Y-m-d',strtotime('-1 day')),'num'=>7))}">过去一年</a></li>
</ul>
<div class="range_inputs">
<button class="applyBtn pt-btn btn-success js_determine" type="button">确定</button>
</div>
</div>
<div class="xg_zcalendar xg_left">
<div class="calendar-table">
<table class="table-condensed jscalendar1">
<thead>
<tr>
<th class="prev available jspn" data-range-key="{$calendar.prev}"><i class=" page-Previous "></i></th>
<th colspan="5" class="month">{$calendar.ftitle}</th>
<th></th>
</tr>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody class="jscalendarcontent">
<volist name="calendar[first]" id="vo">
<tr>
<volist name="vo" id="v" key="j">
<td class="<eq name='v.full' value='$calendar.today'>today</eq> <eq name='j' value='6'>weekend<else /><eq name='j' value='7'>weekend</eq></eq> available <notempty name='v.value'>jsselect</notempty>" data-key="{$v.full}"><span>{$v.value|default=' '}</span></td>
</volist>
</tr>
</volist>
</tbody>
</table>
</div>
</div>
<div class="xg_zcalendar xg_right">
<div class="calendar-table">
<table class="table-condensed jscalendar2">
<thead>
<tr>
<th></th>
<th colspan="5" class="month">{$calendar.ltitle}</th>
<th class="next <eq name='calendar.iscurrent' value='1'>available jspn</eq>" data-range-key="{$calendar.next}"><i class="page-next"></i></th>
</tr>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody class="jscalendarcontent">
<volist name="calendar[last]" id="vo">
<tr>
<volist name="vo" id="v" key="j">
<td class="<eq name='v.full' value='$calendar.today'>today</eq> <notempty name='v.value'><eq name='v.no' value='1'>noselect<else />jsselect</eq></notempty> <eq name='j' value='6'>weekend<else /><eq name='j' value='7'>weekend</eq></eq> available" data-key="{$v.full}" ><span>{$v.value|default=' '}</span></td>
</volist>
</tr>
</volist>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<!-- 图表数据图切换按钮 begin-->
<div class="tab_fr tab_head">
<a href="#0" data-key="news" class="<empty name='Think.get.tb'>current<else /><eq name='Think.get.tb' value='0'>current</eq></empty>">新增用户</a>
<a href="#1" data-key="active" class="<eq name='Think.get.tb' value='1'>current</eq>">活跃用户</a>
<a href="#2" data-key="player" class="<eq name='Think.get.tb' value='2'>current</eq>">付费用户</a>
<a href="#3" data-key="news" class="<eq name='Think.get.tb' value='3'>current</eq>">充值金额</a>
</div>
<!--end 图表数据图切换按钮-->
<!-- heightChart! begin -->
<div class="htchart_area tab_content">
<div class="htchart_area_tab <empty name='Think.get.tb'>show<else /><eq name='Think.get.tb' value='0'>show</eq></empty>" id="container1" style="width:100%;height:220px;"></div>
<div class="htchart_area_tab <eq name='Think.get.tb' value='1'>show</eq>" id="container2" style="width:100%;height:220px;"></div>
<div class="htchart_area_tab <eq name='Think.get.tb' value='2'>show</eq>" id="container3" style="width:100%;height:220px;"></div>
<div class="htchart_area_tab <eq name='Think.get.tb' value='3'>show</eq>" id="container4" style="width:100%;height:220px;"></div>
</div>
<!--end heightChart!-->
<div class="xg_analybox clearfix">
<div class="analy_div">
<div class="analy_divcontent">
<h3 class="col_o">{:set_number_short($foldline['compare']['news']['count'])}</h3>
<div>
<span class="analy_spantit">新增用户</span>
<notempty name="foldline.compare.news">
<gt name="foldline.compare.news.rate" value="0">
<span class="analy_plus">+{$foldline.compare.news.rate}%<i class="xg_plusTriangle"></i></span>
<else />
<lt name="foldline.compare.news.rate" value="0">
<span class="analy_decline">{$foldline.compare.news.rate}%<i class="xg_declineTriangle"></i></span>
<else />
<span class="">--</span>
</lt>
</gt>
<else /><span class="">--</span>
</notempty>
</div>
<div>
<span class="analy_spantit">平台累计用户</span>
<span class="col_b">{:set_number_short($user_count)}</span>
</div>
</div>
</div>
<div class="analy_div">
<div class="analy_divcontent">
<h3 class="col_o">{:set_number_short($foldline['compare']['active']['count'])}</h3>
<div>
<span class="analy_spantit">活跃用户</span>
<notempty name="foldline.compare.active">
<gt name="foldline.compare.active.rate" value="0">
<span class="analy_plus">+{$foldline.compare.active.rate}%<i class="xg_plusTriangle"></i></span>
<else />
<lt name="foldline.compare.active.rate" value="0">
<span class="analy_decline">{$foldline.compare.active.rate}%<i class="xg_declineTriangle"></i></span>
<else />
<span class="">--</span>
</lt>
</gt>
<else /><span class="">--</span>
</notempty>
</div>
<div>
<span class="analy_spantit">七日活跃用户</span>
<span class="col_b">{:set_number_short($active_count)}</span>
</div>
</div>
</div>
<div class="analy_div">
<div class="analy_divcontent">
<h3 class="col_o">{:set_number_short($foldline['compare']['player']['count'])}</h3>
<div>
<span class="analy_spantit">付费用户</span>
<notempty name="foldline.compare.player">
<gt name="foldline.compare.player.rate" value="0">
<span class="analy_plus">+{$foldline.compare.player.rate}%<i class="xg_plusTriangle"></i></span>
<else />
<lt name="foldline.compare.player.rate" value="0">
<span class="analy_decline">{$foldline.compare.player.rate}%<i class="xg_declineTriangle"></i></span>
<else />
<span class="">--</span>
</lt>
</gt>
<else /><span class="">--</span>
</notempty>
</div>
<div>
<span class="analy_spantit">累计付费用户</span>
<span class="col_b">{:set_number_short($player_count)}</span>
</div>
</div>
</div>
<div class="analy_div">
<div class="analy_divcontent">
<h3 class="col_o">{:set_number_short($foldline['compare']['money']['count'])}</h3>
<div>
<span class="analy_spantit">充值金额</span>
<notempty name="foldline.compare.money">
<gt name="foldline.compare.money.rate" value="0">
<span class="analy_plus">+{$foldline.compare.money.rate}%<i class="xg_plusTriangle"></i></span>
<else />
<lt name="foldline.compare.money.rate" value="0">
<span class="analy_decline">{$foldline.compare.money.rate}%<i class="xg_declineTriangle"></i></span>
<else />
<span class="">--</span>
</lt>
</gt>
<else /><span class="">--</span>
</notempty>
</div>
<div>
<span class="analy_spantit">累计充值金额</span>
<span class="col_b">{:set_number_short($money_sum)}</span>
</div>
</div>
</div>
<div class="analy_div">
<div class="analy_divcontent">
<h3 class="col_o">{:set_number_short($foldline['compare']['promote']['count'])}</h3>
<div>
<span class="analy_spantit">合作渠道</span>
<notempty name="foldline.compare.promote">
<gt name="foldline.compare.promote.rate" value="0">
<span class="analy_plus">+{$foldline.compare.promote.rate}%<i class="xg_plusTriangle"></i></span>
<else />
<lt name="foldline.compare.promote.rate" value="0">
<span class="analy_decline">{$foldline.compare.promote.rate}%<i class="xg_declineTriangle"></i></span>
<else />
<span class="">--</span>
</lt>
</gt>
<else /><span class="">--</span>
</notempty>
</div>
<div>
<span class="analy_spantit">累计合作渠道</span>
<span class="col_b">{:set_number_short($promote_sum)}</span>
</div>
</div>
</div>
</div>
</div>
</div>
<!--第一部分结束-->
{:hook('AdminIndex')}
</div>
</div>
</block>
<block name="script">
<script>
var datelist;
$(function() {
//点击时间显示日历 begin
$(".js-pt-calendar").click(function(){
$(".js-show-calendar").toggle();
})
//end 点击时间显示日历
//点击确定关闭日历 begin
$(".js_determine").click(function(){
$(".js-show-calendar").hide();
});
//end 点击确定关闭日历
if({$foldline.hours|default=1}==1) {
Highcharts.setOptions({
chart:{type:'areaspline',spacingLeft:0,},
title:{text: null},legend:{enabled:false},yAxis:{title:{text:null}},
tooltip:{backgroundColor: '#fff',borderColor:'white',borderRadius:10,borderWidth:1,shadow:true,animation:true,style:{color: "#999",fontSize: "12px",fontWeight: "blod",fontFamily: "Microsoft Yahei"},shared: true,useHTML: true,valueDecimals:2,
headerFormat: '<table>',pointFormat:'',footerFormat:'</table>',pointFormatter:function(){var s = '<table style="text-align:center;"><small style="color:#1bb2eb;text-align:center;display:block;margin:0;padding:0;">'+this.y+'</small><small>';s += $('.jsctitle1').text()+'/';s += this.category+'~'+(this.index+1)+':00';s += '</small></table>';return s;}
},
credits:{enabled: false},
plotOptions:{areaspline:{fillOpacity:0.5}},
xAxis:{tickInterval:2,categories:['0:00','1:00','2:00','3:00','4:00','5:00','6:00','7:00','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00','20:00','21:00','22:00','23:00'],tickmarkPlacement:'on'},
});
datelist = [{$foldline.date}];
} else {
Highcharts.setOptions({
chart:{type:'areaspline',spacingLeft:0,},
title:{text: null},legend:{enabled:false},yAxis:{title:{text:null}},
tooltip:{backgroundColor: '#fff',borderColor:'white',borderRadius:10,borderWidth:1,shadow:true,animation:true,style:{color: "#999",fontSize: "12px",fontWeight: "blod",fontFamily: "Microsoft Yahei"},shared: true,useHTML: true,valueDecimals:2,headerFormat:'<small style="color:#1bb2eb;text-align:center;display:block;margin:0;padding:0;">{point.y}</small><small>{point.key}</small><table>',pointFormat:'',footerFormat:'</table>',},
credits:{enabled: false},
plotOptions:{areaspline:{fillOpacity:0.5}},
xAxis:{categories:[{$foldline.date}],tickmarkPlacement:'on'},
});
datelist = [{$foldline.date}];
}
selectrange(datelist);
$('#container1').highcharts({
series:[{data:[{$foldline.news}]}]
});
$('#container2').highcharts({
series:[{data:[{$foldline.active}]}]
});
$('#container3').highcharts({
series:[{data:[{$foldline.player}]}]
});
$('#container4').highcharts({
series:[{data:[{$foldline.money}]}]
});
//新增用户和付费用户数据图表切换
$('.tab_head a').click(function() {
var that=$(this),sib = that.closest('.tab_head').siblings('.tab_content');
that.siblings().removeClass('current');
var index= that.addClass('current').index();
sib.find('.htchart_area_tab').removeClass('show').eq(index).addClass('show');
$('.ranges li a').each(function() {
var url = $.trim($(this).attr('href')).replace(/((\.htm(l?))?)$/g,'').replace(/\/tb\/[012]/g,'');
$(this).attr('href',url+'/tb/'+index+'.html');
});
});
$('.jsranges li').on('click',function() {
var that = $(this),range = $.trim(that.attr('data-range-key')).split(',');
if (that.hasClass('datapick_active')) {return false;}
that.addClass('datapick_active').siblings('li').removeClass('datapick_active');
parent = that.closest('.jsctitle');
chartdata(range[0],range[1],parent);
$(".js-show-calendar").toggle();
return false;
});
$('.jspn').on('click',function() {
jspn($(this));
return false;
});
$('.js_determine').on('click',function() {
var that = $(this),parent = that.closest('.jsctitle');
if (parent.find('.in-range').length>0) {
var first = parent.find('.jscalendarcontent .in-range.first').attr('data-key');
var last = parent.find('.jscalendarcontent .in-range.last').attr('data-key');
chartdata(first,last,parent);
} else {
layer.msg('请选择时间范围');
}
return false;
});
jsselect();
});
function selectrange(range) {
if (range) {
$.each(range,function(i,n) {
if (i == 0) {$('.available[data-key="'+n+'"]').addClass('in-range first');}
else if (i == range.length-1) {$('.available[data-key="'+n+'"]').addClass('in-range last');}
else {$('.available[data-key="'+n+'"]').addClass('in-range');}
});
}
}
function chartdata(start,end,parent) {
var href = '{:U("index")}';
end = end?end:start;
var tb = $.trim($('.tab_head a.current').attr('href')).replace('#','');
window.location.href = href.replace('.html','')+'/start/'+start+'/end/'+end+'/tb/'+tb+'.html';
}
function getdatelist(start,end) {
var i = start,j=0;
var range=[];
while(i<=end) {
var date = new Date(i);
range[j++] = date.getFullYear()+'-'+supplement_zero(date.getMonth()+1)+'-'+supplement_zero(date.getDate());
i+=86400000;
}
return range;
}
function supplement_zero(num) {
return num.toString().length==1?'0'+num:num;
}
function jsselect() {
$('.jsselect').on('click',function(){
var that = $(this),sib = $('.jsselect.active');
if (sib.length<1) {
$('.jsselect').removeClass('in-range first last');
that.addClass('active first in-range');
} else if (sib.length==1) {
that.addClass('active last');
var val = (new Date($.trim(that.attr('data-key')).replace(/-/g,'/'))).getTime();
var sibval = (new Date($.trim(sib.attr('data-key')).replace(/-/g,'/'))).getTime();
if (val<sibval) {
that.removeClass('last').addClass('first');
sib.removeClass('first').addClass('last');
var temp = val;val = sibval;sibval=temp;
}
var dl = getdatelist(sibval,val);
$.each(dl,function(i,n) {
$('.jsselect[data-key="'+n+'"]').addClass('in-range');
});
} else {
$('.jsselect').removeClass('in-range active first last');
that.addClass('active first');
}
return false;
});
}
function jspn(that) {
var range = $.trim(that.attr('data-range-key')).split(',');
if (that.hasClass('disabled')) {return false;}
that.addClass('disabled');
$.ajax({
type:'post',
dataType:'json',
url:'{:U("calendar")}',
data:{start:range[0],end:range[1],flag:true},
success:function(data) {
var first = $('.jscalendar1');
var last = $('.jscalendar2');
var dfirst = data.first;
var dlast = data.last;
first.find('.month').text(data.ftitle).siblings('.prev').attr('data-range-key',data.prev);
var next = last.find('.month').text(data.ltitle).siblings('.next').attr('data-range-key',data.next);
if (parseInt(data.iscurrent)==1){next.addClass('available jspn');} else {next.removeClass('available jspn');}
var ftemp = '';var ltemp = '';
$.each(dfirst,function(i,n) {
ftemp += '<tr>';
$.each(n,function(j,m) {
var classname = '';
if (m.full == data.today) {classname += ' today ';}
if (m.no == 1) {classname += ' noselect ';}
if (j == 6 || j == 7) {classname += ' weekend ';}
ftemp += '<td class="available jsselect '+classname+' " data-key="'+m.full+'" ><span>';
if (m.value) {ftemp += m.value;}
else {ftemp += ' ';}
ftemp += '</span></td> ';
});
ftemp += '</tr>';
});
first.find('.jscalendarcontent').html('').html(ftemp);
$.each(dlast,function(i,n) {
ltemp += '<tr>';
$.each(n,function(j,m) {
var classname = '';
if (m.full == data.today) {classname += ' today ';}
if (m.no == 1) {classname += ' noselect ';} else {classname += ' jsselect ';}
if (j == 6 || j == 7) {classname += ' weekend ';}
ltemp += '<td class="available '+classname+' " data-key="'+m.full+'" ><span>';
if (m.value) {ltemp += m.value;}
else {ltemp += ' ';}
ltemp += '</span></td> ';
});
ltemp += '</tr>';
});
last.find('.jscalendarcontent').html('').html(ltemp);
that.removeClass('disabled');
$('.jspn').on('click',function() {jspn($(this)); return false;});
selectrange(datelist);
jsselect();
},error:function() {
layer.msg('服务器错误,请稍候再试');that.removeClass('disabled');
}
});
}
</script>
<script type="text/javascript">
/* 插件块关闭操作 */
$(".title-opt .wm-slide").each(function(){
$(this).click(function(){
$(this).closest(".columns-mod").find(".bd").toggle();
$(this).find("i").toggleClass("mod-up");
});
})
$(function(){
$('.copyright').html('<div class="copyright"> &copy;2013-2017 徐州梦创信息科技有限公司版权所有</div>');
$('.sidebar').remove();
})
</script>
</block>