<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="充值开始时间" /> - <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>