地铁二期项目正式开始

CallTimeMath.js 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283
  1. layui.use('element', function () {
  2. var $ = layui.jquery
  3. , element = layui.element; //Tab的切换功能,切换事件监听等,需要依赖element模块
  4. $('.site-demo-active').on('click', function () {
  5. var othis = $(this), type = othis.data('type');
  6. active[type] ? active[type].call(this, othis) : '';
  7. });
  8. //Hash地址的定位
  9. var layid = location.hash.replace(/^#test=/, '');
  10. element.tabChange('test', layid);
  11. element.on('tab(test)', function (elem) {
  12. location.hash = 'test=' + $(this).attr('lay-id');
  13. });
  14. });
  15. layui.use('laydate', function () {
  16. var laydate = layui.laydate;
  17. //日期时间范围
  18. laydate.render({
  19. elem: '#test10'
  20. // , type: 'datetime'
  21. , range: true
  22. });
  23. });
  24. layui.use(['table', 'jquery'], function () {
  25. var table = layui.table;
  26. var form = layui.form,
  27. layer = parent.layer === undefined ? layui.layer : parent.layer,
  28. $ = layui.jquery;
  29. //监听表格复选框选择
  30. table.on('checkbox(demo)', function (obj) {
  31. console.log(obj)
  32. });
  33. $ = layui.$, active = {
  34. //查询按钮
  35. reload: function () {
  36. Init();
  37. //执行重载
  38. table.reload('recordtable', {
  39. where: {
  40. dateParty: $("#test10").val()
  41. , NowDateTime: new Date()
  42. }
  43. });
  44. }
  45. //本周
  46. , oneWeek: function () {
  47. var thisDateParty = getWeekStartDate() + ' - ' + formatDate(now);
  48. $("#test10").val(thisDateParty);
  49. Init();
  50. //执行重载
  51. table.reload('recordtable', {
  52. where: {
  53. dateParty: thisDateParty
  54. , NowDateTime: new Date()
  55. }
  56. });
  57. }
  58. //本月
  59. , oneMonth: function () {
  60. var thisDateParty = getMonthStartDate() + ' - ' + formatDate(now);
  61. $("#test10").val(thisDateParty);
  62. Init();
  63. //执行重载
  64. table.reload('recordtable', {
  65. where: {
  66. dateParty: thisDateParty
  67. , NowDateTime: new Date()
  68. }
  69. });
  70. }
  71. //本年
  72. , oneYear: function () {
  73. var thisDateParty = getYearStartDate() + ' - ' + formatDate(now);
  74. $("#test10").val(thisDateParty);
  75. Init();
  76. //执行重载
  77. table.reload('recordtable', {
  78. where: {
  79. dateParty: thisDateParty
  80. , NowDateTime: new Date()
  81. }
  82. });
  83. }
  84. };
  85. $('.searchfilter .layui-btn').on('click', function () {
  86. var type = $(this).data('type');
  87. active[type] ? active[type].call(this) : '';
  88. });
  89. // 路径配置
  90. require.config({
  91. paths: {
  92. echarts: '/Content/dist'
  93. }
  94. });
  95. function Init() {
  96. var bottom, dataModel;
  97. $.ajax({
  98. url: "/Report/CallTimeMathChartData",
  99. type: "get",
  100. contentType: "application/json",
  101. dataType: "text",
  102. cache: false,
  103. data: {
  104. NowDateTime: new Date(), dateParty: $("#test10").val()
  105. },
  106. success: function (result, status) {
  107. if (status) {
  108. dataModel = JSON.parse(result);
  109. bottom = dataModel.bottom;
  110. // 使用
  111. require(
  112. [
  113. 'echarts',
  114. 'echarts/chart/bar' // 使用柱状图就加载bar模块,按需加载
  115. , 'echarts/chart/line' // 使用柱状图就加载bar模块,按需加载
  116. ],
  117. function (ec) {
  118. var dahuatheme
  119. require(['echarts/theme/dahua'], function (theme) {
  120. dahuatheme = theme;
  121. });
  122. // 基于准备好的dom,初始化echarts图表
  123. var myChart = ec.init(document.getElementById('divimagereport'), dahuatheme);
  124. option = {
  125. title: {
  126. show: false,
  127. text: '',
  128. subtext: ''
  129. },
  130. tooltip: {
  131. trigger: 'axis'
  132. },
  133. legend: {
  134. data: ['总通话次数', '接听电话次数', '呼出电话次数', '通话总时长', '平均通话时长']
  135. },
  136. toolbox: {
  137. show: true,
  138. feature: {
  139. dataView: { show: true, readOnly: false },
  140. magicType: { show: true, type: ['line', 'bar'] },
  141. restore: { show: true },
  142. saveAsImage: { show: true }
  143. }
  144. },
  145. calculable: true,
  146. xAxis: [
  147. {
  148. type: 'category',
  149. axisLabel: {
  150. interval: 0
  151. },
  152. data: eval(bottom)
  153. }
  154. ],
  155. yAxis: [
  156. {
  157. type: 'value'
  158. }
  159. ],
  160. series: [
  161. {
  162. name: '总通话次数',
  163. type: 'bar',
  164. data: eval(dataModel.d1),
  165. markPoint: {
  166. data: [
  167. { type: 'max', name: '最大值' },
  168. { type: 'min', name: '最小值' }
  169. ]
  170. },
  171. markLine: {
  172. data: [
  173. { type: 'average', name: '平均值' }
  174. ]
  175. }
  176. },
  177. {
  178. name: '接听电话次数',
  179. type: 'bar',
  180. data: eval(dataModel.d2),
  181. markPoint: {
  182. data: [
  183. { type: 'max', name: '最大值' },
  184. { type: 'min', name: '最小值' }
  185. ]
  186. },
  187. markLine: {
  188. data: [
  189. { type: 'average', name: '平均值' }
  190. ]
  191. }
  192. },
  193. {
  194. name: '呼出电话次数',
  195. type: 'bar',
  196. data: eval(dataModel.d3),
  197. markPoint: {
  198. data: [
  199. { type: 'max', name: '最大值' },
  200. { type: 'min', name: '最小值' }
  201. ]
  202. },
  203. markLine: {
  204. data: [
  205. { type: 'average', name: '平均值' }
  206. ]
  207. }
  208. },
  209. {
  210. name: '通话总时长',
  211. type: 'bar',
  212. data: eval(dataModel.d4),
  213. markPoint: {
  214. data: [
  215. { type: 'max', name: '最大值' },
  216. { type: 'min', name: '最小值' }
  217. ]
  218. },
  219. markLine: {
  220. data: [
  221. { type: 'average', name: '平均值' }
  222. ]
  223. }
  224. },
  225. {
  226. name: '平均通话时长',
  227. type: 'bar',
  228. data: eval(dataModel.d5),
  229. markPoint: {
  230. data: [
  231. { type: 'max', name: '最大值' },
  232. { type: 'min', name: '最小值' }
  233. ]
  234. },
  235. markLine: {
  236. data: [
  237. { type: 'average', name: '平均值' }
  238. ]
  239. }
  240. }
  241. ]
  242. };
  243. // 为echarts对象加载数据
  244. myChart.setOption(option);
  245. }
  246. );
  247. }
  248. }
  249. });
  250. }
  251. Init();
  252. });