indexStat.php 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298
  1. <?php include Doo::conf()->SITE_PATH . Doo::conf()->PROTECTED_FOLDER . "viewc//header.php"; ?>
  2. <script src="http://s1.bdstatic.com/r/www/cache/ecom/esl/1-6-10/esl.js"></script>
  3. <script type="text/javascript">
  4. // 路径配置
  5. require.config({
  6. paths:{
  7. 'echarts' : 'http://echarts.baidu.com/build/echarts'
  8. }
  9. });
  10. // 使用
  11. require(
  12. [
  13. 'echarts',
  14. 'echarts/chart/pie', // 使用柱状图就加载bar模块,按需加载
  15. 'echarts/chart/bar'
  16. ],
  17. function(ec) {
  18. //1 最近30天客户数量与记录趋势//
  19. // 基于准备好的dom,初始化echarts图表
  20. var myChart = ec.init(document.getElementById('chartContainer1'));
  21. var option = {
  22. color:['#e9af68','#57b7b6','#e4575a','#959eac','#ffa500',
  23. '#d38b70','#8fb7cf','#cd5c5c','#5c616b','#40e0d0',
  24. '#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
  25. '#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
  26. tooltip : {
  27. trigger: 'axis',
  28. formatter: "{b} <br/>{a}:{c} 位<br/>{a1}:{c1} 条"
  29. },
  30. legend: {
  31. data:['添加客户数','添加客户记录数']
  32. },
  33. toolbox: {
  34. show : true,
  35. feature : {
  36. magicType : {show: true, type: ['line', 'bar']}
  37. }
  38. },
  39. calculable : true,
  40. xAxis : [
  41. {
  42. type : 'category',
  43. boundaryGap : false,
  44. data : <?php echo $data['statisticsDay']; ?>
  45. }
  46. ],
  47. yAxis : [
  48. { color:'#000',
  49. type : 'value',
  50. axisLabel : {
  51. formatter: '{value}'
  52. },
  53. itemStyle: {
  54. normal: {
  55. lineStyle: {
  56. color:'#000000'
  57. }
  58. }
  59. },
  60. splitArea : {show : true}
  61. }
  62. ],
  63. series : [
  64. {
  65. name:'添加客户数',
  66. type:'line',
  67. data:<?php echo $data['statisticsClient']; ?>,
  68. markPoint : {
  69. data : [
  70. {type : 'max', name: '最大值'},
  71. {type : 'min', name: '最小值'}
  72. ]
  73. },
  74. },
  75. {
  76. name:'添加客户记录数',
  77. type:'line',
  78. data:<?php echo $data['statisticsLongle']; ?>,
  79. markPoint : {
  80. data : [
  81. {type : 'max', name: '最大值'},
  82. {type : 'min', name: '最小值'}
  83. ]
  84. },
  85. },
  86. ]
  87. };
  88. // 为echarts对象加载数据
  89. myChart.setOption(option);
  90. //1 最近30天客户数量与记录趋势//
  91. //2 最近30天客户数量地域//
  92. // 基于准备好的dom,初始化echarts图表
  93. var myChart = ec.init(document.getElementById('chartContainer2'));
  94. var option = {
  95. color:['#e9af68','#57b7b6','#e4575a','#959eac','#ffa500',
  96. '#d38b70','#8fb7cf','#cd5c5c','#5c616b','#40e0d0',
  97. '#1e90ff','#ff6347','#7b68ee','#00fa9a','#ffd700',
  98. '#6699FF','#ff6666','#3cb371','#b8860b','#30e0e0'],
  99. title : {
  100. text: '最近30天客户分布',
  101. textAlign:"left",
  102. textStyle:{
  103. fontSize: 12,
  104. color:"#666",
  105. fontWeight:"normal"
  106. }
  107. },
  108. tooltip : {
  109. trigger: 'item',
  110. formatter: "{a} <br/>{b} : {c} ({d}%)"
  111. },
  112. toolbox: {
  113. show : true,
  114. feature : {
  115. dataView : {show: true, readOnly:true},
  116. }
  117. },
  118. series : [
  119. {
  120. name:'客户所在地区',
  121. type:'pie',
  122. radius : '80%',
  123. center: ['50%', '50%'],
  124. data:<?php echo $data['statisticsCategory']; ?>
  125. }
  126. ]
  127. };
  128. // 为echarts对象加载数据
  129. myChart.setOption(option);
  130. //2 客户地区分布//
  131. //3 最近30天客户数量地域//
  132. // 基于准备好的dom,初始化echarts图表
  133. var myChart = ec.init(document.getElementById('chartContainer3'));
  134. var option = {
  135. title : {
  136. text: '最近30天单位分布',
  137. textAlign:"left",
  138. textStyle:{
  139. fontSize: 12,
  140. color:"#666",
  141. fontWeight:"normal"
  142. }
  143. },
  144. tooltip : {
  145. trigger: 'item',
  146. formatter: "{a} <br/>{b} : {c} ({d}%)"
  147. },
  148. toolbox: {
  149. show : true,
  150. feature : {
  151. dataView : {show: true, readOnly:true},
  152. }
  153. },
  154. calculable : false,
  155. series : [
  156. {
  157. name:'单位性质',
  158. type:'pie',
  159. selectedMode: 'single',
  160. radius :"40%",
  161. itemStyle : {
  162. normal : {
  163. label : {
  164. position : 'inner'
  165. },
  166. labelLine : {
  167. show : false
  168. }
  169. }
  170. },
  171. data:<?php echo $data['statisticsNature']; ?>
  172. },
  173. {
  174. name:'单位所在地区',
  175. type:'pie',
  176. radius : [90, 120],
  177. data:<?php echo $data['statisticsCompany']; ?>
  178. }
  179. ]
  180. };
  181. var ecConfig = require('echarts/config');
  182. myChart.on(ecConfig.EVENT.PIE_SELECTED, function (param){
  183. var selected = param.selected;
  184. var serie;
  185. var str = '当前选择: ';
  186. for (var idx in selected) {
  187. serie = option.series[idx];
  188. for (var i = 0, l = serie.data.length; i < l; i++) {
  189. if (selected[idx][i]) {
  190. str += '【系列' + idx + '】' + serie.name + ' : ' +
  191. '【数据' + i + '】' + serie.data[i].name + ' ';
  192. }
  193. }
  194. }
  195. document.getElementById('wrong-message').innerHTML = str;
  196. })
  197. // 为echarts对象加载数据
  198. myChart.setOption(option);
  199. //3 单位地区分布//
  200. }
  201. );
  202. </script>
  203. <body>
  204. <div class="mainLayout">
  205. <div class="mainMenu">
  206. <div class="menuItem">
  207. <a href="#" class="mLogo">CLD</a>
  208. <ul>
  209. <?php include Doo::conf()->SITE_PATH . Doo::conf()->PROTECTED_FOLDER . "viewc//menu.php"; ?>
  210. </ul>
  211. </div>
  212. </div>
  213. <div class="warpContent">
  214. <div class="infoCenter">
  215. <div class="centerPanel">
  216. <div class="bigAddup" data-placement="bottom" data-toggle="ctooltip" data-original-title="客户总数">客户:<?php echo $data['sum']; ?></div>
  217. <ul class="sortAddup" data-placement="right" data-toggle="ctooltip" data-original-title="创建客户数">
  218. <?php if( !empty($data['max']) ): ?>
  219. <li><span><?php echo $data['max']['0']['1']; ?>:</span><?php echo $data['max']['0']['0']; ?></li>
  220. <li><span><?php echo $data['max']['1']['1']; ?>:</span><?php echo $data['max']['1']['0']; ?></li>
  221. <li><span><?php echo $data['max']['2']['1']; ?>:</span><?php echo $data['max']['2']['0']; ?></li>
  222. <?php endif; ?>
  223. <dl class="hide sec use">
  224. <?php foreach($data['max2'] as $k1=>$v1): ?>
  225. <dd><span><?php echo $v1['1']; ?>:</span><?php echo $v1['0']; ?></dd>
  226. <?php endforeach; ?>
  227. </dl>
  228. </ul>
  229. <div class="bigAddup" data-placement="bottom" data-toggle="ctooltip" data-original-title="锁总数(使用率)">锁:<?php echo $data['Rsum']; ?>(<?php echo $data['Ssum']; ?>)</div>
  230. <ul class="sortAddup" data-placement="right" data-toggle="ctooltip" data-original-title="锁使用率">
  231. <li><span><?php echo $data['useL']['0']['1']; ?>:</span><?php echo $data['useL']['0']['0']; ?></li>
  232. <li><span><?php echo $data['useL']['1']['1']; ?>:</span><?php echo $data['useL']['1']['0']; ?></li>
  233. <li><span><?php echo $data['useL']['2']['1']; ?>:</span><?php echo $data['useL']['2']['0']; ?></li>
  234. <dl class="hide sec">
  235. <?php foreach($data['useL2'] as $k1=>$v1): ?>
  236. <dd><span><?php echo $v1['1']; ?>:</span><?php echo $v1['0']; ?></dd>
  237. <?php endforeach; ?>
  238. </dl>
  239. </ul>
  240. </div>
  241. <div class="centerRecord">
  242. <div class="sideBar">
  243. <div class="mostTab"></div>
  244. <div class="mostList autoHeightI1" data-placement="top" data-toggle="ctooltip" data-original-title="滚动条隐藏了,用鼠标滚轮下拉吧">
  245. <ul class="item">
  246. <li <?php if( empty($data['sid']) ): ?>class="now" <?php endif; ?> >
  247. <h2><a href='/logStatistics'>大家</a></h2>
  248. </li>
  249. <?php foreach($data['staffList'] as $k1=>$v1): ?>
  250. <li <?php if( $v1['sid']==$data['sid'] ): ?>class="now" <?php endif; ?>>
  251. <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>
  252. <h2><?php echo $v1['username']; ?><p><?php echo $v1['category']; ?></p></h2>
  253. </a>
  254. </li>
  255. <?php endforeach; ?>
  256. </ul>
  257. </div>
  258. </div>
  259. <div class="dateRecord">
  260. <div class="dateTab"><a href="/logStatistics" class="now">统计</a><a href="/index?cid=<?php echo $data['cid']; ?>&sid=<?php echo $data['sid']; ?>">记录</a></div>
  261. <div class="dateList autoHeightI1">
  262. <div class="chartTab"><ul class="tButton"><li class="now">通信录</li><li><a href="/longleStatistics">锁</a></li></ul></div>
  263. <div class="warpCharts">
  264. <!--图表1-->
  265. <div id="chartContainer1" style="height: 300px; width: 100%;">
  266. </div>
  267. <!--图表1-->
  268. <div class="clearfix">
  269. <!--图表2-->
  270. <div class="fL" id="chartContainer2" style="height: 300px; width: 50%;">
  271. </div>
  272. <!--图表2-->
  273. <!--图表3-->
  274. <div class="fR" id="chartContainer3" style="height: 300px; width: 50%;">
  275. </div>
  276. <!--图表3-->
  277. </div>
  278. </div>
  279. </div>
  280. </div>
  281. </div>
  282. </div>
  283. </div>
  284. </div>
  285. <script type="text/javascript">autoFlashHeight();</script>
  286. </body>