商丘12345 前端

Source-Census.html 33KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170
  1. <!doctype html>
  2. <html lang="en" class="feedback">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <title>数据统计</title>
  7. <link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
  8. <link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />
  9. <style>
  10. .mui-control-content {
  11. background-color: white;
  12. min-height: 215px;
  13. }
  14. .mui-control-content .mui-loading {
  15. margin-top: 50px;
  16. }
  17. .chart {
  18. height: 260px;
  19. margin: 0px;
  20. padding: 0px;
  21. }
  22. .mui-slider .mui-slider-group {
  23. height: 500px;
  24. }
  25. #CS {
  26. position: absolute;
  27. right: 0;
  28. height: 100%;
  29. padding: 0;
  30. padding-left: 5px;
  31. border: none;
  32. z-index: 30;
  33. width: 100%;
  34. }
  35. .mui-scroll {
  36. height: 100%;
  37. }
  38. #lineChart {
  39. position: absolute;
  40. top: 0;
  41. right: 0;
  42. bottom: 0;
  43. left: 0;
  44. padding: 10px;
  45. -webkit-box-sizing: border-box;
  46. box-sizing: border-box;
  47. }
  48. .mui-grid-bottom {
  49. height: 2px;
  50. background-color: #57cebf;
  51. display: block;
  52. width: 20px;
  53. margin: 0 auto;
  54. }
  55. </style>
  56. </head>
  57. <body>
  58. <header class="mui-bar mui-bar-nav">
  59. <h1 id="title" class="mui-title">来源报表</h1>
  60. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: #fff;"></a>
  61. </header>
  62. <div class="mui-content ">
  63. <form id='login-form' class="mui-input-group">
  64. <!--logo-->
  65. <div class="mui-input-row">
  66. <label>来源:</label>
  67. <select name="" class="mui-select">
  68. </select>
  69. </div>
  70. <div class="mui-input-row mui-password">
  71. <label>时间:</label>
  72. <!--<input id='password' type="datetime-local" class=" mui-input" >-->
  73. <input id='demo1' data-options='{}' type="text" class="mui-input-clear btn contact" />
  74. </div>
  75. </form>
  76. <div id="slider" class="mui-slider">
  77. <div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
  78. <a class="mui-control-item mui-active" href="#item1mobile" index="1">
  79. 日报
  80. </a>
  81. <a class="mui-control-item" href="#item2mobile" index="2">
  82. 周报
  83. </a>
  84. <a class="mui-control-item" href="#item3mobile" index="3">
  85. 月报
  86. </a>
  87. </div>
  88. <div class="mui-slider-group">
  89. <div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
  90. <div id="scroll1" class="mui-scroll-wrapper">
  91. <div class="mui-scroll">
  92. <div class="chart" id="pieChart"></div>
  93. <div>
  94. <ul class="mui-table-view mui-grid-view mui-grid-9">
  95. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  96. <a href="#">
  97. <span class="size-20" id="jsblrate"></span>
  98. <div class="mui-media-body size-14">即时办理率</div>
  99. </a>
  100. <span class="mui-grid-bottom"></span>
  101. </li>
  102. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  103. <a href="#">
  104. <span class="size-20" id="wlzbrate"></span>
  105. <div class="mui-media-body size-14">转办率</div>
  106. </a>
  107. <span class="mui-grid-bottom"></span>
  108. </li>
  109. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  110. <a href="#">
  111. <span class="size-20" id="zbbjrate"></span>
  112. <div class="mui-media-body size-14">转办办结率</div>
  113. </a>
  114. <span class="mui-grid-bottom"></span>
  115. </li>
  116. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  117. <a href="#">
  118. <span class="size-20" id="bjrate"></span>
  119. <div class="mui-media-body size-14">办结率</div>
  120. </a>
  121. <span class="mui-grid-bottom"></span>
  122. </li>
  123. </ul>
  124. </div>
  125. </div>
  126. </div>
  127. </div>
  128. <div id="item2mobile" class="mui-slider-item mui-control-content">
  129. <div id="scroll2" class="mui-scroll-wrapper">
  130. <div class="mui-scroll">
  131. <div class="chart" id="barChart"></div>
  132. <div>
  133. <ul class="mui-table-view mui-grid-view mui-grid-9">
  134. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  135. <a href="#">
  136. <span class="size-20" id="week-jsblrate"></span>
  137. <div class="mui-media-body size-14">即时办理率</div>
  138. </a>
  139. </li>
  140. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  141. <a href="#">
  142. <span class="size-20" id="week-wlzbrate"></span>
  143. <div class="mui-media-body size-14">转办率</div>
  144. </a>
  145. </li>
  146. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  147. <a href="#">
  148. <span class="size-20" id="week-zbbjrate"></span>
  149. <div class="mui-media-body size-14">转办办结率</div>
  150. </a>
  151. </li>
  152. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  153. <a href="#">
  154. <span class="size-20" id="week-bjrate"></span>
  155. <div class="mui-media-body size-14">办结率</div>
  156. </a>
  157. </li>
  158. </ul>
  159. </div>
  160. </div>
  161. </div>
  162. </div>
  163. <div id="item3mobile" class="mui-slider-item mui-control-content">
  164. <div id="scroll2" class="mui-scroll-wrapper">
  165. <div class="mui-scroll">
  166. <div class="chart" id="Chart">5555</div>
  167. <div>
  168. <ul class="mui-table-view mui-grid-view mui-grid-9">
  169. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  170. <a href="#">
  171. <span class="size-20" id="month-jsblrate"></span>
  172. <div class="mui-media-body size-14">即时办理率</div>
  173. </a>
  174. </li>
  175. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  176. <a href="#">
  177. <span class="size-20" id="month-wlzbrate"></span>
  178. <div class="mui-media-body size-14">转办率</div>
  179. </a>
  180. </li>
  181. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  182. <a href="#">
  183. <span class="size-20" id="month-zbbjrate"></span>
  184. <div class="mui-media-body size-14">转办办结率</div>
  185. </a>
  186. </li>
  187. <li class="mui-table-view-cell mui-media mui-col-xs-6 ">
  188. <a href="#">
  189. <span class="size-20" id="month-bjrate"></span>
  190. <div class="mui-media-body size-14">办结率</div>
  191. </a>
  192. </li>
  193. </ul>
  194. </div>
  195. </div>
  196. </div>
  197. </div>
  198. </div>
  199. </div>
  200. </div>
  201. <script src="../js/zepto.js"></script>
  202. <script src="../js/mui.min.js"></script>
  203. <script src="../js/echarts.common.min.js"></script>
  204. <script src="../js/huayi.config.js"></script>
  205. <script src="../js/mui.picker.min.js"></script>
  206. <script type="text/javascript">
  207. mui.init();
  208. window.onload = function() {
  209. mui('.mui-scroll-wrapper').scroll({
  210. deceleration: 0.0005 //flick 减速系数,系数越大,滚动速度越慢,滚动距离越小,默认值0.0006
  211. });
  212. }
  213. var goodslist;
  214. var index_=1;
  215. //本周图表
  216. var xAxis = [];
  217. var yAxis = [];
  218. var yAxiss = [];
  219. //本月
  220. var xAxis_math = [];
  221. var yAxis_math = [];
  222. var yAxiss_math = [];
  223. mui.plusReady(function() {
  224. var wv = plus.webview.currentWebview();
  225. var index = wv.index;
  226. plus.nativeUI.closeWaiting();
  227. //显示当前页面
  228. mui.currentWebview.show();
  229. //下拉框
  230. $.ajax({
  231. type: "get",
  232. url: huayi.config.callcenter_url + '/APP/GetDicValueList',
  233. async: false,
  234. dataType: 'json',
  235. data: {
  236. usercode: 8000,
  237. id:1
  238. },
  239. success: function(data) {
  240. console.log(data.state);
  241. if(data.state == "success") {
  242. goodslist = data.data;
  243. bindseat($(".mui-select"));
  244. }
  245. },
  246. error: function(data) {
  247. console.log(data.message);
  248. }
  249. });
  250. //下拉框
  251. function bindseat(obj) {
  252. obj.empty();
  253. obj.append('<option value="0" selected="true">所有来源</option>');
  254. $(goodslist).each(function(i, n) {
  255. obj.append('<option value="' + n.F_ValueId + '">' + n.F_Value + '</option>');
  256. })
  257. }
  258. //日期
  259. var dates = new Date();
  260. var time = dates.getFullYear() + "-" + (dates.getMonth() + 1) + '-' + dates.getDate();
  261. $("#demo1").val(time);
  262. //时间选择
  263. var btns = mui('.btn');
  264. btns.each(function(i, btn) {  
  265. btn.addEventListener('tap', function() {   
  266. var dtPicker = new mui.DtPicker({    
  267. type: "date", //设置日历初始视图模式
  268.   
  269. });  
  270. dtPicker.show(function(e) {
  271. $("#demo1").val(e);
  272. AreaL();//日报
  273. AreaLs();//周报
  274. }); 
  275. }, false);
  276. })
  277. AreaL();
  278. $(".mui-select").on('change', function() {
  279. console.log($('.mui-select').val());
  280. AreaL();//日报
  281. AreaLs();//周报
  282. Month();//月报
  283. })
  284. //日报的数据
  285. function AreaL() {
  286. console.log($('.mui-select').val());
  287. $.ajax({
  288. type: "get",
  289. url: huayi.config.callcenter_url + '/app/GetAPPWorkReportSingle',
  290. async: true,
  291. dataType: 'json',
  292. data: {
  293. usercode: 8000,
  294. datetype: index_,
  295. date: $("#demo1").val(),
  296. datatype:index,
  297. dataid: $('.mui-select').val()
  298. },
  299. success: function(data) {
  300. if(data.state == "success") {
  301. var Data = data.data.APPDayWeekMonthReportSingle[0];
  302. $("#bjrate").text(Data.bjrate)
  303. $("#jsblrate").text(Data.jsblrate);
  304. $("#wlzbrate").text(Data.wlzbrate);
  305. $("#zbbjrate").text(Data.zbbjrate);
  306. var option = {
  307. tooltip: {
  308. formatter: "{b} : {c} ({d}%)"
  309. },
  310. legend: {
  311. orient: 'vertical',
  312. top: 'middle',
  313. x: 'top',
  314. left: 10,
  315. top: 3,
  316. data: ['即时办结', '网络转办', '转办办结']
  317. },
  318. series: [{
  319. type: 'pie',
  320. radius: '55%',
  321. selectedMode: 'single',
  322. center: ['50%', '60%'],
  323. label: {
  324. normal: {
  325. formatter: "{b} : {c} ",
  326. }
  327. },
  328. labelLine: {
  329. normal: {
  330. show: false
  331. }
  332. },
  333. data: [{
  334. value: data.data.APPDayWeekMonthReportSingle[0].jsblcount,
  335. name: '即时办结',
  336. },
  337. {
  338. value: data.data.APPDayWeekMonthReportSingle[0].wlzbcount,
  339. name: '网络转办',
  340. },
  341. {
  342. value: data.data.APPDayWeekMonthReportSingle[0].zbbjcount,
  343. name: '转办办结',
  344. }
  345. ],
  346. }]
  347. };
  348. echartsPie = echarts.init(document.getElementById('pieChart'));
  349. echartsPie.setOption(option);
  350. }
  351. },
  352. error: function(data) {
  353. console.log(data.message);
  354. }
  355. });
  356. }
  357. AreaLs();
  358. Month();
  359. //周报
  360. function AreaLs() {
  361. console.log($('.mui-select').val());
  362. $.ajax({
  363. type: "get",
  364. url: huayi.config.callcenter_url + '/app/GetAPPWorkReportSingle',
  365. async: true,
  366. dataType: 'json',
  367. data: {
  368. usercode: 8000,
  369. datetype: 2,
  370. date: $("#demo1").val(),
  371. datatype:index,
  372. dataid: $('.mui-select').val()
  373. },
  374. success: function(data) {
  375. if(data.state == "success") {
  376. var Data = data.data.APPDayWeekMonthReportSingle[0];
  377. $("#week-bjrate").text(Data.bjrate)
  378. $("#week-jsblrate").text(Data.jsblrate);
  379. $("#week-wlzbrate").text(Data.wlzbrate);
  380. $("#week-zbbjrate").text(Data.zbbjrate);
  381. var option = {
  382. tooltip: {
  383. formatter: "{b} : {c} ({d}%)"
  384. },
  385. legend: {
  386. orient: 'vertical',
  387. top: 'middle',
  388. x: 'left',
  389. left: 5,
  390. top: 5,
  391. data: ['即时办结', '网络转办', '转办办结']
  392. },
  393. series: [{
  394. type: 'pie',
  395. radius: '55%',
  396. selectedMode: 'single',
  397. center: ['50%', '60%'],
  398. label: {
  399. normal: {
  400. formatter: "{a} {b} : {c} ",
  401. }
  402. },
  403. labelLine: {
  404. normal: {
  405. show: false
  406. }
  407. },
  408. data: [{
  409. value: data.data.APPDayWeekMonthReportSingle[0].jsblcount,
  410. name: '即时办结',
  411. },
  412. {
  413. value: data.data.APPDayWeekMonthReportSingle[0].wlzbcount,
  414. name: '网络转办',
  415. },
  416. {
  417. value: data.data.APPDayWeekMonthReportSingle[0].zbbjcount,
  418. name: '转办办结',
  419. }
  420. ],
  421. }]
  422. };
  423. echartsPie = echarts.init(document.getElementById('barChart'));
  424. echartsPie.setOption(option);
  425. }
  426. },
  427. error: function(data) {
  428. console.log(data.message);
  429. }
  430. });
  431. }
  432. //月报
  433. function Month(){
  434. console.log($('.mui-select').val());
  435. $.ajax({
  436. type: "get",
  437. url: huayi.config.callcenter_url + '/app/GetAPPWorkReportSingle',
  438. async: true,
  439. dataType: 'json',
  440. data: {
  441. usercode: 8000,
  442. datetype: 3,
  443. date: $("#demo1").val(),
  444. datatype:index,
  445. dataid: $('.mui-select').val()
  446. },
  447. success: function(data) {
  448. if(data.state == "success") {
  449. var Data = data.data.APPDayWeekMonthReportSingle[0];
  450. $("#month-bjrate").text(Data.bjrate)
  451. $("#month-jsblrate").text(Data.jsblrate);
  452. $("#month-wlzbrate").text(Data.wlzbrate);
  453. $("#month-zbbjrate").text(Data.zbbjrate);
  454. var option = {
  455. tooltip: {
  456. formatter: "{a} <br/>{b} : {c} ({d}%)"
  457. },
  458. legend: {
  459. orient: 'vertical',
  460. x: 'left',
  461. left: 5,
  462. top: 5,
  463. data: ['即时办结', '网络转办', '转办办结']
  464. },
  465. series: [{
  466. type: 'pie',
  467. radius: '55%',
  468. selectedMode: 'single',
  469. center: ['50%', '60%'],
  470. label: {
  471. normal: {
  472. formatter: "{a} {b} : {c} ",
  473. }
  474. },
  475. labelLine: {
  476. normal: {
  477. show: false
  478. }
  479. },
  480. data: [{
  481. value: data.data.APPDayWeekMonthReportSingle[0].jsblcount,
  482. name: '即时办结',
  483. },
  484. {
  485. value: data.data.APPDayWeekMonthReportSingle[0].wlzbcount,
  486. name: '网络转办',
  487. },
  488. {
  489. value: data.data.APPDayWeekMonthReportSingle[0].zbbjcount,
  490. name: '转办办结',
  491. }
  492. ],
  493. }]
  494. };
  495. echartsPie = echarts.init(document.getElementById('Chart'));
  496. echartsPie.setOption(option);
  497. }
  498. },
  499. error: function(data) {
  500. console.log(data.message);
  501. }
  502. });
  503. }
  504. //切换
  505. $(".mui-control-item").on('tap',function(){
  506. var indexs=$(this).attr('index');
  507. index_=indexs;
  508. AreaL();
  509. AreaLs();
  510. Month();
  511. })
  512. //本周
  513. // $.ajax({
  514. // type: "get",
  515. // url: huayi.config.callcenter_url + 'WorkOrder/GetWeekReport',
  516. // async: true,
  517. // dataType: 'json',
  518. // data: {
  519. // openid: 'oKOqcv31fh76rtNmJDjKc39oIsfA'
  520. // },
  521. // success: function(data) {
  522. // console.log(data.state);
  523. // if(data.state == "success") {
  524. // console.log(data.data[0].unfinish);
  525. // $("#Workfinish").text(data.data[7].finish);
  526. // $("#Workunfinifh").text(data.data[7].unfinish);
  527. // $("#WorkTotal").text(data.data[7].finish + data.data[0].unfinish);
  528. // for(var i = 0; i < data.data.length; i++) {
  529. // xAxis.push(data.data[i].ID);
  530. //
  531. // yAxis.push(data.data[i].unfinish);
  532. // yAxiss.push(data.data[i].finish)
  533. // }
  534. //
  535. // var option = {
  536. // grid: {
  537. // x: 35,
  538. // x2: 10,
  539. // y: 30,
  540. // y2: 25,
  541. // borderWidth: 0
  542. // },
  543. // toolbox: {
  544. // show: false,
  545. // feature: {
  546. // mark: {
  547. // show: true
  548. // },
  549. // dataView: {
  550. // show: true,
  551. // readOnly: false
  552. // },
  553. // magicType: {
  554. // show: true,
  555. // type: ['line', 'bar']
  556. // },
  557. // restore: {
  558. // show: true
  559. // },
  560. // saveAsImage: {
  561. // show: true
  562. // }
  563. // }
  564. // },
  565. // legend: {
  566. // top: 20,
  567. // data: ['已完成', '未完成', ]
  568. // },
  569. //
  570. // calculable: false,
  571. // xAxis: [{
  572. // axisLabel: {
  573. // interval: 0
  574. // },
  575. //
  576. // splitArea: {
  577. // show: false,
  578. // },
  579. // splitLine: {
  580. // show: false
  581. // }, //去除网格线
  582. // type: 'category',
  583. // data: xAxis
  584. // }],
  585. // yAxis: [{
  586. // show: false,
  587. // splitLine: {
  588. // show: false
  589. // }, //去除网格线
  590. // type: 'value',
  591. // splitArea: {
  592. // show: false,
  593. // }
  594. // }],
  595. // series: [{
  596. // name: '已完成',
  597. // type: 'bar',
  598. // barWidth: 10, //柱图宽度
  599. // itemStyle: {
  600. // normal: {
  601. // label: {
  602. // show: true
  603. // }
  604. // }
  605. // },
  606. // data: yAxis
  607. // }, {
  608. // name: '未完成',
  609. // type: 'bar',
  610. // barWidth: 10, //柱图宽度
  611. // itemStyle: {
  612. // normal: {
  613. // label: {
  614. // show: true
  615. // }
  616. // }
  617. // },
  618. // data: yAxiss
  619. // }]
  620. // };
  621. // echartsPie = echarts.init(document.getElementById('barChart'));
  622. // echartsPie.setOption(option);
  623. // }
  624. //
  625. // },
  626. // error: function(data) {
  627. // console.log(data.message);
  628. // }
  629. // });
  630. //本月
  631. // $.ajax({
  632. // type: "get",
  633. // url: huayi.config.callcenter_url + 'WorkOrder/GetMonthReport',
  634. // async: true,
  635. // dataType: 'json',
  636. // data: {
  637. // openid: 'oKOqcv31fh76rtNmJDjKc39oIsfA'
  638. // },
  639. // success: function(data) {
  640. // console.log(data.state);
  641. // if(data.state == "success") {
  642. // console.log(data.data[0].unfinish);
  643. // $("#Workfinish").text(data.data[7].finish);
  644. // $("#Workunfinifh").text(data.data[7].unfinish);
  645. // $("#WorkTotal").text(data.data[7].finish + data.data[0].unfinish);
  646. // for(var i = 0; i < data.data.length; i++) {
  647. // xAxis_math.push(data.data[i].ID);
  648. //
  649. // yAxis_math.push(data.data[i].unfinish);
  650. // yAxiss_math.push(data.data[i].finish)
  651. // }
  652. //
  653. // // var option = {
  654. // // grid: {
  655. // // x: 35,
  656. // // x2: 10,
  657. // // y: 30,
  658. // // y2: 50,
  659. // // borderWidth: 0
  660. // // },
  661. // // toolbox: {
  662. // // show: false,
  663. // // feature: {
  664. // // mark: {
  665. // // show: true
  666. // // },
  667. // // dataView: {
  668. // // show: true,
  669. // // readOnly: false
  670. // // },
  671. // // magicType: {
  672. // // show: true,
  673. // // type: ['line', 'bar']
  674. // // },
  675. // // restore: {
  676. // // show: true
  677. // // },
  678. // // saveAsImage: {
  679. // // show: true
  680. // // }
  681. // // }
  682. // // },
  683. // // legend: {
  684. // //
  685. // // data: ['已完成', '未完成', ]
  686. // // },
  687. // //
  688. // // calculable: false,
  689. // // xAxis: [{
  690. // // axisLabel: {
  691. // // interval: 10
  692. // // },
  693. // // axisLabel: {
  694. // // rotate: 45, //字体倾斜度数
  695. // // interval: 0, //interval 是指间隔多少个类别画栅格,为 0 时则每个数据都画,为 1 时间隔 1 个画,以此类推
  696. // // textStyle: {
  697. // // color: "red", //字体颜色
  698. // // fontSize: 10 //字体大小
  699. // // }
  700. // // },
  701. // // splitArea: {
  702. // // show: false,
  703. // // },
  704. // // splitLine: {
  705. // // show: false
  706. // // }, //去除网格线
  707. // // type: 'category',
  708. // // data:xAxis_math
  709. // // }],
  710. // // yAxis: [{
  711. // // show: false,
  712. // // splitLine: {
  713. // // show: false
  714. // // }, //去除网格线
  715. // // type: 'value',
  716. // // splitArea: {
  717. // // show: false,
  718. // // }
  719. // // }],
  720. // // series: [{
  721. // // name: '已完成',
  722. // // type: 'bar',
  723. // // barWidth: 10, //柱图宽度
  724. // // itemStyle: {
  725. // // normal: {
  726. // // label: {
  727. // // show: true
  728. // // }
  729. // // }
  730. // // },
  731. // // data: yAxis_math,
  732. // //
  733. // // },
  734. // // {
  735. // // name: '未完成',
  736. // // type: 'bar',
  737. // // barWidth: 5, //柱图宽度
  738. // // itemStyle: {
  739. // // normal: {
  740. // // label: {
  741. // // show: true
  742. // // }
  743. // // }
  744. // // },
  745. // // data: yAxiss_math,
  746. // //
  747. // // }
  748. // // ]
  749. // // };
  750. //
  751. // var option = {
  752. // tooltip: {
  753. // trigger: 'axis',
  754. // axisPointer: {
  755. // type: 'shadow'
  756. // }
  757. // },
  758. // legend: {
  759. // data: ['未完成', '已完成']
  760. // },
  761. // grid: {
  762. // left: '3%',
  763. // right: '4%',
  764. // bottom: '3%',
  765. // containLabel: true
  766. // },
  767. // xAxis: {
  768. // type: 'value',
  769. // boundaryGap: [0, 0.01]
  770. // },
  771. // yAxis: {
  772. // type: 'category',
  773. // data: xAxis_math
  774. // },
  775. // series: [{
  776. // name: '未完成',
  777. // type: 'bar',
  778. // barWidth: 10,
  779. // data: yAxis_math
  780. // },
  781. // {
  782. // name: '已完成',
  783. // type: 'bar',
  784. // barWidth: 10,
  785. // data: yAxiss_math
  786. // }
  787. // ]
  788. // };
  789. // echartsPie = echarts.init(document.getElementById('lineChart'));
  790. // echartsPie.setOption(option);
  791. // }
  792. //
  793. // },
  794. // error: function(data) {
  795. // console.log(data.message);
  796. // }
  797. // });
  798. ///全部
  799. // $.ajax({
  800. // type: "get",
  801. // url: huayi.config.callcenter_url + 'WorkOrder/GetTotalReport',
  802. // async: true,
  803. // dataType: 'json',
  804. // data: {
  805. // openid: 'oKOqcv31fh76rtNmJDjKc39oIsfA'
  806. // },
  807. // success: function(data) {
  808. // console.log(data.state);
  809. // if(data.state == "success") {
  810. // console.log(data.data[0].unfinish);
  811. // $("#finish").text(data.data[0].finish);
  812. // $("#unfinifh").text(data.data[0].unfinish);
  813. // $("#RTotal").text(data.data[0].finish + data.data[0].unfinish);
  814. // var option = {
  815. // tooltip: {
  816. // formatter: "{a} <br/>{b} : {c} ({d}%)"
  817. // },
  818. // legend: {
  819. // orient: 'vertical',
  820. // // top: 'middle',
  821. //
  822. // x: 'left',
  823. // left: 25,
  824. // top: 80,
  825. // data: ['未完成', '已完成']
  826. // },
  827. // series: [{
  828. // type: 'pie',
  829. // radius: '65%',
  830. // center: ['50%', '50%'],
  831. // selectedMode: 'single',
  832. // data: [
  833. //
  834. // {
  835. // value: data.data[0].unfinish,
  836. // name: '未完成',
  837. // label: {
  838. // normal: {
  839. // formatter: "{b}: {c} ({d}%)"
  840. // }
  841. // }
  842. // },
  843. // {
  844. // value: data.data[0].finish,
  845. // name: '已完成',
  846. // label: {
  847. // normal: {
  848. // formatter: "{b}: {c} ({d}%)"
  849. // }
  850. // }
  851. // }
  852. //
  853. // ],
  854. // itemStyle: {
  855. // emphasis: {
  856. // shadowBlur: 10,
  857. // shadowOffsetX: 0,
  858. // shadowColor: 'rgba(0, 0, 0, 0.5)'
  859. // }
  860. // }
  861. // }]
  862. // };
  863. //
  864. // echartsPie = echarts.init(document.getElementById('lineCharts'));
  865. // echartsPie.setOption(option);
  866. // }
  867. //
  868. // },
  869. // error: function(data) {
  870. // console.log(data.message);
  871. // }
  872. // });
  873. //分类
  874. // $.ajax({
  875. // type: "get",
  876. // url: huayi.config.callcenter_url + 'WorkOrder/GetReportByFL',
  877. // async: true,
  878. // dataType: 'json',
  879. // data: {
  880. // openid: 'oKOqcv31fh76rtNmJDjKc39oIsfA'
  881. // },
  882. // success: function(data) {
  883. // console.log(data.state);
  884. // if(data.state == "success") {
  885. // console.log(data.data[0].unfinish);
  886. // var xAxis_fl = [];
  887. // var yAxis_ = [];
  888. // var yAxiss_ = [];
  889. // // $("#Workfinish").text(data.data[7].finish);
  890. // // $("#Workunfinifh").text(data.data[7].unfinish);
  891. // // $("#WorkTotal").text(data.data[7].finish + data.data[0].unfinish);
  892. // for(var i = 0; i < data.data.length; i++) {
  893. // xAxis_fl.push(data.data[i].fl);
  894. // yAxis_.push(data.data[i].unfinish);
  895. // yAxiss_.push(data.data[i].finish)
  896. // }
  897. // console.log(yAxis_);
  898. // var option = {
  899. // grid: {
  900. // x: 35,
  901. // x2: 10,
  902. // y: 30,
  903. // y2: 50,
  904. // borderWidth: 0
  905. // },
  906. // toolbox: {
  907. // show: false,
  908. // feature: {
  909. // mark: {
  910. // show: true
  911. // },
  912. // dataView: {
  913. // show: true,
  914. // readOnly: false
  915. // },
  916. // magicType: {
  917. // show: true,
  918. // type: ['line', 'bar']
  919. // },
  920. // restore: {
  921. // show: true
  922. // },
  923. // saveAsImage: {
  924. // show: true
  925. // }
  926. // }
  927. // },
  928. // legend: {
  929. // top: 20,
  930. // data: ['已完成', '未完成', ]
  931. // },
  932. //
  933. // calculable: false,
  934. // xAxis: [{
  935. // axisLabel: {
  936. // interval: 0
  937. // },
  938. // axisLabel: {
  939. // rotate: 40, //字体倾斜度数
  940. // interval: 0, //interval 是指间隔多少个类别画栅格,为 0 时则每个数据都画,为 1 时间隔 1 个画,以此类推
  941. // textStyle: {
  942. // color: "red", //字体颜色
  943. // fontSize: 10 //字体大小
  944. // }
  945. // },
  946. // splitArea: {
  947. // show: false,
  948. // },
  949. // splitLine: {
  950. // show: false
  951. // }, //去除网格线
  952. // type: 'category',
  953. // data: xAxis_fl
  954. // }],
  955. // yAxis: [{
  956. // show: false,
  957. // splitLine: {
  958. // show: false
  959. // }, //去除网格线
  960. // type: 'value',
  961. // splitArea: {
  962. // show: false,
  963. // }
  964. // }],
  965. // series: [{
  966. // name: '已完成',
  967. // type: 'bar',
  968. // barWidth: 10, //柱图宽度
  969. // itemStyle: {
  970. // normal: {
  971. // label: {
  972. // show: true
  973. // }
  974. // }
  975. // },
  976. // data: yAxiss_
  977. // }, {
  978. // name: '未完成',
  979. // type: 'bar',
  980. // barWidth: 10, //柱图宽度
  981. // itemStyle: {
  982. // normal: {
  983. // label: {
  984. // show: true
  985. // }
  986. // }
  987. // },
  988. // data: yAxis_
  989. // }]
  990. // };
  991. // echartsPie = echarts.init(document.getElementById('bar-Chart'));
  992. // echartsPie.setOption(option);
  993. // }
  994. //
  995. // },
  996. // error: function(data) {
  997. // console.log(data.message);
  998. // }
  999. // });
  1000. //部门
  1001. // $.ajax({
  1002. // type: "get",
  1003. // url: huayi.config.callcenter_url + 'WorkOrder/GetReportByDept',
  1004. // async: true,
  1005. // dataType: 'json',
  1006. // data: {
  1007. // openid: 'oKOqcv31fh76rtNmJDjKc39oIsfA'
  1008. // },
  1009. // success: function(data) {
  1010. // console.log(data.state);
  1011. // if(data.state == "success") {
  1012. // console.log(data.data[0].unfinish);
  1013. // var xAxis_fl = [];
  1014. // var yAxis_ = [];
  1015. // var yAxiss_ = [];
  1016. // // $("#Workfinish").text(data.data[7].finish);
  1017. // // $("#Workunfinifh").text(data.data[7].unfinish);
  1018. // // $("#WorkTotal").text(data.data[7].finish + data.data[0].unfinish);
  1019. // for(var i = 0; i < data.data.length; i++) {
  1020. // xAxis_fl.push(data.data[i].dept);
  1021. // yAxis_.push(data.data[i].unfinish);
  1022. // yAxiss_.push(data.data[i].finish)
  1023. // }
  1024. //
  1025. // var option = {
  1026. // grid: {
  1027. // x: 35,
  1028. // x2: 10,
  1029. // y: 30,
  1030. // y2: 50,
  1031. // borderWidth: 0
  1032. // },
  1033. // toolbox: {
  1034. // show: false,
  1035. // feature: {
  1036. // mark: {
  1037. // show: true
  1038. // },
  1039. // dataView: {
  1040. // show: true,
  1041. // readOnly: false
  1042. // },
  1043. // magicType: {
  1044. // show: true,
  1045. // type: ['line', 'bar']
  1046. // },
  1047. // restore: {
  1048. // show: true
  1049. // },
  1050. // saveAsImage: {
  1051. // show: true
  1052. // }
  1053. // }
  1054. // },
  1055. // legend: {
  1056. // top: 20,
  1057. // data: ['已完成', '未完成', ]
  1058. // },
  1059. //
  1060. // calculable: false,
  1061. // xAxis: [{
  1062. // axisLabel: {
  1063. // interval: 0
  1064. // },
  1065. // axisLabel: {
  1066. // rotate: 40, //字体倾斜度数
  1067. // interval: 0, //interval 是指间隔多少个类别画栅格,为 0 时则每个数据都画,为 1 时间隔 1 个画,以此类推
  1068. // textStyle: {
  1069. // color: "red", //字体颜色
  1070. // fontSize: 10 //字体大小
  1071. // }
  1072. // },
  1073. // splitArea: {
  1074. // show: false,
  1075. // },
  1076. // splitLine: {
  1077. // show: false
  1078. // }, //去除网格线
  1079. // type: 'category',
  1080. // data: xAxis_fl
  1081. // }],
  1082. // yAxis: [{
  1083. // show: false,
  1084. // splitLine: {
  1085. // show: false
  1086. // }, //去除网格线
  1087. // type: 'value',
  1088. // splitArea: {
  1089. // show: false,
  1090. // }
  1091. // }],
  1092. // series: [{
  1093. // name: '已完成',
  1094. // type: 'bar',
  1095. // barWidth: 10, //柱图宽度
  1096. // itemStyle: {
  1097. // normal: {
  1098. // label: {
  1099. // show: true
  1100. // }
  1101. // }
  1102. // },
  1103. // data: yAxis_
  1104. // }, {
  1105. // name: '未完成',
  1106. // type: 'bar',
  1107. // barWidth: 10, //柱图宽度
  1108. // itemStyle: {
  1109. // normal: {
  1110. // label: {
  1111. // show: true
  1112. // }
  1113. // }
  1114. // },
  1115. // data: yAxiss_
  1116. // }]
  1117. // };
  1118. // echartsPie = echarts.init(document.getElementById('bar-Chart2'));
  1119. // echartsPie.setOption(option);
  1120. // }
  1121. //
  1122. // },
  1123. // error: function(data) {
  1124. // console.log(data.message);
  1125. // }
  1126. // });
  1127. //获取区域
  1128. });
  1129. </script>
  1130. </body>
  1131. </html>