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.

222 lines
8.6 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="css">
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
.select2-container--default .select2-selection--single {
color: #000;
resize: none;
border-width: 1px;
border-style: solid;
border-color: #a7b5bc #ced9df #ced9df #a7b5bc;
box-shadow: 0px 3px 3px #F7F8F9 inset;height:35px;
height:28px;border-radius:3px;font-size:12px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
line-height:35px;
line-height:28px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height:26px;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
height:26px;line-height:26px;font-size:12px;
}
.select2-results__option[aria-selected] {font-size:12px;}
</style>
</block>
<block name="body">
<script type="text/javascript" src="__JS__/bootstrap.min.js"></script>
<script type="text/javascript" src="__JS__/select2.min.js"></script>
<div class="cf main-place top_nav_list navtab_list">
<h3 class="page_title">推广员分析</h3>
<p class="description_text">说明:根据游戏,日期,查看注册充值前十名推广员</p>
</div>
<div class="cf top_nav_list">
<!-- 高级搜索 -->
<div class="jssearch fl cf search_list">
<div class="input-list search-title-box">
<label>搜索:</label>
</div>
<div class="input-list input-list-game search_label_rehab">
<select id="game_id" name="game_id" class="select_gallery">
<option value="">游戏名称</option>
<volist name=":get_game_list()" id="vo">
<option game-id="{$vo.id}" value="{$vo.id}">{$vo.game_name}</option>
</volist>
</select>
</div>
<div class="input-list">
<input type="text" id="time-start" name="time-start" class="" value="{$start}" placeholder="充值开始时间" />
&nbsp;-&nbsp;
<div class="input-append date" id="datetimepicker" style="display:inline-block">
<input type="text" id="time-end" name="time-end" class="" value="{$end}" placeholder="充值结束时间" />
<span class="add-on"><i class="icon-th"></i></span>
</div>
</div>
<div class="input-list">
<a class="sch-btn" href="javascript:;" id="search" url="{:U('stat/promote_analysis',array('data_order'=>I('data_order'),'model'=>$model['name']),false)}">搜索</a>
</div>
</div>
<div class="jssearch fr cf search_list search_list2">
<div class="input-list">
<a class="sch-btn <if condition="I('data_order') eq '1' or I('data_order') eq '' ">current</if> " href="javascript:;" id="search1" url="{:U('stat/promote_analysis',array('data_order'=>1,'game_id'=>I('game_id')),false)}">注册排序</a>
</div>
<div class="input-list">
<a class="sch-btn <if condition="I('data_order') eq '2' ">current</if>" href="javascript:;" id="search2" url="{:U('stat/promote_analysis',array('data_order'=>2,'game_id'=>I('game_id')),false)}">充值排序</a>
</div>
</div>
</div>
<!-- 数据列表 -->
<div class="data_box_mt">
<div id="maingaan" style="height:600px"></div>
<!-- ECharts单文件引入 -->
<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
<script type="text/javascript">
// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});
// 使用
require(
[
'echarts',
'echarts/chart/bar', // 使用柱状图就加载bar模块按需加载
'echarts/chart/line'
],
function (ec) {
// 基于准备好的dom初始化echarts图表
var myChart = ec.init(document.getElementById('maingaan'));
option = {
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
legend: {
data:['注册人数(人)','充值金额(元)']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [
{
type : 'category',
data : {$xAxis}
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'注册人数(人)',
type:'bar',
data:{$xzdate}
},
{
name:'充值金额(元)',
type:'bar',
stack: '充值',
data:{$xsdate}
}
]
};
// 为echarts对象加载数据
myChart.setOption(option);
}
);
</script>
</div>
</block>
<block name="script">
<link href="__STATIC__/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
<php>if(C('COLOR_STYLE')=='blue_color') echo '<link href="__STATIC__/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">';</php>
<link href="__STATIC__/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="__STATIC__/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
<script>
<volist name=":I('get.')" id="vo">
Think.setValue('{$key}',"{$vo}");
</volist>
$(".select_gallery").select2();
</script>
<script type="text/javascript">
//导航高亮
highlight_subnav('{:U('stat/promote_analysis')}');
$(function(){
//搜索功能
$("#search").click(function(){
var url = $(this).attr('url');
var query = $('.jssearch').find('input').serialize();
query += "&"+$('.jssearch').find('select').serialize();
query = query.replace(/(&|^)(\w*?\d*?\-*?_*?)*?=?((?=&)|(?=$))/g,'');
query = query.replace(/^&/g,'');
if( url.indexOf('?')>0 ){
url += '&' + query;
}else{
url += '?' + query;
}
window.location.href = url;
});
$("#search1").click(function(){
var url = $(this).attr('url');
var query = $('.jssearch').find('input').serialize();
query = query.replace(/(&|^)(\w*?\d*?\-*?_*?)*?=?((?=&)|(?=$))/g,'');
query = query.replace(/^&/g,'');
if( url.indexOf('?')>0 ){
url += '&' + query;
}else{
url += '?' + query;
}
window.location.href = url;
});
$("#search2").click(function(){
var url = $(this).attr('url');
var query = $('.jssearch').find('input').serialize();
query = query.replace(/(&|^)(\w*?\d*?\-*?_*?)*?=?((?=&)|(?=$))/g,'');
query = query.replace(/^&/g,'');
if( url.indexOf('?')>0 ){
url += '&' + query;
}else{
url += '?' + query;
}
window.location.href = url;
});
//回车自动提交
$('.jssearch').find('input').keyup(function(event){
if(event.keyCode===13){
$("#search").click();
}
});
$('#time-start').datetimepicker({
format: 'yyyy-mm-dd',
language:"zh-CN",
minView:2,
autoclose:true
});
$('#datetimepicker').datetimepicker({
format: 'yyyy-mm-dd',
language:"zh-CN",
minView:2,
autoclose:true,
pickerPosition:'bottom-left'
})
})
</script>
</block>