123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298 |
- <?php include Doo::conf()->SITE_PATH . Doo::conf()->PROTECTED_FOLDER . "viewc//header.php"; ?>
- <script src="http://s1.bdstatic.com/r/www/cache/ecom/esl/1-6-10/esl.js"></script>
- <script type="text/javascript">
- // 路径配置
- require.config({
- paths:{
- 'echarts' : 'http://echarts.baidu.com/build/echarts'
- }
- });
-
- // 使用
- require(
- [
- 'echarts',
- 'echarts/chart/pie', // 使用柱状图就加载bar模块,按需加载
- 'echarts/chart/bar'
- ],
- function(ec) {
- //1 最近30天客户数量与记录趋势//
- // 基于准备好的dom,初始化echarts图表
- var myChart = ec.init(document.getElementById('chartContainer1'));
- var option = {
- color:['#e9af68','#57b7b6','#e4575a','#959eac','#ffa500',
- '#d38b70','#8fb7cf','#cd5c5c','#5c616b','#40e0d0',
- '#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
- '#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
- tooltip : {
- trigger: 'axis',
- formatter: "{b} <br/>{a}:{c} 位<br/>{a1}:{c1} 条"
- },
- legend: {
- data:['添加客户数','添加客户记录数']
- },
- toolbox: {
- show : true,
- feature : {
- magicType : {show: true, type: ['line', 'bar']}
- }
- },
- calculable : true,
- xAxis : [
- {
- type : 'category',
- boundaryGap : false,
- data : <?php echo $data['statisticsDay']; ?>
- }
- ],
- yAxis : [
- { color:'#000',
- type : 'value',
- axisLabel : {
- formatter: '{value}'
- },
- itemStyle: {
- normal: {
- lineStyle: {
- color:'#000000'
- }
- }
- },
- splitArea : {show : true}
- }
- ],
- series : [
- {
- name:'添加客户数',
- type:'line',
- data:<?php echo $data['statisticsClient']; ?>,
- markPoint : {
- data : [
- {type : 'max', name: '最大值'},
- {type : 'min', name: '最小值'}
- ]
- },
- },
- {
- name:'添加客户记录数',
- type:'line',
- data:<?php echo $data['statisticsLongle']; ?>,
- markPoint : {
- data : [
- {type : 'max', name: '最大值'},
- {type : 'min', name: '最小值'}
- ]
- },
- },
- ]
- };
-
- // 为echarts对象加载数据
- myChart.setOption(option);
- //1 最近30天客户数量与记录趋势//
- //2 最近30天客户数量地域//
- // 基于准备好的dom,初始化echarts图表
- var myChart = ec.init(document.getElementById('chartContainer2'));
- var option = {
- color:['#e9af68','#57b7b6','#e4575a','#959eac','#ffa500',
- '#d38b70','#8fb7cf','#cd5c5c','#5c616b','#40e0d0',
- '#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
- '#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
- title : {
- text: '最近30天客户分布',
- textAlign:"left",
- textStyle:{
- fontSize: 12,
- color:"#666",
- fontWeight:"normal"
- }
- },
- tooltip : {
- trigger: 'item',
- formatter: "{a} <br/>{b} : {c} ({d}%)"
- },
- toolbox: {
- show : true,
- feature : {
- dataView : {show: true, readOnly:true},
- }
- },
- series : [
- {
- name:'客户所在地区',
- type:'pie',
- radius : '80%',
- center: ['50%', '50%'],
- data:<?php echo $data['statisticsCategory']; ?>
- }
- ]
- };
- // 为echarts对象加载数据
- myChart.setOption(option);
-
- //2 客户地区分布//
- //3 最近30天客户数量地域//
- // 基于准备好的dom,初始化echarts图表
- var myChart = ec.init(document.getElementById('chartContainer3'));
- var option = {
- title : {
- text: '最近30天单位分布',
- textAlign:"left",
- textStyle:{
- fontSize: 12,
- color:"#666",
- fontWeight:"normal"
- }
- },
- tooltip : {
- trigger: 'item',
- formatter: "{a} <br/>{b} : {c} ({d}%)"
- },
- toolbox: {
- show : true,
- feature : {
- dataView : {show: true, readOnly:true},
- }
- },
- calculable : false,
- series : [
- {
- name:'单位性质',
- type:'pie',
- selectedMode: 'single',
- radius :"40%",
- itemStyle : {
- normal : {
- label : {
- position : 'inner'
- },
- labelLine : {
- show : false
- }
- }
- },
- data:<?php echo $data['statisticsNature']; ?>
- },
- {
- name:'单位所在地区',
- type:'pie',
- radius : [90, 120],
- data:<?php echo $data['statisticsCompany']; ?>
- }
- ]
- };
- var ecConfig = require('echarts/config');
- myChart.on(ecConfig.EVENT.PIE_SELECTED, function (param){
- var selected = param.selected;
- var serie;
- var str = '当前选择: ';
- for (var idx in selected) {
- serie = option.series[idx];
- for (var i = 0, l = serie.data.length; i < l; i++) {
- if (selected[idx][i]) {
- str += '【系列' + idx + '】' + serie.name + ' : ' +
- '【数据' + i + '】' + serie.data[i].name + ' ';
- }
- }
- }
- document.getElementById('wrong-message').innerHTML = str;
- })
-
- // 为echarts对象加载数据
- myChart.setOption(option);
-
- //3 单位地区分布//
- }
- );
- </script>
- <body>
- <div class="mainLayout">
- <div class="mainMenu">
- <div class="menuItem">
- <a href="#" class="mLogo">CLD</a>
- <ul>
- <?php include Doo::conf()->SITE_PATH . Doo::conf()->PROTECTED_FOLDER . "viewc//menu.php"; ?>
- </ul>
- </div>
- </div>
- <div class="warpContent">
- <div class="infoCenter">
- <div class="centerPanel">
- <div class="bigAddup" data-placement="bottom" data-toggle="ctooltip" data-original-title="客户总数">客户:<?php echo $data['sum']; ?></div>
- <ul class="sortAddup" data-placement="right" data-toggle="ctooltip" data-original-title="创建客户数">
- <?php if( !empty($data['max']) ): ?>
- <li><span><?php echo $data['max']['0']['1']; ?>:</span><?php echo $data['max']['0']['0']; ?></li>
- <li><span><?php echo $data['max']['1']['1']; ?>:</span><?php echo $data['max']['1']['0']; ?></li>
- <li><span><?php echo $data['max']['2']['1']; ?>:</span><?php echo $data['max']['2']['0']; ?></li>
- <?php endif; ?>
- <dl class="hide sec use">
- <?php foreach($data['max2'] as $k1=>$v1): ?>
- <dd><span><?php echo $v1['1']; ?>:</span><?php echo $v1['0']; ?></dd>
- <?php endforeach; ?>
- </dl>
- </ul>
- <div class="bigAddup" data-placement="bottom" data-toggle="ctooltip" data-original-title="锁总数(使用率)">锁:<?php echo $data['Rsum']; ?>(<?php echo $data['Ssum']; ?>)</div>
- <ul class="sortAddup" data-placement="right" data-toggle="ctooltip" data-original-title="锁使用率">
- <li><span><?php echo $data['useL']['0']['1']; ?>:</span><?php echo $data['useL']['0']['0']; ?></li>
- <li><span><?php echo $data['useL']['1']['1']; ?>:</span><?php echo $data['useL']['1']['0']; ?></li>
- <li><span><?php echo $data['useL']['2']['1']; ?>:</span><?php echo $data['useL']['2']['0']; ?></li>
- <dl class="hide sec">
- <?php foreach($data['useL2'] as $k1=>$v1): ?>
- <dd><span><?php echo $v1['1']; ?>:</span><?php echo $v1['0']; ?></dd>
- <?php endforeach; ?>
- </dl>
- </ul>
- </div>
- <div class="centerRecord">
- <div class="sideBar">
- <div class="mostTab"></div>
- <div class="mostList autoHeightI1" data-placement="top" data-toggle="ctooltip" data-original-title="滚动条隐藏了,用鼠标滚轮下拉吧">
- <ul class="item">
- <li <?php if( empty($data['sid']) ): ?>class="now" <?php endif; ?> >
- <h2><a href='/logStatistics'>大家</a></h2>
- </li>
- <?php foreach($data['staffList'] as $k1=>$v1): ?>
- <li <?php if( $v1['sid']==$data['sid'] ): ?>class="now" <?php endif; ?>>
- <a href="/logStatistics?cid=<?php echo $v1['cid']; ?>&sid=<?php echo $v1['sid']; ?>"><div class="avtra"><img src="<?php echo $v1['avatar']; ?>_2.jpg"></div>
- <h2><?php echo $v1['username']; ?><p><?php echo $v1['category']; ?></p></h2>
- </a>
- </li>
- <?php endforeach; ?>
- </ul>
- </div>
- </div>
- <div class="dateRecord">
- <div class="dateTab"><a href="/logStatistics" class="now">统计</a><a href="/index?cid=<?php echo $data['cid']; ?>&sid=<?php echo $data['sid']; ?>">记录</a></div>
- <div class="dateList autoHeightI1">
- <div class="chartTab"><ul class="tButton"><li class="now">通信录</li><li><a href="/longleStatistics">锁</a></li></ul></div>
-
- <div class="warpCharts">
- <!--图表1-->
- <div id="chartContainer1" style="height: 300px; width: 100%;">
- </div>
- <!--图表1-->
- <div class="clearfix">
- <!--图表2-->
- <div class="fL" id="chartContainer2" style="height: 300px; width: 50%;">
- </div>
- <!--图表2-->
- <!--图表3-->
- <div class="fR" id="chartContainer3" style="height: 300px; width: 50%;">
- </div>
- <!--图表3-->
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
-
-
- <script type="text/javascript">autoFlashHeight();</script>
- </body>
|